flx：修改海康监控插件展示

src/api/modules/login.ts

@@ -62,3 +62,7 @@ export const getAllModule = (params?: any) => {
 export const getScreenAuthModuleAndMenuApi = (params?: any) => {
 	return http.get(BASEURL + "/xmgl/screenAuth/getModuleAndMenu", params);
 };
+
+export const getUserConfigListApi = (params?: any) => {
+	return http.get(BASEURL + "/xmgl/userConfig/list", params);
+};

src/stores/index.ts

@@ -59,7 +59,8 @@ export const GlobalStore = defineStore({
 			tabsIcon: false,
 			// 页脚
 			footer: false
-		}
+		},
+		forceH5Play: 0,
 	}),
 	getters: {},
 	actions: {
@@ -67,6 +68,9 @@ export const GlobalStore = defineStore({
 		setSN(sn: string | null) {
 			this.sn = sn;
 		},
+		setForceH5Play(forceH5Play: number | null) {
+			this.forceH5Play = forceH5Play;
+		},
 		// setToken
 		setToken(token: string | null) {
 			this.token = token;

src/stores/interface/index.ts

@@ -19,6 +19,7 @@ export interface GlobalState {
 	isManager: string | null;
 	isIframe: boolean | null;
 	userId: string | null;
+	forceH5Play: number | null;
 }
 
 /* themeConfigProp */

src/utils/util.ts

@@ -315,3 +315,8 @@ export function filterEnum(
 export const getAssetsFile = (url: string) => {
 	return new URL(`../assets/images/${url}`, import.meta.url).href
 }
+
+// 判断当前系统是不是windows系统
+export function isWindows() {
+    return navigator.userAgent.indexOf('Windows') !== -1;
+}

src/views/login/index.vue

@@ -42,7 +42,7 @@ import { ref, reactive, onMounted, onBeforeUnmount } from "vue";
 import { useRouter } from "vue-router";
 import { Login } from "@/api/interface";
 import { ElMessage, ElNotification } from "element-plus";
-import { loginApi, jumpLoginApi } from "@/api/modules/login";
+import { loginApi, jumpLoginApi, getUserConfigListApi } from "@/api/modules/login";
 import { GlobalStore } from "@/stores";
 import { TabsStore } from "@/stores/modules/tabs";
 import { KeepAliveStore } from "@/stores/modules/keepAlive";
@@ -86,7 +86,7 @@ const login = (formEl: FormInstance | undefined) => {
 			globalStore.setAccountType(result.accountType);
 			globalStore.setProjectDateAuth(result.menuAuthority);
 			globalStore.setIsManager(result.isManager); //我已知晓
-
+			getUserConfigList(result.userId);
 			// 2.添加动态路由
 			// await initDynamicRouter();
 			// router.push(arr[result.accountType - 1]);
@@ -176,6 +176,17 @@ onMounted(async () => {
 		}
 	};
 });
+const getUserConfigList = (userId: string) => {
+  getUserConfigListApi({
+    userId: userId,
+  }).then((res: any) => {
+    if (res.code === 200) {
+      if (res.result instanceof Array && res.result.length > 0) {
+        globalStore.setProjectDateAuth(res.result[0].forceH5Play);
+      }
+    }
+  });
+};
 // login页面销毁时，需要去掉enter监听
 onBeforeUnmount(() => {
 	document.onkeydown = null;

src/views/sevenLargeScreen/homeworkControlProcess/components/iscPlayer.vue

@@ -392,6 +392,7 @@ const getPreviewUrl = row => {
 	let tempCode = row.monitoringNumber;
 	const param = {
 		cameraIndexCode: tempCode,
+		streamType: row.defaultStreamType && row.eIndex < 4 ? row.defaultStreamType : "",
 		// streamType: row.defaultStreamType == 2 ? 0 : row.defaultStreamType,
 		type: window.location.protocol.includes("https") ? "wss" : "ws",
 		transmode: 1,

src/views/sevenLargeScreen/homeworkControlProcess/components/isc_plugin.vue

@@ -39,6 +39,7 @@ const getPreviewUrl = (row) => {
   const param = {
     cameraIndexCode: tempCode,
     type: window.location.protocol.includes("https") ? "wss" : "ws",
+    streamType: row.defaultStreamType && row.eIndex < 4 ? row.defaultStreamType : "",
     transmode: 1,
     itemId: row.itemId,
     projectSn: row.projectSn,
@@ -95,8 +96,11 @@ onMounted(() => {
   layout.value = tempLayout
   
   if (props.devList.length > 0) {
-    props.devList.forEach(element => {
+    props.devList.forEach((element, index) => {
-      play(element)
+      play({
+        ...element,
+        eIndex: index,
+      })
     })
   }
 })
@@ -110,21 +114,30 @@ onBeforeUnmount(() => {
 // 监听器
 // watch(() => props.devList, (newVal) => {
 //   if (newVal.length > 0) {
-//     newVal.forEach(element => {
+//     newVal.forEach((element, index) => {
-//       play(element)
+//       play({
+//         ...element,
+//         eIndex: index,
+//       })
 //     })
 //   }
 // })
-
+const isVisible = computed(() => {
-watch(() => props.equipmentDialog, (newVal) => {
+  return {
+        equipmentDialog: props.equipmentDialog,
+        visibleDialog: props.visibleDialog,
+      }
+})
+watch(() => isVisible, (newVal) => {
+  console.log("我进来了", videoPlugin.value,)
   if (videoPlugin.value) {
-    if (newVal) {
+    if (newVal.value.equipmentDialog || newVal.value.visibleDialog) {
       videoPlugin.value.hidePluginWindow()
     } else {
       videoPlugin.value.showPluginWindow()
     }
   }
-})
+}, { deep: true })
 </script>
 
 <style scoped>

src/views/sevenLargeScreen/homeworkControlProcess/components/video_isc_plugin.js

@@ -162,7 +162,7 @@ class VideoPlugin {
         }
     }
 
-    openVideo(cameraIndexCode, streamMode, winIndex) {
+    openVideo(cameraIndexCode, streamMode, winIndex = 0) {
         const transMode = 1; // TCP
         const gpuMode = 0; // 不启用GPU硬解
         // 添加调试信息
@@ -177,7 +177,7 @@ class VideoPlugin {
             funcName: "startPreview",
             argument: JSON.stringify({
                 cameraIndexCode: cameraIndexCode,
-                streamMode: streamMode == 2 ? 0 : streamMode,
+                streamMode: streamMode == 2 && (winIndex > 4) ? 0 : 1,
                 transMode: transMode,
                 gpuMode: gpuMode,
                 wndId: winIndex || -1,

src/views/sevenLargeScreen/homeworkControlProcess/index.vue

@@ -113,6 +113,7 @@
                 v-model="policeCameraItemInfo.deviceState"
                 clearable
                 placeholder="请选择"
+				@visible-change="visibleChange"
               >
                 <el-option
                   v-for="(item, index) in deviceStateList"
@@ -277,8 +278,17 @@
 											:autoplay="true"
 											:controls="true"
 										/> -->
-                    <IscPlayer
+                    <div v-if="isWindows() && store.forceH5Play == 0" class="videoOverview" :id="`videoOverview${item.itemId}`">
-                      v-if="videoConfig.enableNotPlugin == 1"
+                      <IscPlugin
+                        :devList="[item]"
+                        :itemId="item.itemId"
+                        :type="'1x1'"
+                        :equipmentDialog="equipmentDialog"
+						:visibleDialog="visibleDialog"
+                      ></IscPlugin>
+                    </div>
+					<IscPlayer
+                      v-else
                       :devList="[
                         {
                           ...item,
@@ -288,14 +298,6 @@
                       :key="'player-' + item.itemId"
                       :playerId="'player-' + item.itemId"
                     />
-                    <div v-else class="videoOverview" :id="`videoOverview${item.itemId}`">
-                      <IscPlugin
-                        :devList="[item]"
-                        :itemId="item.itemId"
-                        :type="'1x1'"
-                        :equipmentDialog="equipmentDialog"
-                      ></IscPlugin>
-                    </div>
                   </div>
                   <div class="hls-video_title" @click="onEquipmentClick(item)">
                     <div>设备详情</div>
@@ -637,6 +639,7 @@ import {
   selectAllProjectInfoList,
 } from "@/api/modules/workTicket";
 import { getUseProjectVideoConfigApi } from "@/api/modules/tower";
+import { isWindows } from "@/utils/util";
 import dayjs from "dayjs";
 import duration from "dayjs/plugin/duration";
 dayjs.extend(duration);
@@ -804,6 +807,10 @@ const onViewAllClick = () => {
 
 const equipmentDialog = ref(false);
 const equipmentDetail = ref({});
+const visibleDialog = ref(false);
+const visibleChange = (val) => {
+    visibleDialog.value = val;
+};
 // 查看设备详情
 const onEquipmentClick = (row) => {
   equipmentDetail.value = row;

src/views/sevenLargeScreen/videoManagement/index.vue

@@ -3,8 +3,8 @@
 		<div class="left" :class="{ hide: !isExpand }">
 			<div
 				:class="{
-					control_scroll: videoConfigInfo.enableNotPlugin == 1 && isDragging,
+					control_scroll: (!isWindows() || store.forceH5Play == 1) && isDragging,
-					control_scrolloff: videoConfigInfo.enableNotPlugin == 1 && !isDragging
+					control_scrolloff: (!isWindows() || store.forceH5Play == 1) && !isDragging
 				}"
 				class="videoListBig"
 			>
@@ -78,8 +78,8 @@
 			</div>
 			<div
 				class="control_main"
-				:class="{ 'mt-20': videoConfigInfo.enableNotPlugin == 1 && isDragging }"
+				:class="{ 'mt-20': (!isWindows() || store.forceH5Play == 1) && isDragging }"
-				v-if="videoConfigInfo.enableNotPlugin == 1"
+				v-if="(!isWindows() || store.forceH5Play == 1)"
 			>
 				<div class="control-card">
 					<div class="control-title">
@@ -174,7 +174,7 @@
 					<DHPlayer :devList="dhVideoList" v-else-if="videoType === 4" ref="dhplayer"></DHPlayer>
 					<!-- 播放海康 -->
 					<div v-else ref="playWndBox" style="width: 100%; height: 100%">
-						<div v-if="infor.enableNotPlugin != 1" id="playWnd" class="playWnd" style="width: 100%; height: 100%"></div>
+						<div v-if="isWindows() && store.forceH5Play == 0" id="playWnd" class="playWnd" style="width: 100%; height: 100%"></div>
 						<!-- :style="{
 							height: playWndHeight + 'px',
 							width: playWndWidth + 'xp'
@@ -201,6 +201,7 @@ import { GlobalStore } from "@/stores";
 import { getUseProjectVideoConfigApi } from "@/api/modules/tower";
 import { selectProjectVideoListApi, selectProjectVideoGroupApi, getSafeHatSessionApi } from "@/api/modules/video";
 import { COMPANY } from "@/config/config";
+import { isWindows } from "@/utils/util";
 import emitter from "./mitt";
 const defaultProps = {
 	children: "children",
@@ -387,7 +388,7 @@ const checkVideo = async (item: any) => {
 		console.log(item, "item11222");
 		videoInfo.value = item;
 		dhVideoList.value = [item];
-		if (videoConfigInfo.value.enableNotPlugin == 1) return;
+		if (isWindows() && store.forceH5Play == 1) return;
 		if (videoType.value !== 1 && videoType.value !== 4) {
 			previewVideo(cameraIndexCode.value, item.defaultStreamType);
 		}
@@ -417,18 +418,20 @@ const getVideoList = async () => {
 	}, []);
 	let arr = findVideoByTree(res.result.videoList, []);
 	if (arr.length > 0) {
-		console.log(111223344, infor.value.enableNotPlugin == 1);
+		// console.log(111223344, infor.value.enableNotPlugin == 1);
-		if (infor.value.enableNotPlugin == 1) {
+		if (isWindows() && store.forceH5Play == 0) {
-			dhVideoList.value = recursiveFilterList(res.result.videoList);
+			console.log(11122334455, arr[0]);
-		} else {
 			handleVideoConfig(arr[0]);
+		} else {
+			const dataList = recursiveFilterList(res.result.videoList);
+			dhVideoList.value = dataList;
 		}
 	}
 	console.log("objData", objData.value);
 };
 const recursiveFilterList = (dataList: any, resultList: any[] = []) => {
 	return dataList.reduce((prev: any, cur: any) => {
-		console.log("当前的列表", cur);
+		// console.log("当前的列表", cur);
 		if (resultList.length >= 4) return prev;
 		if (cur.children && cur.children.length > 0) {
 			recursiveFilterList(cur.children, resultList);
@@ -476,8 +479,7 @@ const handleVideoConfig = (videoData: any) => {
 	} else if (videoData.videoType === 4) {
 		dhVideoList.value = [videoData];
 	} else {
-		console.log(88887777, infor.value.enableNotPlugin);
+		if (isWindows() && store.forceH5Play == 0) {
-		if (infor.value.enableNotPlugin != 1) {
 			initPlugin();
 		} else {
 			console.log(88887777, videoData);

src/views/sevenLargeScreen/videoManagement/isc_plugin_h5.vue

@@ -456,7 +456,8 @@ const getPreviewUrl = row => {
 	let tempCode = row.serialNumber;
 	const param = {
 		cameraIndexCode: tempCode,
-		streamType: row.defaultStreamType == 2 ? 0 : row.defaultStreamType,
+		// streamType: row.defaultStreamType == 2 ? 0 : row.defaultStreamType,
+		streamType: row.defaultStreamType && row.eIndex < 4 ? row.defaultStreamType : "",
 		type: window.location.protocol.includes("https") ? "wss" : "ws",
 		transmode: 1,
 		itemId: row.itemId