111

src/utils/api.js

@@ -623,3 +623,12 @@ export function getSevenEnv(data) {
     params: data
   })
 }
+
+/** 时间提醒 **/
+export function getEventList(data) {
+  return axios({
+    url: 'http://192.168.1.171:8089/client/event/ListAllEvent',
+    method: 'post',
+    data: data
+  })
+}

src/views/Alarm/EventRem.vue

@@ -3,8 +3,6 @@
     <div class="reply" :style="{ color: color }">筛选查询</div>
     <x-form
       :formItems="selectItems"
-      :day="day"
-      @setDay="setDay"
       @onClickType="onClickType"
     ></x-form>
     <new-table
@@ -24,6 +22,23 @@
       @sizeChange="sizeChange"
       @pageChange="pageChange"
     ></table-footer>
+    <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>
 
@@ -32,6 +47,9 @@ import { mapState } from "vuex";
 import XForm from "@/components/XForm";
 import NewTable from "@/components/newTable/NewTable";
 import TableFooter from "@/components/TableFooter";
+import {getEventList, getFaceToken} from "../../utils/api";
+import {getCarWashVideo} from "../../utils/chenApi";
+
 export default {
   name: "EventRem",
   computed: {
@@ -47,27 +65,6 @@ export default {
       day: 2,
       selectItems: [
         {
-          id: 3,
-          type: "text",
-          text: "今日",
-          value: 1,
-          col: 1,
-        },
-        {
-          id: 4,
-          type: "text",
-          text: "本周",
-          value: 2,
-          col: 1,
-        },
-        {
-          id: 5,
-          type: "text",
-          text: "本月",
-          value: 3,
-          col: 1,
-        },
-        {
           id: 6,
           type: "datepicker",
           placeholder: [],
@@ -99,22 +96,22 @@ export default {
       ],
       tableItems: [
         {
-          prop: "time",
+          prop: "alarmDate",
           label: "时间",
           minWidth: "100",
-          slotName: "time",
+          slotName: "alarmDate",
         },
         {
-          prop: "location",
+          prop: "alarmPosition",
           label: "位置",
           minWidth: "100",
-          slotName: "location",
+          slotName: "alarmPosition",
         },
         {
-          prop: "content",
+          prop: "alarmTypeName",
           label: "内容",
           minWidth: "100",
-          slotName: "content",
+          slotName: "alarmTypeName",
         },
         {
           label: "操作",
@@ -129,6 +126,10 @@ export default {
       total: 0,
       pageNum: 1,
       pageSize: 20,
+      alarmStartDateString: '',
+      alarmEndDateString: '',
+      rtsp: '',
+      videoVisible: false,
     };
   },
   methods: {
@@ -142,13 +143,54 @@ export default {
       this.pageNum = val;
       this.init();
     },
-    init() {},
+    init() {
+      let params = {
+        alarmStartDateString: this.alarmStartDateString ? this.alarmStartDateString + ' 00:00:00' : '',
+        alarmEndDateString: this.alarmEndDateString ? this.alarmEndDateString + ' 23:59:59' : '',
+        pageNum: this.pageNum,
+        pageSize: this.pageSize
+      }
+      getEventList(params).then(async res => {
+        if(res.code === 0) {
+          const result = JSON.parse(res.data.result);
+          this.list = result.data.pageData;
+          this.total = parseInt(res.total);
+          // const { token } = await getFaceToken();
+          // this.list.forEach((item) => {
+          //   item.alarmPicture = `https://36.26.62.70:447/evo-pic/${item.alarmPicture}?token=${token}&oss_addr=172.16.3.223:8925`;
+          // });
+        }
+      })
+    },
     setDay(data) {
       this.day = data.type;
     },
-    onClickType() {},
-    open() {},
+    onClickType(data) {
+      if(data.type === 'search') {
+        if(data.value1) {
+          this.alarmStartDateString = data.value[0];
+          this.alarmStartDateString = data.value[1];
+        }
+        this.init()
+      }
+    },
+    open(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("视频获取失败");
+        }
+      });
+    },
   },
+  mounted() {
+    this.init()
+  }
 };
 </script>