添加持久化标签页开关功能

src/store/modules/settings.js

@@ -5,7 +5,7 @@ import { useDynamicTitle } from '@/utils/dynamicTitle'
 const isDark = useDark()
 const toggleDark = useToggle(isDark)
 
-const { sideTheme, showSettings, navType, tagsView, tagsIcon, fixedHeader, sidebarLogo, dynamicTitle, footerVisible, footerContent } = defaultSettings
+const { sideTheme, showSettings, navType, tagsView, tagsViewPersist, tagsIcon, fixedHeader, sidebarLogo, dynamicTitle, footerVisible, footerContent } = defaultSettings
 
 const storageSetting = JSON.parse(localStorage.getItem('layout-setting')) || ''
 
@@ -19,6 +19,7 @@ const useSettingsStore = defineStore(
       showSettings: showSettings,
       navType: storageSetting.navType === undefined ? navType : storageSetting.navType,
       tagsView: storageSetting.tagsView === undefined ? tagsView : storageSetting.tagsView,
+      tagsViewPersist: storageSetting.tagsViewPersist === undefined ? tagsViewPersist : storageSetting.tagsViewPersist,
       tagsIcon: storageSetting.tagsIcon === undefined ? tagsIcon : storageSetting.tagsIcon,
       fixedHeader: storageSetting.fixedHeader === undefined ? fixedHeader : storageSetting.fixedHeader,
       sidebarLogo: storageSetting.sidebarLogo === undefined ? sidebarLogo : storageSetting.sidebarLogo,

src/store/modules/tagsView.js

@@ -1,3 +1,26 @@
+import cache from '@/plugins/cache'
+import useSettingsStore from '@/store/modules/settings'
+
+const PERSIST_KEY = 'tags-view-visited'
+
+function isPersistEnabled() {
+  return useSettingsStore().tagsViewPersist
+}
+
+function saveVisitedViews(views) {
+  if (!isPersistEnabled()) return
+  const toSave = views.filter(v => !(v.meta && v.meta.affix)).map(v => ({ path: v.path, fullPath: v.fullPath, name: v.name, title: v.title, query: v.query, meta: v.meta }))
+  cache.local.setJSON(PERSIST_KEY, toSave)
+}
+
+function loadVisitedViews() {
+  return cache.local.getJSON(PERSIST_KEY) || []
+}
+
+function clearVisitedViews() {
+  cache.local.remove(PERSIST_KEY)
+}
+
 const useTagsViewStore = defineStore(
   'tags-view',
   {
@@ -26,6 +49,15 @@ const useTagsViewStore = defineStore(
             title: view.meta.title || 'no-name'
           })
         )
+        saveVisitedViews(this.visitedViews)
+      },
+      addAffixView(view) {
+        if (this.visitedViews.some(v => v.path === view.path)) return
+        this.visitedViews.unshift(
+          Object.assign({}, view, {
+            title: view.meta.title || 'no-name'
+          })
+        )
       },
       addCachedView(view) {
         if (this.cachedViews.includes(view.name)) return
@@ -52,6 +84,7 @@ const useTagsViewStore = defineStore(
             }
           }
           this.iframeViews = this.iframeViews.filter(item => item.path !== view.path)
+          saveVisitedViews(this.visitedViews)
           resolve([...this.visitedViews])
         })
       },
@@ -84,6 +117,7 @@ const useTagsViewStore = defineStore(
             return v.meta.affix || v.path === view.path
           })
           this.iframeViews = this.iframeViews.filter(item => item.path === view.path)
+          saveVisitedViews(this.visitedViews)
           resolve([...this.visitedViews])
         })
       },
@@ -95,6 +129,7 @@ const useTagsViewStore = defineStore(
           } else {
             this.cachedViews = []
           }
+          saveVisitedViews(this.visitedViews)
           resolve([...this.cachedViews])
         })
       },
@@ -113,6 +148,7 @@ const useTagsViewStore = defineStore(
           const affixTags = this.visitedViews.filter(tag => tag.meta.affix)
           this.visitedViews = affixTags
           this.iframeViews = []
+          clearVisitedViews()
           resolve([...this.visitedViews])
         })
       },
@@ -150,6 +186,7 @@ const useTagsViewStore = defineStore(
             }
             return false
           })
+          saveVisitedViews(this.visitedViews)
           resolve([...this.visitedViews])
         })
       },
@@ -173,8 +210,16 @@ const useTagsViewStore = defineStore(
             }
             return false
           })
+          saveVisitedViews(this.visitedViews)
           resolve([...this.visitedViews])
         })
+      },
+      // 恢复持久化的 tags
+      loadPersistedViews() {
+        const views = loadVisitedViews()
+        views.forEach(view => {
+          this.addVisitedView(view)
+        })
       }
     }
   })