zhaoke 1 year ago
parent
commit
594cce83a0
2 changed files with 48 additions and 43 deletions
  1. 33 37
      src/layout/components/AppMain.vue
  2. 15 6
      src/router/routes/routes-file-six.ts

+ 33 - 37
src/layout/components/AppMain.vue

@@ -2,11 +2,7 @@
   <div class="app-main" :class="{ 'show-tag-view': settings.showTagsView }">
     <router-view v-slot="{ Component }">
       <!--has transition  Judging by settings.mainNeedAnimation-->
-      <transition
-        v-if="settings.mainNeedAnimation"
-        name="fade-transform"
-        mode="out-in"
-      >
+      <transition v-if="settings.mainNeedAnimation" name="fade-transform" mode="out-in">
         <keep-alive :include="cachedViews">
           <component :is="Component" :key="key" />
         </keep-alive>
@@ -20,39 +16,39 @@
 </template>
 
 <script setup lang="ts">
-import { ObjTy } from '~/common'
-import { useAppStore } from '@/store/app'
+import { ObjTy } from "~/common";
+import { useAppStore } from "@/store/app";
 
-const route = useRoute()
+const route = useRoute();
 const settings = computed(() => {
-  return appStore.settings
-})
+  return appStore.settings;
+});
 
 const key = computed(() =>
-  route.matched[0].name === 'RealTime' ? route.matched[2].path : route.path
-)
+  route.matched[0].name === "RealTime" ? route.matched[2]?.path : route.path
+);
 
 const cachedViews = computed(() => {
-  return appStore.cachedViews
-})
+  return appStore.cachedViews;
+});
 
 /*listen the component name changing, then to keep-alive the page*/
 // cachePage: is true, keep-alive this Page
 // leaveRmCachePage: is true, keep-alive remote when page leave
-let oldRoute: ObjTy = {}
-let deepOldRouter: ObjTy | null = null
+let oldRoute: ObjTy = {};
+let deepOldRouter: ObjTy | null = null;
 
-const appStore = useAppStore()
-const removeDeepChildren = deepOldRouter => {
-  deepOldRouter.children?.forEach(fItem => {
-    appStore.M_DEL_CACHED_VIEW_DEEP(fItem.name)
-  })
-}
+const appStore = useAppStore();
+const removeDeepChildren = (deepOldRouter) => {
+  deepOldRouter.children?.forEach((fItem) => {
+    appStore.M_DEL_CACHED_VIEW_DEEP(fItem.name);
+  });
+};
 
 watch(
   () => route.name,
   () => {
-    const routerLevel = route.matched.length
+    const routerLevel = route.matched.length;
     //二级路由处理
     if (routerLevel === 2) {
       if (deepOldRouter?.name) {
@@ -60,30 +56,30 @@ watch(
           deepOldRouter.meta?.leaveRmCachePage &&
           deepOldRouter.meta?.cachePage
         ) {
-          appStore.M_DEL_CACHED_VIEW(deepOldRouter.name)
+          appStore.M_DEL_CACHED_VIEW(deepOldRouter.name);
           //remove the deepOldRouter‘s children component
-          removeDeepChildren(deepOldRouter)
+          removeDeepChildren(deepOldRouter);
         }
       } else {
         if (oldRoute?.name) {
           if (oldRoute.meta?.leaveRmCachePage && oldRoute.meta?.cachePage) {
-            appStore.M_DEL_CACHED_VIEW(oldRoute.name)
+            appStore.M_DEL_CACHED_VIEW(oldRoute.name);
           }
         }
       }
 
       if (route.name) {
         if (route.meta?.cachePage) {
-          appStore.M_ADD_CACHED_VIEW(route.name)
+          appStore.M_ADD_CACHED_VIEW(route.name);
         }
       }
-      deepOldRouter = null
+      deepOldRouter = null;
     }
 
     //三级路由处理
     if (routerLevel === 3) {
       //三级时存储当前路由对象的上一级
-      const parentRoute = route.matched[1]
+      const parentRoute = route.matched[1];
       //deepOldRouter不为空,且deepOldRouter不是当前路由的父对象,则需要清除deepOldRouter缓存
       //一般为三级路由跳转三级路由的情况
       if (deepOldRouter?.name && deepOldRouter.name !== parentRoute.name) {
@@ -91,37 +87,37 @@ watch(
           deepOldRouter.meta?.leaveRmCachePage &&
           deepOldRouter.meta?.cachePage
         ) {
-          appStore.M_DEL_CACHED_VIEW(deepOldRouter.name)
+          appStore.M_DEL_CACHED_VIEW(deepOldRouter.name);
           //remove the deepOldRouter‘s children component
-          removeDeepChildren(deepOldRouter)
+          removeDeepChildren(deepOldRouter);
         }
       } else {
         //否则走正常两级路由处理流程
         if (oldRoute?.name) {
           if (oldRoute.meta?.leaveRmCachePage && oldRoute.meta?.cachePage) {
-            appStore.M_DEL_CACHED_VIEW_DEEP(oldRoute.name)
+            appStore.M_DEL_CACHED_VIEW_DEEP(oldRoute.name);
           }
         }
       }
 
       //取的是第二级的name
       if (parentRoute.name && parentRoute.meta?.cachePage) {
-        deepOldRouter = parentRoute
-        appStore.M_ADD_CACHED_VIEW(deepOldRouter.name)
+        deepOldRouter = parentRoute;
+        appStore.M_ADD_CACHED_VIEW(deepOldRouter.name);
         if (route.name) {
           if (route.meta?.cachePage) {
             //和第三级的name进行缓存
-            appStore.M_ADD_CACHED_VIEW_DEEP(route.name)
+            appStore.M_ADD_CACHED_VIEW_DEEP(route.name);
           }
         }
       }
     }
     oldRoute = JSON.parse(
       JSON.stringify({ name: route.name, meta: route.meta })
-    )
+    );
   },
   { immediate: true }
-)
+);
 </script>
 
 <style scoped lang="scss">

+ 15 - 6
src/router/routes/routes-file-six.ts

@@ -402,12 +402,21 @@ const ActualTimeRoutes = {
         },
       ],
     },
-    // {
-    //   path: '/realTime/trackMap',
-    //   name: 'TrackMap',
-    //   meta: { title: '轨迹地图', roles: ['track_map_page'] },
-    //   component: () => import('@/views/realTime/trackMap/index.vue'),
-    // },
+    {
+      path: '/realTime/trackMap',
+      name: 'TrackMap',
+      meta: { title: '轨迹地图', roles: ['track_map_page'] },
+      component: () => import('@/views/realTime/trackMap/index.vue'),
+    },
+    {
+      path: '/realTime/goods',
+      name: 'DepartureGoods',
+      meta: {
+        title: '货物视图',
+        keepAlive: true,
+      },
+      component: () => import('@/views/realTime/departure/goods/index.vue'),
+    },
   ],
 }