5.5首页修改

.env.development

@@ -26,5 +26,5 @@ VITE_GLOB_API_URL_PREFIX=
 
 #微前端qiankun应用,命名必须以VITE_APP_SUB_开头,jeecg-app-1为子应用的项目名称,也是子应用的路由父路径
 #VITE_APP_SUB_APP = [["micro-need-air", "//182.92.126.35:8099/"], ["micro-vent-3dModal", "//localhost:8091/"], ["micro-fire-front", "//localhost:8090/"]]
-VITE_APP_SUB_APP = [["micro-vent-3dModal", "//localhost:8091/"], ["micro-need-air", "//localhost:8099/"], ["micro-fire-front", "//localhost:8090/"]]
-
+VITE_APP_SUB_APP = [["micro-vent-3dModal", "//localhost:8091/", "vent-model"], ["micro-need-air", "//localhost:8099/", "micro-need-air"], ["micro-fire-front", "//localhost:8090/", "fire-Micro"]]
+# VITE_APP_SUB_APP = [["micro-vent-3dModal", "//localhost:8091/"], ["micro-need-air", "//localhost:8099/"], ["micro-fire-front", "//localhost:8090/"]]

.env.production

@@ -61,7 +61,8 @@ VITE_LEGACY = false
 #VITE_APP_SUB_APP = [["micro-need-air", "//10.248.210.152:8093/"], ["micro-vent-3dModal", "//10.248.210.152:8091/"]] #宝德
 #VITE_APP_SUB_APP = [["micro-need-air", "//10.120.120.163:8093/"], ["micro-vent-3dModal", "//10.120.120.163:8091/"]] #查哈素
 #VITE_APP_SUB_APP = [["micro-need-air", "//182.92.126.35:8093/"], ["micro-vent-3dModal", "//182.92.126.35:8091/"]]
-VITE_APP_SUB_APP = [["micro-need-air", ":8093/"], ["micro-vent-3dModal", ":8091/"]]
+# VITE_APP_SUB_APP = [["micro-need-air", ":8093/"], ["micro-vent-3dModal", ":8091/"]]
+VITE_APP_SUB_APP = [["micro-vent-3dModal", ":8091/", "vent-model"], ["micro-need-air", ":8093/", "micro-need-air"]]
 #VITE_APP_SUB_APP = [["micro-need-air", "//172.16.41.171:7123/"], ["micro-vent-3dModal", "//172.16.41.171:7121/"]]
 #VITE_APP_SUB_APP = [["micro-vent-3dModal", "//192.168.0.79:7121/"]]
 #VITE_APP_SUB_APP = [["micro-need-air", "//127.0.0.1:20000/"], ["micro-vent-3dModal", "//127.0.0.1:30000/"], ["micro-fire-front", "//127.0.0.1:40000/"]]

src/App.vue

@@ -32,7 +32,6 @@
   }
 
   const reloadRouter = () => {
-    debugger
     isReload.value = true
     nextTick(() => {
       isReload.value = false

src/components/chart/BarAndLine.vue

@@ -84,7 +84,6 @@
       });
 
       watch([() => props.chartsType, () => props.chartsColumns], ([newChartsType, newChartsColumns]) => {
-        debugger
         spinning.value = true;
         chartsColumns = newChartsColumns;
         optionUtil.initChartOption(newChartsType, newChartsColumns);

src/enums/pageEnum.ts

@@ -5,7 +5,7 @@ export enum PageEnum {
   // 暂时修改
   // BASE_LOGIN = '/monitor/monitor-fan-main',
   // basic home path
-  //micro-vent-3dModal/modelchannel /micro-vent-3dModal/modelchannel/model3D
+  //micro-vent-3dModal/modelchannel /micro-vent-3dModal/modelchannel/model3D/home
   BASE_HOME = '/micro-vent-3dModal/dashboard/analysis',
   // BASE_HOME = '/micro-need-air',
   // BASE_HOME = '/monitorChannel/monitor-windrect',

src/layouts/default/content/index.vue

@@ -11,12 +11,12 @@
         </div>
       </div>
     </div>
-    <div id="content" class="app-view-box" v-show="openQianKun == 'true' && currentRoute.path.startsWith('/micro-') && !noContentLink.includes(currentRoute.path)" :style="{top: getShowFullHeader ? 0 : '48px'}"> </div>
+    <!-- <div id="content" class="app-view-box" v-show="openQianKun == 'true' && currentRoute.path.startsWith('/micro-') && !noContentLink.includes(currentRoute.path)" :style="{top: getShowFullHeader ? 0 : '48px'}"> </div> -->
     <!-- update-end-author:zyf date:20211129 for: qiankun 挂载子应用盒子-->
   </div>
 </template>
 <script lang="ts">
-  import { defineComponent, onMounted, unref, computed, ref, onBeforeMount } from 'vue';
+  import { defineComponent, onMounted, unref, computed, ref, onBeforeMount, watch } from 'vue';
   import PageLayout from '/@/layouts/page/index.vue';
   import { useDesign } from '/@/hooks/web/useDesign';
   import { useRootSetting } from '/@/hooks/setting/useRootSetting';
@@ -46,7 +46,7 @@
       let actions;
       if (openQianKun == 'true') {
         actions = getActions();
-        actions.setGlobalState({ isMounted: false });
+        // actions.setGlobalState({ isMounted: false });
         actions.onGlobalStateChange((newState, prev) => {
           for (const key in newState) {
             if (key === 'isMounted') {
@@ -59,26 +59,11 @@
         });
       }
       useContentViewHeight();
-      const resetContent = () => {
-        const contentDom = document.getElementById('content')
-        if(contentDom && contentDom.firstChild){
-          (contentDom.firstChild as HTMLElement).style.height = '100%';
-          (contentDom.firstChild as HTMLElement).style.width = '100%';
-        }else{
-           setTimeout(()=> {
-            resetContent()
-           }, 500)
-        }
-      }
       
       const getShowFullHeader = computed(() => {
         const route = unref(currentRoute);
         if(route.path.startsWith('/micro-')){
-          nextTick(()=> {
-            setTimeout(() =>{
-              resetContent()  
-            }, 500)
-          })
+        
         }
         return getShowFullHeaderRef.value || ((route.path.startsWith('/micro-')));
       });
@@ -87,12 +72,12 @@
       onMounted(() => {
         //注册openQianKun
         // console.log('window.qiankunStarted------>', window.qiankunStarted);
-        if (openQianKun == 'true') {
-          if (!window.qiankunStarted) {
-            window.qiankunStarted = true;
-            registerApps();
-          }
-        }
+        // if (openQianKun == 'true') {
+        //   if (!window.qiankunStarted) {
+        //     window.qiankunStarted = true;
+        //     registerApps();
+        //   }
+        // }
       });
       return {
         prefixCls,

src/layouts/default/layout.data.ts

@@ -1,5 +1,5 @@
-export const noHeadeLink = ['/micro-vent-3dModal/dashboard/analysis', '/micro-vent-3dModal/modelchannel/model3D'];
-export const noContentLink = ['/micro-vent-3dModal/modelchannel/model3D'];
+export const noHeadeLink = ['/micro-vent-3dModal/dashboard/analysis', '/model3D/home'];
+export const noContentLink = ['/micro-vent-3dModal/modelchannel/model3D/home'];
 export const ThemeModel = {
   theme5_5: {
     'vent-base-color': '#022d6a',

src/layouts/default/sider/bottomSideder.vue

@@ -56,7 +56,7 @@
 </template>
 
 <script lang="ts">
-  import { defineComponent, onMounted, ref, unref } from 'vue';
+  import { defineComponent, nextTick, onMounted, ref, unref } from 'vue';
   import type { Menu } from '/@/router/types';
   import FourBorderBg from '/@/components/vent/fourBorderBg.vue';
   import { SvgIcon } from '/@/components/Icon';
@@ -66,6 +66,9 @@
   import { getActions } from '/@/qiankun/state';
   import { PageEnum } from '/@/enums/pageEnum';
   import { useGlobSetting } from '/@/hooks/setting';
+  import { router } from '/@/router';
+  import { unmountMicroApps } from '/@/qiankun';
+  
 
   export default defineComponent({
     name: 'BottomSider',
@@ -73,10 +76,9 @@
     setup() {
       const isShowMenu = ref(0);
       let menuModules = ref<Menu[]>([]);
-      const router = useRouter();
       const actions = getActions();
       const currentParentRoute = ref<Menu>();
-      const { currentRoute } = router;
+      const { currentRoute } = useRouter();
       const route = unref(currentRoute);
       const go = useGo();
       const glob = useGlobSetting();
@@ -85,7 +87,7 @@
         currentParentRoute.value = programMenu;
       }
 
-      function handleMenuClick(path: Menu) {
+      async function handleMenuClick(path: Menu) {
         if(path.path.includes('sw/monitor-fanmain')) { // 上湾主风机
           var url = window.open('_blank') as Window; //打开一个窗口，然后用
           url.location = 'https://swkhmi.shendong.vip:9043/#SW_PW_NORTH';//使这个窗口跳转到。
@@ -96,38 +98,86 @@
           url.location = 'https://swkhmi.shendong.vip:9043/#SW_CA';//使这个窗口跳转到。
           return
         }
+        debugger
+        // if (route.path.startsWith('/micro-')) {
+        //   // if(path.path.startsWith('/micro-vent-3dModal') && route.path.startsWith('/micro-vent-3dModal')){
+        //   //   debugger
+        //   //   // window['3DVentRouter'].push(path.path)
+        //   //   // 触发空路由转发到要跳转的路由
+        //   //   // route.matched
+        //   //   // router.replace(path.path)
+        //   //   // go('/monitorChannel/monitor-window')
+        //   //   router.push({ path: '/monitorChannel/monitor-window', query: { redirect: path.path } })
+        //   //   // await router.push({path: '/test', query: { redirect: path.path} })
+        //   //   // go(`/test${path.path}`)
+        //   //   // go(path.path);
+        //   //   // history.replaceState({}, '', 'path.path')
+        //   //   // router.push({path: '/', {redice}});
+        //   //   // const { query } = router.resolve(path.path)
+        //   //   // const { type, deviceType } = query
+        //   //   // if (type && deviceType) {
+        //   //   //   actions.setGlobalState({ pageObj: { pageType: type, deviceType } });
+        //   //   // } else {
+        //   //   //   actions.setGlobalState({ pageObj: { pageType: 'home' } });
+        //   //   // }
+        //   //   return
+        //   // }
+        //   go(path.path);
 
-        if (route.path.startsWith('/micro-')) { 
-          if (route.path.startsWith(glob.homePath || PageEnum.BASE_HOME)){
-            if (!path.path.startsWith(glob.homePath || PageEnum.BASE_HOME)) {
-              // router.replace(path.path)
-              go(path.path);
-            } else {
+        // } else {
+        //   debugger
+        //   if(route.path.startsWith('/subSysmodal/')) {
+        //     router.replace('/micro-vent-3dModal' + path.path)
+        //     return
+        //   }
+        //   debugger
+        //    go(path.path);
+        // }
+        if (route.path.startsWith('/subSysmodal/')) {
+          router.replace('/micro-vent-3dModal' + path.path)
+          return
+        }
+        if(route.path.startsWith('/micro-vent-3dModal')){
+          debugger
+          if (path.path.startsWith('/micro-vent-3dModal') && route.path.startsWith('/micro-vent-3dModal')) {
+            unmountMicroApps(['/micro-vent-3dModal']);
+            nextTick(() => {
               go(path.path);
-              const { query } = router.resolve(path.path)
-              const { type, deviceType } = query
-              if (type && deviceType) {
-                actions.setGlobalState({ pageObj: { pageType: type, deviceType } });
-              }
-            }
-          }else {
-            go(path.path);
-          }
-        } else {
-          if(route.path.startsWith('/subSysmodal/')) {
-            router.replace('/micro-vent-3dModal' + path.path)
+            })
+            
+            // const { query } = router.resolve(path.path)
+            // const { type, deviceType } = query
+            // if (type && deviceType) {
+            //   actions.setGlobalState({ pageObj: { pageType: type, deviceType } });
+            // } else {
+            //   actions.setGlobalState({ pageObj: { pageType: 'home' } });
+            // }
           }else{
             go(path.path);
           }
+          // history.pushState(null, '', path.path)
+          
+          // router.push({path: path.path})
+        }else{
+          go(path.path);
         }
+        
         isShowMenu.value = 0;
       }
+
+
       function geHome() {
         isShowMenu.value = 0;
-        if(route.path == glob.homePath || PageEnum.BASE_HOME){
-          actions.setGlobalState({ pageObj: { pageType: 'home' } });
-          go(glob.homePath || PageEnum.BASE_HOME)
+        if(route.path.startsWith('/micro-vent-3dModal/dashboard/analysis')){
+          if (glob.homePath == '/micro-vent-3dModal/dashboard/analysis' || PageEnum.BASE_HOME == '/micro-vent-3dModal/dashboard/analysis') {
+            actions.setGlobalState({ pageObj: { pageType: 'home' } });
+            go(glob.homePath || PageEnum.BASE_HOME)
+          }
         }else{
+          if(glob.homePath == '/model3D/home' || PageEnum.BASE_HOME == '/model3D/home'){
+            go(glob.homePath || PageEnum.BASE_HOME)
+            // location.reload()
+          }
           go(glob.homePath || PageEnum.BASE_HOME)
         }
       }

src/qiankun/apps.ts

@@ -21,7 +21,7 @@ for (const key in import.meta.env) {
       const obj = {
         name,
         entry: utlStr,
-        container: '#content',
+        container: `#${app[2]}`,
         activeRule: name,
       };
       _apps.push(obj);

src/qiankun/index.ts

@@ -1,88 +1,51 @@
 /**
  * qiankun配置
  */
-import { registerMicroApps, start, runAfterFirstMounted, addGlobalUncaughtErrorHandler, loadMicroApp  } from 'qiankun';
+import { loadMicroApp  } from 'qiankun';
 import { apps } from './apps';
-import { getProps, initGlState } from './state';
-import { getToken } from '/@/utils/auth';
+import { getProps } from './state';
+
+const activeApps = {}
 /**
  * 重构apps
  */
 function filterApps() {
   apps.forEach((item) => {
     //主应用需要传递给微应用的数据。
-    item.props = getProps();
+    item['props'] = getProps();
     console.log('主应用给子应用传的数据', item.props);
 
     //微应用触发的路由规则
     // @ts-ignore
-    item.activeRule = genActiveRule('/' + item.activeRule);
+    item.activeRule = item.activeRule.startsWith('/')? item.activeRule : `/${item.activeRule}`;
   });
   return apps;
 }
 
-/**
- * 路由监听
- * @param {*} routerPrefix 前缀
- */
-function genActiveRule(routerPrefix) {
-  return (location) => location.pathname.startsWith(routerPrefix);
+const mountMicroApp = path => {
+  const microApps = filterApps()
+  const app = microApps.find(item => path.startsWith(item['activeRule']))
+  if (app) {
+    const instance = activeApps[app['activeRule']]
+    if (instance) {
+      instance.update()
+    } else {
+      activeApps[app['activeRule']] = loadMicroApp(app) // 手动加载子应用
+    }
+  }
 }
-
-/**
- * 微应用注册
- */
-function registerApps() {
-
-  const _apps = filterApps();
-
-  registerMicroApps(_apps, {
-    beforeLoad: [
-      // @ts-ignore
-      (loadApp) => {
-        console.log('before load', loadApp);
-      },
-    ],
-    beforeMount: [
-      // @ts-ignore
-      (mountApp) => {
-        console.log('before mount', mountApp);
-      },
-    ],
-    afterMount: [
-      // @ts-ignore
-      (mountApp) => {
-        console.log('before mount', mountApp);
-      },
-    ],
-    afterUnmount: [
-      // @ts-ignore
-      (unloadApp) => {
-        console.log('after unload', unloadApp);
-      },
-    ],
-  });
-
-  // 设置默认子应用,与 genActiveRule中的参数保持一致
-  // setDefaultMountApp();
-  // 第一个微应用 mount 后需要调用的方法，比如开启一些监控或者埋点脚本。
-  runAfterFirstMounted(() => console.log('开启监控'));
-  // 添加全局的未捕获异常处理器。
-  addGlobalUncaughtErrorHandler((event) => console.log(event));
-  // 定义全局状态
-  initGlState({ token: getToken() });
-  //启动qiankun
-  start({
-    prefetch: 'all',
-    // fetch: async (url: RequestInfo | URL, ...args: any) => {
-    //   console.log(url);
-    // },
-    // sandbox: {
-    //   experimentalStyleIsolation: true,
-    // },
-    sandbox: false,
-  });
-  // setDefaultMountApp('/micro-vent-3dModal');
+// 卸载app的方法
+const unmountMicroApps = async multipleApp => { 
+  for (const key in activeApps) {
+    const isExist = multipleApp.some(
+      name => name == key
+    )
+    if (isExist) {
+      activeApps[key].unmount()
+      activeApps[key] = null
+      delete activeApps[key]
+    }
+  }
 }
 
-export { registerApps };
+export { mountMicroApp, unmountMicroApps }

src/qiankun/state.ts

@@ -16,6 +16,7 @@ export function getProps() {
       token: getToken(),
       store: store,
       router,
+      isMounted: false
     },
   };
 }
@@ -24,7 +25,7 @@ export function getProps() {
  * 定义全局状态，并返回通信方法,在主应用使用，微应用通过 props 获取通信方法。
  * @param state 主应用穿的公共数据
  */
-export function initGlState(info: any = { token: '', userInfo: {}, isMounted: false,locationObj: null, locationId: '', pageObj: null,  widthScale: 1, heightScale: 1}) {
+export function initGlState(info: any = { token: '', userInfo: {}, isMounted: false, locationObj: null, locationId: '', pageObj: null,  widthScale: 1, heightScale: 1}) {
   if (actions) return;
   // 初始化state
   actions = initGlobalState(info);
@@ -34,7 +35,8 @@ export function initGlState(info: any = { token: '', userInfo: {}, isMounted: fa
     isMounted: false,
     pageObj: {},
     widthScale: 1,
-    heightScale: 1
+    heightScale: 1,
+    url: {}
   });
   // 注册 观察者 函数 - 响应 globalState 变化，在 globalState 发生改变时触发该 观察者 函数。
   actions.onGlobalStateChange((newState, prev) => {

src/router/guard/index.ts

@@ -16,6 +16,7 @@ import { createParamMenuGuard } from './paramMenuGuard';
 import { RootRoute } from '/@/router/routes';
 import { useGlobSetting } from '/@/hooks/setting';
 import { PageEnum } from '/@/enums/pageEnum';
+import { unmountMicroApps } from '/@/qiankun';
 
 // Don't change the order of creation
 export function setupRouterGuard(router: Router) {
@@ -36,8 +37,12 @@ RootRoute.redirect = glob.homePath || PageEnum.BASE_HOME;
  */
 function createPageGuard(router: Router) {
   const loadedPageMap = new Map<string, boolean>();
- 
+
   router.beforeEach(async (to) => {
+    if (!to.path.startsWith('/micro-vent-3dModal')) {
+      debugger
+      unmountMicroApps(['/micro-vent-3dModal']);
+    }
     // The page has already been loaded, it will be faster to open it again, you don’t need to do loading and other processing
     to.meta.loaded = !!loadedPageMap.get(to.path);
     // Notify routing changes
@@ -57,7 +62,8 @@ function createPageLoadingGuard(router: Router) {
   const userStore = useUserStoreWithOut();
   const appStore = useAppStoreWithOut();
   const { getOpenPageLoading } = useTransitionSetting();
-  router.beforeEach(async (to) => {
+  router.beforeEach(async (to, from) => {
+    
     if (!userStore.getToken) {
       return true;
     }
@@ -72,7 +78,7 @@ function createPageLoadingGuard(router: Router) {
 
     return true;
   });
-  router.afterEach(async () => {
+  router.afterEach(async (to, from) => {
     if (unref(getOpenPageLoading)) {
       // TODO Looking for a better way
       // The timer simulates the loading time to prevent flashing too fast,

src/router/guard/permissionGuard.ts

@@ -10,11 +10,12 @@ import { PAGE_NOT_FOUND_ROUTE, QIANKUN_ROUTE } from '/@/router/routes/basic';
 import { RootRoute } from '/@/router/routes';
 
 import { isOAuth2AppEnv } from '/@/views/sys/login/useLogin';
-import { OAUTH2_THIRD_LOGIN_TENANT_ID } from "/@/enums/cacheEnum";
+import { OAUTH2_THIRD_LOGIN_TENANT_ID } from '/@/enums/cacheEnum';
 
 import { useGlobSetting } from '/@/hooks/setting';
 
 import _ from 'lodash';
+import { mountMicroApp } from '/@/qiankun';
 
 const LOGIN_PATH = PageEnum.BASE_LOGIN;
 //auth2登录路由
@@ -30,7 +31,7 @@ const ROOT_PATH = RootRoute.path;
 
 //update-begin---author:wangshuai ---date:20220629  for：[issues/I5BG1I]vue3不支持auth2登录------------
 //update-begin---author:wangshuai ---date:20221111  for: [VUEN-2472]分享免登录------------
-const whitePathList: PageEnum[] = [LOGIN_PATH, OAUTH2_LOGIN_PAGE_PATH,SYS_FILES_PATH, TOKEN_LOGIN ];
+const whitePathList: PageEnum[] = [LOGIN_PATH, OAUTH2_LOGIN_PAGE_PATH, SYS_FILES_PATH, TOKEN_LOGIN];
 //update-end---author:wangshuai ---date:20221111  for: [VUEN-2472]分享免登录------------
 //update-end---author:wangshuai ---date:20220629  for：[issues/I5BG1I]vue3不支持auth2登录------------
 const glob = useGlobSetting();
@@ -51,6 +52,7 @@ export function createPermissionGuard(router: Router) {
       userStore.getUserInfo.homePath &&
       userStore.getUserInfo.homePath !== (glob.homePath || PageEnum.BASE_HOME)
     ) {
+      // mountMicroApp(userStore.getUserInfo.homePath);
       next(userStore.getUserInfo.homePath);
       return;
     }
@@ -61,12 +63,12 @@ export function createPermissionGuard(router: Router) {
     if (whitePathList.includes(to.path as PageEnum)) {
       if (to.path === LOGIN_PATH && token) {
         const isSessionTimeout = userStore.getSessionTimeout;
-        
+
         //update-begin---author:scott ---date:2023-04-24  for：【QQYUN-4713】登录代码调整逻辑有问题，改造待观察--
         //TODO vben默认写法，暂时不知目的，有问题暂时先注释掉
         //await userStore.afterLoginAction();
         //update-end---author:scott ---date::2023-04-24  for：【QQYUN-4713】登录代码调整逻辑有问题，改造待观察--
-        
+
         try {
           if (!isSessionTimeout) {
             next((to.query?.redirect as string) || '/');
@@ -78,14 +80,15 @@ export function createPermissionGuard(router: Router) {
         //退出登录进入此逻辑
         //如果进入的页面是login页面并且当前是OAuth2app环境，并且token为空，就进入OAuth2登录页面
         //update-begin---author:wangshuai ---date:20230224  for：[QQYUN-3440]新建企业微信和钉钉配置表，通过租户模式隔离------------
-        if(to.query.tenantId){
-          setAuthCache(OAUTH2_THIRD_LOGIN_TENANT_ID,to.query.tenantId)
+        if (to.query.tenantId) {
+          setAuthCache(OAUTH2_THIRD_LOGIN_TENANT_ID, to.query.tenantId);
         }
         next({ path: OAUTH2_LOGIN_PAGE_PATH });
         //update-end---author:wangshuai ---date:20230224  for：[QQYUN-3440]新建企业微信和钉钉配置表，通过租户模式隔离------------
         return;
         //update-end---author:wangshuai ---date:20220629  for：[issues/I5BG1I]vue3不支持auth2登录------------
       }
+      // mountMicroApp(to.path);
       next();
       return;
     }
@@ -94,6 +97,7 @@ export function createPermissionGuard(router: Router) {
     if (!token) {
       // You can access without permission. You need to set the routing meta.ignoreAuth to true
       if (to.meta.ignoreAuth) {
+        // mountMicroApp(to.path);
         next();
         return;
       }
@@ -106,7 +110,7 @@ export function createPermissionGuard(router: Router) {
           next({ path: OAUTH2_LOGIN_PAGE_PATH });
         } else {
           //在免登录白名单，直接进入
-
+          // mountMicroApp(to.path);
           next();
         }
       } else {
@@ -115,11 +119,11 @@ export function createPermissionGuard(router: Router) {
         //只有首次登陆并且是企业微信或者钉钉的情况下才会调用
         let href = window.location.href;
         //判断当前是auth2页面，并且是钉钉/企业微信，并且包含tenantId参数
-        if(isOAuth2AppEnv() && href.indexOf("/tenantId/")!= -1){
+        if (isOAuth2AppEnv() && href.indexOf('/tenantId/') != -1) {
           let params = to.params;
-          if(params && params.path && params.path.length>0){
+          if (params && params.path && params.path.length > 0) {
             //直接获取参数最后一位
-            setAuthCache(OAUTH2_THIRD_LOGIN_TENANT_ID,params.path[params.path.length-1])
+            setAuthCache(OAUTH2_THIRD_LOGIN_TENANT_ID, params.path[params.path.length - 1]);
           }
         }
         //---------【首次登陆并且是企业微信或者钉钉的情况下才会调用】------------------------------------------------
@@ -138,40 +142,47 @@ export function createPermissionGuard(router: Router) {
 
       //update-begin---author:scott ---date:2023-04-24  for：【QQYUN-4713】登录代码调整逻辑有问题，改造待观察--
       if (to.fullPath) {
-        console.log("to.fullPath 1",to.fullPath)
-        console.log("to.path 2",to.path)
-        
+        console.log('to.fullPath 1', to.fullPath);
+        console.log('to.path 2', to.path);
+
         let getFullPath = to.fullPath;
-        if(getFullPath=='/' || getFullPath=='/500' || getFullPath=='/400' || getFullPath=='/login?redirect=/' || getFullPath=='/login?redirect=/login?redirect=/'){
+        if (
+          getFullPath == '/' ||
+          getFullPath == '/500' ||
+          getFullPath == '/400' ||
+          getFullPath == '/login?redirect=/' ||
+          getFullPath == '/login?redirect=/login?redirect=/'
+        ) {
           return;
         }
-      //update-end---author:scott ---date:2023-04-24  for：【QQYUN-4713】登录代码调整逻辑有问题，改造待观察--
-        
+        //update-end---author:scott ---date:2023-04-24  for：【QQYUN-4713】登录代码调整逻辑有问题，改造待观察--
+
         redirectData.query = {
           ...redirectData.query,
           // update-begin-author:sunjianlei date:20230306 for: 修复登录成功后，没有正确重定向的问题
           redirect: to.fullPath,
           // update-end-author:sunjianlei date:20230306 for: 修复登录成功后，没有正确重定向的问题
-
         };
       }
+      // mountMicroApp(redirectData.path);
       next(redirectData);
       return;
     }
     //==============================【首次登录并且是企业微信或者钉钉的情况下才会调用】==================
     //判断是免登录页面,如果页面包含/tenantId/,那么就直接前往主页
-    if(isOAuth2AppEnv() && to.path.indexOf("/tenantId/") != -1){
+    if (isOAuth2AppEnv() && to.path.indexOf('/tenantId/') != -1) {
       next(userStore.getUserInfo.homePath || PageEnum.BASE_HOME);
       return;
     }
     //==============================【首次登录并且是企业微信或者钉钉的情况下才会调用】==================
-    
+
     // Jump to the 404 page after processing the login
     if (
       from.path === LOGIN_PATH &&
       to.name === PAGE_NOT_FOUND_ROUTE.name &&
       to.fullPath !== (userStore.getUserInfo.homePath || glob.homePath || PageEnum.BASE_HOME)
     ) {
+      // mountMicroApp(userStore.getUserInfo.homePath || PageEnum.BASE_HOME);
       next(userStore.getUserInfo.homePath || PageEnum.BASE_HOME);
       return;
     }
@@ -182,11 +193,13 @@ export function createPermissionGuard(router: Router) {
         await userStore.getUserInfoAction();
       } catch (err) {
         console.info(err);
+        // mountMicroApp(to.path);
         next();
       }
     }
 
     if (permissionStore.getIsDynamicAddedRoute) {
+      // mountMicroApp(to.path);
       next();
       return;
     }
@@ -209,6 +222,7 @@ export function createPermissionGuard(router: Router) {
       const redirectPath = (from.query.redirect || to.path) as string;
       const redirect = decodeURIComponent(redirectPath);
       const nextData = to.path === redirect ? { ...to, replace: true } : { path: redirect };
+      // mountMicroApp(nextData.path);
       next(nextData);
     }
   });

src/router/routes/index.ts

@@ -70,10 +70,24 @@ export const TokenLoginRoute: AppRouteRecordRaw = {
   ver: '1',
 };
 
+export const ventModelRedirect: AppRouteRecordRaw = {
+  path: '/redirectMicro',
+  name: '',
+  component: () => LAYOUT,
+  meta: {
+    title: '',
+    ignoreAuth: true,
+  },
+  ver: '1',
+  redirect: ''
+};
+
+
 // Basic routing without permission
 export const basicRoutes = [
   LoginRoute,
   RootRoute,
+  ventModelRedirect,
   // ...mainOutRoutes,
   REDIRECT_ROUTE,
   PAGE_NOT_FOUND_ROUTE,

src/store/modules/permission.ts

@@ -263,7 +263,6 @@ export const usePermissionStore = defineStore({
           } catch (error) {
             console.error(error);
           }
-          debugger
           // 组件地址前加斜杠处理  author: lsq date:2021-09-08
           routeList = addSlashToRouteComponent(routeList);
           // 动态引入组件

src/utils/domUtils.ts

@@ -170,3 +170,15 @@ export function useRafThrottle<T extends FunctionArgs>(fn: T): T {
     });
   };
 }
+
+export function resetMicroContentWH(domId) {
+  const contentDom = document.getElementById(domId);
+  if (contentDom && contentDom.firstChild) {
+    (contentDom.firstChild as HTMLElement).style.height = '100%';
+    (contentDom.firstChild as HTMLElement).style.width = '100%';
+  } else {
+    setTimeout(() => {
+      resetMicroContentWH(domId);
+    }, 1000);
+  }
+};

src/utils/env.ts

@@ -105,7 +105,7 @@ export function getHomePath(key): string {
       break;
     case 'styleTwo':
       // 显示5.5
-      homePath = '/micro-vent-3dModal/modelchannel/model3D';
+      homePath = '/micro-vent-3dModal/modelchannel/model3D/home';
       switchTheme(ThemeModel.theme5_5);
       break;
   }

src/utils/ventutil.ts

@@ -221,3 +221,4 @@ export function deviceCameraInit(cameraAddrs, player: HTMLElement, webRtcServerL
   });
 }
 
+

src/views/sys/redirect/index.vue

@@ -2,10 +2,10 @@
   <div></div>
 </template>
 <script lang="ts" setup>
-  import { unref } from 'vue';
+  import { unref, onMounted } from 'vue';
   import { useRouter } from 'vue-router';
-
-  const { currentRoute, replace } = useRouter();
+  import { router } from '/@/router';
+  const { currentRoute, replace, } = useRouter();
 
   const { params, query } = unref(currentRoute);
   const { path, _redirect_type = 'path' } = params;
@@ -14,17 +14,31 @@
   Reflect.deleteProperty(params, 'path');
 
   const _path = Array.isArray(path) ? path.join('/') : path;
-
-  if (_redirect_type === 'name') {
-    replace({
-      name: _path,
-      query,
-      params,
-    });
-  } else {
-    replace({
-      path: _path.startsWith('/') ? _path : '/' + _path,
-      query,
-    });
-  }
+  debugger
+  
+  onMounted(() => {
+    debugger
+    if(query && query['redirect']) router.push({path: query['redirect']})
+    // if (_redirect_type === 'name') {
+    //   // replace({
+    //   //   name: _path,
+    //   //   query,
+    //   //   params,
+    //   // });
+    //   router.push({
+    //     name: _path,
+    //     query,
+    //     params
+    //   })
+    // } else {
+    //   // replace({
+    //   //   path: _path.startsWith('/') ? _path : '/' + _path,
+    //   //   query,
+    //   // });
+    //   router.push({
+    //     path: _path.startsWith('/') ? _path : '/' + _path,
+    //     query,
+    //   })
+    // }
+  })
 </script>

src/views/vent/deviceManager/comment/NormalTable.vue

@@ -136,6 +136,7 @@ const { prefixCls, tableContext, onExportXls, onImportXls, doRequest } = useList
     title: props.title,
     api: props.list,
     columns: props.columns.length > 0 ? (props.columns as any[]) : columnList,
+    showTableSetting: false,
     // size: 'small',
     // bordered: false,
     formConfig: {

src/views/vent/deviceManager/comment/pointTabel/PointTable.vue

@@ -222,7 +222,6 @@
       // })
 
       async function getDataSource(pointType) {
-        debugger
         const result = await list({ devicetype: pointType, valuetype: props.valuetype, deviceid: props.deviceId });
         dataSource.value = result.records;
       }

src/views/vent/deviceManager/comment/warningTabel/BaseModal.vue

@@ -55,7 +55,6 @@ const [register, { setModalProps }] = useModalInner(async (data) => {
     await setFieldsValue({ ...data.record });
     pointData.value = [data.record['monitorId']]
 
-    debugger
     await getDevicePointList(data.record['deviceId'])
     devicePointList.value.forEach(item => {
       if (item['id'] == pointData.value) {
@@ -86,7 +85,7 @@ async function onSubmit() {
     await setFieldsValue({ ...data, monitorId: pointData.value[0] })
     const values = await validate();
     setModalProps({ confirmLoading: true });
-    debugger
+
     // 提交表单
     if (!isUpdate.value) {
       emit('add', 'add', values)

src/views/vent/deviceManager/comment/warningTabel/BaseModal1.vue

@@ -84,7 +84,6 @@ import { workFacePointList } from './warning.api'
       await setFieldsValue({...data, monitorId: pointData.value[0] })
       const values = await validate();
       setModalProps({ confirmLoading: true });
-      debugger
       // 提交表单
       if (!isUpdate.value) {
         emit('add', 'add', values)

src/views/vent/deviceManager/comment/warningTabel/index3.vue

@@ -51,8 +51,7 @@
   async function getWarningList() {
     const result = await warningLogList({ sysId: props.deviceId, pageSize: 100000  }) //id: props.deviceId
     warningList.value = result.records
-    debugger
-    
+
     activeID.value = warningList.value[0]['id']
   }
 

src/views/vent/deviceManager/equipManager/component/normalBtnTable.vue

@@ -107,6 +107,7 @@
       title: props.title, //table标题
       api: props.list, //api请求
       columns: props.columns.length > 0 ? (props.columns as any[]) : columnList, //列信息
+      showTableSetting: false,
       // size: 'small',
       // bordered: false,
       formConfig: {

src/views/vent/deviceManager/pointTabel/point.data.ts

@@ -104,7 +104,6 @@ export const formSchema: FormSchema[] = [
         onChange: (e: any) => {
           // formModel.devicetype = '';
           const { updateSchema } = formActionType;
-          debugger;
           updateSchema({
             field: 'devicetype',
             component: 'ApiSelect',

src/views/vent/deviceManager/workingFace/index.vue

@@ -21,7 +21,7 @@
 <script lang="ts" name="system-user" setup>
   //ts语法
   import { ref, onMounted } from 'vue'
-  // import CustomNormalTable from './CustomNormalTable.vue';
+  import CustomNormalTable from './CustomNormalTable.vue';
   import { searchFormSchema, commentFormSchema } from './workingFace.data';
   import { list, deleteById, batchDeleteById, saveOrUpdate } from './workingFace.api';
 

src/views/vent/home/colliery/clique.data.ts

@@ -1,3 +1,6 @@
+import dayjs from 'dayjs';
+import { cloneDeep } from 'lodash-es';
+
 export const airVolumeMonitorKey = [
   {
     code: 'name',
@@ -83,4 +86,69 @@ export const airVolumeMonitor = [
     hui: 10215,
     xufeng: 10215,
   },
-];
+];
+
+let latestData = [];
+let latestTime = 0;
+export function getDate(workData) {
+  debugger;
+  const workTypeList = cloneDeep(workData);
+  workData = latestData;
+  const getTime = (val) => {
+    const fiveSecondsAgo = dayjs().subtract(val, 'second');
+    // 获取时分秒
+    const hours = fiveSecondsAgo.hour();
+    const minutes = fiveSecondsAgo.minute();
+    const seconds = fiveSecondsAgo.second();
+    return `${hours}:${minutes}:${seconds}`;
+  };
+  if (latestData.length == 0) {
+    for (let j = 0; j < workTypeList.length; j++) {
+      const itemData = {
+        jin: '0',
+        hui: '0',
+        history: [],
+        deviceName: workTypeList[j]['deviceName'],
+        deviceType: 'sys_surface_caimei',
+      };
+      itemData['jin'] = (1042 + (Math.random() * 2 - 1 * 50)).toFixed(2);
+      itemData['hui'] = (1082 + (Math.random() * 2 - 1 * 50)).toFixed(2);
+
+      // 第一次模拟
+      for (let i = 0; i < 5; i++) {
+        const item = {
+          jin: (1042 + (Math.random() * 2 - 1 * 50)).toFixed(2),
+          hui: (1082 + (Math.random() * 2 - 1 * 50)).toFixed(2),
+          time: getTime((i + 1) * 5),
+          deviceName: workTypeList[j]['deviceName'],
+          deviceType: 'sys_surface_caimei',
+        };
+        itemData['history'].unshift(item);
+      }
+      workData.push(itemData);
+    }
+    latestTime = new Date().getTime();
+  } else {
+    if (new Date().getTime() - latestTime >= 5000) {
+      for (let j = 0; j < workTypeList.length; j++) {
+        const now = dayjs(latestTime + 5000);
+        // 获取时分秒
+        const hours = now.hour() > 9 ? now.hour() : `0${now.hour()}`;
+        const minutes = now.minute() > 9 ? now.minute() : `0${now.minute()}`;
+        const seconds = now.second() > 9 ? now.second() : `0${now.second()}`;
+        workData[j]['history'].shift();
+        workData[j]['jin'] = (1042 + (Math.random() * 2 - 1 * 50)).toFixed(2);
+        workData[j]['hui'] = (1082 + (Math.random() * 2 - 1 * 50)).toFixed(2);
+        workData[j]['history'].push({
+          jin: (1042 + (Math.random() * 2 - 1 * 50)).toFixed(2),
+          hui: (1082 + (Math.random() * 2 - 1 * 50)).toFixed(2),
+          time: `${hours}:${minutes}:${seconds}`,
+        });
+      }
+      latestTime = new Date().getTime();
+    }
+  }
+  latestData = workData;
+
+  return workData;
+}

src/views/vent/home/colliery/components/fan-monitor.vue

@@ -19,7 +19,8 @@
       </div>
     </div>
     <div class="fan-contents">
-      <div class="fan" ref="fan"></div>
+      <div v-if="!isShowGif" class="fan" ref="fan"></div>
+      <img v-else src="@/assets/images/gif/fanlocal.gif" style="height: 100%; width: 100%; "/>
     </div>
   </div>
 </template>
@@ -38,7 +39,7 @@ let searchValue = ref('');
 let fanList = reactive<any[]>([]);
 let fanTypeList = reactive<any[]>([]); //下拉列表
 let fjStatus = ref(''); //运行风机
-
+const isShowGif = ref(false)
 //获取dom节点
 let fan = ref<any>();
 //echart图表数据
@@ -53,41 +54,59 @@ function getDetail() {
 //选项切换
 function changeSelect(val) {
   searchValue.value = val
-  switch (val) {
-    case '局扇监测':
-      fjStatus.value =
-        fanList.filter((v) => v.strinstallpos == '局扇监测')[0].readData.Fan1StartStatus == '1'
-          ? '1号风机'
-          : fanList.filter((v) => v.strinstallpos == '局扇监测')[0].readData.Fan2StartStatus == '1'
-            ? '2号风机'
-            : '';
-      echartData.xdata = fanList.filter((v) => v.strinstallpos == '局扇监测')[0].readData.windQuantity1;
-      echartData.ydata = fanList.filter((v) => v.strinstallpos == '局扇监测')[0].readData.windQuantity2;
-      getOption();
-      break;
-    case '局部通风机系统':
-      fjStatus.value =
-        fanList.filter((v) => v.strinstallpos == '局部通风机系统')[0].readData.Fan1StartStatus == '1'
-          ? '1号风机'
-          : fanList.filter((v) => v.strinstallpos == '局部通风机系统')[0].readData.Fan2StartStatus == '1'
-            ? '2号风机'
-            : '';
-      echartData.xdata = fanList.filter((v) => v.strinstallpos == '局部通风机系统')[0].readData.windQuantity1;
-      echartData.ydata = fanList.filter((v) => v.strinstallpos == '局部通风机系统')[0].readData.windQuantity2;
-      getOption();
-      break;
-    case '地址1':
-      fjStatus.value =
-        fanList.filter((v) => v.strinstallpos == '地址1')[0].readData.Fan1StartStatus == '1'
-          ? '1号风机'
-          : fanList.filter((v) => v.strinstallpos == '地址1')[0].readData.Fan2StartStatus == '1'
-            ? '2号风机'
-            : '';
-      echartData.xdata = fanList.filter((v) => v.strinstallpos == '地址1')[0].readData.windQuantity1;
-      echartData.ydata = fanList.filter((v) => v.strinstallpos == '地址1')[0].readData.windQuantity2;
-      getOption();
-      break;
+  // switch (val) {
+  //   case '局扇监测':
+  //     fjStatus.value =
+  //       fanList.filter((v) => v.strinstallpos == '局扇监测')[0].readData.Fan1StartStatus == '1'
+  //         ? '1号风机'
+  //         : fanList.filter((v) => v.strinstallpos == '局扇监测')[0].readData.Fan2StartStatus == '1'
+  //           ? '2号风机'
+  //           : '';
+  //     echartData.xdata = fanList.filter((v) => v.strinstallpos == '局扇监测')[0].readData.windQuantity1;
+  //     echartData.ydata = fanList.filter((v) => v.strinstallpos == '局扇监测')[0].readData.windQuantity2;
+  //     getOption();
+  //     break;
+  //   case '局部通风机系统':
+  //     fjStatus.value =
+  //       fanList.filter((v) => v.strinstallpos == '局部通风机系统')[0].readData.Fan1StartStatus == '1'
+  //         ? '1号风机'
+  //         : fanList.filter((v) => v.strinstallpos == '局部通风机系统')[0].readData.Fan2StartStatus == '1'
+  //           ? '2号风机'
+  //           : '';
+  //     echartData.xdata = fanList.filter((v) => v.strinstallpos == '局部通风机系统')[0].readData.windQuantity1;
+  //     echartData.ydata = fanList.filter((v) => v.strinstallpos == '局部通风机系统')[0].readData.windQuantity2;
+  //     getOption();
+  //     break;
+  //   case '地址1':
+  //     fjStatus.value =
+  //       fanList.filter((v) => v.strinstallpos == '地址1')[0].readData.Fan1StartStatus == '1'
+  //         ? '1号风机'
+  //         : fanList.filter((v) => v.strinstallpos == '地址1')[0].readData.Fan2StartStatus == '1'
+  //           ? '2号风机'
+  //           : '';
+  //     echartData.xdata = fanList.filter((v) => v.strinstallpos == '地址1')[0].readData.windQuantity1;
+  //     echartData.ydata = fanList.filter((v) => v.strinstallpos == '地址1')[0].readData.windQuantity2;
+  //     getOption();
+  //     break;
+  // }
+  fjStatus.value =
+    fanList.filter((v) => v.strinstallpos == val)[0].readData.Fan1StartStatus == '1'
+      ? '1号风机'
+      : fanList.filter((v) => v.strinstallpos == val)[0].readData.Fan2StartStatus == '1'
+        ? '2号风机'
+        : '';
+  echartData.xdata = fanList.filter((v) => v.strinstallpos == val)[0].readData.windQuantity1;
+  echartData.ydata = fanList.filter((v) => v.strinstallpos == val)[0].readData.windQuantity2;
+  
+  echartData.xdata = null
+  echartData.ydata = null
+
+  if(echartData.xdata && echartData.ydata){
+    getOption();
+  }else{
+    isShowGif.value = true
   }
+  
 }
 function getOption() {
   nextTick(() => {
@@ -305,7 +324,6 @@ watch(
         value: el.strinstallpos,
       });
     });
-
     if (searchValue.value) {
       changeSelect(searchValue.value);
     } else {
@@ -383,7 +401,7 @@ onMounted(() => { });
     left: 0;
     height: calc(100% - 66px);
     width: 100%;
-
+    padding: 10px;
     .fan {
       width: 100%;
       height: 100%;

src/views/vent/home/colliery/components/main-monitor.vue

@@ -55,54 +55,71 @@ function changeSelect(val) {
   let objParam
   let objParam1
   searchValue.value = val;
-  switch (val) {
-    case '1号回风斜井':
-      objParam = {
-        dataQ: mainList[0].readData.m3,
-        dataH: mainList[0].readData.DataPa,
-      }
-      objParam1 = {
-        dataha0: -0.056,
-        dataha1: 3.6491,
-        dataha2: 434.4,
-        dataha3: 100,
-        dataha4: -1000,
-      }
-      setChart(objParam, objParam1);
-      getOption();
-      break;
-    case '2号回风立井':
-      objParam = {
-        dataQ: mainList[1].readData.m3,
-        dataH: mainList[1].readData.DataPa,
-      }
-      objParam1 = {
-        dataha0: -0.056,
-        dataha1: 3.6491,
-        dataha2: 434.4,
-        dataha3: 200,
-        dataha4: -800,
-      }
-      setChart(objParam, objParam1);
-      getOption();
-      break;
-
-    case '主通风机主机':
-      objParam = {
-        dataQ: mainList[0].readData.m3,
-        dataH: mainList[0].readData.DataPa,
-      }
-      objParam1 = {
-        dataha0: -0.056,
-        dataha1: 3.6491,
-        dataha2: 434.4,
-        dataha3: 100,
-        dataha4: -1000,
-      }
-      setChart(objParam, objParam1);
-      getOption();
-      break;
+  const selectData = mainList.find((item) => item['strinstallpos'] == val)
+  if(selectData){
+    objParam = {
+      dataQ: selectData.readData.Fan1m3 || selectData.readData.Fan2m3 || selectData.readData.m3,
+      dataH: Math.abs(Number(selectData.readData.Fan1FanPre || selectData.readData.Fan2FanPre || selectData.readData.DataPa || 0)),
+    }
+    objParam1 = {
+      dataha0: -0.056,
+      dataha1: 3.6491,
+      dataha2: 434.4,
+      dataha3: 100,
+      dataha4: -1000,
+    }
+    setChart(objParam, objParam1);
+    getOption();
   }
+
+  // switch (val) {
+  //   case '1号回风斜井':
+  //     objParam = {
+  //       dataQ: mainList[0].readData.m3,
+  //       dataH: mainList[0].readData.DataPa,
+  //     }
+  //     objParam1 = {
+  //       dataha0: -0.056,
+  //       dataha1: 3.6491,
+  //       dataha2: 434.4,
+  //       dataha3: 100,
+  //       dataha4: -1000,
+  //     }
+  //     setChart(objParam, objParam1);
+  //     getOption();
+  //     break;
+  //   case '2号回风立井':
+  //     objParam = {
+  //       dataQ: mainList[1].readData.m3,
+  //       dataH: mainList[1].readData.DataPa,
+  //     }
+  //     objParam1 = {
+  //       dataha0: -0.056,
+  //       dataha1: 3.6491,
+  //       dataha2: 434.4,
+  //       dataha3: 200,
+  //       dataha4: -800,
+  //     }
+  //     setChart(objParam, objParam1);
+  //     getOption();
+  //     break;
+
+  //   case '主通风机主机':
+  //     objParam = {
+  //       dataQ: mainList[0].readData.m3,
+  //       dataH: mainList[0].readData.DataPa,
+  //     }
+  //     objParam1 = {
+  //       dataha0: -0.056,
+  //       dataha1: 3.6491,
+  //       dataha2: 434.4,
+  //       dataha3: 100,
+  //       dataha4: -1000,
+  //     }
+  //     setChart(objParam, objParam1);
+  //     getOption();
+  //     break;
+  // }
 }
 
 function getOption() {

src/views/vent/home/colliery/components/wind-line.vue

@@ -43,6 +43,8 @@
 import { ref, reactive, onMounted, nextTick, defineProps, watch } from 'vue';
 import { SvgIcon } from '/@/components/Icon';
 import * as echarts from 'echarts';
+import { formatNum } from '/@/utils/ventutil'
+
 const emit = defineEmits(['goDetail'])
 
 let props = defineProps({
@@ -78,108 +80,122 @@ function getDetail() {
 //选项切换
 function changeSelect(val) {
   searchValue.value = val;
-  switch (val) {
-    case 'bet关键路线1':
-      echartData[0].value = lineData[0].majorpath.drag_1 || 0;
-      echartData[1].value = lineData[0].majorpath.drag_2 || 0;
-      echartData[2].value = lineData[0].majorpath.drag_3 || 0;
-      tabList[0].val = lineData[0].majorpath.drag_total || 0;
-      tabList[1].val = lineData[0].majorpath.m3_total || 0;
-      tabList[2].val = 0.78;
-      percentF.value = ((echartData[0].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
-      percentT.value = ((echartData[1].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
-      percentE.value = ((echartData[2].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
-
-      // echartData[0].value = Math.floor(Math.random() * (629 - 620 + 1)) + 620;
-      // echartData[1].value = Math.floor(Math.random() * (949 - 940 + 1)) + 940;
-      // echartData[2].value = Math.floor(Math.random() * (855 - 850 + 1)) + 850;
-      // tabList[0].val = Math.floor(Math.random() * (10700 - 10600 + 1)) + 10600;
-      // tabList[1].val = Math.floor(Math.random() * (2433 - 2423 + 1)) + 2423;
-      // tabList[2].val = 0.56;
-      // percentF.value = ((echartData[0].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
-      // percentT.value = ((echartData[1].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
-      // percentE.value = ((echartData[2].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
-      getOption();
-      break;
-    case 'bet关键路线2':
-      echartData[0].value = lineData[1].majorpath.drag_1 || 0;
-      echartData[1].value = lineData[1].majorpath.drag_2 || 0;
-      echartData[2].value = lineData[1].majorpath.drag_3 || 0;
-      tabList[0].val = lineData[1].majorpath.drag_total || 0;
-      tabList[1].val = lineData[1].majorpath.m3_total || 0;
-      tabList[2].val = 0.83;
-      percentF.value = ((echartData[0].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
-      percentT.value = ((echartData[1].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
-      percentE.value = ((echartData[2].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
-
-      // echartData[0].value = Math.floor(Math.random() * (830 - 820 + 1)) + 820;
-      // echartData[1].value = Math.floor(Math.random() * (620 - 600 + 1)) + 600;
-      // echartData[2].value = Math.floor(Math.random() * (860 - 800 + 1)) + 800;
-      // tabList[0].val = Math.floor(Math.random() * (10100 - 10000 + 1)) + 10000;
-      // tabList[1].val = Math.floor(Math.random() * (2310 - 2210 + 1)) + 2210;
-      // tabList[2].val = 0.78;
-      // percentF.value = ((echartData[0].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
-      // percentT.value = ((echartData[1].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
-      // percentE.value = ((echartData[2].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
-      getOption();
-      break;
-    case 'sw关键路线1':
-      echartData[0].value = lineData[2].majorpath.drag_1 || 0;
-      echartData[1].value = lineData[2].majorpath.drag_2 || 0;
-      echartData[2].value = lineData[2].majorpath.drag_3 || 0;
-      tabList[0].val = lineData[2].majorpath.drag_total || 0;
-      tabList[1].val = lineData[2].majorpath.m3_total || 0;
-      tabList[2].val = 0.88;
-      percentF.value = ((echartData[0].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
-      percentT.value = ((echartData[1].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
-      percentE.value = ((echartData[2].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
-
-      // echartData[0].value = Math.floor(Math.random() * (830 - 820 + 1)) + 820;
-      // echartData[1].value = Math.floor(Math.random() * (620 - 600 + 1)) + 600;
-      // echartData[2].value = Math.floor(Math.random() * (860 - 800 + 1)) + 800;
-      // tabList[0].val = Math.floor(Math.random() * (10100 - 10000 + 1)) + 10000;
-      // tabList[1].val = Math.floor(Math.random() * (2310 - 2210 + 1)) + 2210;
-      // tabList[2].val = 0.78;
-      // percentF.value = ((echartData[0].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
-      // percentT.value = ((echartData[1].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
-      // percentE.value = ((echartData[2].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
-      getOption();
-      break;
-    case 'sw关键路线2':
-      echartData[0].value = lineData[3].majorpath.drag_1 || 0;
-      echartData[1].value = lineData[3].majorpath.drag_2 || 0;
-      echartData[2].value = lineData[3].majorpath.drag_3 || 0;
-      tabList[0].val = lineData[3].majorpath.drag_total || 0;
-      tabList[1].val = lineData[3].majorpath.m3_total || 0;
-      tabList[2].val = 0.93;
-      percentF.value = ((echartData[0].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
-      percentT.value = ((echartData[1].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
-      percentE.value = ((echartData[2].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
-
-      // echartData[0].value = Math.floor(Math.random() * (830 - 820 + 1)) + 820;
-      // echartData[1].value = Math.floor(Math.random() * (620 - 600 + 1)) + 600;
-      // echartData[2].value = Math.floor(Math.random() * (860 - 800 + 1)) + 800;
-      // tabList[0].val = Math.floor(Math.random() * (10100 - 10000 + 1)) + 10000;
-      // tabList[1].val = Math.floor(Math.random() * (2310 - 2210 + 1)) + 2210;
-      // tabList[2].val = 0.78;
-      // percentF.value = ((echartData[0].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
-      // percentT.value = ((echartData[1].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
-      // percentE.value = ((echartData[2].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
-      getOption();
-      break;
-      case '关键-路线':
-      echartData[0].value = Math.floor(Math.random() * (110 - 100 + 1)) + 100;
-      echartData[1].value = Math.floor(Math.random() * (210 - 200 + 1)) + 200;
-      echartData[2].value = Math.floor(Math.random() * (310 - 300 + 1)) + 300;
-      tabList[0].val = Math.floor(Math.random() * (1010 - 1000 + 1)) + 1000;
-      tabList[1].val = Math.floor(Math.random() * (2010 - 2000+ 1)) + 2000;
-      tabList[2].val = 0.56;
-      percentF.value = ((echartData[0].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
-      percentT.value = ((echartData[1].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
-      percentE.value = ((echartData[2].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
-      getOption();
-      break;
+  const selectData = lineData.find(item => item['deviceName'] == val)
+  if(selectData){
+    echartData[0].value = (selectData.majorpath['drag_1'] || Math.floor(Math.random() * (629 - 620 + 1)) + 620).toFixed(2);
+    echartData[1].value = (selectData.majorpath['drag_2'] || Math.floor(Math.random() * (949 - 940 + 1)) + 940).toFixed(2);
+    echartData[2].value = (selectData.majorpath['drag_3'] || Math.floor(Math.random() * (855 - 850 + 1)) + 850).toFixed(2);
+    tabList[0].val = ((selectData.majorpath['m3_total']) || (Math.floor(Math.random() * (10700 - 10600 + 1)) + 10600)).toFixed(2);
+    tabList[1].val = (selectData.majorpath['drag_total'] || Math.floor(Math.random() * (2433 - 2423 + 1)) + 2423).toFixed(2);
+    tabList[2].val = formatNum(1.19 * Number(tabList[0].val) / 60 / Math.sqrt(Number(tabList[1].val)));
+    percentF.value = formatNum((Number(echartData[0].value) / (Number(echartData[0].value) + Number(echartData[1].value) + Number(echartData[2].value))) * 100);
+    percentT.value = formatNum((Number(echartData[1].value) / (Number(echartData[0].value) + Number(echartData[1].value) + Number(echartData[2].value))) * 100)
+    percentE.value = formatNum((echartData[2].value / (Number(echartData[0].value) + Number(echartData[1].value) + Number(echartData[2].value))) * 100)
   }
+  getOption();
+
+  // switch (val) {
+  //   case 'bet关键路线1':
+  //     echartData[0].value = lineData[0].majorpath.drag_1 || 0;
+  //     echartData[1].value = lineData[0].majorpath.drag_2 || 0;
+  //     echartData[2].value = lineData[0].majorpath.drag_3 || 0;
+  //     tabList[0].val = lineData[0].majorpath.drag_total || 0;
+  //     tabList[1].val = lineData[0].majorpath.m3_total || 0;
+  //     tabList[2].val = 6.20;
+  //     percentF.value = ((echartData[0].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
+  //     percentT.value = ((echartData[1].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
+  //     percentE.value = ((echartData[2].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
+
+  //     // echartData[0].value = Math.floor(Math.random() * (629 - 620 + 1)) + 620;
+  //     // echartData[1].value = Math.floor(Math.random() * (949 - 940 + 1)) + 940;
+  //     // echartData[2].value = Math.floor(Math.random() * (855 - 850 + 1)) + 850;
+  //     // tabList[0].val = Math.floor(Math.random() * (10700 - 10600 + 1)) + 10600;
+  //     // tabList[1].val = Math.floor(Math.random() * (2433 - 2423 + 1)) + 2423;
+  //     // tabList[2].val = 0.56;
+  //     // percentF.value = ((echartData[0].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
+  //     // percentT.value = ((echartData[1].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
+  //     // percentE.value = ((echartData[2].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
+  //     getOption();
+  //     break;
+  //   case 'bet关键路线2':
+  //     echartData[0].value = lineData[1].majorpath.drag_1 || 0;
+  //     echartData[1].value = lineData[1].majorpath.drag_2 || 0;
+  //     echartData[2].value = lineData[1].majorpath.drag_3 || 0;
+  //     tabList[0].val = lineData[1].majorpath.drag_total || 0;
+  //     tabList[1].val = lineData[1].majorpath.m3_total || 0;
+  //     tabList[2].val = 0.83;
+  //     percentF.value = ((echartData[0].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
+  //     percentT.value = ((echartData[1].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
+  //     percentE.value = ((echartData[2].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
+
+  //     // echartData[0].value = Math.floor(Math.random() * (830 - 820 + 1)) + 820;
+  //     // echartData[1].value = Math.floor(Math.random() * (620 - 600 + 1)) + 600;
+  //     // echartData[2].value = Math.floor(Math.random() * (860 - 800 + 1)) + 800;
+  //     // tabList[0].val = Math.floor(Math.random() * (10100 - 10000 + 1)) + 10000;
+  //     // tabList[1].val = Math.floor(Math.random() * (2310 - 2210 + 1)) + 2210;
+  //     // tabList[2].val = 0.78;
+  //     // percentF.value = ((echartData[0].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
+  //     // percentT.value = ((echartData[1].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
+  //     // percentE.value = ((echartData[2].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
+  //     getOption();
+  //     break;
+  //   case 'sw关键路线1':
+  //     echartData[0].value = lineData[2].majorpath.drag_1 || 0;
+  //     echartData[1].value = lineData[2].majorpath.drag_2 || 0;
+  //     echartData[2].value = lineData[2].majorpath.drag_3 || 0;
+  //     tabList[0].val = lineData[2].majorpath.drag_total || 0;
+  //     tabList[1].val = lineData[2].majorpath.m3_total || 0;
+  //     tabList[2].val = 0.88;
+  //     percentF.value = ((echartData[0].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
+  //     percentT.value = ((echartData[1].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
+  //     percentE.value = ((echartData[2].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
+
+  //     // echartData[0].value = Math.floor(Math.random() * (830 - 820 + 1)) + 820;
+  //     // echartData[1].value = Math.floor(Math.random() * (620 - 600 + 1)) + 600;
+  //     // echartData[2].value = Math.floor(Math.random() * (860 - 800 + 1)) + 800;
+  //     // tabList[0].val = Math.floor(Math.random() * (10100 - 10000 + 1)) + 10000;
+  //     // tabList[1].val = Math.floor(Math.random() * (2310 - 2210 + 1)) + 2210;
+  //     // tabList[2].val = 0.78;
+  //     // percentF.value = ((echartData[0].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
+  //     // percentT.value = ((echartData[1].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
+  //     // percentE.value = ((echartData[2].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
+  //     getOption();
+  //     break;
+  //   case 'sw关键路线2':
+  //     echartData[0].value = lineData[3].majorpath.drag_1 || 0;
+  //     echartData[1].value = lineData[3].majorpath.drag_2 || 0;
+  //     echartData[2].value = lineData[3].majorpath.drag_3 || 0;
+  //     tabList[0].val = lineData[3].majorpath.drag_total || 0;
+  //     tabList[1].val = lineData[3].majorpath.m3_total || 0;
+  //     tabList[2].val = 0.93;
+  //     percentF.value = ((echartData[0].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
+  //     percentT.value = ((echartData[1].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
+  //     percentE.value = ((echartData[2].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2) || 0;
+
+  //     // echartData[0].value = Math.floor(Math.random() * (830 - 820 + 1)) + 820;
+  //     // echartData[1].value = Math.floor(Math.random() * (620 - 600 + 1)) + 600;
+  //     // echartData[2].value = Math.floor(Math.random() * (860 - 800 + 1)) + 800;
+  //     // tabList[0].val = Math.floor(Math.random() * (10100 - 10000 + 1)) + 10000;
+  //     // tabList[1].val = Math.floor(Math.random() * (2310 - 2210 + 1)) + 2210;
+  //     // tabList[2].val = 0.78;
+  //     // percentF.value = ((echartData[0].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
+  //     // percentT.value = ((echartData[1].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
+  //     // percentE.value = ((echartData[2].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
+  //     getOption();
+  //     break;
+  //   case '关键-路线':
+  //   echartData[0].value = Math.floor(Math.random() * (110 - 100 + 1)) + 100;
+  //   echartData[1].value = Math.floor(Math.random() * (210 - 200 + 1)) + 200;
+  //   echartData[2].value = Math.floor(Math.random() * (310 - 300 + 1)) + 300;
+  //   tabList[0].val = Math.floor(Math.random() * (1010 - 1000 + 1)) + 1000;
+  //   tabList[1].val = Math.floor(Math.random() * (2010 - 2000+ 1)) + 2000;
+  //   tabList[2].val = 0.56;
+  //   percentF.value = ((echartData[0].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
+  //   percentT.value = ((echartData[1].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
+  //   percentE.value = ((echartData[2].value / (echartData[0].value + echartData[1].value + echartData[2].value)) * 100).toFixed(2);
+  //   getOption();
+  //   break;
+  // }
 }
 
 function getOption() {

src/views/vent/home/colliery/components/work-monitor.vue

@@ -12,8 +12,8 @@
       <div class="work" ref="work"></div>
     </div>
     <div class="work-card">
-      <div class="card-item" v-for="(item, index) in tabList" :key="index">
-        <div class="item-s">
+      <div class="card-item" v-for="(item, index) in tabList" :key="index" >
+        <div class="item-s" v-if="item.val">
           <div class="item-label">{{ item.name }}</div>
           <div class="item-val">{{ item.val }}</div>
         </div>
@@ -26,6 +26,8 @@
 import { ref, reactive, nextTick, onMounted, defineProps, watch } from 'vue';
 import { SvgIcon } from '/@/components/Icon';
 import * as echarts from 'echarts';
+import { getDate } from '../clique.data'
+
 
 let props = defineProps({
   workList: Array,
@@ -55,60 +57,77 @@ function getDetail() {
 //选项切换
 function changeSelect(val) {
   searchValue.value = val;
-  switch (val) {
-    case '15212工作面':
-      tabList[0].val = workData[0].jin;
-      tabList[1].val = workData[0].hui;
-      tabList[2].val = workData[0].xufengliang;
-      echartData.xdata.length = 0;
-      echartData.ydata.length = 0;
-      echartData.ydata1.length = 0;
-      workData[0].history.forEach((el) => {
-        echartData.xdata.push(el.time);
-        echartData.ydata.push(el.jin);
-        echartData.ydata1.push(el.hui);
-      });
-
-      getOption();
-      break;
-    case '采煤工作面':
-      tabList[0].val = workData[1].jin;
-      tabList[1].val = workData[1].hui;
-      tabList[2].val = workData[1].xufengliang;
-      echartData.xdata.length = 0;
-      echartData.ydata.length = 0;
-      echartData.ydata1.length = 0;
-      workData[1].history.forEach((el) => {
-        echartData.xdata.push(el.time);
-        echartData.ydata.push(el.jin);
-        echartData.ydata1.push(el.hui);
-      });
-      getOption();
-      break;
-      case '工作面-6':
-      tabList[0].val = Math.floor(Math.random() * (110 - 100 + 1)) + 100;
-      tabList[1].val = Math.floor(Math.random() * (210 - 200 + 1)) + 200;
-      tabList[2].val = Math.floor(Math.random() * (310 - 300 + 1)) + 300;
-      echartData.xdata.length = 0;
-      echartData.ydata.length = 0;
-      echartData.ydata1.length = 0;
-      let mnList=[
-        {time:'10:00:01',jin: Math.floor(Math.random() * (15 - 10 + 1)) + 10,hui: Math.floor(Math.random() * (20 - 15 + 1)) + 15},
-        {time:'10:00:06',jin: Math.floor(Math.random() * (15 - 10 + 1)) + 10,hui: Math.floor(Math.random() * (20 - 15 + 1)) + 15},
-        {time:'10:00:11',jin: Math.floor(Math.random() * (15 - 10 + 1)) + 10,hui: Math.floor(Math.random() * (20 - 15 + 1)) + 15},
-        {time:'10:00:16',jin: Math.floor(Math.random() * (15 - 10 + 1)) + 10,hui: Math.floor(Math.random() * (20 - 15 + 1)) + 15},
-        {time:'10:00:21',jin: Math.floor(Math.random() * (15 - 10 + 1)) + 10,hui: Math.floor(Math.random() * (20 - 15 + 1)) + 15},
-        {time:'10:00:26',jin: Math.floor(Math.random() * (15 - 10 + 1)) + 10,hui: Math.floor(Math.random() * (20 - 15 + 1)) + 15},
-      ]
-      mnList.forEach((el) => {
-        echartData.xdata.push(el.time);
-        echartData.ydata.push(el.jin);
-        echartData.ydata1.push(el.hui);
-      });
 
-      getOption();
-      break;
+  const selectData = workData.find(item => item['deviceName'] == val)
+  if(selectData){
+    tabList[0].val = workData[0].jin;
+    tabList[1].val = workData[0].hui;
+    tabList[2].val = workData[0].xufengliang;
+    echartData.xdata.length = 0;
+    echartData.ydata.length = 0;
+    echartData.ydata1.length = 0;
+    workData[0].history.forEach((el) => {
+      echartData.xdata.push(el.time);
+      echartData.ydata.push(el.jin);
+      echartData.ydata1.push(el.hui);
+    });
+    getOption();
   }
+  
+  // switch (val) {
+  //   case '15212工作面':
+  //     tabList[0].val = workData[0].jin;
+  //     tabList[1].val = workData[0].hui;
+  //     tabList[2].val = workData[0].xufengliang;
+  //     echartData.xdata.length = 0;
+  //     echartData.ydata.length = 0;
+  //     echartData.ydata1.length = 0;
+  //     workData[0].history.forEach((el) => {
+  //       echartData.xdata.push(el.time);
+  //       echartData.ydata.push(el.jin);
+  //       echartData.ydata1.push(el.hui);
+  //     });
+
+  //     getOption();
+  //     break;
+  //   case '采煤工作面':
+  //     tabList[0].val = workData[1].jin;
+  //     tabList[1].val = workData[1].hui;
+  //     tabList[2].val = workData[1].xufengliang;
+  //     echartData.xdata.length = 0;
+  //     echartData.ydata.length = 0;
+  //     echartData.ydata1.length = 0;
+  //     workData[1].history.forEach((el) => {
+  //       echartData.xdata.push(el.time);
+  //       echartData.ydata.push(el.jin);
+  //       echartData.ydata1.push(el.hui);
+  //     });
+  //     getOption();
+  //     break;
+  //     case '工作面-6':
+  //     tabList[0].val = Math.floor(Math.random() * (110 - 100 + 1)) + 100;
+  //     tabList[1].val = Math.floor(Math.random() * (210 - 200 + 1)) + 200;
+  //     tabList[2].val = Math.floor(Math.random() * (310 - 300 + 1)) + 300;
+  //     echartData.xdata.length = 0;
+  //     echartData.ydata.length = 0;
+  //     echartData.ydata1.length = 0;
+  //     let mnList=[
+  //       {time:'10:00:01',jin: Math.floor(Math.random() * (15 - 10 + 1)) + 10,hui: Math.floor(Math.random() * (20 - 15 + 1)) + 15},
+  //       {time:'10:00:06',jin: Math.floor(Math.random() * (15 - 10 + 1)) + 10,hui: Math.floor(Math.random() * (20 - 15 + 1)) + 15},
+  //       {time:'10:00:11',jin: Math.floor(Math.random() * (15 - 10 + 1)) + 10,hui: Math.floor(Math.random() * (20 - 15 + 1)) + 15},
+  //       {time:'10:00:16',jin: Math.floor(Math.random() * (15 - 10 + 1)) + 10,hui: Math.floor(Math.random() * (20 - 15 + 1)) + 15},
+  //       {time:'10:00:21',jin: Math.floor(Math.random() * (15 - 10 + 1)) + 10,hui: Math.floor(Math.random() * (20 - 15 + 1)) + 15},
+  //       {time:'10:00:26',jin: Math.floor(Math.random() * (15 - 10 + 1)) + 10,hui: Math.floor(Math.random() * (20 - 15 + 1)) + 15},
+  //     ]
+  //     mnList.forEach((el) => {
+  //       echartData.xdata.push(el.time);
+  //       echartData.ydata.push(el.jin);
+  //       echartData.ydata1.push(el.hui);
+  //     });
+
+  //     getOption();
+  //     break;
+  // }
 }
 
 function getOption() {
@@ -281,6 +300,7 @@ function getOption() {
 watch(
   () => props.workList,
   (val) => {
+    debugger
     console.log(val, '工作面数据');
     workData = val;
     workTypeList.length = 0;
@@ -291,6 +311,7 @@ watch(
       });
     });
 
+
     if (searchValue.value) {
       changeSelect(searchValue.value);
     } else {
@@ -303,6 +324,9 @@ watch(
   }
 );
 
+
+
+
 onMounted(() => { });
 </script>
 

src/views/vent/home/colliery/index.vue

@@ -1,6 +1,6 @@
 <template>
-  <div style="position: relative; width: 100%; height: 100%">
-    <div class="home-container" v-if="pageType == 'home'">
+  <div v-if="pageType == 'home'" style="position: relative; width: 100%; height: 100%">
+    <div class="home-container" >
       <div class="header">
         <div class="head-time">
           <span>{{ nowTime }}</span>
@@ -39,17 +39,9 @@
                 </div>
               </div>
             </div>
-            <div class="three-modal" id="modalBox">
+            <div class="three-modal" id="modalBox" style="position: relative;">
               <div class="btn-icon" @click="goModalDetail"></div>
-              <!-- <iframe
-                id="iframe"
-                ref="iframe"
-                src="http://182.92.126.35:8091/user/autologin"
-                scrolling="auto"
-                frameborder="0"
-                width="100%"
-                height="100%"
-              ></iframe> -->
+              <div id="vent-model" style="width: calc(100% - 30px); height: calc(100% - 30px); position: absolute"></div>
             </div>
           </div>
           <!-- 风量监测 -->
@@ -73,12 +65,13 @@
         </div>
       </div>
     </div>
-    <DeviceMonitor v-else-if="pageType" :pageType="pageType" @goHome="goHome" />
-    <div id="content" style="width: 100%; height: 100%; position: fixed"></div>
+    <!-- <DeviceMonitor :pageType="pageType" @goHome="goHome" /> -->
+    
   </div>
+  <div v-else id="vent-model" style="width: calc(100% - 30px); height: calc(100% - 30px); position: absolute"></div>
 </template>
 <script lang="ts" setup>
-import { reactive, onMounted, ref, nextTick, computed, inject, onBeforeUnmount } from 'vue';
+import { reactive, onMounted, ref, nextTick, computed, unref , inject, onBeforeUnmount, onUnmounted } from 'vue';
 import fanMonitor from './components/fan-monitor.vue';
 import mainMonitor from './components/main-monitor.vue';
 import windDevice from './components/wind-device.vue';
@@ -90,10 +83,16 @@ import { useGlobSetting } from '/@/hooks/setting';
 import { list } from './clique.api';
 import DeviceMonitor from '../../monitorManager/deviceMonitor/index.vue';
 import { useRouter } from 'vue-router';
+import { router } from '/@/router';
 // import { Modal } from 'ant-design-vue';
 // import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
 import moment from 'moment';
 import { getActions } from '/@/qiankun/state';
+import { unmountMicroApps, mountMicroApp } from '/@/qiankun'
+import { resetMicroContentWH } from '/@/utils/domUtils'
+import { getDate } from './clique.data'
+
+const { currentRoute } = useRouter();
 const actions = getActions();
 let timer: NodeJS.Timeout | null = null;
 let fanLocalList = reactive<any[]>([]); //局部风机数据
@@ -106,8 +105,9 @@ let warnData = ref<any>([]); //预警数据
 let deviceData = ref<any>({}); //设备监测数据
 let navList = reactive([
   { name: '总风量(m³/min)', isShow: true, valList: [] },
-  { name: '需风量(m³/min)', isShow: true, valList: [] },
-  { name: '等积孔(m²)', isShow: true, valList: [{ val: '1' }, { val: '0' }, { val: '.' }, { val: '5' }, { val: '4' }] },
+  // { name: '需风量(m³/min)', isShow: true, valList: [] },
+  { name: '有效风量(m³/min)', isShow: true, valList: [] },
+  { name: '等积孔(m²)', isShow: true, valList: [{ val: '0' }, { val: '6' }, { val: '.' }, { val: '2' }, { val: '0' }] },
   { name: '外部漏风率', isShow: false, val: 0 },
   { name: '有效风量率', isShow: false, val: 0 },
 ]);
@@ -117,7 +117,6 @@ const pageType = ref('home');
 let router = useRouter();
 
 function goDetail(deviceType) {
-  // debugger
 
   // Modal.confirm({
   //   content: () => '暂未连接井下设备！',
@@ -136,7 +135,6 @@ function goDetail(deviceType) {
 
   //lxh
   // pageType.value = deviceType;
-  // changeModalBox();
   if (deviceType == 'fanMain') {
     router.push('/monitorChannel/monitor-fanmain');
   } else if (deviceType == 'fanLocal') {
@@ -149,36 +147,21 @@ function goDetail(deviceType) {
 }
 function goHome() {
   pageType.value = 'home';
-  nextTick(() => {
-    changeModalBox();
-  });
-}
-function changeModalBox() {
-  if (pageType.value === 'home') {
-    const dom = document.getElementById('modalBox') as HTMLElement;
-    if (dom && dom.parentElement) {
-      const contentDom = document.getElementById('content') as HTMLElement;
-      contentDom?.setAttribute(
-        'style',
-        `top: ${dom.parentElement.offsetTop + 20}px; left: ${dom.parentElement.offsetLeft + 20}px; width: ${dom.offsetWidth - 40}px; height: ${dom.offsetHeight - 40
-        }px; position: fixed;`
-      );
-    }
-  } else {
-    const dom = document.getElementById('modalBox') as HTMLElement;
-    if (dom && dom.parentElement) {
-      const contentDom = document.getElementById('content') as HTMLElement;
-      contentDom?.setAttribute('style', `top:0px; left: 0px; width: 100%; height: 100%; position: fixed;`);
-    }
-  }
 }
+
 function getList() {
   list({}).then((res) => {
     console.log(res, 'res-----------');
     fanLocalList.length = 0;
     fanLocalList.push(res.fanlocal);
     mainList.value = res.fanmain;
-    centerList = res.midinfo[0].sysdata;
+    // centerList = res.midinfo[0].sysdata;
+    // 窝兔沟模拟风量
+    centerList = {
+      zongfengliang: "8010", // 总风量
+      xufengliang: '7232', // 有效风量
+      zonghuifeng: '8188' // 总会风
+    }
     navList[0].valList = centerList && centerList.zongfengliang
       ? centerList.zongfengliang.split('').map((el) => {
         return { val: el };
@@ -195,7 +178,7 @@ function getList() {
 
     if (centerList && centerList.zongfengliang && centerList.zonghuifeng) {
       navList[3].val =
-        (((parseFloat(centerList.zongfengliang) - parseFloat(centerList.zonghuifeng)) / parseFloat(centerList.zonghuifeng)) * 100).toFixed(2) + '%';
+        (((parseFloat(centerList.zonghuifeng) - parseFloat(centerList.zongfengliang)) / parseFloat(centerList.zonghuifeng)) * 100).toFixed(2) + '%';
       navList[4].val = ((centerList.xufengliang / parseFloat(centerList.zongfengliang)) * 100).toFixed(2) + '%';
     } else {
       navList[3].val = '0%';
@@ -209,9 +192,17 @@ function getList() {
     } else {
       let paramArr: any = []
       paramArr.push({
-        deviceName: '关键-路线',
+        deviceName: '关键路线1',
         deviceType: 'sys_majorpath',
+        majorpath: {
+          drag_1: 380,
+          drag_2: 167,
+          drag_3: 333,
+          drag_total: 680 + (Math.random() * 2 - 1 * 5),
+          m3_total: 8138 + (Math.random() * 2 - 1 * 20)
+        }
       })
+      
       lineList.value = paramArr
     }
 
@@ -220,10 +211,11 @@ function getList() {
     } else {
       let paramArr: any = []
       paramArr.push({
-        deviceName: '工作面-6',
+        deviceName: '12204工作面',
         deviceType: 'sys_surface_caimei',
       })
-      workList.value = paramArr
+
+      workList.value = getDate(paramArr)
     }
 
     warnData.value = res.warn || [];
@@ -264,33 +256,35 @@ let timeDate = computed(() => {
 });
 
 function goModalDetail() {
-  history.pushState({}, '', '/micro-vent-3dModal/dashboard/analysis?deviceType=model3D');
-  location.reload()
+  router.push('/micro-vent-3dModal/modelchannel/model3D/home?deviceType=model3D')
+  // history.pushState({}, '', '/micro-vent-3dModal/modelchannel/model3D/home?deviceType=model3D');
+  // location.reload()
+  pageType.value = 'model3D'
 }
 
 onMounted(() => {
+  const currentRouteObj = unref(currentRoute)
+  if (currentRouteObj && currentRouteObj['query'] && currentRouteObj['query']['deviceType']){
+    pageType.value = 'model3D'
+  }
+
+  mountMicroApp('/micro-vent-3dModal')
+  
   getList();
-  changeModalBox();
-  const renderModal = () => {
-    const element = document.getElementById('__qiankun_microapp_wrapper_for_micro_vent_3_d_modal__');
-    if (element) {
-      element?.setAttribute('style', 'width: 100%; height: 100%');
-    } else {
-      setTimeout(() => {
-        renderModal();
-      }, 2000);
-    }
-  };
-  renderModal();
   timer = Number(
     setInterval(() => {
       getList();
     }, 10000)
   );
+  resetMicroContentWH('vent-model')
 });
 onBeforeUnmount(() => {
+  unmountMicroApps(['/micro-vent-3dModal'])
+  actions.setGlobalState({ url: { path: '', query: {} } });
   clearInterval(timer);
+  timer = null
 });
+
 </script>
 
 <style lang="less" scoped>

src/views/vent/monitorManager/deviceMonitor/components/device/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="scene-box">
+  <div class="scene-box" v-if="isRefresh">
     <!-- <div class="top-header">智能通风管理系统</div> -->
     <div class="select-node" :class="{ 'node-select-show': !treeShow, 'node-select-hide': treeShow, }"
       @click="showTree('treeShow', true)">
@@ -70,40 +70,8 @@
         <a-tabs class="tabs-box" v-model:activeKey="activeKey" @change="tabChange" id="tabsBox">
           <a-tab-pane key="1" tab="实时监测">
             <template v-if="(deviceType.startsWith('fanlocal') || deviceType.startsWith('fanmain')) && activeKey == '1'">
-              <a-spin :spinning="isRefresh" >
-                <GroupMonitorTable  ref="MonitorDataTable" :dataSource="dataSource" :columnsType="`${deviceType}_monitor`" :scroll="scroll" :isAction="true" :isShowSelect="false">
-                  <template #action="{ record }">
-                      <TableAction :actions="haveDetailArr.find((item) => deviceType.startsWith(item)) ? [
-                        {
-                          label: '详情',
-                          onClick: goDetail.bind(null, record),
-                        },
-                        {
-                          label: '定位',
-                          onClick: goLocation.bind(null, record),
-                        },
-                      ] : [
-                        {
-                          label: '定位',
-                          onClick: goLocation.bind(null, record),
-                        },
-                      ]" />
-                    </template>
-                </GroupMonitorTable>
-              </a-spin>
-            </template>
-            <template v-else-if="deviceType == 'majorpath' && activeKey == '1'">
-              <a-spin :spinning="isRefresh">
-                <a-table :columns="majorColumns" :data-source="dataSource" bordered :scroll="scroll" :pagination="false">
-                </a-table>
-              </a-spin>
-            </template>
-            <template v-else-if="deviceType.startsWith('safetymonitor') && activeKey == '1'">
-              <a-spin :spinning="isRefresh">
-                <MonitorTable ref="monitorTable" :columnsType="`${deviceType}_monitor`" :dataSource="dataSource"
-                  design-scope="device_monitor" :isShowActionColumn="true" :isShowSelect="false" title="设备监测" 
-                  :form-config="formConfig" :scroll="{ y: scroll.y - 110 }">
-                  <template #action="{ record }">
+              <GroupMonitorTable  ref="MonitorDataTable" :dataSource="dataSource" :columnsType="`${deviceType}_monitor`" :scroll="scroll" :isAction="true" :isShowSelect="false">
+                <template #action="{ record }">
                     <TableAction :actions="haveDetailArr.find((item) => deviceType.startsWith(item)) ? [
                       {
                         label: '详情',
@@ -120,140 +88,163 @@
                       },
                     ]" />
                   </template>
-                  <template #filterCell="{ column, record }">
-                    <div v-if="!record.devicename && column.dataIndex === 'devicename'">-</div>
-                    <div v-if="!record.V && column.dataIndex === 'V'">-</div>
-                    <div v-if="!record.PointUnit && column.dataIndex === 'PointUnit'">-</div>
-                    <div v-if="!record.highRange && column.dataIndex === 'highRange'">-</div>
-                    <div v-if="!record.lowRange && column.dataIndex === 'lowRange'">-</div>
-                    <div v-if="!record.dataTypeName && column.dataIndex === 'dataTypeName'">-</div>
-                    <a-tag v-if="column.dataIndex === 'netStatus'" :color="record.netStatus == 0 ? 'default' : 'green'">{{
-                      record.netStatus == 0 ? '断开' : '连接'
-                    }}</a-tag>
-                  </template>
-                </MonitorTable>
-              </a-spin>
+              </GroupMonitorTable>
+            </template>
+            <template v-else-if="deviceType == 'majorpath' && activeKey == '1'">
+              <a-table :columns="majorColumns" :data-source="dataSource" bordered :scroll="scroll" :pagination="false"></a-table>
+            </template>
+            <template v-else-if="deviceType.startsWith('safetymonitor') && activeKey == '1'">
+              <MonitorTable ref="monitorTable" :columnsType="`${deviceType}_monitor`" :dataSource="dataSource"
+                design-scope="device_monitor" :isShowActionColumn="true" :isShowSelect="false" title="设备监测" 
+                :form-config="formConfig" :scroll="{ y: scroll.y - 110 }">
+                <template #action="{ record }">
+                  <TableAction :actions="haveDetailArr.find((item) => deviceType.startsWith(item)) ? [
+                    {
+                      label: '详情',
+                      onClick: goDetail.bind(null, record),
+                    },
+                    {
+                      label: '定位',
+                      onClick: goLocation.bind(null, record),
+                    },
+                  ] : [
+                    {
+                      label: '定位',
+                      onClick: goLocation.bind(null, record),
+                    },
+                  ]" />
+                </template>
+                <template #filterCell="{ column, record }">
+                  <div v-if="!record.devicename && column.dataIndex === 'devicename'">-</div>
+                  <div v-if="!record.V && column.dataIndex === 'V'">-</div>
+                  <div v-if="!record.PointUnit && column.dataIndex === 'PointUnit'">-</div>
+                  <div v-if="!record.highRange && column.dataIndex === 'highRange'">-</div>
+                  <div v-if="!record.lowRange && column.dataIndex === 'lowRange'">-</div>
+                  <div v-if="!record.dataTypeName && column.dataIndex === 'dataTypeName'">-</div>
+                  <a-tag v-if="column.dataIndex === 'netStatus'" :color="record.netStatus == 0 ? 'default' : 'green'">{{
+                    record.netStatus == 0 ? '断开' : '连接'
+                  }}</a-tag>
+                </template>
+              </MonitorTable>
             </template>
             <template v-else>
               <!-- 工作面echarts图标 -->
-              <a-spin :spinning="isRefresh">
-                <BarAndLine
-                    v-if="activeKey == '1' && deviceType == 'surface_history'"
-                    class="echarts-line"
-                    xAxisPropType="time"
-                    :dataSource="surfaceEchartsData"
-                    height="300px"
-                    :chartsColumns="surfaceChartsColumns"
-                    :option="echatsOption"
-                    chartsType="listMonitor" />
-                <MonitorTable v-else-if="activeKey == '1'" ref="monitorTable" :columnsType="`${deviceType}_monitor`" :dataSource="dataSource"
-                  design-scope="device_monitor" :isShowActionColumn="true" :isShowSelect="false" title="设备监测"
-                  :scroll="{ y: scroll.y - 30 }">
-                  <template #action="{ record }">
-                    <TableAction :actions="haveDetailArr.find((item) => deviceType.startsWith(item)) ? [
-                      {
-                        label: '详情',
-                        onClick: goDetail.bind(null, record),
-                      },
-                      {
-                        label: '定位',
-                        onClick: goLocation.bind(null, record),
-                      },
-                    ] : [
-                      {
-                        label: '定位',
-                        onClick: goLocation.bind(null, record),
-                      },
-                    ]" />
-                  
-                  </template>
-                  <template #filterCell="{ column, record }">
-                    <template v-if="deviceType.startsWith('gate')">
-                      <template v-if="record.frontGateOpenCtrl == 1 || record.frontGateOpenCtrl === true">
-                        <a-tag
-                          v-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == 0 && record.frontGateClose == 0"
-                          color="red">正在打开</a-tag>
-                        <a-tag v-else-if="column.dataIndex === 'frontGateOpen'" color="processing">打开</a-tag>
-                      </template>
-                      <template v-else-if="record.frontGateOpenCtrl == 0 || record.frontGateOpenCtrl === false">
-                        <a-tag
-                          v-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == 0 && record.frontGateClose == 0"
-                          color="red">正在关闭</a-tag>
-                        <a-tag
-                          v-else-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == 0 && record.frontGateClose == 1"
-                          color="default">关闭</a-tag>
-                        <a-tag
-                          v-else-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == 1 && record.frontGateClose == 0"
-                          color="default">打开</a-tag>
-                      </template>
-                      <template v-if="record.rearGateOpenCtrl == 1 || record.rearGateOpenCtrl === true">
-                        <a-tag
-                          v-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == 0 && record.rearGateClose == 0"
-                          color="red">正在打开</a-tag>
-                        <a-tag v-else-if="column.dataIndex === 'rearGateOpen'" color="processing">打开</a-tag>
-                      </template>
-                      <template v-else-if="record.rearGateOpenCtrl == 0 || record.rearGateOpenCtrl === false">
-                        <a-tag
-                          v-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == 0 && record.rearGateClose == 0"
-                          color="red">正在关闭</a-tag>
-                        <a-tag
-                          v-else-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == 0 && record.rearGateClose == 1"
-                          color="default">关闭</a-tag>
-                        <a-tag
-                          v-else-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == 1 && record.rearGateClose == 0"
-                          color="default">打开</a-tag>
-                      </template>
-                      <template v-if="column.dataIndex === 'ndoortype'">
-                        <span
-                          v-if="record.ndoortype == 0"
-                          color="red">行车风门</span>
-                        <span
-                          v-else
-                          color="default">行人风门</span>
-                      </template>
+              <BarAndLine
+                  v-if="activeKey == '1' && deviceType == 'surface_history'"
+                  class="echarts-line"
+                  xAxisPropType="time"
+                  :dataSource="surfaceEchartsData"
+                  height="300px"
+                  :chartsColumns="surfaceChartsColumns"
+                  :option="echatsOption"
+                  chartsType="listMonitor" />
+              <MonitorTable v-else-if="activeKey == '1'" ref="monitorTable" :columnsType="`${deviceType}_monitor`" :dataSource="dataSource"
+                design-scope="device_monitor" :isShowActionColumn="true" :isShowSelect="false" title="设备监测"
+                :scroll="{ y: scroll.y - 30 }">
+                <template #action="{ record }">
+                  <TableAction :actions="haveDetailArr.find((item) => deviceType.startsWith(item)) ? [
+                    {
+                      label: '详情',
+                      onClick: goDetail.bind(null, record),
+                    },
+                    {
+                      label: '定位',
+                      onClick: goLocation.bind(null, record),
+                    },
+                  ] : [
+                    {
+                      label: '定位',
+                      onClick: goLocation.bind(null, record),
+                    },
+                  ]" />
+              
+                </template>
+                <template #filterCell="{ column, record }">
+                  <template v-if="deviceType.startsWith('gate')">
+                    <template v-if="record.frontGateOpenCtrl == 1 || record.frontGateOpenCtrl === true">
+                      <a-tag
+                        v-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == 0 && record.frontGateClose == 0"
+                        color="red">正在打开</a-tag>
+                      <a-tag v-else-if="column.dataIndex === 'frontGateOpen'" color="processing">打开</a-tag>
                     </template>
-                    <template v-else-if="deviceType.startsWith('windrect')">
-                      <a-tag v-if="column.dataIndex === 'sign'"
-                        :color="record.sign == 0 ? '#95CF65' : record.sign == 1 ? '#4590EA' : '#9876AA'"> {{
-                          record.sign == 0 ? '高位' : record.sign == 1 ? '中位' : '低位'
-                        }}</a-tag>
-                      <template v-if="record && column && column.dataIndex === 'isRun' && record.isRun">
-                        <a-tag v-if="record.isRun == -2 || record.isRun == -1"
-                          :color="record.isRun == -2 ? '#95CF65' : '#ED5700'">{{
-                            record.isRun == -2 ? '空闲' : '等待'
-                          }}</a-tag>
-                        <a-tag v-else-if="record.isRun == 100" color="#4693FF">完成</a-tag>
-                        <Progress v-else :percent="Number(record.isRun)" size="small" status="active" />
-                      </template>
+                    <template v-else-if="record.frontGateOpenCtrl == 0 || record.frontGateOpenCtrl === false">
+                      <a-tag
+                        v-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == 0 && record.frontGateClose == 0"
+                        color="red">正在关闭</a-tag>
+                      <a-tag
+                        v-else-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == 0 && record.frontGateClose == 1"
+                        color="default">关闭</a-tag>
+                      <a-tag
+                        v-else-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == 1 && record.frontGateClose == 0"
+                        color="default">打开</a-tag>
+                    </template>
+                    <template v-if="record.rearGateOpenCtrl == 1 || record.rearGateOpenCtrl === true">
+                      <a-tag
+                        v-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == 0 && record.rearGateClose == 0"
+                        color="red">正在打开</a-tag>
+                      <a-tag v-else-if="column.dataIndex === 'rearGateOpen'" color="processing">打开</a-tag>
+                    </template>
+                    <template v-else-if="record.rearGateOpenCtrl == 0 || record.rearGateOpenCtrl === false">
+                      <a-tag
+                        v-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == 0 && record.rearGateClose == 0"
+                        color="red">正在关闭</a-tag>
+                      <a-tag
+                        v-else-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == 0 && record.rearGateClose == 1"
+                        color="default">关闭</a-tag>
+                      <a-tag
+                        v-else-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == 1 && record.rearGateClose == 0"
+                        color="default">打开</a-tag>
                     </template>
-                    <template v-else-if="deviceType.startsWith('safetymonitor')">
-                      <div v-if="!record.devicename && column.dataIndex === 'devicename'">-</div>
-                      <div v-if="!record.V && column.dataIndex === 'V'">-</div>
-                      <div v-if="!record.PointUnit && column.dataIndex === 'PointUnit'">-</div>
-                      <div v-if="!record.highRange && column.dataIndex === 'highRange'">-</div>
-                      <div v-if="!record.lowRange && column.dataIndex === 'lowRange'">-</div>
-                      <div v-if="!record.dataTypeName && column.dataIndex === 'dataTypeName'">-</div>
+                    <template v-if="column.dataIndex === 'ndoortype'">
+                      <span
+                        v-if="record.ndoortype == 0"
+                        color="red">行车风门</span>
+                      <span
+                        v-else
+                        color="default">行人风门</span>
                     </template>
-                    <a-tag v-if="column.dataIndex === 'warnFlag'"
-                      :color="record.warnFlag == 0 ? 'green' : record.warnFlag == 1 ? '#FF5812' : 'gray'"> {{
-                        record.warnFlag == 0 ? '正常' : record.warnFlag == 1 ? '报警' : record.warnFlag == 2 ? '断开' : '未监测'
+                  </template>
+                  <template v-else-if="deviceType.startsWith('windrect')">
+                    <a-tag v-if="column.dataIndex === 'sign'"
+                      :color="record.sign == 0 ? '#95CF65' : record.sign == 1 ? '#4590EA' : '#9876AA'"> {{
+                        record.sign == 0 ? '高位' : record.sign == 1 ? '中位' : '低位'
                       }}</a-tag>
-                    <template v-else-if="column.dataIndex === 'warnLevel'">
-                      <a-tag v-if="record.warnLevel == '101'" color="green">蓝色预警</a-tag>
-                      <a-tag v-else-if="record.warnLevel == '102'" color="#FF5812">黄色预警</a-tag>
-                      <a-tag v-else-if="record.warnLevel == '103'" color="#FF5812">橙色预警</a-tag>
-                      <a-tag v-else-if="record.warnLevel == '104'" color="#FF5812">红色预警</a-tag>
-                      <a-tag v-else-if="record.warnLevel == '201'" color="#FF0000">报警</a-tag>
-                      <a-tag v-else-if="record.warnLevel == '10000'" color="#FF5812">数据超限</a-tag>
-                      <a-tag v-else-if="record.warnLevel == '1001'" color="default">网络中断</a-tag>
-                      <a-tag v-else color="green">正常</a-tag>
+                    <template v-if="record && column && column.dataIndex === 'isRun' && record.isRun">
+                      <a-tag v-if="record.isRun == -2 || record.isRun == -1"
+                        :color="record.isRun == -2 ? '#95CF65' : '#ED5700'">{{
+                          record.isRun == -2 ? '空闲' : '等待'
+                        }}</a-tag>
+                      <a-tag v-else-if="record.isRun == 100" color="#4693FF">完成</a-tag>
+                      <Progress v-else :percent="Number(record.isRun)" size="small" status="active" />
                     </template>
-                    <a-tag v-if="column.dataIndex === 'netStatus'" :color="record.netStatus == 0 ? 'default' : 'green'">{{
-                      record.netStatus == 0 ? '断开' : '连接'
+                  </template>
+                  <template v-else-if="deviceType.startsWith('safetymonitor')">
+                    <div v-if="!record.devicename && column.dataIndex === 'devicename'">-</div>
+                    <div v-if="!record.V && column.dataIndex === 'V'">-</div>
+                    <div v-if="!record.PointUnit && column.dataIndex === 'PointUnit'">-</div>
+                    <div v-if="!record.highRange && column.dataIndex === 'highRange'">-</div>
+                    <div v-if="!record.lowRange && column.dataIndex === 'lowRange'">-</div>
+                    <div v-if="!record.dataTypeName && column.dataIndex === 'dataTypeName'">-</div>
+                  </template>
+                  <a-tag v-if="column.dataIndex === 'warnFlag'"
+                    :color="record.warnFlag == 0 ? 'green' : record.warnFlag == 1 ? '#FF5812' : 'gray'"> {{
+                      record.warnFlag == 0 ? '正常' : record.warnFlag == 1 ? '报警' : record.warnFlag == 2 ? '断开' : '未监测'
                     }}</a-tag>
+                  <template v-else-if="column.dataIndex === 'warnLevel'">
+                    <a-tag v-if="record.warnLevel == '101'" color="green">蓝色预警</a-tag>
+                    <a-tag v-else-if="record.warnLevel == '102'" color="#FF5812">黄色预警</a-tag>
+                    <a-tag v-else-if="record.warnLevel == '103'" color="#FF5812">橙色预警</a-tag>
+                    <a-tag v-else-if="record.warnLevel == '104'" color="#FF5812">红色预警</a-tag>
+                    <a-tag v-else-if="record.warnLevel == '201'" color="#FF0000">报警</a-tag>
+                    <a-tag v-else-if="record.warnLevel == '10000'" color="#FF5812">数据超限</a-tag>
+                    <a-tag v-else-if="record.warnLevel == '1001'" color="default">网络中断</a-tag>
+                    <a-tag v-else color="green">正常</a-tag>
                   </template>
-                </MonitorTable>
-              </a-spin>
+                  <a-tag v-if="column.dataIndex === 'netStatus'" :color="record.netStatus == 0 ? 'default' : 'green'">{{
+                    record.netStatus == 0 ? '断开' : '连接'
+                  }}</a-tag>
+                </template>
+              </MonitorTable>
             </template>
           </a-tab-pane>
           <a-tab-pane key="2" tab="历史数据" v-if="!(noHistoryArr()).find((item) => deviceType.startsWith(item))">
@@ -291,7 +282,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted, onUnmounted, ComponentOptions, shallowRef, reactive, defineProps } from 'vue'
+import { ref, onMounted, onUnmounted, ComponentOptions, shallowRef, reactive, defineProps, watch } from 'vue'
 import { SendOutlined } from '@ant-design/icons-vue';
 import { list, getDeviceList, getDeviceTypeList } from './device.api'
 import AlarmHistoryTable from '../../../comment/AlarmHistoryTable.vue';
@@ -313,6 +304,7 @@ import mainPath from './modal/mainPath.vue'
 import { formConfig } from '../../../safetyMonitor/safety.data'
 import { getDictItemsByCode } from '/@/utils/dict';
 import BarAndLine from '/@/components/chart/BarAndLine.vue';
+import { nextTick } from 'vue';
 // import { BorderBox8 as DvBorderBox8 } from '@kjgl77/datav-vue3';
 
 
@@ -347,7 +339,7 @@ const alarmHistoryTable = ref()
 const handlerHistoryTable = ref()
 
 // const routerParam = ref('home') // 默认进来时首页
-const isRefresh = ref(false)
+const isRefresh = ref(true)
 // 模态框
 const currentModal = shallowRef<Nullable<ComponentOptions>>(null); //模态框
 const modalVisible = ref<Boolean>(false); // 模态框是否可见
@@ -398,10 +390,7 @@ const onSelect: TreeProps['onSelect'] = (keys, e) => {
     clearTimeout(timer)
     timer = undefined
   }
-
-  isRefresh.value = true
   setTimeout(() => {
-    isRefresh.value = false
     selectedKeys.value = keys
     treeNodeTitle.value = e.node.title
     dataSource.value = []
@@ -749,6 +738,18 @@ function setLocation() {
   }, 600)
 }
 
+watch(() => props.pageData, (pageObj) => {
+  isRefresh.value = false
+  nextTick(() => {
+    isRefresh.value = true
+    if (pageObj.deviceid) {
+      findTreeDataValue({ deviceid: pageObj.deviceid })
+    } else if (pageObj.pageType) {
+      findTreeDataValue({ deviceType: pageObj.pageType })
+    }
+  })
+})
+
 onMounted(async () => {
   await getDeviceType()
   const pageObj = props.pageData

src/views/vent/monitorManager/deviceMonitor/index.vue

@@ -1,8 +1,9 @@
 <template>
   <div class="scene-box" >
-    <DeviceVue ref="DeviceRef" v-if="routerParam !== 'home' && routerParam !== 'timesolution' && routerParam !== 'model3D' " :pageData="pageData" />
+    <DeviceVue ref="DeviceRef" v-if="routerParam !== 'home'" :pageData="pageData" />
     <Network ref="NetworkRef" v-if="routerParam === 'timesolution'" :pageResult="pageResult" @changePageType="changePageType"/>
   </div>
+  <div id="vent-model" style="width: 100%; height: 100%; position: absolute"></div>
 </template>
 
 <script setup lang="ts">
@@ -11,6 +12,9 @@ import DeviceVue from './components/device/index.vue';
 import Network from './components/network/index.vue'
 import { getActions } from '/@/qiankun/state';
 import { useRoute } from 'vue-router';
+import { unmountMicroApps, mountMicroApp } from '/@/qiankun'
+import { onBeforeUnmount } from 'vue';
+import { resetMicroContentWH } from '/@/utils/domUtils'
 
 const route = useRoute()
 const actions = getActions();
@@ -21,6 +25,9 @@ const NetworkRef = ref(null)
 const routerParam = ref('home')
 const pageData = ref({})
 const pageResult = ref({})
+const { type, deviceType } = route.query
+
+// actions.setGlobalState({ url: { path: '/micro-vent-3dModal/dashboard/analysis', query: { type, deviceType } } });
 
 const changePageType = (pageType) => {
   console.log('页面类型', pageType)
@@ -38,15 +45,18 @@ watch(() => route.fullPath, (fullPath) => {
 })
 
 onMounted(() => {
-  const {type, deviceType } = route.query
-  if(type === 'network'){
+  mountMicroApp('/micro-vent-3dModal')
+  
+  // start()
+  
+  if (type === 'network') {
     routerParam.value = 'network'
     actions.setGlobalState({ pageObj: { pageType: 'network' } });
-  }else if(type === 'home'){
+  } else if (type === 'home') {
     actions.setGlobalState({ pageObj: { pageType: 'home' } });
   }
-  else if(type === 'tunMonitor') {
-    if(deviceType){
+  else if (type === 'tunMonitor') {
+    if (deviceType) {
       pageData.value = { pageType: deviceType }
       actions.setGlobalState({ pageObj: { pageType: deviceType } });
     }
@@ -66,10 +76,16 @@ onMounted(() => {
       }
     }
   })
+
+  resetMicroContentWH('vent-model')
 })
 
-onUnmounted(() => {
-  // actions.setGlobalState({ pageObj: { pageType: 'home' } });
+onBeforeUnmount(async() => {
+  unmountMicroApps(['/micro-vent-3dModal'])
+  const microDom = document.getElementById('vent-model')
+  if(microDom){
+    microDom.innerHTML = ''
+  }
 })
 
 </script>

src/views/vent/monitorManager/fanLocalMonitor/index.vue

@@ -44,7 +44,8 @@
           <span style="color: #00f5fe; margin-left: 5px;">风机类型：</span>
           <JDictSelectTag v-model:value="devicekide" dictCode="fanlocaltype" :showChooseOption="false" :getPopupContainer="getPopupContainer" @change="changeDeviceKind" />
         </div>
-        <div class="button-box" v-for="(item, index) in modalTypeArr.leftBtnArr" :key="index" @click="showModal(item)">{{ item.value }}</div>
+        <!-- fanlocal_systeml_zj 模拟局部风机，不显示操作按钮 -->
+        <div v-if="selectData.deviceType != 'fanlocal_systeml_zj'" class="button-box" v-for="(item, index) in modalTypeArr.leftBtnArr" :key="index" @click="showModal(item)">{{ item.value }}</div>
       </div>
       <div class="top-right row">
         <div class="button-box" v-for="(item, index) in modalTypeArr.rightBtnArr" :key="index" @click="showModal(item)">{{ item.value }}</div>
@@ -54,7 +55,7 @@
       {{ selectData.stationname }}
     </div>
     <div class="data-show-box" v-if="!loading">
-      <div class="data-item">
+      <div class="data-item" v-if="leftColumns.length > 0">
         <div class="item-header">环境监测</div>
         <div class="item-container">
           <div class="tab">
@@ -65,7 +66,7 @@
               >2#风机</div
             >
           </div>
-          <div class="container-group container-group-l">
+          <div class="container-group container-group-l" >
             <template v-if="!loading">
               <div class="container-item" v-for="(data, index) in leftColumns" :key="index">
                 <div class="item-icon">
@@ -88,7 +89,7 @@
           </div>
         </div>
       </div>
-      <div class="data-item">
+      <div class="data-item" v-if="rightColumns.length > 0">
         <div class="item-header">设备状态</div>
         <div class="item-container">
           <div class="tab">

src/views/vent/monitorManager/gateMonitor/index.vue

@@ -234,8 +234,8 @@ const initData = {
 const selectData = reactive(lodash.cloneDeep(initData));
 
 const flvURL1 = () => {
-  return ''
-  // return `/video/mainWind.mp4`;
+  // return ''
+  return `/video/gate.mp4`;
 };
 
 // 获取设备基本信息列表

src/views/vent/monitorManager/groutMonitor/components/groutHome.vue

@@ -220,6 +220,7 @@ async function getDataSource() {
     Object.assign(data, item);
     return item
   });
+  
 }
 
 function handlerDevice(param: string | Object) {

src/views/vent/monitorManager/nitrogen/components/nitrogenHome.vue

@@ -3,7 +3,7 @@
     <div v-show="monitorDataGroupFlag == 1" id="compressorCss3D"  class="threejs-Object-CSS compressorCss3D-box"
         style="width: 100%; height: 100%; position: absolute; pointer-events: none; overflow: hidden; z-index: 2; top: 0px; left: 0px">
         <!-- <a-spin :spinning="loading" /> -->
-        <div  v-for="(groupNum, index) in monitorDataGroupNum1" :key="index" class="modal-monitor">
+        <div  v-for="(groupNum, index) in monitorDataGroupNum" :key="index" class="modal-monitor">
           <fourBorderBg :class="`kyj${groupNum}`" :id="`nitrogenMonitor${groupNum}`">
             <div class="title">{{ groupNum }}号空压机 </div>
             <div class="monitor-item">
@@ -49,59 +49,11 @@
           </fourBorderBg>
         </div>
     </div>
-    <div v-show="monitorDataGroupFlag == 2" id="compressorCss3D1" class="threejs-Object-CSS compressorCss3D-box"
-        style="width: 100%; height: 100%; position: absolute; pointer-events: none; overflow: hidden; z-index: 3; top: 0px; left: 0px">
-        <div  v-for="(groupNum, index) in monitorDataGroupNum2" :key="index" class="modal-monitor">
-            <fourBorderBg :class="`kyj${groupNum}`" :id="`nitrogenMonitor${groupNum}`">
-              <div class="title">{{ groupNum }}号空压机 </div>
-              <div class="monitor-item">
-                <span class="monitor-title">机头温度:</span>
-                <span class="monitor-val"><span class="val">{{ monitorData[`PRE${groupNum}_CPR_HeadTemp`] ?
-                  monitorData[`PRE${groupNum}_CPR_HeadTemp`] : '-' }}</span><span class="unit"></span>℃</span>
-              </div>
-              <div class="monitor-item">
-                <span class="monitor-title">冷却温度:</span>
-                <span class="monitor-val"><span class="val">{{ monitorData[`PRE${groupNum}_CPR_CoolantTemp`] ?
-                  monitorData[`PRE${groupNum}_CPR_CoolantTemp`] : '-' }}</span><span class="unit">℃</span></span>
-              </div>
-              <div class="monitor-item">
-                <span class="monitor-title">排气温度:</span>
-                <span class="monitor-val"><span class="val">{{ monitorData[`PRE${groupNum}_CPR_ExhaustTemp`] ? monitorData[`PRE${groupNum}_CPR_ExhaustTemp`] : '-' }}</span><span class="unit">℃</span></span>
-              </div>
-              <div class="signal-item">
-                <div class="signal"><span class="monitor-title">运行信号</span><span
-                    :class="{ 'signal-round': true, 'signal-round-run': monitorData[`PRE${groupNum}_MOT_Running`] == '1', 'signal-round-gry': monitorData[`PRE${groupNum}_MOT_Running`] != '1' }"></span>
-                </div>
-                <div class="signal"><span class="monitor-title">故障信号</span><span
-                    :class="{ 'signal-round': true, 'signal-round-warning': monitorData[`PRE${groupNum}_MOT_Fault`] == '1', 'signal-round-gry': monitorData[`PRE${groupNum}_MOT_Fault`] != '1' }"></span>
-                </div>
-              </div>
-            </fourBorderBg>
-            <fourBorderBg :class="`cqg${groupNum}`" :id="`cqgMonitor${groupNum}`">
-              <div class="title">{{ groupNum }}号储气罐 </div>
-              <div class="monitor-item">
-                <span class="monitor-title">气囊温度:</span>
-                <span class="monitor-val"><span class="val">{{ monitorData[`PRE${groupNum}_VLS_Temp`] ?
-                  monitorData[`PRE${groupNum}_VLS_Temp`] : '-' }}</span><span class="unit">℃</span></span>
-              </div>
-              <!-- <div class="monitor-item">
-              <span class="monitor-title">气囊压力<span class="unit"></span>:</span>
-              <span class="monitor-val"><span class="val">{{ monitorData[groupNum - 1] && monitorData[groupNum - 1]['airReceiverPress'] ?
-                monitorData[groupNum - 1]['airReceiverPress'] : '-' }}</span><span class="unit">Mpa</span></span>
-            </div>
-            <div class="monitor-item">
-              <span class="monitor-title">气囊流量<span class="unit"></span>:</span>
-              <span class="monitor-val"><span class="val">{{ monitorData[groupNum - 1] && monitorData[groupNum - 1]['airReceiverFlow'] ?
-                monitorData[groupNum - 1]['airReceiverFlow'] : '-' }}</span><span class="unit">m³/k</span></span>
-            </div> -->
-            </fourBorderBg>
-          </div>
-    </div>
     <div class="nitrogen-home">
-      <div style="position: absolute; color: #fff; top: 30px; pointer-events: auto; display: flex;">
+      <!-- <div style="position: absolute; color: #fff; top: 30px; pointer-events: auto; display: flex;">
         <span class="tab-button-box" :class="{'tab-button-box-active': monitorDataGroupFlag == 1}" @click="setMonitorGroupNum(monitorDataGroupNum1, 1)">压风系统1</span>
         <span class="tab-button-box" :class="{ 'tab-button-box-active': monitorDataGroupFlag == 2 }" @click="setMonitorGroupNum(monitorDataGroupNum2, 2)">压风系统2</span>
-      </div>
+      </div> -->
       <div class="total-data">
         <div class="item">总流量(m³/min)：<span class="val">{{ monitorData[`PreSys_TotalOutPipeFlow${monitorDataGroupFlag}`] ? monitorData[`PreSys_TotalOutPipeFlow${monitorDataGroupFlag}`] : '-' }}</span></div>
         <div class="item">总压力(bar)：<span class="val">{{ monitorData[`PreSys_TotalOutPipePre${monitorDataGroupFlag}`] ? monitorData[`PreSys_TotalOutPipePre${monitorDataGroupFlag}`] : '-' }}</span></div>
@@ -209,10 +161,10 @@ import fourBorderBg from '../../../comment/components/fourBorderBg.vue'
 import { mountedThree, destroy, setModelType, clearCssText } from '../nitrogen.threejs'
 import { list } from '../nitrogen.api'
 import ventBox1 from '/@/components/vent/ventBox1.vue'
-import { monitorDataGroupNum1, monitorDataGroupNum2, airCompressorState, showMonitorData, monitorData } from '../nitrogen.data'
+import { monitorDataGroupNum1, monitorDataGroupNum2, monitorDataGroupNum3, airCompressorState, showMonitorData, monitorData } from '../nitrogen.data'
 
 const loading = ref(true)
-const monitorDataGroupNum = ref(monitorDataGroupNum1)
+const monitorDataGroupNum = ref(4)
 const monitorDataGroupFlag = ref(1)
 const kyjs = ['1号空压机', '2号空压机', '3号空压机', '4号空压机'];
 const cqgs = ['1号储气罐', '2号储气罐', '3号储气罐', '4号储气罐'];
@@ -226,7 +178,7 @@ async function getMonitor(flag?) {
       if (timer) {
         timer = null;
       }
-      await getMonitor();
+      await getMonitor(false);
     }, flag ? 0 : 1000);
   }
 };
@@ -234,142 +186,6 @@ async function getMonitor(flag?) {
 async function getDataSource() {
   const res = await list({ devicetype: 'forcFan', pagetype: 'normal' });
   let dataSource = res.msgTxt[0].datalist[0];
-  // dataSource =  
-  //   {
-  //     "msgType": null,
-  //     "deviceID": "1705212847586627592",
-  //     "strname": "压风机系统",
-  //     "strinstallpos": "压风机系统",
-  //     "fsectarea": "null",
-  //     "stationname": "压风机系统分站",
-  //     "deviceType": "forcFan",
-  //     "typeName": null,
-  //     "netStatus": 1,
-  //     "warnFlag": 0,
-  //     "warnLevel": null,
-  //     "warnLevel_str": null,
-  //     "warnTime": null,
-  //     "readTime": "2023-10-24 08:47:27",
-  //     "warnDes": "",
-  //     "frontGateOpenCtrl": null,
-  //     "rearGateOpenCtrl": null,
-  //     "readData": {
-  //       "PRE1_MOT_PhaseATemp": "526",
-  //       "PRE3_CPR_CoolantTemp": "12",
-  //       "PRE4_CPR_HeadTemp": "13",
-  //       "PRE2_MOT_PhaseATempAlarm": "0",
-  //       "PRE5_MOT_Fault": "0",
-  //       "PRE4_MOT_PhaseATempStop": "0",
-  //       "PRE4_CPR_LoadPre": "65",
-  //       "PRE5_CPR_LoadPre": "62",
-  //       "PRE4_MOT_CtrlMode": "1",
-  //       "PRE2_CPR_LoadorUnload": "1",
-  //       "PRE3_MOT_PhaseBTemp": "133",
-  //       "PRE1_CPR_ExhaustPre": "66",
-  //       "PRE1_MOT_PhaseATempAlarm": "0",
-  //       "PRE5_CPR_UnLoadPre": "69",
-  //       "PRE4_MOT_PhaseATemp": "129",
-  //       "PRE5_MOT_PhaseCTemp": "685",
-  //       "PRE5_MOT_PhaseATemp": "681",
-  //       "PRE5_VLS_Temp": "590",
-  //       "PRE1_CPR_LoadTime": "8344",
-  //       "PRE2_CPR_LoadTime": "5553",
-  //       "PRE4_CPR_LoadorUnload": "0",
-  //       "PRE5_MOT_PhaseATempAlarm": "0",
-  //       "PRE3_CPR_LoadTime": "4511",
-  //       "PRE5_CPR_LoadTime": "6032",
-  //       "PRE1_MOT_PhaseATempStop": "0",
-  //       "PRE2_MOT_CompProtFault": "0",
-  //       "PRE5_MOT_PhaseATempStop": "0",
-  //       "PRE3_MOT_PhaseATempStop": "0",
-  //       "PRE1_VLS_Temp": "436",
-  //       "PRE2_CPR_ExhaustPre": "71",
-  //       "PRE5_MOT_CtrlMode": "1",
-  //       "PRE3_CPR_ExhaustTemp": "10",
-  //       "PRE3_MOT_TotalRunTime": "5342",
-  //       "P RE2_MOT_PhaseATemp": "541",
-  //       "PRE4_MOT_PhaseCTemp": "130",
-  //       "PRE4_MOT_PhaseATempAlarm": "0",
-  //       "timestamp": "1698108447720",
-  //       "PRE3_VLS_Temp": "219",
-  //       "PRE1_HostorLoc": "0",
-  //       "PRE2_MOT_Running": "1",
-  //       "PRE1_CPR_LoadPre": "65",
-  //       "PRE1_MOT_Running": "1",
-  //       "PRE4_MOT_Fault": "0",
-  //       "PRE2_CPR_LoadPre": "65",
-  //       "PRE3_MOT_Running": "0",
-  //       "PRE4_MOT_Running": "0",
-  //       "PRE3_CPR_LoadPre": "65",
-  //       "PRE1_MOT_CtrlMode": "1",
-  //       "PRE3_MOT_CtrlMode": "1",
-  //       "PRE3_CPR_LoadorUnload": "0",
-  //       "PRE2_MOT_PhaseCTemp": "550",
-  //       "PRE1_CPR_CoolantTemp": "71",
-  //       "PRE1_MOT_PhaseBTemp": "539",
-  //       "PRE3_MOT_PhaseATempAlarm": "0",
-  //       "PRE5_MOT_Running": "1",
-  //       "PRE1_MOT_Fault": "0",
-  //       "PRE4_CPR_ExhaustPre": "66",
-  //       "PRE4_CPR_CoolantTemp": "12",
-  //       "PRE5_CPR_ExhaustTemp": "76",
-  //       "PRE2_CPR_HeadTemp": "89",
-  //       "PRE3_MOT_PhaseCTemp": "135",
-  //       "PRE4_CPR_LoadTime": "5084",
-  //       "sign": "0",
-  //       "PRE1_CPR_UnLoadPre": "72",
-  //       "PRE4_HostorLoc": "0",
-  //       "PRE4_MOT_CompProtFault": "0",
-  //       "PRE1_CPR_LoadorUnload": "1",
-  //       "PRE3_CPR_ExhaustPre": "68",
-  //       "PRE2_CPR_ExhaustTemp": "77",
-  //       "PRE2_MOT_PhaseATempStop": "0",
-  //       "PRE5_MOT_CompProtFault": "0",
-  //       "PRE2_MOT_Fault": "0",
-  //       "PRE5_MOT_PhaseBTemp": "676",
-  //       "PRE3_MOT_PhaseATemp": "134",
-  //       "PRE4_MOT_PhaseBTemp": "130",
-  //       "PRE2_CPR_CoolantTemp": "66",
-  //       "PRE3_HostorLoc": "0",
-  //       "PRE4_MOT_TotalRunTime": "5104",
-  //       "PRE1_MOT_TotalRunTime": "8416",
-  //       "PRE3_MOT_CompProtFault": "0",
-  //       "PRE3_MOT_Fault": "0",
-  //       "PRE4_CPR_UnLoadPre": "72",
-  //       "PRE1_CPR_HeadTemp": "97",
-  //       "PRE2_HostorLoc": "0",
-  //       "PRE2_MOT_PhaseBTemp": "562",
-  //       "PRE3_CPR_HeadTemp": "13",
-  //       "PRE2_MOT_TotalRunTime": "5586",
-  //       "PRE5_CPR_HeadTemp": "95",
-  //       "PRE3_CPR_UnLoadPre": "72",
-  //       "PRE4_VLS_Temp": "166",
-  //       "PRE5_CPR_CoolantTemp": "70",
-  //       "PRE1_MOT_CompProtFault": "0",
-  //       "PRE5_MOT_TotalRunTime": "7825",
-  //       "PRE2_MOT_CtrlMode": "1",
-  //       "PRE5_CPR_ExhaustPre": "68",
-  //       "PRE1_MOT_PhaseCTemp": "544",
-  //       "PRE5_CPR_LoadorUnload": "1",
-  //       "PRE2_CPR_UnLoadPre": "72",
-  //       "PRE4_CPR_ExhaustTemp": "11",
-  //       "PRE2_VLS_Temp": "445",
-  //       "isRun": "-2",
-  //       "PRE5_HostorLoc": "0",
-  //       "PRE1_CPR_ExhaustTemp": "68"
-  //     },
-  //     "readDataDes": null,
-  //     "summaryHour": [],
-  //     "summaryDay": [],
-  //     "history": [],
-  //     "totalInfo": null,
-  //     "sign": null,
-  //     "cameras": [],
-  //     "links": [],
-  //     "other1": null,
-  //     "other2": null,
-  //     "other3": null
-  //   }
   if(dataSource){
     monitorData.value = Object.assign(dataSource, dataSource.readData);
   }
@@ -386,12 +202,6 @@ async function getDataSource() {
   loading.value = false
 };
 
-function setMonitorGroupNum(num, flag){
-  
-  monitorDataGroupNum.value = num
-  monitorDataGroupFlag.value = flag
-}
-
 function handlerDevice(data) {
   // if (data.length < 1) return
   // handleAirCompressor({ id: data.id, compressRunF1: data.compressRunSigF1 }).then(res => {
@@ -421,7 +231,7 @@ watch(monitorDataGroupFlag, (newVal) => {
 })
 
 onMounted(async () => {
-  mountedThree(monitorDataGroupNum1, monitorDataGroupNum2).then(async() => {
+  mountedThree(monitorDataGroupNum3).then(async() => {
     await getMonitor(true)
     setModelType('compressor1')
   })

src/views/vent/monitorManager/windowMonitor/dandaoFc.threejs.ts

@@ -245,26 +245,41 @@ class singleWindow {
     }
   }
 
-  async initCamera(dom1?) {
+  async initCamera(dom1) {
     const videoPlayer1 = dom1;
     let monitorPlane: THREE.Mesh | null = null;
-    const canvas = await getTextCanvas(320, 180, '', 'noSinge.png');
-    const textMap = new THREE.CanvasTexture(canvas); // 关键一步
-    const textMaterial = new THREE.MeshBasicMaterial({
-      map: textMap, // 设置纹理贴图
-      transparent: true,
-      side: THREE.DoubleSide, // 这里是双面渲染的意思
-    });
-    textMaterial.blending = THREE.CustomBlending;
-    monitorPlane = this.group?.getObjectByName('noPlayer');
-    if (monitorPlane) {
-      monitorPlane.material = textMaterial;
-    } else {
-      const planeGeometry = new THREE.PlaneGeometry(100, 100); // 平面3维几何体PlaneGeometry
-      monitorPlane = new THREE.Mesh(planeGeometry, textMaterial);
-      textMaterial.dispose();
-      planeGeometry.dispose();
+
+    const textArr = [
+      {
+        text: `无信号输入`,
+        font: 'normal 40px Arial',
+        color: '#009900',
+        strokeStyle: '#002200',
+        x: 170,
+        y: 40,
+      },
+    ];
+
+    const canvas = await getTextCanvas(320, 180, textArr, null);
+    if (canvas) {
+      const textMap = new THREE.CanvasTexture(canvas); // 关键一步
+      const textMaterial = new THREE.MeshBasicMaterial({
+        map: textMap, // 设置纹理贴图
+        transparent: true,
+        side: THREE.DoubleSide, // 这里是双面渲染的意思
+      });
+      textMaterial.blending = THREE.CustomBlending;
+      monitorPlane = this.group?.getObjectByName('noPlayer');
+      if (monitorPlane) {
+        monitorPlane.material = textMaterial;
+      } else {
+        const planeGeometry = new THREE.PlaneGeometry(100, 100); // 平面3维几何体PlaneGeometry
+        monitorPlane = new THREE.Mesh(planeGeometry, textMaterial);
+        textMaterial.dispose();
+        planeGeometry.dispose();
+      }
     }
+
     const videoPlayer = this.group.getObjectByName('player1');
     if (videoPlayer) {
       this.model.clearMesh(videoPlayer);
@@ -275,17 +290,25 @@ class singleWindow {
       this.model.clearMesh(noPlayer1);
       this.group.remove(noPlayer1);
     }
+
     if (!videoPlayer1 && videoPlayer1 === null) {
-      monitorPlane.name = 'noPlayer1';
-      monitorPlane.scale.set(0.011, 0.0053, 0.012);
-      monitorPlane.position.set(-4.3, 0.13, -0.23);
-      this.group?.add(monitorPlane);
+      if (monitorPlane && !this.group.getObjectByName('noPlayer1')) {
+        const planeMesh = monitorPlane.clone();
+        planeMesh.name = 'noPlayer1';
+        planeMesh.scale.set(0.011, 0.0053, 0.012);
+        planeMesh.position.set(-4.3, 0.13, -0.23);
+        this.group?.add(planeMesh.clone());
+      }
     } else if (videoPlayer1) {
-      const mesh = renderVideo(this.group, videoPlayer1, 'player1');
-      if (mesh) {
-        mesh?.scale.set(0.0382, 0.028, 0.022);
-        mesh?.position.set(-2.008, 0.148, -0.22);
-        this.group.add(mesh);
+      try {
+        const mesh = renderVideo(this.group, videoPlayer1, 'player1');
+        if (mesh) {
+          mesh?.scale.set(0.0382, 0.028, 0.022);
+          mesh?.position.set(-2.008, 0.148, -0.22);
+          this.group.add(mesh);
+        }
+      } catch (error) {
+        console.log('视频信号异常');
       }
     }
   }

src/views/vent/monitorManager/windowMonitor/index.vue

@@ -115,7 +115,7 @@
     </div>
   </div>
   <div ref="playerRef" style="z-index: 999; position: absolute; top: 100px; right: 10px; width: 300px; height: 280px; margin: auto"></div>
-  <LivePlayer id="fc-player1" style="height: 220px; width: 300px; position: absolute; top: 0px; z-index: -1;" ref="player1" :videoUrl="flvURL1()" muted live loading controls />
+  <LivePlayer id="fc-player1" style="height: 220px; width: 300px; position: absolute; top: 0px; z-index: -1;" ref="player1" :videoUrl="flvURL1()" muted loading autoplay controls loop fluent />
   <HandleModal :modal-is-show="modalIsShow" :modal-title="modalTitle" :modal-type="modalType" @handle-ok="handleOK" @handle-cancel="handleCancel" />
 </template>
 
@@ -176,7 +176,7 @@
   const controlType = ref(1);
 
   const flvURL1 = () => {
-    return `/video/mainWind.mp4`;
+    return `/video/window.mp4`;
   };
 
   const tabChange = (activeKeyVal) => {
@@ -186,7 +186,6 @@
         MonitorDataTable.value.setSelectedRowKeys([selectData.deviceID])
       })
     }
-    
   };
 
   const initData = {

src/views/vent/monitorManager/windowMonitor/shuangdaoFc.threejs.ts

@@ -264,7 +264,6 @@ class doubleWindow {
         },
       ];
       const canvas = await getTextCanvas(320, 180, '', 'noSinge.png');
-
       let textMaterial: THREE.MeshBasicMaterial | null = null;
       if (canvas) {
         const textMap = new THREE.CanvasTexture(canvas); // 关键一步

src/views/vent/monitorManager/windrectMonitor/duisheFixed.threejs.ts

@@ -162,23 +162,36 @@ class fixedWindRect {
   async initCamera(dom1?) {
     const videoPlayer1 = dom1;
     let monitorPlane: THREE.Mesh | null = null;
-    const canvas = await getTextCanvas(320, 180, '', 'noSinge.png');
-    const textMap = new THREE.CanvasTexture(canvas); // 关键一步
-    const textMaterial = new THREE.MeshBasicMaterial({
-      map: textMap, // 设置纹理贴图
-      transparent: true,
-      side: THREE.DoubleSide, // 这里是双面渲染的意思
-    });
-    textMaterial.blending = THREE.CustomBlending;
-    monitorPlane = this.group?.getObjectByName('noPlayer');
-    if (monitorPlane) {
-      monitorPlane.material = textMaterial;
-    } else {
-      const planeGeometry = new THREE.PlaneGeometry(100, 100); // 平面3维几何体PlaneGeometry
-      monitorPlane = new THREE.Mesh(planeGeometry, textMaterial);
-      textMaterial.dispose();
-      planeGeometry.dispose();
+    const textArr = [
+      {
+        text: `无信号输入`,
+        font: 'normal 40px Arial',
+        color: '#009900',
+        strokeStyle: '#002200',
+        x: 170,
+        y: 40,
+      },
+    ];
+    const canvas = await getTextCanvas(320, 180, textArr, null);
+    if (canvas) {
+      const textMap = new THREE.CanvasTexture(canvas); // 关键一步
+      const textMaterial = new THREE.MeshBasicMaterial({
+        map: textMap, // 设置纹理贴图
+        transparent: true,
+        side: THREE.DoubleSide, // 这里是双面渲染的意思
+      });
+      textMaterial.blending = THREE.CustomBlending;
+      monitorPlane = this.group?.getObjectByName('noPlayer');
+      if (monitorPlane) {
+        monitorPlane.material = textMaterial;
+      } else {
+        const planeGeometry = new THREE.PlaneGeometry(100, 100); // 平面3维几何体PlaneGeometry
+        monitorPlane = new THREE.Mesh(planeGeometry, textMaterial);
+        textMaterial.dispose();
+        planeGeometry.dispose();
+      }
     }
+
     const videoPlayer = this.group.getObjectByName('player1');
     if (videoPlayer) {
       this.model.clearMesh(videoPlayer);
@@ -189,17 +202,25 @@ class fixedWindRect {
       this.model.clearMesh(noPlayer1);
       this.group.remove(noPlayer1);
     }
+
     if (!videoPlayer1 && videoPlayer1 === null) {
-      monitorPlane.name = 'noPlayer1';
-      monitorPlane.scale.set(0.011, 0.0053, 0.012);
-      monitorPlane.position.set(-4.3, 0.13, -0.23);
-      this.group?.add(monitorPlane);
+      if (monitorPlane && !this.group.getObjectByName('noPlayer1')) {
+        const planeMesh = monitorPlane.clone();
+        planeMesh.name = 'noPlayer1';
+        planeMesh.scale.set(0.011, 0.0053, 0.012);
+        planeMesh.position.set(-4.3, 0.13, -0.23);
+        this.group?.add(planeMesh.clone());
+      }
     } else if (videoPlayer1) {
-      const mesh = renderVideo(this.group, videoPlayer1, 'player1');
-      if (mesh) {
-        mesh?.scale.set(0.042, 0.036, 0.022);
-        mesh?.position.set(2.552, 0.018, -0.4);
-        this.group.add(mesh);
+      try {
+        const mesh = renderVideo(this.group, videoPlayer1, 'player1');
+        if (mesh) {
+          mesh?.scale.set(0.042, 0.036, 0.022);
+          mesh?.position.set(2.552, 0.018, -0.4);
+          this.group.add(mesh);
+        }
+      } catch (error) {
+        console.log('视频信号异常');
       }
     }
   }

src/views/vent/monitorManager/windrectMonitor/index.vue

@@ -120,7 +120,7 @@
     </div>
   </div>
   <div ref="playerRef" style="z-index: 999; position: absolute; top: 100px; right: 10px; width: 300px; height: 280px; margin: auto"></div>
-  <LivePlayer id="cf-player1" style="height: 220px; width: 300px; position: absolute; top: 0px; z-index: -1;" ref="player1" :videoUrl="flvURL1()" muted live loading controls />
+  <LivePlayer id="cf-player1" style="height: 220px; width: 300px; position: absolute; top: 0px; z-index: -1;" ref="player1" :videoUrl="flvURL1()" muted loading autoplay controls loop fluent/>
   <BasicModal v-bind="$attrs" @register="registerModal" title="一键测风" width="900px" @ok="handleOk" @cancel="handleCancel">
     <div class="head-line">
       <div class="vent-flex-row">
@@ -211,8 +211,8 @@
 
   const dataSource = ref([]);
   const flvURL1 = () => {
-    return ''
-    // return `/video/mainWind.mp4`;
+    // return ''
+    return `/video/wind.mp4`;
   };
 
   const tabChange = (activeKeyVal) => {

src/views/vent/monitorManager/windrectMonitor/windrect.threejs.ts

@@ -6,7 +6,7 @@ import zdWindRect from './zhedie.threejs';
 import dsWindRect from './duishe.threejs';
 import ddWindRect from './dantou.threejs';
 import lmWindRectSide from './longmenSide.threejs';
-// import fixedWindRect from './duisheFixed.threejs';
+import fixedWindRect from './duisheFixed.threejs';
 import useEvent from '../../../../utils/threejs/useEvent';
 import gsap from 'gsap';
 // import * as dat from 'dat.gui';