hzd/h5
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

解决添加多个类别后点击单元格，表格出现偏移问题

Browse Source
This commit is contained in:
xiayuping666
2024-02-05 10:26:32 +08:00
parent 4fb4a10815
commit 59374abd86
1 changed files with 57 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/recipe/index.vue
+57 -53
View File
@@ -36,57 +36,60 @@
</el-option> </el-option>
</el-select> </el-select>
<el-button v-if="query.wId" @click="addSelectClass" type="primary" size="mini" >添加食谱类别</el-button> <el-button v-if="query.wId" @click="addSelectClass" type="primary" size="mini" >添加食谱类别</el-button>
<div v-for="item in allClass" style="width: 100%; margin-top: 20px;"> <div v-if="allClass.length">
<h4 style="line-height: 50px;">{{ item.tName }}</h4> <div v-for="item in allClass" style="width: 100%; margin-top: 20px;" :key="item.id">
<el-table <h4 style="line-height: 50px;">{{ item.tName }}</h4>
@cell-click="onClickCell" <el-table
:data="item.tableData" @cell-click="onClickCell"
:row-style="{ height: '50px' }" :data="item.tableData"
:key="item.id" :row-style="{ height: '50px' }"
border :key="item.id"
> border
<el-table-column label="周次"> >
<template slot-scope="scope"> <el-table-column label="周次">
{{ weekEnum[scope.row.name ]}} <template slot-scope="scope">
</template> {{ weekEnum[scope.row.name ]}}
</el-table-column> </template>
<el-table-column </el-table-column>
prop="brekker" <el-table-column
label="早餐"> prop="brekker"
<template slot-scope="scope"> label="早餐">
<span v-for=" item in scope.row.brekker" style="margin-right: 20px;">{{ item.name+ ' ' + item.num }}</span> <template slot-scope="scope">
</template> <span v-for=" item in scope.row.brekker" style="margin-right: 20px;">{{ item.name+ ' ' + item.num }}</span>
</el-table-column> </template>
<el-table-column </el-table-column>
prop="brekkerDessert" <el-table-column
label="早点"> prop="brekkerDessert"
<template slot-scope="scope"> label="早点">
<span v-for=" item in scope.row.brekkerDessert" style="margin-right: 20px;">{{ item.name+ ' ' + item.num }}</span> <template slot-scope="scope">
</template> <span v-for=" item in scope.row.brekkerDessert" style="margin-right: 20px;">{{ item.name+ ' ' + item.num }}</span>
</el-table-column> </template>
<el-table-column </el-table-column>
prop="lunch" <el-table-column
label="午餐"> prop="lunch"
<template slot-scope="scope"> label="午餐">
<span v-for=" item in scope.row.lunch" style="margin-right: 20px;">{{ item.name+ ' ' + item.num }}</span> <template slot-scope="scope">
</template> <span v-for=" item in scope.row.lunch" style="margin-right: 20px;">{{ item.name+ ' ' + item.num }}</span>
</el-table-column> </template>
<el-table-column </el-table-column>
prop="lunchDessert" <el-table-column
label="午点"> prop="lunchDessert"
<template slot-scope="scope"> label="午点">
<span v-for=" item in scope.row.lunchDessert" style="margin-right: 20px;">{{ item.name+ ' ' + item.num }}</span> <template slot-scope="scope">
</template> <span v-for=" item in scope.row.lunchDessert" style="margin-right: 20px;">{{ item.name+ ' ' + item.num }}</span>
</el-table-column> </template>
<el-table-column </el-table-column>
prop="supper" <el-table-column
label="晚餐"> prop="supper"
<template slot-scope="scope"> label="晚餐">
<span v-for=" item in scope.row.supper" style="margin-right: 20px;">{{ item.name+ ' ' + item.num }}</span> <template slot-scope="scope">
</template> <span v-for=" item in scope.row.supper" style="margin-right: 20px;">{{ item.name+ ' ' + item.num }}</span>
</el-table-column> </template>
</el-table> </el-table-column>
</div> </el-table>
</div>
</div>
</el-card> </el-card>
@@ -311,7 +314,6 @@ export default {
} }
this.defaultTable.push(obj) this.defaultTable.push(obj)
} }
this.tableData = this.defaultTable
}, },
watch: { watch: {
'query.wId'(newVal, oldVal) { 'query.wId'(newVal, oldVal) {
@@ -492,7 +494,8 @@ export default {
console.log(this.form) console.log(this.form)
let obj = { let obj = {
tName: this.form.tName, tName: this.form.tName,
wId: this.query.wId wId: this.query.wId,
contents: JSON.stringify(this.defaultTable)
} }
postMeal(obj).then(res =>{ postMeal(obj).then(res =>{
this.isRecipeModel = false this.isRecipeModel = false
@@ -522,6 +525,7 @@ export default {
// 班级列表 // 班级列表
recipeList(){ recipeList(){
getRecipe(this.query.wId).then(res =>{ getRecipe(this.query.wId).then(res =>{
this.allClass = []
this.allClass = res.data.map( item =>{ this.allClass = res.data.map( item =>{
if(item.contents){ if(item.contents){
let arr = JSON.parse(item.contents) let arr = JSON.parse(item.contents)