fix: 百色数据大屏，塔吊添加萤石云播放

src/views/sevenLargeScreen/towerCraneMonitoring/monitor.vue

@@ -1,4 +1,7 @@
 <template>
+	<div ref="playWndBox" style="width: 100%; height: 100%; margin: 0 5% 2% 5%" v-if="showYsy">
+		<ysyPlayAndPlayback :ref="'ysy'" :ysyParams="ysyParams"></ysyPlayAndPlayback>
+	</div>
 	<div ref="playWndBox" class="main">
 		<div
 			id="playWnd"
@@ -12,11 +15,15 @@
 </template>
 
 <script setup lang="ts">
+import ysyPlayAndPlayback from "@/components/videoModule/ysyPlayAndPlayback.vue";
 import { ref, onMounted, onBeforeUnmount, getCurrentInstance, nextTick, Ref } from "vue";
 import { ElMessage } from "element-plus";
 import { GlobalStore } from "@/stores";
 import { getQueryByIdApi, getUseProjectVideoConfigApi } from "@/api/modules/tower";
 import mitts from "@/utils/bus"; //兄弟组件传值
+let videoType = ref("") as any;
+let ysyParams = ref({} as any);
+
 let shipinList = ref([] as any);
 const store = GlobalStore();
 const playWndBox = ref(null);
@@ -47,39 +54,60 @@ let objData = ref({
 let detailId = ref("1680765579331624962" as any);
 
 // 获取塔吊监控点
-const getTowerDetail = async () => {
+// const getTowerDetail = async () => {
-	console.log("当前ID", detailId.value);
+// 	console.log("当前ID", detailId.value);
-	const res: any = await getQueryByIdApi({
+// 	const res: any = await getQueryByIdApi({
-		id: detailId.value
+// 		id: detailId.value
-	});
+// 	});
-	if (res.result) {
+// 	if (res.result) {
-		cameraIndexCode.value = res.result.videoList[0].serialNumber;
+// 		cameraIndexCode.value = res.result.videoList[0].serialNumber;
+// 		previewVideo(cameraIndexCode.value);
+// 		console.log("塔吊监控点", cameraIndexCode.value);
+// 		// ysyParams.value = res.result.videoList[0];
+// 		// videoType.value = res.result.videoList[0].videoType;
+// 		// if (res.result.videoList[0].videoType === 1) {
+// 		// 	oWebControl.JS_HideWnd();
+// 		// 	// 销毁当前播放的视频
+// 		// 	oWebControl.JS_RequestInterface({ funcName: "destroyWnd" });
+// 		// 	// 断开与插件服务连接
+// 		// 	oWebControl.JS_Disconnect();
+// 		// }
 
-		console.log("塔吊监控点", cameraIndexCode.value);
+// 	}
-		previewVideo(cameraIndexCode.value);
+// };
-	}
-};
 //获取塔吊视频播放配置
-const gerUserVideo = async () => {
+// const gerUserVideo = async () => {
-	const res = await getUseProjectVideoConfigApi({
+// 	const res = await getUseProjectVideoConfigApi({
-		projectSn: store.sn
+// 		projectSn: store.sn
-	});
+// 	});
-	console.log("获取塔吊视频播放配置", res);
+// 	console.log("获取塔吊视频播放配置", res);
-	objData.value.appkey = res.result.appId;
+// 	objData.value.appkey = res.result.appId;
-	objData.value.ip = res.result.account;
+// 	objData.value.ip = res.result.account;
-	objData.value.secret = res.result.appSecret;
+// 	objData.value.secret = res.result.appSecret;
-	objData.value.port = +res.result.password;
+// 	objData.value.port = +res.result.password;
-	await getTowerDetail();
+// 	await getTowerDetail();
-};
+// };
-let serialNumberValue = ref("" as any);
+// let serialNumberValue = ref("" as any);
+let showYsy = ref(false) as any;
 onMounted(async () => {
 	// setTimeout(() => {
 	// 	gerUserVideo();
 	// }, 2000);
 	mitts.on("serialNumberId", val => {
-		console.log("收到的视频播放ID", val);
+		console.log("收到的塔吊播放参数", val);
-		previewVideo(val); //此项进入页面播放无效，待解决
+		if (val.videoType === 1) {
-		serialNumberValue.value = val;
+			oWebControl.JS_HideWnd();
+			// 销毁当前播放的视频
+			oWebControl.JS_RequestInterface({ funcName: "destroyWnd" });
+			// 断开与插件服务连接
+			oWebControl.JS_Disconnect();
+			showYsy.value = true;
+			ysyParams.value = val;
+		} else {
+			previewVideo(val.serialNumberId);
+		}
+
+		// serialNumberValue.value = val;
 	});
 	mitts.on("selectId", e => {
 		detailId.value = e;

src/views/sevenLargeScreen/towerCraneMonitoring/right.vue

@@ -235,7 +235,7 @@
 
 <script lang="ts" setup>
 import Monitor from "@/views/sevenLargeScreen/towerCraneMonitoring/monitor.vue";
-import { onMounted, ref } from "vue";
+import { onMounted, ref, onBeforeUnmount } from "vue";
 // import * as echarts from "echarts";
 import mitts from "@/utils/bus"; //兄弟组件传值
 const BASEURL = import.meta.env.VITE_API_URL;
@@ -289,11 +289,11 @@ function selectTower(e: any) {
 	mitts.emit("selectId", e);
 	// console.log('发送的id',e);
 
-	getTowerDetail();
 	getTowerData();
 	getDriverInfoList();
 	getNewestData();
 	getSelectTower();
+	getTowerDetail();
 }
 // 获取塔吊详情
 // 进入页面播放ID
@@ -311,7 +311,9 @@ const getTowerDetail = async () => {
 		console.log("塔吊信息详情", res.result);
 		if (res.result.videoList.length > 0) {
 			towerVideoId.value = res.result.videoList[0].serialNumber;
-			mitts.emit("serialNumberId", towerVideoId.value);
+			setTimeout(() => {
+				mitts.emit("serialNumberId", res.result.videoList[0]);
+			}, 2000);
 		} else {
 			mitts.emit("serialNumberId", "");
 		}
@@ -344,11 +346,12 @@ const getTowerNumAndAlarmList = async () => {
 			noiseList.value = res.result.deviceList;
 			console.log("塔吊option", noiseList.value);
 			mitts.emit("selectId", towerValue.value);
-			await getTowerDetail();
+
 			await getTowerData();
 			await getSelectTower();
 			await getDriverInfoList();
 			await getNewestData();
+			await getTowerDetail();
 		}
 	}
 };
@@ -391,9 +394,9 @@ const getNewestData = async () => {
 	});
 	if (res.result) {
 		list.value = res.result;
-		setTimeout(() => {
+		// setTimeout(() => {
-			mitts.emit("serialNumberId", towerVideoId.value);
+		// 	mitts.emit("serialNumberId", towerVideoId.value);
-		}, 2000);
+		// }, 2000);
 	}
 	console.log("获取右下实时数据", res);
 };
@@ -406,6 +409,10 @@ function driverDetail() {
 onMounted(async () => {
 	await getTowerNumAndAlarmList();
 });
+// 即时销毁事件总线派发，否则会执行两次miits.on造成不必要的内存浪费 7.14 by CJP
+onBeforeUnmount(async () => {
+	mitts.off("serialNumberId");
+});
 </script>
 
 <style lang="scss" scoped>