From e757c54fb6a4ec32a70bda88185d15b93ba28ac5 Mon Sep 17 00:00:00 2001 From: kailong321200875 <321200875@qq.com> Date: Fri, 30 Sep 2022 16:52:39 +0800 Subject: [PATCH 1/4] wip: perf pinia --- package.json | 30 ++++---- src/config/app.ts | 106 --------------------------- src/config/locale.ts | 32 --------- src/main.ts | 7 +- src/store/index.ts | 21 ++++-- src/store/modules/app.ts | 123 ++++++++++++++++++++++++++++---- src/store/modules/dict.ts | 7 +- src/store/modules/locale.ts | 41 ++++++++--- src/store/modules/permission.ts | 7 +- src/store/modules/tagsView.ts | 3 +- 10 files changed, 180 insertions(+), 197 deletions(-) delete mode 100644 src/config/app.ts delete mode 100644 src/config/locale.ts diff --git a/package.json b/package.json index dbfccfd..3046b56 100644 --- a/package.json +++ b/package.json @@ -27,13 +27,13 @@ }, "dependencies": { "@iconify/iconify": "^3.0.0", - "@vueuse/core": "^9.2.0", - "@wangeditor/editor": "^5.1.18", + "@vueuse/core": "^9.3.0", + "@wangeditor/editor": "^5.1.20", "@wangeditor/editor-for-vue": "^5.1.10", "@zxcvbn-ts/core": "^2.0.5", "animate.css": "^4.1.1", "axios": "^0.27.2", - "echarts": "^5.3.3", + "echarts": "^5.4.0", "echarts-wordcloud": "^2.0.0", "element-plus": "2.2.17", "intro.js": "^6.0.0", @@ -42,11 +42,11 @@ "mockjs": "^1.1.0", "nprogress": "^0.2.0", "pinia": "^2.0.22", - "pinia-plugin-persist": "^1.0.0", + "pinia-plugin-persistedstate": "^2.2.0", "qrcode": "^1.5.1", "qs": "^6.11.0", "url": "^0.11.0", - "vue": "3.2.39", + "vue": "3.2.40", "vue-i18n": "9.2.2", "vue-router": "^4.1.5", "vue-types": "^4.2.1", @@ -55,21 +55,21 @@ "devDependencies": { "@commitlint/cli": "^17.1.2", "@commitlint/config-conventional": "^17.1.0", - "@iconify/json": "^2.1.110", - "@intlify/vite-plugin-vue-i18n": "^6.0.1", + "@iconify/json": "^2.1.115", + "@intlify/vite-plugin-vue-i18n": "^6.0.3", "@purge-icons/generated": "^0.9.0", "@types/intro.js": "^5.1.0", "@types/lodash-es": "^4.17.6", - "@types/node": "^18.7.18", + "@types/node": "^18.7.23", "@types/nprogress": "^0.2.0", "@types/qrcode": "^1.5.0", "@types/qs": "^6.9.7", - "@typescript-eslint/eslint-plugin": "^5.38.0", - "@typescript-eslint/parser": "^5.38.0", + "@typescript-eslint/eslint-plugin": "^5.38.1", + "@typescript-eslint/parser": "^5.38.1", "@vitejs/plugin-vue": "^3.1.0", "@vitejs/plugin-vue-jsx": "^2.0.1", "autoprefixer": "^10.4.12", - "eslint": "^8.23.1", + "eslint": "^8.24.0", "eslint-config-prettier": "^8.5.0", "eslint-define-config": "^1.7.0", "eslint-plugin-prettier": "^4.2.1", @@ -83,16 +83,16 @@ "postcss-less": "^6.0.0", "prettier": "^2.7.1", "rimraf": "^3.0.2", - "rollup": "^2.79.0", - "stylelint": "^14.12.0", + "rollup": "^2.79.1", + "stylelint": "^14.13.0", "stylelint-config-html": "^1.1.0", "stylelint-config-prettier": "^9.0.3", "stylelint-config-recommended": "^9.0.0", "stylelint-config-standard": "^28.0.0", "stylelint-order": "^5.0.0", - "typescript": "4.8.3", + "typescript": "4.8.4", "unplugin-vue-macros": "^0.11.2", - "vite": "3.1.3", + "vite": "3.1.4", "vite-plugin-eslint": "^1.8.1", "vite-plugin-html": "^3.2.0", "vite-plugin-mock": "^2.9.6", diff --git a/src/config/app.ts b/src/config/app.ts deleted file mode 100644 index 2c51654..0000000 --- a/src/config/app.ts +++ /dev/null @@ -1,106 +0,0 @@ -import { useCache } from '@/hooks/web/useCache' - -const { wsCache } = useCache() - -export type LayoutType = 'classic' | 'topLeft' | 'top' | 'cutMenu' - -export type ThemeTypes = { - elColorPrimary?: string - leftMenuBorderColor?: string - leftMenuBgColor?: string - leftMenuBgLightColor?: string - leftMenuBgActiveColor?: string - leftMenuCollapseBgActiveColor?: string - leftMenuTextColor?: string - leftMenuTextActiveColor?: string - logoTitleTextColor?: string - logoBorderColor?: string - topHeaderBgColor?: string - topHeaderTextColor?: string - topHeaderHoverColor?: string - topToolBorderColor?: string -} -export interface AppState { - breadcrumb: boolean - breadcrumbIcon: boolean - collapse: boolean - uniqueOpened: boolean - hamburger: boolean - screenfull: boolean - size: boolean - locale: boolean - tagsView: boolean - tagsViewIcon: boolean - logo: boolean - fixedHeader: boolean - greyMode: boolean - dynamicRouter: boolean - pageLoading: boolean - layout: LayoutType - title: string - userInfo: string - isDark: boolean - currentSize: ElememtPlusSize - sizeMap: ElememtPlusSize[] - mobile: boolean - footer: boolean - theme: ThemeTypes -} - -export const appModules: AppState = { - userInfo: 'userInfo', // 登录信息存储字段-建议每个项目换一个字段，避免与其他项目冲突 - sizeMap: ['default', 'large', 'small'], - mobile: false, // 是否是移动端 - title: import.meta.env.VITE_APP_TITLE, // 标题 - pageLoading: false, // 路由跳转loading - - breadcrumb: true, // 面包屑 - breadcrumbIcon: true, // 面包屑图标 - collapse: false, // 折叠菜单 - uniqueOpened: false, // 是否只保持一个子菜单的展开 - hamburger: true, // 折叠图标 - screenfull: true, // 全屏图标 - size: true, // 尺寸图标 - locale: true, // 多语言图标 - tagsView: true, // 标签页 - tagsViewIcon: true, // 是否显示标签图标 - logo: true, // logo - fixedHeader: true, // 固定toolheader - footer: true, // 显示页脚 - greyMode: false, // 是否开始灰色模式，用于特殊悼念日 - dynamicRouter: wsCache.get('dynamicRouter') || false, // 是否动态路由 - - layout: wsCache.get('layout') || 'classic', // layout布局 - isDark: wsCache.get('isDark') || false, // 是否是暗黑模式 - currentSize: wsCache.get('default') || 'default', // 组件尺寸 - theme: wsCache.get('theme') || { - // 主题色 - elColorPrimary: '#409eff', - // 左侧菜单边框颜色 - leftMenuBorderColor: 'inherit', - // 左侧菜单背景颜色 - leftMenuBgColor: '#001529', - // 左侧菜单浅色背景颜色 - leftMenuBgLightColor: '#0f2438', - // 左侧菜单选中背景颜色 - leftMenuBgActiveColor: 'var(--el-color-primary)', - // 左侧菜单收起选中背景颜色 - leftMenuCollapseBgActiveColor: 'var(--el-color-primary)', - // 左侧菜单字体颜色 - leftMenuTextColor: '#bfcbd9', - // 左侧菜单选中字体颜色 - leftMenuTextActiveColor: '#fff', - // logo字体颜色 - logoTitleTextColor: '#fff', - // logo边框颜色 - logoBorderColor: 'inherit', - // 头部背景颜色 - topHeaderBgColor: '#fff', - // 头部字体颜色 - topHeaderTextColor: 'inherit', - // 头部悬停颜色 - topHeaderHoverColor: '#f6f6f6', - // 头部边框颜色 - topToolBorderColor: '#eee' - } -} diff --git a/src/config/locale.ts b/src/config/locale.ts deleted file mode 100644 index c20a3d9..0000000 --- a/src/config/locale.ts +++ /dev/null @@ -1,32 +0,0 @@ -import { useCache } from '@/hooks/web/useCache' -import zhCn from 'element-plus/es/locale/lang/zh-cn' -import en from 'element-plus/es/locale/lang/en' - -const { wsCache } = useCache() - -export const elLocaleMap = { - 'zh-CN': zhCn, - en: en -} -export interface LocaleState { - currentLocale: LocaleDropdownType - localeMap: LocaleDropdownType[] -} - -export const localeModules: LocaleState = { - currentLocale: { - lang: wsCache.get('lang') || 'zh-CN', - elLocale: elLocaleMap[wsCache.get('lang') || 'zh-CN'] - }, - // 多语言 - localeMap: [ - { - lang: 'zh-CN', - name: '简体中文' - }, - { - lang: 'en', - name: 'English' - } - ] -} diff --git a/src/main.ts b/src/main.ts index f6bfd39..86a6e0d 100644 --- a/src/main.ts +++ b/src/main.ts @@ -4,11 +4,13 @@ import '@/plugins/windi.css' // 导入全局的svg图标 import '@/plugins/svgIcon' +import './store' + // 初始化多语言 import { setupI18n } from '@/plugins/vueI18n' // 引入状态管理 -import { setupStore } from '@/store' +// import { setupStore } from '@/store' // 全局组件 import { setupGlobCom } from '@/components' @@ -33,13 +35,14 @@ import { createApp } from 'vue' import App from './App.vue' import './permission' + // 创建实例 const setupAll = async () => { const app = createApp(App) await setupI18n(app) - setupStore(app) + // setupStore(app) setupGlobCom(app) diff --git a/src/store/index.ts b/src/store/index.ts index 4038068..f5713c6 100644 --- a/src/store/index.ts +++ b/src/store/index.ts @@ -1,13 +1,22 @@ -import type { App } from 'vue' +// TODO: 感觉这样是有问题的，但目前还没想到更好的办法 import { createPinia } from 'pinia' -import piniaPluginPersist from 'pinia-plugin-persist' + +import { createApp } from 'vue' + +import App from '../App.vue' + +import { createPersistedState } from 'pinia-plugin-persistedstate' + +const app = createApp(App) const store = createPinia() -store.use(piniaPluginPersist) +store.use( + createPersistedState({ + storage: sessionStorage + }) +) -export const setupStore = (app: App) => { - app.use(store) -} +app.use(store) export { store } diff --git a/src/store/modules/app.ts b/src/store/modules/app.ts index beb6884..4310001 100644 --- a/src/store/modules/app.ts +++ b/src/store/modules/app.ts @@ -1,19 +1,114 @@ import { defineStore } from 'pinia' import { store } from '../index' -import { useCache } from '@/hooks/web/useCache' -import { appModules } from '@/config/app' -import type { AppState, LayoutType, ThemeTypes } from '@/config/app' import { setCssVar, humpToUnderline } from '@/utils' import { ElMessage } from 'element-plus' -const { wsCache } = useCache() +type LayoutType = 'classic' | 'topLeft' | 'top' | 'cutMenu' -export const useAppStore = defineStore({ - id: 'app', - state: (): AppState => appModules, - persist: { - enabled: true +type ThemeTypes = { + elColorPrimary?: string + leftMenuBorderColor?: string + leftMenuBgColor?: string + leftMenuBgLightColor?: string + leftMenuBgActiveColor?: string + leftMenuCollapseBgActiveColor?: string + leftMenuTextColor?: string + leftMenuTextActiveColor?: string + logoTitleTextColor?: string + logoBorderColor?: string + topHeaderBgColor?: string + topHeaderTextColor?: string + topHeaderHoverColor?: string + topToolBorderColor?: string +} +interface AppState { + breadcrumb: boolean + breadcrumbIcon: boolean + collapse: boolean + uniqueOpened: boolean + hamburger: boolean + screenfull: boolean + size: boolean + locale: boolean + tagsView: boolean + tagsViewIcon: boolean + logo: boolean + fixedHeader: boolean + greyMode: boolean + dynamicRouter: boolean + pageLoading: boolean + layout: LayoutType + title: string + userInfo: string + isDark: boolean + currentSize: ElememtPlusSize + sizeMap: ElememtPlusSize[] + mobile: boolean + footer: boolean + theme: ThemeTypes +} + +export const useAppStore = defineStore('app', { + state: (): AppState => { + return { + userInfo: 'userInfo', // 登录信息存储字段-建议每个项目换一个字段，避免与其他项目冲突 + sizeMap: ['default', 'large', 'small'], + mobile: false, // 是否是移动端 + title: import.meta.env.VITE_APP_TITLE, // 标题 + pageLoading: false, // 路由跳转loading + + breadcrumb: true, // 面包屑 + breadcrumbIcon: true, // 面包屑图标 + collapse: false, // 折叠菜单 + uniqueOpened: false, // 是否只保持一个子菜单的展开 + hamburger: true, // 折叠图标 + screenfull: true, // 全屏图标 + size: true, // 尺寸图标 + locale: true, // 多语言图标 + tagsView: true, // 标签页 + tagsViewIcon: true, // 是否显示标签图标 + logo: true, // logo + fixedHeader: true, // 固定toolheader + footer: true, // 显示页脚 + greyMode: false, // 是否开始灰色模式，用于特殊悼念日 + dynamicRouter: false, // 是否动态路由 + + layout: 'classic', // layout布局 + isDark: false, // 是否是暗黑模式 + currentSize: 'default', // 组件尺寸 + theme: { + // 主题色 + elColorPrimary: '#409eff', + // 左侧菜单边框颜色 + leftMenuBorderColor: 'inherit', + // 左侧菜单背景颜色 + leftMenuBgColor: '#001529', + // 左侧菜单浅色背景颜色 + leftMenuBgLightColor: '#0f2438', + // 左侧菜单选中背景颜色 + leftMenuBgActiveColor: 'var(--el-color-primary)', + // 左侧菜单收起选中背景颜色 + leftMenuCollapseBgActiveColor: 'var(--el-color-primary)', + // 左侧菜单字体颜色 + leftMenuTextColor: '#bfcbd9', + // 左侧菜单选中字体颜色 + leftMenuTextActiveColor: '#fff', + // logo字体颜色 + logoTitleTextColor: '#fff', + // logo边框颜色 + logoBorderColor: 'inherit', + // 头部背景颜色 + topHeaderBgColor: '#fff', + // 头部字体颜色 + topHeaderTextColor: 'inherit', + // 头部悬停颜色 + topHeaderHoverColor: '#f6f6f6', + // 头部边框颜色 + topToolBorderColor: '#eee' + } + } }, + persist: true, getters: { getBreadcrumb(): boolean { return this.breadcrumb @@ -129,7 +224,7 @@ export const useAppStore = defineStore({ this.greyMode = greyMode }, setDynamicRouter(dynamicRouter: boolean) { - wsCache.set('dynamicRouter', dynamicRouter) + // wsCache.set('dynamicRouter', dynamicRouter) this.dynamicRouter = dynamicRouter }, setPageLoading(pageLoading: boolean) { @@ -141,7 +236,7 @@ export const useAppStore = defineStore({ return } this.layout = layout - wsCache.set('layout', this.layout) + // wsCache.set('layout', this.layout) }, setTitle(title: string) { this.title = title @@ -155,18 +250,18 @@ export const useAppStore = defineStore({ document.documentElement.classList.add('light') document.documentElement.classList.remove('dark') } - wsCache.set('isDark', this.isDark) + // wsCache.set('isDark', this.isDark) }, setCurrentSize(currentSize: ElememtPlusSize) { this.currentSize = currentSize - wsCache.set('currentSize', this.currentSize) + // wsCache.set('currentSize', this.currentSize) }, setMobile(mobile: boolean) { this.mobile = mobile }, setTheme(theme: ThemeTypes) { this.theme = Object.assign(this.theme, theme) - wsCache.set('theme', this.theme) + // wsCache.set('theme', this.theme) }, setCssVarTheme() { for (const key in this.theme) { diff --git a/src/store/modules/dict.ts b/src/store/modules/dict.ts index 446b925..0db17d3 100644 --- a/src/store/modules/dict.ts +++ b/src/store/modules/dict.ts @@ -6,15 +6,12 @@ export interface DictState { dictObj: Recordable } -export const useDictStore = defineStore({ - id: 'dict', +export const useDictStore = defineStore('dict', { state: (): DictState => ({ isSetDict: false, dictObj: {} }), - persist: { - enabled: true - }, + persist: true, getters: { getDictObj(): Recordable { return this.dictObj diff --git a/src/store/modules/locale.ts b/src/store/modules/locale.ts index 4b7d064..dc6ed58 100644 --- a/src/store/modules/locale.ts +++ b/src/store/modules/locale.ts @@ -1,17 +1,38 @@ import { defineStore } from 'pinia' import { store } from '../index' -import { useCache } from '@/hooks/web/useCache' -import { localeModules, elLocaleMap } from '@/config/locale' -import type { LocaleState } from '@/config/locale' +import zhCn from 'element-plus/es/locale/lang/zh-cn' +import en from 'element-plus/es/locale/lang/en' -const { wsCache } = useCache() +const elLocaleMap = { + 'zh-CN': zhCn, + en: en +} +interface LocaleState { + currentLocale: LocaleDropdownType + localeMap: LocaleDropdownType[] +} -export const useLocaleStore = defineStore({ - id: 'locales', - state: (): LocaleState => localeModules, - persist: { - enabled: true +export const useLocaleStore = defineStore('locales', { + state: (): LocaleState => { + return { + currentLocale: { + lang: 'zh-CN', + elLocale: elLocaleMap['zh-CN'] + }, + // 多语言 + localeMap: [ + { + lang: 'zh-CN', + name: '简体中文' + }, + { + lang: 'en', + name: 'English' + } + ] + } }, + persist: true, getters: { getCurrentLocale(): LocaleDropdownType { return this.currentLocale @@ -25,7 +46,7 @@ export const useLocaleStore = defineStore({ // this.locale = Object.assign(this.locale, localeMap) this.currentLocale.lang = localeMap?.lang this.currentLocale.elLocale = elLocaleMap[localeMap?.lang] - wsCache.set('lang', localeMap?.lang) + // wsCache.set('lang', localeMap?.lang) } } }) diff --git a/src/store/modules/permission.ts b/src/store/modules/permission.ts index 22ca1a5..29d62aa 100644 --- a/src/store/modules/permission.ts +++ b/src/store/modules/permission.ts @@ -11,17 +11,14 @@ export interface PermissionState { menuTabRouters: AppRouteRecordRaw[] } -export const usePermissionStore = defineStore({ - id: 'permission', +export const usePermissionStore = defineStore('permission', { state: (): PermissionState => ({ routers: [], addRouters: [], isAddRouters: false, menuTabRouters: [] }), - persist: { - enabled: true - }, + persist: true, getters: { getRouters(): AppRouteRecordRaw[] { return this.routers diff --git a/src/store/modules/tagsView.ts b/src/store/modules/tagsView.ts index 33da805..e9fbf37 100644 --- a/src/store/modules/tagsView.ts +++ b/src/store/modules/tagsView.ts @@ -10,8 +10,7 @@ export interface TagsViewState { cachedViews: Set } -export const useTagsViewStore = defineStore({ - id: 'tagsView', +export const useTagsViewStore = defineStore('tagsView', { state: (): TagsViewState => ({ visitedViews: [], cachedViews: new Set() From d416178d69ca6100be4b635922b1a22d27629f08 Mon Sep 17 00:00:00 2001 From: kailong321200875 <321200875@qq.com> Date: Sat, 8 Oct 2022 11:28:50 +0800 Subject: [PATCH 2/4] perf: perf store --- package.json | 1 - src/main.ts | 6 ++---- src/store/index.ts | 20 ++++---------------- src/store/modules/app.ts | 24 +++++++++++++----------- src/store/modules/dict.ts | 1 - src/store/modules/locale.ts | 10 ++++++---- src/store/modules/permission.ts | 1 - 7 files changed, 25 insertions(+), 38 deletions(-) diff --git a/package.json b/package.json index 3046b56..d59367c 100644 --- a/package.json +++ b/package.json @@ -42,7 +42,6 @@ "mockjs": "^1.1.0", "nprogress": "^0.2.0", "pinia": "^2.0.22", - "pinia-plugin-persistedstate": "^2.2.0", "qrcode": "^1.5.1", "qs": "^6.11.0", "url": "^0.11.0", diff --git a/src/main.ts b/src/main.ts index 86a6e0d..c2ba4b2 100644 --- a/src/main.ts +++ b/src/main.ts @@ -4,13 +4,11 @@ import '@/plugins/windi.css' // 导入全局的svg图标 import '@/plugins/svgIcon' -import './store' - // 初始化多语言 import { setupI18n } from '@/plugins/vueI18n' // 引入状态管理 -// import { setupStore } from '@/store' +import { setupStore } from '@/store' // 全局组件 import { setupGlobCom } from '@/components' @@ -42,7 +40,7 @@ const setupAll = async () => { await setupI18n(app) - // setupStore(app) + setupStore(app) setupGlobCom(app) diff --git a/src/store/index.ts b/src/store/index.ts index f5713c6..65964ea 100644 --- a/src/store/index.ts +++ b/src/store/index.ts @@ -1,22 +1,10 @@ -// TODO: 感觉这样是有问题的，但目前还没想到更好的办法 +import type { App } from 'vue' import { createPinia } from 'pinia' -import { createApp } from 'vue' - -import App from '../App.vue' - -import { createPersistedState } from 'pinia-plugin-persistedstate' - -const app = createApp(App) - const store = createPinia() -store.use( - createPersistedState({ - storage: sessionStorage - }) -) - -app.use(store) +export const setupStore = (app: App) => { + app.use(store) +} export { store } diff --git a/src/store/modules/app.ts b/src/store/modules/app.ts index 4310001..25e7181 100644 --- a/src/store/modules/app.ts +++ b/src/store/modules/app.ts @@ -2,6 +2,9 @@ import { defineStore } from 'pinia' import { store } from '../index' import { setCssVar, humpToUnderline } from '@/utils' import { ElMessage } from 'element-plus' +import { useCache } from '@/hooks/web/useCache' + +const { wsCache } = useCache() type LayoutType = 'classic' | 'topLeft' | 'top' | 'cutMenu' @@ -71,12 +74,12 @@ export const useAppStore = defineStore('app', { fixedHeader: true, // 固定toolheader footer: true, // 显示页脚 greyMode: false, // 是否开始灰色模式，用于特殊悼念日 - dynamicRouter: false, // 是否动态路由 + dynamicRouter: wsCache.get('dynamicRouter') || false, // 是否动态路由 - layout: 'classic', // layout布局 - isDark: false, // 是否是暗黑模式 - currentSize: 'default', // 组件尺寸 - theme: { + layout: wsCache.get('layout') || 'classic', // layout布局 + isDark: wsCache.get('isDark') || false, // 是否是暗黑模式 + currentSize: wsCache.get('default') || 'default', // 组件尺寸 + theme: wsCache.get('theme') || { // 主题色 elColorPrimary: '#409eff', // 左侧菜单边框颜色 @@ -108,7 +111,6 @@ export const useAppStore = defineStore('app', { } } }, - persist: true, getters: { getBreadcrumb(): boolean { return this.breadcrumb @@ -224,7 +226,7 @@ export const useAppStore = defineStore('app', { this.greyMode = greyMode }, setDynamicRouter(dynamicRouter: boolean) { - // wsCache.set('dynamicRouter', dynamicRouter) + wsCache.set('dynamicRouter', dynamicRouter) this.dynamicRouter = dynamicRouter }, setPageLoading(pageLoading: boolean) { @@ -236,7 +238,7 @@ export const useAppStore = defineStore('app', { return } this.layout = layout - // wsCache.set('layout', this.layout) + wsCache.set('layout', this.layout) }, setTitle(title: string) { this.title = title @@ -250,18 +252,18 @@ export const useAppStore = defineStore('app', { document.documentElement.classList.add('light') document.documentElement.classList.remove('dark') } - // wsCache.set('isDark', this.isDark) + wsCache.set('isDark', this.isDark) }, setCurrentSize(currentSize: ElememtPlusSize) { this.currentSize = currentSize - // wsCache.set('currentSize', this.currentSize) + wsCache.set('currentSize', this.currentSize) }, setMobile(mobile: boolean) { this.mobile = mobile }, setTheme(theme: ThemeTypes) { this.theme = Object.assign(this.theme, theme) - // wsCache.set('theme', this.theme) + wsCache.set('theme', this.theme) }, setCssVarTheme() { for (const key in this.theme) { diff --git a/src/store/modules/dict.ts b/src/store/modules/dict.ts index 0db17d3..93dd46e 100644 --- a/src/store/modules/dict.ts +++ b/src/store/modules/dict.ts @@ -11,7 +11,6 @@ export const useDictStore = defineStore('dict', { isSetDict: false, dictObj: {} }), - persist: true, getters: { getDictObj(): Recordable { return this.dictObj diff --git a/src/store/modules/locale.ts b/src/store/modules/locale.ts index dc6ed58..90a0d55 100644 --- a/src/store/modules/locale.ts +++ b/src/store/modules/locale.ts @@ -2,6 +2,9 @@ import { defineStore } from 'pinia' import { store } from '../index' import zhCn from 'element-plus/es/locale/lang/zh-cn' import en from 'element-plus/es/locale/lang/en' +import { useCache } from '@/hooks/web/useCache' + +const { wsCache } = useCache() const elLocaleMap = { 'zh-CN': zhCn, @@ -16,8 +19,8 @@ export const useLocaleStore = defineStore('locales', { state: (): LocaleState => { return { currentLocale: { - lang: 'zh-CN', - elLocale: elLocaleMap['zh-CN'] + lang: wsCache.get('lang') || 'zh-CN', + elLocale: elLocaleMap[wsCache.get('lang') || 'zh-CN'] }, // 多语言 localeMap: [ @@ -32,7 +35,6 @@ export const useLocaleStore = defineStore('locales', { ] } }, - persist: true, getters: { getCurrentLocale(): LocaleDropdownType { return this.currentLocale @@ -46,7 +48,7 @@ export const useLocaleStore = defineStore('locales', { // this.locale = Object.assign(this.locale, localeMap) this.currentLocale.lang = localeMap?.lang this.currentLocale.elLocale = elLocaleMap[localeMap?.lang] - // wsCache.set('lang', localeMap?.lang) + wsCache.set('lang', localeMap?.lang) } } }) diff --git a/src/store/modules/permission.ts b/src/store/modules/permission.ts index 29d62aa..63eb0da 100644 --- a/src/store/modules/permission.ts +++ b/src/store/modules/permission.ts @@ -18,7 +18,6 @@ export const usePermissionStore = defineStore('permission', { isAddRouters: false, menuTabRouters: [] }), - persist: true, getters: { getRouters(): AppRouteRecordRaw[] { return this.routers From b320e658d1a559a6eaebdf374d63649c223c2ecd Mon Sep 17 00:00:00 2001 From: kailong321200875 <321200875@qq.com> Date: Sat, 8 Oct 2022 11:35:16 +0800 Subject: [PATCH 3/4] perf: token test --- src/config/axios/service.ts | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) diff --git a/src/config/axios/service.ts b/src/config/axios/service.ts index a3cacd9..f4e5288 100644 --- a/src/config/axios/service.ts +++ b/src/config/axios/service.ts @@ -1,4 +1,10 @@ -import axios, { AxiosInstance, AxiosRequestConfig, AxiosResponse, AxiosError } from 'axios' +import axios, { + AxiosInstance, + AxiosRequestConfig, + AxiosRequestHeaders, + AxiosResponse, + AxiosError +} from 'axios' import qs from 'qs' @@ -21,10 +27,12 @@ service.interceptors.request.use( (config: AxiosRequestConfig) => { if ( config.method === 'post' && - (config.headers as any)['Content-Type'] === 'application/x-www-form-urlencoded' + (config.headers as AxiosRequestHeaders)['Content-Type'] === + 'application/x-www-form-urlencoded' ) { config.data = qs.stringify(config.data) } + // ;(config.headers as AxiosRequestHeaders)['Token'] = 'test test' // get参数编码 if (config.method === 'get' && config.params) { let url = config.url as string From d946920e61ed81beacf9f1f8be7ee1f50505f64d Mon Sep 17 00:00:00 2001 From: kailong321200875 <321200875@qq.com> Date: Sat, 8 Oct 2022 13:49:00 +0800 Subject: [PATCH 4/4] fix: The attribute of option does not work --- src/components/Form/src/components/useRenderSelect.tsx | 9 ++++++++- src/views/Components/Form/DefaultForm.vue | 3 ++- 2 files changed, 10 insertions(+), 2 deletions(-) diff --git a/src/components/Form/src/components/useRenderSelect.tsx b/src/components/Form/src/components/useRenderSelect.tsx index 13793f5..43943a4 100644 --- a/src/components/Form/src/components/useRenderSelect.tsx +++ b/src/components/Form/src/components/useRenderSelect.tsx @@ -29,8 +29,15 @@ export const useRenderSelect = (slots: Slots) => { // 如果有别名，就取别名 const labelAlias = item?.componentProps?.optionsAlias?.labelField const valueAlias = item?.componentProps?.optionsAlias?.valueField + + const { label, value, ...other } = option + return ( - + {{ default: () => // option 插槽名规则，{field}-option diff --git a/src/views/Components/Form/DefaultForm.vue b/src/views/Components/Form/DefaultForm.vue index 238dd06..768f810 100644 --- a/src/views/Components/Form/DefaultForm.vue +++ b/src/views/Components/Form/DefaultForm.vue @@ -528,7 +528,8 @@ const schema = reactive([ options: [ { label: 'option1-1', - value: '1-1' + value: '1-1', + disabled: true }, { label: 'option1-2',