2021-12-17

src/router/ChildrenRouters.js

@@ -66,6 +66,16 @@ const childrenRouters = [
       parentName: '生物安全'
     }
   },
+  {
+    path: '/doorAdmin',
+    name: 'DoorAdmin',
+    component: () => import('../views/BioSafety/DoorAdmin.vue'),
+    meta: {
+      title: '大门事件',
+      permission: 'doorAdmin',
+      parentName: '生物安全'
+    }
+  },
 
   /*
   *

src/utils/chenApi.js

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-11-18 13:40:39
- * @LastEditTime: 2021-12-17 10:21:52
+ * @LastEditTime: 2021-12-17 15:57:47
  * @LastEditors: Please set LastEditors
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  * @FilePath: \hyyfClient\src\utils\chenApi.js
@@ -89,6 +89,15 @@ export function getPersonFiles(params) {
   })
 }
 
+/** 大门事件 */
+export function getDoorAdmin(params) {
+  return axios({
+    url: '/video/door/ListDoorEvent',
+    method: 'post',
+    data: params
+  })
+}
+
 /** 生产数据 - ERP 数据分析 - 工作看板 */
 // 汇总信息
 export function getWorkTotal(params) {

src/views/BioSafety/DeadPig.vue

@@ -29,7 +29,7 @@
           :src="slotProps.row.alarmPicture"
           @click="clickImg(slotProps.row.alarmPicture)"
           alt="死猪图片"
-          width="380"
+          width="100%"
         />
       </template>
 
@@ -99,7 +99,7 @@ export default {
     TableFooter,
   },
   computed: {
-    ...mapState(['ip'])
+    ...mapState(["ip"]),
   },
   data() {
     return {

src/views/BioSafety/DoorAdmin.vue

@@ -0,0 +1,292 @@
+<!--
+ * @Author: your name
+ * @Date: 2021-12-17 15:50:33
+ * @LastEditTime: 2021-12-17 16:06:00
+ * @LastEditors: Please set LastEditors
+ * @Description: 大门事件
+ * @FilePath: \hyyfClient\src\views\BioSafety\DoorAdmin.vue
+-->
+<template>
+  <div class="door-admin">
+    <!-- 筛选条件 -->
+    <query-conditions
+      :defaultEmit="true"
+      :formItems="formItems"
+      :propFormData="propFormData"
+      @getQueryParams="handleQuery"
+    ></query-conditions>
+
+    <!-- 表格 -->
+    <new-table
+      :title="title"
+      :listData="listData"
+      :tableItems="tableItems"
+      :shows="tableShows"
+      :height="535"
+    >
+      <template v-slot:alarmPicture="slotProps">
+        <img
+          :src="slotProps.row.alarmPicture"
+          @click="clickImg(slotProps.row.alarmPicture)"
+          alt="死猪图片"
+          width="100%"
+        />
+      </template>
+
+      <!-- 回放按钮 -->
+      <template v-slot:handler="slotProps">
+        <el-button size="mini" @click="clickEvent(slotProps.row)">
+          查看回放
+        </el-button>
+      </template>
+    </new-table>
+    <table-footer
+      :totals="total"
+      :size="size"
+      @sizeChange="sizeChange"
+      @pageChange="pageChange"
+    >
+    </table-footer>
+    <el-dialog title="图片" :visible.sync="dialogVisible" width="50%">
+      <img :src="imgUrl" alt="死猪图片" width="100%" />
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="dialogVisible = false"
+          >确 定</el-button
+        >
+      </span>
+    </el-dialog>
+    <el-dialog title="回放视频" :visible.sync="videoVisible" width="50%">
+      <div style="width: 100%; height: 600px">
+        <iframe
+          v-if="videoVisible"
+          :src="'static/dahua/index.html?' + rtsp"
+          frameborder="0"
+          style="width: 100%; height: 100%"
+        >
+        </iframe>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="videoVisible = false">取 消</el-button>
+        <el-button type="primary" @click="videoVisible = false">
+          确 定
+        </el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import QueryConditions from "components/bioSafety/QueryConditions";
+import NewTable from "components/newTable/NewTable";
+import TableFooter from "../../components/TableFooter";
+
+import { formItems, propFormData } from "./doorAdmin/queryCondition.config";
+import { title, tableItems, tableShows } from "./doorAdmin/table.config";
+import { mapState } from "vuex";
+
+import {
+  getDoorAdmin,
+  // getCarWashTotal,
+  getCarWashVideo,
+} from "../../utils/chenApi";
+
+export default {
+  name: "DeadPig",
+  components: {
+    QueryConditions,
+    NewTable,
+    TableFooter,
+  },
+  computed: {
+    ...mapState(["ip"]),
+  },
+  data() {
+    return {
+      formItems: [], // 传给 QueryCondition 组件的 formItems
+      propFormData: {}, // 传给 QueryCondition 组件的 propFormData
+      title: "", // 传给 BioTable 组件的 title
+      listData: [], // 传给 BioTable 组件的表格展示的值 listData
+      tableItems: [], // 传给 BioTable 组件的表格的列表 tableItems
+      tableShows: {},
+      // table的翻页
+      total: 0,
+      size: 20,
+      pageNum: 1,
+      selectId: "",
+      params: {},
+      dialogVisible: false,
+      imgUrl: "",
+      rtsp: "",
+      videoVisible: false,
+    };
+  },
+  mounted() {
+    this.formItems = formItems;
+    this.propFormData = propFormData;
+    this.title = title;
+    this.tableItems = tableItems;
+    this.tableShows = tableShows;
+    this.pigManage();
+    this.pigTotal();
+  },
+  methods: {
+    // 获取查询条件
+    handleQuery(params) {
+      console.log(params);
+      this.params = params;
+      this.pageNum = 1;
+      this.pigManage();
+      this.pigTotal();
+    },
+    // 修改size
+    sizeChange(val) {
+      this.size = val;
+      // this.init();
+      this.pageNum = 1;
+      this.pigManage();
+    },
+    // 修改页数
+    pageChange(val) {
+      this.pageNum = val;
+      // this.init();
+      this.pigManage();
+    },
+    init() {
+      let params = {
+        pageNum: this.pageNum,
+        pageSize: this.size,
+        searchStr: this.keyword,
+      };
+      console.log(params);
+      // 获取后端数据
+    },
+    // 死猪管理
+    pigManage() {
+      let queryParams = {
+        pageNum: this.pageNum,
+        pageSize: this.size,
+        alarmStartDateString: this.params.time[0] + " 00:00:00",
+        alarmEndDateString: this.params.time[1] + " 23:59:59",
+      };
+      getDoorAdmin(queryParams).then(async (res) => {
+        const result = JSON.parse(res.data.result);
+        console.log("res:", result);
+        this.listData = result.data.pageData;
+        this.listData.forEach((item) => {
+          item.alarmPicture = `${this.ip}/video/picture/get?alarmPicture=${item.alarmPicture}`;
+        });
+        this.total = parseInt(res.total);
+      });
+    },
+    // 死猪管理 - 总数
+    pigTotal() {
+      // let queryParams = {
+      //   orgCodeList: [],
+      //   nodeCodeList: [
+      //     "1002874$1$0$0",
+      //     "1002875$1$0$0",
+      //     "1002876$1$0$0",
+      //     "1002877$1$0$0",
+      //     "1002878$1$0$0",
+      //     "1002879$1$0$0",
+      //     "1002880$1$0$0",
+      //     "1002881$1$0$0",
+      //     "1002882$1$0$0",
+      //     "1002883$1$0$0",
+      //     "1002884$1$0$0",
+      //     "1002885$1$0$0",
+      //     "1002886$1$0$0",
+      //     "1002887$1$0$0",
+      //     "1002888$1$0$0",
+      //     "1002889$1$0$0",
+      //     "1002890$1$0$0",
+      //     "1002891$1$0$0",
+      //     "1002892$1$0$0",
+      //     "1002893$1$0$0",
+      //     "1002894$1$0$0",
+      //     "1002895$1$0$0",
+      //     "1002896$1$0$0",
+      //     "1002897$1$0$0",
+      //     "1002898$1$0$0",
+      //     "1002899$1$0$0",
+      //     "1002900$1$0$0",
+      //     "1002901$1$0$0",
+      //     "1002902$1$0$0",
+      //     "1002903$1$0$0",
+      //     "1002904$1$0$0",
+      //     "1002905$1$0$0",
+      //     "1002906$1$0$0",
+      //     "1002907$1$0$0",
+      //     "1002908$1$0$0",
+      //     "1002909$1$0$0",
+      //     "1002910$1$0$0",
+      //     "1002911$1$0$0",
+      //     "1002912$1$0$0",
+      //     "1002913$1$0$0",
+      //     "1002939$1$0$0",
+      //     "1002939$1$0$1",
+      //     "1002939$1$0$2",
+      //     "1002939$1$0$3",
+      //     "1002939$1$0$4",
+      //     "1002939$1$0$5",
+      //     "1002939$1$0$6",
+      //     "1002939$1$0$7",
+      //     "1002939$1$0$8",
+      //     "1002939$1$0$9",
+      //     "1002940$1$0$0",
+      //     "1002940$1$0$1",
+      //     "1002940$1$0$2",
+      //     "1002940$1$0$3",
+      //     "1002940$1$0$4",
+      //     "1002940$1$0$5",
+      //     "1002940$1$0$6",
+      //     "1002940$1$0$7",
+      //     "1002939$1$0$10",
+      //     "1002939$1$0$11",
+      //     "1002939$1$0$12",
+      //     "1002939$1$0$13",
+      //     "1002939$1$0$14",
+      //     "1002939$1$0$15",
+      //   ],
+      //   deviceCategory: 1,
+      //   alarmStartDateString: this.params.time[0] + " 00:00:00",
+      //   alarmEndDateString: this.params.time[1] + " 23:59:59",
+      //   alarmType: 303,
+      //   dbType: 0,
+      // };
+      // getCarWashTotal(queryParams).then((res) => {
+      //   this.total = JSON.parse(res.result).data.value;
+      // });
+    },
+    // 点击图片放大
+    clickImg(url) {
+      this.dialogVisible = true;
+      this.imgUrl = url;
+    },
+    // 大门回放
+    clickEvent(row) {
+      getCarWashVideo({
+        happendTime: row.alarmDate,
+        channelName: row.alarmPosition,
+      }).then((res) => {
+        if (res.code === 0) {
+          this.rtsp = res.URL;
+          this.videoVisible = true;
+        } else {
+          this.$message.error("视频获取失败");
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style scoped>
+.door-admin {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  padding: 20px;
+}
+</style>

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

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-09-18 16:06:51
- * @LastEditTime: 2021-12-07 09:53:05
+ * @LastEditTime: 2021-12-17 14:31:32
  * @LastEditors: Please set LastEditors
  * @Description: 表格的配置
  * @FilePath: \hyyfClient\src\views\BioSafety\personAdmin\table.config.js
@@ -18,7 +18,7 @@ export const tableItems = [
   {
     prop: 'alarmPicture',
     label: '图片',
-    minWidth: '150',
+    width: '300',
     slotName: 'alarmPicture'
   },
   {

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

@@ -0,0 +1,30 @@
+/*
+ * @Author: your name
+ * @Date: 2021-09-18 15:19:29
+ * @LastEditTime: 2021-12-02 09:28:23
+ * @LastEditors: Please set LastEditors
+ * @Description: 筛选条件的 formItems 和 propFormData
+ * @FilePath: \hyyfClient\src\views\BioSafety\personAdmin\queryCondition.config.js
+ */
+import { timeDate } from '../../../utils/index'
+
+export const formItems = [
+  // {
+  //   type: 'select',
+  //   label: '位置：',
+  //   placeholder: '请选择位置',
+  //   field: 'place',
+  //   options: []
+  // },
+  {
+    type: 'datepicker',
+    label: '时间：',
+    placeholder: ['开始时间', '结束时间'],
+    field: 'time'
+  }
+]
+
+export const propFormData = {
+  // place: '',
+  time: [timeDate(new Date().getTime() - 1000*60*60*24), timeDate(new Date().getTime())]
+}

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

@@ -0,0 +1,39 @@
+/*
+ * @Author: your name
+ * @Date: 2021-09-18 16:06:51
+ * @LastEditTime: 2021-12-17 14:31:32
+ * @LastEditors: Please set LastEditors
+ * @Description: 表格的配置
+ * @FilePath: \hyyfClient\src\views\BioSafety\personAdmin\table.config.js
+ */
+export const title = '数据列表'
+
+export const tableItems = [
+  {
+    prop: 'alarmDate',
+    label: '开始时间',
+    minWidth: '100',
+    slotName: 'alarmDate'
+  },
+  {
+    prop: 'alarmPicture',
+    label: '图片',
+    width: '300',
+    slotName: 'alarmPicture'
+  },
+  {
+    prop: 'alarmPosition',
+    label: '位置',
+    minWidth: '150',
+    slotName: 'alarmPosition'
+  },
+  {
+    label: '操作',
+    minWidth: '100',
+    slotName: 'handler'
+  }
+]
+
+export const tableShows = {
+  showIndex: false, showSelect: false
+}

src/views/DeviceMana/Device.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2021-12-07 14:27:28
- * @LastEditTime: 2021-12-17 10:26:32
+ * @LastEditTime: 2021-12-17 11:17:44
  * @LastEditors: Please set LastEditors
  * @Description: 设备管理页面
  * @FilePath: \hyyfClient\src\views\DeviceMana\Device.vue