视频自动播放

src/components/HKVideo/index.vue

@@ -2,7 +2,7 @@
   <div class="dot-box" :style="{ width: width ? width + 'px' : '100%', height: height ? height + 'px' : '100%' }">
     <div class="video-box" @click="play_now">
       <HikvisionPlayer
-        v-if="isPlaying"
+        v-if="isPlaying || autoplay"
         ref="videoPlayer"
         style="width: 100%; height: 100%; object-fit: fill"
         @on-playing="onHkPlaying"
@@ -30,7 +30,8 @@ import { getVideoUrlById } from '@/api/videoMonitor';
 const props = defineProps({
   dot_data: Object,
   width: Number,
-  height: Number
+  height: Number,
+  autoplay: Boolean
 });
 
 const play = () => {
@@ -67,7 +68,6 @@ const isShowTooltip = async () => {
     isShowTip.value = false;
   }
 };
-
 const onHkPlaying = async () => {
   console.log('onHkPlaying');
   errBKVisible.value = false;
@@ -104,6 +104,11 @@ const stop_now = async () => {
   posterVisible.value = true;
 };
 
+onMounted(() => {
+  if (!!props.autoplay) {
+    play_now();
+  }
+});
 </script>
 
 <style lang="scss" scoped>

src/views/emergencyCommandMap/LeftSection/VideoMonitor.vue

@@ -4,7 +4,7 @@
     <div class="more-btn" @click="showVideoMonitorList">查看更多</div>
     <div class="card-content video-list">
       <div v-for="(item, index) in listData" :key="index" class="video-box">
-        <HKVideo :dot_data="item" :width="560" :height="256" />
+        <HKVideo :dot_data="item" :width="560" :height="256" autoplay />
         <div class="video-label">
           <span class="label">{{ item.name }}</span>
         </div>