merge

CHANGELOG.md

@@ -2,6 +2,26 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+## [1.6.6](https://github.com/kailong321200875/vue-element-plus-admin/compare/v1.6.5...v1.6.6) (2022-10-09)
+
+
+### Bug Fixes
+
+* table search params ([a62929a](https://github.com/kailong321200875/vue-element-plus-admin/commit/a62929a8dac21028d3dd1cddf98189492c33b093))
+
+## [1.6.5](https://github.com/kailong321200875/vue-element-plus-admin/compare/v1.6.4...v1.6.5) (2022-10-08)
+
+
+### Bug Fixes
+
+* The attribute of option does not work ([d946920](https://github.com/kailong321200875/vue-element-plus-admin/commit/d946920e61ed81beacf9f1f8be7ee1f50505f64d))
+
+
+### Performance Improvements
+
+* perf store ([d416178](https://github.com/kailong321200875/vue-element-plus-admin/commit/d416178d69ca6100be4b635922b1a22d27629f08))
+* token test ([b320e65](https://github.com/kailong321200875/vue-element-plus-admin/commit/b320e658d1a559a6eaebdf374d63649c223c2ecd))
+
 ## [1.6.4](https://github.com/kailong321200875/vue-element-plus-admin/compare/v1.6.3...v1.6.4) (2022-09-21)
 
 

README.md

@@ -215,6 +215,13 @@ Support modern browsers, not IE
         </a>
     </td></tr>
 <tr>
+    <td align="center">
+        <a href="https://github.com/hongxinzz">
+            <img src="https://avatars.githubusercontent.com/u/31195324?v=4" width="100;" alt="hongxinzz"/>
+            <br />
+            <sub><b>Hongxinzz</b></sub>
+        </a>
+    </td>
     <td align="center">
         <a href="https://github.com/amifed">
             <img src="https://avatars.githubusercontent.com/u/36906371?v=4" width="100;" alt="amifed"/>

README.zh-CN.md

@@ -215,6 +215,13 @@ pnpm run build:pro
         </a>
     </td></tr>
 <tr>
+    <td align="center">
+        <a href="https://github.com/hongxinzz">
+            <img src="https://avatars.githubusercontent.com/u/31195324?v=4" width="100;" alt="hongxinzz"/>
+            <br />
+            <sub><b>Hongxinzz</b></sub>
+        </a>
+    </td>
     <td align="center">
         <a href="https://github.com/amifed">
             <img src="https://avatars.githubusercontent.com/u/36906371?v=4" width="100;" alt="amifed"/>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-element-plus-admin",
-  "version": "1.6.4",
+  "version": "1.6.6",
   "description": "一套基于vue3、element-plus、typesScript、vite3的后台集成方案。",
   "author": "Archer <502431556@qq.com>",
   "private": false,
@@ -27,13 +27,13 @@
   },
   "dependencies": {
     "@iconify/iconify": "^3.0.0",
-    "@vueuse/core": "^9.2.0",
+    "@vueuse/core": "^9.3.0",
-    "@wangeditor/editor": "^5.1.18",
+    "@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",
+    "@iconify/json": "^2.1.115",
-    "@intlify/vite-plugin-vue-i18n": "^6.0.1",
+    "@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/eslint-plugin": "^5.38.1",
-    "@typescript-eslint/parser": "^5.38.0",
+    "@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",
+    "rollup": "^2.79.1",
-    "stylelint": "^14.12.0",
+    "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",

src/components/Form/src/components/useRenderSelect.tsx

@@ -31,8 +31,15 @@ export const useRenderSelect = (slots: Slots) => {
     // 如果有别名，就取别名
     const labelAlias = item?.componentProps?.optionsAlias?.labelField
     const valueAlias = item?.componentProps?.optionsAlias?.valueField
+
+    const { label, value, ...other } = option
+
     return (
-      <ElOption label={option[labelAlias || 'label']} value={option[valueAlias || 'value']}>
+      <ElOption
+        label={labelAlias ? option[labelAlias] : label}
+        value={valueAlias ? option[valueAlias] : value}
+        {...other}
+      >
         {{
           default: () =>
             // option 插槽名规则，{field}-option

src/config/app.ts

@@ -1,107 +0,0 @@
-import { useCache } from '@/hooks/web/useCache'
-import { ElementPlusSize } from '@/types/elementPlus'
-
-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: ElementPlusSize
-  sizeMap: ElementPlusSize[]
-  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'
-  }
-}

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

src/config/locale.ts

@@ -1,33 +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'
-import { LocaleDropdownType } from '@/types/localeDropdown'
-
-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'
-    }
-  ]
-}

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)

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<Element>) => {
   app.use(store)
 }

src/store/modules/app.ts

@@ -1,19 +1,116 @@
 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 { ElementPlusSize } from '@/types/elementPlus'
+import { useCache } from '@/hooks/web/useCache'
 
 const { wsCache } = useCache()
 
-export const useAppStore = defineStore({
+type LayoutType = 'classic' | 'topLeft' | 'top' | 'cutMenu'
-  id: 'app',
+
-  state: (): AppState => appModules,
+type ThemeTypes = {
-  persist: {
+  elColorPrimary?: string
-    enabled: true
+  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 {

src/store/modules/dict.ts

@@ -6,15 +6,11 @@ export interface DictState {
   dictObj: Recordable
 }
 
-export const useDictStore = defineStore({
+export const useDictStore = defineStore('dict', {
-  id: 'dict',
   state: (): DictState => ({
     isSetDict: false,
     dictObj: {}
   }),
-  persist: {
-    enabled: true
-  },
   getters: {
     getDictObj(): Recordable {
       return this.dictObj

src/store/modules/locale.ts

@@ -1,17 +1,40 @@
 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'
 import { LocaleDropdownType } from '@/types/localeDropdown'
 
 const { wsCache } = useCache()
 
-export const useLocaleStore = defineStore({
+const elLocaleMap = {
-  id: 'locales',
+  'zh-CN': zhCn,
-  state: (): LocaleState => localeModules,
+  en: en
-  persist: {
+}
-    enabled: true
+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 {

src/store/modules/permission.ts

@@ -11,17 +11,13 @@ export interface PermissionState {
   menuTabRouters: AppRouteRecordRaw[]
 }
 
-export const usePermissionStore = defineStore({
+export const usePermissionStore = defineStore('permission', {
-  id: 'permission',
   state: (): PermissionState => ({
     routers: [],
     addRouters: [],
     isAddRouters: false,
     menuTabRouters: []
   }),
-  persist: {
-    enabled: true
-  },
   getters: {
     getRouters(): AppRouteRecordRaw[] {
       return this.routers

src/store/modules/tagsView.ts

@@ -10,8 +10,7 @@ export interface TagsViewState {
   cachedViews: Set<string>
 }
 
-export const useTagsViewStore = defineStore({
+export const useTagsViewStore = defineStore('tagsView', {
-  id: 'tagsView',
   state: (): TagsViewState => ({
     visitedViews: [],
     cachedViews: new Set()

src/views/Components/Form/DefaultForm.vue

@@ -530,7 +530,8 @@ const schema = reactive<FormSchema[]>([
           options: [
             {
               label: 'option1-1',
-              value: '1-1'
+              value: '1-1',
+              disabled: true
             },
             {
               label: 'option1-2',