From c35932e24cf9dda9ef396ab5a45fb1a6e5539748 Mon Sep 17 00:00:00 2001
From: 648540858 <648540858@qq.com>
Date: 星期五, 29 十月 2021 11:22:22 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/wvp-28181-2.0' into wvp-28181-2.0

---
 web_src/src/components/channelList.vue |  151 ++++++++++++++++++++++++++++++--------------------
 1 files changed, 90 insertions(+), 61 deletions(-)

diff --git a/web_src/src/components/channelList.vue b/web_src/src/components/channelList.vue
index b06ce25..3891ab5 100644
--- a/web_src/src/components/channelList.vue
+++ b/web_src/src/components/channelList.vue
@@ -1,7 +1,6 @@
 <template>
 <div id="channelList">
     <el-container>
-
         <el-header>
             <uiHeader></uiHeader>
         </el-header>
@@ -31,9 +30,27 @@
             <el-table ref="channelListTable" :data="deviceChannelList" :height="winHeight" border style="width: 100%">
                 <el-table-column prop="channelId" label="閫氶亾缂栧彿" width="210">
                 </el-table-column>
-                <el-table-column prop="channelId" label="璁惧缂栧彿" width="210">
+                <el-table-column prop="deviceId" label="璁惧缂栧彿" width="210">
                 </el-table-column>
                 <el-table-column prop="name" label="閫氶亾鍚嶇О">
+                </el-table-column>
+                <el-table-column label="蹇収" width="80" align="center">
+                  <template slot-scope="scope">
+                    <img style="max-height: 3rem;max-width: 4rem;"
+                         :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>-->
+                  </template>
                 </el-table-column>
                 <el-table-column prop="subCount" label="瀛愯妭鐐规暟">
                 </el-table-column>
@@ -101,7 +118,8 @@
             total: 0,
             beforeUrl: "/deviceList",
             isLoging: false,
-            autoList: true
+            autoList: true,
+            loadSnap:{}
         };
     },
 
@@ -118,12 +136,11 @@
     },
     methods: {
         initData: function () {
-            if (this.parentChannelId == "" || this.parentChannelId == 0) {
+            if (typeof (this.parentChannelId) == "undefined" ||  this.parentChannelId == 0) {
                 this.getDeviceChannelList();
             } else {
                 this.showSubchannels();
             }
-
         },
         initParam: function () {
             this.deviceId = this.$route.params.deviceId;
@@ -137,7 +154,6 @@
         },
         currentChange: function (val) {
             var url = `/${this.$router.currentRoute.name}/${this.deviceId}/${this.parentChannelId}/${this.count}/${val}`
-            console.log(url)
             this.$router.push(url).then(() => {
                 this.initParam();
                 this.initData();
@@ -153,34 +169,31 @@
         },
         getDeviceChannelList: function () {
             let that = this;
-
-            this.$axios.get(`/api/devices/${this.$route.params.deviceId}/channels`, {
-                    params: {
-                        page: that.currentPage,
+            if (typeof (this.$route.params.deviceId) == "undefined") return;
+            this.$axios({
+                method: 'get',
+                url: `/api/device/query/devices/${this.$route.params.deviceId}/channels`,
+                params:{
+						page: that.currentPage,
                         count: that.count,
                         query: that.searchSrt,
                         online: that.online,
                         channelType: that.channelType
-                    }
-                })
-                .then(function (res) {
-                    console.log(res);
+					}
+            }).then(function (res) {
                     that.total = res.data.total;
                     that.deviceChannelList = res.data.list;
                     // 闃叉鍑虹幇琛ㄦ牸閿欎綅
                     that.$nextTick(() => {
                         that.$refs.channelListTable.doLayout();
                     })
-                })
-                .catch(function (error) {
-                    console.log(error);
-                });
-
+            }).catch(function (error) {
+                console.log(error);
+            });
         },
 
         //閫氱煡璁惧涓婁紶濯掍綋娴�
         sendDevicePush: function (itemData) {
-            console.log(itemData);
             let deviceId = this.deviceId;
             this.isLoging = true;
             let channelId = itemData.channelId;
@@ -188,20 +201,24 @@
             let that = this;
             this.$axios({
                 method: 'get',
-                url: '/api/play/' + deviceId + '/' + channelId
+                url: '/api/play/start/' + deviceId + '/' + channelId
             }).then(function (res) {
-                console.log(res.data)
-                let streamId = res.data.streamId;
                 that.isLoging = false;
-                if (!!streamId) {
-                    // that.$refs.devicePlayer.play(res.data, deviceId, channelId, itemData.hasAudio);
-                    that.$refs.devicePlayer.openDialog("media", deviceId, channelId, {
-                        streamInfo: res.data,
-                        hasAudio: itemData.hasAudio
-                    });
-                    that.initData();
-                } else {
-                    that.$message.error(res.data);
+                if (res.data.code == 0) {
+
+                  setTimeout(()=>{
+                    console.log("涓嬭浇鎴浘")
+                    let snapId = deviceId + "_" + channelId;
+                    that.loadSnap[snapId] = 0;
+                    that.getSnapErrorEvent(snapId)
+                  },5000)
+                  that.$refs.devicePlayer.openDialog("media", deviceId, channelId, {
+                    streamInfo: res.data.data,
+                    hasAudio: itemData.hasAudio
+                  });
+                  that.initData();
+                }else {
+                  that.$message.error(res.data.msg);
                 }
             }).catch(function (e) {});
         },
@@ -212,23 +229,38 @@
             this.$refs.devicePlayer.openDialog("record", deviceId, channelId, {date: format})
         },
         stopDevicePush: function (itemData) {
-            console.log(itemData)
             var that = this;
             this.$axios({
-                method: 'post',
-                url: '/api/play/' + itemData.streamId + '/stop'
+                method: 'get',
+                url: '/api/play/stop/' + this.deviceId + "/" + itemData.channelId
             }).then(function (res) {
-                console.log(JSON.stringify(res));
                 that.initData();
             }).catch(function (error) {
-              if (error.response.status == 402) { // 宸茬粡鍋滄杩�
+              if (error.response.status === 402) { // 宸茬粡鍋滄杩�
                 that.initData();
               }else {
-                console.log(e)
+                console.log(error)
               }
             });
         },
+        getSnap: function (row){
+          return '/static/snap/' + row.deviceId + '_' + row.channelId + '.jpg'
+        },
+        getSnapErrorEvent: function (id){
 
+          if (typeof (this.loadSnap[id]) != "undefined") {
+            console.log("涓嬭浇鎴浘" + this.loadSnap[id])
+            if (this.loadSnap[id] > 5) {
+              delete this.loadSnap[id];
+              return;
+            }
+            setTimeout(()=>{
+              this.loadSnap[id] ++
+              document.getElementById(id).setAttribute("src", '/static/snap/' + id + '.jpg?' + new Date().getTime())
+            },1000)
+
+          }
+        },
         showDevice: function () {
             this.$router.push(this.beforeUrl).then(() => {
                 this.initParam();
@@ -236,7 +268,6 @@
             })
         },
         changeSubchannel(itemData) {
-            console.log(this.$router.currentRoute)
             this.beforeUrl = this.$router.currentRoute.path;
 
             var url = `/${this.$router.currentRoute.name}/${this.$router.currentRoute.params.deviceId}/${itemData.channelId}/${this.$router.currentRoute.params.count}/1`
@@ -251,38 +282,36 @@
         showSubchannels: function (channelId) {
             let that = this;
 
-            this.$axios.get(`/api/subChannels/${this.deviceId}/${this.parentChannelId}/channels`, {
-                    params: {
-                        page: that.currentPage,
-                        count: that.count,
-                        query: that.searchSrt,
-                        online: that.online,
-                        channelType: that.channelType
-                    }
+            this.$axios({
+                method: 'get',
+                url:`/api/device/query/sub_channels/${this.deviceId}/${this.parentChannelId}/channels`,
+                params: {
+                    page: that.currentPage,
+                    count: that.count,
+                    query: that.searchSrt,
+                    online: that.online,
+                    channelType: that.channelType
+                }
+            }).then(function (res) {
+                that.total = res.data.total;
+                that.deviceChannelList = res.data.list;
+                // 闃叉鍑虹幇琛ㄦ牸閿欎綅
+                that.$nextTick(() => {
+                    that.$refs.channelListTable.doLayout();
                 })
-                .then(function (res) {
-                    that.total = res.data.total;
-                    that.deviceChannelList = res.data.list;
-                    // 闃叉鍑虹幇琛ㄦ牸閿欎綅
-                    that.$nextTick(() => {
-                        that.$refs.channelListTable.doLayout();
-                    })
-                })
-                .catch(function (error) {
-                    console.log(error);
-                });
+            }).catch(function (error) {
+                console.log(error);
+            });
         },
         search: function () {
-            console.log(this.searchSrt)
             this.currentPage = 1;
             this.total = 0;
             this.initData();
         },
         updateChannel: function (row) {
-            console.log(row)
             this.$axios({
                 method: 'post',
-                url: `/api/channel/update/${this.deviceId}`,
+                url: `/api/device/query/channel/update/${this.deviceId}`,
                 params: row
             }).then(function (res) {
                 console.log(JSON.stringify(res));

--
Gitblit v1.8.0