监控视频回放

packages/IntelligentSecurity/components/AiSlwVideo.vue

@@ -12,7 +12,7 @@
       :id="iframeId"
       allow="autoplay *; microphone *; fullscreen *" allowfullscreen allowtransparency key="" allowusermedia frameBorder="no"
       style="width: 100%; height: 100%;"
-      :src="`https://cdn.cunwuyun.cn/slw2.0/index.html?url=${isLiveing ? src : replayUrl}`">
+      :src="`https://cdn.cunwuyun.cn/slw2.0/index.html?url=${src}`">
     </iframe>
     <div class="slw-bottom" v-if="isShowBar">
       <Timeline class="Timeline" v-if="times.length" :times="times" @replay="onReplay" :isLiveing="isLiveing" :width="width" ref="timeline" :style="{width: width}"></Timeline>
@@ -45,9 +45,9 @@
             <div class="live" v-if="isLiveing">
               <span class="label"></span>
               <i>直播中</i>
-              <em>{{ form.date }}</em>
+              <em>{{ date }}</em>
             </div>
-            <div v-else class="back-btn" @click="backLiving">回到直播</div>
+            <div v-else class="back-btn" @click="backLiveing">回到直播</div>
           </div>
         </div>
         <div class="right">
@@ -86,7 +86,7 @@
   import Timeline from './Timeline'
 
   export default {
-    props: ['name', 'isShowBar', 'instance', 'id', 'deviceId'],
+    props: ['name', 'isShowBar', 'instance', 'id', 'playbackUrls'],
 
     name: 'slwVideo',
 
@@ -105,7 +105,6 @@
         form: {
           date: ''
         },
-        src: '',
         isLoading: false,
         times: [],
         date: '',
@@ -115,7 +114,22 @@
         videoId: `slwvideo-${new Date().getTime()}`,
         iframeId: `video-${new Date().getTime()}`,
         isFullscreen: false,
-        replayUrl: ''
+        replayUrl: '',
+        liveingUrl: ''
+      }
+    },
+
+    computed: {
+      src () {
+        if (this.playbackUrls.length) {
+          return this.playbackUrls.filter(v => v.id === this.id)[0].playbackUrl
+        }
+
+        if (this.isLiveing) {
+          return this.liveingUrl
+        }
+
+        return this.replayUrl
       }
     },
 
@@ -129,9 +143,7 @@
               this.isShow = true
             })
           }
-        },
-        immediate: true,
-        deep: true
+        }
       }
     },
 
@@ -155,7 +167,7 @@
         document.removeEventListener('fullscreenchange', this.fullScreenChange)
       },
 
-      backLiving () {
+      backLiveing () {
         this.getLiveingUrl()
       },
 
@@ -163,7 +175,7 @@
         this.isLoading = true
         this.instance.post(`/app/appzyvideoequipment/getWebSdkUrl?deviceId=${this.id}`).then(res => {
           if (res.data) {
-            this.src = res.data
+            this.liveingUrl = res.data
             this.isLiveing = true
           }
 
@@ -179,7 +191,7 @@
           params: {
             ids: this.id,
             startTime: `${this.form.date} ${e}`,
-            endTime: this.form.date + ` ${Number(e.substr(0, 2)) + 6 > 9 ? Number(e.substr(0, 2)) + 6 : '0' + (Number(e.substr(0, 2)) + 6)}:59:59`,
+            endTime: this.form.date + ` ${Number(e.substr(0, 2)) + 6 > 9 ? Number(e.substr(0, 2)) + 6 : '0' + (Number(e.substr(0, 2)) + 6)}:00:00`,
             nvrCodes: ''
           }
         }).then(res => {
@@ -259,6 +271,7 @@
       onConfirm () {
         this.$refs.form.validate((valid) => {
           if (valid) {
+            this.date = this.form.date
             this.isShowDate = false
             this.getSlwPlaybackTime()
           }