2021-12-05

src/utils/chenApi.js

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-11-18 13:40:39
- * @LastEditTime: 2021-12-05 14:09:31
+ * @LastEditTime: 2021-12-05 17:07:29
  * @LastEditors: Please set LastEditors
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  * @FilePath: \hyyfClient\src\utils\chenApi.js
@@ -55,9 +55,25 @@ export function getCarWashVideo(params) {
 }
 
 /* 车辆烘干 */
+// export function getCarDrying(params) {
+//   return axios({
+//     url: 'http://192.168.1.171:8089/baseTelecomRoom/list',
+//     method: 'get',
+//     params: params
+//   })
+// }
+// 数据查询
 export function getCarDrying(params) {
   return axios({
-    url: 'http://192.168.1.171:8089/baseTelecomRoom/list',
+    url: 'http://192.168.1.171:8089/telecom/listevent',
+    method: 'get',
+    params: params
+  })
+}
+// 温度变化
+export function getCarDryingTemp(params) {
+  return axios({
+    url: 'http://192.168.1.171:8089/telecom/listeventdetail',
     method: 'get',
     params: params
   })
@@ -200,3 +216,13 @@ export function getEnvAlarm(params) {
     data: params
   })
 }
+
+/* 环境排放报警 */
+export function getSewageAlarm(params) {
+  return axios({
+    url: '/produce/warningInfo/listWarningInfoSewage',
+    method: 'post',
+    data: params
+  })
+}
+

src/views/Alarm/EnvWarn.vue

@@ -134,6 +134,7 @@ export default {
     // 修改size
     sizeChange(val) {
       this.pageSize = val;
+      this.pageNum = 1;
       this.init();
     },
     // 修改页数

src/views/Alarm/SewageWarn.vue

@@ -1,37 +1,52 @@
 <template>
   <div class="sewageWarn">
-    <div class="reply" :style="{color: color}">筛选查询</div>
-    <x-form :formItems="selectItems" :day="day" @setDay="setDay" @onClickType="onClickType"></x-form>
-    <new-table :height="600" :title="title" :listData="list" :tableItems="tableItems" :shows="tableShows">
+    <div class="reply" :style="{ color: color }">筛选查询</div>
+    <x-form
+      :formItems="selectItems"
+      :day="day"
+      @setDay="setDay"
+      @onClickType="onClickType"
+    ></x-form>
+    <new-table
+      :height="600"
+      :title="title"
+      :listData="list"
+      :tableItems="tableItems"
+      :shows="tableShows"
+    >
       <template #right>
-<!--        <el-button size="mini" type="primary">导出数据</el-button>-->
+        <!--        <el-button size="mini" type="primary">导出数据</el-button>-->
       </template>
       <template #handler="scope">
         <el-button type="text" @click="open(scope.row)">未处理</el-button>
       </template>
     </new-table>
     <table-footer
-        :totals="total"
-        :size="pageSize"
-        @sizeChange="sizeChange"
-        @pageChange="pageChange"></table-footer>
+      :totals="total"
+      :size="pageSize"
+      @sizeChange="sizeChange"
+      @pageChange="pageChange"
+    ></table-footer>
   </div>
 </template>
 
 <script>
-import { mapState } from 'vuex';
+import { mapState } from "vuex";
 import XForm from "@/components/XForm";
 import NewTable from "@/components/newTable/NewTable";
 import TableFooter from "@/components/TableFooter";
+
+import { getSewageAlarm } from "@/utils/chenApi.js";
+
 export default {
   name: "SewageWarn",
   computed: {
-    ...mapState(['color'])
+    ...mapState(["color"]),
   },
   components: {
     XForm,
     NewTable,
-    TableFooter
+    TableFooter,
   },
   data() {
     return {
@@ -39,73 +54,67 @@ export default {
       selectItems: [
         {
           id: 3,
-          type: 'text',
-          text: '今日',
+          type: "text",
+          text: "今日",
           value: 1,
-          col: 1
+          col: 1,
         },
         {
           id: 4,
-          type: 'text',
-          text: '本周',
+          type: "text",
+          text: "本周",
           value: 2,
-          col: 1
+          col: 1,
         },
         {
           id: 5,
-          type: 'text',
-          text: '本月',
+          type: "text",
+          text: "本月",
           value: 3,
-          col: 1
+          col: 1,
         },
         {
           id: 6,
-          type: 'datepicker',
+          type: "datepicker",
           placeholder: [],
-          field: 'value1',
-          col: 6
+          field: "value1",
+          col: 6,
         },
         {
           id: 7,
-          type: 'button',
-          text: '查询',
+          type: "button",
+          text: "查询",
           col: 2,
-          click: 'search'
-        }
-      ],
-      title: '数据列表',
-      list: [
-        {
-          id: 1,
-          time: '2021-10-11 14:09:09',
-          location: '育肥1栋2层死猪通道',
-          content: '总氮量超过阈值',
+          click: "search",
         },
-        {
-          id: 2,
-          time: '2021-10-11 14:09:09',
-          location: '卖猪台',
-          content: '化学需氧量超过阈值',
-        }
       ],
+      title: "数据列表",
+      list: [],
       tableItems: [
         {
-          prop: 'time',
-          label: '时间',
-          minWidth: '100',
-          slotName: 'time'
+          prop: "warningTime",
+          label: "时间",
+          minWidth: "60",
+          slotName: "warningTime",
         },
         {
-          prop: 'content',
-          label: '内容',
-          minWidth: '100',
-          slotName: 'content'
+          prop: "warningName",
+          label: "报警类型",
+          minWidth: "60",
+          slotName: "warningName",
         },
         {
-          label: '处理结果',
-          minWidth: '100',
-          slotName: 'handler'
-        }
+          prop: "levelName",
+          label: "报警等级",
+          minWidth: "60",
+          slotName: "levelName",
+        },
+        {
+          prop: "msg",
+          label: "内容",
+          minWidth: "100",
+          slotName: "msg",
+        },
       ],
       tableShows: {
         showIndex: false,
@@ -114,45 +123,80 @@ export default {
       total: 0,
       pageNum: 1,
       pageSize: 20,
-    }
+      time: [],
+    };
+  },
+  mounted() {
+    this.init(this.day);
   },
   methods: {
     // 修改size
     sizeChange(val) {
       this.pageSize = val;
+      this.pageNum = 1;
       this.init();
     },
     // 修改页数
     pageChange(val) {
-      this.pageNum= val;
+      this.pageNum = val;
       this.init();
     },
-    init() {},
+    init() {
+      let params;
+      if (this.day === 4) {
+        params = {
+          startDate: this.time[0],
+          endDate: this.time[1],
+          type: this.day,
+          current: this.pageNum,
+          size: this.pageSize,
+        };
+      } else {
+        params = {
+          type: this.day,
+          current: this.pageNum,
+          size: this.pageSize,
+        };
+      }
+      getSewageAlarm(params).then((res) => {
+        if (res.code === 10000) {
+          this.list = res.data.records;
+          this.total = res.data.total;
+        }
+      });
+    },
     setDay(data) {
       this.day = data;
+      this.pageNum = 1;
+      this.init();
+    },
+    onClickType(val) {
+      this.day = 4;
+      this.time = val.data.value1;
+      this.pageNum = 1;
+      this.init();
     },
-    onClickType() {},
     open() {},
   },
-}
+};
 </script>
 
 <style scoped>
-  .sewageWarn {
-    width: 100%;
-    height: 100%;
-    box-sizing: border-box;
-    padding: 20px 20px 0 20px;
-  }
-  .reply {
-    width: 100%;
-    border: 1px solid #ddd;
-    border-bottom: 0;
-    height: 50px;
-    background-color: #F3F3F3;
-    line-height: 50px;
-    font-size: 18px;
-    box-sizing: border-box;
-    padding-left: 20px;
-  }
+.sewageWarn {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  padding: 20px 20px 0 20px;
+}
+.reply {
+  width: 100%;
+  border: 1px solid #ddd;
+  border-bottom: 0;
+  height: 50px;
+  background-color: #f3f3f3;
+  line-height: 50px;
+  font-size: 18px;
+  box-sizing: border-box;
+  padding-left: 20px;
+}
 </style>

src/views/BioSafety/CarAdmin.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2021-09-13 17:52:31
- * @LastEditTime: 2021-12-05 14:56:15
+ * @LastEditTime: 2021-12-05 17:03:35
  * @LastEditors: Please set LastEditors
  * @Description: 生物安全 - 车辆管理
  * @FilePath: \hyyfClient\src\views\BioSafety\CarAdmin.vue
@@ -17,7 +17,6 @@
 
     <!-- 筛选条件 -->
     <query-conditions
-      v-if="btnSelected !== 3"
       :formItems="formItems"
       :propFormData="propFormData"
       :defaultEmit="true"
@@ -74,6 +73,13 @@
           查看回放
         </el-button>
       </template>
+
+      <!-- 车辆烘干的回放 -->
+      <template #handlerDrying="slotProps">
+        <el-button size="mini" @click="clickDryingEvent(slotProps.row)">
+          查看本次烘干温度详情
+        </el-button>
+      </template>
     </new-table>
     <table-footer
       :totals="total"
@@ -108,6 +114,18 @@
         </el-button>
       </span>
     </el-dialog>
+
+    <el-dialog title="温度详情" :visible.sync="tempVisible" width="80%">
+      <div style="width: 100%; height: 500px">
+        <chart-car-drying :tempList="tempChartData"></chart-car-drying>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="videoVisible = false">取 消</el-button>
+        <el-button type="primary" @click="tempVisible = false">
+          确 定
+        </el-button>
+      </span>
+    </el-dialog>
   </div>
 </template>
 
@@ -116,6 +134,7 @@ import HeadBtns from "components/bioSafety/Btns";
 import QueryConditions from "components/bioSafety/QueryConditions";
 import NewTable from "components/newTable/NewTable";
 import TableFooter from "../../components/TableFooter";
+import ChartCarDrying from "./chart/ChartCarDrying.vue";
 
 import { formItems, propFormData } from "./carAdmin/queryCondition.config";
 import { titles, tableItems, tableShows } from "./carAdmin/table.config";
@@ -126,6 +145,7 @@ import {
   getCarWashTotal,
   getCarWashVideo,
   getCarDrying,
+  getCarDryingTemp,
 } from "../../utils/chenApi";
 import { getFaceToken } from "../../utils/api";
 
@@ -136,6 +156,7 @@ export default {
     QueryConditions,
     NewTable,
     TableFooter,
+    ChartCarDrying,
   },
   data() {
     return {
@@ -145,7 +166,7 @@ export default {
         { id: 2, name: "车辆洗消" },
         { id: 3, name: "车辆烘干" },
       ],
-      btnSelected: 3, // 选中的按钮
+      btnSelected: 1, // 选中的按钮
       formItems: [], // 传给 QueryCondition 组件的 formItems
       propFormData: {}, // 传给 QueryCondition 组件的 propFormData
       title: "", // 传给 BioTable 组件的 title
@@ -162,6 +183,8 @@ export default {
       imgUrl: "", // 点击图片后放大的图片路径
       videoVisible: false, // 车辆回放
       rtsp: "", // 车辆回放的地址
+      tempVisible: false, // 车辆烘干 - 查看温度详情
+      tempChartData: {},
     };
   },
   mounted() {
@@ -307,8 +330,8 @@ export default {
         orgCodeList: [],
         nodeCodeList: ["1002871$1$0$0", "1002872$1$0$0", "1002873$1$0$0"],
         deviceCategory: 1,
-        alarmStartDateString: this.params.time[0] + " 00:00:00",
-        alarmEndDateString: this.params.time[1] + " 23:59:59",
+        alarmStartDateString: this.params.time[0] + "00:00:00",
+        alarmEndDateString: this.params.time[1] + "23:59:59",
         alarmType: 303,
         dbType: 0,
       };
@@ -319,12 +342,26 @@ export default {
     // 车辆烘干
     carDrying() {
       getCarDrying({
+        startTimeString: this.params.time[0] + "00:00:00",
+        endTimeString: this.params.time[1] + "23:59:59",
         current: this.pageNum,
         size: this.size,
       }).then((res) => {
         if (res.code === 10000) {
           this.listData = res.data.records;
-          this.total = this.listData.length;
+          this.total = res.data.total;
+        }
+      });
+    },
+    // 车辆烘干的回放事件
+    clickDryingEvent(row) {
+      getCarDryingTemp({
+        deviceId: row.deviceId,
+        eventTimeString: row.eventTime,
+      }).then((res) => {
+        if (res.code === 10000) {
+          this.tempChartData = res.data;
+          this.tempVisible = true;
         }
       });
     },

src/views/BioSafety/carAdmin/queryCondition.config.js

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-18 15:19:29
- * @LastEditTime: 2021-12-02 09:28:03
+ * @LastEditTime: 2021-12-05 15:51:20
  * @LastEditors: Please set LastEditors
  * @Description: 筛选条件的 formItems 和 propFormData
  * @FilePath: \hyyfClient\src\views\BioSafety\personAdmin\queryCondition.config.js
@@ -50,12 +50,12 @@ const formItems3 = [
   //   field: 'place',
   //   options: []
   // },
-  // {
-  //   type: 'datepicker',
-  //   label: '时间：',
-  //   placeholder: ['开始时间', '结束时间'],
-  //   field: 'time'
-  // }
+  {
+    type: 'datepicker',
+    label: '时间：',
+    placeholder: ['开始时间', '结束时间'],
+    field: 'time'
+  }
 ]
 
 const propFormData3 = {

src/views/BioSafety/carAdmin/table.config.js

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-18 16:06:51
- * @LastEditTime: 2021-12-05 14:57:21
+ * @LastEditTime: 2021-12-05 16:16:45
  * @LastEditors: Please set LastEditors
  * @Description: 表格的配置
  * @FilePath: \hyyfClient\src\views\BioSafety\personAdmin\table.config.js
@@ -88,16 +88,16 @@ const tableItems2 = [
 
 const tableItems3 = [
   {
-    prop: 'deviceName',
-    label: '设备名称',
+    prop: 'eventTime',
+    label: '发生时间',
     minWidth: '150',
-    slotName: 'deviceName'
+    slotName: 'eventTime'
   },
   {
-    prop: 'deviceRoom',
-    label: '设备位置',
+    prop: 'location',
+    label: '发生地点',
     minWidth: '150',
-    slotName: 'deviceRoom'
+    slotName: 'location'
   },
   {
     label: '操作',

src/views/BioSafety/chart/ChartCarDrying.vue

@@ -0,0 +1,155 @@
+<!--
+ * @Author: your name
+ * @Date: 2021-12-05 16:50:40
+ * @LastEditTime: 2021-12-05 17:01:00
+ * @LastEditors: Please set LastEditors
+ * @Description: 车辆管理 - 车辆烘干 - 温度详情图
+ * @FilePath: \hyyfClient\src\views\BioSafety\chart\ChartCarDrying.vue
+-->
+<template>
+  <div id="chart-car-dring" style="width: 100%; height: 100%"></div>
+</template>
+
+<script>
+import { mapState } from "vuex";
+export default {
+  name: "ChartPigTemp",
+  computed: {
+    ...mapState(["color"]),
+  },
+  data() {
+    return {
+      myChart: null,
+    };
+  },
+  props: {
+    tempList: {
+      type: Object,
+      default: function() {
+        return {
+          timeList: [],
+          tempList: [],
+        };
+      },
+    },
+  },
+  watch: {
+    color(newVal) {
+      if (newVal) {
+        this.myChart.clear();
+        this.init();
+      }
+    },
+    tempList: {
+      handler(newVal) {
+        if (newVal) {
+          this.myChart.clear();
+          this.init();
+        }
+      },
+      deep: true,
+    },
+  },
+  methods: {
+    init() {
+      let start = 0;
+      let end = this.tempList.timeList.length - 1;
+      let time = this.tempList.timeList;
+      let data = this.tempList.tempList;
+      // let name = this.tempList.name;
+      // this.tempList.list.forEach((item) => {
+      //   time.push(item.createTime);
+      //   data.push(item.value);
+      // });
+      let options = {
+        // title: {
+        //   text: `${name}温度曲线`,
+        //   left: "center",
+        // },
+        tooltip: {
+          trigger: "axis",
+        },
+        color: [this.color],
+        dataZoom: [
+          {
+            type: "inside",
+            startValue: start,
+            endValue: end,
+            show: false,
+          },
+        ],
+        xAxis: [
+          {
+            type: "category",
+            data: time,
+            axisPointer: {
+              type: "shadow",
+            },
+            axisLine: {
+              show: false,
+              lineStyle: {
+                color: "#6e7079",
+              },
+            },
+            axisTick: {
+              show: false,
+            },
+          },
+        ],
+        yAxis: [
+          {
+            type: "value",
+            // name: "温度统计情况",
+            axisLabel: {
+              formatter: "{value}℃",
+            },
+            axisLine: {
+              show: false,
+              lineStyle: {
+                color: "#6e7079",
+              },
+            },
+            axisTick: {
+              show: false,
+            },
+          },
+        ],
+        series: [
+          {
+            name: `${name}`,
+            type: "line",
+            // stack: 'Total',
+            smooth: true,
+            areaStyle: {},
+            emphasis: {
+              focus: "series",
+            },
+            itemStyle: {
+              color: this.color,
+              borderColor: this.color,
+              normal: {
+                label: {
+                  show: true,
+                  textStyle: {
+                    fontSize: 14,
+                  },
+                },
+              },
+            },
+            data: data,
+          },
+        ],
+      };
+      this.myChart.setOption(options);
+    },
+  },
+  mounted() {
+    this.myChart = this.$echarts.init(
+      document.getElementById("chart-car-dring")
+    );
+    this.init();
+  },
+};
+</script>
+
+<style scoped></style>