Commit 3e60ff29701970e5b591e7104b5214a455a0156c
1 parent
c8c6e349
feat: add cache key
Showing
18 changed files
with
100 additions
and
81 deletions
yudao-ui-admin-vue3/src/App.vue
| @@ -4,7 +4,7 @@ import { isDark } from '@/utils/is' | @@ -4,7 +4,7 @@ import { isDark } from '@/utils/is' | ||
| 4 | import { useAppStore } from '@/store/modules/app' | 4 | import { useAppStore } from '@/store/modules/app' |
| 5 | import { useDesign } from '@/hooks/web/useDesign' | 5 | import { useDesign } from '@/hooks/web/useDesign' |
| 6 | import { ConfigGlobal } from '@/components/ConfigGlobal' | 6 | import { ConfigGlobal } from '@/components/ConfigGlobal' |
| 7 | -import { useCache } from '@/hooks/web/useCache' | 7 | +import { CACHE_KEY, useCache } from '@/hooks/web/useCache' |
| 8 | 8 | ||
| 9 | const { getPrefixCls } = useDesign() | 9 | const { getPrefixCls } = useDesign() |
| 10 | const prefixCls = getPrefixCls('app') | 10 | const prefixCls = getPrefixCls('app') |
| @@ -15,8 +15,8 @@ const { wsCache } = useCache() | @@ -15,8 +15,8 @@ const { wsCache } = useCache() | ||
| 15 | 15 | ||
| 16 | // 根据浏览器当前主题设置系统主题色 | 16 | // 根据浏览器当前主题设置系统主题色 |
| 17 | const setDefaultTheme = () => { | 17 | const setDefaultTheme = () => { |
| 18 | - if (wsCache.get('isDark')) { | ||
| 19 | - if (wsCache.get('isDark') || wsCache.get('isDark') === 'true') { | 18 | + if (wsCache.get(CACHE_KEY.IS_DARK)) { |
| 19 | + if (wsCache.get(CACHE_KEY.IS_DARK) || wsCache.get(CACHE_KEY.IS_DARK) === 'true') { | ||
| 20 | appStore.setIsDark(true) | 20 | appStore.setIsDark(true) |
| 21 | } else { | 21 | } else { |
| 22 | appStore.setIsDark(false) | 22 | appStore.setIsDark(false) |
yudao-ui-admin-vue3/src/components/Setting/src/Setting.vue
| @@ -3,7 +3,7 @@ import { ElDrawer, ElDivider, ElMessage } from 'element-plus' | @@ -3,7 +3,7 @@ import { ElDrawer, ElDivider, ElMessage } from 'element-plus' | ||
| 3 | import { ref, unref, computed, watch } from 'vue' | 3 | import { ref, unref, computed, watch } from 'vue' |
| 4 | import { useCssVar, useClipboard } from '@vueuse/core' | 4 | import { useCssVar, useClipboard } from '@vueuse/core' |
| 5 | import { useI18n } from '@/hooks/web/useI18n' | 5 | import { useI18n } from '@/hooks/web/useI18n' |
| 6 | -import { useCache } from '@/hooks/web/useCache' | 6 | +import { CACHE_KEY, useCache } from '@/hooks/web/useCache' |
| 7 | import { useDesign } from '@/hooks/web/useDesign' | 7 | import { useDesign } from '@/hooks/web/useDesign' |
| 8 | 8 | ||
| 9 | import { trim, setCssVar } from '@/utils' | 9 | import { trim, setCssVar } from '@/utils' |
| @@ -188,9 +188,9 @@ const copyConfig = async () => { | @@ -188,9 +188,9 @@ const copyConfig = async () => { | ||
| 188 | // 清空缓存 | 188 | // 清空缓存 |
| 189 | const clear = () => { | 189 | const clear = () => { |
| 190 | const { wsCache } = useCache() | 190 | const { wsCache } = useCache() |
| 191 | - wsCache.delete('layout') | ||
| 192 | - wsCache.delete('theme') | ||
| 193 | - wsCache.delete('isDark') | 191 | + wsCache.delete(CACHE_KEY.LAYOUT) |
| 192 | + wsCache.delete(CACHE_KEY.THEME) | ||
| 193 | + wsCache.delete(CACHE_KEY.IS_DARK) | ||
| 194 | window.location.reload() | 194 | window.location.reload() |
| 195 | } | 195 | } |
| 196 | </script> | 196 | </script> |
yudao-ui-admin-vue3/src/components/UserInfo/src/UserInfo.vue
| 1 | <script setup lang="ts"> | 1 | <script setup lang="ts"> |
| 2 | import { ElDropdown, ElDropdownMenu, ElDropdownItem, ElMessageBox } from 'element-plus' | 2 | import { ElDropdown, ElDropdownMenu, ElDropdownItem, ElMessageBox } from 'element-plus' |
| 3 | import { useI18n } from '@/hooks/web/useI18n' | 3 | import { useI18n } from '@/hooks/web/useI18n' |
| 4 | -import { useCache } from '@/hooks/web/useCache' | 4 | +import { CACHE_KEY, useCache } from '@/hooks/web/useCache' |
| 5 | import { useRouter } from 'vue-router' | 5 | import { useRouter } from 'vue-router' |
| 6 | import { useDesign } from '@/hooks/web/useDesign' | 6 | import { useDesign } from '@/hooks/web/useDesign' |
| 7 | import avatarImg from '@/assets/imgs/avatar.gif' | 7 | import avatarImg from '@/assets/imgs/avatar.gif' |
| @@ -22,7 +22,7 @@ const { getPrefixCls } = useDesign() | @@ -22,7 +22,7 @@ const { getPrefixCls } = useDesign() | ||
| 22 | 22 | ||
| 23 | const prefixCls = getPrefixCls('user-info') | 23 | const prefixCls = getPrefixCls('user-info') |
| 24 | 24 | ||
| 25 | -const user = wsCache.get('user') | 25 | +const user = wsCache.get(CACHE_KEY.USER) |
| 26 | 26 | ||
| 27 | const avatar = user.user.avatar ? user.user.avatar : avatarImg | 27 | const avatar = user.user.avatar ? user.user.avatar : avatarImg |
| 28 | 28 |
yudao-ui-admin-vue3/src/directives/permission/hasPermi.ts
| 1 | import type { App } from 'vue' | 1 | import type { App } from 'vue' |
| 2 | -import { useCache } from '@/hooks/web/useCache' | 2 | +import { CACHE_KEY, useCache } from '@/hooks/web/useCache' |
| 3 | import { useI18n } from '@/hooks/web/useI18n' | 3 | import { useI18n } from '@/hooks/web/useI18n' |
| 4 | const { t } = useI18n() // 国际化 | 4 | const { t } = useI18n() // 国际化 |
| 5 | 5 | ||
| @@ -8,7 +8,7 @@ export function hasPermi(app: App<Element>) { | @@ -8,7 +8,7 @@ export function hasPermi(app: App<Element>) { | ||
| 8 | const { wsCache } = useCache() | 8 | const { wsCache } = useCache() |
| 9 | const { value } = binding | 9 | const { value } = binding |
| 10 | const all_permission = '*:*:*' | 10 | const all_permission = '*:*:*' |
| 11 | - const permissions = wsCache.get('user').permissions | 11 | + const permissions = wsCache.get(CACHE_KEY.USER).permissions |
| 12 | 12 | ||
| 13 | if (value && value instanceof Array && value.length > 0) { | 13 | if (value && value instanceof Array && value.length > 0) { |
| 14 | const permissionFlag = value | 14 | const permissionFlag = value |
yudao-ui-admin-vue3/src/directives/permission/hasRole.ts
| 1 | import type { App } from 'vue' | 1 | import type { App } from 'vue' |
| 2 | -import { useCache } from '@/hooks/web/useCache' | 2 | +import { CACHE_KEY, useCache } from '@/hooks/web/useCache' |
| 3 | import { useI18n } from '@/hooks/web/useI18n' | 3 | import { useI18n } from '@/hooks/web/useI18n' |
| 4 | const { t } = useI18n() // 国际化 | 4 | const { t } = useI18n() // 国际化 |
| 5 | 5 | ||
| @@ -8,7 +8,7 @@ export function hasRole(app: App<Element>) { | @@ -8,7 +8,7 @@ export function hasRole(app: App<Element>) { | ||
| 8 | const { wsCache } = useCache() | 8 | const { wsCache } = useCache() |
| 9 | const { value } = binding | 9 | const { value } = binding |
| 10 | const super_admin = 'admin' | 10 | const super_admin = 'admin' |
| 11 | - const roles = wsCache.get('user').roles | 11 | + const roles = wsCache.get(CACHE_KEY.USER).roles |
| 12 | 12 | ||
| 13 | if (value && value instanceof Array && value.length > 0) { | 13 | if (value && value instanceof Array && value.length > 0) { |
| 14 | const roleFlag = value | 14 | const roleFlag = value |
yudao-ui-admin-vue3/src/hooks/web/useCache.ts
| @@ -6,6 +6,16 @@ import WebStorageCache from 'web-storage-cache' | @@ -6,6 +6,16 @@ import WebStorageCache from 'web-storage-cache' | ||
| 6 | 6 | ||
| 7 | type CacheType = 'localStorage' | 'sessionStorage' | 7 | type CacheType = 'localStorage' | 'sessionStorage' |
| 8 | 8 | ||
| 9 | +export const CACHE_KEY = { | ||
| 10 | + IS_DARK: 'isDark', | ||
| 11 | + USER: 'user', | ||
| 12 | + LANG: 'lang', | ||
| 13 | + THEME: 'theme', | ||
| 14 | + LAYOUT: 'layout', | ||
| 15 | + ROLE_ROUTERS: 'roleRouters', | ||
| 16 | + DICT_CACHE: 'dictCache' | ||
| 17 | +} | ||
| 18 | + | ||
| 9 | export const useCache = (type: CacheType = 'localStorage') => { | 19 | export const useCache = (type: CacheType = 'localStorage') => { |
| 10 | const wsCache: WebStorageCache = new WebStorageCache({ | 20 | const wsCache: WebStorageCache = new WebStorageCache({ |
| 11 | storage: type | 21 | storage: type |
yudao-ui-admin-vue3/src/router/index.ts
| 1 | import type { App } from 'vue' | 1 | import type { App } from 'vue' |
| 2 | -import { getAccessToken } from '@/utils/auth' | ||
| 3 | import type { RouteRecordRaw } from 'vue-router' | 2 | import type { RouteRecordRaw } from 'vue-router' |
| 3 | +import { createRouter, createWebHashHistory } from 'vue-router' | ||
| 4 | import remainingRouter from './modules/remaining' | 4 | import remainingRouter from './modules/remaining' |
| 5 | +import { isRelogin } from '@/config/axios/service' | ||
| 6 | +import { getAccessToken } from '@/utils/auth' | ||
| 5 | import { useTitle } from '@/hooks/web/useTitle' | 7 | import { useTitle } from '@/hooks/web/useTitle' |
| 6 | import { useNProgress } from '@/hooks/web/useNProgress' | 8 | import { useNProgress } from '@/hooks/web/useNProgress' |
| 9 | +import { CACHE_KEY, useCache } from '@/hooks/web/useCache' | ||
| 7 | import { usePageLoading } from '@/hooks/web/usePageLoading' | 10 | import { usePageLoading } from '@/hooks/web/usePageLoading' |
| 8 | -import { createRouter, createWebHashHistory } from 'vue-router' | ||
| 9 | -import { usePermissionStoreWithOut } from '@/store/modules/permission' | ||
| 10 | import { useDictStoreWithOut } from '@/store/modules/dict' | 11 | import { useDictStoreWithOut } from '@/store/modules/dict' |
| 11 | import { useUserStoreWithOut } from '@/store/modules/user' | 12 | import { useUserStoreWithOut } from '@/store/modules/user' |
| 12 | -import { listSimpleDictDataApi } from '@/api/system/dict/dict.data' | ||
| 13 | -import { isRelogin } from '@/config/axios/service' | 13 | +import { usePermissionStoreWithOut } from '@/store/modules/permission' |
| 14 | import { getInfoApi } from '@/api/login' | 14 | import { getInfoApi } from '@/api/login' |
| 15 | -import { useCache } from '@/hooks/web/useCache' | 15 | +import { listSimpleDictDataApi } from '@/api/system/dict/dict.data' |
| 16 | 16 | ||
| 17 | const { wsCache } = useCache('sessionStorage') | 17 | const { wsCache } = useCache('sessionStorage') |
| 18 | 18 | ||
| @@ -50,7 +50,7 @@ router.beforeEach(async (to, from, next) => { | @@ -50,7 +50,7 @@ router.beforeEach(async (to, from, next) => { | ||
| 50 | const dictStore = useDictStoreWithOut() | 50 | const dictStore = useDictStoreWithOut() |
| 51 | const userStore = useUserStoreWithOut() | 51 | const userStore = useUserStoreWithOut() |
| 52 | const permissionStore = usePermissionStoreWithOut() | 52 | const permissionStore = usePermissionStoreWithOut() |
| 53 | - const dictMap = wsCache.get('dictCache') | 53 | + const dictMap = wsCache.get(CACHE_KEY.DICT_CACHE) |
| 54 | if (!dictMap) { | 54 | if (!dictMap) { |
| 55 | const res = await listSimpleDictDataApi() | 55 | const res = await listSimpleDictDataApi() |
| 56 | dictStore.setDictMap(res) | 56 | dictStore.setDictMap(res) |
yudao-ui-admin-vue3/src/store/modules/app.ts
| @@ -2,7 +2,7 @@ import { defineStore } from 'pinia' | @@ -2,7 +2,7 @@ import { defineStore } from 'pinia' | ||
| 2 | import { store } from '../index' | 2 | import { store } from '../index' |
| 3 | import { setCssVar, humpToUnderline } from '@/utils' | 3 | import { setCssVar, humpToUnderline } from '@/utils' |
| 4 | import { ElMessage } from 'element-plus' | 4 | import { ElMessage } from 'element-plus' |
| 5 | -import { useCache } from '@/hooks/web/useCache' | 5 | +import { CACHE_KEY, useCache } from '@/hooks/web/useCache' |
| 6 | import { ElementPlusSize } from '@/types/elementPlus' | 6 | import { ElementPlusSize } from '@/types/elementPlus' |
| 7 | import { LayoutType } from '@/types/layout' | 7 | import { LayoutType } from '@/types/layout' |
| 8 | import { ThemeTypes } from '@/types/theme' | 8 | import { ThemeTypes } from '@/types/theme' |
| @@ -61,10 +61,10 @@ export const useAppStore = defineStore('app', { | @@ -61,10 +61,10 @@ export const useAppStore = defineStore('app', { | ||
| 61 | greyMode: false, // 是否开始灰色模式,用于特殊悼念日 | 61 | greyMode: false, // 是否开始灰色模式,用于特殊悼念日 |
| 62 | fixedMenu: wsCache.get('fixedMenu') || false, // 是否固定菜单 | 62 | fixedMenu: wsCache.get('fixedMenu') || false, // 是否固定菜单 |
| 63 | 63 | ||
| 64 | - layout: wsCache.get('layout') || 'classic', // layout布局 | ||
| 65 | - isDark: wsCache.get('isDark') || false, // 是否是暗黑模式 | 64 | + layout: wsCache.get(CACHE_KEY.LAYOUT) || 'classic', // layout布局 |
| 65 | + isDark: wsCache.get(CACHE_KEY.IS_DARK) || false, // 是否是暗黑模式 | ||
| 66 | currentSize: wsCache.get('default') || 'default', // 组件尺寸 | 66 | currentSize: wsCache.get('default') || 'default', // 组件尺寸 |
| 67 | - theme: wsCache.get('theme') || { | 67 | + theme: wsCache.get(CACHE_KEY.THEME) || { |
| 68 | // 主题色 | 68 | // 主题色 |
| 69 | elColorPrimary: '#409eff', | 69 | elColorPrimary: '#409eff', |
| 70 | // 左侧菜单边框颜色 | 70 | // 左侧菜单边框颜色 |
| @@ -223,7 +223,7 @@ export const useAppStore = defineStore('app', { | @@ -223,7 +223,7 @@ export const useAppStore = defineStore('app', { | ||
| 223 | return | 223 | return |
| 224 | } | 224 | } |
| 225 | this.layout = layout | 225 | this.layout = layout |
| 226 | - wsCache.set('layout', this.layout) | 226 | + wsCache.set(CACHE_KEY.THEME, this.layout) |
| 227 | }, | 227 | }, |
| 228 | setTitle(title: string) { | 228 | setTitle(title: string) { |
| 229 | this.title = title | 229 | this.title = title |
| @@ -237,7 +237,7 @@ export const useAppStore = defineStore('app', { | @@ -237,7 +237,7 @@ export const useAppStore = defineStore('app', { | ||
| 237 | document.documentElement.classList.add('light') | 237 | document.documentElement.classList.add('light') |
| 238 | document.documentElement.classList.remove('dark') | 238 | document.documentElement.classList.remove('dark') |
| 239 | } | 239 | } |
| 240 | - wsCache.set('isDark', this.isDark) | 240 | + wsCache.set(CACHE_KEY.IS_DARK, this.isDark) |
| 241 | }, | 241 | }, |
| 242 | setCurrentSize(currentSize: ElementPlusSize) { | 242 | setCurrentSize(currentSize: ElementPlusSize) { |
| 243 | this.currentSize = currentSize | 243 | this.currentSize = currentSize |
| @@ -248,7 +248,7 @@ export const useAppStore = defineStore('app', { | @@ -248,7 +248,7 @@ export const useAppStore = defineStore('app', { | ||
| 248 | }, | 248 | }, |
| 249 | setTheme(theme: ThemeTypes) { | 249 | setTheme(theme: ThemeTypes) { |
| 250 | this.theme = Object.assign(this.theme, theme) | 250 | this.theme = Object.assign(this.theme, theme) |
| 251 | - wsCache.set('theme', this.theme) | 251 | + wsCache.set(CACHE_KEY.THEME, this.theme) |
| 252 | }, | 252 | }, |
| 253 | setCssVarTheme() { | 253 | setCssVarTheme() { |
| 254 | for (const key in this.theme) { | 254 | for (const key in this.theme) { |
yudao-ui-admin-vue3/src/store/modules/dict.ts
| 1 | import { defineStore } from 'pinia' | 1 | import { defineStore } from 'pinia' |
| 2 | import { store } from '../index' | 2 | import { store } from '../index' |
| 3 | import { DictDataVO } from '@/api/system/dict/types' | 3 | import { DictDataVO } from '@/api/system/dict/types' |
| 4 | -import { useCache } from '@/hooks/web/useCache' | 4 | +import { CACHE_KEY, useCache } from '@/hooks/web/useCache' |
| 5 | const { wsCache } = useCache('sessionStorage') | 5 | const { wsCache } = useCache('sessionStorage') |
| 6 | 6 | ||
| 7 | export interface DictValueType { | 7 | export interface DictValueType { |
| @@ -24,7 +24,7 @@ export const useDictStore = defineStore('dict', { | @@ -24,7 +24,7 @@ export const useDictStore = defineStore('dict', { | ||
| 24 | }), | 24 | }), |
| 25 | getters: { | 25 | getters: { |
| 26 | getDictMap(): Recordable { | 26 | getDictMap(): Recordable { |
| 27 | - const dictMap = wsCache.get('dictCache') | 27 | + const dictMap = wsCache.get(CACHE_KEY.DICT_CACHE) |
| 28 | return dictMap ? dictMap : this.dictMap | 28 | return dictMap ? dictMap : this.dictMap |
| 29 | }, | 29 | }, |
| 30 | getHasDictData(): boolean { | 30 | getHasDictData(): boolean { |
| @@ -54,7 +54,7 @@ export const useDictStore = defineStore('dict', { | @@ -54,7 +54,7 @@ export const useDictStore = defineStore('dict', { | ||
| 54 | }) | 54 | }) |
| 55 | }) | 55 | }) |
| 56 | this.dictMap = dictDataMap | 56 | this.dictMap = dictDataMap |
| 57 | - wsCache.set('dictCache', dictDataMap, { exp: 60 }) // 60 秒 过期 | 57 | + wsCache.set(CACHE_KEY.DICT_CACHE, dictDataMap, { exp: 60 }) // 60 秒 过期 |
| 58 | } | 58 | } |
| 59 | } | 59 | } |
| 60 | }) | 60 | }) |
yudao-ui-admin-vue3/src/store/modules/locale.ts
| @@ -2,7 +2,7 @@ import { defineStore } from 'pinia' | @@ -2,7 +2,7 @@ import { defineStore } from 'pinia' | ||
| 2 | import { store } from '../index' | 2 | import { store } from '../index' |
| 3 | import zhCn from 'element-plus/es/locale/lang/zh-cn' | 3 | import zhCn from 'element-plus/es/locale/lang/zh-cn' |
| 4 | import en from 'element-plus/es/locale/lang/en' | 4 | import en from 'element-plus/es/locale/lang/en' |
| 5 | -import { useCache } from '@/hooks/web/useCache' | 5 | +import { CACHE_KEY, useCache } from '@/hooks/web/useCache' |
| 6 | import { LocaleDropdownType } from '@/types/localeDropdown' | 6 | import { LocaleDropdownType } from '@/types/localeDropdown' |
| 7 | 7 | ||
| 8 | const { wsCache } = useCache() | 8 | const { wsCache } = useCache() |
| @@ -20,8 +20,8 @@ export const useLocaleStore = defineStore('locales', { | @@ -20,8 +20,8 @@ export const useLocaleStore = defineStore('locales', { | ||
| 20 | state: (): LocaleState => { | 20 | state: (): LocaleState => { |
| 21 | return { | 21 | return { |
| 22 | currentLocale: { | 22 | currentLocale: { |
| 23 | - lang: wsCache.get('lang') || 'zh-CN', | ||
| 24 | - elLocale: elLocaleMap[wsCache.get('lang') || 'zh-CN'] | 23 | + lang: wsCache.get(CACHE_KEY.LANG) || 'zh-CN', |
| 24 | + elLocale: elLocaleMap[wsCache.get(CACHE_KEY.LANG) || 'zh-CN'] | ||
| 25 | }, | 25 | }, |
| 26 | // 多语言 | 26 | // 多语言 |
| 27 | localeMap: [ | 27 | localeMap: [ |
| @@ -49,7 +49,7 @@ export const useLocaleStore = defineStore('locales', { | @@ -49,7 +49,7 @@ export const useLocaleStore = defineStore('locales', { | ||
| 49 | // this.locale = Object.assign(this.locale, localeMap) | 49 | // this.locale = Object.assign(this.locale, localeMap) |
| 50 | this.currentLocale.lang = localeMap?.lang | 50 | this.currentLocale.lang = localeMap?.lang |
| 51 | this.currentLocale.elLocale = elLocaleMap[localeMap?.lang] | 51 | this.currentLocale.elLocale = elLocaleMap[localeMap?.lang] |
| 52 | - wsCache.set('lang', localeMap?.lang) | 52 | + wsCache.set(CACHE_KEY.LANG, localeMap?.lang) |
| 53 | } | 53 | } |
| 54 | } | 54 | } |
| 55 | }) | 55 | }) |
yudao-ui-admin-vue3/src/store/modules/permission.ts
| @@ -4,7 +4,7 @@ import { cloneDeep } from 'lodash-es' | @@ -4,7 +4,7 @@ import { cloneDeep } from 'lodash-es' | ||
| 4 | import remainingRouter from '@/router/modules/remaining' | 4 | import remainingRouter from '@/router/modules/remaining' |
| 5 | import { generateRoute, flatMultiLevelRoutes } from '@/utils/routerHelper' | 5 | import { generateRoute, flatMultiLevelRoutes } from '@/utils/routerHelper' |
| 6 | import { getAsyncRoutesApi } from '@/api/login' | 6 | import { getAsyncRoutesApi } from '@/api/login' |
| 7 | -import { useCache } from '@/hooks/web/useCache' | 7 | +import { CACHE_KEY, useCache } from '@/hooks/web/useCache' |
| 8 | 8 | ||
| 9 | const { wsCache } = useCache() | 9 | const { wsCache } = useCache() |
| 10 | 10 | ||
| @@ -35,11 +35,11 @@ export const usePermissionStore = defineStore('permission', { | @@ -35,11 +35,11 @@ export const usePermissionStore = defineStore('permission', { | ||
| 35 | async generateRoutes(): Promise<unknown> { | 35 | async generateRoutes(): Promise<unknown> { |
| 36 | return new Promise<void>(async (resolve) => { | 36 | return new Promise<void>(async (resolve) => { |
| 37 | let res: AppCustomRouteRecordRaw[] | 37 | let res: AppCustomRouteRecordRaw[] |
| 38 | - if (wsCache.get('roleRouters')) { | ||
| 39 | - res = wsCache.get('roleRouters') as AppCustomRouteRecordRaw[] | 38 | + if (wsCache.get(CACHE_KEY.ROLE_ROUTERS)) { |
| 39 | + res = wsCache.get(CACHE_KEY.ROLE_ROUTERS) as AppCustomRouteRecordRaw[] | ||
| 40 | } else { | 40 | } else { |
| 41 | res = await getAsyncRoutesApi() | 41 | res = await getAsyncRoutesApi() |
| 42 | - wsCache.set('roleRouters', res) | 42 | + wsCache.set(CACHE_KEY.ROLE_ROUTERS, res) |
| 43 | } | 43 | } |
| 44 | const routerMap: AppRouteRecordRaw[] = generateRoute(res as AppCustomRouteRecordRaw[]) | 44 | const routerMap: AppRouteRecordRaw[] = generateRoute(res as AppCustomRouteRecordRaw[]) |
| 45 | // 动态路由,404一定要放到最后面 | 45 | // 动态路由,404一定要放到最后面 |
yudao-ui-admin-vue3/src/store/modules/user.ts
| 1 | import { store } from '../index' | 1 | import { store } from '../index' |
| 2 | import { defineStore } from 'pinia' | 2 | import { defineStore } from 'pinia' |
| 3 | import { getAccessToken, removeToken } from '@/utils/auth' | 3 | import { getAccessToken, removeToken } from '@/utils/auth' |
| 4 | -import { useCache } from '@/hooks/web/useCache' | 4 | +import { CACHE_KEY, useCache } from '@/hooks/web/useCache' |
| 5 | 5 | ||
| 6 | const { wsCache } = useCache() | 6 | const { wsCache } = useCache() |
| 7 | 7 | ||
| @@ -46,7 +46,7 @@ export const useUserStore = defineStore('admin-user', { | @@ -46,7 +46,7 @@ export const useUserStore = defineStore('admin-user', { | ||
| 46 | this.permissions = userInfo.permissions | 46 | this.permissions = userInfo.permissions |
| 47 | this.roles = userInfo.roles | 47 | this.roles = userInfo.roles |
| 48 | this.user = userInfo.user | 48 | this.user = userInfo.user |
| 49 | - wsCache.set('user', userInfo) | 49 | + wsCache.set(CACHE_KEY.USER, userInfo) |
| 50 | }, | 50 | }, |
| 51 | loginOut() { | 51 | loginOut() { |
| 52 | removeToken() | 52 | removeToken() |
yudao-ui-admin-vue3/src/utils/auth.ts
| @@ -45,7 +45,7 @@ export const getUsername = () => { | @@ -45,7 +45,7 @@ export const getUsername = () => { | ||
| 45 | } | 45 | } |
| 46 | 46 | ||
| 47 | export const setUsername = (username: string) => { | 47 | export const setUsername = (username: string) => { |
| 48 | - wsCache.set(UsernameKey, username) | 48 | + wsCache.set(UsernameKey, username, { exp: 30 * 24 * 60 * 60 }) |
| 49 | } | 49 | } |
| 50 | 50 | ||
| 51 | export const removeUsername = () => { | 51 | export const removeUsername = () => { |
| @@ -58,7 +58,7 @@ export const getPassword = () => { | @@ -58,7 +58,7 @@ export const getPassword = () => { | ||
| 58 | } | 58 | } |
| 59 | 59 | ||
| 60 | export const setPassword = (password: string) => { | 60 | export const setPassword = (password: string) => { |
| 61 | - wsCache.set(PasswordKey, encrypt(password)) | 61 | + wsCache.set(PasswordKey, encrypt(password), { exp: 30 * 24 * 60 * 60 }) |
| 62 | } | 62 | } |
| 63 | 63 | ||
| 64 | export const removePassword = () => { | 64 | export const removePassword = () => { |
| @@ -66,11 +66,11 @@ export const removePassword = () => { | @@ -66,11 +66,11 @@ export const removePassword = () => { | ||
| 66 | } | 66 | } |
| 67 | 67 | ||
| 68 | export const getRememberMe = () => { | 68 | export const getRememberMe = () => { |
| 69 | - return wsCache.get(RememberMeKey) === 'true' | 69 | + return wsCache.get(RememberMeKey) === true |
| 70 | } | 70 | } |
| 71 | 71 | ||
| 72 | -export const setRememberMe = (rememberMe: string) => { | ||
| 73 | - wsCache.set(RememberMeKey, rememberMe) | 72 | +export const setRememberMe = (rememberMe: boolean) => { |
| 73 | + wsCache.set(RememberMeKey, rememberMe, { exp: 30 * 24 * 60 * 60 }) | ||
| 74 | } | 74 | } |
| 75 | 75 | ||
| 76 | export const removeRememberMe = () => { | 76 | export const removeRememberMe = () => { |
| @@ -87,7 +87,7 @@ export const getTenantName = () => { | @@ -87,7 +87,7 @@ export const getTenantName = () => { | ||
| 87 | } | 87 | } |
| 88 | 88 | ||
| 89 | export const setTenantName = (username: string) => { | 89 | export const setTenantName = (username: string) => { |
| 90 | - wsCache.set(TenantNameKey, username) | 90 | + wsCache.set(TenantNameKey, username, { exp: 30 * 24 * 60 * 60 }) |
| 91 | } | 91 | } |
| 92 | 92 | ||
| 93 | export const removeTenantName = () => { | 93 | export const removeTenantName = () => { |
yudao-ui-admin-vue3/src/utils/routerHelper.ts
| @@ -18,7 +18,7 @@ export const getParentLayout = () => { | @@ -18,7 +18,7 @@ export const getParentLayout = () => { | ||
| 18 | } | 18 | } |
| 19 | 19 | ||
| 20 | // 按照路由中meta下的rank等级升序来排序路由 | 20 | // 按照路由中meta下的rank等级升序来排序路由 |
| 21 | -export function ascending(arr: any[]) { | 21 | +export const ascending = (arr: any[]) => { |
| 22 | arr.forEach((v) => { | 22 | arr.forEach((v) => { |
| 23 | if (v?.meta?.rank === null) v.meta.rank = undefined | 23 | if (v?.meta?.rank === null) v.meta.rank = undefined |
| 24 | if (v?.meta?.rank === 0) { | 24 | if (v?.meta?.rank === 0) { |
| @@ -109,7 +109,7 @@ export const generateRoute = (routes: AppCustomRouteRecordRaw[]): AppRouteRecord | @@ -109,7 +109,7 @@ export const generateRoute = (routes: AppCustomRouteRecordRaw[]): AppRouteRecord | ||
| 109 | data.children = generateRoute(route.children) | 109 | data.children = generateRoute(route.children) |
| 110 | } | 110 | } |
| 111 | } | 111 | } |
| 112 | - res.push(data) | 112 | + res.push(data as AppRouteRecordRaw) |
| 113 | } | 113 | } |
| 114 | return res | 114 | return res |
| 115 | } | 115 | } |
| @@ -203,7 +203,7 @@ const addToChildren = ( | @@ -203,7 +203,7 @@ const addToChildren = ( | ||
| 203 | } | 203 | } |
| 204 | } | 204 | } |
| 205 | } | 205 | } |
| 206 | -function toCamelCase(str: string, upperCaseFirst: boolean) { | 206 | +const toCamelCase = (str: string, upperCaseFirst: boolean) => { |
| 207 | str = (str || '').toLowerCase().replace(/-(.)/g, function (group1: string) { | 207 | str = (str || '').toLowerCase().replace(/-(.)/g, function (group1: string) { |
| 208 | return group1.toUpperCase() | 208 | return group1.toUpperCase() |
| 209 | }) | 209 | }) |
yudao-ui-admin-vue3/src/views/Home/Index.vue
| @@ -167,20 +167,21 @@ import { EChartsOption } from 'echarts' | @@ -167,20 +167,21 @@ import { EChartsOption } from 'echarts' | ||
| 167 | import { ElRow, ElCol, ElSkeleton, ElCard, ElDivider, ElLink } from 'element-plus' | 167 | import { ElRow, ElCol, ElSkeleton, ElCard, ElDivider, ElLink } from 'element-plus' |
| 168 | import { formatTime } from '@/utils' | 168 | import { formatTime } from '@/utils' |
| 169 | import { useI18n } from '@/hooks/web/useI18n' | 169 | import { useI18n } from '@/hooks/web/useI18n' |
| 170 | -import { useCache } from '@/hooks/web/useCache' | 170 | +import { CACHE_KEY, useCache } from '@/hooks/web/useCache' |
| 171 | import { useWatermark } from '@/hooks/web/useWatermark' | 171 | import { useWatermark } from '@/hooks/web/useWatermark' |
| 172 | import { Echart } from '@/components/Echart' | 172 | import { Echart } from '@/components/Echart' |
| 173 | import { CountTo } from '@/components/CountTo' | 173 | import { CountTo } from '@/components/CountTo' |
| 174 | import { Highlight } from '@/components/Highlight' | 174 | import { Highlight } from '@/components/Highlight' |
| 175 | import type { WorkplaceTotal, Project, Notice, Shortcut } from './types' | 175 | import type { WorkplaceTotal, Project, Notice, Shortcut } from './types' |
| 176 | import { pieOptions, barOptions } from './echarts-data' | 176 | import { pieOptions, barOptions } from './echarts-data' |
| 177 | +import { Icon } from 'vxe-table' | ||
| 177 | 178 | ||
| 178 | const { t } = useI18n() | 179 | const { t } = useI18n() |
| 179 | const { wsCache } = useCache() | 180 | const { wsCache } = useCache() |
| 180 | const { setWatermark } = useWatermark() | 181 | const { setWatermark } = useWatermark() |
| 181 | const loading = ref(true) | 182 | const loading = ref(true) |
| 182 | -const avatar = wsCache.get('user').user.avatar | ||
| 183 | -const username = wsCache.get('user').user.nickname | 183 | +const avatar = wsCache.get(CACHE_KEY.USER).user.avatar |
| 184 | +const username = wsCache.get(CACHE_KEY.USER).user.nickname | ||
| 184 | const pieOptionsData = reactive<EChartsOption>(pieOptions) as EChartsOption | 185 | const pieOptionsData = reactive<EChartsOption>(pieOptions) as EChartsOption |
| 185 | // 获取统计数 | 186 | // 获取统计数 |
| 186 | let totalSate = reactive<WorkplaceTotal>({ | 187 | let totalSate = reactive<WorkplaceTotal>({ |
yudao-ui-admin-vue3/src/views/Login/components/LoginForm.vue
| @@ -154,10 +154,24 @@ import { useRouter } from 'vue-router' | @@ -154,10 +154,24 @@ import { useRouter } from 'vue-router' | ||
| 154 | import type { RouteLocationNormalizedLoaded } from 'vue-router' | 154 | import type { RouteLocationNormalizedLoaded } from 'vue-router' |
| 155 | import { useI18n } from '@/hooks/web/useI18n' | 155 | import { useI18n } from '@/hooks/web/useI18n' |
| 156 | import { useIcon } from '@/hooks/web/useIcon' | 156 | import { useIcon } from '@/hooks/web/useIcon' |
| 157 | -import { useCache } from '@/hooks/web/useCache' | ||
| 158 | import { required } from '@/utils/formRules' | 157 | import { required } from '@/utils/formRules' |
| 159 | -import { setToken, setTenantId } from '@/utils/auth' | ||
| 160 | -import { decrypt, encrypt } from '@/utils/jsencrypt' | 158 | +import { |
| 159 | + setToken, | ||
| 160 | + setTenantId, | ||
| 161 | + setUsername, | ||
| 162 | + setPassword, | ||
| 163 | + setRememberMe, | ||
| 164 | + setTenantName, | ||
| 165 | + removeUsername, | ||
| 166 | + removePassword, | ||
| 167 | + removeRememberMe, | ||
| 168 | + removeTenantName, | ||
| 169 | + getUsername, | ||
| 170 | + getPassword, | ||
| 171 | + getRememberMe, | ||
| 172 | + getTenantName | ||
| 173 | +} from '@/utils/auth' | ||
| 174 | +import { decrypt } from '@/utils/jsencrypt' | ||
| 161 | import { Icon } from '@/components/Icon' | 175 | import { Icon } from '@/components/Icon' |
| 162 | import { Verify } from '@/components/Verifition' | 176 | import { Verify } from '@/components/Verifition' |
| 163 | import { usePermissionStore } from '@/store/modules/permission' | 177 | import { usePermissionStore } from '@/store/modules/permission' |
| @@ -166,7 +180,6 @@ import { LoginStateEnum, useLoginState, useFormValid } from './useLogin' | @@ -166,7 +180,6 @@ import { LoginStateEnum, useLoginState, useFormValid } from './useLogin' | ||
| 166 | 180 | ||
| 167 | const { t } = useI18n() | 181 | const { t } = useI18n() |
| 168 | const formLogin = ref() | 182 | const formLogin = ref() |
| 169 | -const { wsCache } = useCache() | ||
| 170 | const { validForm } = useFormValid(formLogin) | 183 | const { validForm } = useFormValid(formLogin) |
| 171 | const { setLoginState, getLoginState } = useLoginState() | 184 | const { setLoginState, getLoginState } = useLoginState() |
| 172 | const { currentRoute, push } = useRouter() | 185 | const { currentRoute, push } = useRouter() |
| @@ -195,11 +208,9 @@ const loginData = reactive({ | @@ -195,11 +208,9 @@ const loginData = reactive({ | ||
| 195 | signIn: false | 208 | signIn: false |
| 196 | }, | 209 | }, |
| 197 | loginForm: { | 210 | loginForm: { |
| 198 | - tenantName: wsCache.get('tenantName') ? wsCache.get('tenantName') : '芋道源码', | ||
| 199 | - username: wsCache.get('username') ? wsCache.get('username') : 'admin', | ||
| 200 | - password: wsCache.get('password') | ||
| 201 | - ? (decrypt(wsCache.get('password')) as unknown as string) | ||
| 202 | - : 'admin123', | 211 | + tenantName: '芋道源码', |
| 212 | + username: 'admin', | ||
| 213 | + password: 'admin123', | ||
| 203 | captchaVerification: '', | 214 | captchaVerification: '', |
| 204 | rememberMe: false | 215 | rememberMe: false |
| 205 | } | 216 | } |
| @@ -223,12 +234,10 @@ const getTenantId = async () => { | @@ -223,12 +234,10 @@ const getTenantId = async () => { | ||
| 223 | } | 234 | } |
| 224 | // 记住我 | 235 | // 记住我 |
| 225 | const getCookie = () => { | 236 | const getCookie = () => { |
| 226 | - const username = wsCache.get('username') | ||
| 227 | - const password = wsCache.get('password') | ||
| 228 | - ? (decrypt(wsCache.get('password')) as unknown as string) | ||
| 229 | - : undefined | ||
| 230 | - const rememberMe = wsCache.get('rememberMe') | ||
| 231 | - const tenantName = wsCache.get('tenantName') | 237 | + const username = getUsername() |
| 238 | + const password = getPassword() ? decrypt(getPassword() as unknown as string) : undefined | ||
| 239 | + const rememberMe = getRememberMe() | ||
| 240 | + const tenantName = getTenantName() | ||
| 232 | loginData.loginForm = { | 241 | loginData.loginForm = { |
| 233 | ...loginData.loginForm, | 242 | ...loginData.loginForm, |
| 234 | username: username ? username : loginData.loginForm.username, | 243 | username: username ? username : loginData.loginForm.username, |
| @@ -257,17 +266,15 @@ const handleLogin = async (params) => { | @@ -257,17 +266,15 @@ const handleLogin = async (params) => { | ||
| 257 | background: 'rgba(0, 0, 0, 0.7)' | 266 | background: 'rgba(0, 0, 0, 0.7)' |
| 258 | }) | 267 | }) |
| 259 | if (loginData.loginForm.rememberMe) { | 268 | if (loginData.loginForm.rememberMe) { |
| 260 | - wsCache.set('username', loginData.loginForm.username, { exp: 30 * 24 * 60 * 60 }) | ||
| 261 | - wsCache.set('password', encrypt(loginData.loginForm.password as unknown as string), { | ||
| 262 | - exp: 30 | ||
| 263 | - }) | ||
| 264 | - wsCache.set('rememberMe', loginData.loginForm.rememberMe, { exp: 30 * 24 * 60 * 60 }) | ||
| 265 | - wsCache.set('tenantName', loginData.loginForm.tenantName, { exp: 30 * 24 * 60 * 60 }) | 269 | + setUsername(loginData.loginForm.username) |
| 270 | + setPassword(loginData.loginForm.password) | ||
| 271 | + setRememberMe(loginData.loginForm.rememberMe) | ||
| 272 | + setTenantName(loginData.loginForm.tenantName) | ||
| 266 | } else { | 273 | } else { |
| 267 | - wsCache.delete('username') | ||
| 268 | - wsCache.delete('password') | ||
| 269 | - wsCache.delete('rememberMe') | ||
| 270 | - wsCache.delete('tenantName') | 274 | + removeUsername() |
| 275 | + removePassword() | ||
| 276 | + removeRememberMe() | ||
| 277 | + removeTenantName() | ||
| 271 | } | 278 | } |
| 272 | setToken(res) | 279 | setToken(res) |
| 273 | if (!redirect.value) { | 280 | if (!redirect.value) { |
yudao-ui-admin-vue3/src/views/Login/components/MobileForm.vue
| @@ -91,9 +91,8 @@ import { useRouter } from 'vue-router' | @@ -91,9 +91,8 @@ import { useRouter } from 'vue-router' | ||
| 91 | import type { RouteLocationNormalizedLoaded } from 'vue-router' | 91 | import type { RouteLocationNormalizedLoaded } from 'vue-router' |
| 92 | import { useI18n } from '@/hooks/web/useI18n' | 92 | import { useI18n } from '@/hooks/web/useI18n' |
| 93 | import { useIcon } from '@/hooks/web/useIcon' | 93 | import { useIcon } from '@/hooks/web/useIcon' |
| 94 | -import { useCache } from '@/hooks/web/useCache' | ||
| 95 | import { useMessage } from '@/hooks/web/useMessage' | 94 | import { useMessage } from '@/hooks/web/useMessage' |
| 96 | -import { setToken } from '@/utils/auth' | 95 | +import { setTenantId, setToken } from '@/utils/auth' |
| 97 | import { required } from '@/utils/formRules' | 96 | import { required } from '@/utils/formRules' |
| 98 | import { usePermissionStore } from '@/store/modules/permission' | 97 | import { usePermissionStore } from '@/store/modules/permission' |
| 99 | import { getTenantIdByNameApi, sendSmsCodeApi, smsLoginApi } from '@/api/login' | 98 | import { getTenantIdByNameApi, sendSmsCodeApi, smsLoginApi } from '@/api/login' |
| @@ -101,7 +100,6 @@ import LoginFormTitle from './LoginFormTitle.vue' | @@ -101,7 +100,6 @@ import LoginFormTitle from './LoginFormTitle.vue' | ||
| 101 | import { useLoginState, LoginStateEnum, useFormValid } from './useLogin' | 100 | import { useLoginState, LoginStateEnum, useFormValid } from './useLogin' |
| 102 | 101 | ||
| 103 | const { t } = useI18n() | 102 | const { t } = useI18n() |
| 104 | -const { wsCache } = useCache() | ||
| 105 | const message = useMessage() | 103 | const message = useMessage() |
| 106 | const permissionStore = usePermissionStore() | 104 | const permissionStore = usePermissionStore() |
| 107 | const { currentRoute, push } = useRouter() | 105 | const { currentRoute, push } = useRouter() |
| @@ -172,7 +170,7 @@ watch( | @@ -172,7 +170,7 @@ watch( | ||
| 172 | // 获取租户 ID | 170 | // 获取租户 ID |
| 173 | const getTenantId = async () => { | 171 | const getTenantId = async () => { |
| 174 | const res = await getTenantIdByNameApi(loginData.loginForm.tenantName) | 172 | const res = await getTenantIdByNameApi(loginData.loginForm.tenantName) |
| 175 | - wsCache.set('tenantId', res) | 173 | + setTenantId(res) |
| 176 | } | 174 | } |
| 177 | // 登录 | 175 | // 登录 |
| 178 | const signIn = async () => { | 176 | const signIn = async () => { |
yudao-ui-admin-vue3/src/views/system/menu/index.vue
| @@ -215,6 +215,7 @@ | @@ -215,6 +215,7 @@ | ||
| 215 | // 全局相关的 import | 215 | // 全局相关的 import |
| 216 | import { onMounted, reactive, ref } from 'vue' | 216 | import { onMounted, reactive, ref } from 'vue' |
| 217 | import { useI18n } from '@/hooks/web/useI18n' | 217 | import { useI18n } from '@/hooks/web/useI18n' |
| 218 | +import { CACHE_KEY, useCache } from '@/hooks/web/useCache' | ||
| 218 | import { useMessage } from '@/hooks/web/useMessage' | 219 | import { useMessage } from '@/hooks/web/useMessage' |
| 219 | import { | 220 | import { |
| 220 | ElForm, | 221 | ElForm, |
| @@ -241,6 +242,7 @@ import { handleTree, defaultProps } from '@/utils/tree' | @@ -241,6 +242,7 @@ import { handleTree, defaultProps } from '@/utils/tree' | ||
| 241 | 242 | ||
| 242 | const { t } = useI18n() // 国际化 | 243 | const { t } = useI18n() // 国际化 |
| 243 | const message = useMessage() // 消息弹窗 | 244 | const message = useMessage() // 消息弹窗 |
| 245 | +const { wsCache } = useCache() | ||
| 244 | // 列表相关的变量 | 246 | // 列表相关的变量 |
| 245 | const xTable = ref<VxeTableInstance>() | 247 | const xTable = ref<VxeTableInstance>() |
| 246 | const tableLoading = ref(false) | 248 | const tableLoading = ref(false) |
| @@ -380,6 +382,7 @@ const submitForm = async () => { | @@ -380,6 +382,7 @@ const submitForm = async () => { | ||
| 380 | } finally { | 382 | } finally { |
| 381 | dialogVisible.value = false | 383 | dialogVisible.value = false |
| 382 | actionLoading.value = false | 384 | actionLoading.value = false |
| 385 | + wsCache.delete(CACHE_KEY.ROLE_ROUTERS) | ||
| 383 | // 操作成功,重新加载列表 | 386 | // 操作成功,重新加载列表 |
| 384 | await getList() | 387 | await getList() |
| 385 | } | 388 | } |