瀏覽代碼

关联视频及特勤视频点击后自动播放,移除多余播放按钮

  - IntersectionMapVideos: 四角关联视频添加 autoplay 属性
  - XgVideoPlayer: autoplay 模式下隐藏自定义播放按钮
  - SecurityRoutePanelSwitch/Small: 特勤主视频添加 autoplay 属性
  - VideoMonitorBox: 视频添加 autoplay 属性
画安 3 周之前
父節點
當前提交
8c342fb85d

+ 4 - 4
src/components/ui/IntersectionMapVideos.vue

@@ -6,7 +6,7 @@
       
       <div v-if="videoUrls.nw" class="video-corner top-left">
         <template v-if="activeVideos.nw">
-          <XgVideoPlayer :src="videoUrls.nw" />
+          <XgVideoPlayer :src="videoUrls.nw" :autoplay="true" />
           <div class="close-btn" title="关闭视频" @click="closeVideo('nw')">✕</div>
         </template>
         <div v-else class="empty-state" @click="openVideo('nw')" title="点击关联视频">
@@ -17,7 +17,7 @@
 
       <div v-if="videoUrls.ne" class="video-corner top-right">
         <template v-if="activeVideos.ne">
-          <XgVideoPlayer :src="videoUrls.ne" />
+          <XgVideoPlayer :src="videoUrls.ne" :autoplay="true" />
           <div class="close-btn" title="关闭视频" @click="closeVideo('ne')">✕</div>
         </template>
         <div v-else class="empty-state" @click="openVideo('ne')" title="点击关联视频">
@@ -28,7 +28,7 @@
 
       <div v-if="videoUrls.sw" class="video-corner bottom-left">
         <template v-if="activeVideos.sw">
-          <XgVideoPlayer :src="videoUrls.sw" />
+          <XgVideoPlayer :src="videoUrls.sw" :autoplay="true" />
           <div class="close-btn" title="关闭视频" @click="closeVideo('sw')">✕</div>
         </template>
         <div v-else class="empty-state" @click="openVideo('sw')" title="点击关联视频">
@@ -39,7 +39,7 @@
 
       <div v-if="videoUrls.se" class="video-corner bottom-right">
         <template v-if="activeVideos.se">
-          <XgVideoPlayer :src="videoUrls.se" />
+          <XgVideoPlayer :src="videoUrls.se" :autoplay="true" />
           <div class="close-btn" title="关闭视频" @click="closeVideo('se')">✕</div>
         </template>
         <div v-else class="empty-state" @click="openVideo('se')" title="点击关联视频">

+ 1 - 1
src/components/ui/SecurityRoutePanelSwitch.vue

@@ -28,7 +28,7 @@
           <div class="route-card" v-for="route in visibleRoutes" :key="route.id">
             
             <div class="card-top-video">
-              <XgVideoPlayer :src="route.mainVideo" />
+              <XgVideoPlayer :src="route.mainVideo" :autoplay="true" />
             </div>
 
             <div class="card-bottom-content">

+ 1 - 1
src/components/ui/SecurityRoutePanelSwitchSmall.vue

@@ -33,7 +33,7 @@
           <div class="route-card" v-for="route in visibleRoutes" :key="route.id">
             
             <div class="card-top-video">
-              <XgVideoPlayer :src="route.mainVideo" />
+              <XgVideoPlayer :src="route.mainVideo" :autoplay="true" />
             </div>
 
             <div class="card-bottom-content">

+ 1 - 1
src/components/ui/VideoMonitorBox.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="video-box">
     <template v-if="videoSrc">
-      <XgVideoPlayer :src="videoSrc" />
+      <XgVideoPlayer :src="videoSrc" :autoplay="true"/>
       <div class="close-btn" title="关闭视频" @click="handleClose">✕</div>
     </template>
     

+ 1 - 1
src/components/ui/XgVideoPlayer.vue

@@ -1,6 +1,6 @@
 <template>
     <div class="xg-video-player" ref="container">
-        <div v-if="paused" class="play-overlay" @click.stop="play">
+        <div v-if="paused && !autoplay" class="play-overlay" @click.stop="play">
             <svg class="play-icon" viewBox="0 0 48 48" fill="none"><circle cx="24" cy="24" r="23" fill="rgba(0,0,0,0.5)" stroke="rgba(255,255,255,0.8)" stroke-width="2"/><polygon points="18,14 36,24 18,34" fill="rgba(255,255,255,0.9)"/></svg>
         </div>
     </div>