1

src/components/ColumnSet/index.vue

@@ -103,10 +103,8 @@ const submitHandler = () => {
   dialogHide()
 }
 
-const {
-  savedHiddenColumnKeysMap,
-  saveHiddenColumnKeys,
-} = useTableSettingsStore()
+const tableSettingsStore = useTableSettingsStore()
+const { savedHiddenColumnKeysMap } = storeToRefs(tableSettingsStore)
 const route = useRoute()
 
 const checkedSubmit = () => {
@@ -124,7 +122,7 @@ const updateHiddenColumnKeys = () => {
     },
     []
   )
-  saveHiddenColumnKeys(hiddenColumnKeys)
+  tableSettingsStore.saveHiddenColumnKeys(hiddenColumnKeys)
 }
 
 const columnGroups = computed(() => {
@@ -168,7 +166,7 @@ const checkedColumnKeys = computed<string[]>(() => {
 const fullTableName = route.path + (props.name ? `/${props.name}` : '')
 
 watch(needShowColumns, defaultColumns => {
-  const savedHiddenColumnKeys = savedHiddenColumnKeysMap[fullTableName]
+  const savedHiddenColumnKeys = savedHiddenColumnKeysMap.value[fullTableName]
   const columns = defaultColumns.filter(column => {
     if (savedHiddenColumnKeys?.length) {
       return !savedHiddenColumnKeys.includes(column.columnName)

src/components/KeepAliveRouterView/index.tsx

@@ -1,18 +1,18 @@
 import { KeepAlive, Transition } from 'vue'
 import { RouterView } from 'vue-router'
-import { useKeepAlive } from '@/store/keepAlive'
+import { useKeepAliveStore } from '@/store/keepAlive'
 
 export default function (name: string) {
   return defineComponent({
     name,
     setup() {
-      const { cachedViews } = useKeepAlive()
+      const { cachedViews } = storeToRefs(useKeepAliveStore())
       return () => (
         <div key={name} style="width: 100%; height: 100%">
           <RouterView>
             {({ Component }) => (
               <Transition name="fade-transform" mode="out-in">
-                <KeepAlive include={cachedViews}>
+                <KeepAlive include={cachedViews.value}>
                   <Component />
                 </KeepAlive>
               </Transition>

src/router/index.ts

@@ -8,7 +8,7 @@ import routesFour from './routes/routes-file-four'
 import routesFive from './routes/routes-file-five'
 import routesSix from './routes/routes-file-six'
 import routesSeven from './routes/routes-file-seven'
-import { Route, useKeepAlive } from '@/store/keepAlive'
+import { Route, useKeepAliveStore } from '@/store/keepAlive'
 
 const routesPush = (arr, routes) => {
   if (!Array.isArray(arr)) return '请传入数组格式路由表'
@@ -76,15 +76,19 @@ const router: Router = createRouter({
 })
 
 router.beforeEach(async (to, from, next) => {
+  const keepAliveStore = useKeepAliveStore()
   const {
     savedRoutes,
-    saveRoute,
     // cachedViews,
-    addCachedViewAll,
     // delCachedView,
+  } = storeToRefs(keepAliveStore)
+  const {
+    saveRoute,
+    addCachedViewAll,
     delCachedViewAll,
     delCachedViewUntil,
-  } = useKeepAlive()
+  } = keepAliveStore
+
   if (from.matched?.[0]?.name === 'RealTime') {
     if (to.matched[2].name !== from.matched[2].name) {
       delCachedViewAll()
@@ -114,7 +118,7 @@ router.beforeEach(async (to, from, next) => {
         (!to.query.flightNO || !to.query.flightDate)) ||
         (to.name.includes('WaybillView') && !to.query.waybillNO))
     ) {
-      const savedRoute = savedRoutes.find(
+      const savedRoute = savedRoutes.value.find(
         savedRoute => savedRoute.name === to.name
       )
       if (savedRoute) {

src/store/keepAlive.ts

@@ -5,7 +5,7 @@ export type Route = {
   fullPath: string
 }
 
-export const useKeepAlive = defineStore('keepAlive', () => {
+export const useKeepAliveStore = defineStore('keepAlive', () => {
   const savedRoutes = ref<Route[]>(
     JSON.parse(sessionStorage.getItem('savedRoutes') ?? '[]')
   )

src/views/realTime/components/AirportView/index.vue

@@ -83,7 +83,7 @@ const props = defineProps({
   },
 })
 
-const isInternational = props.name.includes('International')
+// const isInternational = props.name.includes('International')
 const isDeparture = props.name.includes('Departure')
 
 const formData: CommonData = reactive({})
@@ -416,8 +416,9 @@ const rowClassName = params => {
 const { cellClickHandler } = useTableCellClick(props.name)
 
 const route = useRoute()
-const { savedTableFilterValueMap } = useTableSettingsStore()
-const defaultFilterValueMap = savedTableFilterValueMap[route.path]
+const tableSettingsStore = useTableSettingsStore()
+const { savedTableFilterValueMap } = storeToRefs(tableSettingsStore)
+const defaultFilterValueMap = savedTableFilterValueMap.value[route.path]
 const flightStateFilter = computed<{} | { [x: string]: string[] }>(() => {
   switch (formData.flightState) {
     case 'hasTakenOff':