2024-10-28 视频监控

src/views/sevenLargeScreen/videoManagement/index.vue

@@ -16,12 +16,15 @@
 							node-key="id"
 							default-expand-all
 							@node-click="checkVideo"
-							empty-text=""
+							empty-text
 						>
 							<template #default="{ node, data }">
 								<span class="custom-tree-node">
 									<img v-if="data.deviceType == 2 && data.videoId" src="@/assets/images/icon-video-blue.png" />
-									<img v-else-if="data.deviceType != 2 && data.videoId" src="@/assets/images/icon-video-blue.png" />
+									<img
+										v-else-if="data.deviceType != 2 && data.videoId"
+										src="@/assets/images/icon-video-blue.png"
+									/>
 									<!-- 是否显示吊装图标 -->
 									<img v-if="data.isFlowPass" style="width: 20px" src="@/assets/images/hoisting.svg" />
 									<span :title="data.name">{{ data.name }}</span>
@@ -41,10 +44,10 @@
 								</div>
 								<div class="status">{{ item.deviceState == 1 ? "在线" : "离线" }}</div>
 							</div>
-						</div> -->
+						</div>-->
 					</el-scrollbar>
 					<div class="notoDta" v-if="shipinList.length == 0">
-						<img src="@/assets/images/noData.png" alt="" />
+						<img src="@/assets/images/noData.png" alt />
 						<p>暂无数据</p>
 					</div>
 				</Card>
@@ -57,16 +60,20 @@
 						<div class="safe-helmet">智能安全帽</div>
 					</div>
 					<!-- 萤石云播放 -->
-					<div ref="playWndBox" style="width: 100%; height: 100%; margin: 0 5% 2% 5%" v-if="videoType === 1">
+					<div
+						ref="playWndBox"
+						style="width: 100%; height: 100%; margin: 0 5% 2% 5%"
+						v-if="videoType === 1"
+					>
 						<ysyPlayAndPlayback :ref="'ysy'" :ysyParams="ysyParams"></ysyPlayAndPlayback>
 					</div>
 					<!-- 播放海康 -->
-					<div ref="playWndBox" style="width: 100%; height: 100%; margin: 0 2% 0% 1%" >
+					<div ref="playWndBox" style="width: 100%; height: 100%; margin: 0 2% 0% 1%">
 						<div id="playWnd" class="playWnd" style="width: 100%; height: 100%"></div>
 						<!-- :style="{
 							height: playWndHeight + 'px',
 							width: playWndWidth + 'xp'
-						}" -->
+						}"-->
 					</div>
 				</Card>
 			</div>
@@ -194,11 +201,13 @@ const getVideoList = async () => {
 		ysyParams.value = res.result.videoList[0].list[0];
 		videoType.value = res.result.videoList[0].list[0].videoType;
 		if (res.result.videoList[0].list[0].videoType === 1) {
-			oWebControl.JS_HideWnd();
+			if (oWebControl) {
-			// 销毁当前播放的视频
+				oWebControl.JS_HideWnd();
-			oWebControl.JS_RequestInterface({ funcName: "destroyWnd" });
+				// 销毁当前播放的视频
-			// 断开与插件服务连接
+				oWebControl.JS_RequestInterface({ funcName: "destroyWnd" });
-			oWebControl.JS_Disconnect();
+				// 断开与插件服务连接
+				oWebControl.JS_Disconnect();
+			}
 		}
 	} else {
 		if (!res.result.videoList[0].list[0]?.outip) {
@@ -221,13 +230,18 @@ const getVideoList = async () => {
 		ysyParams.value = res.result.videoList[0];
 		videoType.value = res.result.videoList[0].videoType;
 		if (res.result.videoList[0].videoType === 1) {
-			oWebControl.JS_HideWnd();
+			if (oWebControl) {
-			// 销毁当前播放的视频
+				oWebControl.JS_HideWnd();
-			oWebControl.JS_RequestInterface({ funcName: "destroyWnd" });
+				// 销毁当前播放的视频
-			// 断开与插件服务连接
+				oWebControl.JS_RequestInterface({ funcName: "destroyWnd" });
-			oWebControl.JS_Disconnect();
+				// 断开与插件服务连接
+				oWebControl.JS_Disconnect();
+			}
 		}
 	}
+
+	console.log("objData", objData.value);
+	initPlugin();
 };
 // const getVideoList = async () => {
 // 	let res: any = await selectProjectVideoListApi({
@@ -297,7 +311,7 @@ onBeforeMount(() => {
 	getVideoList();
 });
 onMounted(async () => {
-	initPlugin();
+	// initPlugin();
 	// setTimeout(() => {
 	// }, 2500);
 	// 获取页面的实例对象 ee
@@ -307,7 +321,7 @@ onMounted(async () => {
 	const tagDomObj = document.querySelector(".videoPlayerBig .content");
 	const htmlFontSize = getComputedStyle(window.document.documentElement)["font-size"];
 	const htmlFontSizeNumber = +htmlFontSize.slice(0, htmlFontSize.indexOf("px"));
-	console.log(htmlFontSizeNumber,tagDomObj?.clientWidth, tagDomObj?.clientHeight / 12);
+	console.log(htmlFontSizeNumber, tagDomObj?.clientWidth, tagDomObj?.clientHeight / 12);
 	// playWndHeight.value = tagDomObj?.clientHeight / 1.2;
 	// playWndWidth.value = tagDomObj?.clientWidth / 1.2;
 	playWndHeight.value = tagDomObj?.clientHeight / 1.05;
@@ -344,12 +358,14 @@ onMounted(async () => {
 });
 
 onBeforeUnmount(() => {
-	// 先让窗口隐藏，规避可能的插件窗口滞后于浏览器消失问题
+	if (oWebControl) {
-	oWebControl.JS_HideWnd();
+		// 先让窗口隐藏，规避可能的插件窗口滞后于浏览器消失问题
-	// 销毁当前播放的视频
+		oWebControl.JS_HideWnd();
-	oWebControl.JS_RequestInterface({ funcName: "destroyWnd" });
+		// 销毁当前播放的视频
-	// 断开与插件服务连接
+		oWebControl.JS_RequestInterface({ funcName: "destroyWnd" });
-	oWebControl.JS_Disconnect();
+		// 断开与插件服务连接
+		oWebControl.JS_Disconnect();
+	}
 });
 
 const initPlugin = () => {