马宇豪
2024-07-08 20b0ce2db27b64a60de60aee05dedd448099e330
src/views/riskWarningSys/warningBigScreen/components/monitor.vue
@@ -1,8 +1,9 @@
<template>
   <div class="charts-cont">
      <div class="monitor" :id="monitor">
         <div>
            <img src="../../../../assets/warningScreen/video.png">
      <div class="monitor">
         <div style="width: 100%;height: 100%">
<!--            <img src="../../../../assets/warningScreen/video.png">-->
        <iframe class="video" style="width: 100%;height: 100%" :src="'http://36.108.169.10:8088/808gps/open/player/video.html?lang=zh&devIdno=' + videoUrl + '&&account=gtxh&password=000000'"></iframe>
         </div>
      </div>
   </div>
@@ -20,31 +21,58 @@
   import { workApplyApi } from '/@/api/specialWorkSystem/workApply';
   import * as echarts from 'echarts';
   import '/@/theme/bigScreen.css'
  import {videoApi} from "/@/api/systemManage/video";
   interface stateType {
    videoList: [],
    listQuery: {}
    videoUrl: string
   }
   export default defineComponent({
      name: 'monitor',
      components: {},
      props:['allData'],
      setup() {
      props: [''],
      setup(props,context) {
         const userInfo = useUserInfo()
         const { userInfos } = storeToRefs(userInfo);
         const monitor = ref("eChartMon" + Date.now() + Math.random())
         const state = reactive<stateType>({
        videoList: [],
        listQuery: {
          bizDepId: null,
          name: '',
          shortName: '',
          pageIndex: 1,
          pageSize: 999
        },
        videoUrl: ''
         })
      onMounted(() => {
        getVideoTableData()
      })
         // 页面载入时执行方法
         onMounted(() => {
         });
      const getVideoTableData = async () => {
        let res = await videoApi().getVideoList(state.listQuery);
        if (res.data.code === '200') {
          state.videoList = res.data.data
          state.videoUrl = state.videoList[0].deviceNo
          context.emit('getData',state.videoList)
        } else {
          ElMessage({
            type: 'warning',
            message: res.data.msg
          });
        }
      }
      const changeVideo = (no)=>{
        state.videoUrl = no
      }
         return {
            monitor,
            Search,
        getVideoTableData,
        changeVideo,
            ...toRefs(state)
         };
      },