github_mirrors/vben-admin-thin-next
1
0
Fork 0
mirror of https://github.com/vbenjs/vben-admin-thin-next.git synced 2025-02-03 02:18:40 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix: improve persistent cache logic

Browse Source
This commit is contained in:
Vben 2021-02-28 12:25:57 +08:00
parent f6cef1088d
commit 15567e478c
14 changed files with 68 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
package.json
View File

@ -76,7 +76,7 @@
"conventional-changelog-cli": "^2.1.1", "conventional-changelog-cli": "^2.1.1",
"cross-env": "^7.0.3", "cross-env": "^7.0.3",
"dotenv": "^8.2.0", "dotenv": "^8.2.0",
"eslint": "^7.20.0", "eslint": "^7.21.0",
"eslint-config-prettier": "^8.1.0", "eslint-config-prettier": "^8.1.0",
"eslint-plugin-prettier": "^3.3.1", "eslint-plugin-prettier": "^3.3.1",
"eslint-plugin-vue": "^7.6.0", "eslint-plugin-vue": "^7.6.0",
@ -106,7 +106,7 @@
"vite-plugin-pwa": "^0.5.5", "vite-plugin-pwa": "^0.5.5",
"vite-plugin-style-import": "^0.7.5", "vite-plugin-style-import": "^0.7.5",
"vite-plugin-theme": "^0.4.8", "vite-plugin-theme": "^0.4.8",
"vite-plugin-windicss": "0.6.0", "vite-plugin-windicss": "0.6.2",
"vue-eslint-parser": "^7.5.0", "vue-eslint-parser": "^7.5.0",
"yargs": "^16.2.0" "yargs": "^16.2.0"
}, },

2
src/components/Menu/src/BasicMenu.vue
View File

@ -110,7 +110,7 @@
listenerLastChangeTab((route) => { listenerLastChangeTab((route) => {
if (route.name === REDIRECT_NAME) return; if (route.name === REDIRECT_NAME) return;
handleMenuChange(route); handleMenuChange(route);
currentActiveMenu.value = route.meta?.currentActiveMenu; currentActiveMenu.value = route.meta?.currentActiveMenu as string;
if (unref(currentActiveMenu)) { if (unref(currentActiveMenu)) {
menuState.selectedKeys = [unref(currentActiveMenu)]; menuState.selectedKeys = [unref(currentActiveMenu)];

1
src/hooks/web/useFullContent.ts
View File

@ -21,5 +21,6 @@ export const useFullContent = () => {
// Return to the configuration in the configuration file // Return to the configuration in the configuration file
return appStore.getProjectConfig.fullContent; return appStore.getProjectConfig.fullContent;
}); });
return { getFullContent }; return { getFullContent };
}; };

2
src/layouts/default/menu/useLayoutMenu.ts
View File

@ -41,7 +41,7 @@ export function useSplitMenu(splitType: Ref<MenuSplitTyeEnum>) {
if (unref(splitNotLeft) || unref(getIsMobile)) return; if (unref(splitNotLeft) || unref(getIsMobile)) return;
const { meta } = unref(currentRoute); const { meta } = unref(currentRoute);
const currentActiveMenu = meta.currentActiveMenu; const currentActiveMenu = meta.currentActiveMenu as string;
let parentPath = await getCurrentParentPath(path); let parentPath = await getCurrentParentPath(path);
if (!parentPath) { if (!parentPath) {
parentPath = await getCurrentParentPath(currentActiveMenu); parentPath = await getCurrentParentPath(currentActiveMenu);

10
src/logics/initAppConfig.ts
View File

@ -1,7 +1,9 @@
/** /**
* Application configuration * Application configuration
*/ */
import type { ProjectConfig } from '/#/config';
import { PROJ_CFG_KEY } from '/@/enums/cacheEnum';
import projectSetting from '/@/settings/projectSetting'; import projectSetting from '/@/settings/projectSetting';
import { updateHeaderBgColor, updateSidebarBgColor } from '/@/logics/theme/updateBackground'; import { updateHeaderBgColor, updateSidebarBgColor } from '/@/logics/theme/updateBackground';
@ -15,9 +17,13 @@ import { localeStore } from '/@/store/modules/locale';
import { getCommonStoragePrefix, getStorageShortName } from '/@/utils/env'; import { getCommonStoragePrefix, getStorageShortName } from '/@/utils/env';
import { primaryColor } from '../../build/config/themeConfig'; import { primaryColor } from '../../build/config/themeConfig';
import { Persistent } from '/@/utils/cache/persistent';
import { deepMerge } from '/@/utils';
// Initial project configuration // Initial project configuration
export function initAppConfigStore() { export function initAppConfigStore() {
let projCfg: ProjectConfig = Persistent.getLocal(PROJ_CFG_KEY) as ProjectConfig;
projCfg = deepMerge(projectSetting, projCfg || {});
try { try {
const { const {
colorWeak, colorWeak,
@ -25,7 +31,7 @@ export function initAppConfigStore() {
themeColor, themeColor,
headerSetting: { bgColor: headerBgColor } = {}, headerSetting: { bgColor: headerBgColor } = {},
menuSetting: { bgColor } = {}, menuSetting: { bgColor } = {},
} = projectSetting; } = projCfg;
if (themeColor && themeColor !== primaryColor) { if (themeColor && themeColor !== primaryColor) {
changeTheme(themeColor); changeTheme(themeColor);
} }
@ -36,7 +42,7 @@ export function initAppConfigStore() {
} catch (error) { } catch (error) {
console.log(error); console.log(error);
} }
appStore.commitProjectConfigState(projectSetting); appStore.commitProjectConfigState(projCfg);
localeStore.initLocale(); localeStore.initLocale();
setTimeout(() => { setTimeout(() => {

2
src/settings/projectSetting.ts
View File

@ -22,7 +22,7 @@ const setting: ProjectConfig = {
permissionMode: PermissionModeEnum.ROLE, permissionMode: PermissionModeEnum.ROLE,
// Permission-related cache is stored in sessionStorage or localStorage // Permission-related cache is stored in sessionStorage or localStorage
permissionCacheType: CacheTypeEnum.LOCAL, permissionCacheType: CacheTypeEnum.SESSION,
// color // color
themeColor: primaryColor, themeColor: primaryColor,

2
src/store/modules/error.ts
View File

@ -22,7 +22,7 @@ export interface ErrorState {
errorListCountState: number; errorListCountState: number;
} }
const NAME = 'error'; const NAME = 'app-error';
hotModuleUnregisterModule(NAME); hotModuleUnregisterModule(NAME);
@Module({ dynamic: true, namespaced: true, store, name: NAME }) @Module({ dynamic: true, namespaced: true, store, name: NAME })
class Error extends VuexModule implements ErrorState { class Error extends VuexModule implements ErrorState {

2
src/store/modules/locale.ts
View File

@ -13,7 +13,7 @@ const ls = createLocalStorage();
const lsSetting = (ls.get(LOCALE_KEY) || localeSetting) as LocaleSetting; const lsSetting = (ls.get(LOCALE_KEY) || localeSetting) as LocaleSetting;
const NAME = 'locale'; const NAME = 'app-locale';
hotModuleUnregisterModule(NAME); hotModuleUnregisterModule(NAME);
@Module({ dynamic: true, namespaced: true, store, name: NAME }) @Module({ dynamic: true, namespaced: true, store, name: NAME })
class Locale extends VuexModule { class Locale extends VuexModule {

2
src/store/modules/lock.ts
View File

@ -13,7 +13,7 @@ export interface LockInfo {
isLock: boolean; isLock: boolean;
} }
const NAME = 'lock'; const NAME = 'app-lock';
hotModuleUnregisterModule(NAME); hotModuleUnregisterModule(NAME);
@Module({ dynamic: true, namespaced: true, store, name: NAME }) @Module({ dynamic: true, namespaced: true, store, name: NAME })
class Lock extends VuexModule { class Lock extends VuexModule {

2
src/store/modules/permission.ts
View File

@ -22,7 +22,7 @@ import { useI18n } from '/@/hooks/web/useI18n';
import { ERROR_LOG_ROUTE, PAGE_NOT_FOUND_ROUTE } from '/@/router/constant'; import { ERROR_LOG_ROUTE, PAGE_NOT_FOUND_ROUTE } from '/@/router/constant';
const { createMessage } = useMessage(); const { createMessage } = useMessage();
const NAME = 'permission'; const NAME = 'app-permission';
hotModuleUnregisterModule(NAME); hotModuleUnregisterModule(NAME);
@Module({ dynamic: true, namespaced: true, store, name: NAME }) @Module({ dynamic: true, namespaced: true, store, name: NAME })
class Permission extends VuexModule { class Permission extends VuexModule {

2
src/store/modules/tab.ts
View File

@ -14,7 +14,7 @@ import { getRoute } from '/@/router/helper/routeHelper';
import { useGo, useRedo } from '/@/hooks/web/usePage'; import { useGo, useRedo } from '/@/hooks/web/usePage';
import { cloneDeep } from 'lodash-es'; import { cloneDeep } from 'lodash-es';
const NAME = 'tab'; const NAME = 'app-tab';
hotModuleUnregisterModule(NAME); hotModuleUnregisterModule(NAME);

20
src/store/modules/user.ts
View File

@ -25,16 +25,22 @@ import projectSetting from '/@/settings/projectSetting';
export type UserInfo = Omit<GetUserInfoByUserIdModel, 'roles'>; export type UserInfo = Omit<GetUserInfoByUserIdModel, 'roles'>;
const NAME = 'user'; const { permissionCacheType } = projectSetting;
const isLocal = permissionCacheType === CacheTypeEnum.LOCAL;
const NAME = 'app-user';
hotModuleUnregisterModule(NAME); hotModuleUnregisterModule(NAME);
function getCache<T>(key: BasicKeys) { function getCache<T>(key: BasicKeys) {
const { permissionCacheType } = projectSetting; const fn = isLocal ? Persistent.getLocal : Persistent.getSession;
const fn =
permissionCacheType === CacheTypeEnum.LOCAL ? Persistent.getLocal : Persistent.getSession;
return fn(key) as T; return fn(key) as T;
} }
function setCache(key: BasicKeys, value) {
const fn = isLocal ? Persistent.setLocal : Persistent.setSession;
return fn(key, value);
}
@Module({ namespaced: true, name: NAME, dynamic: true, store }) @Module({ namespaced: true, name: NAME, dynamic: true, store })
class User extends VuexModule { class User extends VuexModule {
// user info // user info
@ -68,19 +74,19 @@ class User extends VuexModule {
@Mutation @Mutation
commitUserInfoState(info: UserInfo): void { commitUserInfoState(info: UserInfo): void {
this.userInfoState = info; this.userInfoState = info;
Persistent.setLocal(USER_INFO_KEY, info); setCache(USER_INFO_KEY, info);
} }
@Mutation @Mutation
commitRoleListState(roleList: RoleEnum[]): void { commitRoleListState(roleList: RoleEnum[]): void {
this.roleListState = roleList; this.roleListState = roleList;
Persistent.setLocal(ROLES_KEY, roleList); setCache(ROLES_KEY, roleList);
} }
@Mutation @Mutation
commitTokenState(info: string): void { commitTokenState(info: string): void {
this.tokenState = info; this.tokenState = info;
Persistent.setLocal(TOKEN_KEY, info); setCache(TOKEN_KEY, info);
} }
/** /**

16
src/utils/cache/persistent.ts vendored
View File

@ -1,3 +1,7 @@
import type { UserInfo } from '/@/store/modules/user';
import type { LockInfo } from '/@/store/modules/lock';
import { ProjectConfig } from '/#/config';
import { createLocalStorage, createSessionStorage } from '/@/utils/cache'; import { createLocalStorage, createSessionStorage } from '/@/utils/cache';
import { Memory } from './memory'; import { Memory } from './memory';
import { import {
@ -14,10 +18,10 @@ import { toRaw } from 'vue';
interface BasicStore { interface BasicStore {
[TOKEN_KEY]: string | number | null | undefined; [TOKEN_KEY]: string | number | null | undefined;
[USER_INFO_KEY]: Recordable; [USER_INFO_KEY]: UserInfo;
[ROLES_KEY]: Recordable; [ROLES_KEY]: string[];
[LOCK_INFO_KEY]: Recordable; [LOCK_INFO_KEY]: LockInfo;
[PROJ_CFG_KEY]: Recordable; [PROJ_CFG_KEY]: ProjectConfig;
} }
type LocalStore = BasicStore; type LocalStore = BasicStore;
@ -36,7 +40,7 @@ const sessionMemory = new Memory(DEFAULT_CACHE_TIME);
function initPersistentMemory() { function initPersistentMemory() {
const localCache = ls.get(APP_LOCAL_CACHE_KEY); const localCache = ls.get(APP_LOCAL_CACHE_KEY);
const sessionCache = ls.get(APP_SESSION_CACHE_KEY); const sessionCache = ss.get(APP_SESSION_CACHE_KEY);
localCache && localMemory.resetCache(localCache); localCache && localMemory.resetCache(localCache);
sessionCache && sessionMemory.resetCache(sessionCache); sessionCache && sessionMemory.resetCache(sessionCache);
} }
@ -65,7 +69,7 @@ export class Persistent {
static setSession(key: SessionKeys, value: SessionStore[SessionKeys], immediate = false): void { static setSession(key: SessionKeys, value: SessionStore[SessionKeys], immediate = false): void {
sessionMemory.set(key, toRaw(value)); sessionMemory.set(key, toRaw(value));
immediate && ss.set(APP_SESSION_CACHE_KEY, localMemory); immediate && ss.set(APP_SESSION_CACHE_KEY, sessionMemory);
} }
static removeSession(key: SessionKeys): void { static removeSession(key: SessionKeys): void {

46
yarn.lock
View File

@ -1057,10 +1057,10 @@
resolved "https://registry.npmjs.org/@ctrl/tinycolor/-/tinycolor-3.3.3.tgz#980487763bc7c9238d6d88d1ac0dee2d4df3df68" resolved "https://registry.npmjs.org/@ctrl/tinycolor/-/tinycolor-3.3.3.tgz#980487763bc7c9238d6d88d1ac0dee2d4df3df68"
integrity sha512-v75yutF4BDMv9weDQVM+K5XEfjiODhugSV729pnoxtBDO61ij2CsDnQa4N4E9xGaH3/FX5ASZjnajljT2F71tA== integrity sha512-v75yutF4BDMv9weDQVM+K5XEfjiODhugSV729pnoxtBDO61ij2CsDnQa4N4E9xGaH3/FX5ASZjnajljT2F71tA==
"@eslint/eslintrc@^0.3.0": "@eslint/eslintrc@^0.4.0":
version "0.3.0" version "0.4.0"
resolved "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-0.3.0.tgz#d736d6963d7003b6514e6324bec9c602ac340318" resolved "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-0.4.0.tgz#99cc0a0584d72f1df38b900fb062ba995f395547"
integrity sha512-1JTKgrOKAHVivSvOYw+sJOunkBjUOvjqWk1DPja7ZFhIS2mX/4EgTT8M7eTK9jrKhL/FvXXEbQwIs3pg1xp3dg== integrity sha512-2ZPCc+uNbjV5ERJr+aKSPRwZgKd2z11x0EgLvb1PURmUrn9QNRXFqje0Ldq454PfAVyaJYyrDvvIKSFP4NnBog==
dependencies: dependencies:
ajv "^6.12.4" ajv "^6.12.4"
debug "^4.1.1" debug "^4.1.1"
@ -1069,7 +1069,6 @@
ignore "^4.0.6" ignore "^4.0.6"
import-fresh "^3.2.1" import-fresh "^3.2.1"
js-yaml "^3.13.1" js-yaml "^3.13.1"
lodash "^4.17.20"
minimatch "^3.0.4" minimatch "^3.0.4"
strip-json-comments "^3.1.1" strip-json-comments "^3.1.1"
@ -1718,10 +1717,10 @@
dependencies: dependencies:
vue-demi latest vue-demi latest
"@windicss/plugin-utils@0.6.0": "@windicss/plugin-utils@0.6.2":
version "0.6.0" version "0.6.2"
resolved "https://registry.npmjs.org/@windicss/plugin-utils/-/plugin-utils-0.6.0.tgz#34eb852b7ff338bb933b0079112318a30d2aee00" resolved "https://registry.npmjs.org/@windicss/plugin-utils/-/plugin-utils-0.6.2.tgz#8fc76d9f2a1e3de123ffd54fdd9d1583801bb087"
integrity sha512-CpXn3CRrAaDrpTjenidVfBz0JONLuGTFP6qjrwZ2tmhsKOuvTWw8Ic9JQ2a9L0AkYBH33lTso1qk70/PjnE6WQ== integrity sha512-qR2h/vDn3LZtL0cC3id9nxPwhYqCtkcwASs63sHTUOzLhxz+zkG4xR+odndbR6PTjrlTgBC7n5hLjpq0lxRksg==
dependencies: dependencies:
esbuild "^0.8.52" esbuild "^0.8.52"
esbuild-register "^2.0.0" esbuild-register "^2.0.0"
@ -3678,13 +3677,13 @@ eslint-visitor-keys@^2.0.0:
resolved "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-2.0.0.tgz#21fdc8fbcd9c795cc0321f0563702095751511a8" resolved "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-2.0.0.tgz#21fdc8fbcd9c795cc0321f0563702095751511a8"
integrity sha512-QudtT6av5WXels9WjIM7qz1XD1cWGvX4gGXvp/zBn9nXG02D0utdU3Em2m/QjTnrsk6bBjmCygl3rmj118msQQ== integrity sha512-QudtT6av5WXels9WjIM7qz1XD1cWGvX4gGXvp/zBn9nXG02D0utdU3Em2m/QjTnrsk6bBjmCygl3rmj118msQQ==
eslint@^7.20.0: eslint@^7.21.0:
version "7.20.0" version "7.21.0"
resolved "https://registry.npmjs.org/eslint/-/eslint-7.20.0.tgz#db07c4ca4eda2e2316e7aa57ac7fc91ec550bdc7" resolved "https://registry.npmjs.org/eslint/-/eslint-7.21.0.tgz#4ecd5b8c5b44f5dedc9b8a110b01bbfeb15d1c83"
integrity sha512-qGi0CTcOGP2OtCQBgWZlQjcTuP0XkIpYFj25XtRTQSHC+umNnp7UMshr2G8SLsRFYDdAPFeHOsiteadmMH02Yw== integrity sha512-W2aJbXpMNofUp0ztQaF40fveSsJBjlSCSWpy//gzfTvwC+USs/nceBrKmlJOiM8r1bLwP2EuYkCqArn/6QTIgg==
dependencies: dependencies:
"@babel/code-frame" "7.12.11" "@babel/code-frame" "7.12.11"
"@eslint/eslintrc" "^0.3.0" "@eslint/eslintrc" "^0.4.0"
ajv "^6.10.0" ajv "^6.10.0"
chalk "^4.0.0" chalk "^4.0.0"
cross-spawn "^7.0.2" cross-spawn "^7.0.2"
@ -3697,7 +3696,7 @@ eslint@^7.20.0:
espree "^7.3.1" espree "^7.3.1"
esquery "^1.4.0" esquery "^1.4.0"
esutils "^2.0.2" esutils "^2.0.2"
file-entry-cache "^6.0.0" file-entry-cache "^6.0.1"
functional-red-black-tree "^1.0.1" functional-red-black-tree "^1.0.1"
glob-parent "^5.0.0" glob-parent "^5.0.0"
globals "^12.1.0" globals "^12.1.0"
@ -4030,6 +4029,13 @@ file-entry-cache@^6.0.0:
dependencies: dependencies:
flat-cache "^3.0.4" flat-cache "^3.0.4"
file-entry-cache@^6.0.1:
version "6.0.1"
resolved "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-6.0.1.tgz#211b2dd9659cb0394b073e7323ac3c933d522027"
integrity sha512-7Gps/XWymbLk2QLYK4NzpMOrYjMhdIxXuIvy2QBsLE6ljuodKvdkWs/cpyJJ3CVIVpH0Oi1Hvg1ovbMzLdFBBg==
dependencies:
flat-cache "^3.0.4"
file-type@5.2.0, file-type@^5.2.0: file-type@5.2.0, file-type@^5.2.0:
version "5.2.0" version "5.2.0"
resolved "https://registry.npmjs.org/file-type/-/file-type-5.2.0.tgz#2ddbea7c73ffe36368dfae49dc338c058c2b8ad6" resolved "https://registry.npmjs.org/file-type/-/file-type-5.2.0.tgz#2ddbea7c73ffe36368dfae49dc338c058c2b8ad6"
@ -8968,12 +8974,12 @@ vite-plugin-theme@^0.4.8:
es-module-lexer "^0.3.26" es-module-lexer "^0.3.26"
tinycolor2 "^1.4.2" tinycolor2 "^1.4.2"
vite-plugin-windicss@0.6.0: vite-plugin-windicss@0.6.2:
version "0.6.0" version "0.6.2"
resolved "https://registry.npmjs.org/vite-plugin-windicss/-/vite-plugin-windicss-0.6.0.tgz#ac8f24e70439904b67adc1f133e692fb6257ecaf" resolved "https://registry.npmjs.org/vite-plugin-windicss/-/vite-plugin-windicss-0.6.2.tgz#2b406c65768ce7df22451dc7b47c0026abd4bb24"
integrity sha512-PSFdm0hrAGaKFzkFOiz31+dODoKNbh9wo/3m/7/012WwV9oJ1mX/9OxDxACykW7hMR0YvWHFmC0UwtvMra+InQ== integrity sha512-V4WnjkxvriJSVQjswY+SrDKogOLNq1eG6dQw1wWcJRV+0QUz9pAGrMolSwed4d4MwSSbJrCA7If8xa+EFLUigw==
dependencies: dependencies:
"@windicss/plugin-utils" "0.6.0" "@windicss/plugin-utils" "0.6.2"
windicss "^2.2.0" windicss "^2.2.0"
vite@2.0.4: vite@2.0.4: