Browse Source

1. 修改路由跳转组件刷新问题
2. 巷道地图设备切换更改路径

hongrunxia 9 months ago
parent
commit
a2227daec1

+ 1 - 4
src/layouts/default/sider/bottomSideder.vue

@@ -105,10 +105,7 @@
         }
         if (currentRoute.value.path.startsWith('/micro-vent-3dModal')) {
           if (path.path.startsWith('/micro-vent-3dModal') && currentRoute.value.path.startsWith('/micro-vent-3dModal')) {
-            unmountMicroApps(['/micro-vent-3dModal']);
-            // nextTick(() => {
-            //   go(path.path);
-            // });
+            // unmountMicroApps(['/micro-vent-3dModal']);
             go(path.path);
           } else {
             go(path.path);

+ 4 - 2
src/layouts/page/index.vue

@@ -17,11 +17,13 @@
         <!--      >-->
         <keep-alive v-if="openCache" :include="getCaches">
           <Suspense>
-            <component :is="Component" :key="route.fullPath" />
+            <!-- <component :is="Component" :key="route.fullPath" /> -->
+            <component :is="Component" :key="route.path" />
           </Suspense>
         </keep-alive>
         <Suspense v-else>
-          <component :is="Component" :key="route.fullPath" />
+          <!-- <component :is="Component" :key="route.fullPath" /> -->
+          <component :is="Component" :key="route.path" />
         </Suspense>
 
         <!--      </transition>-->

+ 6 - 6
src/router/guard/index.ts

@@ -39,12 +39,12 @@ function createPageGuard(router: Router) {
   const loadedPageMap = new Map<string, boolean>();
 
   router.beforeEach(async (to) => {
-    if (!to.path.startsWith('/micro-vent-3dModal')) {
-      unmountMicroApps(['/micro-vent-3dModal']);
-    }
-    if (!to.path.startsWith('/micro-need-air')) {
-      unmountMicroApps(['/micro-need-air']);
-    }
+    // if (!to.path.startsWith('/micro-vent-3dModal')) {
+    //   unmountMicroApps(['/micro-vent-3dModal']);
+    // }
+    // if (!to.path.startsWith('/micro-need-air')) {
+    //   unmountMicroApps(['/micro-need-air']);
+    // }
     // 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

+ 2 - 3
src/router/routes/index.ts

@@ -20,7 +20,7 @@ const routeModuleList: AppRouteModule[] = [];
 // });
 
 export const asyncRoutes = [PAGE_NOT_FOUND_ROUTE, QIANKUN_ROUTE, ...routeModuleList];
-export const RootRoute: AppRouteRecordRaw = await(async() => {
+export const RootRoute: AppRouteRecordRaw = await (async () => {
   await getRemoteSetting();
   const glob = useGlobSetting();
   return {
@@ -81,10 +81,9 @@ export const ventModelRedirect: AppRouteRecordRaw = {
     ignoreAuth: true,
   },
   ver: '1',
-  redirect: ''
+  redirect: '',
 };
 
-
 // Basic routing without permission
 export const basicRoutes = [
   LoginRoute,

+ 10 - 6
src/views/vent/home/colliery/index.vue

@@ -45,8 +45,10 @@
               <!-- <div class="btn-icon" @click="goModalDetail"></div> -->
               <!-- 展会不显示按钮 -->
               <div v-if="sysOrgCode !== 'mkyzhpt'" class="btn-icon" @click="goModalDetail"></div>
-              <VentModal ref="centerModalRef"
-                style="width: calc(100% - 30px); height: calc(100% - 30px); position: absolute; background-color: #fff;" />
+              <VentModal
+                ref="centerModalRef"
+                style="width: calc(100% - 30px); height: calc(100% - 30px); position: absolute; background-color: #fff"
+              />
             </div>
           </div>
           <!-- 风量监测 -->
@@ -71,10 +73,12 @@
       </div>
     </div>
   </div>
-  <Network ref="NetworkRef" v-if="pageType == 'timesolution'" :pageResult="pageResult" @changePageType="changePageType"
-    style="position: absolute" />
-  <VentModal v-if="pageType == 'model3D' || pageType == 'timesolution'" ref="fullModalRef"
-    style="width: calc(100% - 30px); height: calc(100% - 30px); position: absolute" />
+  <Network ref="NetworkRef" v-if="pageType == 'timesolution'" :pageResult="pageResult" @changePageType="changePageType" style="position: absolute" />
+  <VentModal
+    v-if="pageType == 'model3D' || pageType == 'timesolution'"
+    ref="fullModalRef"
+    style="width: calc(100% - 30px); height: calc(100% - 30px); position: absolute"
+  />
 </template>
 <script lang="ts" setup>
   import { reactive, onMounted, ref, nextTick, computed, unref, inject, onBeforeUnmount, onUnmounted } from 'vue';

+ 1 - 0
src/views/vent/monitorManager/deviceMonitor/components/device/device.data.ts

@@ -419,5 +419,6 @@ export const vehicleFormConfig = {
 };
 export const haveHandlerArr = ['windrect', 'window', 'gate', 'fanlocal', 'fanmain', 'pump', 'obfurage', 'nitrogen', 'pulping', 'spray', 'dustdev']; // table无操作
 export const noWarningArr = ['location', 'vehicle', 'cheliang']; // 无预警详情的
+// export const haveSysDetailArr = ['forcFan']; //有场景详情的
 export const haveSysDetailArr = ['']; //有场景详情的
 export const noHistoryArr = () => (History_Type['type'] == 'remote' ? ['surface_history'] : []);

+ 71 - 31
src/views/vent/monitorManager/deviceMonitor/components/device/index.vue

@@ -46,28 +46,22 @@
         </div>
       </div>
     </div>
-
-    <div class="tabs-box bottom-tabs-box " style="height: 290px;" @mousedown="setDivHeight($event, 230, scroll, 0)" id="monitorBox">
-      <!-- <dv-border-box8 :dur="5"  :style="`padding: 5px; height: ${scroll.y + 100}px`" > -->
+    <div  class="tabs-box bottom-tabs-box" :class="{'table-hide': tableShow, 'table-show': !tableShow }" @mousedown="setDivHeight($event, 230, scroll, 0)" id="monitorBox">
       <div :style="`padding: 5px; height: ${scroll.y + 100}px`">
         <div class="to-small" @click="toHome"></div>
+        
         <div class="device-button-group" v-if="deviceList.length > 0">
+          <!-- 关联设备 -->
           <div class="device-button" :class="{ 'device-active': deviceActive == device.deviceType }"
             v-for="(device, index) in deviceList" :key="index" @click="monitorChange(index)">{{ device.deviceName }}
           </div>
+          <!-- 场景详情进入 -->
           <div v-if="haveSysDetailArr.find((item) => deviceType.startsWith(item))" class="enter-detail"
-            @click="goDetail()">
+            @click.stop="goDetail()">
             <send-outlined />
             {{ treeNodeTitle }}详情
           </div>
-        </div>
-        <div v-else-if="deviceType == 'forcFan'">
-          <div class="device-button-group">
-            <div class="enter-detail" @click="goDetail()">
-              <send-outlined />
-              {{ treeNodeTitle }}详情
-            </div>
-          </div>
+          
         </div>
         <div v-if="deviceType == 'gaspatrol'">
           <div class="device-button-group">
@@ -77,6 +71,10 @@
             </div>
           </div>
         </div>
+        <div class="table-hide-icon" @click="toHide">
+          <FullscreenExitOutlined />  
+          隐藏
+        </div>
         <!-- 是人员定位表单代码,由于放在tab中,表格对已知刷新,导致表单数据也在刷寻,造成输入一半的中文时会清空输入框的内容,导致的输入不上数据 -->
         <div v-if="deviceType.startsWith('location')" class="location-form" style="position: absolute; z-index: 9999; top: 50px;">
           <div class="location-form-item">
@@ -123,16 +121,6 @@
                 :pagination="false"></a-table>
             </template>
             <template v-else-if="deviceType.startsWith('safetymonitor') && activeKey == '1'">
-              <!-- <div class="location-form">
-                <div class="location-form-item">
-                  <span class="location-form-label">设备类型:</span>
-                  <Select style="width: 300px;" v-model:value="safetymonitorForm.dataTypeName" placeholder="请选择设备类型" :option="safetyOption" labelField="name" valueField="code"/>
-                </div>
-                <div class="location-form-item">
-                  <span class="location-form-label">分站名称:</span>
-                  <Input style="width: 200px;" v-model:value="safetymonitorForm.strinstallpos" />
-                </div>
-              </div> -->
               <MonitorTable ref="monitorTable" :columnsType="`${deviceType}_monitor`" :deviceType="deviceType"
                 :dataSource="dataSource" design-scope="device_monitor" :isShowActionColumn="true" :isShowSelect="false"
                 title="设备监测" :form-config="formConfig" :scroll="{ y: scroll.y - 110 }">
@@ -333,7 +321,6 @@
             </div>
           </a-tab-pane>
         </a-tabs>
-        <!-- </dv-border-box8> -->
       </div>
     </div>
     <mainPath v-if="deviceType == 'majorpath'" :dataSource="majorPathEchartsData"
@@ -345,7 +332,7 @@
 
 <script setup lang="ts">
 import { ref, onMounted, onUnmounted, ComponentOptions, shallowRef, reactive, defineProps, watch } from 'vue'
-import { SendOutlined } from '@ant-design/icons-vue';
+import { SendOutlined, FullscreenExitOutlined } from '@ant-design/icons-vue';
 import { list, getDeviceList, getDeviceTypeList, devPosition, getDepartmentInfo,getExportUrl } from './device.api'
 import AlarmHistoryTable from '../../../comment/AlarmHistoryTable.vue';
 import HistoryTable from '../../../comment/HistoryTable.vue';
@@ -358,7 +345,7 @@ import { SvgIcon } from '/@/components/Icon';
 import { getActions } from '/@/qiankun/state';
 import { useRouter } from 'vue-router';
 import { setDivHeight } from '/@/utils/event';
-import { majorColumns, haveSysDetailArr, haveDetailArr, haveHandlerArr, noWarningArr, surfaceChartsColumns, noHistoryArr, getMonitorComponent, locationFormConfig, vehicleFormConfig } from './device.data'
+import { majorColumns, haveSysDetailArr, haveDetailArr, haveHandlerArr, noWarningArr, surfaceChartsColumns, noHistoryArr, getMonitorComponent, vehicleFormConfig } from './device.data'
 import mainPath from './modal/mainPath.vue'
 import { formConfig } from '../../../safetyMonitor/safety.data'
 import { getDictItemsByCode } from '/@/utils/dict';
@@ -367,6 +354,7 @@ import MTreeSelect from '/@/components/Form/src/jeecg/components/MTreeSelect.vue
 // import ApiSelect from '/@/components/Form/src/components/ApiSelect.vue';
 import { nextTick } from 'vue';
 import { useMethods } from '/@/hooks/system/useMethods';
+import { useGo } from '/@/hooks/web/usePage';
 // import { BorderBox8 as DvBorderBox8 } from '@kjgl77/datav-vue3';
 
 const { FiberModal, BundleModal, DustModal, BallvalveModal, AtomizingModal, GaspatrolModal } = getMonitorComponent()
@@ -379,6 +367,7 @@ const props = defineProps({
   }
 })
 const { handleExportXls } = useMethods();
+const go = useGo()
 const echatsOption = {
   grid: {
     top: '35',
@@ -419,6 +408,7 @@ const modalVisible = ref<Boolean>(false); // 模态框是否可见
 
 // const drawerHeight = ref(240) // 监测框最小高度
 const treeShow = ref(true) //是否显示树形菜单
+const tableShow = ref(true) //是否显示树形菜单
 const locationSettingShow = ref(false) //是否显示树形菜单
 const treeNodeTitle = ref('') // 选中的树形标题
 
@@ -453,11 +443,11 @@ const onSelect: TreeProps['onSelect'] = (keys, e) => {
     if(deviceType.value != e.node.parent.node.type)deviceType.value = e.node.parent.node.type
     systemID.value = e.node.type
     // 传递工作面id信息,用于定位
-    actions.setGlobalState({ locationObj: { pageType: deviceType.value, deviceid: systemID.value }, pageObj: null });
+    go(`/micro-vent-3dModal/dashboard/analysis?type=tunMonitor&deviceType=${deviceType.value}&deviceid=${systemID.value}`)
   } else {
     systemType.value = e.node.type
     if(deviceType.value != e.node.type)deviceType.value = e.node.type
-    actions.setGlobalState({ locationObj: { pageType: deviceType.value }, pageObj: null });
+    go(`/micro-vent-3dModal/dashboard/analysis?type=tunMonitor&deviceType=${deviceType.value}&deviceid=`)
   }
   clearTimeout(timer)
   timer = undefined
@@ -786,7 +776,15 @@ function toHome() {
   if (timer) clearTimeout(timer)
   timer = undefined
   deviceType.value = ''
-  actions.setGlobalState({ pageObj: { pageType: 'home' } });
+  go(`/micro-vent-3dModal/dashboard/analysis`)
+  // actions.setGlobalState({ pageObj: { pageType: 'home' } });
+}
+
+function toHide() {
+  tableShow.value = !tableShow.value;
+  if(!tableShow.value){
+    document.getElementById('monitorBox').style.display = 'none';
+  }
 }
 
 async function findTreeDataValue(obj) {
@@ -1246,6 +1244,7 @@ onUnmounted(() => {
 }
 
 .location-select-hide {
+  
   right: -2px;
   animation-name: locationHide;
   /* 持续时间 */
@@ -1269,7 +1268,7 @@ onUnmounted(() => {
   transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) .5s;
 }
 .tabs-box{
-  height: 290px;
+  // height: 290px;
 }
 .bottom-tabs-box {
   position: relative;
@@ -1281,7 +1280,7 @@ onUnmounted(() => {
   .to-small {
     width: 60px;
     height: 60px;
-    background: url('/@/assets/images/vent/home/tosmall.png') no-repeat center;
+    background: url('/@/assets/images/vent/home/tohome.png') no-repeat center;
     background-size: auto;
     position: absolute;
     top: -65px;
@@ -1414,6 +1413,15 @@ onUnmounted(() => {
         box-shadow: 1px 1px 3px 1px #0efcff inset;
       }
     }
+  
+  }
+  .table-hide-icon{
+    color: #fff;
+    cursor: pointer;
+    position: absolute;
+    right: 20px;
+    top: 10px;
+    z-index: 9999
   }
 
   .enter-detail {
@@ -1456,7 +1464,18 @@ onUnmounted(() => {
     }
   }
 }
-
+.table-hide{
+  animation-name: tableHide;
+  /* 持续时间 */
+  animation-duration: 1s;
+  transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) .5s;
+}
+.table-show{
+  animation-name: tableShow;
+  /* 持续时间 */
+  animation-duration: 1s;
+  transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1) .5s;
+}
 .location-form{
   display: flex;
   margin: 8px;
@@ -1478,7 +1497,28 @@ onUnmounted(() => {
   }
 }
 
+@keyframes tableShow {
+  0% {
+    height: 0px;
+    opacity: 0;
+  }
+
+  100% {
+    height: 290px;
+    opacity: 1;
+  }
+}
+
+@keyframes tableHide {
+  0% {
+    opacity: 1;
+  }
 
+  100% {
+    height: 0px ;
+    opacity: 0 ;
+  }
+}
 
 @keyframes treeShow {
   0% {

+ 25 - 13
src/views/vent/monitorManager/deviceMonitor/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="scene-box">
-    <template v-if="isShow && routerParam !== 'timesolution' && routerParam !== 'home' && routerParam !== 'model3D'">
+    <template v-if="isShow && routerParam !== 'timesolution' && routerParam !== 'home' && routerParam !== 'model3D' && routerParam !== 'none'">
       <!-- <Emergency ref="NetworkRef" v-if="deviceKind === 'emergency'" :pageResult="pageResult" @changePageType="changePageType" />
       <DeviceVue ref="DeviceRef" v-else :pageData="pageData" /> -->
       <DeviceVue ref="DeviceRef" :pageData="pageData" />
@@ -10,7 +10,7 @@
   <VentModal style="width: 100%; height: 100%; position: absolute" />
 </template>
 
-<script setup lang="ts">
+<script setup lang="ts" name="device-monitor">
   import { ref, onMounted, watch } from 'vue';
   import DeviceVue from './components/device/index.vue';
   import Network from './components/network/index.vue';
@@ -19,6 +19,7 @@
   import { useRoute } from 'vue-router';
   import { onBeforeUnmount } from 'vue';
   import VentModal from '/@/components/vent/micro/ventModal.vue';
+  import { nextTick } from 'vue';
 
   const route = useRoute();
   const actions = getActions();
@@ -31,24 +32,35 @@
   const pageData = ref({});
   const pageResult = ref({});
 
-  // actions.setGlobalState({ url: { path: '/micro-vent-3dModal/dashboard/analysis', query: { type, deviceType } } });
-
   const changePageType = (pageType) => {
-    console.log('页面类型', pageType);
     routerParam.value = pageType;
     actions.setGlobalState({ pageObj: { pageType: pageType } });
   };
 
   watch(
     () => route.fullPath,
-    (fullPath) => {
-      debugger;
-      // const { type, deviceType } = routeVal.query
-      // if (type === 'tunMonitor') {
-      //   pageData.value = { pageType: deviceType }
-      //   actions.setGlobalState({ pageObj: { pageType: deviceType } });
-      // }
-      console.log('fullPath------------------->', fullPath);
+    () => {
+      const { type, deviceType, deviceid } = route.query;
+      if (type === 'tunMonitor') {
+        setTimeout(
+          () => {
+            routerParam.value = 'tunMonitor';
+            pageData.value = { pageType: deviceType, deviceid };
+          },
+          routerParam.value == 'home' ? 2000 : 0
+        );
+      } else if (type === 'network') {
+        routerParam.value = 'network';
+        pageData.value = {};
+      } else if (!type) {
+        routerParam.value = 'home';
+        pageData.value = {};
+      } else {
+        setTimeout(() => {
+          routerParam.value = 'none';
+          pageData.value = {};
+        }, 3000);
+      }
     }
   );