测试问题修改厨余管理接口对接

src/api/kitchen/wasteManage.js

@@ -37,3 +37,29 @@ export function getKitchenWasteDealApi(data) {
     }
   })
 }
+
+// 新增厨房废弃物处置
+export function addKitchenWasteDealApi(data) {
+  return request({
+    url: '/smart-canteen/kitchen_waste_deal',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改厨房废弃物处置
+export function editKitchenWasteDealApi(data) {
+  return request({
+    url: '/smart-canteen/kitchen_waste_deal/edit',
+    method: 'post',
+    data: data
+  })
+}
+
+// 删除厨房废弃物处置
+export function delKitchenWasteDealApi(data) {
+  return request({
+    url: '/smart-canteen/kitchen_waste_deal/del/'+data.wasteIds,
+    method: 'post'
+  })
+}

src/views/kitchen/staffManage/staff/index.vue

@@ -211,7 +211,7 @@
                     </el-col>
                     <el-col :span="12">
                         <el-form-item label="人脸照片:" prop="faceUrl">
-                        <el-upload
+                            <el-upload
                                 :http-request="
                                     (obj) => imgUpLoad0(obj, 'fileUrl')
                                 "

src/views/kitchen/wasteManage/wasteDetails/index.vue

@@ -10,6 +10,20 @@
                 <el-option label="夜宵" value="5"></el-option>   
             </el-select>   
         </el-form-item>
+        <el-form-item label="日期">
+            <el-date-picker
+                v-model="dateRange"
+                type="datetimerange"
+                align="right"
+                unlink-panels
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                format="yyyy-MM-dd HH:mm:ss" style="width: 400px"
+                :default-time="['00:00:00', '23:59:59']"
+                :picker-options="pickerOptions" >
+            </el-date-picker>
+        </el-form-item> 
       <el-form-item>
         <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
@@ -86,6 +100,34 @@ export default {
         canteenName: undefined,
         areaNameStr: undefined, 
       },
+      dateRange:[],
+      pickerOptions: {
+          shortcuts: [{
+              text: '最近一周',
+              onClick(picker) {
+              const start = new Date();
+              const end = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 6);
+              picker.$emit('pick', [start, end]);
+              }
+          },{
+              text: '最近一个月',
+              onClick(picker) {
+              const start = new Date();
+              const end = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+              picker.$emit('pick', [start, end]);
+              }
+          },{
+              text: '最近三个月',
+              onClick(picker) {
+              const start = new Date();
+              const end = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 91);
+              picker.$emit('pick', [start, end]);
+              }
+          }]
+      },
       dialogVisible:false,//图片弹窗
       dialogImageUrl:"",//图片弹窗  
     };
@@ -101,6 +143,7 @@ export default {
       },
       /** 重置按钮操作 */
       resetQuery() { 
+          this.dateRange=[]
           this.resetForm("queryForm");
           this.handleQuery();
       },
@@ -112,6 +155,13 @@ export default {
             "pageNum": this.queryParams.pageNum, 
             "pageSize": this.queryParams.pageSize,  
           }
+          if(this.dateRange.length>0){
+              param.startDateTime = this.formatDateTime(this.dateRange[0])
+              param.endDateTime = this.formatDateTime(this.dateRange[1])
+          }else{
+              param.startDateTime = ""
+              param.endDateTime = ""
+          }
           getKitchenWasteListApi(param).then(response => {
               this.tableListData = response.rows;
               this.total = Number(response.total);
@@ -122,6 +172,27 @@ export default {
           this.dialogImageUrl = row.fileUrl;
           this.dialogVisible = true;
       },
+      //日期
+      formatDate(date) {
+          // 格式化为 YYYY-MM-DD
+          date = new Date(date)
+          const year = date.getFullYear();
+          const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始
+          const day = String(date.getDate()).padStart(2, '0');
+          return `${year}-${month}-${day}`;
+      },
+      //日期时间
+      formatDateTime(date) {
+          // 格式化为 YYYY-MM-DD
+          date = new Date(date)
+          const year = date.getFullYear();
+          const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始
+          const day = String(date.getDate()).padStart(2, '0');
+          const hours = date.getHours() < 10 ? '0' + date.getHours() : date.getHours()
+          const minutes = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()
+          const seconds = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()
+          return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
+      } 
       
   }
 };

src/views/kitchen/wasteManage/wasteGarbage/index.vue

@@ -10,6 +10,20 @@
                 <el-option label="夜宵" value="5"></el-option>   
             </el-select>   
         </el-form-item>
+        <el-form-item label="日期">
+            <el-date-picker
+                v-model="dateRange"
+                type="datetimerange"
+                align="right"
+                unlink-panels
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                format="yyyy-MM-dd HH:mm:ss" style="width: 400px"
+                :default-time="['00:00:00', '23:59:59']"
+                :picker-options="pickerOptions" >
+            </el-date-picker>
+        </el-form-item> 
       <el-form-item>
         <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
@@ -17,6 +31,15 @@
     </el-form>
 
     <el-row :gutter="10" class="mb8">  
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+        >新增</el-button>
+      </el-col>  
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
@@ -43,12 +66,27 @@
       <el-table-column label="售卖金额(元)" align="center" prop="saleAmount" :show-overflow-tooltip="true" />
       <el-table-column label="处置照片" align="center" prop="scenePicture" :show-overflow-tooltip="true" >
         <template slot-scope="scope"> 
-            <img :src="scope.row.scenePicture" v-if="scope.row.scenePicture" alt="" style="width: 80px;height: 40px;" @click="openImg(scope.row)">
+            <span v-if="scope.row.scenePicture" style="color: #46a6ff;" @click="openDetail(scope.row)" >查看</span>
-            <span v-else>无</span>
         </template>
       </el-table-column> 
       <el-table-column label="处置日期" align="center" prop="actionDate" :show-overflow-tooltip="true" width="150"/>
       <el-table-column label="创建时间" align="center" prop="createTime" :show-overflow-tooltip="true" width="150"/> 
+      <el-table-column label="操作" align="center" width="200" class-name="small-padding fixed-width">
+        <template slot-scope="scope">  
+            <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)" 
+            >编辑</el-button>
+            <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)" 
+            >删除</el-button>
+        </template>
+      </el-table-column>
     </el-table> 
     <pagination
       v-show="total>0"
@@ -57,16 +95,164 @@
       :limit.sync="queryParams.pageSize"
       @pagination="getList"
     />
+
+    <!-- 添加或修改参数配置对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="900px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="110px">
+        <el-row>
+            <!-- <el-col :span="24">
+                <div style="font-size: 18px;font-weight: bold;border-left: 4px solid #1890FF;padding-left: 4px;margin-bottom: 20px;">
+                    个人信息
+                </div>
+            </el-col> -->
+            <el-col :span="12">
+                <el-form-item label="处置日期:" prop="actionDate">
+                    <el-date-picker
+                          v-model="form.actionDate"
+                          type="date" align="right"  placeholder="请选择日期"
+                          format="yyyy-MM-dd" style="width: 100%;"
+                          @change="form.actionDate=formatDate(form.actionDate)">
+                      </el-date-picker>
+                </el-form-item>
+            </el-col>
+            <el-col :span="12">
+                <el-form-item label="处理人:" prop="staffId">
+                    <el-select
+                      v-model="form.staffId" 
+                      filterable remote
+                      reserve-keyword
+                      placeholder="请输入员工姓名，编号"
+                      :remote-method="remoteMethod"
+                      :loading="loading" style="width: 100%;">
+                      <el-option
+                        v-for="item in staffOptions"
+                        :key="item.staffId"
+                        :label="item.staffName"
+                        :value="item.staffId">
+                      </el-option>
+                    </el-select>
+                </el-form-item>
+            </el-col>
+            <el-col :span="12">
+                <el-form-item label="所属区域:" prop="areaId">
+                    <el-cascader v-model="form.areaId"
+                        :options="treeOptions" :filterable="true" placeholder="请选择所属区域" style="width: 100%;" :show-all-levels="false"
+                        :props="{ 
+                        emitPath: false,// 若设置 false，则只返回该节点的值，只返回最后选择的id
+                        checkStrictly: false,//来设置父子节点取消选中关联，从而达到选择任意一级选项的目的
+                        value:'id',label:'label'
+                        }" clearable @change="handleTreeChange">
+                    </el-cascader>
+                </el-form-item>
+            </el-col>
+            <el-col :span="12">
+                <el-form-item label="所属食堂:" prop="canteenId">
+                    <el-select v-model="form.canteenId" style="width: 100%;" placeholder="请选择所属食堂">
+                        <el-option
+                            v-for="item in canteenOptions"
+                            :key="item.canteenId"
+                            :label="item.canteenName"
+                            :value="item.canteenId" 
+                        ></el-option>
+                    </el-select>
+                </el-form-item>
+            </el-col>
+            <el-col :span="12">
+                <el-form-item label="所属餐次:" prop="mealtimeType">
+                    <el-select v-model="form.mealtimeType" style="width: 100%;" clearable placeholder="请选择所属餐次"> 
+                        <el-option label="早餐" value="1"></el-option>
+                        <el-option label="午餐" value="2"></el-option>   
+                        <el-option label="下午茶" value="3"></el-option>   
+                        <el-option label="晚餐" value="4"></el-option>   
+                        <el-option label="夜宵" value="5"></el-option>   
+                    </el-select>   
+                </el-form-item>
+            </el-col> 
+            <el-col :span="12">
+                <el-form-item label="废弃物名称:" prop="garbageName">
+                    <el-input v-model="form.garbageName"
+                        placeholder="请输入废弃物名称"
+                        maxlength="30"
+                    />
+                </el-form-item>
+            </el-col>
+            <el-col :span="12">
+                <el-form-item label="重量(Kg):" prop="weight">
+                    <el-input v-model="form.weight"
+                        placeholder="请输入重量"
+                        maxlength="10" @input="(v)=>(form.weight=v.replace(/[^\d]/g,''))"
+                    />
+                </el-form-item>
+            </el-col> 
+            <el-col :span="12">
+                <el-form-item label="处置方式:" prop="dealType">
+                    <el-select v-model="form.dealType" style="width: 100%;" clearable placeholder="请选择处置方式"> 
+                        <el-option label="丢弃" value="1"></el-option>
+                        <el-option label="下一餐使用" value="2"></el-option>   
+                        <el-option label="集中售卖" value="3"></el-option>    
+                    </el-select>   
+                </el-form-item>
+            </el-col>
+            <el-col :span="12">
+                <el-form-item label="售卖金额(元):" prop="saleAmount">
+                    <el-input v-model="form.saleAmount" placeholder="请输入售卖金额" maxlength="10" 
+                      @input="(v)=>(form.saleAmount=v.replace(/[^\d.]/g,''))"/>
+                </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item label="现场照片:" prop="scenePicture">
+                <el-upload
+                    :http-request="
+                        (obj) => imgUpLoad0(obj, 'fileUrl')
+                    "
+                    action="#"
+                    :limit="3"
+                    :file-list="fileList0"
+                    :show-file-list="true"
+                    list-type="picture-card"
+                    accept=".png, .jpg, .jpeg" 
+                    :class="{ disabled: uploadDisabled0 }"
+                    :before-upload="handleBeforeUpload"
+                    :on-preview="handlePictureCardPreview"
+                    :on-remove="handleRemove0"
+                >
+                    <i
+                        class="el-icon-plus avatar-uploader-icon"
+                    ></i>
+                </el-upload>
+                    
+              </el-form-item>
+            </el-col>
+        </el-row> 
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm" :disabled="loadingBtn">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog> 
+
     <el-dialog :visible.sync="dialogVisible" width="700px">
-        <img style="width: 100%;height: 100%;" :src="dialogImageUrl" alt="">
+        <img style="width: 100%;height: 700px;" :src="dialogImageUrl" alt="">
+    </el-dialog>
+    
+    <el-dialog title="查看图片" :visible.sync="open2" width="800px">
+      <div style="width: 100%;display: flex;">
+         <img v-for="(item,index) in rowData.scenePictureList" :key="index" style="width: 30%;height: 200px;" :src="item" alt="" @click="openImg(item)">
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="open2=false">确 定</el-button>
+        <el-button @click="open2=false">取 消</el-button>
+      </div>
     </el-dialog>
      
   </div>
 </template>
 
 <script> 
-import { getKitchenWasteDealApi } from "@/api/kitchen/wasteManage";
+import { systemAreaTreeApi,getCanteenByAreaApi } from "@/api/base/stall"; 
-
+import { getKitchenWasteDealApi,addKitchenWasteDealApi,editKitchenWasteDealApi,delKitchenWasteDealApi } from "@/api/kitchen/wasteManage";
+import { getStaffListApi } from '@/api/kitchen/staff';
+import { imgUpLoadTwo } from '@/api/system/upload';
 export default {
   name: "",
   dicts: [],
@@ -93,14 +279,112 @@ export default {
         canteenName: undefined,
         areaNameStr: undefined, 
       },
+      dateRange:[],
+      pickerOptions: {
+          shortcuts: [{
+              text: '最近一周',
+              onClick(picker) {
+              const start = new Date();
+              const end = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 6);
+              picker.$emit('pick', [start, end]);
+              }
+          },{
+              text: '最近一个月',
+              onClick(picker) {
+              const start = new Date();
+              const end = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+              picker.$emit('pick', [start, end]);
+              }
+          },{
+              text: '最近三个月',
+              onClick(picker) {
+              const start = new Date();
+              const end = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 91);
+              picker.$emit('pick', [start, end]);
+              }
+          }]
+      },
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      open2: false,
+      loadingBtn: false,
+      rowData: {},
+       // 表单参数
+      form: {},
+      treeOptions:[],
+      canteenOptions:[],
+      staffOptions:[],
+      // 表单校验
+      rules: {
+        actionDate: [
+            { required: true, message: "处置日期不能为空", trigger: "change" }
+        ],
+        staffId: [
+          { required: true, message: "处理人不能为空", trigger: "blur" }
+        ],
+        areaId: [
+            { required: true, message: "所属区域不能为空", trigger: "change" }
+        ],       
+        canteenId: [
+            { required: true, message: "所属食堂不能为空", trigger: "change" }
+        ],        
+        mealtimeType: [
+          { required: true, message: "所属餐次不能为空", trigger: "change" }
+        ],
+        garbageName: [
+          { required: true, message: "废弃物名称不能为空", trigger: "blur" }
+        ],
+        weight: [
+          { required: true, message: "重量不能为空", trigger: "blur" }
+        ],
+        dealType: [
+          { required: true, message: "处置方式不能为空", trigger: "change" }
+        ],
+        saleAmount: [
+          { required: true, message: "售卖金额不能为空", trigger: "blur" }
+        ],
+        scenePicture: [
+          { required: true, message: "现场图片不能为空", trigger: "change" }
+        ],
+      },
+      fileList0: [],//图片
+      checkUrlList0: [],//图片
       dialogVisible:false,//图片弹窗 
       dialogImageUrl:"",//图片弹窗  
     };
   },
   created() { 
+    this.getTreeData();
     this.getList();
   },
+  computed: {
+      //图片上传3张后，隐藏上传框
+      uploadDisabled0() {
+          return this.checkUrlList0.length > 2
+      },
+  },
   methods: { 
+      //区域树
+      getTreeData() {
+          systemAreaTreeApi({}).then((response) => {
+              this.treeOptions = response.data;
+          });
+      },
+      handleTreeChange(e){ 
+          let param= {
+              "areaId":e,
+              "canteenType":1
+          }
+          getCanteenByAreaApi(param).then((response) => {
+              this.canteenOptions=response.rows||[]
+              this.$set(this.form,'canteenId',null)
+          });
+      },
       /** 搜索按钮操作 */
       handleQuery() {
           this.queryParams.pageNum = 1;
@@ -108,6 +392,7 @@ export default {
       },
       /** 重置按钮操作 */
       resetQuery() { 
+          this.dateRange=[]
           this.resetForm("queryForm");
           this.handleQuery();
       },
@@ -119,16 +404,191 @@ export default {
             "pageNum": this.queryParams.pageNum, 
             "pageSize": this.queryParams.pageSize,  
           }
+          if(this.dateRange.length>0){
+              param.startDateTime = this.formatDateTime(this.dateRange[0])
+              param.endDateTime = this.formatDateTime(this.dateRange[1])
+          }else{
+              param.startDateTime = ""
+              param.endDateTime = ""
+          }
           getKitchenWasteDealApi(param).then(response => {
               this.tableListData = response.rows;
               this.total = Number(response.total);
               this.loading = false;
           });
       },
-      openImg(row) {
+      openDetail(row){
-        this.dialogImageUrl = row.scenePicture;
+        this.rowData = row
+        this.open2=true;
+      },
+      /** 新增按钮操作 */
+      handleAdd() {
+          this.reset();
+          this.open = true;
+          this.title = "新增";
+      },
+      /** 修改按钮操作 */
+      handleUpdate(row) {
+          this.reset(); 
+          this.form = Object.assign({}, row)
+          if(row.scenePicture){ 
+              row.scenePictureList.forEach(item=>{
+                  this.fileList0.push({name:item,url:item})
+                  this.checkUrlList0.push(item)
+              })  
+          }else{
+              this.fileList0=[]
+              this.checkUrlList0=[]
+          } 
+          this.open = true;
+          this.title = "修改"; 
+      },
+      // 取消按钮
+      cancel() {
+          this.open = false;
+          this.reset();
+      },
+      // 表单重置
+      reset() {
+          this.fileList0=[]
+          this.checkUrlList0=[]
+          this.form = {};
+          this.resetForm("form");
+      },  
+      remoteMethod(query) {
+        if (query !== '') {
+          this.loading = true;
+            let param = {
+                "searchValue":query, 
+            } 
+            getStaffListApi(param).then(response => {
+              this.staffOptions = response.rows
+              this.loading = false;
+            });  
+           
+        } else {
+          this.staffOptions = [];
+        }
+      },
+      /** 提交按钮 */
+      submitForm: function() {
+          this.$refs["form"].validate(valid => {
+            if (valid) {  
+              this.loadingBtn=true
+              if (this.form.wasteId != undefined) {
+                  editKitchenWasteDealApi(this.form).then(response => {
+                      this.$modal.msgSuccess("修改成功");
+                      this.open = false;
+                      this.getList();
+                      setTimeout(()=>{
+                        this.loadingBtn = false;
+                      },1000) 
+                  });
+              } else {
+                  addKitchenWasteDealApi(this.form).then(response => {
+                      this.$modal.msgSuccess("新增成功");
+                      this.open = false;
+                      this.getList();
+                      this.loadingBtn = false;
+                      setTimeout(()=>{
+                        this.loadingBtn = false;
+                      },1000) 
+                  });
+              }
+            }
+          });
+      },
+      /** 删除按钮操作 */
+      handleDelete(row) { 
+          this.$modal.confirm('是否确认删除数据项？').then(function() {
+              return delKitchenWasteDealApi({wasteIds:[row.wasteId]});
+          }).then(() => {
+              this.getList();
+              this.$modal.msgSuccess("删除成功");
+          }).catch(() => {});
+      },
+      // 图片上传
+      imgUpLoad0(param, name, index) {
+          param.type = 'canteen'
+          this.loadingBtn=true
+          imgUpLoadTwo(param).then((res) => {
+              if (res.code == 200) { 
+                  this.checkUrlList0.push(res.data.url)  
+                  this.$set(this.form,"scenePicture",this.checkUrlList0.join(',')) 
+              } else { 
+                  this.$modal.msgError(res.msg)
+              }
+              this.loadingBtn=false
+          })
+          .catch((error) => { 
+              this.$modal.msgError(error)
+              this.loadingBtn=false
+          })
+      },
+      // 上传之前
+      handleBeforeUpload(file) { 
+          const isLt = file.size / 1024 / 1024 < 5
+          if (!isLt) {
+              this.$modal.msgError(`图片大小不能超过 5 MB`)
+              return false
+          }
+      },
+      handleExceed(files, fileList) {
+          this.$message.warning('最多只可以上传3张图片')
+      },
+      handleRemove0(file, fileList) {
+          let sum = 0
+          this.checkUrlList0.forEach((item, index) => {
+              if (item == file.url) {
+                  sum = index
+              }
+          })
+          this.checkUrlList0.splice(sum, 1) 
+          if(this.checkUrlList0.length>0){
+            this.form.scenePicture = this.checkUrlList0.join(",")
+          }else{
+            this.form.scenePicture=""
+          }
+      },
+      //图片点击查看
+      handlePictureCardPreview(file) {
+          console.log(file)
+          this.dialogImageUrl = file.url
+          this.dialogVisible = true
+      },
+      openImg(item) {
+        this.dialogImageUrl = item;
         this.dialogVisible = true;
       },
+      //日期
+      formatDate(date) {
+          // 格式化为 YYYY-MM-DD
+          date = new Date(date)
+          const year = date.getFullYear();
+          const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始
+          const day = String(date.getDate()).padStart(2, '0');
+          return `${year}-${month}-${day}`;
+      },
+      //日期时间
+      formatDateTime(date) {
+          // 格式化为 YYYY-MM-DD
+          date = new Date(date)
+          const year = date.getFullYear();
+          const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始
+          const day = String(date.getDate()).padStart(2, '0');
+          const hours = date.getHours() < 10 ? '0' + date.getHours() : date.getHours()
+          const minutes = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()
+          const seconds = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()
+          return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
+      } 
   }
 };
 </script>
+<style lang="scss" scoped>
+  //隐藏图片上传框的css
+  ::v-deep.disabled {
+      .el-upload--picture-card {
+          display: none;
+      }
+  }
+</style>

src/views/kitchen/wasteManage/wasteSummary/index.vue

@@ -50,7 +50,11 @@
         </template>
       </el-table-column>
       <el-table-column label="所属食堂" align="center" prop="canteenName" :show-overflow-tooltip="true"  />
-      <el-table-column label="浪费次数" align="center" prop="wasteMealCount" :show-overflow-tooltip="true" />
+      <el-table-column label="浪费次数" align="center" prop="wasteMealCount" :show-overflow-tooltip="true">
+        <template slot-scope="scope">
+          <span style="color: #46a6ff;" @click="openDetail(scope.row)">{{ scope.row.wasteMealCount }}</span> 
+        </template>
+      </el-table-column>
       <el-table-column label="时间" align="center" prop="ledgerDate" :show-overflow-tooltip="true" width="180" />  
     </el-table> 
     <pagination
@@ -60,12 +64,43 @@
       :limit.sync="queryParams.pageSize"
       @pagination="getList"
     /> 
+
+    <el-dialog :visible.sync="open" width="800px"> 
+      <el-table v-loading="loading2" :data="dialogListData" height="600">
+        <el-table-column label="序号" align="center" width="80" type="index">
+          <template slot-scope="scope">
+            <span>{{(dialogQueryParams.pageNum - 1) * dialogQueryParams.pageSize + scope.$index + 1}}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="餐盘照片" align="center" prop="fileUrl" :show-overflow-tooltip="true">
+          <template slot-scope="scope">
+                  <img :src="scope.row.fileUrl" v-if="scope.row.fileUrl" alt="" style="width: 80px;height: 40px;" @click="openImg(scope.row)">
+                  <span v-else>无</span>
+              </template>
+        </el-table-column>
+        <el-table-column label="时间" align="center" prop="ledgerTime" :show-overflow-tooltip="true" />  
+      </el-table>
+      <pagination
+        v-show="total2>0"
+        :total="total2"
+        :page.sync="dialogQueryParams.pageNum"
+        :limit.sync="dialogQueryParams.pageSize"
+        @pagination="getDialogList"
+      />  
+      <div slot="footer" class="dialog-footer">
+          <el-button type="primary" @click="open=false">确 定</el-button>
+          <el-button @click="open=false">取 消</el-button>
+      </div>
+    </el-dialog> 
+    <el-dialog :visible.sync="dialogVisible" width="700px">
+        <img style="width: 100%;height: 100%;" :src="dialogImageUrl" alt="">
+    </el-dialog>
   </div>
 </template>
 
 <script> 
 import { getKitchenWasteCountApi } from "@/api/kitchen/wasteManage";
-
+import { getKitchenWasteListApi } from "@/api/kitchen/wasteManage"; 
 export default {
   name: "",
   dicts: [],
@@ -120,6 +155,17 @@ export default {
               }
           }]
       },
+      open:false,
+      loading2:false,
+      rowData:{},
+      dialogListData: [],
+      total2:0,
+      dialogQueryParams: {
+        pageNum: 1,
+        pageSize: 10, 
+      },
+      dialogVisible:false,//图片弹窗
+      dialogImageUrl:"",//图片弹窗  
     };
   },
   created() { 
@@ -158,6 +204,29 @@ export default {
               this.loading = false;
           });
       },
+      openDetail(row){
+        this.rowData = row;
+        this.open=true
+        this.getDialogList()
+      },
+      getDialogList() {
+          this.loading2 = true;
+          let param = {
+            "mealtimeType": this.rowData.mealtimeType,
+            "canteenId": this.rowData.canteenId,
+            "pageNum": this.dialogQueryParams.pageNum, 
+            "pageSize": this.dialogQueryParams.pageSize,  
+          } 
+          getKitchenWasteListApi(param).then(response => {
+              this.dialogListData = response.rows;
+              this.total2 = Number(response.total);
+              this.loading2 = false;
+          });
+      }, 
+      openImg(row) {
+          this.dialogImageUrl = row.fileUrl;
+          this.dialogVisible = true;
+      },
       //日期
       formatDate(date) {
           // 格式化为 YYYY-MM-DD