增加价格自动计算和格式化回显

This commit is contained in:
28353131@qq.com 2020-11-28 19:02:18 +08:00
parent d1a5c75da8
commit ba32570859

View File

@ -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 => {