Merge branch 'master' of http://182.92.126.35:3000/hrx/mky-vent-5

src/enums/pageEnum.ts

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

src/layouts/default/content/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :class="[prefixCls, getLayoutContentMode, { 'layout-content-full': getShowFullHeader }]" v-loading="getOpenPageLoading && getPageLoading">
+  <div id="layoutPage" :class="[prefixCls, getLayoutContentMode, { 'layout-content-full': getShowFullHeader }]" v-loading="getOpenPageLoading && getPageLoading">
     <PageLayout class="page-box"/>
     <!-- update-begin-author:zyf date:20211129 for:qiankun 挂载子应用盒子 -->
     <div v-if="getShowFullHeader && loading" class="app-loading">
@@ -11,9 +11,10 @@
         </div>
       </div>
     </div>
-    <template v-show="openQianKun == 'true' && currentRoute.path.startsWith('/micro-') && !currentRoute.path.endsWith('/modelchannel/model3D-')">
-      <div id="content" class="app-view-box"  :style="{top: getShowFullHeader ? 0 : '48px'}"> </div>
-    </template>
+
+    <div class="app-view-box" v-if="openQianKun == 'true' && currentRoute.path.startsWith('/micro-') && !currentRoute.path.endsWith('/modelchannel/model3D')"  :style="{ top: getShowFullHeader ? 0 : '48px', width: '100%', height: '100%' }"> 
+      <div id="content" :style="{ width: '100%', height: '100%' }"></div>
+    </div>
     <!-- update-end-author:zyf date:20211129 for: qiankun 挂载子应用盒子-->
   </div>
 </template>
@@ -66,7 +67,8 @@
       });
       onBeforeMount(() => {});
       onMounted(() => {
-        //注册openQianKun
+        
+        // 注册openQianKun
         // console.log('window.qiankunStarted------>', window.qiankunStarted);
         if (openQianKun == 'true') {
           if (!window.qiankunStarted) {

src/layouts/default/sider/bottomSideder.vue

@@ -31,7 +31,7 @@
           </template>
         </div>
         <div class="setting-group">
-          <SvgIcon class="icon-style" size="18" name="home" @click="go('/micro-vent-3dModal/dashboard/analysis')" />
+          <SvgIcon class="icon-style" size="18" name="home" @click="go(PageEnum.BASE_HOME)" />
           <SvgIcon class="icon-style" size="18" name="fixed" />
           <SvgIcon class="icon-style" size="18" name="enter" />
           <!-- <SvgIcon class="icon-style" size="18" name="setting" />  
@@ -54,6 +54,7 @@
   import { getMenus } from '/@/router/menus';
   import { useGo } from '/@/hooks/web/usePage';
   import { useRouter } from 'vue-router';
+  import { PageEnum } from '/@/enums/pageEnum';
 
   export default defineComponent({
     name: 'BottomSider',
@@ -73,7 +74,8 @@
 
       function handleMenuClick(path: Menu) {
         if (route.path.startsWith('/micro-')) { 
-          if (route.path.startsWith('/micro-vent-3dModal/dashboard/analysis')){
+          debugger
+          if (route.path.startsWith('/'+ PageEnum.BASE_HOME)){
             const { href } = router.resolve(path.path)
             window.open(href, '_blank')
           }else {
@@ -81,7 +83,6 @@
           }
         } else {
           // micro-vent-3dModal 
-
           if(route.path.startsWith('/subSysmodal/')) {
             router.replace('/micro-vent-3dModal' + path.path)
           }else{
@@ -113,6 +114,7 @@
         openMenu,
         selectMenu,
         go,
+        PageEnum,
         currentParentRoute,
       };
     },

src/views/vent/home/clique/components/device-warn.vue

@@ -7,12 +7,12 @@
           <i style="margin: 0px 5px 0px 5px">
             <SvgIcon class="icon" size="14" name="internet-bad" />
           </i>
-          <span style="color: #fff">{{nowStatus ? '报警信息' : '网络断开'}}</span>
+          <span style="color: #fff">{{ nowStatus ? '报警信息' : '网络断开' }}</span>
         </div>
 
-        <div class="now-status">{{ nowStatus ? nowStatus : 0}}</div>
+        <div class="now-status">{{ nowStatus ? nowStatus : 0 }}</div>
       </div>
-    </div> 
+    </div>
     <div class="warn-contents">
       <div class="warn-box" v-for="(item, index) in warnList" :key="index">
         <div class="warn-icon">
@@ -40,23 +40,8 @@
     warnData: Array,
   });
 
- let nowStatus=ref<any>(0)
-  const options1 = reactive<any>([
-    {
-      value: '测试',
-      label: '测试',
-    },
-    {
-      value: '测试1',
-      label: '测试1',
-    },
-    {
-      value: '测试2',
-      label: '测试2',
-      disabled: true,
-    },
-  ]);
-
+  const emit = defineEmits(['goDetail']);
+  let nowStatus = ref<any>(0);
   let warnList = reactive<any[]>([
     { name: '报警', icon: getAssetURL('home-container/warn-icon.png'), val: 0 },
     { name: '重大风险预警', icon: getAssetURL('home-container/warn-icon.png'), val: 0 },
@@ -66,21 +51,21 @@
   ]);
 
   //跳转详情
-   function getDetail(){
-    console.log('跳转详情')
+  function getDetail() {
+    console.log('跳转详情');
   }
   watch(
     () => props.warnData,
     (val) => {
       console.log(val, '预警数据');
-      val.forEach(el=>{
-       nowStatus.value=el.netstatus.val 
-       warnList[0].val=el.red.val
-       warnList[1].val=el.alarm.val
-       warnList[2].val=el.orange.val
-       warnList[3].val=el.yellow.val
-       warnList[4].val=el.blue.val
-      })
+      val.forEach((el) => {
+        nowStatus.value = el.netstatus.val;
+        warnList[0].val = el.red.val;
+        warnList[1].val = el.alarm.val;
+        warnList[2].val = el.orange.val;
+        warnList[3].val = el.yellow.val;
+        warnList[4].val = el.blue.val;
+      });
     },
     {
       deep: true,
@@ -105,7 +90,7 @@
       font-size: 16px;
       font-family: 'douyuFont';
       cursor: pointer;
-      &:hover{
+      &:hover {
         color: #66ffff;
       }
     }

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

@@ -37,6 +37,7 @@
   let props = defineProps({
     fandata: Array,
   });
+  const emit = defineEmits(['goDetail'])
   const go = useGo();
   let searchValue = ref('');
   let fanList=reactive<any[]>([])
@@ -47,14 +48,13 @@
   //获取dom节点
   let fan = ref<any>();
   //echart图表数据
-  let echartData = reactive<any>({
-    xdata: 80,
-    ydata: 60,
-  });
-  //跳转详情
-  function getDetail() {
-    console.log('跳转详情');
-    go('/micro-vent-3dModal/dashboard/analysis');
+  let echartData=reactive<any>({
+    xdata:0,
+    ydata:0
+  })
+//跳转详情
+function getDetail(){
+    emit('goDetail', 'fanlocal')
   }
   //选项切换
   function changeSelect(val) {

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

@@ -33,11 +33,12 @@
   import { ref, reactive, onMounted, nextTick, defineProps, watch } from 'vue';
   import { SvgIcon } from '/@/components/Icon';
   import * as echarts from 'echarts';
+ 
 
   let props = defineProps({
     maindata: Array,
   });
-
+  const emit = defineEmits(['goDetail'])
   let searchValue = ref('');
   let mainTypeList = reactive<any>([]); //下拉框
   let mainList = reactive<any[]>([]); //主风机列表
@@ -53,6 +54,7 @@
   //跳转详情
   function getDetail() {
     console.log('跳转详情');
+    emit('goDetail', 'fanmain')
   }
   //选项切换
   function changeSelect(val) {

src/views/vent/home/clique/components/wind-device.vue

@@ -41,7 +41,7 @@
 <script lang="ts" setup>
   import { ref, reactive } from 'vue';
   import { getAssetURL } from '/@/utils/ui';
-
+  const emit = defineEmits(['goDetail'])
   let iconsMonitor = reactive({
     1: {
       url: getAssetURL('home-container/device/zhushan.png'),
@@ -122,6 +122,7 @@
   //跳转详情
   function getDetail() {
     console.log('跳转详情');
+    emit('goDetail', 'gate')
   }
 </script>
 

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

@@ -48,6 +48,7 @@
   import { ref, reactive, onMounted, nextTick, defineProps, watch } from 'vue';
   import { SvgIcon } from '/@/components/Icon';
   import * as echarts from 'echarts';
+  const emit = defineEmits(['goDetail'])
 
   let props = defineProps({
     lineList: Array,
@@ -78,6 +79,7 @@
   //跳转详情
   function getDetail() {
     console.log('跳转详情');
+    emit('goDetail', 'obfurage')
   }
   //选项切换
   function changeSelect(val) {

src/views/vent/home/clique/components/wind-monitor.vue

@@ -10,6 +10,7 @@
 <script lang="ts" setup>
   import { ref, reactive, nextTick, onMounted, defineProps, watch } from 'vue';
   import * as echarts from 'echarts';
+  const emit = defineEmits(['goDetail'])
 
   let props = defineProps({
     flList: Array,
@@ -21,7 +22,7 @@
   let echartData = reactive<any>({ ydata: [], xdata: [] });
   //跳转详情
   function getDetail() {
-    console.log('跳转详情');
+    emit('goDetail', 'windrect')
   }
   function getOption() {
     nextTick(() => {

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

@@ -35,7 +35,7 @@
   let props = defineProps({
     workList: Array,
   });
-
+  const emit = defineEmits(['goDetail']);
   let workData = reactive<any[]>([]);
   let searchValue = ref('');
   const workTypeList = reactive<any[]>([]);

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

@@ -1,73 +1,77 @@
 <template>
-  <div class="home-container">
-    <div class="header">
-      <div class="head-time">
-        <span>2022/03/28</span>
-        <span>星期一</span>
-        <span>13:46:37</span>
-      </div>
-      <div class="main-title">通防智能管控系统</div>
-    </div>
-    <div class="home-contents">
-      <div class="left-content">
-        <!-- 局部通风机 -->
-        <div class="monitor-box">
-          <fanMonitor :fandata="fanLocalList" />
-        </div>
-        <!-- 主通风机 -->
-        <div class="monitor-box monitor-box1">
-          <mainMonitor :maindata="mainList" />
-        </div>
-        <!-- 通风设备远程控制 -->
-        <div class="monitor-box">
-          <windDevice />
+  <div style="position: relative; width: 100%; height: 100%;">
+    <div class="home-container" v-if="pageType == 'home'">
+      <div class="header">
+        <div class="head-time">
+          <span>2022/03/28</span>
+          <span>星期一</span>
+          <span>13:46:37</span>
         </div>
+        <div class="main-title">通防智能管控系统</div>
       </div>
-      <div class="center-content">
-        <!-- 三维模型 -->
-        <div class="three-box">
-          <div class="three-nav">
-            <div class="nav-item" v-for="(item, index) in navList" :key="index">
-              <div class="item-label">{{ item.name }}</div>
-              <div class="item-value">
-                <div v-if="item.isShow" class="bg-box" v-for="(ite, ind) in item.valList" :key="ind">
-                  <div class="box-line"></div>
-                  <div class="value-text">{{ ite.val }}</div>
+      <div class="home-contents">
+        <div class="left-content">
+          <!-- 局部通风机 -->
+          <div class="monitor-box">
+            <fanMonitor @goDetail="goDetail" :fandata="fanLocalList" />
+          </div>
+          <!-- 主通风机 -->
+          <div class="monitor-box monitor-box1">
+            <mainMonitor  @goDetail="goDetail"/>
+          </div>
+          <!-- 通风设备远程控制 -->
+          <div class="monitor-box">
+            <windDevice @goDetail="goDetail"/>
+          </div>
+        </div>
+        <div class="center-content">
+          <!-- 三维模型 -->
+          <div class="three-box">
+            <div class="three-nav">
+              <div class="nav-item" v-for="(item, index) in navList" :key="index">
+                <div class="item-label">{{ item.name }}</div>
+                <div class="item-value">
+                  <div v-if="item.isShow" class="bg-box" v-for="(ite, ind) in item.valList" :key="ind">
+                    <div class="box-line"></div>
+                    <div class="value-text">{{ ite.val }}</div>
+                  </div>
+                  <div v-else class="value-text1">{{ item.val }}</div>
                 </div>
-                <div v-else class="value-text1">{{ item.val }}</div>
               </div>
             </div>
+            <div class="three-modal" id="modalBox">
+              <!-- <iframe id="iframe" ref="iframe" src="http://10.10.150.72:8091/user/autologin" scrolling="auto" frameborder="0" width="100%" height="100%"></iframe> -->
+            
+            </div>
           </div>
-          <div class="three-modal">
-            <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="content" style="width: 100%; height: 100%;"></div> -->
+          <!-- 风量监测 -->
+          <div class="wind-box">
+            <windMonitor @goDetail="goDetail"/>
           </div>
         </div>
-        <!-- 风量监测 -->
-        <div class="wind-box" >
-          <windMonitor :flList="flList" />
-        </div>
-      </div>
-      <div class="right-content">
-        <!-- 关键通风路线 -->
-        <div class="monitor-box">
-          <windLine :lineList="lineList"/>
-        </div>
-        <!-- 工作面智能管控 -->
-        <div class="monitor-box monitor-box1">
-          <workMonitor :workList="workList" />
-        </div>
-        <!-- 设备预警 -->
-        <div class="monitor-box">
-          <deviceWarn :warnData="warnData"/>
+        <div class="right-content">
+          <!-- 关键通风路线 -->
+          <div class="monitor-box">
+            <windLine @goDetail="goDetail"/>
+          </div>
+          <!-- 工作面智能管控 -->
+          <div class="monitor-box monitor-box1">
+            <workMonitor @goDetail="goDetail"/>
+          </div>
+          <!-- 设备预警 -->
+          <div class="monitor-box">
+            <deviceWarn @goDetail="goDetail"/>
+          </div>
         </div>
       </div>
     </div>
+    <DeviceMonitor v-else-if="pageType" :pageType="pageType" @goHome="goHome"/>
+    <div id="content" style="width: 100%; height: 100%; position: fixed;"></div>
   </div>
+  
 </template>
 <script lang="ts" setup>
-  import { reactive, onMounted, ref } from 'vue';
-  import { getActions } from '/@/qiankun/state';
+  import { reactive, onMounted, ref, nextTick } from 'vue';
   import fanMonitor from './components/fan-monitor.vue';
   import mainMonitor from './components/main-monitor.vue';
   import windDevice from './components/wind-device.vue';
@@ -76,9 +80,9 @@
   import workMonitor from './components/work-monitor.vue';
   import deviceWarn from './components/device-warn.vue';
   import { useGlobSetting } from '/@/hooks/setting';
-  import {list} from './clique.api'
+  import { list } from './clique.api';
+  import DeviceMonitor from '../../monitorManager/deviceMonitor/index.vue'
   
-
   let timer: NodeJS.Timeout | null = null;
   let fanLocalList = reactive<any[]>([]); //局部风机数据
   let mainList=ref<any[]>([])//主通风机数据
@@ -100,6 +104,38 @@
     { name: '外部漏风率', isShow: false, val:0 },
     { name: '有效风量率', isShow: false, val: 0 },
   ]);
+  
+  const loading = ref(false);
+  const globSetting = useGlobSetting();
+  const openQianKun = globSetting.openQianKun;
+  let actions;
+  const pageType = ref('home')
+
+function goDetail(deviceType) {
+  pageType.value = deviceType
+  changeModalBox()
+}
+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-----------');
@@ -121,14 +157,27 @@
       warnData.value=res.warn
     });
   }
+
+
   onMounted(() => {
-    // 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)
     );
-  });
+  })
 </script>
 
 <style lang="less" scoped>
@@ -143,6 +192,7 @@
   .home-container {
     width: 100%;
     height: 100%;
+    position: relative;
     .header {
       width: 100%;
       height: 76px;
@@ -318,4 +368,4 @@
   //   width: 100% !important;
   //   height: 100% !important;
   // }
-</style>
+</style>

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

@@ -1,5 +1,6 @@
 <template>
   <div class="scene-box">
+    <div id="content" style="width: 100%; height: 100%; position: fixed; z-index: 9999;"></div>
     <!-- <div class="top-header">智能通风管理系统</div> -->
     <div class="select-node" :class="{ 'node-select-show': !treeShow, 'node-select-hide': treeShow, }"
       @click="showTree('treeShow', true)">
@@ -205,11 +206,11 @@ import BundleModal from './modal/bundle.modal.vue'
 import DustModal from './modal/dust.modal.vue'
 import { SvgIcon } from '/@/components/Icon';
 import { getActions } from '/@/qiankun/state';
-import { useRouter } from 'vue-router';
 import { setDivHeight } from '/@/utils/event';
 import { majorColumns } from  './device.data'
+import { useGo } from '/@/hooks/web/usePage';
 // import { BorderBox8 as DvBorderBox8 } from '@kjgl77/datav-vue3';
-
+const emit = defineEmits(['goHome'])
 
 type DeviceType = { deviceType: string, deviceName: string, datalist: any[] };
 
@@ -217,10 +218,13 @@ const props = defineProps({
   pageData: {
     type: Object,
     default: () => { }
+  },
+  monitorType: {
+    type: String,
+    default: ''
   }
 })
 
-const router = useRouter()
 
 const actions = getActions();
 // actions.setGlobalState({ pageObj: { pageType: 'home' } });
@@ -319,6 +323,8 @@ async function getDeviceType() {
       return dataSourceList
     }
     treeData.value = getData(result, dataSource, key)
+    debugger
+    console.log('treeData.value------------>', treeData.value)
   }
 }
 
@@ -460,29 +466,33 @@ function goDetail(record?) {
 }
 
 function toHome() {
-  deviceList.value = []
-  if (timer) clearTimeout(timer)
-  timer = undefined
-  deviceType.value = ''
-  actions.setGlobalState({ pageObj: { pageType: 'home' } });
+  // history.pushState({}, '', '/micro-vent-3dModal/modelchannel/model3D');
+  // go('/micro-vent-3dModal/modelchannel/model3D')
+  emit('goHome')
 }
 
 async function findTreeDataValue(obj) {
+  
   const findDeviceType = (data: [], obj) => {
     let type = ''
-    if (obj.deviceid) {
+    if (obj && obj.deviceid) {
       type = obj.deviceid
     } else {
       type = obj.deviceType
     }
+    debugger
     data.find((item: any) => {
       if (item.children.length > 0) {
         findDeviceType(item.children, obj)
       }
-
-      if (item.type == type) {
+      if(item.type == 'fanlocal'){
+        item.type
+        debugger
+      }
+      if (item.type == type && obj) {
+        
         deviceType.value = obj.deviceid ? 'sys' : item.type
-        if (obj.deviceid) systemID.value = obj.deviceid
+        if (obj && obj.deviceid) systemID.value = obj.deviceid
         selectedKeys.value = [item.key]
         expandedKeys.value = [item.key]
         treeNodeTitle.value = item.title
@@ -491,7 +501,7 @@ async function findTreeDataValue(obj) {
       return false
     })
   }
-
+  await getDeviceType()
   findDeviceType(treeData.value, obj)
 
   if (timer === undefined) {
@@ -535,21 +545,23 @@ function setLocation() {
   }, 600)
 }
 
-
-
 onMounted(async () => {
   await getDeviceType()
-
   const pageObj = props.pageData
-  if (pageObj.deviceid) {
-    findTreeDataValue({ deviceid: pageObj.deviceid })
-  } else {
-    findTreeDataValue({ deviceType: pageObj.pageType })
+  if(pageObj){
+    if (pageObj.deviceid) {
+      findTreeDataValue({ deviceid: pageObj.deviceid })
+    } else {
+      if (pageObj.pageType) findTreeDataValue({ deviceType: pageObj.pageType })
+    }
+    // 定位
+    const posShowData = pageObj.locationPlane
+    if (posShowData) {
+      locationList.value = posShowData
+    }
   }
-  // 定位
-  const posShowData = pageObj.locationPlane
-  if (posShowData) {
-    locationList.value = posShowData
+  if(props.monitorType){
+    findTreeDataValue({ deviceType: props.monitorType })
   }
 })
 

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

@@ -1,41 +1,62 @@
 <template>
   <div class="scene-box" >
-    <DeviceVue ref="DeviceRef" v-if="routerParam !== 'home' && routerParam !== 'timesolution' && routerParam !== 'model3D' " :pageData="pageData" />
     <Network ref="NetworkRef" v-if="routerParam === 'timesolution'" :pageResult="pageResult" @changePageType="changePageType"/>
+    <DeviceVue ref="DeviceRef" v-else-if="routerParam === 'tunMonitor'" :pageData="pageData" :monitorType="monitorType" @goHome="emit('goHome')"/>
   </div>
 </template>
 
 <script setup lang="ts">
-import { ref, onUnmounted, onMounted } from 'vue';
+import { ref, onUnmounted, onMounted, watch } from 'vue';
 import DeviceVue from './components/device/index.vue';
 import Network from './components/network/index.vue'
 import { getActions } from '/@/qiankun/state';
 import { useRoute } from 'vue-router';
-
+const emit = defineEmits(['goHome'])
+const props = defineProps({
+  pageType: {
+    type: String,
+    default: ''
+  }
+})
 const route = useRoute()
 const actions = getActions();
 
 const DeviceRef = ref(null)
-const NetworkRef = ref(null)
+const NetworkRef = ref<Object | null>(null)
 
 const routerParam = ref('home')
 const pageData = ref(null)
 const pageResult = ref({})
+const monitorType = ref(props.pageType)
 
 const changePageType = (pageType) => {
   console.log('页面类型', pageType)
   routerParam.value = pageType
   actions.setGlobalState({ pageObj: { pageType: pageType } });
 }
+const getPage = (pageType) => {
+
+}
 
 onMounted(() => {
-  const {type} = route.query
-  if(type === 'network'){
-    routerParam.value = 'network'
-    actions.setGlobalState({ pageObj: { pageType: 'network' } });
-  }else{
-    actions.setGlobalState({ pageObj: { pageType: 'home' } });
+  
+  if(props.pageType){
+    routerParam.value = 'tunMonitor'
+    monitorType.value = props.pageType
   }
+
+  // const {type, deviceType } = route.query
+  // if(type === 'network'){
+  //   routerParam.value = 'network'
+  //   actions.setGlobalState({ pageObj: { pageType: 'network' } });
+  // } else if (type === 'tunMonitor') {
+  //   routerParam.value = 'tunMonitor'
+  //   debugger
+  //   monitorType.value = deviceType as string
+  //   // actions.setGlobalState({ locationObj: { pageType: deviceType, deviceid: '' }, pageObj: null });
+  // } else{
+  //   actions.setGlobalState({ pageObj: { pageType: 'home' } });
+  // }
   actions.onGlobalStateChange((newState) => {
     for (const key in newState) {
       if (key === 'pageObj') {