mirror of
https://github.com/vbenjs/vben-admin-thin-next.git
synced 2025-02-02 18:08:40 +08:00
fix: improve persistent cache logic
This commit is contained in:
parent
f6cef1088d
commit
15567e478c
@ -76,7 +76,7 @@
|
||||
"conventional-changelog-cli": "^2.1.1",
|
||||
"cross-env": "^7.0.3",
|
||||
"dotenv": "^8.2.0",
|
||||
"eslint": "^7.20.0",
|
||||
"eslint": "^7.21.0",
|
||||
"eslint-config-prettier": "^8.1.0",
|
||||
"eslint-plugin-prettier": "^3.3.1",
|
||||
"eslint-plugin-vue": "^7.6.0",
|
||||
@ -106,7 +106,7 @@
|
||||
"vite-plugin-pwa": "^0.5.5",
|
||||
"vite-plugin-style-import": "^0.7.5",
|
||||
"vite-plugin-theme": "^0.4.8",
|
||||
"vite-plugin-windicss": "0.6.0",
|
||||
"vite-plugin-windicss": "0.6.2",
|
||||
"vue-eslint-parser": "^7.5.0",
|
||||
"yargs": "^16.2.0"
|
||||
},
|
||||
|
@ -110,7 +110,7 @@
|
||||
listenerLastChangeTab((route) => {
|
||||
if (route.name === REDIRECT_NAME) return;
|
||||
handleMenuChange(route);
|
||||
currentActiveMenu.value = route.meta?.currentActiveMenu;
|
||||
currentActiveMenu.value = route.meta?.currentActiveMenu as string;
|
||||
|
||||
if (unref(currentActiveMenu)) {
|
||||
menuState.selectedKeys = [unref(currentActiveMenu)];
|
||||
|
@ -21,5 +21,6 @@ export const useFullContent = () => {
|
||||
// Return to the configuration in the configuration file
|
||||
return appStore.getProjectConfig.fullContent;
|
||||
});
|
||||
|
||||
return { getFullContent };
|
||||
};
|
||||
|
@ -41,7 +41,7 @@ export function useSplitMenu(splitType: Ref<MenuSplitTyeEnum>) {
|
||||
if (unref(splitNotLeft) || unref(getIsMobile)) return;
|
||||
|
||||
const { meta } = unref(currentRoute);
|
||||
const currentActiveMenu = meta.currentActiveMenu;
|
||||
const currentActiveMenu = meta.currentActiveMenu as string;
|
||||
let parentPath = await getCurrentParentPath(path);
|
||||
if (!parentPath) {
|
||||
parentPath = await getCurrentParentPath(currentActiveMenu);
|
||||
|
@ -1,7 +1,9 @@
|
||||
/**
|
||||
* Application configuration
|
||||
*/
|
||||
import type { ProjectConfig } from '/#/config';
|
||||
|
||||
import { PROJ_CFG_KEY } from '/@/enums/cacheEnum';
|
||||
import projectSetting from '/@/settings/projectSetting';
|
||||
|
||||
import { updateHeaderBgColor, updateSidebarBgColor } from '/@/logics/theme/updateBackground';
|
||||
@ -15,9 +17,13 @@ import { localeStore } from '/@/store/modules/locale';
|
||||
import { getCommonStoragePrefix, getStorageShortName } from '/@/utils/env';
|
||||
|
||||
import { primaryColor } from '../../build/config/themeConfig';
|
||||
import { Persistent } from '/@/utils/cache/persistent';
|
||||
import { deepMerge } from '/@/utils';
|
||||
|
||||
// Initial project configuration
|
||||
export function initAppConfigStore() {
|
||||
let projCfg: ProjectConfig = Persistent.getLocal(PROJ_CFG_KEY) as ProjectConfig;
|
||||
projCfg = deepMerge(projectSetting, projCfg || {});
|
||||
try {
|
||||
const {
|
||||
colorWeak,
|
||||
@ -25,7 +31,7 @@ export function initAppConfigStore() {
|
||||
themeColor,
|
||||
headerSetting: { bgColor: headerBgColor } = {},
|
||||
menuSetting: { bgColor } = {},
|
||||
} = projectSetting;
|
||||
} = projCfg;
|
||||
if (themeColor && themeColor !== primaryColor) {
|
||||
changeTheme(themeColor);
|
||||
}
|
||||
@ -36,7 +42,7 @@ export function initAppConfigStore() {
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
appStore.commitProjectConfigState(projectSetting);
|
||||
appStore.commitProjectConfigState(projCfg);
|
||||
localeStore.initLocale();
|
||||
|
||||
setTimeout(() => {
|
||||
|
@ -22,7 +22,7 @@ const setting: ProjectConfig = {
|
||||
permissionMode: PermissionModeEnum.ROLE,
|
||||
|
||||
// Permission-related cache is stored in sessionStorage or localStorage
|
||||
permissionCacheType: CacheTypeEnum.LOCAL,
|
||||
permissionCacheType: CacheTypeEnum.SESSION,
|
||||
|
||||
// color
|
||||
themeColor: primaryColor,
|
||||
|
@ -22,7 +22,7 @@ export interface ErrorState {
|
||||
errorListCountState: number;
|
||||
}
|
||||
|
||||
const NAME = 'error';
|
||||
const NAME = 'app-error';
|
||||
hotModuleUnregisterModule(NAME);
|
||||
@Module({ dynamic: true, namespaced: true, store, name: NAME })
|
||||
class Error extends VuexModule implements ErrorState {
|
||||
|
@ -13,7 +13,7 @@ const ls = createLocalStorage();
|
||||
|
||||
const lsSetting = (ls.get(LOCALE_KEY) || localeSetting) as LocaleSetting;
|
||||
|
||||
const NAME = 'locale';
|
||||
const NAME = 'app-locale';
|
||||
hotModuleUnregisterModule(NAME);
|
||||
@Module({ dynamic: true, namespaced: true, store, name: NAME })
|
||||
class Locale extends VuexModule {
|
||||
|
@ -13,7 +13,7 @@ export interface LockInfo {
|
||||
isLock: boolean;
|
||||
}
|
||||
|
||||
const NAME = 'lock';
|
||||
const NAME = 'app-lock';
|
||||
hotModuleUnregisterModule(NAME);
|
||||
@Module({ dynamic: true, namespaced: true, store, name: NAME })
|
||||
class Lock extends VuexModule {
|
||||
|
@ -22,7 +22,7 @@ import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { ERROR_LOG_ROUTE, PAGE_NOT_FOUND_ROUTE } from '/@/router/constant';
|
||||
|
||||
const { createMessage } = useMessage();
|
||||
const NAME = 'permission';
|
||||
const NAME = 'app-permission';
|
||||
hotModuleUnregisterModule(NAME);
|
||||
@Module({ dynamic: true, namespaced: true, store, name: NAME })
|
||||
class Permission extends VuexModule {
|
||||
|
@ -14,7 +14,7 @@ import { getRoute } from '/@/router/helper/routeHelper';
|
||||
import { useGo, useRedo } from '/@/hooks/web/usePage';
|
||||
import { cloneDeep } from 'lodash-es';
|
||||
|
||||
const NAME = 'tab';
|
||||
const NAME = 'app-tab';
|
||||
|
||||
hotModuleUnregisterModule(NAME);
|
||||
|
||||
|
@ -25,16 +25,22 @@ import projectSetting from '/@/settings/projectSetting';
|
||||
|
||||
export type UserInfo = Omit<GetUserInfoByUserIdModel, 'roles'>;
|
||||
|
||||
const NAME = 'user';
|
||||
const { permissionCacheType } = projectSetting;
|
||||
const isLocal = permissionCacheType === CacheTypeEnum.LOCAL;
|
||||
|
||||
const NAME = 'app-user';
|
||||
hotModuleUnregisterModule(NAME);
|
||||
|
||||
function getCache<T>(key: BasicKeys) {
|
||||
const { permissionCacheType } = projectSetting;
|
||||
const fn =
|
||||
permissionCacheType === CacheTypeEnum.LOCAL ? Persistent.getLocal : Persistent.getSession;
|
||||
const fn = isLocal ? Persistent.getLocal : Persistent.getSession;
|
||||
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 })
|
||||
class User extends VuexModule {
|
||||
// user info
|
||||
@ -68,19 +74,19 @@ class User extends VuexModule {
|
||||
@Mutation
|
||||
commitUserInfoState(info: UserInfo): void {
|
||||
this.userInfoState = info;
|
||||
Persistent.setLocal(USER_INFO_KEY, info);
|
||||
setCache(USER_INFO_KEY, info);
|
||||
}
|
||||
|
||||
@Mutation
|
||||
commitRoleListState(roleList: RoleEnum[]): void {
|
||||
this.roleListState = roleList;
|
||||
Persistent.setLocal(ROLES_KEY, roleList);
|
||||
setCache(ROLES_KEY, roleList);
|
||||
}
|
||||
|
||||
@Mutation
|
||||
commitTokenState(info: string): void {
|
||||
this.tokenState = info;
|
||||
Persistent.setLocal(TOKEN_KEY, info);
|
||||
setCache(TOKEN_KEY, info);
|
||||
}
|
||||
|
||||
/**
|
||||
|
16
src/utils/cache/persistent.ts
vendored
16
src/utils/cache/persistent.ts
vendored
@ -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 { Memory } from './memory';
|
||||
import {
|
||||
@ -14,10 +18,10 @@ import { toRaw } from 'vue';
|
||||
|
||||
interface BasicStore {
|
||||
[TOKEN_KEY]: string | number | null | undefined;
|
||||
[USER_INFO_KEY]: Recordable;
|
||||
[ROLES_KEY]: Recordable;
|
||||
[LOCK_INFO_KEY]: Recordable;
|
||||
[PROJ_CFG_KEY]: Recordable;
|
||||
[USER_INFO_KEY]: UserInfo;
|
||||
[ROLES_KEY]: string[];
|
||||
[LOCK_INFO_KEY]: LockInfo;
|
||||
[PROJ_CFG_KEY]: ProjectConfig;
|
||||
}
|
||||
|
||||
type LocalStore = BasicStore;
|
||||
@ -36,7 +40,7 @@ const sessionMemory = new Memory(DEFAULT_CACHE_TIME);
|
||||
|
||||
function initPersistentMemory() {
|
||||
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);
|
||||
sessionCache && sessionMemory.resetCache(sessionCache);
|
||||
}
|
||||
@ -65,7 +69,7 @@ export class Persistent {
|
||||
|
||||
static setSession(key: SessionKeys, value: SessionStore[SessionKeys], immediate = false): void {
|
||||
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 {
|
||||
|
46
yarn.lock
46
yarn.lock
@ -1057,10 +1057,10 @@
|
||||
resolved "https://registry.npmjs.org/@ctrl/tinycolor/-/tinycolor-3.3.3.tgz#980487763bc7c9238d6d88d1ac0dee2d4df3df68"
|
||||
integrity sha512-v75yutF4BDMv9weDQVM+K5XEfjiODhugSV729pnoxtBDO61ij2CsDnQa4N4E9xGaH3/FX5ASZjnajljT2F71tA==
|
||||
|
||||
"@eslint/eslintrc@^0.3.0":
|
||||
version "0.3.0"
|
||||
resolved "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-0.3.0.tgz#d736d6963d7003b6514e6324bec9c602ac340318"
|
||||
integrity sha512-1JTKgrOKAHVivSvOYw+sJOunkBjUOvjqWk1DPja7ZFhIS2mX/4EgTT8M7eTK9jrKhL/FvXXEbQwIs3pg1xp3dg==
|
||||
"@eslint/eslintrc@^0.4.0":
|
||||
version "0.4.0"
|
||||
resolved "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-0.4.0.tgz#99cc0a0584d72f1df38b900fb062ba995f395547"
|
||||
integrity sha512-2ZPCc+uNbjV5ERJr+aKSPRwZgKd2z11x0EgLvb1PURmUrn9QNRXFqje0Ldq454PfAVyaJYyrDvvIKSFP4NnBog==
|
||||
dependencies:
|
||||
ajv "^6.12.4"
|
||||
debug "^4.1.1"
|
||||
@ -1069,7 +1069,6 @@
|
||||
ignore "^4.0.6"
|
||||
import-fresh "^3.2.1"
|
||||
js-yaml "^3.13.1"
|
||||
lodash "^4.17.20"
|
||||
minimatch "^3.0.4"
|
||||
strip-json-comments "^3.1.1"
|
||||
|
||||
@ -1718,10 +1717,10 @@
|
||||
dependencies:
|
||||
vue-demi latest
|
||||
|
||||
"@windicss/plugin-utils@0.6.0":
|
||||
version "0.6.0"
|
||||
resolved "https://registry.npmjs.org/@windicss/plugin-utils/-/plugin-utils-0.6.0.tgz#34eb852b7ff338bb933b0079112318a30d2aee00"
|
||||
integrity sha512-CpXn3CRrAaDrpTjenidVfBz0JONLuGTFP6qjrwZ2tmhsKOuvTWw8Ic9JQ2a9L0AkYBH33lTso1qk70/PjnE6WQ==
|
||||
"@windicss/plugin-utils@0.6.2":
|
||||
version "0.6.2"
|
||||
resolved "https://registry.npmjs.org/@windicss/plugin-utils/-/plugin-utils-0.6.2.tgz#8fc76d9f2a1e3de123ffd54fdd9d1583801bb087"
|
||||
integrity sha512-qR2h/vDn3LZtL0cC3id9nxPwhYqCtkcwASs63sHTUOzLhxz+zkG4xR+odndbR6PTjrlTgBC7n5hLjpq0lxRksg==
|
||||
dependencies:
|
||||
esbuild "^0.8.52"
|
||||
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"
|
||||
integrity sha512-QudtT6av5WXels9WjIM7qz1XD1cWGvX4gGXvp/zBn9nXG02D0utdU3Em2m/QjTnrsk6bBjmCygl3rmj118msQQ==
|
||||
|
||||
eslint@^7.20.0:
|
||||
version "7.20.0"
|
||||
resolved "https://registry.npmjs.org/eslint/-/eslint-7.20.0.tgz#db07c4ca4eda2e2316e7aa57ac7fc91ec550bdc7"
|
||||
integrity sha512-qGi0CTcOGP2OtCQBgWZlQjcTuP0XkIpYFj25XtRTQSHC+umNnp7UMshr2G8SLsRFYDdAPFeHOsiteadmMH02Yw==
|
||||
eslint@^7.21.0:
|
||||
version "7.21.0"
|
||||
resolved "https://registry.npmjs.org/eslint/-/eslint-7.21.0.tgz#4ecd5b8c5b44f5dedc9b8a110b01bbfeb15d1c83"
|
||||
integrity sha512-W2aJbXpMNofUp0ztQaF40fveSsJBjlSCSWpy//gzfTvwC+USs/nceBrKmlJOiM8r1bLwP2EuYkCqArn/6QTIgg==
|
||||
dependencies:
|
||||
"@babel/code-frame" "7.12.11"
|
||||
"@eslint/eslintrc" "^0.3.0"
|
||||
"@eslint/eslintrc" "^0.4.0"
|
||||
ajv "^6.10.0"
|
||||
chalk "^4.0.0"
|
||||
cross-spawn "^7.0.2"
|
||||
@ -3697,7 +3696,7 @@ eslint@^7.20.0:
|
||||
espree "^7.3.1"
|
||||
esquery "^1.4.0"
|
||||
esutils "^2.0.2"
|
||||
file-entry-cache "^6.0.0"
|
||||
file-entry-cache "^6.0.1"
|
||||
functional-red-black-tree "^1.0.1"
|
||||
glob-parent "^5.0.0"
|
||||
globals "^12.1.0"
|
||||
@ -4030,6 +4029,13 @@ file-entry-cache@^6.0.0:
|
||||
dependencies:
|
||||
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:
|
||||
version "5.2.0"
|
||||
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"
|
||||
tinycolor2 "^1.4.2"
|
||||
|
||||
vite-plugin-windicss@0.6.0:
|
||||
version "0.6.0"
|
||||
resolved "https://registry.npmjs.org/vite-plugin-windicss/-/vite-plugin-windicss-0.6.0.tgz#ac8f24e70439904b67adc1f133e692fb6257ecaf"
|
||||
integrity sha512-PSFdm0hrAGaKFzkFOiz31+dODoKNbh9wo/3m/7/012WwV9oJ1mX/9OxDxACykW7hMR0YvWHFmC0UwtvMra+InQ==
|
||||
vite-plugin-windicss@0.6.2:
|
||||
version "0.6.2"
|
||||
resolved "https://registry.npmjs.org/vite-plugin-windicss/-/vite-plugin-windicss-0.6.2.tgz#2b406c65768ce7df22451dc7b47c0026abd4bb24"
|
||||
integrity sha512-V4WnjkxvriJSVQjswY+SrDKogOLNq1eG6dQw1wWcJRV+0QUz9pAGrMolSwed4d4MwSSbJrCA7If8xa+EFLUigw==
|
||||
dependencies:
|
||||
"@windicss/plugin-utils" "0.6.0"
|
||||
"@windicss/plugin-utils" "0.6.2"
|
||||
windicss "^2.2.0"
|
||||
|
||||
vite@2.0.4:
|
||||
|
Loading…
Reference in New Issue
Block a user