From e77de03a00604cd47949f57a1b42525605f14d9a Mon Sep 17 00:00:00 2001
From: zzyuan <781948537@qq.com>
Date: Wed, 24 Sep 2025 09:19:49 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8E=A8=E6=88=BF=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/kitchen/environment.js                |  12 +-
 .../kitchen/environment/alarmRecord/index.vue |   4 +-
 .../environment/energyRecord/index.vue        | 229 ++++++++++++++++++
 .../environment/environmentMonitor/index.vue  |   4 +-
 src/views/kitchen/index.vue                   |   2 +-
 .../cameraRecord}/index.vue                   | 107 +++++++-
 6 files changed, 345 insertions(+), 13 deletions(-)
 create mode 100644 src/views/kitchen/environment/energyRecord/index.vue
 rename src/views/kitchen/{staffManage/violation => violation/cameraRecord}/index.vue (50%)

diff --git a/src/api/kitchen/environment.js b/src/api/kitchen/environment.js
index 6c335a49..06956649 100644
--- a/src/api/kitchen/environment.js
+++ b/src/api/kitchen/environment.js
@@ -1,8 +1,16 @@
 import request from '@/utils/request'
 
+// 查询厨房后场传感器所有记录列表
+export function getKitchenSensorAllRecordListApi(data) {
+  return request({
+    url: '/smart-canteen/hardwareScreen/getDeviceRecordListByDeviceType',
+    method: 'get',
+    params: data
+  })
+}
 
-// 查询厨房后场设备传感器记录列表
-export function getKitchenDeviceSensorRecordListApi(data) {
+// 查询厨房后场传感器告警记录列表
+export function getKitchenDeviceSensorAlarmRecordListApi(data) {
   return request({
     url: '/smart-canteen/kitchen_device_sensor_record/list',
     method: 'get',
diff --git a/src/views/kitchen/environment/alarmRecord/index.vue b/src/views/kitchen/environment/alarmRecord/index.vue
index dd3e188d..b9f66dea 100644
--- a/src/views/kitchen/environment/alarmRecord/index.vue
+++ b/src/views/kitchen/environment/alarmRecord/index.vue
@@ -60,7 +60,7 @@
 </template>
 
 <script> 
-import { getKitchenDeviceSensorRecordListApi } from "@/api/kitchen/environment";
+import { getKitchenDeviceSensorAlarmRecordListApi } from "@/api/kitchen/environment";
 
 export default {
   name: "",
@@ -143,7 +143,7 @@ export default {
           if(this.activeName==6&&this.queryParams.deviceType6){
             param.deviceType = this.queryParams.deviceType6;
           }
-          getKitchenDeviceSensorRecordListApi(param).then(response => {
+          getKitchenDeviceSensorAlarmRecordListApi(param).then(response => {
               this.tableListData = response.rows;
               this.total = Number(response.total);
               this.loading = false;
diff --git a/src/views/kitchen/environment/energyRecord/index.vue b/src/views/kitchen/environment/energyRecord/index.vue
new file mode 100644
index 00000000..ba1551bf
--- /dev/null
+++ b/src/views/kitchen/environment/energyRecord/index.vue
@@ -0,0 +1,229 @@
+<template>
+  <div class="app-container">
+    <div style="width: 100%;">
+      <el-tabs v-model="activeName" type="card" @tab-click="handleTabClick">
+        <el-tab-pane label="水表记录" name="10"></el-tab-pane>
+        <el-tab-pane label="电表记录" name="11"></el-tab-pane>
+        <el-tab-pane label="温湿度记录" name="14"></el-tab-pane>
+      </el-tabs>
+    </div> 
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+        <el-form-item label="关键字" prop="keyWord">
+            <el-input v-model="queryParams.keyWord" placeholder="请输入设备名称，编号" maxlength="20" clearable style="width: 240px"/>
+        </el-form-item>    
+        <el-form-item label="记录时间">
+            <el-date-picker
+                v-model="dateRange"
+                type="daterange"
+                align="right"
+                unlink-panels
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                format="yyyy-MM-dd" style="width: 400px" 
+                :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>
+      </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="canteenName" :show-overflow-tooltip="true"  /> -->
+      <el-table-column label="设备名称" align="center" prop="deviceName" :show-overflow-tooltip="true" />
+      <el-table-column label="设备编号" align="center" prop="deviceNo" :show-overflow-tooltip="true" />
+      <el-table-column label="设备SN" align="center" prop="deviceSn" :show-overflow-tooltip="true" />
+      <el-table-column label="温度" align="center" prop="temperature" :show-overflow-tooltip="true" v-if="activeName==14">
+        <template slot-scope="scope">
+          <span>{{ scope.row.temperature }}℃</span> 
+        </template> 
+      </el-table-column>
+      <el-table-column label="湿度" align="center" prop="humidity" :show-overflow-tooltip="true" v-if="activeName==14">
+        <template slot-scope="scope">
+          <span>{{ scope.row.humidity }}%</span> 
+        </template> 
+      </el-table-column>
+      <el-table-column label="用水量" align="center" prop="usage" :show-overflow-tooltip="true" v-if="activeName==10">
+        <template slot-scope="scope">
+          <span>{{ scope.row.usage }}m³</span> 
+        </template> 
+      </el-table-column>
+      <el-table-column label="用电量" align="center" prop="usage" :show-overflow-tooltip="true" v-if="activeName==11">
+        <template slot-scope="scope">
+          <span>{{ scope.row.usage }}KW</span> 
+        </template> 
+      </el-table-column> 
+      <el-table-column label="是否在线" align="center" prop="online" :show-overflow-tooltip="true">
+        <template slot-scope="scope">
+          <span v-if="scope.row.online==1">在线</span>
+          <span v-if="scope.row.online==2">离线</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="位置" align="center" prop="subPlace" :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"
+    /> 
+  </div>
+</template>
+
+<script> 
+import { getKitchenSensorAllRecordListApi } from "@/api/kitchen/environment";
+
+export default {
+  name: "",
+  dicts: [],
+  data() {
+    return {
+      // 遮罩层
+      loading: false,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      //表格数据
+      tableListData: [],
+      activeName:'10',
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        keyWord:undefined,
+      }, 
+      dateRange:this.defaultDateRange(),
+      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]);
+              }
+          }]
+      },
+    };
+  },
+  created() { 
+    // this.getList();
+  },
+  mounted(){
+    if(this.$route.query.activeName){
+      this.activeName = this.$route.query.activeName
+    } 
+    this.getList();
+  },
+  methods: { 
+      /** 搜索按钮操作 */
+      handleQuery() {
+          this.queryParams.pageNum = 1;
+          this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+          this.dateRange = this.defaultDateRange()
+          this.queryParams = {
+            pageNum: 1,
+            pageSize: 10,
+            keyWord:undefined,  
+          }
+          this.resetForm("queryForm");
+          this.handleQuery();
+      },
+      handleTabClick(tab, event) { 
+            console.log(tab.name,tab.label)
+            this.handleQuery()
+      },
+      /** 查询列表 */
+      getList() {
+          this.loading = true;
+          let param = { 
+            "deviceType": this.activeName, 
+            "pageNum": this.queryParams.pageNum, 
+            "pageSize": this.queryParams.pageSize,
+            "keyWord": this.queryParams.keyWord, 
+          } 
+          if(this.dateRange&&this.dateRange.length>0){
+              param.startTime=this.formatDate(this.dateRange[0])
+              param.endTime=this.formatDate(this.dateRange[1])
+          }else{
+              param.startTime=undefined;
+              param.endTime=undefined;
+          }
+          getKitchenSensorAllRecordListApi(param).then(response => {
+              this.tableListData = response.rows;
+              this.total = Number(response.total);
+              this.loading = false;
+          });
+      },
+      defaultDateRange() {
+          const end = new Date(new Date().toLocaleDateString());
+          end.setTime(end.getTime() + 24 * 60 * 60 * 1000 -1);
+          const start = new Date((new Date().toLocaleDateString()));
+          start.setTime(start.getTime() - 30 * 24 * 60 * 60 * 1000); 
+          this.start = parseInt(start.getTime() / 1000)
+          this.end = parseInt(end.getTime() / 1000)
+          return [start, end]
+      }, 
+      //日期
+      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>
diff --git a/src/views/kitchen/environment/environmentMonitor/index.vue b/src/views/kitchen/environment/environmentMonitor/index.vue
index 62e8ff86..ffdedf0a 100644
--- a/src/views/kitchen/environment/environmentMonitor/index.vue
+++ b/src/views/kitchen/environment/environmentMonitor/index.vue
@@ -62,7 +62,7 @@
 </template>
 
 <script> 
-import { getKitchenDeviceSensorRecordListApi } from "@/api/kitchen/environment";
+import { getKitchenDeviceSensorAlarmRecordListApi } from "@/api/kitchen/environment";
 
 export default {
   name: "",
@@ -124,7 +124,7 @@ export default {
             "pageNum": this.queryParams.pageNum, 
             "pageSize": this.queryParams.pageSize,
           }
-          getKitchenDeviceSensorRecordListApi(param).then(response => {
+          getKitchenDeviceSensorAlarmRecordListApi(param).then(response => {
               this.tableListData = response.rows;
               this.total = Number(response.total);
               this.loading = false;
diff --git a/src/views/kitchen/index.vue b/src/views/kitchen/index.vue
index 03c79dc0..60a39ddb 100644
--- a/src/views/kitchen/index.vue
+++ b/src/views/kitchen/index.vue
@@ -56,7 +56,7 @@
           <div style="background: #fff;padding: 10px;margin: 5px;margin-bottom: 10px;border-radius: 4px;"> 
             <div style="border-left: 4px solid #00594F;padding-left: 10px;font-weight: 600;height: 24px;">报警数据分析</div> 
             <div style="width: 100%;text-align: center;position: relative;">
-              <span>员工违规</span>
+              <span>违规记录</span>
               <span style="position: absolute;right: 10px;font-size: 14px;color: #00D9CB;" @click="goList">查看详情></span>
             </div> 
             <div id="lineChartThree" style="width: 100%;height: 200px;margin-bottom: 20px;"></div>  
diff --git a/src/views/kitchen/staffManage/violation/index.vue b/src/views/kitchen/violation/cameraRecord/index.vue
similarity index 50%
rename from src/views/kitchen/staffManage/violation/index.vue
rename to src/views/kitchen/violation/cameraRecord/index.vue
index 0f4f2c01..474a23f2 100644
--- a/src/views/kitchen/staffManage/violation/index.vue
+++ b/src/views/kitchen/violation/cameraRecord/index.vue
@@ -1,9 +1,9 @@
 <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-form-item label="关键字" prop="searchValue">
             <el-input v-model="queryParams.searchValue" placeholder="请输入员工姓名，编号" maxlength="20" clearable style="width: 240px"/>
-        </el-form-item>
+        </el-form-item> -->
         <el-form-item label="违规内容" prop="alarmType">
             <el-select v-model="queryParams.alarmType" style="width: 240px" clearable> 
                 <el-option label="未戴口罩" value="1"></el-option>
@@ -20,6 +20,19 @@
                 <el-option label="动火离人" value="13"></el-option>
             </el-select>   
         </el-form-item>
+        <el-form-item label="记录时间">
+            <el-date-picker
+                v-model="dateRange"
+                type="daterange"
+                align="right"
+                unlink-panels
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                format="yyyy-MM-dd" style="width: 400px" 
+                :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>
@@ -35,10 +48,26 @@
         <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="deviceName" :show-overflow-tooltip="true"/>
+      <el-table-column label="设备编号" align="center" prop="deviceNo" :show-overflow-tooltip="true"/>
+      <el-table-column label="位置" align="center" prop="subPlace" :show-overflow-tooltip="true"/>
+      <el-table-column label="违规内容" align="center" prop="alarmType" :show-overflow-tooltip="true">
+        <template slot-scope="scope">
+          <span v-if="scope.row.alarmType==1">未戴口罩</span>
+          <span v-if="scope.row.alarmType==2">垃圾桶未盖报警</span>
+          <span v-if="scope.row.alarmType==3">发现老鼠</span>
+          <span v-if="scope.row.alarmType==4">未穿厨师服</span>
+          <span v-if="scope.row.alarmType==5">未戴厨师帽</span>
+          <span v-if="scope.row.alarmType==6">未戴手套</span>
+          <span v-if="scope.row.alarmType==7">抽烟</span>
+          <span v-if="scope.row.alarmType==8">打电话</span>
+          <span v-if="scope.row.alarmType==9">地面巡检</span>
+          <span v-if="scope.row.alarmType==10">设备归位</span>
+          <span v-if="scope.row.alarmType==11">未授权人员进入</span>
+          <span v-if="scope.row.alarmType==13">动火离人</span>
+        </template>
       </el-table-column>
-      <el-table-column label="员工编号" align="center" prop="staffNo" :show-overflow-tooltip="true"/>
-      <el-table-column label="违规人员" align="center" prop="staffName" :show-overflow-tooltip="true"/>
-      <el-table-column label="违规内容" align="center" prop="recordDesc" :show-overflow-tooltip="true"/>
       <el-table-column label="违规图片" align="center" prop="imgUrl" :show-overflow-tooltip="true">
         <template slot-scope="scope"> 
           <img :src="scope.row.imgUrl" v-if="scope.row.imgUrl" alt="" style="width: 80px;height: 40px;" @click="openImg(scope.row)">
@@ -93,6 +122,34 @@ export default {
       },
       dialogVisible:false,//图片弹窗
       dialogImageUrl:"",//图片弹窗  
+      dateRange:this.defaultDateRange(),
+      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]);
+              }
+          }]
+      },
     };
   },
   created() { 
@@ -106,6 +163,7 @@ export default {
       },
       /** 重置按钮操作 */
       resetQuery() { 
+        this.dateRange = this.defaultDateRange()
         this.queryParams = {
           pageNum: 1,
           pageSize: 10,  
@@ -121,9 +179,16 @@ export default {
           let param = {
             "pageNum": this.queryParams.pageNum, 
             "pageSize": this.queryParams.pageSize,  
-            "searchValue": this.queryParams.searchValue,  
+            // "searchValue": this.queryParams.searchValue,  
             "alarmType": this.queryParams.alarmType,  
           }
+          if(this.dateRange&&this.dateRange.length>0){
+              param.startTime=this.formatDate(this.dateRange[0])
+              param.endTime=this.formatDate(this.dateRange[1])
+          }else{
+              param.startTime=undefined;
+              param.endTime=undefined;
+          }
           getStaffIllegalListApi(param).then(response => {
               this.tableListData = response.rows;
               this.total = Number(response.total);
@@ -133,6 +198,36 @@ export default {
       openImg(row) {
         this.dialogImageUrl = row.imgUrl;
         this.dialogVisible = true;
+      },
+      defaultDateRange() {
+          const end = new Date(new Date().toLocaleDateString());
+          end.setTime(end.getTime() + 24 * 60 * 60 * 1000 -1);
+          const start = new Date((new Date().toLocaleDateString()));
+          start.setTime(start.getTime() - 30 * 24 * 60 * 60 * 1000); 
+          this.start = parseInt(start.getTime() / 1000)
+          this.end = parseInt(end.getTime() / 1000)
+          return [start, end]
+      }, 
+      //日期
+      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}`;
       }
   }
 };