样式调整

src/components/UeVideo.vue

@@ -1,6 +1,7 @@
 
 <template>
   <div ref="video" id="player"></div>
+  <Login :class="loginShow ? '' : 'hidden'"></Login>
   <home></home>
   <!-- <div @click="toUE" style="position: absolute;top: 5%; left: 50%;background-color: darkcyan;z-index: 200">向UE发信息</div> -->
 </template>
@@ -17,13 +18,26 @@ export default {
   setup(props, context) {
     let video = ref(null);
     let videoInstance = ref(null);
+    const loginShow = ref(true);
+    // 获取用户信息
+    const getUserInfo = (url) => {
+      let userurl = "   https://weizhi.huanghuai.edu.cn/cmccr-server/center/cas/v1/getUser?casLoginUrl=https://cas.huanghuai.edu.cn/cas/serviceValidate?"
+        + url + "&service=https://weizhi.huanghuai.edu.cn/cmips/"
+      // axios.get(userurl).then(res => {
 
+      // })
+      console.log("是否有url", url)
+      if (url) {
+        loginShow.value = false
+      }
+
+    }
     onMounted(() => {
 
       videoInstance = initLoad({
         context,
         serverUrl: window.g.UE_IP,
-        autoConnection: false,
+        autoConnection: true,
         showPlayOverlay: true,
         qualityControl: true,
         inputOptions: {
@@ -33,6 +47,19 @@ export default {
       });
       console.log("video.videoInstance", videoInstance);
 
+      let search = window.location.href.split("?")[1];
+      getUserInfo(search)
+      // console.log(search, "编码")
+      // let code = result.split("?")[0]; //去掉&之后的冗余部分
+
+      // console.log(result);
+      // // window.addEventListener('hashchange', pathChange);
+      // const searchParams = currentUrl.searchParams;
+      // let ticket = searchParams.get("ticket"); // 'devpoint'
+      // console.log("ticket", ticket);
+      // searchParams.get("page"); // '1'
+
+
     });
     // function handleResponseFunction(data) {
     //   console.log("从UE返回过来的值", data)
@@ -47,7 +74,7 @@ export default {
 
     return {
       video,
-      toUE
+      loginShow
     };
   },
 };
@@ -59,4 +86,8 @@ export default {
   position: absolute;
   overflow: hidden;
 }
+
+.hidden {
+  display: none;
+}
 </style>

src/components/home.vue

@@ -1,5 +1,4 @@
 <template>
-    <!-- <Login></Login> -->
     <div class="container">
         <div class="header">
             <img :src="headImg" alt="" />
@@ -7,20 +6,14 @@
         <el-container>
             <left></left>
             <right></right>
-            <div ref="linedomRef"
+            <div ref="linedomRef" style="width:1px;height:1px;position: absolute;z-index: 228;background:#ccc;">
-                style="width:1px;height:1px;position: absolute;z-index: 228;border-radius:15px;background:#ccc;border: 1px solid darkcyan;">
             </div>
 
         </el-container>
-
-
-
         <div ref="popoverRef" id="popoverRef" class="modelInfo">
             <div class="model-detail">
-
                 <span v-for="item in classDeviceInfo">
-                    <!-- {{ item }} -->
+
-                    <!-- {{ item.value === "在线" }} -->
                     <span class="title">{{ item && item.name }}： </span>
                     <span :class="item.online ? 'green' : item.online == 'false' ? 'red' : ''">{{ item && item.value }}
                     </span>
@@ -31,7 +24,7 @@
 
 
         <!-- 视频播放弹框 -->
-        <el-dialog class="videoDialog" v-model="videoDialog" title="互动教师1" width="60%" align="center" top="4%">
+        <el-dialog class="videoDialog" v-model="videoDialog" :title="titleDialog" width="60%" align="center" top="4%">
             <videoPlay v-bind="videoData" @play="onPlay" />
         </el-dialog>
     </div>
@@ -58,13 +51,15 @@ export default ({
     name: 'Histogram',
     components: { Login, Left, Right, ElScrollbar, ElPagination, ElDialog, videoPlay, ElCarousel, ElCarouselItem, CircleProgress },
     setup() {
+        const titleDialog = ref("")
         // 视频数据
         const videoData = reactive({
             width: "100%", //播放器高度
             height: "100%", //播放器高度
             color: "red", //主题色
             title: "互动教室", //视频名称
-            src: "https://cdn.jsdelivr.net/gh/xdlumia/files/video-play/IronMan.mp4", //视频源
+            // src: "https://cdn.jsdelivr.net/gh/xdlumia/files/video-play/IronMan.mp4", //视频源
+            src: '',
             muted: false, //静音
             webFullScreen: false,
             // speedRate: ["0.75", "1.0", "1.25", "1.5", "2.0"], //播放倍速
@@ -119,7 +114,6 @@ export default ({
         const videoDialog = ref(false)
         // 播放视频
         const lookVideo = function () {
-
             videoDialog.value = true;
             console.log("点击了播放视频", 12312312)
         }
@@ -167,26 +161,25 @@ export default ({
         }
         const handleResponseFunction = (data) => {
             // console.log("从UE返回过来的值", data)
-            console.log("重新变了坐标", 2423423423);
             let json = eval("(" + data + ")");//转对象
-            clickData.value = json;
+            // clickData.value = json;
             console.log("clickData---点击的数据", json)
+            if (json.videoUrl) {
+                videoDialog.value = true;
+                videoData.src = json.videoUrl
+                titleDialog.value = "互动教室"
+                return
+            }
             if (json.deviceCode) {
                 getClassDetail(json.deviceCode).then(res => {
                     classDeviceInfo.value = res.data;
                     classDeviceInfo.value.map(i => {
-                        // if (i.name === "设备状态") {
-                        //     i.online = true
-                        // } else {
-                        //     i.online = "no"
-                        // }
                         if (i.value == "在线") {
                             i.online = true
                         }
                         if (i.value == "离线") {
                             i.online = false
                         }
-                        // i.online = i.name === "设备状态" ? true : false
                     })
                     console.log("json.y ", json,);
                     linedomRef.value.style.top = (clickData.value.y) + "px";
@@ -245,33 +238,14 @@ export default ({
             // console.log("监听一下窗口是不是改了--click", lineContainer);
             callUIInteraction("windowSizeChange")
         }
-        const getUserInfo = (url) => {
-            let userurl = "   https://weizhi.huanghuai.edu.cn/cmccr-server/center/cas/v1/getUser?casLoginUrl=https://cas.huanghuai.edu.cn/cas/serviceValidate?"
-                + url + "&service=https://weizhi.huanghuai.edu.cn/cmips/"
-            // axios.get(userurl).then(res => {
-
-            // })
-
 
 
-        }
         onMounted(() => {
             addResponseEventListener("444", handleResponseFunction);
             window.addEventListener('resize', windowSize);
             // window.addEventListener('click', windowSize);
             // addResponseEventListener("widowSizeChange", windoChangeFunction);
 
-            let search = window.location.hash.split("?")[1];
-            getUserInfo(search)
-            // console.log(search, "编码")
-            // let code = result.split("?")[0]; //去掉&之后的冗余部分
-
-            // console.log(result);
-            // // window.addEventListener('hashchange', pathChange);
-            // const searchParams = currentUrl.searchParams;
-            // let ticket = searchParams.get("ticket"); // 'devpoint'
-            // console.log("ticket", ticket);
-            // searchParams.get("page"); // '1'
 
 
         })
@@ -291,7 +265,8 @@ export default ({
             lineContainer,
             classDeviceInfo,
             mouseClick,
-            headImg
+            headImg,
+            titleDialog
         }
     },
 })

src/components/right.vue

@@ -141,77 +141,6 @@ export default ({
         }
         // 物联设备
         let equipmentTotal = ref({})
-        //智慧教室实时监控---数据
-        // const carouselData = ref([
-        //     {
-        //         activeMonitor: {
-        //             title: "多屏互动教室",
-        //             array: [
-        //                 {
-        //                     title: "互动教室22",
-        //                     poster: 'rb1',
-        //                     src: '',
-        //                 },
-        //                 {
-        //                     title: "互动教室22",
-        //                     poster: 'rb2',
-        //                     src: '',
-        //                 }
-        //             ]
-        //         },
-        //         wisdomMonitor:
-        //         {
-        //             title: "多屏智慧教室",
-        //             array: [
-        //                 {
-        //                     title: "智慧教室11",
-        //                     poster: 'rb1',
-        //                     src: '',
-        //                 },
-        //                 {
-        //                     title: "智慧教室11",
-        //                     poster: 'rb2',
-        //                     src: '',
-        //                 }
-        //             ]
-        //         }
-        //     },
-        //     {
-        //         activeMonitor: {
-        //             title: "多屏互动教室",
-        //             array: [
-        //                 {
-        //                     title: "互动教室33",
-        //                     poster: 'rb1',
-        //                     src: '',
-        //                 },
-        //                 {
-        //                     title: "互动教室33",
-        //                     poster: 'rb2',
-        //                     src: '',
-        //                 }
-        //             ]
-        //         },
-
-        //         wisdomMonitor:
-        //         {
-        //             title: "多屏智慧教室",
-        //             array: [
-        //                 {
-        //                     title: "智慧教室22",
-        //                     poster: 'rb1',
-        //                     src: '',
-        //                 },
-        //                 {
-        //                     title: "智慧教室22",
-        //                     poster: 'rb2',
-        //                     src: '',
-        //                 }
-        //             ]
-        //         }
-        //     }
-
-        // ]);
         // 物联设备类型统计
         let interDevice = ref([])
         // 智慧教室