个人中心视频预览

front/src/views/personalCenter/components/AbilityApplication.vue

@@ -193,7 +193,7 @@
                     v-if="
                       item.approveStatus == '通过' && whoShow1.itShowXiHaiAn
                     "
-                    @click.stop="openVideo(val)"
+                    @click.stop="getVideoUrl(val)"
                   >
                     视频预览
                   </a-button>
@@ -280,7 +280,7 @@
       wrapClassName="single-preview-modal"
       v-model:visible="visible"
       title="视频预览"
-      :width="960"
+      :width="1000"
       destroyOnClose
     >
       <template #footer></template>
@@ -299,7 +299,8 @@
           <div class="waterMark waterMark-right-bottom">
             {{ userInfo.realNameShow }}
           </div>
-          <vue3VideoPlay v-bind="options" />
+          <!-- <vue3VideoPlay v-bind="options" /> -->
+          <h5-player :video-url="videoUrl"></h5-player>
         </div>
       </div>
     </a-modal>
@@ -313,6 +314,8 @@
   import { useRouter } from 'vue-router'
   import { getStreamByChannelCode } from '@/api/videoSurveillance'
   import { getUser } from '@/api/home'
+  import H5Player from '@/views/home/components/H5Player.vue'
+  import {getCameraLiveStream} from '@/api/file'
   const router = useRouter()
   const backUrl = ref(window.SITE_CONFIG.apiURL + '/')
   const props = defineProps({
@@ -511,6 +514,20 @@
       }
     }
   }
+
+   const videoUrl = ref('')
+  //获取视频控件所需播放地址
+   const getVideoUrl = (data) =>{
+    debugger
+      let param = data;
+      getCameraLiveStream(param).then((res) => {
+      //console.log('555555rrrrr',res)
+      if(res.data.data){
+        videoUrl.value = res.data.data.url;
+      }
+         visible.value = true
+      })
+      }
   // 视频预览
   const openVideo = (item) => {
     console.log('打开视频', item)