diff --git a/package.json b/package.json index f8e1c35..c40774c 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,10 @@ "mockjs": "^1.1.0", "nprogress": "^0.2.0", "pinia": "^2.0.22", - "pinia-plugin-persist": "^1.0.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 +54,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 +82,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/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/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/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 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..c2ba4b2 100644 --- a/src/main.ts +++ b/src/main.ts @@ -33,6 +33,7 @@ import { createApp } from 'vue' import App from './App.vue' import './permission' + // 创建实例 const setupAll = async () => { const app = createApp(App) diff --git a/src/store/index.ts b/src/store/index.ts index 4038068..65964ea 100644 --- a/src/store/index.ts +++ b/src/store/index.ts @@ -1,11 +1,8 @@ import type { App } from 'vue' import { createPinia } from 'pinia' -import piniaPluginPersist from 'pinia-plugin-persist' const store = createPinia() -store.use(piniaPluginPersist) - export const setupStore = (app: App) => { app.use(store) } diff --git a/src/store/modules/app.ts b/src/store/modules/app.ts index beb6884..25e7181 100644 --- a/src/store/modules/app.ts +++ b/src/store/modules/app.ts @@ -1,18 +1,115 @@ 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' +import { useCache } from '@/hooks/web/useCache' const { wsCache } = useCache() -export const useAppStore = defineStore({ - id: 'app', - state: (): AppState => appModules, - persist: { - enabled: true +type LayoutType = 'classic' | 'topLeft' | 'top' | 'cutMenu' + +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: 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' + } + } }, getters: { getBreadcrumb(): boolean { diff --git a/src/store/modules/dict.ts b/src/store/modules/dict.ts index 446b925..93dd46e 100644 --- a/src/store/modules/dict.ts +++ b/src/store/modules/dict.ts @@ -6,15 +6,11 @@ export interface DictState { dictObj: Recordable } -export const useDictStore = defineStore({ - id: 'dict', +export const useDictStore = defineStore('dict', { state: (): DictState => ({ isSetDict: false, dictObj: {} }), - persist: { - enabled: true - }, getters: { getDictObj(): Recordable { return this.dictObj diff --git a/src/store/modules/locale.ts b/src/store/modules/locale.ts index 4b7d064..90a0d55 100644 --- a/src/store/modules/locale.ts +++ b/src/store/modules/locale.ts @@ -1,16 +1,39 @@ 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' -import { localeModules, elLocaleMap } from '@/config/locale' -import type { LocaleState } from '@/config/locale' const { wsCache } = useCache() -export const useLocaleStore = defineStore({ - id: 'locales', - state: (): LocaleState => localeModules, - persist: { - enabled: true +const elLocaleMap = { + 'zh-CN': zhCn, + en: en +} +interface LocaleState { + currentLocale: LocaleDropdownType + localeMap: LocaleDropdownType[] +} + +export const useLocaleStore = defineStore('locales', { + state: (): LocaleState => { + return { + currentLocale: { + lang: wsCache.get('lang') || 'zh-CN', + elLocale: elLocaleMap[wsCache.get('lang') || 'zh-CN'] + }, + // 多语言 + localeMap: [ + { + lang: 'zh-CN', + name: '简体中文' + }, + { + lang: 'en', + name: 'English' + } + ] + } }, getters: { getCurrentLocale(): LocaleDropdownType { diff --git a/src/store/modules/permission.ts b/src/store/modules/permission.ts index 22ca1a5..63eb0da 100644 --- a/src/store/modules/permission.ts +++ b/src/store/modules/permission.ts @@ -11,17 +11,13 @@ 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 - }, 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() 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',