From c827d1518bc30e76259f59186ef10bfc8a989294 Mon Sep 17 00:00:00 2001
From: 648540858 <648540858@qq.com>
Date: 星期一, 13 六月 2022 23:02:53 +0800
Subject: [PATCH] #510 jessibuca分屏监控异常

---
 web_src/src/components/channelList.vue |   62 ++++++++++++++++++-------------
 1 files changed, 36 insertions(+), 26 deletions(-)

diff --git a/web_src/src/components/channelList.vue b/web_src/src/components/channelList.vue
index 7e0637c..832275a 100644
--- a/web_src/src/components/channelList.vue
+++ b/web_src/src/components/channelList.vue
@@ -39,21 +39,22 @@
     </el-table-column>
     <el-table-column label="蹇収" width="80" align="center">
       <template slot-scope="scope">
-        <img style="max-height: 3rem;max-width: 4rem;"
-             v-if="scope.row.subCount === 0 && scope.row.parental === 0"
-             :id="scope.row.deviceId + '_' + scope.row.channelId"
-             :src="getSnap(scope.row)"
-             @error="getSnapErrorEvent($event.target.id)"
-             alt="">
-        <!--                    <el-image-->
-        <!--                      :id="'snapImg_' + scope.row.deviceId + '_' + scope.row.channelId"-->
-        <!--                      :src="getSnap(scope.row)"-->
-        <!--                      @error="getSnapErrorEvent($event, scope.row)"-->
-        <!--                      :fit="'contain'">-->
-        <!--                      <div slot="error" class="image-slot">-->
-        <!--                        <i class="el-icon-picture-outline"></i>-->
-        <!--                      </div>-->
-        <!--                    </el-image>-->
+<!--        <img style="max-height: 3rem;max-width: 4rem;"-->
+<!--             v-if="scope.row.subCount === 0 && scope.row.parental === 0"-->
+<!--             :deviceId="scope.row.deviceId"-->
+<!--             :channelId="scope.row.channelId"-->
+<!--             :src="getSnap(scope.row)"-->
+<!--             @error="getSnapErrorEvent($event.target.deviceId, $event.target.channelId)"-->
+<!--             alt="">-->
+                  <el-image
+                    :src="getSnap(scope.row)"
+                    :preview-src-list="getBigSnap(scope.row)"
+                    @error="getSnapErrorEvent(scope.row.deviceId, cope.row.channelId)"
+                    :fit="'contain'">
+                    <div slot="error" class="image-slot">
+                      <i class="el-icon-picture-outline"></i>
+                    </div>
+                  </el-image>
       </template>
     </el-table-column>
     <el-table-column prop="subCount" label="瀛愯妭鐐规暟">
@@ -220,13 +221,14 @@
         method: 'get',
         url: '/api/play/start/' + deviceId + '/' + channelId
       }).then(function (res) {
+        console.log(res)
         that.isLoging = false;
         if (res.data.code === 0) {
 
           setTimeout(() => {
 
             let snapId = deviceId + "_" + channelId;
-            that.loadSnap[snapId] = 0;
+            that.loadSnap[deviceId + channelId] = 0;
             that.getSnapErrorEvent(snapId)
           }, 5000)
           that.$refs.devicePlayer.openDialog("media", deviceId, channelId, {
@@ -237,14 +239,17 @@
             that.initData();
           }, 1000)
 
-        } else {
+        }else{
           that.$message.error(res.data.msg);
         }
       }).catch(function (e) {
+        console.error(e)
+        that.isLoging = false;
+        // that.$message.error("璇锋眰瓒呮椂");
       });
     },
     queryRecords: function (itemData) {
-      var format = moment().format("YYYY-M-D");
+      var format = moment().format("yyyy-MM-DD");
       let deviceId = this.deviceId;
       let channelId = itemData.channelId;
       this.$refs.devicePlayer.openDialog("record", deviceId, channelId, {date: format})
@@ -265,19 +270,24 @@
       });
     },
     getSnap: function (row) {
-      return '/static/snap/' + row.deviceId + '_' + row.channelId + '.jpg'
+      let url = (process.env.NODE_ENV === 'development'? "debug": "") + '/api/device/query/snap/' + row.deviceId + '/' + row.channelId
+      return url
     },
-    getSnapErrorEvent: function (id) {
+    getBigSnap: function (row) {
+      return [this.getSnap(row)]
+    },
+    getSnapErrorEvent: function (deviceId, channelId) {
 
-      if (typeof (this.loadSnap[id]) != "undefined") {
-        console.log("涓嬭浇鎴浘" + this.loadSnap[id])
-        if (this.loadSnap[id] > 5) {
-          delete this.loadSnap[id];
+      if (typeof (this.loadSnap[deviceId + channelId]) != "undefined") {
+        console.log("涓嬭浇鎴浘" + this.loadSnap[deviceId + channelId])
+        if (this.loadSnap[deviceId + channelId] > 5) {
+          delete this.loadSnap[deviceId + channelId];
           return;
         }
         setTimeout(() => {
-          this.loadSnap[id]++
-          document.getElementById(id).setAttribute("src", '/static/snap/' + id + '.jpg?' + new Date().getTime())
+          let url = (process.env.NODE_ENV === 'development'? "debug": "") + '/api/device/query/snap/' + deviceId + '/' + channelId
+          this.loadSnap[deviceId + channelId]++
+          document.getElementById(deviceId + channelId).setAttribute("src", url + '?' + new Date().getTime())
         }, 1000)
 
       }

--
Gitblit v1.8.0