140 lines
		
	
	
		
			5.0 KiB
		
	
	
	
		
			Vue
		
	
	
	
			
		
		
	
	
			140 lines
		
	
	
		
			5.0 KiB
		
	
	
	
		
			Vue
		
	
	
	
<template>
 | 
						|
  <div class="app-container">
 | 
						|
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
 | 
						|
        <el-form-item label="关键字" prop="searchValue">
 | 
						|
            <el-input v-model="queryParams.searchValue" placeholder="请输入设备名称,编号" maxlength="20" clearable style="width: 240px"/>
 | 
						|
        </el-form-item> 
 | 
						|
        <el-form-item label="检测结果" prop="envSensorResultTypeList">
 | 
						|
            <el-select v-model="queryParams.envSensorResultTypeList" multiple="true" style="width: 240px" clearable> 
 | 
						|
                <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-option label="烟雾浓度过高" value="6"></el-option>  
 | 
						|
            </el-select>   
 | 
						|
        </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>
 | 
						|
      </el-form-item>
 | 
						|
    </el-form>
 | 
						|
 | 
						|
    <el-row :gutter="10" class="mb8">
 | 
						|
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
 | 
						|
    </el-row>
 | 
						|
 | 
						|
    <el-table v-loading="loading" :data="tableListData" height="800">
 | 
						|
      <el-table-column label="序号" align="center" width="80" type="index">
 | 
						|
        <template slot-scope="scope">
 | 
						|
          <span>{{(queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1}}</span>
 | 
						|
        </template>
 | 
						|
      </el-table-column>
 | 
						|
      <el-table-column label="设备编号" align="center" prop="deviceNo" :show-overflow-tooltip="true"/>
 | 
						|
      <el-table-column label="设备名称" align="center" prop="deviceName" :show-overflow-tooltip="true"/>
 | 
						|
      <el-table-column label="检测食堂" align="center" prop="canteenName" :show-overflow-tooltip="true"/>
 | 
						|
      <el-table-column label="检测结果" align="center" prop="measureData" :show-overflow-tooltip="true"/>
 | 
						|
      <el-table-column label="检测时间" align="center" prop="createTime" :show-overflow-tooltip="true"/> 
 | 
						|
    </el-table>
 | 
						|
 | 
						|
    <pagination
 | 
						|
      v-show="total>0"
 | 
						|
      :total="total"
 | 
						|
      :page.sync="queryParams.pageNum"
 | 
						|
      :limit.sync="queryParams.pageSize"
 | 
						|
      @pagination="getList"
 | 
						|
    />
 | 
						|
 | 
						|
    <el-dialog :visible.sync="dialogVisible" width="700px">
 | 
						|
      <img style="width: 100%;height: 100%;" :src="dialogImageUrl" alt="">
 | 
						|
    </el-dialog>
 | 
						|
 | 
						|
    <!-- 添加或修改参数配置对话框 -->
 | 
						|
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
 | 
						|
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
 | 
						|
      </el-form>
 | 
						|
      <div slot="footer" class="dialog-footer">
 | 
						|
        <el-button type="primary" @click="submitForm">确 定</el-button>
 | 
						|
        <el-button @click="cancel">取 消</el-button>
 | 
						|
      </div>
 | 
						|
    </el-dialog>
 | 
						|
  </div>
 | 
						|
</template>
 | 
						|
 | 
						|
<script> 
 | 
						|
import { getKitchenDeviceSensorRecordListApi } from "@/api/kitchen/environment";
 | 
						|
 | 
						|
export default {
 | 
						|
  name: "",
 | 
						|
  dicts: [],
 | 
						|
  data() {
 | 
						|
    return {
 | 
						|
      // 遮罩层
 | 
						|
      loading: true,
 | 
						|
      // 选中数组
 | 
						|
      ids: [],
 | 
						|
      // 非单个禁用
 | 
						|
      single: true,
 | 
						|
      // 非多个禁用
 | 
						|
      multiple: true,
 | 
						|
      // 显示搜索条件
 | 
						|
      showSearch: true,
 | 
						|
      // 总条数
 | 
						|
      total: 0,
 | 
						|
      //表格数据
 | 
						|
      tableListData: [], 
 | 
						|
      // 查询参数
 | 
						|
      queryParams: {
 | 
						|
        pageNum: 1,
 | 
						|
        pageSize: 10,  
 | 
						|
        searchValue: undefined,
 | 
						|
        envSensorResultTypeList: [], 
 | 
						|
      }, 
 | 
						|
      dialogVisible:false,//图片弹窗
 | 
						|
      dialogImageUrl:"",//图片弹窗  
 | 
						|
    };
 | 
						|
  },
 | 
						|
  created() { 
 | 
						|
    this.getList();
 | 
						|
  },
 | 
						|
  methods: { 
 | 
						|
      /** 搜索按钮操作 */
 | 
						|
      handleQuery() {
 | 
						|
          this.queryParams.pageNum = 1;
 | 
						|
          this.getList();
 | 
						|
      },
 | 
						|
      /** 重置按钮操作 */
 | 
						|
      resetQuery() { 
 | 
						|
        this.queryParams = {
 | 
						|
          pageNum: 1,
 | 
						|
          pageSize: 10,  
 | 
						|
          searchValue: undefined,
 | 
						|
          envSensorResultTypeList: [], 
 | 
						|
        }
 | 
						|
        this.resetForm("queryForm");
 | 
						|
        this.handleQuery();
 | 
						|
      },
 | 
						|
      /** 查询列表 */
 | 
						|
      getList() {
 | 
						|
          this.loading = true;
 | 
						|
          let param = {
 | 
						|
            "searchValue": this.queryParams.searchValue, 
 | 
						|
            "envSensorResultTypeList": this.queryParams.envSensorResultTypeList, 
 | 
						|
            "deviceCategory": 5, 
 | 
						|
            "pageNum": this.queryParams.pageNum, 
 | 
						|
            "pageSize": this.queryParams.pageSize,
 | 
						|
          }
 | 
						|
          getKitchenDeviceSensorRecordListApi(param).then(response => {
 | 
						|
              this.tableListData = response.rows;
 | 
						|
              this.total = Number(response.total);
 | 
						|
              this.loading = false;
 | 
						|
          });
 | 
						|
      },
 | 
						|
      openImg(row) {
 | 
						|
        this.dialogImageUrl = row.imgUrl;
 | 
						|
        this.dialogVisible = true;
 | 
						|
      }
 | 
						|
  }
 | 
						|
};
 | 
						|
</script>
 |