feat: theme cache

Author: cole

src/hooks/useTheme.js

@@ -1,16 +1,19 @@
 import { computed, ref, unref } from 'vue'
 import { theme as antTheme } from 'ant-design-vue'
+import { localCache, THEME__LOCAL } from '@/utils/storage'
+
+const defaultValues = {
+    theme: 'dark',
+    primary: 'blue',
+    compact: false
+}
 
 function useTheme () {
+    const themeCache = localCache.getObj(THEME__LOCAL)
     const { darkAlgorithm, compactAlgorithm } = antTheme
     const { token } = antTheme.useToken()
 
-    // @todo 添加缓存
-    const themeConfig = ref({
-        theme: 'dark',
-        primary: 'blue',
-        compact: false
-    })
+    const themeConfig = ref(themeCache || defaultValues)
 
     const themeProvider = computed(() => {
         const { theme, primary, compact } = unref(themeConfig)
@@ -26,6 +29,7 @@ function useTheme () {
 
     function setThemeConfig (value) {
         themeConfig.value = value
+        localCache.setObj(THEME__LOCAL, value)
     }
 
     return { themeConfig, themeProvider, setThemeConfig }

src/utils/storage.js

@@ -59,6 +59,7 @@ export const sessionCache = new GalleryCache(sessionStorage)
 
 export const TAGS__LOCAL = 'tags'
 export const LOCALE__LOCAL = 'locale'
+export const THEME__LOCAL = 'theme'
 
 // 用户账号
 export const USERNAME__LOCAL = 'username'