增加价格自动计算和格式化回显
This commit is contained in:
parent
d1a5c75da8
commit
ba32570859
@ -31,7 +31,7 @@
|
|||||||
|
|
||||||
<el-table v-loading="loading" :data="weekMenuList"
|
<el-table v-loading="loading" :data="weekMenuList"
|
||||||
:span-method="objectSpanMethod"
|
:span-method="objectSpanMethod"
|
||||||
border="true"
|
:border="true"
|
||||||
@selection-change="handleSelectionChange">
|
@selection-change="handleSelectionChange">
|
||||||
<el-table-column type="selection" width="55" align="center"/>
|
<el-table-column type="selection" width="55" align="center"/>
|
||||||
<el-table-column label="id" align="center" prop="id" v-if="false"/>
|
<el-table-column label="id" align="center" prop="id" v-if="false"/>
|
||||||
@ -39,7 +39,9 @@
|
|||||||
<el-table-column label="类型" align="center" prop="dinnerType" width="80px"/>
|
<el-table-column label="类型" align="center" prop="dinnerType" width="80px"/>
|
||||||
<el-table-column label="菜品列表" align="center" prop="foods" width="500px">
|
<el-table-column label="菜品列表" align="center" prop="foods" width="500px">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-select v-model="scope.row.foods" multiple style="width: 400px">
|
<el-select v-model="scope.row.foods"
|
||||||
|
@change="changeFoods(scope.row)"
|
||||||
|
multiple style="width: 400px">
|
||||||
<el-option
|
<el-option
|
||||||
v-for="item in foodList"
|
v-for="item in foodList"
|
||||||
:key="item.foodId"
|
:key="item.foodId"
|
||||||
@ -52,9 +54,8 @@
|
|||||||
</el-select>
|
</el-select>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="总价格" align="center" prop="price" width="100px"/>
|
<el-table-column label="总价格" align="center" prop="price" width="100px" :formatter="formatPrice"/>
|
||||||
<el-table-column label="启用标志" align="center" prop="flag" width="180px"
|
<el-table-column label="启用标志" align="center" prop="flag" width="180px">
|
||||||
:formatter="formatStartFlag">
|
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-switch
|
<el-switch
|
||||||
v-model="scope.row.flag"
|
v-model="scope.row.flag"
|
||||||
@ -241,6 +242,22 @@
|
|||||||
this.getList();
|
this.getList();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
// 格式化总价的显示,加上“元”
|
||||||
|
formatPrice(row) {
|
||||||
|
return row.price + " 元";
|
||||||
|
},
|
||||||
|
// 根据菜单选择的变化,计算总价
|
||||||
|
changeFoods(row) {
|
||||||
|
console.log("row-->", row);
|
||||||
|
let ret = 0;
|
||||||
|
for(let i =0 ; i < row.foods.length; i++) {
|
||||||
|
ret += this.foodList[i].price;
|
||||||
|
}
|
||||||
|
this.weekMenuList[row.id -1 ].price = ret;
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
// 控制合并列
|
||||||
objectSpanMethod({row, column, rowIndex, columnIndex}) {
|
objectSpanMethod({row, column, rowIndex, columnIndex}) {
|
||||||
if (columnIndex === 1) {
|
if (columnIndex === 1) {
|
||||||
if (rowIndex % 3 === 0) {
|
if (rowIndex % 3 === 0) {
|
||||||
@ -257,25 +274,16 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
formatStartFlag(row) {
|
|
||||||
if (row.flag)
|
|
||||||
return "启用";
|
|
||||||
else
|
|
||||||
return "禁用";
|
|
||||||
},
|
|
||||||
/** 查询每周菜单列表 */
|
/** 查询每周菜单列表 */
|
||||||
getList() {
|
getList() {
|
||||||
this.loading = true;
|
this.loading = true;
|
||||||
listWeekMenu(this.queryParams).then(response => {
|
listWeekMenu(this.queryParams).then(response => {
|
||||||
this.weekMenuList = response.rows;
|
this.weekMenuList = response.rows;
|
||||||
this.total = response.total;
|
this.total = response.total;
|
||||||
console.log("before-->", this.weekMenuList);
|
|
||||||
for (let i = 0; i < this.weekMenuList.length; i++) {
|
for (let i = 0; i < this.weekMenuList.length; i++) {
|
||||||
if (this.weekMenuList[i].foods !== null)
|
if (this.weekMenuList[i].foods !== null)
|
||||||
this.weekMenuList[i].foods = this.weekMenuList[i].foods.split(',').map(Number);
|
this.weekMenuList[i].foods = this.weekMenuList[i].foods.split(',').map(Number);
|
||||||
|
|
||||||
}
|
}
|
||||||
console.log("after-->", this.weekMenuList);
|
|
||||||
this.loading = false;
|
this.loading = false;
|
||||||
});
|
});
|
||||||
listFood(this.queryParams).then(response => {
|
listFood(this.queryParams).then(response => {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user