From f106305bb99173663cab7f8266da2f041d7738ad Mon Sep 17 00:00:00 2001
From: yangzhiwen <1163139003@qq.com>
Date: Sat, 16 Dec 2023 21:17:20 +0800
Subject: [PATCH] =?UTF-8?q?build:=20:package:=20=E6=8C=89=E9=9C=80?=
 =?UTF-8?q?=E5=8A=A0=E8=BD=BDecharts=E3=80=81=E4=BB=A3=E7=A0=81=E9=87=8D?=
 =?UTF-8?q?=E6=96=B0=E6=A0=BC=E5=BC=8F=E5=8C=96=E5=A4=84=E7=90=86=E3=80=81?=
 =?UTF-8?q?=E6=89=93=E5=8C=85=E6=97=B6=E5=88=86=E5=9D=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env.development                              |    2 +-
 .eslintrc.cjs                                 |  120 +-
 .prettierrc.cjs                               |   30 +-
 .stylelintrc.cjs                              |   48 +-
 .vscode/settings.json                         |    8 +-
 commitlint.config.cjs                         |   86 +-
 index.html                                    |   20 +-
 mock/article.ts                               |  154 +-
 mock/dept.ts                                  |   30 +-
 mock/dict.ts                                  |   40 +-
 mock/role.ts                                  |  138 +-
 mock/router.ts                                |  532 ++--
 mock/user.ts                                  |  214 +-
 package.json                                  |   10 +-
 src/App.vue                                   |    4 +-
 src/api/article.ts                            |  104 +-
 src/api/auth/index.ts                         |   38 +-
 src/api/auth/types.ts                         |   20 +-
 src/api/dept/index.ts                         |   48 +-
 src/api/dept/types.ts                         |   30 +-
 src/api/dict/index.ts                         |   86 +-
 src/api/dict/types.ts                         |   52 +-
 src/api/file/index.ts                         |   28 +-
 src/api/file/types.ts                         |    4 +-
 src/api/menu/index.ts                         |   54 +-
 src/api/menu/types.ts                         |   56 +-
 src/api/role/index.ts                         |   64 +-
 src/api/role/types.ts                         |   30 +-
 src/api/user/index.ts                         |   86 +-
 src/api/user/types.ts                         |   64 +-
 src/components/Breadcrumb/index.vue           |   66 +-
 src/components/Dictionary/index.vue           |   46 +-
 src/components/Hamburger/index.vue            |   10 +-
 src/components/IconSelect/index.vue           |   46 +-
 src/components/LangSelect/index.vue           |   18 +-
 src/components/Pagination/index.vue           |   42 +-
 src/components/RightPanel/index.vue           |   44 +-
 src/components/SizeSelect/index.vue           |   16 +-
 src/components/SvgIcon/index.vue              |   14 +-
 src/components/Upload/MultiUpload.vue         |   66 +-
 src/components/Upload/SingleUpload.vue        |   24 +-
 src/components/WangEditor/index.vue           |   50 +-
 src/directive/index.ts                        |    6 +-
 src/directive/permission/index.ts             |   44 +-
 src/enums/MenuTypeEnum.ts                     |    8 +-
 src/lang/index.ts                             |   26 +-
 src/lang/package/en.ts                        |   24 +-
 src/lang/package/zh-cn.ts                     |   24 +-
 src/layout/components/AppMain.vue             |    4 +-
 src/layout/components/NavBar/NavRight.vue     |   48 +-
 src/layout/components/NavBar/index.vue        |    6 +-
 src/layout/components/Settings/index.vue      |   82 +-
 src/layout/components/Sidebar/Item.vue        |   10 +-
 src/layout/components/Sidebar/LeftMenu.vue    |   40 +-
 src/layout/components/Sidebar/Link.vue        |   28 +-
 src/layout/components/Sidebar/Logo.vue        |   14 +-
 src/layout/components/Sidebar/SidebarItem.vue |   48 +-
 src/layout/components/Sidebar/TopMenu.vue     |   46 +-
 src/layout/components/Sidebar/index.vue       |   34 +-
 src/layout/components/TagsView/ScrollPane.vue |   74 +-
 src/layout/components/TagsView/index.vue      |  242 +-
 src/layout/components/index.ts                |    8 +-
 src/layout/index.vue                          |   74 +-
 src/layout/main.vue                           |   42 +-
 src/main.ts                                   |   30 +-
 src/permission.ts                             |   62 +-
 src/router/index.ts                           |   68 +-
 src/settings.ts                               |   20 +-
 src/store/index.ts                            |   10 +-
 src/store/modules/app.ts                      |   70 +-
 src/store/modules/permission.ts               |   82 +-
 src/store/modules/settings.ts                 |   50 +-
 src/store/modules/tagsView.ts                 |  162 +-
 src/store/modules/user.ts                     |   82 +-
 src/styles/index.scss                         |    8 +-
 src/styles/reset.scss                         |    4 +-
 src/typings/auto-imports.d.ts                 | 2392 ++++++++---------
 src/typings/components.d.ts                   |  208 +-
 src/typings/env.d.ts                          |   16 +-
 src/typings/global.d.ts                       |   60 +-
 src/typings/router.d.ts                       |   18 +-
 src/typings/shims-vue.d.ts                    |    2 +-
 src/utils/_echarts.ts                         |   50 +
 src/utils/i18n.ts                             |   10 +-
 src/utils/index.ts                            |   12 +-
 src/utils/request.ts                          |   56 +-
 src/utils/scroll-to.ts                        |   56 +-
 src/views/dashboard/components/BarChart.vue   |  169 +-
 .../dashboard/components/FunnelChart.vue      |   99 +-
 src/views/dashboard/components/PieChart.vue   |   75 +-
 src/views/dashboard/components/RadarChart.vue |   91 +-
 src/views/dashboard/index.vue                 |   62 +-
 src/views/demo/dict.vue                       |    4 +-
 src/views/demo/icon-selector.vue              |    2 +-
 src/views/demo/icons.vue                      |  104 +-
 .../permission/components/SwitchRoles.vue     |   18 +-
 src/views/demo/permission/page.vue            |   14 +-
 src/views/demo/signature.vue                  |  142 +-
 src/views/demo/table/Export2Excel.js          |  224 +-
 src/views/demo/table/drag-table.vue           |   90 +-
 .../dynamic-table/components/FixedThead.vue   |   36 +-
 .../dynamic-table/components/UnfixedThead.vue |   22 +-
 src/views/demo/table/dynamic-table/index.vue  |   10 +-
 src/views/demo/upload.vue                     |   20 +-
 src/views/demo/wang-editor.vue                |    4 +-
 src/views/demo/websocket.vue                  |  116 +-
 src/views/error-page/401.vue                  |   22 +-
 src/views/error-page/404.vue                  |    6 +-
 src/views/login/index.vue                     |  162 +-
 src/views/redirect/index.vue                  |   12 +-
 src/views/system/dept/index.vue               |  146 +-
 .../system/dict/components/dict-item.vue      |  154 +-
 src/views/system/dict/index.vue               |  150 +-
 src/views/system/menu/index.vue               |  176 +-
 src/views/system/role/index.vue               |  196 +-
 .../system/user/components/dept-tree.vue      |   38 +-
 src/views/system/user/index.vue               |  328 +--
 uno.config.ts                                 |   22 +-
 vite.config.ts                                |  254 +-
 119 files changed, 5039 insertions(+), 5031 deletions(-)
 create mode 100644 src/utils/_echarts.ts

diff --git a/.env.development b/.env.development
index daa0fc6d..f4a99ec2 100644
--- a/.env.development
+++ b/.env.development
@@ -6,7 +6,7 @@ NODE_ENV='development'
 VITE_APP_PORT = 3000
 
 # API请求前缀
-VITE_APP_BASE_API = '/dev-api'
+VITE_APP_BASE_API = '/' # Mock需要去掉/api
 
 # proxy代理配置
 VITE_APP_API_URL = 'http://vapi.youlai.tech' # 线上接口
diff --git a/.eslintrc.cjs b/.eslintrc.cjs
index 8ae169a9..364aafad 100644
--- a/.eslintrc.cjs
+++ b/.eslintrc.cjs
@@ -3,86 +3,86 @@ module.exports = {
   env: {
     browser: true,
     es2021: true,
-    node: true,
+    node: true
   },
-  parser: "vue-eslint-parser",
+  parser: 'vue-eslint-parser',
   extends: [
     // https://eslint.vuejs.org/user-guide/#usage
-    "plugin:vue/vue3-recommended",
-    "./.eslintrc-auto-import.json",
-    "prettier",
-    "plugin:@typescript-eslint/recommended",
-    "plugin:prettier/recommended",
+    'plugin:vue/vue3-recommended',
+    './.eslintrc-auto-import.json',
+    'prettier',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:prettier/recommended'
   ],
   parserOptions: {
-    ecmaVersion: "latest",
-    sourceType: "module",
-    parser: "@typescript-eslint/parser",
-    project: "./tsconfig.*?.json",
+    ecmaVersion: 'latest',
+    sourceType: 'module',
+    parser: '@typescript-eslint/parser',
+    project: './tsconfig.*?.json',
     createDefaultProgram: false,
-    extraFileExtensions: [".vue"],
+    extraFileExtensions: ['.vue']
   },
-  plugins: ["vue", "@typescript-eslint"],
+  plugins: ['vue', '@typescript-eslint'],
   rules: {
     // https://eslint.vuejs.org/rules/#priority-a-essential-error-prevention
-    "vue/multi-word-component-names": "off",
-    "vue/no-v-model-argument": "off",
-    "vue/script-setup-uses-vars": "error",
-    "vue/no-reserved-component-names": "off",
-    "vue/custom-event-name-casing": "off",
-    "vue/attributes-order": "off",
-    "vue/one-component-per-file": "off",
-    "vue/html-closing-bracket-newline": "off",
-    "vue/max-attributes-per-line": "off",
-    "vue/multiline-html-element-content-newline": "off",
-    "vue/singleline-html-element-content-newline": "off",
-    "vue/attribute-hyphenation": "off",
-    "vue/require-default-prop": "off",
-    "vue/require-explicit-emits": "off",
-    "vue/html-self-closing": [
-      "error",
+    'vue/multi-word-component-names': 'off',
+    'vue/no-v-model-argument': 'off',
+    'vue/script-setup-uses-vars': 'error',
+    'vue/no-reserved-component-names': 'off',
+    'vue/custom-event-name-casing': 'off',
+    'vue/attributes-order': 'off',
+    'vue/one-component-per-file': 'off',
+    'vue/html-closing-bracket-newline': 'off',
+    'vue/max-attributes-per-line': 'off',
+    'vue/multiline-html-element-content-newline': 'off',
+    'vue/singleline-html-element-content-newline': 'off',
+    'vue/attribute-hyphenation': 'off',
+    'vue/require-default-prop': 'off',
+    'vue/require-explicit-emits': 'off',
+    'vue/html-self-closing': [
+      'error',
       {
         html: {
-          void: "always",
-          normal: "never",
-          component: "always",
+          void: 'always',
+          normal: 'never',
+          component: 'always'
         },
-        svg: "always",
-        math: "always",
-      },
+        svg: 'always',
+        math: 'always'
+      }
     ],
 
-    "@typescript-eslint/no-empty-function": "off", // 关闭空方法检查
-    "@typescript-eslint/no-explicit-any": "off", // 关闭any类型的警告
-    "@typescript-eslint/no-non-null-assertion": "off",
-    "@typescript-eslint/ban-ts-ignore": "off",
-    "@typescript-eslint/ban-ts-comment": "off",
-    "@typescript-eslint/ban-types": "off",
-    "@typescript-eslint/explicit-function-return-type": "off",
-    "@typescript-eslint/no-explicit-any": "off",
-    "@typescript-eslint/no-var-requires": "off",
-    "@typescript-eslint/no-empty-function": "off",
-    "@typescript-eslint/no-use-before-define": "off",
-    "@typescript-eslint/no-non-null-assertion": "off",
-    "@typescript-eslint/explicit-module-boundary-types": "off",
-    "@typescript-eslint/no-unused-vars": "off",
+    '@typescript-eslint/no-empty-function': 'off', // 关闭空方法检查
+    '@typescript-eslint/no-explicit-any': 'off', // 关闭any类型的警告
+    '@typescript-eslint/no-non-null-assertion': 'off',
+    '@typescript-eslint/ban-ts-ignore': 'off',
+    '@typescript-eslint/ban-ts-comment': 'off',
+    '@typescript-eslint/ban-types': 'off',
+    '@typescript-eslint/explicit-function-return-type': 'off',
+    '@typescript-eslint/no-explicit-any': 'off',
+    '@typescript-eslint/no-var-requires': 'off',
+    '@typescript-eslint/no-empty-function': 'off',
+    '@typescript-eslint/no-use-before-define': 'off',
+    '@typescript-eslint/no-non-null-assertion': 'off',
+    '@typescript-eslint/explicit-module-boundary-types': 'off',
+    '@typescript-eslint/no-unused-vars': 'off',
 
-    "prettier/prettier": [
-      "error",
+    'prettier/prettier': [
+      'error',
       {
-        useTabs: false, // 不使用制表符
-      },
-    ],
+        useTabs: false // 不使用制表符
+      }
+    ]
   },
   // eslint不能对html文件生效
   overrides: [
     {
-      files: ["*.html"],
-      processor: "vue/.vue",
-    },
+      files: ['*.html'],
+      processor: 'vue/.vue'
+    }
   ],
   // https://eslint.org/docs/latest/use/configure/language-options#specifying-globals
   globals: {
-    OptionType: "readonly",
-  },
-};
+    OptionType: 'readonly'
+  }
+}
diff --git a/.prettierrc.cjs b/.prettierrc.cjs
index 347fb32e..e478c663 100644
--- a/.prettierrc.cjs
+++ b/.prettierrc.cjs
@@ -1,14 +1,14 @@
 module.exports = {
   // (x)=>{},单个参数箭头函数是否显示小括号。(always:始终显示;avoid:省略括号。默认:always)
-  arrowParens: "always",
+  arrowParens: 'always',
   // 开始标签的右尖括号是否跟随在最后一行属性末尾，默认false
   bracketSameLine: false,
   // 对象字面量的括号之间打印空格 (true - Example: { foo: bar } ; false - Example: {foo:bar})
   bracketSpacing: true,
   // 是否格式化一些文件中被嵌入的代码片段的风格(auto|off;默认auto)
-  embeddedLanguageFormatting: "auto",
+  embeddedLanguageFormatting: 'auto',
   // 指定 HTML 文件的空格敏感度 (css|strict|ignore;默认css)
-  htmlWhitespaceSensitivity: "css",
+  htmlWhitespaceSensitivity: 'css',
   // 当文件已经被 Prettier 格式化之后，是否会在文件顶部插入一个特殊的 @format 标记，默认false
   insertPragma: false,
   // 在 JSX 中使用单引号替代双引号，默认false
@@ -16,31 +16,31 @@ module.exports = {
   // 每行最多字符数量，超出换行(默认80)
   printWidth: 80,
   // 超出打印宽度 (always | never | preserve )
-  proseWrap: "preserve",
+  proseWrap: 'preserve',
   // 对象属性是否使用引号(as-needed | consistent | preserve;默认as-needed:对象的属性需要加引号才添加;)
-  quoteProps: "as-needed",
+  quoteProps: 'as-needed',
   // 是否只格式化在文件顶部包含特定注释(@prettier| @format)的文件，默认false
   requirePragma: false,
   // 结尾添加分号
-  semi: true,
+  semi: false,
   // 使用单引号 (true:单引号;false:双引号)
-  singleQuote: false,
+  singleQuote: true,
   // 缩进空格数，默认2个空格
   tabWidth: 2,
   // 元素末尾是否加逗号，默认es5: ES5中的 objects, arrays 等会添加逗号，TypeScript 中的 type 后不加逗号
-  trailingComma: "es5",
+  trailingComma: 'none',
   // 指定缩进方式，空格或tab，默认false，即使用空格
   useTabs: false,
   // vue 文件中是否缩进 <style> 和 <script> 标签，默认 false
   vueIndentScriptAndStyle: false,
 
-  endOfLine: "auto",
+  endOfLine: 'auto',
   overrides: [
     {
-      files: "*.html",
+      files: '*.html',
       options: {
-        parser: "html",
-      },
-    },
-  ],
-};
+        parser: 'html'
+      }
+    }
+  ]
+}
diff --git a/.stylelintrc.cjs b/.stylelintrc.cjs
index 06ed90d5..fe218447 100644
--- a/.stylelintrc.cjs
+++ b/.stylelintrc.cjs
@@ -1,43 +1,43 @@
 module.exports = {
   // 继承推荐规范配置
   extends: [
-    "stylelint-config-standard",
-    "stylelint-config-recommended-scss",
-    "stylelint-config-recommended-vue/scss",
-    "stylelint-config-html/vue",
-    "stylelint-config-recess-order",
+    'stylelint-config-standard',
+    'stylelint-config-recommended-scss',
+    'stylelint-config-recommended-vue/scss',
+    'stylelint-config-html/vue',
+    'stylelint-config-recess-order'
   ],
   // 指定不同文件对应的解析器
   overrides: [
     {
-      files: ["**/*.{vue,html}"],
-      customSyntax: "postcss-html",
+      files: ['**/*.{vue,html}'],
+      customSyntax: 'postcss-html'
     },
     {
-      files: ["**/*.{css,scss}"],
-      customSyntax: "postcss-scss",
-    },
+      files: ['**/*.{css,scss}'],
+      customSyntax: 'postcss-scss'
+    }
   ],
   // 自定义规则
   rules: {
-    "import-notation": "string", // 指定导入CSS文件的方式("string"|"url")
-    "selector-class-pattern": null, // 选择器类名命名规则
-    "custom-property-pattern": null, // 自定义属性命名规则
-    "keyframes-name-pattern": null, // 动画帧节点样式命名规则
-    "no-descending-specificity": null, // 允许无降序特异性
+    'import-notation': 'string', // 指定导入CSS文件的方式("string"|"url")
+    'selector-class-pattern': null, // 选择器类名命名规则
+    'custom-property-pattern': null, // 自定义属性命名规则
+    'keyframes-name-pattern': null, // 动画帧节点样式命名规则
+    'no-descending-specificity': null, // 允许无降序特异性
     // 允许 global 、export 、deep伪类
-    "selector-pseudo-class-no-unknown": [
+    'selector-pseudo-class-no-unknown': [
       true,
       {
-        ignorePseudoClasses: ["global", "export", "deep"],
-      },
+        ignorePseudoClasses: ['global', 'export', 'deep']
+      }
     ],
     // 允许未知属性
-    "property-no-unknown": [
+    'property-no-unknown': [
       true,
       {
-        ignoreProperties: ["menuBg", "menuText", "menuActiveText"],
-      },
-    ],
-  },
-};
+        ignoreProperties: ['menuBg', 'menuText', 'menuActiveText']
+      }
+    ]
+  }
+}
diff --git a/.vscode/settings.json b/.vscode/settings.json
index 1e824bfa..415819c6 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -10,10 +10,10 @@
     "strings": true
   },
 	"editor.codeActionsOnSave": {
-	  "source.fixAll": true,
-	  "source.fixAll.eslint": true,
-	  "source.fixAll.stylelint": true
-	},
+    "source.fixAll": "explicit",
+    "source.fixAll.eslint": "explicit",
+    "source.fixAll.stylelint": "explicit"
+  },
   "files.eol": "\n",
   "search.exclude": {
     "**/node_modules": true,
diff --git a/commitlint.config.cjs b/commitlint.config.cjs
index c07a6318..1f2220e5 100644
--- a/commitlint.config.cjs
+++ b/commitlint.config.cjs
@@ -1,45 +1,45 @@
 module.exports = {
   // 继承的规则
-  extends: ["@commitlint/config-conventional"],
+  extends: ['@commitlint/config-conventional'],
   // 自定义规则
   rules: {
     // @see https://commitlint.js.org/#/reference-rules
 
     // 提交类型枚举，git提交type必须是以下类型
-    "type-enum": [
+    'type-enum': [
       2,
-      "always",
+      'always',
       [
-        "feat", // 新增功能
-        "fix", // 修复缺陷
-        "docs", // 文档变更
-        "style", // 代码格式（不影响功能，例如空格、分号等格式修正）
-        "refactor", // 代码重构（不包括 bug 修复、功能新增）
-        "perf", // 性能优化
-        "test", // 添加疏漏测试或已有测试改动
-        "build", // 构建流程、外部依赖变更（如升级 npm 包、修改 webpack 配置等）
-        "ci", // 修改 CI 配置、脚本
-        "revert", // 回滚 commit
-        "chore", // 对构建过程或辅助工具和库的更改（不影响源文件、测试用例）
-      ],
+        'feat', // 新增功能
+        'fix', // 修复缺陷
+        'docs', // 文档变更
+        'style', // 代码格式（不影响功能，例如空格、分号等格式修正）
+        'refactor', // 代码重构（不包括 bug 修复、功能新增）
+        'perf', // 性能优化
+        'test', // 添加疏漏测试或已有测试改动
+        'build', // 构建流程、外部依赖变更（如升级 npm 包、修改 webpack 配置等）
+        'ci', // 修改 CI 配置、脚本
+        'revert', // 回滚 commit
+        'chore' // 对构建过程或辅助工具和库的更改（不影响源文件、测试用例）
+      ]
     ],
-    "subject-case": [0], // subject大小写不做校验
+    'subject-case': [0] // subject大小写不做校验
   },
 
   prompt: {
     messages: {
-      type: "选择你要提交的类型 :",
-      scope: "选择一个提交范围（可选）:",
-      customScope: "请输入自定义的提交范围 :",
-      subject: "填写简短精炼的变更描述 :\n",
+      type: '选择你要提交的类型 :',
+      scope: '选择一个提交范围（可选）:',
+      customScope: '请输入自定义的提交范围 :',
+      subject: '填写简短精炼的变更描述 :\n',
       body: '填写更加详细的变更描述（可选）。使用 "|" 换行 :\n',
       breaking: '列举非兼容性重大的变更（可选）。使用 "|" 换行 :\n',
-      footerPrefixesSelect: "选择关联issue前缀（可选）:",
-      customFooterPrefix: "输入自定义issue前缀 :",
-      footer: "列举关联issue (可选) 例如: #31, #I3244 :\n",
-      generatingByAI: "正在通过 AI 生成你的提交简短描述...",
-      generatedSelectByAI: "选择一个 AI 生成的简短描述:",
-      confirmCommit: "是否提交或修改commit ?",
+      footerPrefixesSelect: '选择关联issue前缀（可选）:',
+      customFooterPrefix: '输入自定义issue前缀 :',
+      footer: '列举关联issue (可选) 例如: #31, #I3244 :\n',
+      generatingByAI: '正在通过 AI 生成你的提交简短描述...',
+      generatedSelectByAI: '选择一个 AI 生成的简短描述:',
+      confirmCommit: '是否提交或修改commit ?'
     },
     // prettier-ignore
     types: [
@@ -56,28 +56,28 @@ module.exports = {
       { value: "chore",    name: "其他:     🛠️  对构建过程或辅助工具和库的更改（不影响源文件、测试用例）", emoji: ":hammer:"},
     ],
     useEmoji: true,
-    emojiAlign: "center",
+    emojiAlign: 'center',
     useAI: false,
     aiNumber: 1,
-    themeColorCode: "",
+    themeColorCode: '',
     scopes: [],
     allowCustomScopes: true,
     allowEmptyScopes: true,
-    customScopesAlign: "bottom",
-    customScopesAlias: "custom",
-    emptyScopesAlias: "empty",
+    customScopesAlign: 'bottom',
+    customScopesAlias: 'custom',
+    emptyScopesAlias: 'empty',
     upperCaseSubject: false,
     markBreakingChangeMode: false,
-    allowBreakingChanges: ["feat", "fix"],
+    allowBreakingChanges: ['feat', 'fix'],
     breaklineNumber: 100,
-    breaklineChar: "|",
+    breaklineChar: '|',
     skipQuestions: [],
     issuePrefixes: [
-      { value: "closed", name: "closed:   ISSUES has been processed" },
+      { value: 'closed', name: 'closed:   ISSUES has been processed' }
     ],
-    customIssuePrefixAlign: "top",
-    emptyIssuePrefixAlias: "skip",
-    customIssuePrefixAlias: "custom",
+    customIssuePrefixAlign: 'top',
+    emptyIssuePrefixAlias: 'skip',
+    customIssuePrefixAlias: 'custom',
     allowCustomIssuePrefix: true,
     allowEmptyIssuePrefix: true,
     confirmColorize: true,
@@ -85,9 +85,9 @@ module.exports = {
     maxSubjectLength: Infinity,
     minSubjectLength: 0,
     scopeOverrides: undefined,
-    defaultBody: "",
-    defaultIssues: "",
-    defaultScope: "",
-    defaultSubject: "",
-  },
-};
+    defaultBody: '',
+    defaultIssues: '',
+    defaultScope: '',
+    defaultSubject: ''
+  }
+}
diff --git a/index.html b/index.html
index 3dcc439a..1fd8b3a5 100644
--- a/index.html
+++ b/index.html
@@ -28,7 +28,7 @@
     </div>
     <script type="module" src="/src/main.ts"></script>
     <script>
-      global = globalThis;
+      global = globalThis
     </script>
 
     <style>
@@ -62,7 +62,6 @@
 
       .mesh-loader > div .circle:last-child {
         animation-delay: 0s;
-        animation-delay: 0s;
       }
 
       .mesh-loader > div {
@@ -73,65 +72,48 @@
 
       .mesh-loader > div:last-child {
         transform: rotate(90deg);
-        transform: rotate(90deg);
       }
 
       @keyframes mesh {
         0% {
-          transform: rotate(0);
           transform: rotate(0);
           transform-origin: 50% -100%;
-          transform-origin: 50% -100%;
         }
 
         50% {
-          transform: rotate(360deg);
           transform: rotate(360deg);
           transform-origin: 50% -100%;
-          transform-origin: 50% -100%;
         }
 
         50.00001% {
-          transform: rotate(0deg);
           transform: rotate(0deg);
           transform-origin: 50% 200%;
-          transform-origin: 50% 200%;
         }
 
         100% {
-          transform: rotate(360deg);
           transform: rotate(360deg);
           transform-origin: 50% 200%;
-          transform-origin: 50% 200%;
         }
       }
 
       @keyframes mesh {
         0% {
           transform: rotate(0);
-          transform: rotate(0);
-          transform-origin: 50% -100%;
           transform-origin: 50% -100%;
         }
 
         50% {
           transform: rotate(360deg);
-          transform: rotate(360deg);
-          transform-origin: 50% -100%;
           transform-origin: 50% -100%;
         }
 
         50.00001% {
           transform: rotate(0deg);
-          transform: rotate(0deg);
-          transform-origin: 50% 200%;
           transform-origin: 50% 200%;
         }
 
         100% {
           transform: rotate(360deg);
-          transform: rotate(360deg);
-          transform-origin: 50% 200%;
           transform-origin: 50% 200%;
         }
       }
diff --git a/mock/article.ts b/mock/article.ts
index 8563e6ed..849e51ef 100644
--- a/mock/article.ts
+++ b/mock/article.ts
@@ -1,7 +1,7 @@
-import { MockMethod } from "vite-plugin-mock";
+import { MockMethod } from 'vite-plugin-mock'
 
-const article_list: any = [];
-const count = 100;
+const article_list: any = []
+const count = 100
 
 for (let i = 0; i < count; i++) {
   article_list.push({
@@ -11,123 +11,123 @@ for (let i = 0; i < count; i++) {
     reviewer: `reviewer ${i}`,
     title: `Title ${i}`,
     importance: Math.floor(Math.random() * 3) + 1,
-    type: ["CN", "US", "JP", "EU"][Math.floor(Math.random() * 4)],
-    status: ["published", "draft"][Math.floor(Math.random() * 2)],
+    type: ['CN', 'US', 'JP', 'EU'][Math.floor(Math.random() * 4)],
+    status: ['published', 'draft'][Math.floor(Math.random() * 2)],
     display_time: new Date().toISOString(),
     pageviews: Math.floor(Math.random() * (5000 - 300)) + 300,
-    remark: `remark ${i}`,
-  });
+    remark: `remark ${i}`
+  })
 }
 
 export default [
   {
-    url: "/api/v1/article/list",
+    url: '/api/v1/article/list',
     timeout: 200,
-    method: "get",
+    method: 'get',
     response: ({ query }) => {
-      const { importance, type, title, page = 1, limit = 10, sort } = query;
+      const { importance, type, title, page = 1, limit = 10, sort } = query
       let mock_list = article_list.filter((item: any) => {
-        if (importance && item.importance !== +importance) return false;
-        if (type && item.type !== type) return false;
-        if (title && item.title.indexOf(title) < 0) return false;
-        if (item.status === "deleted") return false;
-        return true;
-      });
-      if (sort === "-id") {
-        mock_list = mock_list.reverse();
+        if (importance && item.importance !== +importance) return false
+        if (type && item.type !== type) return false
+        if (title && item.title.indexOf(title) < 0) return false
+        if (item.status === 'deleted') return false
+        return true
+      })
+      if (sort === '-id') {
+        mock_list = mock_list.reverse()
       }
       const page_list = mock_list.filter(
         (item: any, index: number) =>
           index < limit * page && index >= limit * (page - 1)
-      );
+      )
 
       return {
-        code: "00000",
+        code: '00000',
         data: { total: mock_list.length, page: page, items: page_list },
-        msg: "一切ok",
-      };
-    },
+        msg: '一切ok'
+      }
+    }
   },
   {
-    url: "/api/v1/article/detail",
+    url: '/api/v1/article/detail',
     timeout: 200,
-    method: "get",
+    method: 'get',
     response: ({ query }) => {
-      const { id } = query;
+      const { id } = query
       for (const article of article_list) {
         if (article.id === +id) {
           return {
-            code: "00000",
+            code: '00000',
             data: article,
-            msg: "一切ok",
-          };
+            msg: '一切ok'
+          }
         }
       }
-    },
+    }
   },
   {
-    url: "/api/v1/article/pv",
+    url: '/api/v1/article/pv',
     timeout: 200,
-    method: "get",
+    method: 'get',
     response: ({ query }) => {
-      const { id } = query;
+      const { id } = query
       for (const article of article_list) {
         if (article.id === +id) {
           return {
-            code: "00000",
+            code: '00000',
             data: {
               pv: article.pageviews,
               pvData: [
-                { key: "PC", pv: 1024 },
-                { key: "mobile", pv: 1024 },
-                { key: "ios", pv: 1024 },
-                { key: "android", pv: 1024 },
-              ],
+                { key: 'PC', pv: 1024 },
+                { key: 'mobile', pv: 1024 },
+                { key: 'ios', pv: 1024 },
+                { key: 'android', pv: 1024 }
+              ]
             },
-            msg: "一切ok",
-          };
+            msg: '一切ok'
+          }
         }
       }
-    },
+    }
   },
   {
-    url: "/api/v1/article/update",
+    url: '/api/v1/article/update',
     timeout: 200,
-    method: "post",
+    method: 'post',
     response: ({ body }) => {
-      const { id, ...updatedFields } = body;
+      const { id, ...updatedFields } = body
       // 查找要更新的文章
       const articleToUpdate = article_list.find(
         (article: any) => article.id === id
-      );
+      )
 
       // 如果找到了要更新的文章
       if (articleToUpdate) {
         // 使用 Object.assign 方法更新文章
-        Object.assign(articleToUpdate, updatedFields);
+        Object.assign(articleToUpdate, updatedFields)
         return {
-          code: "00000",
+          code: '00000',
           data: {
-            article: articleToUpdate,
+            article: articleToUpdate
           },
-          msg: "一切ok",
-        };
+          msg: '一切ok'
+        }
       } else {
-        console.error(`Article with id ${id} not found.`);
+        console.error(`Article with id ${id} not found.`)
       }
-    },
+    }
   },
   {
-    url: "/api/v1/article/create",
+    url: '/api/v1/article/create',
     timeout: 200,
-    method: "post",
+    method: 'post',
     response: ({ body }) => {
       const { title, author, importance, type, status, remark, timestamp } =
-        body;
+        body
       // article_list最大的id值;
       const maxId = article_list.reduce((maxId: number, article: any) => {
-        return Math.max(maxId, article.id);
-      }, -1);
+        return Math.max(maxId, article.id)
+      }, -1)
       const article = {
         id: maxId + 1,
         timestamp,
@@ -139,30 +139,30 @@ export default [
         status,
         display_time: new Date(timestamp).toISOString(),
         pageviews: Math.floor(Math.random() * (5000 - 300)) + 300,
-        remark,
-      };
-      article_list.push(article);
+        remark
+      }
+      article_list.push(article)
       return {
-        code: "00000",
+        code: '00000',
         data: {
-          article,
+          article
         },
-        msg: "一切ok",
-      };
-    },
+        msg: '一切ok'
+      }
+    }
   },
   {
-    url: "/api/v1/article/delete",
+    url: '/api/v1/article/delete',
     timeout: 200,
-    method: "post",
+    method: 'post',
     response: ({ body }) => {
-      const { id } = body;
-      const index = article_list.findIndex((article: any) => article.id === id);
-      article_list.splice(index, 1);
+      const { id } = body
+      const index = article_list.findIndex((article: any) => article.id === id)
+      article_list.splice(index, 1)
       return {
-        code: "00000",
-        msg: "一切ok",
-      };
-    },
-  },
-] as MockMethod[];
+        code: '00000',
+        msg: '一切ok'
+      }
+    }
+  }
+] as MockMethod[]
diff --git a/mock/dept.ts b/mock/dept.ts
index 91746f4f..e5fd5fbc 100644
--- a/mock/dept.ts
+++ b/mock/dept.ts
@@ -1,30 +1,30 @@
-import { MockMethod } from "vite-plugin-mock";
+import { MockMethod } from 'vite-plugin-mock'
 
 export default [
   {
-    url: "/api/v1/dept/options",
-    method: "get",
+    url: '/api/v1/dept/options',
+    method: 'get',
     response: () => {
       return {
-        code: "00000",
+        code: '00000',
         data: [
           {
             value: 1,
-            label: "有来技术",
+            label: '有来技术',
             children: [
               {
                 value: 2,
-                label: "研发部门",
+                label: '研发部门'
               },
               {
                 value: 3,
-                label: "测试部门",
-              },
-            ],
-          },
+                label: '测试部门'
+              }
+            ]
+          }
         ],
-        msg: "一切ok",
-      };
-    },
-  },
-] as MockMethod[];
+        msg: '一切ok'
+      }
+    }
+  }
+] as MockMethod[]
diff --git a/mock/dict.ts b/mock/dict.ts
index 4ee38c38..247f0e30 100644
--- a/mock/dict.ts
+++ b/mock/dict.ts
@@ -1,36 +1,36 @@
-import { MockMethod } from "vite-plugin-mock";
+import { MockMethod } from 'vite-plugin-mock'
 
 export default [
   {
-    url: "/api/v1/dict/:code/options",
-    method: "get",
+    url: '/api/v1/dict/:code/options',
+    method: 'get',
     response: ({ url }) => {
-      const typeCode = url.match(/\/api\/v1\/dict\/(\w+)\/options/)[1];
+      const typeCode = url.match(/\/api\/v1\/dict\/(\w+)\/options/)[1]
 
-      let list = null;
+      let list = null
 
-      if (typeCode == "gender") {
+      if (typeCode == 'gender') {
         list = [
           {
-            value: "1",
-            label: "男",
+            value: '1',
+            label: '男'
           },
           {
-            value: "2",
-            label: "女",
+            value: '2',
+            label: '女'
           },
           {
-            value: "0",
-            label: "未知",
-          },
-        ];
+            value: '0',
+            label: '未知'
+          }
+        ]
       }
 
       return {
-        code: "00000",
+        code: '00000',
         data: list,
-        msg: "一切ok",
-      };
-    },
-  },
-] as MockMethod[];
+        msg: '一切ok'
+      }
+    }
+  }
+] as MockMethod[]
diff --git a/mock/role.ts b/mock/role.ts
index 6c3419f6..11f237d2 100644
--- a/mock/role.ts
+++ b/mock/role.ts
@@ -1,165 +1,165 @@
-import { MockMethod } from "vite-plugin-mock";
+import { MockMethod } from 'vite-plugin-mock'
 
 export default [
   {
-    url: "/api/v1/roles/options",
-    method: "get",
+    url: '/api/v1/roles/options',
+    method: 'get',
     response: () => {
       return {
-        code: "00000",
+        code: '00000',
         data: [
           {
             value: 2,
-            label: "系统管理员",
+            label: '系统管理员'
           },
           {
             value: 4,
-            label: "系统管理员1",
+            label: '系统管理员1'
           },
           {
             value: 5,
-            label: "系统管理员2",
+            label: '系统管理员2'
           },
           {
             value: 6,
-            label: "系统管理员3",
+            label: '系统管理员3'
           },
           {
             value: 7,
-            label: "系统管理员4",
+            label: '系统管理员4'
           },
           {
             value: 8,
-            label: "系统管理员5",
+            label: '系统管理员5'
           },
           {
             value: 9,
-            label: "系统管理员6",
+            label: '系统管理员6'
           },
           {
             value: 10,
-            label: "系统管理员7",
+            label: '系统管理员7'
           },
           {
             value: 11,
-            label: "系统管理员8",
+            label: '系统管理员8'
           },
           {
             value: 12,
-            label: "系统管理员9",
+            label: '系统管理员9'
           },
           {
             value: 3,
-            label: "访问游客",
-          },
+            label: '访问游客'
+          }
         ],
-        msg: "一切ok",
-      };
-    },
+        msg: '一切ok'
+      }
+    }
   },
   {
-    url: "/api/v1/roles/page",
-    method: "get",
+    url: '/api/v1/roles/page',
+    method: 'get',
     response: () => {
       return {
-        code: "00000",
+        code: '00000',
         data: {
           list: [
             {
               id: 2,
-              name: "系统管理员",
-              code: "ADMIN",
+              name: '系统管理员',
+              code: 'ADMIN',
               status: 1,
               sort: 2,
-              createTime: "2021-03-25 12:39:54",
-              updateTime: null,
+              createTime: '2021-03-25 12:39:54',
+              updateTime: null
             },
             {
               id: 3,
-              name: "访问游客",
-              code: "GUEST",
+              name: '访问游客',
+              code: 'GUEST',
               status: 1,
               sort: 3,
-              createTime: "2021-05-26 15:49:05",
-              updateTime: "2019-05-05 16:00:00",
+              createTime: '2021-05-26 15:49:05',
+              updateTime: '2019-05-05 16:00:00'
             },
             {
               id: 4,
-              name: "系统管理员1",
-              code: "ADMIN1",
+              name: '系统管理员1',
+              code: 'ADMIN1',
               status: 1,
               sort: 2,
-              createTime: "2021-03-25 12:39:54",
-              updateTime: null,
+              createTime: '2021-03-25 12:39:54',
+              updateTime: null
             },
             {
               id: 5,
-              name: "系统管理员2",
-              code: "ADMIN1",
+              name: '系统管理员2',
+              code: 'ADMIN1',
               status: 1,
               sort: 2,
-              createTime: "2021-03-25 12:39:54",
-              updateTime: null,
+              createTime: '2021-03-25 12:39:54',
+              updateTime: null
             },
             {
               id: 6,
-              name: "系统管理员3",
-              code: "ADMIN1",
+              name: '系统管理员3',
+              code: 'ADMIN1',
               status: 1,
               sort: 2,
-              createTime: "2021-03-25 12:39:54",
-              updateTime: null,
+              createTime: '2021-03-25 12:39:54',
+              updateTime: null
             },
             {
               id: 7,
-              name: "系统管理员4",
-              code: "ADMIN1",
+              name: '系统管理员4',
+              code: 'ADMIN1',
               status: 1,
               sort: 2,
-              createTime: "2021-03-25 12:39:54",
-              updateTime: null,
+              createTime: '2021-03-25 12:39:54',
+              updateTime: null
             },
             {
               id: 8,
-              name: "系统管理员5",
-              code: "ADMIN1",
+              name: '系统管理员5',
+              code: 'ADMIN1',
               status: 1,
               sort: 2,
-              createTime: "2021-03-25 12:39:54",
-              updateTime: null,
+              createTime: '2021-03-25 12:39:54',
+              updateTime: null
             },
             {
               id: 9,
-              name: "系统管理员6",
-              code: "ADMIN1",
+              name: '系统管理员6',
+              code: 'ADMIN1',
               status: 1,
               sort: 2,
-              createTime: "2021-03-25 12:39:54",
-              updateTime: null,
+              createTime: '2021-03-25 12:39:54',
+              updateTime: null
             },
             {
               id: 10,
-              name: "系统管理员7",
-              code: "ADMIN1",
+              name: '系统管理员7',
+              code: 'ADMIN1',
               status: 1,
               sort: 2,
-              createTime: "2021-03-25 12:39:54",
-              updateTime: null,
+              createTime: '2021-03-25 12:39:54',
+              updateTime: null
             },
             {
               id: 11,
-              name: "系统管理员8",
-              code: "ADMIN1",
+              name: '系统管理员8',
+              code: 'ADMIN1',
               status: 1,
               sort: 2,
-              createTime: "2021-03-25 12:39:54",
-              updateTime: null,
-            },
+              createTime: '2021-03-25 12:39:54',
+              updateTime: null
+            }
           ],
-          total: 11,
+          total: 11
         },
-        msg: "一切ok",
-      };
-    },
-  },
-] as MockMethod[];
+        msg: '一切ok'
+      }
+    }
+  }
+] as MockMethod[]
diff --git a/mock/router.ts b/mock/router.ts
index 60375071..dd37b661 100644
--- a/mock/router.ts
+++ b/mock/router.ts
@@ -1,412 +1,412 @@
-import { MockMethod } from "vite-plugin-mock";
-const url = "/api/v1/menus/routes";
-const method = "get";
+import { MockMethod } from 'vite-plugin-mock'
+const url = '/api/v1/menus/routes'
+const method = 'get'
 const data = {
-  code: "00000",
+  code: '00000',
   data: [
     {
-      path: "/system",
-      component: "Layout",
-      redirect: "/system/user",
+      path: '/system',
+      component: 'Layout',
+      redirect: '/system/user',
       meta: {
-        title: "系统管理",
-        icon: "system",
+        title: '系统管理',
+        icon: 'system',
         hidden: false,
-        roles: ["ADMIN"],
-        keepAlive: true,
+        roles: ['ADMIN'],
+        keepAlive: true
       },
       children: [
         {
-          path: "user",
-          component: "system/user/index",
-          name: "User",
+          path: 'user',
+          component: 'system/user/index',
+          name: 'User',
           meta: {
-            title: "用户管理",
-            icon: "user",
+            title: '用户管理',
+            icon: 'user',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
         },
         {
-          path: "role",
-          component: "system/role/index",
-          name: "Role",
+          path: 'role',
+          component: 'system/role/index',
+          name: 'Role',
           meta: {
-            title: "角色管理",
-            icon: "role",
+            title: '角色管理',
+            icon: 'role',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
         },
         {
-          path: "menu",
-          component: "system/menu/index",
-          name: "Menu",
+          path: 'menu',
+          component: 'system/menu/index',
+          name: 'Menu',
           meta: {
-            title: "菜单管理",
-            icon: "menu",
+            title: '菜单管理',
+            icon: 'menu',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
         },
         {
-          path: "dept",
-          component: "system/dept/index",
-          name: "Dept",
+          path: 'dept',
+          component: 'system/dept/index',
+          name: 'Dept',
           meta: {
-            title: "部门管理",
-            icon: "tree",
+            title: '部门管理',
+            icon: 'tree',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
         },
         {
-          path: "dict",
-          component: "system/dict/index",
-          name: "DictType",
+          path: 'dict',
+          component: 'system/dict/index',
+          name: 'DictType',
           meta: {
-            title: "字典管理",
-            icon: "dict",
+            title: '字典管理',
+            icon: 'dict',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
-        },
-      ],
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
+        }
+      ]
     },
 
     {
-      path: "/api",
-      component: "Layout",
+      path: '/api',
+      component: 'Layout',
       meta: {
-        title: "接口",
-        icon: "api",
+        title: '接口',
+        icon: 'api',
         hidden: false,
-        roles: ["ADMIN"],
-        keepAlive: true,
+        roles: ['ADMIN'],
+        keepAlive: true
       },
       children: [
         {
-          path: "apidoc",
-          component: "demo/api-doc",
-          name: "Apidoc",
+          path: 'apidoc',
+          component: 'demo/api-doc',
+          name: 'Apidoc',
           meta: {
-            title: "接口文档",
-            icon: "api",
+            title: '接口文档',
+            icon: 'api',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: false,
-          },
-        },
-      ],
+            roles: ['ADMIN'],
+            keepAlive: false
+          }
+        }
+      ]
     },
     {
-      path: "/external-link",
-      component: "Layout",
-      redirect: "noredirect",
+      path: '/external-link',
+      component: 'Layout',
+      redirect: 'noredirect',
       meta: {
-        title: "外部链接",
-        icon: "link",
+        title: '外部链接',
+        icon: 'link',
         hidden: false,
-        roles: ["ADMIN"],
-        keepAlive: true,
+        roles: ['ADMIN'],
+        keepAlive: true
       },
       children: [
         {
-          path: "https://juejin.cn/post/7228990409909108793",
+          path: 'https://juejin.cn/post/7228990409909108793',
           meta: {
-            title: "document",
-            icon: "document",
+            title: 'document',
+            icon: 'document',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
-        },
-      ],
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
+        }
+      ]
     },
     {
-      path: "/multi-level",
-      component: "Layout",
-      redirect: "/multi-level/multi-level1",
+      path: '/multi-level',
+      component: 'Layout',
+      redirect: '/multi-level/multi-level1',
       meta: {
-        title: "多级菜单",
-        icon: "multi_level",
+        title: '多级菜单',
+        icon: 'multi_level',
         hidden: false,
-        roles: ["ADMIN"],
-        keepAlive: true,
+        roles: ['ADMIN'],
+        keepAlive: true
       },
       children: [
         {
-          path: "multi-level1",
-          component: "demo/multi-level/level1",
-          redirect: "/multi-level/multi-level2",
+          path: 'multi-level1',
+          component: 'demo/multi-level/level1',
+          redirect: '/multi-level/multi-level2',
           meta: {
-            title: "菜单一级",
-            icon: "",
+            title: '菜单一级',
+            icon: '',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
+            roles: ['ADMIN'],
+            keepAlive: true
           },
           children: [
             {
-              path: "multi-level2",
-              component: "demo/multi-level/children/level2",
-              redirect: "/multi-level/multi-level2/multi-level3-1",
+              path: 'multi-level2',
+              component: 'demo/multi-level/children/level2',
+              redirect: '/multi-level/multi-level2/multi-level3-1',
               meta: {
-                title: "菜单二级",
-                icon: "",
+                title: '菜单二级',
+                icon: '',
                 hidden: false,
-                roles: ["ADMIN"],
-                keepAlive: true,
+                roles: ['ADMIN'],
+                keepAlive: true
               },
               children: [
                 {
-                  path: "multi-level3-1",
-                  component: "demo/multi-level/children/children/level3-1",
-                  name: "MultiLevel31",
+                  path: 'multi-level3-1',
+                  component: 'demo/multi-level/children/children/level3-1',
+                  name: 'MultiLevel31',
                   meta: {
-                    title: "菜单三级-1",
-                    icon: "",
+                    title: '菜单三级-1',
+                    icon: '',
                     hidden: false,
-                    roles: ["ADMIN"],
-                    keepAlive: true,
-                  },
+                    roles: ['ADMIN'],
+                    keepAlive: true
+                  }
                 },
                 {
-                  path: "multi-level3-2",
-                  component: "demo/multi-level/children/children/level3-2",
-                  name: "MultiLevel32",
+                  path: 'multi-level3-2',
+                  component: 'demo/multi-level/children/children/level3-2',
+                  name: 'MultiLevel32',
                   meta: {
-                    title: "菜单三级-2",
-                    icon: "",
+                    title: '菜单三级-2',
+                    icon: '',
                     hidden: false,
-                    roles: ["ADMIN"],
-                    keepAlive: true,
-                  },
-                },
-              ],
-            },
-          ],
-        },
-      ],
+                    roles: ['ADMIN'],
+                    keepAlive: true
+                  }
+                }
+              ]
+            }
+          ]
+        }
+      ]
     },
     {
-      path: "/component",
-      component: "Layout",
+      path: '/component',
+      component: 'Layout',
       meta: {
-        title: "组件封装",
-        icon: "menu",
+        title: '组件封装',
+        icon: 'menu',
         hidden: false,
-        roles: ["ADMIN"],
-        keepAlive: true,
+        roles: ['ADMIN'],
+        keepAlive: true
       },
       children: [
         {
-          path: "wang-editor",
-          component: "demo/wang-editor",
-          name: "wang-editor",
+          path: 'wang-editor',
+          component: 'demo/wang-editor',
+          name: 'wang-editor',
           meta: {
-            title: "富文本编辑器",
-            icon: "",
+            title: '富文本编辑器',
+            icon: '',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
         },
         {
-          path: "upload",
-          component: "demo/upload",
-          name: "upload",
+          path: 'upload',
+          component: 'demo/upload',
+          name: 'upload',
           meta: {
-            title: "图片上传",
-            icon: "",
+            title: '图片上传',
+            icon: '',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
         },
         {
-          path: "icon-selector",
-          component: "demo/icon-selector",
-          name: "icon-selector",
+          path: 'icon-selector',
+          component: 'demo/icon-selector',
+          name: 'icon-selector',
           meta: {
-            title: "图标选择器",
-            icon: "",
+            title: '图标选择器',
+            icon: '',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
         },
         {
-          path: "dict-demo",
-          component: "demo/dict",
-          name: "DictDemo",
+          path: 'dict-demo',
+          component: 'demo/dict',
+          name: 'DictDemo',
           meta: {
-            title: "字典组件",
-            icon: "",
+            title: '字典组件',
+            icon: '',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
         },
         {
-          path: "taginput",
-          component: "demo/taginput",
-          name: "taginput",
+          path: 'taginput',
+          component: 'demo/taginput',
+          name: 'taginput',
           meta: {
-            title: "标签输入框",
-            icon: "",
+            title: '标签输入框',
+            icon: '',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
         },
         {
-          path: "signature",
-          component: "demo/signature",
-          name: "signature",
+          path: 'signature',
+          component: 'demo/signature',
+          name: 'signature',
           meta: {
-            title: "签名",
-            icon: "",
+            title: '签名',
+            icon: '',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
         },
         {
-          path: "table",
-          component: "demo/table",
-          name: "Table",
+          path: 'table',
+          component: 'demo/table',
+          name: 'Table',
           meta: {
-            title: "表格",
-            icon: "",
+            title: '表格',
+            icon: '',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
-        },
-      ],
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
+        }
+      ]
     },
     {
-      path: "/table",
-      component: "Layout",
+      path: '/table',
+      component: 'Layout',
       meta: {
-        title: "Table",
-        icon: "table",
+        title: 'Table',
+        icon: 'table',
         hidden: false,
-        roles: ["ADMIN"],
-        keepAlive: true,
+        roles: ['ADMIN'],
+        keepAlive: true
       },
       children: [
         {
-          path: "dynamic-table",
-          component: "demo/table/dynamic-table/index",
-          name: "DynamicTable",
+          path: 'dynamic-table',
+          component: 'demo/table/dynamic-table/index',
+          name: 'DynamicTable',
           meta: {
-            title: "动态Table",
+            title: '动态Table',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
         },
         {
-          path: "drag-table",
-          component: "demo/table/drag-table",
-          name: "DragTable",
+          path: 'drag-table',
+          component: 'demo/table/drag-table',
+          name: 'DragTable',
           meta: {
-            title: "拖拽Table",
+            title: '拖拽Table',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
         },
         {
-          path: "complex-table",
-          component: "demo/table/complex-table",
-          name: "ComplexTable",
+          path: 'complex-table',
+          component: 'demo/table/complex-table',
+          name: 'ComplexTable',
           meta: {
-            title: "综合Table",
+            title: '综合Table',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
-        },
-      ],
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
+        }
+      ]
     },
     {
-      path: "/function",
-      component: "Layout",
+      path: '/function',
+      component: 'Layout',
       meta: {
-        title: "功能演示",
-        icon: "menu",
+        title: '功能演示',
+        icon: 'menu',
         hidden: false,
-        roles: ["ADMIN"],
-        keepAlive: true,
+        roles: ['ADMIN'],
+        keepAlive: true
       },
       children: [
         {
-          path: "permission",
-          component: "demo/permission/page",
-          name: "Permission",
+          path: 'permission',
+          component: 'demo/permission/page',
+          name: 'Permission',
           meta: {
-            title: "Permission",
-            icon: "",
+            title: 'Permission',
+            icon: '',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
         },
         {
-          path: "icon-demo",
-          component: "demo/icons",
-          name: "Icons",
+          path: 'icon-demo',
+          component: 'demo/icons',
+          name: 'Icons',
           meta: {
-            title: "图标",
-            icon: "",
+            title: '图标',
+            icon: '',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
         },
         {
-          path: "websocket",
-          component: "demo/websocket",
-          name: "Websocket",
+          path: 'websocket',
+          component: 'demo/websocket',
+          name: 'Websocket',
           meta: {
-            title: "Websocket",
-            icon: "",
+            title: 'Websocket',
+            icon: '',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
         },
         {
-          path: "other",
-          component: "demo/other",
+          path: 'other',
+          component: 'demo/other',
           meta: {
-            title: "敬请期待...",
-            icon: "",
+            title: '敬请期待...',
+            icon: '',
             hidden: false,
-            roles: ["ADMIN"],
-            keepAlive: true,
-          },
-        },
-      ],
-    },
+            roles: ['ADMIN'],
+            keepAlive: true
+          }
+        }
+      ]
+    }
   ],
-  msg: "一切ok",
-};
+  msg: '一切ok'
+}
 
 export default [
   {
     url: url,
     method: method,
     response: () => {
-      return data;
-    },
-  },
-] as MockMethod[];
+      return data
+    }
+  }
+] as MockMethod[]
diff --git a/mock/user.ts b/mock/user.ts
index 690f8ea7..bbc87423 100644
--- a/mock/user.ts
+++ b/mock/user.ts
@@ -1,182 +1,182 @@
-import { MockMethod } from "vite-plugin-mock";
+import { MockMethod } from 'vite-plugin-mock'
 
 export default [
   {
-    url: "/api/hello_world",
-    method: "get",
+    url: '/api/hello_world',
+    method: 'get',
     response: (request) => {
       return {
-        msg: "hello world",
-        headers: request.headers,
-      };
-    },
+        msg: 'hello world',
+        headers: request.headers
+      }
+    }
   },
   {
-    url: "/api/v1/auth/captcha",
-    method: "get",
+    url: '/api/v1/auth/captcha',
+    method: 'get',
     response: () => {
       return {
-        code: "00000",
+        code: '00000',
         data: {
-          captchaKey: "534b8ef2b0a24121bec76391ddd159f9",
+          captchaKey: '534b8ef2b0a24121bec76391ddd159f9',
           captchaBase64:
-            "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAAAkCAIAAADNSmkJAAAFKUlEQVR4Xu2ZXUwcVRiGV70wMWo08V5NvPXCrDbFaGpMaZW2hqQxaoiJTRsaMBCNSYtpa2JTKiFSelFa+Q/QZcMWqEhBlh+htbEpZhMrBQrlJ0hBywLLyrJ0WZbje3bqOvPNLHPWrDvdOE9ONmfe78zkzMs335wzWJhJQrBQweS/wTQ6QWgYHdoIOcecOe05O+t2WkutO+p2ZF3Ksg/YV9ZW6FATYajR3nveg60H9327r3O8c35lHgp+r05dPdJzBL73TPSQ8SaCKIxGLsPlop+K0JHrEkPuoT31e5qGmmjARACF0agYyGVNlyVm/pzZXrN9fHGcBkz0UBid+31u93i3XFFT80vN8cvHqWqih8Lo1NpUqS5vwh3vnd223VQ10UNh9NbyrcFQUK6oCawHUipSqGqiB83oBf+CXFGDMp1mS6OqiR4Ko7FexkpOrqhpHGw82nOUqiZ6KIzGrkRuorW0dJMmOy+hOCfYGzb2RBFv6HRO0gEJw/U7y+pgL1bwmTxexN6sZ31TdEwEhdG+gA+7EqyXpUO1uZH20cWL8hMTRt1N9tBXzCJrOIRoCPJpSO2RAp4HmtCdIfZ+2JWgEBN9LbR28seTGU0Zue1tMLp+YIAMSADzfvbkKX4/eb28j4YODiGin3heqmIlLja5hAUCu+nmGY3JWKvpMAlqNGgebsauBOvlqSX+JEx7p7EbTLen53XlzfmWUioqXikrc68Y8N2juJ/fyVsNChGHEE//rBANYWaZz+TRQqpLaBgNsPfDrgSpbS21YtV87IdjrlkX9JZbt5DOma2t9ITo5F+5glN22WwL/n+yDv00mw06orKxOqQ5+J04hhViwzAXETIcJDVm8uxZqktoGx2Nj9t43Wgaul/ERQiGQvtbWnDWgZYW9CXlQFjZ/7ciyHNn+Z2MexTimIeLz59TiIln0M1e+IbPpOAaDUnEYPTi6iqKxpbycs/qKo1tCslfKcffPn9enuMiPPY1vxO/ckeFQ4h46cdGqUWoidE/y54q5tPY5WDrGzQqIXot4BgchEE57e00IMCw2/1qZSVO/7SjA78o9INzcxsbrL+fnTnDDh9mmZn8F30oG1Hm+nABv5mQMopDS/h1HxtqTzWbABMe9sxpPoe9zezeOo1GELqWhPS8t46M0IAYHbdvR1aHbaOjbjfLz2eFhez6dba4yAfgF30o0BFVE8+Mjh/wFxPI+I5mAEHU6Ls+38vhTFwOBGhMDF8gkFpbC5ffsdv/uBs6dIj19dExEtARVXv9YNbop8NFY3aZ6gRRo+tu3IBHnzmdNCBMXldXJKPfL74WzWUJRE+coDUknqsOdZXQbAJYwluVTbOZI3Qt8GFzMwxyjo3RgBiN4fr+elXVpZGRLWXl6PdOTtJBSlBDUK/lnIrjOlrtqWYTQDJaF6FrTXu9sOa1ysrVoM5HVE1GFxZQcyJ/p+xzv6K/rbr6N6+XDpUBl0tKFIrbz78qWB6YnWFMCBld4XLBms+7df75ook/GNzb0GCV7U1Qfz9p64TyQWNjYD3qe9rj4SMJtQP3MyjSDPzWIRHPjH7X4YAvfXoPuyZf9Pbi3PcuXIh4mp3NllYC6XY79C+jl2o8PBipxjnBttn4MgMNnWgfcRJGPI2OL8hTj3LloIlmRicvBhiNykvecpqoa3RSY4DRcLAwyicuOepVR1JjgNFYHWONHL04czTX0UmNAUYD7Pr+xc4wqTHGaBb2OtZvHUmNYUazcA2J6etdUmOk0f8rTKMTxF91RG0D1SwYGwAAAABJRU5ErkJggg==",
+            'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAAAkCAIAAADNSmkJAAAFKUlEQVR4Xu2ZXUwcVRiGV70wMWo08V5NvPXCrDbFaGpMaZW2hqQxaoiJTRsaMBCNSYtpa2JTKiFSelFa+Q/QZcMWqEhBlh+htbEpZhMrBQrlJ0hBywLLyrJ0WZbje3bqOvPNLHPWrDvdOE9ONmfe78zkzMs335wzWJhJQrBQweS/wTQ6QWgYHdoIOcecOe05O+t2WkutO+p2ZF3Ksg/YV9ZW6FATYajR3nveg60H9327r3O8c35lHgp+r05dPdJzBL73TPSQ8SaCKIxGLsPlop+K0JHrEkPuoT31e5qGmmjARACF0agYyGVNlyVm/pzZXrN9fHGcBkz0UBid+31u93i3XFFT80vN8cvHqWqih8Lo1NpUqS5vwh3vnd223VQ10UNh9NbyrcFQUK6oCawHUipSqGqiB83oBf+CXFGDMp1mS6OqiR4Ko7FexkpOrqhpHGw82nOUqiZ6KIzGrkRuorW0dJMmOy+hOCfYGzb2RBFv6HRO0gEJw/U7y+pgL1bwmTxexN6sZ31TdEwEhdG+gA+7EqyXpUO1uZH20cWL8hMTRt1N9tBXzCJrOIRoCPJpSO2RAp4HmtCdIfZ+2JWgEBN9LbR28seTGU0Zue1tMLp+YIAMSADzfvbkKX4/eb28j4YODiGin3heqmIlLja5hAUCu+nmGY3JWKvpMAlqNGgebsauBOvlqSX+JEx7p7EbTLen53XlzfmWUioqXikrc68Y8N2juJ/fyVsNChGHEE//rBANYWaZz+TRQqpLaBgNsPfDrgSpbS21YtV87IdjrlkX9JZbt5DOma2t9ITo5F+5glN22WwL/n+yDv00mw06orKxOqQ5+J04hhViwzAXETIcJDVm8uxZqktoGx2Nj9t43Wgaul/ERQiGQvtbWnDWgZYW9CXlQFjZ/7ciyHNn+Z2MexTimIeLz59TiIln0M1e+IbPpOAaDUnEYPTi6iqKxpbycs/qKo1tCslfKcffPn9enuMiPPY1vxO/ckeFQ4h46cdGqUWoidE/y54q5tPY5WDrGzQqIXot4BgchEE57e00IMCw2/1qZSVO/7SjA78o9INzcxsbrL+fnTnDDh9mmZn8F30oG1Hm+nABv5mQMopDS/h1HxtqTzWbABMe9sxpPoe9zezeOo1GELqWhPS8t46M0IAYHbdvR1aHbaOjbjfLz2eFhez6dba4yAfgF30o0BFVE8+Mjh/wFxPI+I5mAEHU6Ls+38vhTFwOBGhMDF8gkFpbC5ffsdv/uBs6dIj19dExEtARVXv9YNbop8NFY3aZ6gRRo+tu3IBHnzmdNCBMXldXJKPfL74WzWUJRE+coDUknqsOdZXQbAJYwluVTbOZI3Qt8GFzMwxyjo3RgBiN4fr+elXVpZGRLWXl6PdOTtJBSlBDUK/lnIrjOlrtqWYTQDJaF6FrTXu9sOa1ysrVoM5HVE1GFxZQcyJ/p+xzv6K/rbr6N6+XDpUBl0tKFIrbz78qWB6YnWFMCBld4XLBms+7df75ook/GNzb0GCV7U1Qfz9p64TyQWNjYD3qe9rj4SMJtQP3MyjSDPzWIRHPjH7X4YAvfXoPuyZf9Pbi3PcuXIh4mp3NllYC6XY79C+jl2o8PBipxjnBttn4MgMNnWgfcRJGPI2OL8hTj3LloIlmRicvBhiNykvecpqoa3RSY4DRcLAwyicuOepVR1JjgNFYHWONHL04czTX0UmNAUYD7Pr+xc4wqTHGaBb2OtZvHUmNYUazcA2J6etdUmOk0f8rTKMTxF91RG0D1SwYGwAAAABJRU5ErkJggg=='
         },
-        msg: "一切ok",
-      };
-    },
+        msg: '一切ok'
+      }
+    }
   },
   {
-    url: "/api/v1/auth/login",
-    method: "post",
+    url: '/api/v1/auth/login',
+    method: 'post',
     response: () => {
       return {
-        code: "00000",
+        code: '00000',
         data: {
           accessToken:
-            "eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJhZG1pbiIsImp0aSI6IjE2YWJkNTlkOTAxNzQwZDliYmI3ZjczODBhZDkyNzNhIiwidXNlcklkIjoyLCJ1c2VybmFtZSI6ImFkbWluIiwiZGVwdElkIjoxLCJkYXRhU2NvcGUiOjEsImF1dGhvcml0aWVzIjpbIlJPTEVfQURNSU4iXSwiZXhwIjoxNjkxMTAzMzgyfQ.P4cuIfmPepl3HuguhMS7NXn5a7IUPpsLbmtA_rHOhHk",
-          tokenType: "Bearer",
+            'eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJhZG1pbiIsImp0aSI6IjE2YWJkNTlkOTAxNzQwZDliYmI3ZjczODBhZDkyNzNhIiwidXNlcklkIjoyLCJ1c2VybmFtZSI6ImFkbWluIiwiZGVwdElkIjoxLCJkYXRhU2NvcGUiOjEsImF1dGhvcml0aWVzIjpbIlJPTEVfQURNSU4iXSwiZXhwIjoxNjkxMTAzMzgyfQ.P4cuIfmPepl3HuguhMS7NXn5a7IUPpsLbmtA_rHOhHk',
+          tokenType: 'Bearer',
           refreshToken: null,
-          expires: null,
+          expires: null
         },
-        msg: "一切ok",
-      };
-    },
+        msg: '一切ok'
+      }
+    }
   },
   {
-    url: "/api/v1/users/me",
-    method: "get",
+    url: '/api/v1/users/me',
+    method: 'get',
     response: () => {
       return {
-        code: "00000",
+        code: '00000',
         data: {
           userId: 2,
-          nickname: "系统管理员",
+          nickname: '系统管理员',
           avatar:
-            "https://oss.youlai.tech/youlai-boot/2023/05/16/811270ef31f548af9cffc026dfc3777b.gif",
-          roles: ["ADMIN"],
+            'https://oss.youlai.tech/youlai-boot/2023/05/16/811270ef31f548af9cffc026dfc3777b.gif',
+          roles: ['ADMIN'],
           perms: [
-            "sys:menu:delete",
-            "sys:dept:edit",
-            "sys:dict_type:add",
-            "sys:dict:edit",
-            "sys:dict:delete",
-            "sys:dict_type:edit",
-            "sys:menu:add",
-            "sys:user:add",
-            "sys:role:edit",
-            "sys:dept:delete",
-            "sys:user:edit",
-            "sys:user:delete",
-            "sys:user:reset_pwd",
-            "sys:dept:add",
-            "sys:role:delete",
-            "sys:dict_type:delete",
-            "sys:menu:edit",
-            "sys:dict:add",
-            "sys:role:add",
-          ],
+            'sys:menu:delete',
+            'sys:dept:edit',
+            'sys:dict_type:add',
+            'sys:dict:edit',
+            'sys:dict:delete',
+            'sys:dict_type:edit',
+            'sys:menu:add',
+            'sys:user:add',
+            'sys:role:edit',
+            'sys:dept:delete',
+            'sys:user:edit',
+            'sys:user:delete',
+            'sys:user:reset_pwd',
+            'sys:dept:add',
+            'sys:role:delete',
+            'sys:dict_type:delete',
+            'sys:menu:edit',
+            'sys:dict:add',
+            'sys:role:add'
+          ]
         },
-        msg: "一切ok",
-      };
-    },
+        msg: '一切ok'
+      }
+    }
   },
   {
-    url: "/api/v1/auth/logout",
-    method: "delete",
+    url: '/api/v1/auth/logout',
+    method: 'delete',
     response: () => {
       return {
-        code: "00000",
+        code: '00000',
         data: {},
-        msg: "string",
-      };
-    },
+        msg: 'string'
+      }
+    }
   },
   {
-    url: "/api/v1/users/page",
-    method: "get",
+    url: '/api/v1/users/page',
+    method: 'get',
     response: () => {
       return {
-        code: "00000",
+        code: '00000',
         data: {
           list: [
             {
               id: 2,
-              username: "admin",
-              nickname: "系统管理员",
-              mobile: "17621210366",
-              genderLabel: "男",
+              username: 'admin',
+              nickname: '系统管理员',
+              mobile: '17621210366',
+              genderLabel: '男',
               avatar:
-                "https://oss.youlai.tech/youlai-boot/2023/05/16/811270ef31f548af9cffc026dfc3777b.gif",
+                'https://oss.youlai.tech/youlai-boot/2023/05/16/811270ef31f548af9cffc026dfc3777b.gif',
               email: null,
               status: 1,
-              deptName: "有来技术",
-              roleNames: "系统管理员",
-              createTime: "2019-10-10",
+              deptName: '有来技术',
+              roleNames: '系统管理员',
+              createTime: '2019-10-10'
             },
             {
               id: 3,
-              username: "test",
-              nickname: "测试小用户",
-              mobile: "17621210366",
-              genderLabel: "男",
+              username: 'test',
+              nickname: '测试小用户',
+              mobile: '17621210366',
+              genderLabel: '男',
               avatar:
-                "https://oss.youlai.tech/youlai-boot/2023/05/16/811270ef31f548af9cffc026dfc3777b.gif",
+                'https://oss.youlai.tech/youlai-boot/2023/05/16/811270ef31f548af9cffc026dfc3777b.gif',
               email: null,
               status: 1,
-              deptName: "测试部门",
-              roleNames: "访问游客",
-              createTime: "2021-06-04",
-            },
+              deptName: '测试部门',
+              roleNames: '访问游客',
+              createTime: '2021-06-04'
+            }
           ],
-          total: 2,
+          total: 2
         },
-        msg: "一切ok",
-      };
-    },
+        msg: '一切ok'
+      }
+    }
   },
 
   {
-    url: "/api/v1/users/:id/form",
-    method: "get",
+    url: '/api/v1/users/:id/form',
+    method: 'get',
     response: ({ url }) => {
-      const id = url.match(/\/api\/v1\/users\/(\d+)\/form/)[1];
-      let formData = null;
+      const id = url.match(/\/api\/v1\/users\/(\d+)\/form/)[1]
+      let formData = null
       if (id == 2) {
         formData = {
           id: 2,
-          username: "admin",
-          nickname: "系统管理员",
-          mobile: "17621210366",
+          username: 'admin',
+          nickname: '系统管理员',
+          mobile: '17621210366',
           gender: 1,
           avatar:
-            "https://oss.youlai.tech/youlai-boot/2023/05/16/811270ef31f548af9cffc026dfc3777b.gif",
-          email: "",
+            'https://oss.youlai.tech/youlai-boot/2023/05/16/811270ef31f548af9cffc026dfc3777b.gif',
+          email: '',
           status: 1,
           deptId: 1,
-          roleIds: [2],
-        };
+          roleIds: [2]
+        }
       } else if (id == 3) {
         formData = {
           id: 3,
-          username: "test",
-          nickname: "测试小用户",
-          mobile: "17621210366",
+          username: 'test',
+          nickname: '测试小用户',
+          mobile: '17621210366',
           gender: 1,
           avatar:
-            "https://oss.youlai.tech/youlai-boot/2023/05/16/811270ef31f548af9cffc026dfc3777b.gif",
-          email: "youlaitech@163.com",
+            'https://oss.youlai.tech/youlai-boot/2023/05/16/811270ef31f548af9cffc026dfc3777b.gif',
+          email: 'youlaitech@163.com',
           status: 1,
           deptId: 3,
-          roleIds: [3],
-        };
+          roleIds: [3]
+        }
       }
 
       return {
-        code: "00000",
+        code: '00000',
         data: formData,
-        msg: "一切ok",
-      };
-    },
-  },
-] as MockMethod[];
+        msg: '一切ok'
+      }
+    }
+  }
+] as MockMethod[]
diff --git a/package.json b/package.json
index a71aeed8..e5bee6d8 100644
--- a/package.json
+++ b/package.json
@@ -11,7 +11,8 @@
     "lint:prettier": "prettier --write \"**/*.{js,cjs,ts,json,tsx,css,less,scss,vue,html,md}\"",
     "lint:stylelint": "stylelint  \"**/*.{css,scss,vue}\" --fix",
     "lint:lint-staged": "lint-staged",
-    "commit": "git-cz"
+    "commit": "git-cz",
+    "prettier": "prettier --write ."
   },
   "config": {
     "commitizen": {
@@ -46,6 +47,7 @@
     "@wangeditor/editor": "^5.1.23",
     "@wangeditor/editor-for-vue": "5.1.10",
     "axios": "^1.6.0",
+    "dayjs": "^1.11.10",
     "echarts": "^5.4.3",
     "element-plus": "^2.4.2",
     "lodash-es": "^4.17.21",
@@ -63,8 +65,7 @@
     "vue": "^3.3.8",
     "vue-i18n": "9.2.2",
     "vue-router": "^4.2.5",
-    "xlsx": "^0.18.5",
-    "dayjs": "^1.11.10"
+    "xlsx": "^0.18.5"
   },
   "devDependencies": {
     "@commitlint/cli": "^17.8.1",
@@ -78,6 +79,7 @@
     "@types/stompjs": "^2.3.8",
     "@typescript-eslint/eslint-plugin": "^5.62.0",
     "@typescript-eslint/parser": "^5.62.0",
+    "@unocss/preset-rem-to-px": "^0.58.0",
     "@vitejs/plugin-vue-jsx": "^3.0.2",
     "autoprefixer": "^10.4.16",
     "commitizen": "^4.3.0",
@@ -108,7 +110,7 @@
     "unplugin-icons": "^0.16.6",
     "unplugin-vue-components": "^0.24.1",
     "vite": "^4.5.0",
-    "vite-plugin-mock": "^3.0.0",
+    "vite-plugin-mock": "^2.9.8",
     "vite-plugin-svg-icons": "^2.0.1",
     "vue-tsc": "^1.8.22"
   },
diff --git a/src/App.vue b/src/App.vue
index dd2ac672..f2c0e46e 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import { useAppStore } from "@/store/modules/app";
+import { useAppStore } from '@/store/modules/app'
 
-const appStore = useAppStore();
+const appStore = useAppStore()
 </script>
 
 <template>
diff --git a/src/api/article.ts b/src/api/article.ts
index 2547a4bc..5d380773 100644
--- a/src/api/article.ts
+++ b/src/api/article.ts
@@ -1,88 +1,88 @@
-import request from "@/utils/request";
+import request from '@/utils/request'
 
 export interface ArticleQuery {
-  page?: number;
-  limit?: number;
-  sort?: string;
-  title?: string;
-  type?: string;
-  importance?: number;
+  page?: number
+  limit?: number
+  sort?: string
+  title?: string
+  type?: string
+  importance?: number
 }
 
 export interface ArticleDetail {
-  id: number;
-  timestamp: number;
-  title: string;
-  type: string;
-  status: string;
-  importance: number;
-  content?: string;
-  remark?: string;
+  id: number
+  timestamp: number
+  title: string
+  type: string
+  status: string
+  importance: number
+  content?: string
+  remark?: string
 }
 
 export interface ArticleCreate {
-  type: string;
-  timestamp: Date;
-  title: string;
-  status?: string;
-  importance?: number;
-  remark?: string;
+  type: string
+  timestamp: Date
+  title: string
+  status?: string
+  importance?: number
+  remark?: string
 }
 
 export interface ArticleUpdate {
-  id: number;
-  type?: string;
-  timestamp?: Date;
-  title?: string;
-  status?: string;
-  importance?: number;
-  remark?: string;
+  id: number
+  type?: string
+  timestamp?: Date
+  title?: string
+  status?: string
+  importance?: number
+  remark?: string
 }
 
 export function fetchList(query: ArticleQuery) {
   return request({
-    url: "/api/v1/article/list",
-    method: "get",
-    params: query,
-  });
+    url: '/api/v1/article/list',
+    method: 'get',
+    params: query
+  })
 }
 
 export function fetchArticle(id: number) {
   return request({
-    url: "/api/v1/article/detail",
-    method: "get",
-    params: { id },
-  });
+    url: '/api/v1/article/detail',
+    method: 'get',
+    params: { id }
+  })
 }
 
 export function fetchPv(id: number) {
   return request({
-    url: "/api/v1/article/pv",
-    method: "get",
-    params: { id },
-  });
+    url: '/api/v1/article/pv',
+    method: 'get',
+    params: { id }
+  })
 }
 
 export function createArticle(data: ArticleCreate) {
   return request({
-    url: "/api/v1/article/create",
-    method: "post",
-    data,
-  });
+    url: '/api/v1/article/create',
+    method: 'post',
+    data
+  })
 }
 
 export function updateArticle(data: ArticleUpdate) {
   return request({
-    url: "/api/v1/article/update",
-    method: "post",
-    data,
-  });
+    url: '/api/v1/article/update',
+    method: 'post',
+    data
+  })
 }
 
 export function deleteArticle(id: number) {
   return request({
-    url: "/api/v1/article/delete",
-    method: "post",
-    data: { id },
-  });
+    url: '/api/v1/article/delete',
+    method: 'post',
+    data: { id }
+  })
 }
diff --git a/src/api/auth/index.ts b/src/api/auth/index.ts
index 645628e1..a9dd0d49 100644
--- a/src/api/auth/index.ts
+++ b/src/api/auth/index.ts
@@ -1,6 +1,6 @@
-import request from "@/utils/request";
-import { AxiosPromise } from "axios";
-import { CaptchaResult, LoginData, LoginResult } from "./types";
+import request from '@/utils/request'
+import { AxiosPromise } from 'axios'
+import { CaptchaResult, LoginData, LoginResult } from './types'
 
 /**
  * 登录API
@@ -9,19 +9,19 @@ import { CaptchaResult, LoginData, LoginResult } from "./types";
  * @returns
  */
 export function loginApi(data: LoginData): AxiosPromise<LoginResult> {
-  const formData = new FormData();
-  formData.append("username", data.username);
-  formData.append("password", data.password);
-  formData.append("captchaKey", data.captchaKey || "");
-  formData.append("captchaCode", data.captchaCode || "");
+  const formData = new FormData()
+  formData.append('username', data.username)
+  formData.append('password', data.password)
+  formData.append('captchaKey', data.captchaKey || '')
+  formData.append('captchaCode', data.captchaCode || '')
   return request({
-    url: "/api/v1/auth/login",
-    method: "post",
+    url: '/api/v1/auth/login',
+    method: 'post',
     data: formData,
     headers: {
-      "Content-Type": "multipart/form-data",
-    },
-  });
+      'Content-Type': 'multipart/form-data'
+    }
+  })
 }
 
 /**
@@ -29,9 +29,9 @@ export function loginApi(data: LoginData): AxiosPromise<LoginResult> {
  */
 export function logoutApi() {
   return request({
-    url: "/api/v1/auth/logout",
-    method: "delete",
-  });
+    url: '/api/v1/auth/logout',
+    method: 'delete'
+  })
 }
 
 /**
@@ -39,7 +39,7 @@ export function logoutApi() {
  */
 export function getCaptchaApi(): AxiosPromise<CaptchaResult> {
   return request({
-    url: "/api/v1/auth/captcha",
-    method: "get",
-  });
+    url: '/api/v1/auth/captcha',
+    method: 'get'
+  })
 }
diff --git a/src/api/auth/types.ts b/src/api/auth/types.ts
index 0da661ed..0ee09fdf 100644
--- a/src/api/auth/types.ts
+++ b/src/api/auth/types.ts
@@ -5,21 +5,21 @@ export interface LoginData {
   /**
    * 用户名
    */
-  username: string;
+  username: string
   /**
    * 密码
    */
-  password: string;
+  password: string
 
   /**
    * 验证码缓存key
    */
-  captchaKey?: string;
+  captchaKey?: string
 
   /**
    * 验证码
    */
-  captchaCode?: string;
+  captchaCode?: string
 }
 
 /**
@@ -29,19 +29,19 @@ export interface LoginResult {
   /**
    * 访问token
    */
-  accessToken?: string;
+  accessToken?: string
   /**
    * 过期时间(单位：毫秒)
    */
-  expires?: number;
+  expires?: number
   /**
    * 刷新token
    */
-  refreshToken?: string;
+  refreshToken?: string
   /**
    * token 类型
    */
-  tokenType?: string;
+  tokenType?: string
 }
 
 /**
@@ -51,9 +51,9 @@ export interface CaptchaResult {
   /**
    * 验证码缓存key
    */
-  captchaKey: string;
+  captchaKey: string
   /**
    * 验证码图片Base64字符串
    */
-  captchaBase64: string;
+  captchaBase64: string
 }
diff --git a/src/api/dept/index.ts b/src/api/dept/index.ts
index f5e0466d..c2498bec 100644
--- a/src/api/dept/index.ts
+++ b/src/api/dept/index.ts
@@ -1,6 +1,6 @@
-import request from "@/utils/request";
-import { AxiosPromise } from "axios";
-import { DeptForm, DeptQuery, DeptVO } from "./types";
+import request from '@/utils/request'
+import { AxiosPromise } from 'axios'
+import { DeptForm, DeptQuery, DeptVO } from './types'
 
 /**
  * 部门树形表格
@@ -9,10 +9,10 @@ import { DeptForm, DeptQuery, DeptVO } from "./types";
  */
 export function listDepts(queryParams?: DeptQuery): AxiosPromise<DeptVO[]> {
   return request({
-    url: "/api/v1/dept",
-    method: "get",
-    params: queryParams,
-  });
+    url: '/api/v1/dept',
+    method: 'get',
+    params: queryParams
+  })
 }
 
 /**
@@ -20,9 +20,9 @@ export function listDepts(queryParams?: DeptQuery): AxiosPromise<DeptVO[]> {
  */
 export function getDeptOptions(): AxiosPromise<OptionType[]> {
   return request({
-    url: "/api/v1/dept/options",
-    method: "get",
-  });
+    url: '/api/v1/dept/options',
+    method: 'get'
+  })
 }
 
 /**
@@ -32,9 +32,9 @@ export function getDeptOptions(): AxiosPromise<OptionType[]> {
  */
 export function getDeptForm(id: number): AxiosPromise<DeptForm> {
   return request({
-    url: "/api/v1/dept/" + id + "/form",
-    method: "get",
-  });
+    url: '/api/v1/dept/' + id + '/form',
+    method: 'get'
+  })
 }
 
 /**
@@ -44,10 +44,10 @@ export function getDeptForm(id: number): AxiosPromise<DeptForm> {
  */
 export function addDept(data: DeptForm) {
   return request({
-    url: "/api/v1/dept",
-    method: "post",
-    data: data,
-  });
+    url: '/api/v1/dept',
+    method: 'post',
+    data: data
+  })
 }
 
 /**
@@ -58,10 +58,10 @@ export function addDept(data: DeptForm) {
  */
 export function updateDept(id: number, data: DeptForm) {
   return request({
-    url: "/api/v1/dept/" + id,
-    method: "put",
-    data: data,
-  });
+    url: '/api/v1/dept/' + id,
+    method: 'put',
+    data: data
+  })
 }
 
 /**
@@ -71,7 +71,7 @@ export function updateDept(id: number, data: DeptForm) {
  */
 export function deleteDept(ids: string) {
   return request({
-    url: "/api/v1/dept/" + ids,
-    method: "delete",
-  });
+    url: '/api/v1/dept/' + ids,
+    method: 'delete'
+  })
 }
diff --git a/src/api/dept/types.ts b/src/api/dept/types.ts
index 408c39c4..7ca2e0a0 100644
--- a/src/api/dept/types.ts
+++ b/src/api/dept/types.ts
@@ -2,8 +2,8 @@
  * 部门查询参数
  */
 export interface DeptQuery {
-  keywords?: string;
-  status?: number;
+  keywords?: string
+  status?: number
 }
 
 /**
@@ -13,35 +13,35 @@ export interface DeptVO {
   /**
    * 子部门
    */
-  children?: DeptVO[];
+  children?: DeptVO[]
   /**
    * 创建时间
    */
-  createTime?: Date;
+  createTime?: Date
   /**
    * 部门ID
    */
-  id?: number;
+  id?: number
   /**
    * 部门名称
    */
-  name?: string;
+  name?: string
   /**
    * 父部门ID
    */
-  parentId?: number;
+  parentId?: number
   /**
    * 排序
    */
-  sort?: number;
+  sort?: number
   /**
    * 状态(1:启用；0:禁用)
    */
-  status?: number;
+  status?: number
   /**
    * 修改时间
    */
-  updateTime?: Date;
+  updateTime?: Date
 }
 
 /**
@@ -51,21 +51,21 @@ export interface DeptForm {
   /**
    * 部门ID(新增不填)
    */
-  id?: number;
+  id?: number
   /**
    * 部门名称
    */
-  name?: string;
+  name?: string
   /**
    * 父部门ID
    */
-  parentId: number;
+  parentId: number
   /**
    * 排序
    */
-  sort?: number;
+  sort?: number
   /**
    * 状态(1:启用；0：禁用)
    */
-  status?: number;
+  status?: number
 }
diff --git a/src/api/dict/index.ts b/src/api/dict/index.ts
index 635297eb..74bd7931 100644
--- a/src/api/dict/index.ts
+++ b/src/api/dict/index.ts
@@ -1,13 +1,13 @@
-import request from "@/utils/request";
-import { AxiosPromise } from "axios";
+import request from '@/utils/request'
+import { AxiosPromise } from 'axios'
 import {
   DictTypeQuery,
   DictTypePageResult,
   DictTypeForm,
   DictQuery,
   DictForm,
-  DictPageResult,
-} from "./types";
+  DictPageResult
+} from './types'
 
 /**
  * 字典类型分页列表
@@ -18,10 +18,10 @@ export function getDictTypePage(
   queryParams: DictTypeQuery
 ): AxiosPromise<DictTypePageResult> {
   return request({
-    url: "/api/v1/dict/types/page",
-    method: "get",
-    params: queryParams,
-  });
+    url: '/api/v1/dict/types/page',
+    method: 'get',
+    params: queryParams
+  })
 }
 
 /**
@@ -31,9 +31,9 @@ export function getDictTypePage(
  */
 export function getDictTypeForm(id: number): AxiosPromise<DictTypeForm> {
   return request({
-    url: "/api/v1/dict/types/" + id + "/form",
-    method: "get",
-  });
+    url: '/api/v1/dict/types/' + id + '/form',
+    method: 'get'
+  })
 }
 
 /**
@@ -43,10 +43,10 @@ export function getDictTypeForm(id: number): AxiosPromise<DictTypeForm> {
  */
 export function addDictType(data: DictTypeForm) {
   return request({
-    url: "/api/v1/dict/types",
-    method: "post",
-    data: data,
-  });
+    url: '/api/v1/dict/types',
+    method: 'post',
+    data: data
+  })
 }
 
 /**
@@ -57,10 +57,10 @@ export function addDictType(data: DictTypeForm) {
  */
 export function updateDictType(id: number, data: DictTypeForm) {
   return request({
-    url: "/api/v1/dict/types/" + id,
-    method: "put",
-    data: data,
-  });
+    url: '/api/v1/dict/types/' + id,
+    method: 'put',
+    data: data
+  })
 }
 
 /**
@@ -68,9 +68,9 @@ export function updateDictType(id: number, data: DictTypeForm) {
  */
 export function deleteDictTypes(ids: string) {
   return request({
-    url: "/api/v1/dict/types/" + ids,
-    method: "delete",
-  });
+    url: '/api/v1/dict/types/' + ids,
+    method: 'delete'
+  })
 }
 
 /**
@@ -80,9 +80,9 @@ export function deleteDictTypes(ids: string) {
  */
 export function getDictOptions(typeCode: string): AxiosPromise<OptionType[]> {
   return request({
-    url: "/api/v1/dict/" + typeCode + "/options",
-    method: "get",
-  });
+    url: '/api/v1/dict/' + typeCode + '/options',
+    method: 'get'
+  })
 }
 
 /**
@@ -92,10 +92,10 @@ export function getDictPage(
   queryParams: DictQuery
 ): AxiosPromise<DictPageResult> {
   return request({
-    url: "/api/v1/dict/page",
-    method: "get",
-    params: queryParams,
-  });
+    url: '/api/v1/dict/page',
+    method: 'get',
+    params: queryParams
+  })
 }
 
 /**
@@ -105,9 +105,9 @@ export function getDictPage(
  */
 export function getDictFormData(id: number): AxiosPromise<DictForm> {
   return request({
-    url: "/api/v1/dict/" + id + "/form",
-    method: "get",
-  });
+    url: '/api/v1/dict/' + id + '/form',
+    method: 'get'
+  })
 }
 
 /**
@@ -117,10 +117,10 @@ export function getDictFormData(id: number): AxiosPromise<DictForm> {
  */
 export function addDict(data: DictForm) {
   return request({
-    url: "/api/v1/dict",
-    method: "post",
-    data: data,
-  });
+    url: '/api/v1/dict',
+    method: 'post',
+    data: data
+  })
 }
 
 /**
@@ -131,10 +131,10 @@ export function addDict(data: DictForm) {
  */
 export function updateDict(id: number, data: DictForm) {
   return request({
-    url: "/api/v1/dict/" + id,
-    method: "put",
-    data: data,
-  });
+    url: '/api/v1/dict/' + id,
+    method: 'put',
+    data: data
+  })
 }
 
 /**
@@ -144,7 +144,7 @@ export function updateDict(id: number, data: DictForm) {
  */
 export function deleteDict(ids: string) {
   return request({
-    url: "/api/v1/dict/" + ids,
-    method: "delete",
-  });
+    url: '/api/v1/dict/' + ids,
+    method: 'delete'
+  })
 }
diff --git a/src/api/dict/types.ts b/src/api/dict/types.ts
index 315da6d7..a975e815 100644
--- a/src/api/dict/types.ts
+++ b/src/api/dict/types.ts
@@ -5,7 +5,7 @@ export interface DictTypeQuery extends PageQuery {
   /**
    * 关键字(字典类型名称/编码)
    */
-  keywords?: string;
+  keywords?: string
 }
 
 /**
@@ -15,29 +15,29 @@ export interface DictTypePageVO {
   /**
    * 字典类型ID
    */
-  id: number;
+  id: number
   /**
    * 类型编码
    */
-  code: string;
+  code: string
   /**
    * 类型名称
    */
-  name: string;
+  name: string
   /**
    * 状态(1:启用;0:禁用)
    */
-  status?: number;
+  status?: number
   /**
    * 备注
    */
-  remark?: string;
+  remark?: string
 }
 
 /**
  * 字典分页项类型声明
  */
-export type DictTypePageResult = PageResult<DictTypePageVO[]>;
+export type DictTypePageResult = PageResult<DictTypePageVO[]>
 
 /**
  * 字典表单类型声明
@@ -46,23 +46,23 @@ export interface DictTypeForm {
   /**
    * 字典类型ID
    */
-  id?: number;
+  id?: number
   /**
    * 类型名称
    */
-  name?: string;
+  name?: string
   /**
    * 类型编码
    */
-  code?: string;
+  code?: string
   /**
    * 类型状态：1:启用;0:禁用
    */
-  status: number;
+  status: number
   /**
    * 备注
    */
-  remark?: string;
+  remark?: string
 }
 
 /**
@@ -72,11 +72,11 @@ export interface DictQuery extends PageQuery {
   /**
    * 字典项名称
    */
-  name?: string;
+  name?: string
   /**
    * 字典类型编码
    */
-  typeCode?: string;
+  typeCode?: string
 }
 
 /**
@@ -86,25 +86,25 @@ export interface DictPageVO {
   /**
    * 字典ID
    */
-  id?: number;
+  id?: number
   /**
    * 字典名称
    */
-  name?: string;
+  name?: string
   /**
    * 状态(1:启用;0:禁用)
    */
-  status?: number;
+  status?: number
   /**
    * 字典值
    */
-  value?: string;
+  value?: string
 }
 
 /**
  * 字典分页
  */
-export type DictPageResult = PageResult<DictPageVO[]>;
+export type DictPageResult = PageResult<DictPageVO[]>
 
 /**
  * 字典表单
@@ -113,30 +113,30 @@ export interface DictForm {
   /**
    * 字典ID
    */
-  id?: number;
+  id?: number
   /**
    * 字典名称
    */
-  name?: string;
+  name?: string
   /**
    * 排序
    */
-  sort?: number;
+  sort?: number
   /**
    * 状态(1:启用;0:禁用)
    */
-  status?: number;
+  status?: number
   /**
    * 类型编码
    */
-  typeCode?: string;
+  typeCode?: string
   /**
    * 值
    */
-  value?: string;
+  value?: string
 
   /**
    * 备注
    */
-  remark?: string;
+  remark?: string
 }
diff --git a/src/api/file/index.ts b/src/api/file/index.ts
index adcc30b9..b454fba2 100644
--- a/src/api/file/index.ts
+++ b/src/api/file/index.ts
@@ -1,6 +1,6 @@
-import request from "@/utils/request";
-import { AxiosPromise } from "axios";
-import { FileInfo } from "./types";
+import request from '@/utils/request'
+import { AxiosPromise } from 'axios'
+import { FileInfo } from './types'
 
 /**
  * 上传文件
@@ -8,16 +8,16 @@ import { FileInfo } from "./types";
  * @param file
  */
 export function uploadFileApi(file: File): AxiosPromise<FileInfo> {
-  const formData = new FormData();
-  formData.append("file", file);
+  const formData = new FormData()
+  formData.append('file', file)
   return request({
-    url: "/api/v1/files",
-    method: "post",
+    url: '/api/v1/files',
+    method: 'post',
     data: formData,
     headers: {
-      "Content-Type": "multipart/form-data",
-    },
-  });
+      'Content-Type': 'multipart/form-data'
+    }
+  })
 }
 
 /**
@@ -27,8 +27,8 @@ export function uploadFileApi(file: File): AxiosPromise<FileInfo> {
  */
 export function deleteFileApi(filePath?: string) {
   return request({
-    url: "/api/v1/files",
-    method: "delete",
-    params: { filePath: filePath },
-  });
+    url: '/api/v1/files',
+    method: 'delete',
+    params: { filePath: filePath }
+  })
 }
diff --git a/src/api/file/types.ts b/src/api/file/types.ts
index 22b2be55..f2bafa6b 100644
--- a/src/api/file/types.ts
+++ b/src/api/file/types.ts
@@ -2,6 +2,6 @@
  * 文件API类型声明
  */
 export interface FileInfo {
-  name: string;
-  url: string;
+  name: string
+  url: string
 }
diff --git a/src/api/menu/index.ts b/src/api/menu/index.ts
index 032e0a91..8391cc02 100644
--- a/src/api/menu/index.ts
+++ b/src/api/menu/index.ts
@@ -1,15 +1,15 @@
-import request from "@/utils/request";
-import { AxiosPromise } from "axios";
-import { MenuQuery, MenuVO, MenuForm } from "./types";
+import request from '@/utils/request'
+import { AxiosPromise } from 'axios'
+import { MenuQuery, MenuVO, MenuForm } from './types'
 
 /**
  * 获取路由列表
  */
 export function listRoutes() {
   return request({
-    url: "/api/v1/menus/routes",
-    method: "get",
-  });
+    url: '/api/v1/menus/routes',
+    method: 'get'
+  })
 }
 
 /**
@@ -19,10 +19,10 @@ export function listRoutes() {
  */
 export function listMenus(queryParams: MenuQuery): AxiosPromise<MenuVO[]> {
   return request({
-    url: "/api/v1/menus",
-    method: "get",
-    params: queryParams,
-  });
+    url: '/api/v1/menus',
+    method: 'get',
+    params: queryParams
+  })
 }
 
 /**
@@ -30,9 +30,9 @@ export function listMenus(queryParams: MenuQuery): AxiosPromise<MenuVO[]> {
  */
 export function getMenuOptions(): AxiosPromise<OptionType[]> {
   return request({
-    url: "/api/v1/menus/options",
-    method: "get",
-  });
+    url: '/api/v1/menus/options',
+    method: 'get'
+  })
 }
 
 /**
@@ -42,9 +42,9 @@ export function getMenuOptions(): AxiosPromise<OptionType[]> {
  */
 export function getMenuForm(id: number): AxiosPromise<MenuForm> {
   return request({
-    url: "/api/v1/menus/" + id + "/form",
-    method: "get",
-  });
+    url: '/api/v1/menus/' + id + '/form',
+    method: 'get'
+  })
 }
 
 /**
@@ -54,10 +54,10 @@ export function getMenuForm(id: number): AxiosPromise<MenuForm> {
  */
 export function addMenu(data: MenuForm) {
   return request({
-    url: "/api/v1/menus",
-    method: "post",
-    data: data,
-  });
+    url: '/api/v1/menus',
+    method: 'post',
+    data: data
+  })
 }
 
 /**
@@ -68,10 +68,10 @@ export function addMenu(data: MenuForm) {
  */
 export function updateMenu(id: string, data: MenuForm) {
   return request({
-    url: "/api/v1/menus/" + id,
-    method: "put",
-    data: data,
-  });
+    url: '/api/v1/menus/' + id,
+    method: 'put',
+    data: data
+  })
 }
 
 /**
@@ -81,7 +81,7 @@ export function updateMenu(id: string, data: MenuForm) {
  */
 export function deleteMenu(id: number) {
   return request({
-    url: "/api/v1/menus/" + id,
-    method: "delete",
-  });
+    url: '/api/v1/menus/' + id,
+    method: 'delete'
+  })
 }
diff --git a/src/api/menu/types.ts b/src/api/menu/types.ts
index 38101e8a..df7e60d4 100644
--- a/src/api/menu/types.ts
+++ b/src/api/menu/types.ts
@@ -1,10 +1,10 @@
-import { MenuTypeEnum } from "@/enums/MenuTypeEnum";
+import { MenuTypeEnum } from '@/enums/MenuTypeEnum'
 
 /**
  * 菜单查询参数类型
  */
 export interface MenuQuery {
-  keywords?: string;
+  keywords?: string
 }
 
 /**
@@ -14,55 +14,55 @@ export interface MenuVO {
   /**
    * 子菜单
    */
-  children?: MenuVO[];
+  children?: MenuVO[]
   /**
    * 组件路径
    */
-  component?: string;
+  component?: string
   /**
    * ICON
    */
-  icon?: string;
+  icon?: string
   /**
    * 菜单ID
    */
-  id?: number;
+  id?: number
   /**
    * 菜单名称
    */
-  name?: string;
+  name?: string
   /**
    * 父菜单ID
    */
-  parentId?: number;
+  parentId?: number
   /**
    * 按钮权限标识
    */
-  perm?: string;
+  perm?: string
   /**
    * 跳转路径
    */
-  redirect?: string;
+  redirect?: string
   /**
    * 路由名称
    */
-  routeName?: string;
+  routeName?: string
   /**
    * 路由相对路径
    */
-  routePath?: string;
+  routePath?: string
   /**
    * 菜单排序(数字越小排名越靠前)
    */
-  sort?: number;
+  sort?: number
   /**
    * 菜单类型
    */
-  type?: MenuTypeEnum;
+  type?: MenuTypeEnum
   /**
    * 菜单是否可见(1:显示;0:隐藏)
    */
-  visible?: number;
+  visible?: number
 }
 
 /**
@@ -72,53 +72,53 @@ export interface MenuForm {
   /**
    * 菜单ID
    */
-  id?: string;
+  id?: string
   /**
    * 父菜单ID
    */
-  parentId?: number;
+  parentId?: number
   /**
    * 菜单名称
    */
-  name?: string;
+  name?: string
   /**
    * 菜单是否可见(1:是;0:否;)
    */
-  visible: number;
-  icon?: string;
+  visible: number
+  icon?: string
   /**
    * 排序
    */
-  sort: number;
+  sort: number
   /**
    * 组件路径
    */
-  component?: string;
+  component?: string
   /**
    * 路由路径
    */
-  path?: string;
+  path?: string
   /**
    * 跳转路由路径
    */
-  redirect?: string;
+  redirect?: string
 
   /**
    * 菜单类型
    */
-  type: MenuTypeEnum;
+  type: MenuTypeEnum
 
   /**
    * 权限标识
    */
-  perm?: string;
+  perm?: string
   /**
    * 【菜单】是否开启页面缓存
    */
-  keepAlive?: number;
+  keepAlive?: number
 
   /**
    * 【目录】只有一个子路由是否始终显示
    */
-  alwaysShow?: number;
+  alwaysShow?: number
 }
diff --git a/src/api/role/index.ts b/src/api/role/index.ts
index fdbc65cd..b94056a2 100644
--- a/src/api/role/index.ts
+++ b/src/api/role/index.ts
@@ -1,6 +1,6 @@
-import request from "@/utils/request";
-import { AxiosPromise } from "axios";
-import { RoleQuery, RolePageResult, RoleForm } from "./types";
+import request from '@/utils/request'
+import { AxiosPromise } from 'axios'
+import { RoleQuery, RolePageResult, RoleForm } from './types'
 
 /**
  * 获取角色分页数据
@@ -11,10 +11,10 @@ export function getRolePage(
   queryParams?: RoleQuery
 ): AxiosPromise<RolePageResult> {
   return request({
-    url: "/api/v1/roles/page",
-    method: "get",
-    params: queryParams,
-  });
+    url: '/api/v1/roles/page',
+    method: 'get',
+    params: queryParams
+  })
 }
 
 /**
@@ -26,10 +26,10 @@ export function getRoleOptions(
   queryParams?: RoleQuery
 ): AxiosPromise<OptionType[]> {
   return request({
-    url: "/api/v1/roles/options",
-    method: "get",
-    params: queryParams,
-  });
+    url: '/api/v1/roles/options',
+    method: 'get',
+    params: queryParams
+  })
 }
 
 /**
@@ -39,9 +39,9 @@ export function getRoleOptions(
  */
 export function getRoleMenuIds(roleId: number): AxiosPromise<number[]> {
   return request({
-    url: "/api/v1/roles/" + roleId + "/menuIds",
-    method: "get",
-  });
+    url: '/api/v1/roles/' + roleId + '/menuIds',
+    method: 'get'
+  })
 }
 
 /**
@@ -54,10 +54,10 @@ export function updateRoleMenus(
   data: number[]
 ): AxiosPromise<any> {
   return request({
-    url: "/api/v1/roles/" + roleId + "/menus",
-    method: "put",
-    data: data,
-  });
+    url: '/api/v1/roles/' + roleId + '/menus',
+    method: 'put',
+    data: data
+  })
 }
 
 /**
@@ -67,9 +67,9 @@ export function updateRoleMenus(
  */
 export function getRoleForm(id: number): AxiosPromise<RoleForm> {
   return request({
-    url: "/api/v1/roles/" + id + "/form",
-    method: "get",
-  });
+    url: '/api/v1/roles/' + id + '/form',
+    method: 'get'
+  })
 }
 
 /**
@@ -79,10 +79,10 @@ export function getRoleForm(id: number): AxiosPromise<RoleForm> {
  */
 export function addRole(data: RoleForm) {
   return request({
-    url: "/api/v1/roles",
-    method: "post",
-    data: data,
-  });
+    url: '/api/v1/roles',
+    method: 'post',
+    data: data
+  })
 }
 
 /**
@@ -93,10 +93,10 @@ export function addRole(data: RoleForm) {
  */
 export function updateRole(id: number, data: RoleForm) {
   return request({
-    url: "/api/v1/roles/" + id,
-    method: "put",
-    data: data,
-  });
+    url: '/api/v1/roles/' + id,
+    method: 'put',
+    data: data
+  })
 }
 
 /**
@@ -106,7 +106,7 @@ export function updateRole(id: number, data: RoleForm) {
  */
 export function deleteRoles(ids: string) {
   return request({
-    url: "/api/v1/roles/" + ids,
-    method: "delete",
-  });
+    url: '/api/v1/roles/' + ids,
+    method: 'delete'
+  })
 }
diff --git a/src/api/role/types.ts b/src/api/role/types.ts
index 2d259c7f..b48a8541 100644
--- a/src/api/role/types.ts
+++ b/src/api/role/types.ts
@@ -2,7 +2,7 @@
  * 角色查询参数
  */
 export interface RoleQuery extends PageQuery {
-  keywords?: string;
+  keywords?: string
 }
 
 /**
@@ -12,38 +12,38 @@ export interface RolePageVO {
   /**
    * 角色编码
    */
-  code?: string;
+  code?: string
 
   /**
    * 角色ID
    */
-  id?: number;
+  id?: number
   /**
    * 角色名称
    */
-  name?: string;
+  name?: string
   /**
    * 排序
    */
-  sort?: number;
+  sort?: number
   /**
    * 角色状态
    */
-  status?: number;
+  status?: number
   /**
    * 创建时间
    */
-  createTime?: Date;
+  createTime?: Date
   /**
    * 修改时间
    */
-  updateTime?: Date;
+  updateTime?: Date
 }
 
 /**
  * 角色分页
  */
-export type RolePageResult = PageResult<RolePageVO[]>;
+export type RolePageResult = PageResult<RolePageVO[]>
 
 /**
  * 角色表单对象
@@ -52,27 +52,27 @@ export interface RoleForm {
   /**
    * 角色ID
    */
-  id?: number;
+  id?: number
 
   /**
    * 角色编码
    */
-  code: string;
+  code: string
   /**
    * 数据权限
    */
-  dataScope?: number;
+  dataScope?: number
 
   /**
    * 角色名称
    */
-  name: string;
+  name: string
   /**
    * 排序
    */
-  sort?: number;
+  sort?: number
   /**
    * 角色状态(1-正常；0-停用)
    */
-  status?: number;
+  status?: number
 }
diff --git a/src/api/user/index.ts b/src/api/user/index.ts
index 3c7087a0..b1a23758 100644
--- a/src/api/user/index.ts
+++ b/src/api/user/index.ts
@@ -1,15 +1,15 @@
-import request from "@/utils/request";
-import { AxiosPromise } from "axios";
-import { UserForm, UserInfo, UserPageVO, UserQuery } from "./types";
+import request from '@/utils/request'
+import { AxiosPromise } from 'axios'
+import { UserForm, UserInfo, UserPageVO, UserQuery } from './types'
 
 /**
  * 登录成功后获取用户信息（昵称、头像、权限集合和角色集合）
  */
 export function getUserInfoApi(): AxiosPromise<UserInfo> {
   return request({
-    url: "/api/v1/users/me",
-    method: "get",
-  });
+    url: '/api/v1/users/me',
+    method: 'get'
+  })
 }
 
 /**
@@ -21,10 +21,10 @@ export function getUserPage(
   queryParams: UserQuery
 ): AxiosPromise<PageResult<UserPageVO[]>> {
   return request({
-    url: "/api/v1/users/page",
-    method: "get",
-    params: queryParams,
-  });
+    url: '/api/v1/users/page',
+    method: 'get',
+    params: queryParams
+  })
 }
 
 /**
@@ -34,9 +34,9 @@ export function getUserPage(
  */
 export function getUserForm(userId: number): AxiosPromise<UserForm> {
   return request({
-    url: "/api/v1/users/" + userId + "/form",
-    method: "get",
-  });
+    url: '/api/v1/users/' + userId + '/form',
+    method: 'get'
+  })
 }
 
 /**
@@ -46,10 +46,10 @@ export function getUserForm(userId: number): AxiosPromise<UserForm> {
  */
 export function addUser(data: any) {
   return request({
-    url: "/api/v1/users",
-    method: "post",
-    data: data,
-  });
+    url: '/api/v1/users',
+    method: 'post',
+    data: data
+  })
 }
 
 /**
@@ -60,10 +60,10 @@ export function addUser(data: any) {
  */
 export function updateUser(id: number, data: UserForm) {
   return request({
-    url: "/api/v1/users/" + id,
-    method: "put",
-    data: data,
-  });
+    url: '/api/v1/users/' + id,
+    method: 'put',
+    data: data
+  })
 }
 
 /**
@@ -74,10 +74,10 @@ export function updateUser(id: number, data: UserForm) {
  */
 export function updateUserPassword(id: number, password: string) {
   return request({
-    url: "/api/v1/users/" + id + "/password",
-    method: "patch",
-    params: { password: password },
-  });
+    url: '/api/v1/users/' + id + '/password',
+    method: 'patch',
+    params: { password: password }
+  })
 }
 
 /**
@@ -87,9 +87,9 @@ export function updateUserPassword(id: number, password: string) {
  */
 export function deleteUsers(ids: string) {
   return request({
-    url: "/api/v1/users/" + ids,
-    method: "delete",
-  });
+    url: '/api/v1/users/' + ids,
+    method: 'delete'
+  })
 }
 
 /**
@@ -99,10 +99,10 @@ export function deleteUsers(ids: string) {
  */
 export function downloadTemplateApi() {
   return request({
-    url: "/api/v1/users/template",
-    method: "get",
-    responseType: "arraybuffer",
-  });
+    url: '/api/v1/users/template',
+    method: 'get',
+    responseType: 'arraybuffer'
+  })
 }
 
 /**
@@ -113,11 +113,11 @@ export function downloadTemplateApi() {
  */
 export function exportUser(queryParams: UserQuery) {
   return request({
-    url: "/api/v1/users/_export",
-    method: "get",
+    url: '/api/v1/users/_export',
+    method: 'get',
     params: queryParams,
-    responseType: "arraybuffer",
-  });
+    responseType: 'arraybuffer'
+  })
 }
 
 /**
@@ -126,15 +126,15 @@ export function exportUser(queryParams: UserQuery) {
  * @param file
  */
 export function importUser(deptId: number, file: File) {
-  const formData = new FormData();
-  formData.append("file", file);
+  const formData = new FormData()
+  formData.append('file', file)
   return request({
-    url: "/api/v1/users/_import",
-    method: "post",
+    url: '/api/v1/users/_import',
+    method: 'post',
     params: { deptId: deptId },
     data: formData,
     headers: {
-      "Content-Type": "multipart/form-data",
-    },
-  });
+      'Content-Type': 'multipart/form-data'
+    }
+  })
 }
diff --git a/src/api/user/types.ts b/src/api/user/types.ts
index c0060f27..4e614248 100644
--- a/src/api/user/types.ts
+++ b/src/api/user/types.ts
@@ -2,23 +2,23 @@
  * 登录用户信息
  */
 export interface UserInfo {
-  userId?: number;
-  username?: string;
-  nickname?: string;
-  avatar?: string;
-  roles: string[];
-  perms: string[];
+  userId?: number
+  username?: string
+  nickname?: string
+  avatar?: string
+  roles: string[]
+  perms: string[]
 }
 
 /**
  * 用户查询对象类型
  */
 export interface UserQuery extends PageQuery {
-  keywords?: string;
-  status?: number;
-  deptId?: number;
-  startTime?: string;
-  endTime?: string;
+  keywords?: string
+  status?: number
+  deptId?: number
+  startTime?: string
+  endTime?: string
 }
 
 /**
@@ -28,47 +28,47 @@ export interface UserPageVO {
   /**
    * 用户头像地址
    */
-  avatar?: string;
+  avatar?: string
   /**
    * 创建时间
    */
-  createTime?: Date;
+  createTime?: Date
   /**
    * 部门名称
    */
-  deptName?: string;
+  deptName?: string
   /**
    * 用户邮箱
    */
-  email?: string;
+  email?: string
   /**
    * 性别
    */
-  genderLabel?: string;
+  genderLabel?: string
   /**
    * 用户ID
    */
-  id?: number;
+  id?: number
   /**
    * 手机号
    */
-  mobile?: string;
+  mobile?: string
   /**
    * 用户昵称
    */
-  nickname?: string;
+  nickname?: string
   /**
    * 角色名称，多个使用英文逗号(,)分割
    */
-  roleNames?: string;
+  roleNames?: string
   /**
    * 用户状态(1:启用;0:禁用)
    */
-  status?: number;
+  status?: number
   /**
    * 用户名
    */
-  username?: string;
+  username?: string
 }
 
 /**
@@ -78,38 +78,38 @@ export interface UserForm {
   /**
    * 用户头像
    */
-  avatar?: string;
+  avatar?: string
   /**
    * 部门ID
    */
-  deptId?: number;
+  deptId?: number
   /**
    * 邮箱
    */
-  email?: string;
+  email?: string
   /**
    * 性别
    */
-  gender?: number;
+  gender?: number
   /**
    * 用户ID
    */
-  id?: number;
-  mobile?: string;
+  id?: number
+  mobile?: string
   /**
    * 昵称
    */
-  nickname?: string;
+  nickname?: string
   /**
    * 角色ID集合
    */
-  roleIds?: number[];
+  roleIds?: number[]
   /**
    * 用户状态(1:正常;0:禁用)
    */
-  status?: number;
+  status?: number
   /**
    * 用户名
    */
-  username?: string;
+  username?: string
 }
diff --git a/src/components/Breadcrumb/index.vue b/src/components/Breadcrumb/index.vue
index 2bf19c51..bb59c133 100644
--- a/src/components/Breadcrumb/index.vue
+++ b/src/components/Breadcrumb/index.vue
@@ -18,73 +18,73 @@
 </template>
 
 <script setup lang="ts">
-import { onBeforeMount, ref, watch } from "vue";
-import { useRoute, RouteLocationMatched } from "vue-router";
-import { compile } from "path-to-regexp";
-import router from "@/router";
-import { translateRouteTitle } from "@/utils/i18n";
+import { onBeforeMount, ref, watch } from 'vue'
+import { useRoute, RouteLocationMatched } from 'vue-router'
+import { compile } from 'path-to-regexp'
+import router from '@/router'
+import { translateRouteTitle } from '@/utils/i18n'
 
-const currentRoute = useRoute();
+const currentRoute = useRoute()
 const pathCompile = (path: string) => {
-  const { params } = currentRoute;
-  const toPath = compile(path);
-  return toPath(params);
-};
+  const { params } = currentRoute
+  const toPath = compile(path)
+  return toPath(params)
+}
 
-const breadcrumbs = ref([] as Array<RouteLocationMatched>);
+const breadcrumbs = ref([] as Array<RouteLocationMatched>)
 
 function getBreadcrumb() {
   let matched = currentRoute.matched.filter(
     (item) => item.meta && item.meta.title
-  );
-  const first = matched[0];
+  )
+  const first = matched[0]
   if (!isDashboard(first)) {
     matched = [
-      { path: "/dashboard", meta: { title: "dashboard" } } as any,
-    ].concat(matched);
+      { path: '/dashboard', meta: { title: 'dashboard' } } as any
+    ].concat(matched)
   }
   breadcrumbs.value = matched.filter((item) => {
-    return item.meta && item.meta.title && item.meta.breadcrumb !== false;
-  });
+    return item.meta && item.meta.title && item.meta.breadcrumb !== false
+  })
 }
 
 function isDashboard(route: RouteLocationMatched) {
-  const name = route && route.name;
+  const name = route && route.name
   if (!name) {
-    return false;
+    return false
   }
   return (
     name.toString().trim().toLocaleLowerCase() ===
-    "Dashboard".toLocaleLowerCase()
-  );
+    'Dashboard'.toLocaleLowerCase()
+  )
 }
 
 function handleLink(item: any) {
-  const { redirect, path } = item;
+  const { redirect, path } = item
   if (redirect) {
     router.push(redirect).catch((err) => {
-      console.warn(err);
-    });
-    return;
+      console.warn(err)
+    })
+    return
   }
   router.push(pathCompile(path)).catch((err) => {
-    console.warn(err);
-  });
+    console.warn(err)
+  })
 }
 
 watch(
   () => currentRoute.path,
   (path) => {
-    if (path.startsWith("/redirect/")) {
-      return;
+    if (path.startsWith('/redirect/')) {
+      return
     }
-    getBreadcrumb();
+    getBreadcrumb()
   }
-);
+)
 
 onBeforeMount(() => {
-  getBreadcrumb();
-});
+  getBreadcrumb()
+})
 </script>
 
 <style lang="scss" scoped>
diff --git a/src/components/Dictionary/index.vue b/src/components/Dictionary/index.vue
index b2e01d0f..1a03c030 100644
--- a/src/components/Dictionary/index.vue
+++ b/src/components/Dictionary/index.vue
@@ -16,7 +16,7 @@
 </template>
 
 <script setup lang="ts">
-import { getDictOptions } from "@/api/dict";
+import { getDictOptions } from '@/api/dict'
 
 const props = defineProps({
   /**
@@ -24,50 +24,50 @@ const props = defineProps({
    */
   typeCode: {
     type: String,
-    required: true,
+    required: true
   },
   modelValue: {
-    type: [String, Number],
+    type: [String, Number]
   },
   placeholder: {
     type: String,
-    default: "请选择",
+    default: '请选择'
   },
   disabled: {
     type: Boolean,
-    default: false,
-  },
-});
+    default: false
+  }
+})
 
-const emits = defineEmits(["update:modelValue"]); // 父组件监听事件，同步子组件值的变化给父组件
+const emits = defineEmits(['update:modelValue']) // 父组件监听事件，同步子组件值的变化给父组件
 
-const options: Ref<OptionType[]> = ref([]); // 字典下拉数据源
+const options: Ref<OptionType[]> = ref([]) // 字典下拉数据源
 
-const selectedValue = ref<string | number | undefined>();
+const selectedValue = ref<string | number | undefined>()
 
 watch([options, () => props.modelValue], ([newOptions, newModelValue]) => {
-  if (newOptions.length === 0) return; // 下拉数据源加载未完成不回显
+  if (newOptions.length === 0) return // 下拉数据源加载未完成不回显
   if (newModelValue == undefined) {
-    selectedValue.value = undefined;
-    return;
+    selectedValue.value = undefined
+    return
   }
-  if (typeof newOptions[0].value === "number") {
-    selectedValue.value = Number(newModelValue);
-  } else if (typeof newOptions[0].value === "string") {
-    selectedValue.value = String(newModelValue);
+  if (typeof newOptions[0].value === 'number') {
+    selectedValue.value = Number(newModelValue)
+  } else if (typeof newOptions[0].value === 'string') {
+    selectedValue.value = String(newModelValue)
   } else {
-    selectedValue.value = newModelValue;
+    selectedValue.value = newModelValue
   }
-});
+})
 
 function handleChange(val?: string | number | undefined) {
-  emits("update:modelValue", val);
+  emits('update:modelValue', val)
 }
 
 onBeforeMount(() => {
   // 根据字典类型编码(typeCode)获取字典选项
   getDictOptions(props.typeCode).then((response) => {
-    options.value = response.data;
-  });
-});
+    options.value = response.data
+  })
+})
 </script>
diff --git a/src/components/Hamburger/index.vue b/src/components/Hamburger/index.vue
index a9049d70..2d37a160 100644
--- a/src/components/Hamburger/index.vue
+++ b/src/components/Hamburger/index.vue
@@ -15,14 +15,14 @@ defineProps({
   isActive: {
     required: true,
     type: Boolean,
-    default: false,
-  },
-});
+    default: false
+  }
+})
 
-const emit = defineEmits(["toggleClick"]);
+const emit = defineEmits(['toggleClick'])
 
 function toggleClick() {
-  emit("toggleClick");
+  emit('toggleClick')
 }
 </script>
 
diff --git a/src/components/IconSelect/index.vue b/src/components/IconSelect/index.vue
index 8b26e7c5..528572d9 100644
--- a/src/components/IconSelect/index.vue
+++ b/src/components/IconSelect/index.vue
@@ -3,32 +3,32 @@ const props = defineProps({
   modelValue: {
     type: String,
     require: false,
-    default: "",
-  },
-});
+    default: ''
+  }
+})
 
-const emit = defineEmits(["update:modelValue"]);
-const inputValue = toRef(props, "modelValue");
+const emit = defineEmits(['update:modelValue'])
+const inputValue = toRef(props, 'modelValue')
 
-const visible = ref(false); // 弹窗显示状态
+const visible = ref(false) // 弹窗显示状态
 
-const allIconNames: string[] = []; // 所有的图标名称集合
+const allIconNames: string[] = [] // 所有的图标名称集合
 
-const filterValue = ref(""); // 筛选的值
-const filterIconNames = ref<string[]>([]); // 过滤后的图标名称集合
+const filterValue = ref('') // 筛选的值
+const filterIconNames = ref<string[]>([]) // 过滤后的图标名称集合
 
-const iconSelectorRef = ref();
-const iconSelectorDialogRef = ref();
+const iconSelectorRef = ref()
+const iconSelectorDialogRef = ref()
 /**
  * icon 加载
  */
 function loadIcons() {
-  const icons = import.meta.glob("../../assets/icons/*.svg");
+  const icons = import.meta.glob('../../assets/icons/*.svg')
   for (const icon in icons) {
-    const iconName = icon.split("assets/icons/")[1].split(".svg")[0];
-    allIconNames.push(iconName);
+    const iconName = icon.split('assets/icons/')[1].split('.svg')[0]
+    allIconNames.push(iconName)
   }
-  filterIconNames.value = allIconNames;
+  filterIconNames.value = allIconNames
 }
 
 /**
@@ -38,9 +38,9 @@ function handleFilter() {
   if (filterValue.value) {
     filterIconNames.value = allIconNames.filter((iconName) =>
       iconName.includes(filterValue.value)
-    );
+    )
   } else {
-    filterIconNames.value = allIconNames;
+    filterIconNames.value = allIconNames
   }
 }
 
@@ -48,20 +48,20 @@ function handleFilter() {
  * icon 选择
  */
 function handleSelect(iconName: string) {
-  emit("update:modelValue", iconName);
-  visible.value = false;
+  emit('update:modelValue', iconName)
+  visible.value = false
 }
 
 /**
  * 点击容器外的区域关闭弹窗 VueUse onClickOutside
  */
 onClickOutside(iconSelectorRef, () => (visible.value = false), {
-  ignore: [iconSelectorDialogRef],
-});
+  ignore: [iconSelectorDialogRef]
+})
 
 onMounted(() => {
-  loadIcons();
-});
+  loadIcons()
+})
 </script>
 
 <template>
diff --git a/src/components/LangSelect/index.vue b/src/components/LangSelect/index.vue
index 13feaf40..3e34251f 100644
--- a/src/components/LangSelect/index.vue
+++ b/src/components/LangSelect/index.vue
@@ -1,17 +1,17 @@
 <script setup lang="ts">
-import { useI18n } from "vue-i18n";
-import { useAppStore } from "@/store/modules/app";
+import { useI18n } from 'vue-i18n'
+import { useAppStore } from '@/store/modules/app'
 
-const appStore = useAppStore();
-const { locale } = useI18n();
+const appStore = useAppStore()
+const { locale } = useI18n()
 
 function handleLanguageChange(lang: string) {
-  locale.value = lang;
-  appStore.changeLanguage(lang);
-  if (lang === "en") {
-    ElMessage.success("Switch Language Successful!");
+  locale.value = lang
+  appStore.changeLanguage(lang)
+  if (lang === 'en') {
+    ElMessage.success('Switch Language Successful!')
   } else {
-    ElMessage.success("切换语言成功！");
+    ElMessage.success('切换语言成功！')
   }
 }
 </script>
diff --git a/src/components/Pagination/index.vue b/src/components/Pagination/index.vue
index 84e8f3e0..c4657169 100644
--- a/src/components/Pagination/index.vue
+++ b/src/components/Pagination/index.vue
@@ -14,65 +14,65 @@
 </template>
 
 <script setup lang="ts">
-import { PropType } from "vue";
-import { scrollTo } from "@/utils/scroll-to";
+import { PropType } from 'vue'
+import { scrollTo } from '@/utils/scroll-to'
 
 const props = defineProps({
   total: {
     required: true,
     type: Number as PropType<number>,
-    default: 0,
+    default: 0
   },
   page: {
     type: Number,
-    default: 1,
+    default: 1
   },
   limit: {
     type: Number,
-    default: 20,
+    default: 20
   },
   pageSizes: {
     type: Array as PropType<number[]>,
     default() {
-      return [10, 20, 30, 50];
-    },
+      return [10, 20, 30, 50]
+    }
   },
   layout: {
     type: String,
-    default: "total, sizes, prev, pager, next, jumper",
+    default: 'total, sizes, prev, pager, next, jumper'
   },
   background: {
     type: Boolean,
-    default: true,
+    default: true
   },
   autoScroll: {
     type: Boolean,
-    default: true,
+    default: true
   },
   hidden: {
     type: Boolean,
-    default: false,
-  },
-});
+    default: false
+  }
+})
 
-const emit = defineEmits(["pagination", "update:page", "update:limit"]);
+const emit = defineEmits(['pagination', 'update:page', 'update:limit'])
 
-const currentPage = useVModel(props, "page", emit);
+const currentPage = useVModel(props, 'page', emit)
 
-const pageSize = useVModel(props, "limit", emit);
+const pageSize = useVModel(props, 'limit', emit)
 
 function handleSizeChange(val: number) {
-  emit("pagination", { page: currentPage, limit: val });
+  emit('pagination', { page: currentPage, limit: val })
   if (props.autoScroll) {
-    scrollTo(0, 800);
+    scrollTo(0, 800)
   }
 }
 
 function handleCurrentChange(val: number) {
-  currentPage.value = val;
-  emit("pagination", { page: val, limit: props.limit });
+  currentPage.value = val
+  emit('pagination', { page: val, limit: props.limit })
   if (props.autoScroll) {
-    scrollTo(0, 800);
+    scrollTo(0, 800)
   }
 }
 </script>
diff --git a/src/components/RightPanel/index.vue b/src/components/RightPanel/index.vue
index 9dc5509c..13bcaef5 100644
--- a/src/components/RightPanel/index.vue
+++ b/src/components/RightPanel/index.vue
@@ -1,55 +1,55 @@
 <script setup lang="ts">
-import { onBeforeUnmount, onMounted, ref, watch } from "vue";
+import { onBeforeUnmount, onMounted, ref, watch } from 'vue'
 
-import { addClass, removeClass } from "@/utils/index";
+import { addClass, removeClass } from '@/utils/index'
 
-const show = ref(false);
+const show = ref(false)
 
 defineProps({
   buttonTop: {
     default: 250,
-    type: Number,
-  },
-});
+    type: Number
+  }
+})
 
 watch(show, (value) => {
   if (value) {
-    addEventClick();
+    addEventClick()
   }
   if (value) {
-    addClass(document.body, "showRightPanel");
+    addClass(document.body, 'showRightPanel')
   } else {
-    removeClass(document.body, "showRightPanel");
+    removeClass(document.body, 'showRightPanel')
   }
-});
+})
 
 function addEventClick() {
-  window.addEventListener("click", closeSidebar, { passive: true });
+  window.addEventListener('click', closeSidebar, { passive: true })
 }
 
 function closeSidebar(evt: any) {
   // 主题选择点击不关闭
-  let parent = evt.target.closest(".right-panel-container");
+  let parent = evt.target.closest('.right-panel-container')
   if (!parent) {
-    show.value = false;
-    window.removeEventListener("click", closeSidebar);
+    show.value = false
+    window.removeEventListener('click', closeSidebar)
   }
 }
 
-const rightPanel = ref();
+const rightPanel = ref()
 
 function insertToBody() {
-  const body = document.querySelector("body") as any;
-  body.insertBefore(rightPanel.value, body.firstChild);
+  const body = document.querySelector('body') as any
+  body.insertBefore(rightPanel.value, body.firstChild)
 }
 
 onMounted(() => {
-  insertToBody();
-});
+  insertToBody()
+})
 
 onBeforeUnmount(() => {
-  rightPanel.value.remove();
-});
+  rightPanel.value.remove()
+})
 </script>
 
 <template>
@@ -59,7 +59,7 @@ onBeforeUnmount(() => {
       <div
         class="right-panel-btn"
         :style="{
-          top: buttonTop + 'px',
+          top: buttonTop + 'px'
         }"
         @click="show = !show"
       >
diff --git a/src/components/SizeSelect/index.vue b/src/components/SizeSelect/index.vue
index f0800ba2..d036215c 100644
--- a/src/components/SizeSelect/index.vue
+++ b/src/components/SizeSelect/index.vue
@@ -1,17 +1,17 @@
 <script setup lang="ts">
-import { useAppStore } from "@/store/modules/app";
+import { useAppStore } from '@/store/modules/app'
 
-const appStore = useAppStore();
+const appStore = useAppStore()
 
 const sizeOptions = ref([
-  { label: "默认", value: "default" },
-  { label: "大型", value: "large" },
-  { label: "小型", value: "small" },
-]);
+  { label: '默认', value: 'default' },
+  { label: '大型', value: 'large' },
+  { label: '小型', value: 'small' }
+])
 
 function handleSizeChange(size: string) {
-  appStore.changeSize(size);
-  ElMessage.success("切换布局大小成功");
+  appStore.changeSize(size)
+  ElMessage.success('切换布局大小成功')
 }
 </script>
 
diff --git a/src/components/SvgIcon/index.vue b/src/components/SvgIcon/index.vue
index 07b65e8d..32214f26 100644
--- a/src/components/SvgIcon/index.vue
+++ b/src/components/SvgIcon/index.vue
@@ -12,24 +12,24 @@
 const props = defineProps({
   prefix: {
     type: String,
-    default: "icon",
+    default: 'icon'
   },
   iconClass: {
     type: String,
     required: false,
-    default: "",
+    default: ''
   },
   color: {
     type: String,
-    default: "",
+    default: ''
   },
   size: {
     type: String,
-    default: "1em",
-  },
-});
+    default: '1em'
+  }
+})
 
-const symbolId = computed(() => `#${props.prefix}-${props.iconClass}`);
+const symbolId = computed(() => `#${props.prefix}-${props.iconClass}`)
 </script>
 
 <style scoped>
diff --git a/src/components/Upload/MultiUpload.vue b/src/components/Upload/MultiUpload.vue
index 735f7a3e..deb8a968 100644
--- a/src/components/Upload/MultiUpload.vue
+++ b/src/components/Upload/MultiUpload.vue
@@ -28,11 +28,11 @@ import {
   UploadRequestOptions,
   UploadUserFile,
   UploadFile,
-  UploadProps,
-} from "element-plus";
-import { uploadFileApi, deleteFileApi } from "@/api/file";
+  UploadProps
+} from 'element-plus'
+import { uploadFileApi, deleteFileApi } from '@/api/file'
 
-const emit = defineEmits(["update:modelValue"]);
+const emit = defineEmits(['update:modelValue'])
 
 const props = defineProps({
   /**
@@ -40,25 +40,25 @@ const props = defineProps({
    */
   modelValue: {
     type: Array<string>,
-    default: () => [],
+    default: () => []
   },
   /**
    * 文件上传数量限制
    */
   limit: {
     type: Number,
-    default: 10,
-  },
-});
+    default: 10
+  }
+})
 
-const previewImgUrl = ref("");
-const dialogVisible = ref(false);
+const previewImgUrl = ref('')
+const dialogVisible = ref(false)
 
-const fileList = ref([] as UploadUserFile[]);
+const fileList = ref([] as UploadUserFile[])
 watch(
   () => props.modelValue,
   (newVal: string[]) => {
-    const filePaths = fileList.value.map((file) => file.url);
+    const filePaths = fileList.value.map((file) => file.url)
     // 监听modelValue文件集合值未变化时，跳过赋值
     if (
       filePaths.length > 0 &&
@@ -66,15 +66,15 @@ watch(
       filePaths.every((x) => newVal.some((y) => y === x)) &&
       newVal.every((y) => filePaths.some((x) => x === y))
     ) {
-      return;
+      return
     }
 
     fileList.value = newVal.map((filePath) => {
-      return { url: filePath } as UploadUserFile;
-    });
+      return { url: filePath } as UploadUserFile
+    })
   },
   { immediate: true }
-);
+)
 
 /**
  * 自定义图片上传
@@ -83,38 +83,38 @@ watch(
  */
 async function handleUpload(options: UploadRequestOptions): Promise<any> {
   // 上传API调用
-  const { data: fileInfo } = await uploadFileApi(options.file);
+  const { data: fileInfo } = await uploadFileApi(options.file)
 
   // 上传成功需手动替换文件路径为远程URL，否则图片地址为预览地址 blob:http://
   const fileIndex = fileList.value.findIndex(
     (file) => file.uid == (options.file as any).uid
-  );
+  )
 
   fileList.value.splice(fileIndex, 1, {
     name: fileInfo.name,
-    url: fileInfo.url,
-  } as UploadUserFile);
+    url: fileInfo.url
+  } as UploadUserFile)
 
   emit(
-    "update:modelValue",
+    'update:modelValue',
     fileList.value.map((file) => file.url)
-  );
+  )
 }
 
 /**
  * 删除图片
  */
 function handleRemove(removeFile: UploadFile) {
-  const filePath = removeFile.url;
+  const filePath = removeFile.url
 
   if (filePath) {
     deleteFileApi(filePath).then(() => {
       // 删除成功回调
       emit(
-        "update:modelValue",
+        'update:modelValue',
         fileList.value.map((file) => file.url)
-      );
-    });
+      )
+    })
   }
 }
 
@@ -123,17 +123,17 @@ function handleRemove(removeFile: UploadFile) {
  */
 function handleBeforeUpload(file: UploadRawFile) {
   if (file.size > 2 * 1048 * 1048) {
-    ElMessage.warning("上传图片不能大于2M");
-    return false;
+    ElMessage.warning('上传图片不能大于2M')
+    return false
   }
-  return true;
+  return true
 }
 
 /**
  * 预览图片
  */
-const previewImg: UploadProps["onPreview"] = (uploadFile) => {
-  previewImgUrl.value = uploadFile.url!;
-  dialogVisible.value = true;
-};
+const previewImg: UploadProps['onPreview'] = (uploadFile) => {
+  previewImgUrl.value = uploadFile.url!
+  dialogVisible.value = true
+}
 </script>
diff --git a/src/components/Upload/SingleUpload.vue b/src/components/Upload/SingleUpload.vue
index 631dc28e..d30718de 100644
--- a/src/components/Upload/SingleUpload.vue
+++ b/src/components/Upload/SingleUpload.vue
@@ -14,18 +14,18 @@
 </template>
 
 <script setup lang="ts">
-import { UploadRawFile, UploadRequestOptions } from "element-plus";
-import { uploadFileApi } from "@/api/file";
+import { UploadRawFile, UploadRequestOptions } from 'element-plus'
+import { uploadFileApi } from '@/api/file'
 
 const props = defineProps({
   modelValue: {
     type: String,
-    default: "",
-  },
-});
+    default: ''
+  }
+})
 
-const emit = defineEmits(["update:modelValue"]);
-const imgUrl = useVModel(props, "modelValue", emit);
+const emit = defineEmits(['update:modelValue'])
+const imgUrl = useVModel(props, 'modelValue', emit)
 
 /**
  * 自定义图片上传
@@ -33,8 +33,8 @@ const imgUrl = useVModel(props, "modelValue", emit);
  * @param options
  */
 async function uploadFile(options: UploadRequestOptions): Promise<any> {
-  const { data: fileInfo } = await uploadFileApi(options.file);
-  imgUrl.value = fileInfo.url;
+  const { data: fileInfo } = await uploadFileApi(options.file)
+  imgUrl.value = fileInfo.url
 }
 
 /**
@@ -42,10 +42,10 @@ async function uploadFile(options: UploadRequestOptions): Promise<any> {
  */
 function handleBeforeUpload(file: UploadRawFile) {
   if (file.size > 2 * 1048 * 1048) {
-    ElMessage.warning("上传图片不能大于2M");
-    return false;
+    ElMessage.warning('上传图片不能大于2M')
+    return false
   }
-  return true;
+  return true
 }
 </script>
 
diff --git a/src/components/WangEditor/index.vue b/src/components/WangEditor/index.vue
index 2f4c6782..f6a8e753 100644
--- a/src/components/WangEditor/index.vue
+++ b/src/components/WangEditor/index.vue
@@ -20,55 +20,55 @@
 </template>
 
 <script setup lang="ts">
-import { Editor, Toolbar } from "@wangeditor/editor-for-vue";
+import { Editor, Toolbar } from '@wangeditor/editor-for-vue'
 
 // API 引用
-import { uploadFileApi } from "@/api/file";
+import { uploadFileApi } from '@/api/file'
 
 const props = defineProps({
   modelValue: {
     type: [String],
-    default: "",
-  },
-});
+    default: ''
+  }
+})
 
-const emit = defineEmits(["update:modelValue"]);
+const emit = defineEmits(['update:modelValue'])
 
-const modelValue = useVModel(props, "modelValue", emit);
+const modelValue = useVModel(props, 'modelValue', emit)
 
-const editorRef = shallowRef(); // 编辑器实例，必须用 shallowRef
-const mode = ref("default"); // 编辑器模式
-const toolbarConfig = ref({}); // 工具条配置
+const editorRef = shallowRef() // 编辑器实例，必须用 shallowRef
+const mode = ref('default') // 编辑器模式
+const toolbarConfig = ref({}) // 工具条配置
 // 编辑器配置
 const editorConfig = ref({
-  placeholder: "请输入内容...",
+  placeholder: '请输入内容...',
   MENU_CONF: {
     uploadImage: {
       // 自定义图片上传
       async customUpload(file: any, insertFn: any) {
         uploadFileApi(file).then((response) => {
-          const url = response.data.url;
-          insertFn(url);
-        });
-      },
-    },
-  },
-});
+          const url = response.data.url
+          insertFn(url)
+        })
+      }
+    }
+  }
+})
 
 const handleCreated = (editor: any) => {
-  editorRef.value = editor; // 记录 editor 实例，重要！
-};
+  editorRef.value = editor // 记录 editor 实例，重要！
+}
 
 function handleChange(editor: any) {
-  modelValue.value = editor.getHtml();
+  modelValue.value = editor.getHtml()
 }
 
 // 组件销毁时，也及时销毁编辑器
 onBeforeUnmount(() => {
-  const editor = editorRef.value;
-  if (editor == null) return;
-  editor.destroy();
-});
+  const editor = editorRef.value
+  if (editor == null) return
+  editor.destroy()
+})
 </script>
 
 <style src="@wangeditor/editor/dist/css/style.css"></style>
diff --git a/src/directive/index.ts b/src/directive/index.ts
index 9c22eb69..f50e66d7 100644
--- a/src/directive/index.ts
+++ b/src/directive/index.ts
@@ -1,9 +1,9 @@
-import type { App } from "vue";
+import type { App } from 'vue'
 
-import { hasPerm } from "./permission";
+import { hasPerm } from './permission'
 
 // 全局注册 directive
 export function setupDirective(app: App<Element>) {
   // 使 v-hasPerm 在所有组件中都可用
-  app.directive("hasPerm", hasPerm);
+  app.directive('hasPerm', hasPerm)
 }
diff --git a/src/directive/permission/index.ts b/src/directive/permission/index.ts
index 2bd2c705..155e69d3 100644
--- a/src/directive/permission/index.ts
+++ b/src/directive/permission/index.ts
@@ -1,5 +1,5 @@
-import { useUserStoreHook } from "@/store/modules/user";
-import { Directive, DirectiveBinding } from "vue";
+import { useUserStoreHook } from '@/store/modules/user'
+import { Directive, DirectiveBinding } from 'vue'
 
 /**
  * 按钮权限
@@ -7,49 +7,49 @@ import { Directive, DirectiveBinding } from "vue";
 export const hasPerm: Directive = {
   mounted(el: HTMLElement, binding: DirectiveBinding) {
     // 「超级管理员」拥有所有的按钮权限
-    const { roles, perms } = useUserStoreHook().user;
-    if (roles.includes("ROOT")) {
-      return true;
+    const { roles, perms } = useUserStoreHook().user
+    if (roles.includes('ROOT')) {
+      return true
     }
     // 「其他角色」按钮权限校验
-    const { value } = binding;
+    const { value } = binding
     if (value) {
-      const requiredPerms = value; // DOM绑定需要的按钮权限标识
+      const requiredPerms = value // DOM绑定需要的按钮权限标识
 
       const hasPerm = perms?.some((perm) => {
-        return requiredPerms.includes(perm);
-      });
+        return requiredPerms.includes(perm)
+      })
 
       if (!hasPerm) {
-        el.parentNode && el.parentNode.removeChild(el);
+        el.parentNode && el.parentNode.removeChild(el)
       }
     } else {
       throw new Error(
         "need perms! Like v-has-perm=\"['sys:user:add','sys:user:edit']\""
-      );
+      )
     }
-  },
-};
+  }
+}
 
 /**
  * 角色权限
  */
 export const hasRole: Directive = {
   mounted(el: HTMLElement, binding: DirectiveBinding) {
-    const { value } = binding;
+    const { value } = binding
 
     if (value) {
-      const requiredRoles = value; // DOM绑定需要的角色编码
-      const { roles } = useUserStoreHook().user;
+      const requiredRoles = value // DOM绑定需要的角色编码
+      const { roles } = useUserStoreHook().user
       const hasRole = roles.some((perm) => {
-        return requiredRoles.includes(perm);
-      });
+        return requiredRoles.includes(perm)
+      })
 
       if (!hasRole) {
-        el.parentNode && el.parentNode.removeChild(el);
+        el.parentNode && el.parentNode.removeChild(el)
       }
     } else {
-      throw new Error("need roles! Like v-has-role=\"['admin','test']\"");
+      throw new Error("need roles! Like v-has-role=\"['admin','test']\"")
     }
-  },
-};
+  }
+}
diff --git a/src/enums/MenuTypeEnum.ts b/src/enums/MenuTypeEnum.ts
index 65e591db..96c612e4 100644
--- a/src/enums/MenuTypeEnum.ts
+++ b/src/enums/MenuTypeEnum.ts
@@ -2,18 +2,18 @@ export enum MenuTypeEnum {
   /**
    * 目录
    */
-  CATALOG = "CATALOG",
+  CATALOG = 'CATALOG',
   /**
    * 菜单
    */
-  MENU = "MENU",
+  MENU = 'MENU',
 
   /**
    * 按钮
    */
-  BUTTON = "BUTTON",
+  BUTTON = 'BUTTON',
   /**
    * 外链
    */
-  EXTLINK = "EXTLINK",
+  EXTLINK = 'EXTLINK'
 }
diff --git a/src/lang/index.ts b/src/lang/index.ts
index 18c02316..7a0318a9 100644
--- a/src/lang/index.ts
+++ b/src/lang/index.ts
@@ -1,25 +1,25 @@
-import { createI18n } from "vue-i18n";
-import { useAppStore } from "@/store/modules/app";
+import { createI18n } from 'vue-i18n'
+import { useAppStore } from '@/store/modules/app'
 // 本地语言包
-import enLocale from "./package/en";
-import zhCnLocale from "./package/zh-cn";
+import enLocale from './package/en'
+import zhCnLocale from './package/zh-cn'
 
-const appStore = useAppStore();
+const appStore = useAppStore()
 
 const messages = {
-  "zh-cn": {
-    ...zhCnLocale,
+  'zh-cn': {
+    ...zhCnLocale
   },
   en: {
-    ...enLocale,
-  },
-};
+    ...enLocale
+  }
+}
 
 const i18n = createI18n({
   legacy: false,
   locale: appStore.language,
   messages: messages,
-  globalInjection: true,
-});
+  globalInjection: true
+})
 
-export default i18n;
+export default i18n
diff --git a/src/lang/package/en.ts b/src/lang/package/en.ts
index e7bbb53c..26c6bc90 100644
--- a/src/lang/package/en.ts
+++ b/src/lang/package/en.ts
@@ -1,21 +1,21 @@
 export default {
   // 路由国际化
   route: {
-    dashboard: "Dashboard",
-    document: "Document",
+    dashboard: 'Dashboard',
+    document: 'Document'
   },
   // 登录页面国际化
   login: {
-    username: "Username",
-    password: "Password",
-    login: "Login",
-    captchaCode: "Verify Code",
+    username: 'Username',
+    password: 'Password',
+    login: 'Login',
+    captchaCode: 'Verify Code'
   },
   // 导航栏国际化
   navbar: {
-    dashboard: "Dashboard",
-    logout: "Logout",
-    document: "Document",
-    gitee: "Gitee",
-  },
-};
+    dashboard: 'Dashboard',
+    logout: 'Logout',
+    document: 'Document',
+    gitee: 'Gitee'
+  }
+}
diff --git a/src/lang/package/zh-cn.ts b/src/lang/package/zh-cn.ts
index ed901433..7f27c307 100644
--- a/src/lang/package/zh-cn.ts
+++ b/src/lang/package/zh-cn.ts
@@ -1,21 +1,21 @@
 export default {
   // 路由国际化
   route: {
-    dashboard: "首页",
-    document: "项目文档",
+    dashboard: '首页',
+    document: '项目文档'
   },
   // 登录页面国际化
   login: {
-    username: "用户名",
-    password: "密码",
-    login: "登 录",
-    captchaCode: "验证码",
+    username: '用户名',
+    password: '密码',
+    login: '登 录',
+    captchaCode: '验证码'
   },
   // 导航栏国际化
   navbar: {
-    dashboard: "首页",
-    logout: "注销",
-    document: "项目文档",
-    gitee: "码云",
-  },
-};
+    dashboard: '首页',
+    logout: '注销',
+    document: '项目文档',
+    gitee: '码云'
+  }
+}
diff --git a/src/layout/components/AppMain.vue b/src/layout/components/AppMain.vue
index 4d24b3ff..61dcee7c 100644
--- a/src/layout/components/AppMain.vue
+++ b/src/layout/components/AppMain.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import { useTagsViewStore } from "@/store/modules/tagsView";
+import { useTagsViewStore } from '@/store/modules/tagsView'
 
-const tagsViewStore = useTagsViewStore();
+const tagsViewStore = useTagsViewStore()
 </script>
 
 <template>
diff --git a/src/layout/components/NavBar/NavRight.vue b/src/layout/components/NavBar/NavRight.vue
index 904f0182..171e6d23 100644
--- a/src/layout/components/NavBar/NavRight.vue
+++ b/src/layout/components/NavBar/NavRight.vue
@@ -20,7 +20,7 @@
     <template #dropdown>
       <el-dropdown-menu>
         <router-link to="/">
-          <el-dropdown-item>{{ $t("navbar.dashboard") }}</el-dropdown-item>
+          <el-dropdown-item>{{ $t('navbar.dashboard') }}</el-dropdown-item>
         </router-link>
         <a
           target="_blank"
@@ -29,57 +29,57 @@
           <el-dropdown-item>Github</el-dropdown-item>
         </a>
         <a target="_blank" href="https://gitee.com/haoxr">
-          <el-dropdown-item>{{ $t("navbar.gitee") }}</el-dropdown-item>
+          <el-dropdown-item>{{ $t('navbar.gitee') }}</el-dropdown-item>
         </a>
         <a target="_blank" href="https://juejin.cn/post/7228990409909108793">
-          <el-dropdown-item>{{ $t("navbar.document") }}</el-dropdown-item>
+          <el-dropdown-item>{{ $t('navbar.document') }}</el-dropdown-item>
         </a>
         <el-dropdown-item divided @click="logout">
-          {{ $t("navbar.logout") }}
+          {{ $t('navbar.logout') }}
         </el-dropdown-item>
       </el-dropdown-menu>
     </template>
   </el-dropdown>
 </template>
 <script setup lang="ts">
-import { storeToRefs } from "pinia";
-import { useRoute, useRouter } from "vue-router";
-import { useAppStore } from "@/store/modules/app";
-import { useTagsViewStore } from "@/store/modules/tagsView";
-import { useUserStore } from "@/store/modules/user";
+import { storeToRefs } from 'pinia'
+import { useRoute, useRouter } from 'vue-router'
+import { useAppStore } from '@/store/modules/app'
+import { useTagsViewStore } from '@/store/modules/tagsView'
+import { useUserStore } from '@/store/modules/user'
 
-const appStore = useAppStore();
-const tagsViewStore = useTagsViewStore();
-const userStore = useUserStore();
+const appStore = useAppStore()
+const tagsViewStore = useTagsViewStore()
+const userStore = useUserStore()
 
-const route = useRoute();
-const router = useRouter();
+const route = useRoute()
+const router = useRouter()
 
-const { device } = storeToRefs(appStore); // 设备类型：desktop-宽屏设备 || mobile-窄屏设备
+const { device } = storeToRefs(appStore) // 设备类型：desktop-宽屏设备 || mobile-窄屏设备
 
 /**
  * vueUse 全屏
  */
-const { isFullscreen, toggle } = useFullscreen();
+const { isFullscreen, toggle } = useFullscreen()
 
 /**
  * 注销
  */
 function logout() {
-  ElMessageBox.confirm("确定注销并退出系统吗？", "提示", {
-    confirmButtonText: "确定",
-    cancelButtonText: "取消",
-    type: "warning",
+  ElMessageBox.confirm('确定注销并退出系统吗？', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
   }).then(() => {
     userStore
       .logout()
       .then(() => {
-        tagsViewStore.delAllViews();
+        tagsViewStore.delAllViews()
       })
       .then(() => {
-        router.push(`/login?redirect=${route.fullPath}`);
-      });
-  });
+        router.push(`/login?redirect=${route.fullPath}`)
+      })
+  })
 }
 </script>
 <style lang="scss" scoped>
diff --git a/src/layout/components/NavBar/index.vue b/src/layout/components/NavBar/index.vue
index e935d450..97ca2f89 100644
--- a/src/layout/components/NavBar/index.vue
+++ b/src/layout/components/NavBar/index.vue
@@ -1,13 +1,13 @@
 <script setup lang="ts">
-import { useAppStore } from "@/store/modules/app";
+import { useAppStore } from '@/store/modules/app'
 
-const appStore = useAppStore();
+const appStore = useAppStore()
 
 /**
  * 左侧菜单栏显示/隐藏
  */
 function toggleSideBar() {
-  appStore.toggleSidebar();
+  appStore.toggleSidebar()
 }
 </script>
 
diff --git a/src/layout/components/Settings/index.vue b/src/layout/components/Settings/index.vue
index 6caa9965..ff9de51b 100644
--- a/src/layout/components/Settings/index.vue
+++ b/src/layout/components/Settings/index.vue
@@ -1,93 +1,93 @@
 <script setup lang="ts">
-import { useSettingsStore } from "@/store/modules/settings";
-import { usePermissionStore } from "@/store/modules/permission";
-import { useAppStore } from "@/store/modules/app";
-import { useRoute } from "vue-router";
+import { useSettingsStore } from '@/store/modules/settings'
+import { usePermissionStore } from '@/store/modules/permission'
+import { useAppStore } from '@/store/modules/app'
+import { useRoute } from 'vue-router'
 
-const route = useRoute();
+const route = useRoute()
 
-const settingsStore = useSettingsStore();
-const permissionStore = usePermissionStore();
-const appStore = useAppStore();
+const settingsStore = useSettingsStore()
+const permissionStore = usePermissionStore()
+const appStore = useAppStore()
 
 function findOutermostParent(tree: any[], findName: string) {
-  let parentMap: any = {};
+  let parentMap: any = {}
 
   function buildParentMap(node: any, parent: any) {
-    parentMap[node.name] = parent;
+    parentMap[node.name] = parent
 
     if (node.children) {
       for (let i = 0; i < node.children.length; i++) {
-        buildParentMap(node.children[i], node);
+        buildParentMap(node.children[i], node)
       }
     }
   }
 
   for (let i = 0; i < tree.length; i++) {
-    buildParentMap(tree[i], null);
+    buildParentMap(tree[i], null)
   }
 
-  let currentNode = parentMap[findName];
+  let currentNode = parentMap[findName]
   while (currentNode) {
     if (!parentMap[currentNode.name]) {
-      return currentNode;
+      return currentNode
     }
-    currentNode = parentMap[currentNode.name];
+    currentNode = parentMap[currentNode.name]
   }
 
-  return null;
+  return null
 }
 const againActiveTop = (newVal: string) => {
-  const parent = findOutermostParent(permissionStore.routes, newVal);
+  const parent = findOutermostParent(permissionStore.routes, newVal)
   if (appStore.activeTopMenu !== parent.path) {
-    appStore.changeTopActive(parent.path);
+    appStore.changeTopActive(parent.path)
   }
-};
+}
 
 /**
  * 切换布局
  */
 function changeLayout(layout: string) {
-  settingsStore.changeSetting({ key: "layout", value: layout });
-  window.document.body.setAttribute("layout", settingsStore.layout);
-  if (layout === "mix") {
-    route.name && againActiveTop(route.name as string);
+  settingsStore.changeSetting({ key: 'layout', value: layout })
+  window.document.body.setAttribute('layout', settingsStore.layout)
+  if (layout === 'mix') {
+    route.name && againActiveTop(route.name as string)
   }
 }
 
 // 主题颜色
 const themeColors = ref<string[]>([
-  "#409EFF",
-  "#304156",
-  "#11a983",
-  "#13c2c2",
-  "#6959CD",
-  "#f5222d",
-]);
+  '#409EFF',
+  '#304156',
+  '#11a983',
+  '#13c2c2',
+  '#6959CD',
+  '#f5222d'
+])
 
 /**
  * 切换主题颜色
  */
 function changeThemeColor(color: string) {
-  document.documentElement.style.setProperty("--el-color-primary", color);
-  settingsStore.changeSetting({ key: "themeColor", value: color });
+  document.documentElement.style.setProperty('--el-color-primary', color)
+  settingsStore.changeSetting({ key: 'themeColor', value: color })
 }
 
 const currentThemeColor = computed(() => {
-  return settingsStore.themeColor;
-});
+  return settingsStore.themeColor
+})
 onMounted(() => {
-  window.document.body.setAttribute("layout", settingsStore.layout);
-  const theme = settingsStore.theme;
-  if (theme == "dark") {
-    document.documentElement.classList.add("dark");
+  window.document.body.setAttribute('layout', settingsStore.layout)
+  const theme = settingsStore.theme
+  if (theme == 'dark') {
+    document.documentElement.classList.add('dark')
   }
 
   document.documentElement.style.setProperty(
-    "--el-color-primary",
+    '--el-color-primary',
     settingsStore.themeColor
-  );
-});
+  )
+})
 </script>
 
 <template>
diff --git a/src/layout/components/Sidebar/Item.vue b/src/layout/components/Sidebar/Item.vue
index 6524a0a8..330f8fa1 100644
--- a/src/layout/components/Sidebar/Item.vue
+++ b/src/layout/components/Sidebar/Item.vue
@@ -5,18 +5,18 @@
 </template>
 
 <script setup lang="ts">
-import { translateRouteTitle } from "@/utils/i18n";
+import { translateRouteTitle } from '@/utils/i18n'
 
 defineProps({
   icon: {
     type: String,
-    default: "",
+    default: ''
   },
   title: {
     type: String,
-    default: "",
-  },
-});
+    default: ''
+  }
+})
 </script>
 
 <style scoped>
diff --git a/src/layout/components/Sidebar/LeftMenu.vue b/src/layout/components/Sidebar/LeftMenu.vue
index 16d13282..e256c70a 100644
--- a/src/layout/components/Sidebar/LeftMenu.vue
+++ b/src/layout/components/Sidebar/LeftMenu.vue
@@ -1,30 +1,30 @@
 <script lang="ts" setup>
-import { useRoute } from "vue-router";
-import SidebarItem from "./SidebarItem.vue";
-import { useSettingsStore } from "@/store/modules/settings";
-import { useAppStore } from "@/store/modules/app";
-import variables from "@/styles/variables.module.scss";
+import { useRoute } from 'vue-router'
+import SidebarItem from './SidebarItem.vue'
+import { useSettingsStore } from '@/store/modules/settings'
+import { useAppStore } from '@/store/modules/app'
+import variables from '@/styles/variables.module.scss'
 
-import path from "path-browserify";
-import { isExternal } from "@/utils/index";
+import path from 'path-browserify'
+import { isExternal } from '@/utils/index'
 
-const settingsStore = useSettingsStore();
-const appStore = useAppStore();
-const currRoute = useRoute();
-const layout = computed(() => settingsStore.layout);
+const settingsStore = useSettingsStore()
+const appStore = useAppStore()
+const currRoute = useRoute()
+const layout = computed(() => settingsStore.layout)
 const props = defineProps({
   menuList: {
     required: true,
     default: () => {
-      return [];
+      return []
     },
-    type: Array<any>,
+    type: Array<any>
   },
   basePath: {
     type: String,
-    required: true,
-  },
-});
+    required: true
+  }
+})
 
 /**
  * 解析路径
@@ -33,15 +33,15 @@ const props = defineProps({
  */
 function resolvePath(routePath: string) {
   if (isExternal(routePath)) {
-    return routePath;
+    return routePath
   }
   if (isExternal(props.basePath)) {
-    return props.basePath;
+    return props.basePath
   }
 
   // 完整路径 = 父级路径(/level/level_3) + 路由路径
-  const fullPath = path.resolve(props.basePath, routePath); // 相对路径 → 绝对路径
-  return fullPath;
+  const fullPath = path.resolve(props.basePath, routePath) // 相对路径 → 绝对路径
+  return fullPath
 }
 </script>
 <template>
diff --git a/src/layout/components/Sidebar/Link.vue b/src/layout/components/Sidebar/Link.vue
index 536a5d60..5160cd50 100644
--- a/src/layout/components/Sidebar/Link.vue
+++ b/src/layout/components/Sidebar/Link.vue
@@ -1,29 +1,29 @@
 <script lang="ts" setup>
-import { isExternal } from "@/utils/index";
-import { useRouter } from "vue-router";
+import { isExternal } from '@/utils/index'
+import { useRouter } from 'vue-router'
 
-import { useAppStore } from "@/store/modules/app";
+import { useAppStore } from '@/store/modules/app'
 
-const appStore = useAppStore();
+const appStore = useAppStore()
 
-const sidebar = computed(() => appStore.sidebar);
-const device = computed(() => appStore.device);
+const sidebar = computed(() => appStore.sidebar)
+const device = computed(() => appStore.device)
 
 const props = defineProps({
   to: {
     type: String,
-    required: true,
-  },
-});
+    required: true
+  }
+})
 
-const router = useRouter();
+const router = useRouter()
 function push() {
-  if (device.value === "mobile" && sidebar.value.opened == true) {
-    appStore.closeSideBar(false);
+  if (device.value === 'mobile' && sidebar.value.opened == true) {
+    appStore.closeSideBar(false)
   }
   router.push(props.to).catch((err) => {
-    console.error(err);
-  });
+    console.error(err)
+  })
 }
 </script>
 
diff --git a/src/layout/components/Sidebar/Logo.vue b/src/layout/components/Sidebar/Logo.vue
index 468d7ffe..d2e385f4 100644
--- a/src/layout/components/Sidebar/Logo.vue
+++ b/src/layout/components/Sidebar/Logo.vue
@@ -1,17 +1,17 @@
 <script lang="ts" setup>
-import defaultSettings from "@/settings";
-import { useSettingsStore } from "@/store/modules/settings";
+import defaultSettings from '@/settings'
+import { useSettingsStore } from '@/store/modules/settings'
 
-const settingsStore = useSettingsStore();
+const settingsStore = useSettingsStore()
 
 defineProps({
   collapse: {
     type: Boolean,
-    required: true,
-  },
-});
+    required: true
+  }
+})
 
-const logo = ref(new URL(`../../../assets/logo.png`, import.meta.url).href);
+const logo = ref(new URL(`../../../assets/logo.png`, import.meta.url).href)
 </script>
 
 <template>
diff --git a/src/layout/components/Sidebar/SidebarItem.vue b/src/layout/components/Sidebar/SidebarItem.vue
index fefbae68..b959d56e 100644
--- a/src/layout/components/Sidebar/SidebarItem.vue
+++ b/src/layout/components/Sidebar/SidebarItem.vue
@@ -1,10 +1,10 @@
 <script setup lang="ts">
-import path from "path-browserify";
-import { isExternal } from "@/utils/index";
-import AppLink from "./Link.vue";
-import { RouteRecordRaw } from "vue-router";
+import path from 'path-browserify'
+import { isExternal } from '@/utils/index'
+import AppLink from './Link.vue'
+import { RouteRecordRaw } from 'vue-router'
 
-import Item from "./Item.vue";
+import Item from './Item.vue'
 
 const props = defineProps({
   /**
@@ -12,7 +12,7 @@ const props = defineProps({
    */
   item: {
     type: Object,
-    required: true,
+    required: true
   },
 
   /**
@@ -20,15 +20,15 @@ const props = defineProps({
    */
   basePath: {
     type: String,
-    required: true,
+    required: true
   },
   isNest: {
     type: Boolean,
-    default: false,
-  },
-});
+    default: false
+  }
+})
 
-const onlyOneChild = ref(); // 临时变量，唯一子路由
+const onlyOneChild = ref() // 临时变量，唯一子路由
 
 /**
  * 判断当前路由是否只有一个子路由
@@ -47,26 +47,26 @@ function hasOneShowingChild(
   const showingChildren = children.filter((route: RouteRecordRaw) => {
     if (route.meta?.hidden) {
       // 过滤不显示的子路由
-      return false;
+      return false
     } else {
-      route.meta!.hidden = false;
+      route.meta!.hidden = false
       // 临时变量（多个子路由 onlyOneChild 变量是用不上的）
-      onlyOneChild.value = route;
-      return true;
+      onlyOneChild.value = route
+      return true
     }
-  });
+  })
 
   // 如果只有一个子路由, 返回 true
   if (showingChildren.length === 1) {
-    return true;
+    return true
   }
 
   // 如果没有子路由，显示父级路由
   if (showingChildren.length === 0) {
-    onlyOneChild.value = { ...parent, path: "", noShowingChildren: true };
-    return true;
+    onlyOneChild.value = { ...parent, path: '', noShowingChildren: true }
+    return true
   }
-  return false;
+  return false
 }
 
 /**
@@ -76,15 +76,15 @@ function hasOneShowingChild(
  */
 function resolvePath(routePath: string) {
   if (isExternal(routePath)) {
-    return routePath;
+    return routePath
   }
   if (isExternal(props.basePath)) {
-    return props.basePath;
+    return props.basePath
   }
 
   // 完整路径(/system/user) = 父级路径(/system) + 路由路径(user)
-  const fullPath = path.resolve(props.basePath, routePath);
-  return fullPath;
+  const fullPath = path.resolve(props.basePath, routePath)
+  return fullPath
 }
 </script>
 <template>
diff --git a/src/layout/components/Sidebar/TopMenu.vue b/src/layout/components/Sidebar/TopMenu.vue
index 485f83d9..b4646b32 100644
--- a/src/layout/components/Sidebar/TopMenu.vue
+++ b/src/layout/components/Sidebar/TopMenu.vue
@@ -1,37 +1,37 @@
 <script lang="ts" setup>
-import { usePermissionStore } from "@/store/modules/permission";
-import variables from "@/styles/variables.module.scss";
-import { useAppStore } from "@/store/modules/app";
-import { translateRouteTitle } from "@/utils/i18n";
-import { useRouter } from "vue-router";
-const appStore = useAppStore();
-const activePath = computed(() => appStore.activeTopMenu);
-const router = useRouter();
+import { usePermissionStore } from '@/store/modules/permission'
+import variables from '@/styles/variables.module.scss'
+import { useAppStore } from '@/store/modules/app'
+import { translateRouteTitle } from '@/utils/i18n'
+import { useRouter } from 'vue-router'
+const appStore = useAppStore()
+const activePath = computed(() => appStore.activeTopMenu)
+const router = useRouter()
 // 递归跳转
 const goFirst = (menu: any[]) => {
-  if (!menu.length) return;
-  const [first] = menu;
+  if (!menu.length) return
+  const [first] = menu
   if (first.children) {
-    goFirst(first.children);
+    goFirst(first.children)
   } else {
     router.push({
-      name: first.name,
-    });
+      name: first.name
+    })
   }
-};
+}
 const selectMenu = (index: string) => {
-  appStore.changeTopActive(index);
-  permissionStore.getMixLeftMenu(index);
-  const { mixLeftMenu } = permissionStore;
-  goFirst(mixLeftMenu);
-};
-const permissionStore = usePermissionStore();
-const topMenu = ref<any[]>([]);
+  appStore.changeTopActive(index)
+  permissionStore.getMixLeftMenu(index)
+  const { mixLeftMenu } = permissionStore
+  goFirst(mixLeftMenu)
+}
+const permissionStore = usePermissionStore()
+const topMenu = ref<any[]>([])
 onMounted(() => {
   topMenu.value = permissionStore.routes.filter(
     (item) => !item.meta || !item.meta.hidden
-  );
-});
+  )
+})
 </script>
 <template>
   <el-scrollbar>
diff --git a/src/layout/components/Sidebar/index.vue b/src/layout/components/Sidebar/index.vue
index 08206d0a..1725434f 100644
--- a/src/layout/components/Sidebar/index.vue
+++ b/src/layout/components/Sidebar/index.vue
@@ -1,27 +1,27 @@
 <script setup lang="ts">
-import TopMenu from "./TopMenu.vue";
-import LeftMenu from "./LeftMenu.vue";
-import Logo from "./Logo.vue";
-import { useSettingsStore } from "@/store/modules/settings";
-import { usePermissionStore } from "@/store/modules/permission";
-import { useAppStore } from "@/store/modules/app";
-import { storeToRefs } from "pinia";
+import TopMenu from './TopMenu.vue'
+import LeftMenu from './LeftMenu.vue'
+import Logo from './Logo.vue'
+import { useSettingsStore } from '@/store/modules/settings'
+import { usePermissionStore } from '@/store/modules/permission'
+import { useAppStore } from '@/store/modules/app'
+import { storeToRefs } from 'pinia'
 
-const settingsStore = useSettingsStore();
-const permissionStore = usePermissionStore();
-const appStore = useAppStore();
-const { sidebarLogo } = storeToRefs(settingsStore);
-const layout = computed(() => settingsStore.layout);
-const showContent = ref(true);
+const settingsStore = useSettingsStore()
+const permissionStore = usePermissionStore()
+const appStore = useAppStore()
+const { sidebarLogo } = storeToRefs(settingsStore)
+const layout = computed(() => settingsStore.layout)
+const showContent = ref(true)
 watch(
   () => layout.value,
   () => {
-    showContent.value = false;
+    showContent.value = false
     nextTick(() => {
-      showContent.value = true;
-    });
+      showContent.value = true
+    })
   }
-);
+)
 </script>
 
 <template>
diff --git a/src/layout/components/TagsView/ScrollPane.vue b/src/layout/components/TagsView/ScrollPane.vue
index 7e8cad17..73d8dde1 100644
--- a/src/layout/components/TagsView/ScrollPane.vue
+++ b/src/layout/components/TagsView/ScrollPane.vue
@@ -1,71 +1,69 @@
 <script setup lang="ts">
-import { useTagsViewStore } from "@/store/modules/tagsView";
+import { useTagsViewStore } from '@/store/modules/tagsView'
 
-const tagAndTagSpacing = ref(4);
-const { proxy } = getCurrentInstance() as any;
+const tagAndTagSpacing = ref(4)
+const { proxy } = getCurrentInstance() as any
 
-const emits = defineEmits(["scroll"]);
+const emits = defineEmits(['scroll'])
 const emitScroll = () => {
-  emits("scroll");
-};
+  emits('scroll')
+}
 
-const tagsViewStore = useTagsViewStore();
+const tagsViewStore = useTagsViewStore()
 
-const scrollWrapper = computed(
-  () => proxy?.$refs.scrollContainer.$refs.wrapRef
-);
+const scrollWrapper = computed(() => proxy?.$refs.scrollContainer.$refs.wrapRef)
 
 onMounted(() => {
-  scrollWrapper.value.addEventListener("scroll", emitScroll, true);
-});
+  scrollWrapper.value.addEventListener('scroll', emitScroll, true)
+})
 onBeforeUnmount(() => {
-  scrollWrapper.value.removeEventListener("scroll", emitScroll);
-});
+  scrollWrapper.value.removeEventListener('scroll', emitScroll)
+})
 
 function handleScroll(e: WheelEvent) {
-  const eventDelta = (e as any).wheelDelta || -e.deltaY * 40;
+  const eventDelta = (e as any).wheelDelta || -e.deltaY * 40
   scrollWrapper.value.scrollLeft =
-    scrollWrapper.value.scrollLeft + eventDelta / 4;
+    scrollWrapper.value.scrollLeft + eventDelta / 4
 }
 
 function moveToTarget(currentTag: TagView) {
-  const $container = proxy.$refs.scrollContainer.$el;
-  const $containerWidth = $container.offsetWidth;
-  const $scrollWrapper = scrollWrapper.value;
+  const $container = proxy.$refs.scrollContainer.$el
+  const $containerWidth = $container.offsetWidth
+  const $scrollWrapper = scrollWrapper.value
 
-  let firstTag = null;
-  let lastTag = null;
+  let firstTag = null
+  let lastTag = null
 
   // find first tag and last tag
   if (tagsViewStore.visitedViews.length > 0) {
-    firstTag = tagsViewStore.visitedViews[0];
-    lastTag = tagsViewStore.visitedViews[tagsViewStore.visitedViews.length - 1];
+    firstTag = tagsViewStore.visitedViews[0]
+    lastTag = tagsViewStore.visitedViews[tagsViewStore.visitedViews.length - 1]
   }
 
   if (firstTag === currentTag) {
-    $scrollWrapper.scrollLeft = 0;
+    $scrollWrapper.scrollLeft = 0
   } else if (lastTag === currentTag) {
-    $scrollWrapper.scrollLeft = $scrollWrapper.scrollWidth - $containerWidth;
+    $scrollWrapper.scrollLeft = $scrollWrapper.scrollWidth - $containerWidth
   } else {
-    const tagListDom = document.getElementsByClassName("tags-item");
+    const tagListDom = document.getElementsByClassName('tags-item')
     const currentIndex = tagsViewStore.visitedViews.findIndex(
       (item) => item === currentTag
-    );
-    let prevTag = null;
-    let nextTag = null;
+    )
+    let prevTag = null
+    let nextTag = null
     for (const k in tagListDom) {
-      if (k !== "length" && Object.hasOwnProperty.call(tagListDom, k)) {
+      if (k !== 'length' && Object.hasOwnProperty.call(tagListDom, k)) {
         if (
           (tagListDom[k] as any).dataset.path ===
           tagsViewStore.visitedViews[currentIndex - 1].path
         ) {
-          prevTag = tagListDom[k];
+          prevTag = tagListDom[k]
         }
         if (
           (tagListDom[k] as any).dataset.path ===
           tagsViewStore.visitedViews[currentIndex + 1].path
         ) {
-          nextTag = tagListDom[k];
+          nextTag = tagListDom[k]
         }
       }
     }
@@ -74,22 +72,22 @@ function moveToTarget(currentTag: TagView) {
     const afterNextTagOffsetLeft =
       (nextTag as any).offsetLeft +
       (nextTag as any).offsetWidth +
-      tagAndTagSpacing.value;
+      tagAndTagSpacing.value
 
     // the tag's offsetLeft before of prevTag
     const beforePrevTagOffsetLeft =
-      (prevTag as any).offsetLeft - tagAndTagSpacing.value;
+      (prevTag as any).offsetLeft - tagAndTagSpacing.value
     if (afterNextTagOffsetLeft > $scrollWrapper.scrollLeft + $containerWidth) {
-      $scrollWrapper.scrollLeft = afterNextTagOffsetLeft - $containerWidth;
+      $scrollWrapper.scrollLeft = afterNextTagOffsetLeft - $containerWidth
     } else if (beforePrevTagOffsetLeft < $scrollWrapper.scrollLeft) {
-      $scrollWrapper.scrollLeft = beforePrevTagOffsetLeft;
+      $scrollWrapper.scrollLeft = beforePrevTagOffsetLeft
     }
   }
 }
 
 defineExpose({
-  moveToTarget,
-});
+  moveToTarget
+})
 </script>
 
 <template>
diff --git a/src/layout/components/TagsView/index.vue b/src/layout/components/TagsView/index.vue
index aa6267b4..cf2f243f 100644
--- a/src/layout/components/TagsView/index.vue
+++ b/src/layout/components/TagsView/index.vue
@@ -57,110 +57,110 @@
 </template>
 
 <script setup lang="ts">
-import { storeToRefs } from "pinia";
-import { useRoute, useRouter, RouteRecordRaw } from "vue-router";
-import { resolve } from "path-browserify";
+import { storeToRefs } from 'pinia'
+import { useRoute, useRouter, RouteRecordRaw } from 'vue-router'
+import { resolve } from 'path-browserify'
 
-import { translateRouteTitle } from "@/utils/i18n";
+import { translateRouteTitle } from '@/utils/i18n'
 
-import { usePermissionStore } from "@/store/modules/permission";
-import { useTagsViewStore } from "@/store/modules/tagsView";
-import { useSettingsStore } from "@/store/modules/settings";
-import { useAppStore } from "@/store/modules/app";
+import { usePermissionStore } from '@/store/modules/permission'
+import { useTagsViewStore } from '@/store/modules/tagsView'
+import { useSettingsStore } from '@/store/modules/settings'
+import { useAppStore } from '@/store/modules/app'
 
-import ScrollPane from "./ScrollPane.vue";
+import ScrollPane from './ScrollPane.vue'
 
-const { proxy } = getCurrentInstance()!;
-const router = useRouter();
-const route = useRoute();
+const { proxy } = getCurrentInstance()!
+const router = useRouter()
+const route = useRoute()
 
-const permissionStore = usePermissionStore();
-const tagsViewStore = useTagsViewStore();
-const appStore = useAppStore();
+const permissionStore = usePermissionStore()
+const tagsViewStore = useTagsViewStore()
+const appStore = useAppStore()
 
-const { visitedViews } = storeToRefs(tagsViewStore);
-console.log("visitedViews", visitedViews);
-const settingsStore = useSettingsStore();
-const layout = computed(() => settingsStore.layout);
+const { visitedViews } = storeToRefs(tagsViewStore)
+console.log('visitedViews', visitedViews)
+const settingsStore = useSettingsStore()
+const layout = computed(() => settingsStore.layout)
 
 const selectedTag = ref<TagView>({
-  path: "",
-  fullPath: "",
-  name: "",
-  title: "",
+  path: '',
+  fullPath: '',
+  name: '',
+  title: '',
   affix: false,
-  keepAlive: false,
-});
+  keepAlive: false
+})
 
-const affixTags = ref<TagView[]>([]);
-const scrollPaneRef = ref();
-const left = ref(0);
-const top = ref(0);
+const affixTags = ref<TagView[]>([])
+const scrollPaneRef = ref()
+const left = ref(0)
+const top = ref(0)
 
 watch(
   route,
   () => {
-    addTags();
-    moveToCurrentTag();
+    addTags()
+    moveToCurrentTag()
   },
   {
-    immediate: true, //初始化立即执行
+    immediate: true //初始化立即执行
   }
-);
+)
 
-const tagMenuVisible = ref(false); // 标签操作菜单显示状态
+const tagMenuVisible = ref(false) // 标签操作菜单显示状态
 watch(tagMenuVisible, (value) => {
   if (value) {
-    document.body.addEventListener("click", closeTagMenu);
+    document.body.addEventListener('click', closeTagMenu)
   } else {
-    document.body.removeEventListener("click", closeTagMenu);
+    document.body.removeEventListener('click', closeTagMenu)
   }
-});
+})
 
-function filterAffixTags(routes: RouteRecordRaw[], basePath = "/") {
+function filterAffixTags(routes: RouteRecordRaw[], basePath = '/') {
   const processRoute = (route: RouteRecordRaw) => {
-    const fullPath = resolve(basePath, route.path);
+    const fullPath = resolve(basePath, route.path)
 
     const tag: TagView = {
       path: route.path,
       fullPath,
       name: String(route.name),
-      title: route.meta?.title || "no-name",
+      title: route.meta?.title || 'no-name',
       affix: route.meta?.affix,
-      keepAlive: route.meta?.keepAlive,
-    };
+      keepAlive: route.meta?.keepAlive
+    }
 
     if (tag.affix) {
-      tags.push(tag);
+      tags.push(tag)
     }
 
     if (route.children) {
-      route.children.forEach(processRoute);
+      route.children.forEach(processRoute)
     }
-  };
+  }
 
-  let tags: TagView[] = [];
-  routes.forEach(processRoute);
+  let tags: TagView[] = []
+  routes.forEach(processRoute)
 
-  console.log("filterAffixTags", tags);
+  console.log('filterAffixTags', tags)
 
-  return tags;
+  return tags
 }
 
 function initTags() {
-  const tags: TagView[] = filterAffixTags(permissionStore.routes);
-  console.log("initTags", tags);
-  affixTags.value = tags;
+  const tags: TagView[] = filterAffixTags(permissionStore.routes)
+  console.log('initTags', tags)
+  affixTags.value = tags
   for (const tag of tags) {
     // Must have tag name
     if (tag.name) {
-      tagsViewStore.addVisitedView(tag);
+      tagsViewStore.addVisitedView(tag)
     }
   }
 }
 
 function addTags() {
-  console.log("addTags", visitedViews);
+  console.log('addTags', visitedViews)
   if (route.meta.title) {
     tagsViewStore.addView({
       name: route.name as string,
@@ -168,51 +168,51 @@ function addTags() {
       path: route.path,
       fullPath: route.fullPath,
       affix: route.meta?.affix,
-      keepAlive: route.meta?.keepAlive,
-    });
+      keepAlive: route.meta?.keepAlive
+    })
   }
 }
 
 function moveToCurrentTag() {
-  console.log("moveToCurrentTag", visitedViews);
+  console.log('moveToCurrentTag', visitedViews)
   // 使用 nextTick() 的目的是确保在更新 tagsView 组件之前，scrollPaneRef 对象已经滚动到了正确的位置。
   nextTick(() => {
     for (const tag of visitedViews.value) {
       if (tag.path === route.path) {
-        scrollPaneRef.value.moveToTarget(tag);
+        scrollPaneRef.value.moveToTarget(tag)
         // when query is different then update
         // route.query = { ...route.query, ...tag.query };
         if (tag.fullPath !== route.fullPath) {
           tagsViewStore.updateVisitedView({
             name: route.name as string,
-            title: route.meta.title || "",
+            title: route.meta.title || '',
             path: route.path,
             fullPath: route.fullPath,
             affix: route.meta?.affix,
-            keepAlive: route.meta?.keepAlive,
-          });
+            keepAlive: route.meta?.keepAlive
+          })
         }
       }
     }
-  });
+  })
 }
 
 function isActive(tag: TagView) {
-  return tag.fullPath === route.fullPath;
+  return tag.fullPath === route.fullPath
 }
 
 function isAffix(tag: TagView) {
-  return tag?.affix;
+  return tag?.affix
 }
 
 function isFirstView() {
   try {
     return (
-      selectedTag.value.fullPath === "/dashboard" ||
+      selectedTag.value.fullPath === '/dashboard' ||
       selectedTag.value.fullPath === tagsViewStore.visitedViews[1].fullPath
-    );
+    )
   } catch (err) {
-    return false;
+    return false
   }
 }
 
@@ -221,32 +221,32 @@ function isLastView() {
     return (
       selectedTag.value.fullPath ===
       tagsViewStore.visitedViews[tagsViewStore.visitedViews.length - 1].fullPath
-    );
+    )
   } catch (err) {
-    return false;
+    return false
   }
 }
 
 function refreshSelectedTag(view: TagView) {
-  tagsViewStore.delCachedView(view);
-  const { fullPath } = view;
+  tagsViewStore.delCachedView(view)
+  const { fullPath } = view
   nextTick(() => {
-    router.replace({ path: "/redirect" + fullPath });
-  });
+    router.replace({ path: '/redirect' + fullPath })
+  })
 }
 
 function toLastView(visitedViews: TagView[], view?: TagView) {
-  const latestView = visitedViews.slice(-1)[0];
+  const latestView = visitedViews.slice(-1)[0]
   if (latestView && latestView.fullPath) {
-    router.push(latestView.fullPath);
+    router.push(latestView.fullPath)
   } else {
     // now the default is to redirect to the home page if there is no tags-view,
     // you can adjust it according to your needs.
-    if (view?.name === "Dashboard") {
+    if (view?.name === 'Dashboard') {
       // to reload home page
-      router.replace({ path: "/redirect" + view.fullPath });
+      router.replace({ path: '/redirect' + view.fullPath })
     } else {
-      router.push("/");
+      router.push('/')
     }
   }
 }
@@ -254,9 +254,9 @@ function toLastView(visitedViews: TagView[], view?: TagView) {
 function closeSelectedTag(view: TagView) {
   tagsViewStore.delView(view).then((res: any) => {
     if (isActive(view)) {
-      toLastView(res.visitedViews, view);
+      toLastView(res.visitedViews, view)
     }
-  });
+  })
 }
 
 function closeLeftTags() {
@@ -264,114 +264,114 @@ function closeLeftTags() {
     if (
       !res.visitedViews.find((item: any) => item.fullPath === route.fullPath)
     ) {
-      toLastView(res.visitedViews);
+      toLastView(res.visitedViews)
     }
-  });
+  })
 }
 function closeRightTags() {
   tagsViewStore.delRightViews(selectedTag.value).then((res: any) => {
     if (
       !res.visitedViews.find((item: any) => item.fullPath === route.fullPath)
     ) {
-      toLastView(res.visitedViews);
+      toLastView(res.visitedViews)
     }
-  });
+  })
 }
 
 function closeOtherTags() {
-  router.push(selectedTag.value);
+  router.push(selectedTag.value)
   tagsViewStore.delOtherViews(selectedTag.value).then(() => {
-    moveToCurrentTag();
-  });
+    moveToCurrentTag()
+  })
 }
 
 function closeAllTags(view: TagView) {
   tagsViewStore.delAllViews().then((res: any) => {
-    toLastView(res.visitedViews, view);
-  });
+    toLastView(res.visitedViews, view)
+  })
 }
 
 function openTagMenu(tag: TagView, e: MouseEvent) {
-  const menuMinWidth = 105;
+  const menuMinWidth = 105
 
-  const offsetLeft = proxy?.$el.getBoundingClientRect().left; // container margin left
-  const offsetWidth = proxy?.$el.offsetWidth; // container width
-  const maxLeft = offsetWidth - menuMinWidth; // left boundary
-  const l = e.clientX - offsetLeft + 15; // 15: margin right
+  const offsetLeft = proxy?.$el.getBoundingClientRect().left // container margin left
+  const offsetWidth = proxy?.$el.offsetWidth // container width
+  const maxLeft = offsetWidth - menuMinWidth // left boundary
+  const l = e.clientX - offsetLeft + 15 // 15: margin right
 
   if (l > maxLeft) {
-    left.value = maxLeft;
+    left.value = maxLeft
   } else {
-    left.value = l;
+    left.value = l
   }
 
   // 混合模式下，需要减去顶部菜单(fixed)的高度
-  if (layout.value === "mix") {
-    top.value = e.clientY - 50;
+  if (layout.value === 'mix') {
+    top.value = e.clientY - 50
   } else {
-    top.value = e.clientY;
+    top.value = e.clientY
   }
 
-  tagMenuVisible.value = true;
-  selectedTag.value = tag;
+  tagMenuVisible.value = true
+  selectedTag.value = tag
 }
 
 function closeTagMenu() {
-  tagMenuVisible.value = false;
+  tagMenuVisible.value = false
 }
 
 function handleScroll() {
-  closeTagMenu();
+  closeTagMenu()
 }
 function findOutermostParent(tree: any[], findName: string) {
-  let parentMap: any = {};
+  let parentMap: any = {}
 
   function buildParentMap(node: any, parent: any) {
-    parentMap[node.name] = parent;
+    parentMap[node.name] = parent
 
     if (node.children) {
       for (let i = 0; i < node.children.length; i++) {
-        buildParentMap(node.children[i], node);
+        buildParentMap(node.children[i], node)
       }
     }
   }
 
   for (let i = 0; i < tree.length; i++) {
-    buildParentMap(tree[i], null);
+    buildParentMap(tree[i], null)
   }
 
-  let currentNode = parentMap[findName];
+  let currentNode = parentMap[findName]
   while (currentNode) {
     if (!parentMap[currentNode.name]) {
-      return currentNode;
+      return currentNode
     }
-    currentNode = parentMap[currentNode.name];
+    currentNode = parentMap[currentNode.name]
   }
 
-  return null;
+  return null
 }
 const againActiveTop = (newVal: string) => {
-  if (layout.value !== "mix") return;
-  const parent = findOutermostParent(permissionStore.routes, newVal);
+  if (layout.value !== 'mix') return
+  const parent = findOutermostParent(permissionStore.routes, newVal)
   if (appStore.activeTopMenu !== parent.path) {
-    appStore.changeTopActive(parent.path);
+    appStore.changeTopActive(parent.path)
   }
-};
+}
 // 如果是混合模式，更改selectedTag，需要对应高亮的activeTop
 watch(
   () => route.name,
   (newVal) => {
     if (newVal) {
-      againActiveTop(newVal as string);
+      againActiveTop(newVal as string)
     }
   },
   {
-    deep: true,
+    deep: true
   }
-);
+)
 onMounted(() => {
-  initTags();
-});
+  initTags()
+})
 </script>
 
 <style lang="scss" scoped>
@@ -412,7 +412,7 @@ onMounted(() => {
         width: 8px;
         height: 8px;
         margin-right: 5px;
-        content: "";
+        content: '';
         background: #fff;
         border-radius: 50%;
       }
diff --git a/src/layout/components/index.ts b/src/layout/components/index.ts
index 616c59b0..17179928 100644
--- a/src/layout/components/index.ts
+++ b/src/layout/components/index.ts
@@ -1,4 +1,4 @@
-export { default as Navbar } from "./NavBar/index.vue";
-export { default as AppMain } from "./AppMain.vue";
-export { default as Settings } from "./Settings/index.vue";
-export { default as TagsView } from "./TagsView/index.vue";
+export { default as Navbar } from './NavBar/index.vue'
+export { default as AppMain } from './AppMain.vue'
+export { default as Settings } from './Settings/index.vue'
+export { default as TagsView } from './TagsView/index.vue'
diff --git a/src/layout/index.vue b/src/layout/index.vue
index affb973b..9f5479d8 100644
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -1,15 +1,15 @@
 <script setup lang="ts">
-import Main from "./main.vue";
-import { computed, watchEffect } from "vue";
-import { useWindowSize } from "@vueuse/core";
-import Sidebar from "./components/Sidebar/index.vue";
-import LeftMenu from "./components/Sidebar/LeftMenu.vue";
-
-import { useAppStore } from "@/store/modules/app";
-import { useSettingsStore } from "@/store/modules/settings";
-import { usePermissionStore } from "@/store/modules/permission";
-const permissionStore = usePermissionStore();
-const { width } = useWindowSize();
+import Main from './main.vue'
+import { computed, watchEffect } from 'vue'
+import { useWindowSize } from '@vueuse/core'
+import Sidebar from './components/Sidebar/index.vue'
+import LeftMenu from './components/Sidebar/LeftMenu.vue'
+
+import { useAppStore } from '@/store/modules/app'
+import { useSettingsStore } from '@/store/modules/settings'
+import { usePermissionStore } from '@/store/modules/permission'
+const permissionStore = usePermissionStore()
+const { width } = useWindowSize()
 /**
  * 响应式布局容器固定宽度
  *
@@ -17,64 +17,64 @@ const { width } = useWindowSize();
  * 中屏（>=992px）
  * 小屏（>=768px）
  */
-const WIDTH = 992;
+const WIDTH = 992
 
-const appStore = useAppStore();
-const settingsStore = useSettingsStore();
+const appStore = useAppStore()
+const settingsStore = useSettingsStore()
 
 const activeTopMenu = computed(() => {
-  return appStore.activeTopMenu;
-});
+  return appStore.activeTopMenu
+})
 // 混合模式左侧菜单
 const mixLeftMenu = computed(() => {
-  return permissionStore.mixLeftMenu;
-});
-const layout = computed(() => settingsStore.layout);
-const watermarkEnabled = computed(() => settingsStore.watermark.enabled);
+  return permissionStore.mixLeftMenu
+})
+const layout = computed(() => settingsStore.layout)
+const watermarkEnabled = computed(() => settingsStore.watermark.enabled)
 
 watch(
   () => activeTopMenu.value,
   (newVal) => {
-    if (layout.value !== "mix") return;
-    permissionStore.getMixLeftMenu(newVal);
+    if (layout.value !== 'mix') return
+    permissionStore.getMixLeftMenu(newVal)
   },
   {
     deep: true,
-    immediate: true,
+    immediate: true
   }
-);
+)
 
 const classObj = computed(() => ({
   hideSidebar: !appStore.sidebar.opened,
   openSidebar: appStore.sidebar.opened,
   withoutAnimation: appStore.sidebar.withoutAnimation,
-  mobile: appStore.device === "mobile",
-  isTop: layout.value === "top",
-  isMix: layout.value === "mix",
-}));
+  mobile: appStore.device === 'mobile',
+  isTop: layout.value === 'top',
+  isMix: layout.value === 'mix'
+}))
 
 watchEffect(() => {
   if (width.value < WIDTH) {
-    appStore.toggleDevice("mobile");
-    appStore.closeSideBar(true);
+    appStore.toggleDevice('mobile')
+    appStore.closeSideBar(true)
   } else {
-    appStore.toggleDevice("desktop");
+    appStore.toggleDevice('desktop')
 
     if (width.value >= 1200) {
       //大屏
-      appStore.openSideBar(true);
+      appStore.openSideBar(true)
     } else {
-      appStore.closeSideBar(true);
+      appStore.closeSideBar(true)
     }
   }
-});
+})
 
 function handleOutsideClick() {
-  appStore.closeSideBar(false);
+  appStore.closeSideBar(false)
 }
 
 function toggleSideBar() {
-  appStore.toggleSidebar();
+  appStore.toggleSidebar()
 }
 </script>
 
@@ -112,7 +112,7 @@ function toggleSideBar() {
   &::after {
     display: table;
     clear: both;
-    content: "";
+    content: '';
   }
 
   position: relative;
diff --git a/src/layout/main.vue b/src/layout/main.vue
index 92a3a068..c9f98309 100644
--- a/src/layout/main.vue
+++ b/src/layout/main.vue
@@ -1,12 +1,12 @@
 <script lang="ts" setup>
-import { computed, watchEffect } from "vue";
-import { useWindowSize } from "@vueuse/core";
-import { AppMain, Navbar, Settings, TagsView } from "./components/index";
-import RightPanel from "@/components/RightPanel/index.vue";
+import { computed, watchEffect } from 'vue'
+import { useWindowSize } from '@vueuse/core'
+import { AppMain, Navbar, Settings, TagsView } from './components/index'
+import RightPanel from '@/components/RightPanel/index.vue'
 
-import { useAppStore } from "@/store/modules/app";
-import { useSettingsStore } from "@/store/modules/settings";
-const { width } = useWindowSize();
+import { useAppStore } from '@/store/modules/app'
+import { useSettingsStore } from '@/store/modules/settings'
+const { width } = useWindowSize()
 
 /**
  * 响应式布局容器固定宽度
@@ -15,32 +15,32 @@ const { width } = useWindowSize();
  * 中屏（>=992px）
  * 小屏（>=768px）
  */
-const WIDTH = 992;
+const WIDTH = 992
 
-const appStore = useAppStore();
-const settingsStore = useSettingsStore();
+const appStore = useAppStore()
+const settingsStore = useSettingsStore()
 
-const fixedHeader = computed(() => settingsStore.fixedHeader);
-const showTagsView = computed(() => settingsStore.tagsView);
-const showSettings = computed(() => settingsStore.showSettings);
-const layout = computed(() => settingsStore.layout);
-const device = computed(() => appStore.device);
+const fixedHeader = computed(() => settingsStore.fixedHeader)
+const showTagsView = computed(() => settingsStore.tagsView)
+const showSettings = computed(() => settingsStore.showSettings)
+const layout = computed(() => settingsStore.layout)
+const device = computed(() => appStore.device)
 
 watchEffect(() => {
   if (width.value < WIDTH) {
-    appStore.toggleDevice("mobile");
-    appStore.closeSideBar(true);
+    appStore.toggleDevice('mobile')
+    appStore.closeSideBar(true)
   } else {
-    appStore.toggleDevice("desktop");
+    appStore.toggleDevice('desktop')
 
     if (width.value >= 1200) {
       //大屏
-      appStore.openSideBar(true);
+      appStore.openSideBar(true)
     } else {
-      appStore.closeSideBar(true);
+      appStore.closeSideBar(true)
     }
   }
-});
+})
 </script>
 <template>
   <div :class="{ hasTagsView: showTagsView }" class="main-container">
diff --git a/src/main.ts b/src/main.ts
index 3b57f7c4..982d7795 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,26 +1,26 @@
-import { createApp } from "vue";
-import App from "./App.vue";
-import router from "@/router";
-import { setupStore } from "@/store";
-import { setupDirective } from "@/directive";
+import { createApp } from 'vue'
+import App from './App.vue'
+import router from '@/router'
+import { setupStore } from '@/store'
+import { setupDirective } from '@/directive'
 
-import "@/permission";
+import '@/permission'
 
 // 本地SVG图标
-import "virtual:svg-icons-register";
+import 'virtual:svg-icons-register'
 
 // 国际化
-import i18n from "@/lang/index";
+import i18n from '@/lang/index'
 
 // 样式
-import "element-plus/theme-chalk/dark/css-vars.css";
-import "@/styles/index.scss";
-import "uno.css";
+import 'element-plus/theme-chalk/dark/css-vars.css'
+import '@/styles/index.scss'
+import 'uno.css'
 
-const app = createApp(App);
+const app = createApp(App)
 // 全局注册 自定义指令(directive)
-setupDirective(app);
+setupDirective(app)
 // 全局注册 状态管理(store)
-setupStore(app);
+setupStore(app)
 
-app.use(router).use(i18n).mount("#app");
+app.use(router).use(i18n).mount('#app')
diff --git a/src/permission.ts b/src/permission.ts
index 29db962c..49b7ac6d 100644
--- a/src/permission.ts
+++ b/src/permission.ts
@@ -1,62 +1,62 @@
-import router from "@/router";
-import { useUserStoreHook } from "@/store/modules/user";
-import { usePermissionStoreHook } from "@/store/modules/permission";
+import router from '@/router'
+import { useUserStoreHook } from '@/store/modules/user'
+import { usePermissionStoreHook } from '@/store/modules/permission'
 
-import NProgress from "nprogress";
-import "nprogress/nprogress.css";
+import NProgress from 'nprogress'
+import 'nprogress/nprogress.css'
 
-NProgress.configure({ showSpinner: false }); // 进度条
+NProgress.configure({ showSpinner: false }) // 进度条
 
-const permissionStore = usePermissionStoreHook();
+const permissionStore = usePermissionStoreHook()
 
 // 白名单路由
-const whiteList = ["/login"];
+const whiteList = ['/login']
 
 router.beforeEach(async (to, from, next) => {
-  NProgress.start();
-  const hasToken = localStorage.getItem("accessToken");
+  NProgress.start()
+  const hasToken = localStorage.getItem('accessToken')
   if (hasToken) {
-    if (to.path === "/login") {
+    if (to.path === '/login') {
       // 如果已登录，跳转首页
-      next({ path: "/" });
-      NProgress.done();
+      next({ path: '/' })
+      NProgress.done()
     } else {
-      const userStore = useUserStoreHook();
-      const hasRoles = userStore.user.roles && userStore.user.roles.length > 0;
+      const userStore = useUserStoreHook()
+      const hasRoles = userStore.user.roles && userStore.user.roles.length > 0
       if (hasRoles) {
         // 未匹配到任何路由，跳转404
         if (to.matched.length === 0) {
-          from.name ? next({ name: from.name }) : next("/404");
+          from.name ? next({ name: from.name }) : next('/404')
         } else {
-          next();
+          next()
         }
       } else {
         try {
-          const { roles } = await userStore.getUserInfo();
-          const accessRoutes = await permissionStore.generateRoutes(roles);
+          const { roles } = await userStore.getUserInfo()
+          const accessRoutes = await permissionStore.generateRoutes(roles)
           accessRoutes.forEach((route) => {
-            router.addRoute(route);
-          });
-          next({ ...to, replace: true });
+            router.addRoute(route)
+          })
+          next({ ...to, replace: true })
         } catch (error) {
           // 移除 token 并跳转登录页
-          await userStore.resetToken();
-          next(`/login?redirect=${to.path}`);
-          NProgress.done();
+          await userStore.resetToken()
+          next(`/login?redirect=${to.path}`)
+          NProgress.done()
         }
       }
     }
   } else {
     // 未登录可以访问白名单页面
     if (whiteList.indexOf(to.path) !== -1) {
-      next();
+      next()
     } else {
-      next(`/login?redirect=${to.path}`);
-      NProgress.done();
+      next(`/login?redirect=${to.path}`)
+      NProgress.done()
     }
   }
-});
+})
 
 router.afterEach(() => {
-  NProgress.done();
-});
+  NProgress.done()
+})
diff --git a/src/router/index.ts b/src/router/index.ts
index 17a249a8..f189f68e 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -1,58 +1,58 @@
-import { createRouter, createWebHashHistory, RouteRecordRaw } from "vue-router";
+import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router'
 
-export const Layout = () => import("@/layout/index.vue");
+export const Layout = () => import('@/layout/index.vue')
 
 // 静态路由
 export const constantRoutes: RouteRecordRaw[] = [
   {
-    path: "/redirect",
+    path: '/redirect',
     component: Layout,
     meta: { hidden: true },
     children: [
       {
-        path: "/redirect/:path(.*)",
-        component: () => import("@/views/redirect/index.vue"),
-      },
-    ],
+        path: '/redirect/:path(.*)',
+        component: () => import('@/views/redirect/index.vue')
+      }
+    ]
   },
 
   {
-    path: "/login",
-    component: () => import("@/views/login/index.vue"),
-    meta: { hidden: true },
+    path: '/login',
+    component: () => import('@/views/login/index.vue'),
+    meta: { hidden: true }
   },
 
   {
-    path: "/",
-    name: "/",
+    path: '/',
+    name: '/',
     component: Layout,
-    redirect: "/dashboard",
+    redirect: '/dashboard',
     children: [
       {
-        path: "dashboard",
-        component: () => import("@/views/dashboard/index.vue"),
-        name: "Dashboard", // 用于 keep-alive, 必须与SFC自动推导或者显示声明的组件name一致
+        path: 'dashboard',
+        component: () => import('@/views/dashboard/index.vue'),
+        name: 'Dashboard', // 用于 keep-alive, 必须与SFC自动推导或者显示声明的组件name一致
         // https://cn.vuejs.org/guide/built-ins/keep-alive.html#include-exclude
         meta: {
-          title: "dashboard",
-          icon: "homepage",
+          title: 'dashboard',
+          icon: 'homepage',
           affix: true,
           keepAlive: true,
-          alwaysShow: false,
-        },
+          alwaysShow: false
+        }
       },
       {
-        path: "401",
-        component: () => import("@/views/error-page/401.vue"),
-        meta: { hidden: true },
+        path: '401',
+        component: () => import('@/views/error-page/401.vue'),
+        meta: { hidden: true }
       },
       {
-        path: "404",
-        component: () => import("@/views/error-page/404.vue"),
-        meta: { hidden: true },
-      },
-    ],
-  },
+        path: '404',
+        component: () => import('@/views/error-page/404.vue'),
+        meta: { hidden: true }
+      }
+    ]
+  }
 
   // 外部链接
   // {
@@ -105,7 +105,7 @@ export const constantRoutes: RouteRecordRaw[] = [
              },
          ]
      }*/
-];
+]
 
 /**
  * 创建路由
@@ -114,14 +114,14 @@ const router = createRouter({
   history: createWebHashHistory(),
   routes: constantRoutes as RouteRecordRaw[],
   // 刷新时，滚动条位置还原
-  scrollBehavior: () => ({ left: 0, top: 0 }),
-});
+  scrollBehavior: () => ({ left: 0, top: 0 })
+})
 
 /**
  * 重置路由
  */
 export function resetRouter() {
-  router.replace({ path: "/login" });
+  router.replace({ path: '/login' })
 }
 
-export default router;
+export default router
diff --git a/src/settings.ts b/src/settings.ts
index 7fd27c68..38aced40 100644
--- a/src/settings.ts
+++ b/src/settings.ts
@@ -1,16 +1,16 @@
 const defaultSettings: AppSettings = {
-  title: "vue3-element-admin",
-  version: "v2.7.0",
+  title: 'vue3-element-admin',
+  version: 'v2.7.0',
   showSettings: true,
   tagsView: true,
   fixedHeader: false,
   sidebarLogo: true,
-  layout: "left",
-  theme: "light",
-  size: "default",
-  language: "zh-cn",
-  themeColor: "#409EFF",
-  watermark: { enabled: false, content: "有来技术" },
-};
+  layout: 'left',
+  theme: 'light',
+  size: 'default',
+  language: 'zh-cn',
+  themeColor: '#409EFF',
+  watermark: { enabled: false, content: '有来技术' }
+}
 
-export default defaultSettings;
+export default defaultSettings
diff --git a/src/store/index.ts b/src/store/index.ts
index e22b67c4..06eac5c3 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -1,11 +1,11 @@
-import type { App } from "vue";
-import { createPinia } from "pinia";
+import type { App } from 'vue'
+import { createPinia } from 'pinia'
 
-const store = createPinia();
+const store = createPinia()
 
 // 全局注册 store
 export function setupStore(app: App<Element>) {
-  app.use(store);
+  app.use(store)
 }
 
-export { store };
+export { store }
diff --git a/src/store/modules/app.ts b/src/store/modules/app.ts
index e2e82356..7fc264f2 100644
--- a/src/store/modules/app.ts
+++ b/src/store/modules/app.ts
@@ -1,65 +1,65 @@
-import { defineStore } from "pinia";
-import { useStorage } from "@vueuse/core";
-import defaultSettings from "@/settings";
+import { defineStore } from 'pinia'
+import { useStorage } from '@vueuse/core'
+import defaultSettings from '@/settings'
 
 // 导入 Element Plus 中英文语言包
-import zhCn from "element-plus/es/locale/lang/zh-cn";
-import en from "element-plus/es/locale/lang/en";
+import zhCn from 'element-plus/es/locale/lang/zh-cn'
+import en from 'element-plus/es/locale/lang/en'
 
 // setup
-export const useAppStore = defineStore("app", () => {
+export const useAppStore = defineStore('app', () => {
   // state
-  const device = useStorage("device", "desktop");
-  const size = useStorage<any>("size", defaultSettings.size);
-  const language = useStorage("language", defaultSettings.language);
+  const device = useStorage('device', 'desktop')
+  const size = useStorage<any>('size', defaultSettings.size)
+  const language = useStorage('language', defaultSettings.language)
 
-  const sidebarStatus = useStorage("sidebarStatus", "closed");
+  const sidebarStatus = useStorage('sidebarStatus', 'closed')
 
   const sidebar = reactive({
-    opened: sidebarStatus.value !== "closed",
-    withoutAnimation: false,
-  });
-  const activeTopMenu = useStorage("activeTop", "");
+    opened: sidebarStatus.value !== 'closed',
+    withoutAnimation: false
+  })
+  const activeTopMenu = useStorage('activeTop', '')
   /**
    * 根据语言标识读取对应的语言包
    */
   const locale = computed(() => {
-    if (language?.value == "en") {
-      return en;
+    if (language?.value == 'en') {
+      return en
     } else {
-      return zhCn;
+      return zhCn
     }
-  });
+  })
 
   // actions
   function toggleSidebar() {
-    sidebar.opened = !sidebar.opened;
-    sidebar.withoutAnimation = false;
+    sidebar.opened = !sidebar.opened
+    sidebar.withoutAnimation = false
     if (sidebar.opened) {
-      sidebarStatus.value = "opened";
+      sidebarStatus.value = 'opened'
     } else {
-      sidebarStatus.value = "closed";
+      sidebarStatus.value = 'closed'
     }
   }
 
   function closeSideBar(withoutAnimation: boolean) {
-    sidebar.opened = false;
-    sidebar.withoutAnimation = withoutAnimation;
-    sidebarStatus.value = "closed";
+    sidebar.opened = false
+    sidebar.withoutAnimation = withoutAnimation
+    sidebarStatus.value = 'closed'
   }
 
   function openSideBar(withoutAnimation: boolean) {
-    sidebar.opened = true;
-    sidebar.withoutAnimation = withoutAnimation;
-    sidebarStatus.value = "opened";
+    sidebar.opened = true
+    sidebar.withoutAnimation = withoutAnimation
+    sidebarStatus.value = 'opened'
   }
 
   function toggleDevice(val: string) {
-    device.value = val;
+    device.value = val
   }
 
   function changeSize(val: string) {
-    size.value = val;
+    size.value = val
   }
   /**
    * 切换语言
@@ -67,13 +67,13 @@ export const useAppStore = defineStore("app", () => {
    * @param val
    */
   function changeLanguage(val: string) {
-    language.value = val;
+    language.value = val
   }
   /**
    * 混合模式顶部切换
    */
   function changeTopActive(val: string) {
-    activeTopMenu.value = val;
+    activeTopMenu.value = val
   }
   return {
     device,
@@ -88,6 +88,6 @@ export const useAppStore = defineStore("app", () => {
     toggleSidebar,
     closeSideBar,
     openSideBar,
-    changeTopActive,
-  };
-});
+    changeTopActive
+  }
+})
diff --git a/src/store/modules/permission.ts b/src/store/modules/permission.ts
index f133fa1a..95875323 100644
--- a/src/store/modules/permission.ts
+++ b/src/store/modules/permission.ts
@@ -1,11 +1,11 @@
-import { RouteRecordRaw } from "vue-router";
-import { defineStore } from "pinia";
-import { constantRoutes } from "@/router";
-import { store } from "@/store";
-import { listRoutes } from "@/api/menu";
+import { RouteRecordRaw } from 'vue-router'
+import { defineStore } from 'pinia'
+import { constantRoutes } from '@/router'
+import { store } from '@/store'
+import { listRoutes } from '@/api/menu'
 
-const modules = import.meta.glob("../../views/**/**.vue");
-const Layout = () => import("@/layout/index.vue");
+const modules = import.meta.glob('../../views/**/**.vue')
+const Layout = () => import('@/layout/index.vue')
 
 /**
  * Use meta.role to determine if the current user has permission
@@ -17,17 +17,17 @@ const Layout = () => import("@/layout/index.vue");
 const hasPermission = (roles: string[], route: RouteRecordRaw) => {
   if (route.meta && route.meta.roles) {
     // 角色【超级管理员】拥有所有权限，忽略校验
-    if (roles.includes("ROOT")) {
-      return true;
+    if (roles.includes('ROOT')) {
+      return true
     }
     return roles.some((role) => {
       if (route.meta?.roles) {
-        return route.meta.roles.includes(role);
+        return route.meta.roles.includes(role)
       }
-    });
+    })
   }
-  return false;
-};
+  return false
+}
 
 /**
  * 递归过滤有权限的异步(动态)路由
@@ -37,45 +37,45 @@ const hasPermission = (roles: string[], route: RouteRecordRaw) => {
  * @returns 返回用户有权限的异步(动态)路由
  */
 const filterAsyncRoutes = (routes: RouteRecordRaw[], roles: string[]) => {
-  const asyncRoutes: RouteRecordRaw[] = [];
+  const asyncRoutes: RouteRecordRaw[] = []
 
   routes.forEach((route) => {
-    const tmpRoute = { ...route }; // ES6扩展运算符复制新对象
+    const tmpRoute = { ...route } // ES6扩展运算符复制新对象
     if (!route.name) {
-      tmpRoute.name = route.path;
+      tmpRoute.name = route.path
     }
     // 判断用户(角色)是否有该路由的访问权限
     if (hasPermission(roles, tmpRoute)) {
-      if (tmpRoute.component?.toString() == "Layout") {
-        tmpRoute.component = Layout;
+      if (tmpRoute.component?.toString() == 'Layout') {
+        tmpRoute.component = Layout
       } else {
-        const component = modules[`../../views/${tmpRoute.component}.vue`];
+        const component = modules[`../../views/${tmpRoute.component}.vue`]
         if (component) {
-          tmpRoute.component = component;
+          tmpRoute.component = component
         } else {
-          tmpRoute.component = modules[`../../views/error-page/404.vue`];
+          tmpRoute.component = modules[`../../views/error-page/404.vue`]
         }
       }
 
       if (tmpRoute.children) {
-        tmpRoute.children = filterAsyncRoutes(tmpRoute.children, roles);
+        tmpRoute.children = filterAsyncRoutes(tmpRoute.children, roles)
       }
 
-      asyncRoutes.push(tmpRoute);
+      asyncRoutes.push(tmpRoute)
     }
-  });
+  })
 
-  return asyncRoutes;
-};
+  return asyncRoutes
+}
 
 // setup
-export const usePermissionStore = defineStore("permission", () => {
+export const usePermissionStore = defineStore('permission', () => {
   // state
-  const routes = ref<RouteRecordRaw[]>([]);
+  const routes = ref<RouteRecordRaw[]>([])
 
   // actions
   function setRoutes(newRoutes: RouteRecordRaw[]) {
-    routes.value = constantRoutes.concat(newRoutes);
+    routes.value = constantRoutes.concat(newRoutes)
   }
   /**
    * 生成动态路由
@@ -89,31 +89,31 @@ export const usePermissionStore = defineStore("permission", () => {
       listRoutes()
         .then(({ data: asyncRoutes }) => {
           // 根据角色获取有访问权限的路由
-          const accessedRoutes = filterAsyncRoutes(asyncRoutes, roles);
-          setRoutes(accessedRoutes);
-          resolve(accessedRoutes);
+          const accessedRoutes = filterAsyncRoutes(asyncRoutes, roles)
+          setRoutes(accessedRoutes)
+          resolve(accessedRoutes)
         })
         .catch((error) => {
-          reject(error);
-        });
-    });
+          reject(error)
+        })
+    })
   }
 
   /**
    * 混合模式左侧菜单
    */
-  const mixLeftMenu = ref<RouteRecordRaw[]>([]);
+  const mixLeftMenu = ref<RouteRecordRaw[]>([])
   function getMixLeftMenu(activeTop: string) {
     routes.value.forEach((item) => {
       if (item.path === activeTop) {
-        mixLeftMenu.value = item.children || [];
+        mixLeftMenu.value = item.children || []
       }
-    });
+    })
   }
-  return { routes, setRoutes, generateRoutes, getMixLeftMenu, mixLeftMenu };
-});
+  return { routes, setRoutes, generateRoutes, getMixLeftMenu, mixLeftMenu }
+})
 
 // 非setup
 export function usePermissionStoreHook() {
-  return usePermissionStore(store);
+  return usePermissionStore(store)
 }
diff --git a/src/store/modules/settings.ts b/src/store/modules/settings.ts
index 5db3d7fc..3e880126 100644
--- a/src/store/modules/settings.ts
+++ b/src/store/modules/settings.ts
@@ -1,27 +1,27 @@
-import { defineStore } from "pinia";
-import defaultSettings from "@/settings";
+import { defineStore } from 'pinia'
+import defaultSettings from '@/settings'
 
-export const useSettingsStore = defineStore("setting", () => {
-  const title = defaultSettings.title;
-  const version = defaultSettings.version;
+export const useSettingsStore = defineStore('setting', () => {
+  const title = defaultSettings.title
+  const version = defaultSettings.version
 
-  const tagsView = useStorage<boolean>("tagsView", defaultSettings.tagsView);
+  const tagsView = useStorage<boolean>('tagsView', defaultSettings.tagsView)
 
-  const showSettings = ref<boolean>(defaultSettings.showSettings);
-  const sidebarLogo = ref<boolean>(defaultSettings.sidebarLogo);
+  const showSettings = ref<boolean>(defaultSettings.showSettings)
+  const sidebarLogo = ref<boolean>(defaultSettings.sidebarLogo)
   const fixedHeader = useStorage<boolean>(
-    "fixedHeader",
+    'fixedHeader',
     defaultSettings.fixedHeader
-  );
-  const layout = useStorage<string>("layout", defaultSettings.layout);
+  )
+  const layout = useStorage<string>('layout', defaultSettings.layout)
   const themeColor = useStorage<string>(
-    "themeColor",
+    'themeColor',
     defaultSettings.themeColor
-  );
-  const theme = useStorage<string>("theme", defaultSettings.theme);
+  )
+  const theme = useStorage<string>('theme', defaultSettings.theme)
 
   // Whether to enable watermark
-  const watermark = useStorage<any>("watermark", defaultSettings.watermark);
+  const watermark = useStorage<any>('watermark', defaultSettings.watermark)
 
   const settingsMap: Record<string, Ref<any>> = {
     showSettings,
@@ -31,17 +31,17 @@ export const useSettingsStore = defineStore("setting", () => {
     layout,
     themeColor,
     theme,
-    watermark: watermark.value,
-  };
+    watermark: watermark.value
+  }
 
   function changeSetting({ key, value }: { key: string; value: any }) {
-    const setting = settingsMap[key];
+    const setting = settingsMap[key]
     if (setting !== undefined) {
-      setting.value = value;
-      if (key === "theme" && value === "dark") {
-        document.documentElement.classList.add("dark");
+      setting.value = value
+      if (key === 'theme' && value === 'dark') {
+        document.documentElement.classList.add('dark')
       } else {
-        document.documentElement.classList.remove("dark");
+        document.documentElement.classList.remove('dark')
       }
     }
   }
@@ -57,6 +57,6 @@ export const useSettingsStore = defineStore("setting", () => {
     themeColor,
     changeSetting,
     theme,
-    watermark,
-  };
-});
+    watermark
+  }
+})
diff --git a/src/store/modules/tagsView.ts b/src/store/modules/tagsView.ts
index b18646cf..785dd4d3 100644
--- a/src/store/modules/tagsView.ts
+++ b/src/store/modules/tagsView.ts
@@ -1,26 +1,26 @@
-import { defineStore } from "pinia";
+import { defineStore } from 'pinia'
 
-export const useTagsViewStore = defineStore("tagsView", () => {
-  const visitedViews = ref<TagView[]>([]);
-  const cachedViews = ref<string[]>([]);
+export const useTagsViewStore = defineStore('tagsView', () => {
+  const visitedViews = ref<TagView[]>([])
+  const cachedViews = ref<string[]>([])
 
-  console.log("first visitedViews", visitedViews, "cachedViews", cachedViews);
+  console.log('first visitedViews', visitedViews, 'cachedViews', cachedViews)
 
   /**
    * 添加已访问视图到已访问视图列表中
    */
   function addVisitedView(view: TagView) {
-    console.log("addVisitedView", visitedViews, view);
+    console.log('addVisitedView', visitedViews, view)
     // 如果已经存在于已访问的视图列表中，则不再添加
     if (visitedViews.value.some((v) => v.fullPath === view.fullPath)) {
-      return;
+      return
     }
     // 如果视图是固定的（affix），则在已访问的视图列表的开头添加
     if (view.affix) {
-      visitedViews.value.unshift(view);
+      visitedViews.value.unshift(view)
     } else {
       // 如果视图不是固定的，则在已访问的视图列表的末尾添加
-      visitedViews.value.push(view);
+      visitedViews.value.push(view)
     }
   }
 
@@ -28,16 +28,16 @@ export const useTagsViewStore = defineStore("tagsView", () => {
    * 添加缓存视图到缓存视图列表中
    */
   function addCachedView(view: TagView) {
-    console.log("addCachedView", visitedViews, view);
-    const viewName = view.name;
+    console.log('addCachedView', visitedViews, view)
+    const viewName = view.name
     // 如果缓存视图名称已经存在于缓存视图列表中，则不再添加
     if (cachedViews.value.includes(viewName)) {
-      return;
+      return
     }
 
     // 如果视图需要缓存（keepAlive），则将其路由名称添加到缓存视图列表中
     if (view.keepAlive) {
-      cachedViews.value.push(viewName);
+      cachedViews.value.push(viewName)
     }
   }
 
@@ -49,152 +49,152 @@ export const useTagsViewStore = defineStore("tagsView", () => {
       for (const [i, v] of visitedViews.value.entries()) {
         // 找到与指定视图路径匹配的视图，在已访问视图列表中删除该视图
         if (v.path === view.path) {
-          visitedViews.value.splice(i, 1);
-          break;
+          visitedViews.value.splice(i, 1)
+          break
         }
       }
-      resolve([...visitedViews.value]);
-    });
+      resolve([...visitedViews.value])
+    })
   }
 
   function delCachedView(view: TagView) {
-    const viewName = view.name;
+    const viewName = view.name
     return new Promise((resolve) => {
-      const index = cachedViews.value.indexOf(viewName);
-      index > -1 && cachedViews.value.splice(index, 1);
-      resolve([...cachedViews.value]);
-    });
+      const index = cachedViews.value.indexOf(viewName)
+      index > -1 && cachedViews.value.splice(index, 1)
+      resolve([...cachedViews.value])
+    })
   }
 
   function delOtherVisitedViews(view: TagView) {
     return new Promise((resolve) => {
       visitedViews.value = visitedViews.value.filter((v) => {
-        return v?.affix || v.path === view.path;
-      });
-      resolve([...visitedViews.value]);
-    });
+        return v?.affix || v.path === view.path
+      })
+      resolve([...visitedViews.value])
+    })
   }
 
   function delOtherCachedViews(view: TagView) {
-    const viewName = view.name as string;
+    const viewName = view.name as string
     return new Promise((resolve) => {
-      const index = cachedViews.value.indexOf(viewName);
+      const index = cachedViews.value.indexOf(viewName)
       if (index > -1) {
-        cachedViews.value = cachedViews.value.slice(index, index + 1);
+        cachedViews.value = cachedViews.value.slice(index, index + 1)
       } else {
         // if index = -1, there is no cached tags
-        cachedViews.value = [];
+        cachedViews.value = []
       }
-      resolve([...cachedViews.value]);
-    });
+      resolve([...cachedViews.value])
+    })
   }
 
   function updateVisitedView(view: TagView) {
-    console.log("updateVisitedView", visitedViews, view);
+    console.log('updateVisitedView', visitedViews, view)
     for (let v of visitedViews.value) {
       if (v.path === view.path) {
-        v = Object.assign(v, view);
-        break;
+        v = Object.assign(v, view)
+        break
       }
     }
   }
 
   function addView(view: TagView) {
-    console.log("addView", visitedViews, view);
-    addVisitedView(view);
-    addCachedView(view);
+    console.log('addView', visitedViews, view)
+    addVisitedView(view)
+    addCachedView(view)
   }
 
   function delView(view: TagView) {
     return new Promise((resolve) => {
-      delVisitedView(view);
-      delCachedView(view);
+      delVisitedView(view)
+      delCachedView(view)
       resolve({
         visitedViews: [...visitedViews.value],
-        cachedViews: [...cachedViews.value],
-      });
-    });
+        cachedViews: [...cachedViews.value]
+      })
+    })
   }
 
   function delOtherViews(view: TagView) {
     return new Promise((resolve) => {
-      delOtherVisitedViews(view);
-      delOtherCachedViews(view);
+      delOtherVisitedViews(view)
+      delOtherCachedViews(view)
       resolve({
         visitedViews: [...visitedViews.value],
-        cachedViews: [...cachedViews.value],
-      });
-    });
+        cachedViews: [...cachedViews.value]
+      })
+    })
   }
 
   function delLeftViews(view: TagView) {
     return new Promise((resolve) => {
       const currIndex = visitedViews.value.findIndex(
         (v) => v.path === view.path
-      );
+      )
       if (currIndex === -1) {
-        return;
+        return
       }
       visitedViews.value = visitedViews.value.filter((item, index) => {
         if (index >= currIndex || item?.affix) {
-          return true;
+          return true
         }
 
-        const cacheIndex = cachedViews.value.indexOf(item.name);
+        const cacheIndex = cachedViews.value.indexOf(item.name)
         if (cacheIndex > -1) {
-          cachedViews.value.splice(cacheIndex, 1);
+          cachedViews.value.splice(cacheIndex, 1)
         }
-        return false;
-      });
+        return false
+      })
       resolve({
-        visitedViews: [...visitedViews.value],
-      });
-    });
+        visitedViews: [...visitedViews.value]
+      })
+    })
   }
   function delRightViews(view: TagView) {
     return new Promise((resolve) => {
       const currIndex = visitedViews.value.findIndex(
         (v) => v.path === view.path
-      );
+      )
       if (currIndex === -1) {
-        return;
+        return
       }
       visitedViews.value = visitedViews.value.filter((item, index) => {
         if (index <= currIndex || item?.affix) {
-          return true;
+          return true
         }
-      });
+      })
       resolve({
-        visitedViews: [...visitedViews.value],
-      });
-    });
+        visitedViews: [...visitedViews.value]
+      })
+    })
   }
 
   function delAllViews() {
     return new Promise((resolve) => {
-      const affixTags = visitedViews.value.filter((tag) => tag?.affix);
-      visitedViews.value = affixTags;
-      cachedViews.value = [];
+      const affixTags = visitedViews.value.filter((tag) => tag?.affix)
+      visitedViews.value = affixTags
+      cachedViews.value = []
       resolve({
         visitedViews: [...visitedViews.value],
-        cachedViews: [...cachedViews.value],
-      });
-    });
+        cachedViews: [...cachedViews.value]
+      })
+    })
   }
 
   function delAllVisitedViews() {
     return new Promise((resolve) => {
-      const affixTags = visitedViews.value.filter((tag) => tag?.affix);
-      visitedViews.value = affixTags;
-      resolve([...visitedViews.value]);
-    });
+      const affixTags = visitedViews.value.filter((tag) => tag?.affix)
+      visitedViews.value = affixTags
+      resolve([...visitedViews.value])
+    })
   }
 
   function delAllCachedViews() {
     return new Promise((resolve) => {
-      cachedViews.value = [];
-      resolve([...cachedViews.value]);
-    });
+      cachedViews.value = []
+      resolve([...cachedViews.value])
+    })
   }
 
   return {
@@ -214,6 +214,6 @@ export const useTagsViewStore = defineStore("tagsView", () => {
     delRightViews,
     delAllViews,
     delAllVisitedViews,
-    delAllCachedViews,
-  };
-});
+    delAllCachedViews
+  }
+})
diff --git a/src/store/modules/user.ts b/src/store/modules/user.ts
index c9558e19..cb1d4013 100644
--- a/src/store/modules/user.ts
+++ b/src/store/modules/user.ts
@@ -1,22 +1,22 @@
-import { defineStore } from "pinia";
+import { defineStore } from 'pinia'
 
-import { loginApi, logoutApi } from "@/api/auth";
-import { getUserInfoApi } from "@/api/user";
-import { resetRouter } from "@/router";
-import { store } from "@/store";
+import { loginApi, logoutApi } from '@/api/auth'
+import { getUserInfoApi } from '@/api/user'
+import { resetRouter } from '@/router'
+import { store } from '@/store'
 
-import { LoginData } from "@/api/auth/types";
-import { UserInfo } from "@/api/user/types";
+import { LoginData } from '@/api/auth/types'
+import { UserInfo } from '@/api/user/types'
 
-import { useStorage } from "@vueuse/core";
+import { useStorage } from '@vueuse/core'
 
-export const useUserStore = defineStore("user", () => {
+export const useUserStore = defineStore('user', () => {
   const user: UserInfo = {
     roles: [],
-    perms: [],
-  };
+    perms: []
+  }
 
-  const token = useStorage("accessToken", "");
+  const token = useStorage('accessToken', '')
 
   /**
    * 登录
@@ -28,14 +28,14 @@ export const useUserStore = defineStore("user", () => {
     return new Promise<void>((resolve, reject) => {
       loginApi(loginData)
         .then((response) => {
-          const { tokenType, accessToken } = response.data;
-          token.value = tokenType + " " + accessToken; // Bearer eyJhbGciOiJIUzI1NiJ9.xxx.xxx
-          resolve();
+          const { tokenType, accessToken } = response.data
+          token.value = tokenType + ' ' + accessToken // Bearer eyJhbGciOiJIUzI1NiJ9.xxx.xxx
+          resolve()
         })
         .catch((error) => {
-          reject(error);
-        });
-    });
+          reject(error)
+        })
+    })
   }
 
   // 获取信息(用户昵称、头像、角色集合、权限集合)
@@ -44,20 +44,20 @@ export const useUserStore = defineStore("user", () => {
       getUserInfoApi()
         .then(({ data }) => {
           if (!data) {
-            reject("Verification failed, please Login again.");
-            return;
+            reject('Verification failed, please Login again.')
+            return
           }
           if (!data.roles || data.roles.length <= 0) {
-            reject("getUserInfo: roles must be a non-null array!");
-            return;
+            reject('getUserInfo: roles must be a non-null array!')
+            return
           }
-          Object.assign(user, { ...data });
-          resolve(data);
+          Object.assign(user, { ...data })
+          resolve(data)
         })
         .catch((error) => {
-          reject(error);
-        });
-    });
+          reject(error)
+        })
+    })
   }
 
   // user logout
@@ -65,23 +65,23 @@ export const useUserStore = defineStore("user", () => {
     return new Promise<void>((resolve, reject) => {
       logoutApi()
         .then(() => {
-          token.value = "";
-          location.reload(); // 清空路由
-          resolve();
+          token.value = ''
+          location.reload() // 清空路由
+          resolve()
         })
         .catch((error) => {
-          reject(error);
-        });
-    });
+          reject(error)
+        })
+    })
   }
 
   // remove token
   function resetToken() {
     return new Promise<void>((resolve) => {
-      token.value = "";
-      resetRouter();
-      resolve();
-    });
+      token.value = ''
+      resetRouter()
+      resolve()
+    })
   }
 
   return {
@@ -90,11 +90,11 @@ export const useUserStore = defineStore("user", () => {
     login,
     getUserInfo,
     logout,
-    resetToken,
-  };
-});
+    resetToken
+  }
+})
 
 // 非setup
 export function useUserStoreHook() {
-  return useUserStore(store);
+  return useUserStore(store)
 }
diff --git a/src/styles/index.scss b/src/styles/index.scss
index e9250634..1077f3e6 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -1,7 +1,7 @@
-@import "./transition";
-@import "./sidebar";
-@import "./reset";
-@import "./dark";
+@import './transition';
+@import './sidebar';
+@import './reset';
+@import './dark';
 
 .app-container {
   padding: 10px;
diff --git a/src/styles/reset.scss b/src/styles/reset.scss
index 9b19e4c4..ba448563 100644
--- a/src/styles/reset.scss
+++ b/src/styles/reset.scss
@@ -25,8 +25,8 @@ body {
   width: 100%;
   height: 100%;
   margin: 0;
-  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB",
-    "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
+  font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB',
+    'Microsoft YaHei', '微软雅黑', Arial, sans-serif;
   line-height: inherit;
   -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: antialiased;
diff --git a/src/typings/auto-imports.d.ts b/src/typings/auto-imports.d.ts
index b191a3fd..8d35fa1e 100644
--- a/src/typings/auto-imports.d.ts
+++ b/src/typings/auto-imports.d.ts
@@ -4,281 +4,281 @@
 // Generated by unplugin-auto-import
 export {}
 declare global {
-  const EffectScope: typeof import("vue")["EffectScope"];
-  const ElForm: typeof import("element-plus/es")["ElForm"];
-  const ElMessage: typeof import("element-plus/es")["ElMessage"];
-  const ElNotification: typeof import("element-plus/es")["ElNotification"];
-  const ElMessageBox: typeof import("element-plus/es")["ElMessageBox"];
-  const ElTree: typeof import("element-plus/es")["ElTree"];
-  const asyncComputed: typeof import("@vueuse/core")["asyncComputed"];
-  const autoResetRef: typeof import("@vueuse/core")["autoResetRef"];
-  const computed: typeof import("vue")["computed"];
-  const computedAsync: typeof import("@vueuse/core")["computedAsync"];
-  const computedEager: typeof import("@vueuse/core")["computedEager"];
-  const computedInject: typeof import("@vueuse/core")["computedInject"];
-  const computedWithControl: typeof import("@vueuse/core")["computedWithControl"];
-  const controlledComputed: typeof import("@vueuse/core")["controlledComputed"];
-  const controlledRef: typeof import("@vueuse/core")["controlledRef"];
-  const createApp: typeof import("vue")["createApp"];
-  const createEventHook: typeof import("@vueuse/core")["createEventHook"];
-  const createGlobalState: typeof import("@vueuse/core")["createGlobalState"];
-  const createInjectionState: typeof import("@vueuse/core")["createInjectionState"];
-  const createReactiveFn: typeof import("@vueuse/core")["createReactiveFn"];
-  const createReusableTemplate: typeof import("@vueuse/core")["createReusableTemplate"];
-  const createSharedComposable: typeof import("@vueuse/core")["createSharedComposable"];
-  const createTemplatePromise: typeof import("@vueuse/core")["createTemplatePromise"];
-  const createUnrefFn: typeof import("@vueuse/core")["createUnrefFn"];
-  const customRef: typeof import("vue")["customRef"];
-  const debouncedRef: typeof import("@vueuse/core")["debouncedRef"];
-  const debouncedWatch: typeof import("@vueuse/core")["debouncedWatch"];
-  const defineAsyncComponent: typeof import("vue")["defineAsyncComponent"];
-  const defineComponent: typeof import("vue")["defineComponent"];
-  const eagerComputed: typeof import("@vueuse/core")["eagerComputed"];
-  const effectScope: typeof import("vue")["effectScope"];
-  const extendRef: typeof import("@vueuse/core")["extendRef"];
-  const getCurrentInstance: typeof import("vue")["getCurrentInstance"];
-  const getCurrentScope: typeof import("vue")["getCurrentScope"];
-  const h: typeof import("vue")["h"];
-  const ignorableWatch: typeof import("@vueuse/core")["ignorableWatch"];
-  const inject: typeof import("vue")["inject"];
-  const isDefined: typeof import("@vueuse/core")["isDefined"];
-  const isProxy: typeof import("vue")["isProxy"];
-  const isReactive: typeof import("vue")["isReactive"];
-  const isReadonly: typeof import("vue")["isReadonly"];
-  const isRef: typeof import("vue")["isRef"];
-  const makeDestructurable: typeof import("@vueuse/core")["makeDestructurable"];
-  const markRaw: typeof import("vue")["markRaw"];
-  const nextTick: typeof import("vue")["nextTick"];
-  const onActivated: typeof import("vue")["onActivated"];
-  const onBeforeMount: typeof import("vue")["onBeforeMount"];
-  const onBeforeUnmount: typeof import("vue")["onBeforeUnmount"];
-  const onBeforeUpdate: typeof import("vue")["onBeforeUpdate"];
-  const onClickOutside: typeof import("@vueuse/core")["onClickOutside"];
-  const onDeactivated: typeof import("vue")["onDeactivated"];
-  const onErrorCaptured: typeof import("vue")["onErrorCaptured"];
-  const onKeyStroke: typeof import("@vueuse/core")["onKeyStroke"];
-  const onLongPress: typeof import("@vueuse/core")["onLongPress"];
-  const onMounted: typeof import("vue")["onMounted"];
-  const onRenderTracked: typeof import("vue")["onRenderTracked"];
-  const onRenderTriggered: typeof import("vue")["onRenderTriggered"];
-  const onScopeDispose: typeof import("vue")["onScopeDispose"];
-  const onServerPrefetch: typeof import("vue")["onServerPrefetch"];
-  const onStartTyping: typeof import("@vueuse/core")["onStartTyping"];
-  const onUnmounted: typeof import("vue")["onUnmounted"];
-  const onUpdated: typeof import("vue")["onUpdated"];
-  const pausableWatch: typeof import("@vueuse/core")["pausableWatch"];
-  const provide: typeof import("vue")["provide"];
-  const reactify: typeof import("@vueuse/core")["reactify"];
-  const reactifyObject: typeof import("@vueuse/core")["reactifyObject"];
-  const reactive: typeof import("vue")["reactive"];
-  const reactiveComputed: typeof import("@vueuse/core")["reactiveComputed"];
-  const reactiveOmit: typeof import("@vueuse/core")["reactiveOmit"];
-  const reactivePick: typeof import("@vueuse/core")["reactivePick"];
-  const readonly: typeof import("vue")["readonly"];
-  const ref: typeof import("vue")["ref"];
-  const refAutoReset: typeof import("@vueuse/core")["refAutoReset"];
-  const refDebounced: typeof import("@vueuse/core")["refDebounced"];
-  const refDefault: typeof import("@vueuse/core")["refDefault"];
-  const refThrottled: typeof import("@vueuse/core")["refThrottled"];
-  const refWithControl: typeof import("@vueuse/core")["refWithControl"];
-  const resolveComponent: typeof import("vue")["resolveComponent"];
-  const resolveRef: typeof import("@vueuse/core")["resolveRef"];
-  const resolveUnref: typeof import("@vueuse/core")["resolveUnref"];
-  const shallowReactive: typeof import("vue")["shallowReactive"];
-  const shallowReadonly: typeof import("vue")["shallowReadonly"];
-  const shallowRef: typeof import("vue")["shallowRef"];
-  const syncRef: typeof import("@vueuse/core")["syncRef"];
-  const syncRefs: typeof import("@vueuse/core")["syncRefs"];
-  const templateRef: typeof import("@vueuse/core")["templateRef"];
-  const throttledRef: typeof import("@vueuse/core")["throttledRef"];
-  const throttledWatch: typeof import("@vueuse/core")["throttledWatch"];
-  const toRaw: typeof import("vue")["toRaw"];
-  const toReactive: typeof import("@vueuse/core")["toReactive"];
-  const toRef: typeof import("vue")["toRef"];
-  const toRefs: typeof import("vue")["toRefs"];
-  const toValue: typeof import("vue")["toValue"];
-  const triggerRef: typeof import("vue")["triggerRef"];
-  const tryOnBeforeMount: typeof import("@vueuse/core")["tryOnBeforeMount"];
-  const tryOnBeforeUnmount: typeof import("@vueuse/core")["tryOnBeforeUnmount"];
-  const tryOnMounted: typeof import("@vueuse/core")["tryOnMounted"];
-  const tryOnScopeDispose: typeof import("@vueuse/core")["tryOnScopeDispose"];
-  const tryOnUnmounted: typeof import("@vueuse/core")["tryOnUnmounted"];
-  const unref: typeof import("vue")["unref"];
-  const unrefElement: typeof import("@vueuse/core")["unrefElement"];
-  const until: typeof import("@vueuse/core")["until"];
-  const useActiveElement: typeof import("@vueuse/core")["useActiveElement"];
-  const useAnimate: typeof import("@vueuse/core")["useAnimate"];
-  const useArrayDifference: typeof import("@vueuse/core")["useArrayDifference"];
-  const useArrayEvery: typeof import("@vueuse/core")["useArrayEvery"];
-  const useArrayFilter: typeof import("@vueuse/core")["useArrayFilter"];
-  const useArrayFind: typeof import("@vueuse/core")["useArrayFind"];
-  const useArrayFindIndex: typeof import("@vueuse/core")["useArrayFindIndex"];
-  const useArrayFindLast: typeof import("@vueuse/core")["useArrayFindLast"];
-  const useArrayIncludes: typeof import("@vueuse/core")["useArrayIncludes"];
-  const useArrayJoin: typeof import("@vueuse/core")["useArrayJoin"];
-  const useArrayMap: typeof import("@vueuse/core")["useArrayMap"];
-  const useArrayReduce: typeof import("@vueuse/core")["useArrayReduce"];
-  const useArraySome: typeof import("@vueuse/core")["useArraySome"];
-  const useArrayUnique: typeof import("@vueuse/core")["useArrayUnique"];
-  const useAsyncQueue: typeof import("@vueuse/core")["useAsyncQueue"];
-  const useAsyncState: typeof import("@vueuse/core")["useAsyncState"];
-  const useAttrs: typeof import("vue")["useAttrs"];
-  const useBase64: typeof import("@vueuse/core")["useBase64"];
-  const useBattery: typeof import("@vueuse/core")["useBattery"];
-  const useBluetooth: typeof import("@vueuse/core")["useBluetooth"];
-  const useBreakpoints: typeof import("@vueuse/core")["useBreakpoints"];
-  const useBroadcastChannel: typeof import("@vueuse/core")["useBroadcastChannel"];
-  const useBrowserLocation: typeof import("@vueuse/core")["useBrowserLocation"];
-  const useCached: typeof import("@vueuse/core")["useCached"];
-  const useClipboard: typeof import("@vueuse/core")["useClipboard"];
-  const useCloned: typeof import("@vueuse/core")["useCloned"];
-  const useColorMode: typeof import("@vueuse/core")["useColorMode"];
-  const useConfirmDialog: typeof import("@vueuse/core")["useConfirmDialog"];
-  const useCounter: typeof import("@vueuse/core")["useCounter"];
-  const useCssModule: typeof import("vue")["useCssModule"];
-  const useCssVar: typeof import("@vueuse/core")["useCssVar"];
-  const useCssVars: typeof import("vue")["useCssVars"];
-  const useCurrentElement: typeof import("@vueuse/core")["useCurrentElement"];
-  const useCycleList: typeof import("@vueuse/core")["useCycleList"];
-  const useDark: typeof import("@vueuse/core")["useDark"];
-  const useDateFormat: typeof import("@vueuse/core")["useDateFormat"];
-  const useDebounce: typeof import("@vueuse/core")["useDebounce"];
-  const useDebounceFn: typeof import("@vueuse/core")["useDebounceFn"];
-  const useDebouncedRefHistory: typeof import("@vueuse/core")["useDebouncedRefHistory"];
-  const useDeviceMotion: typeof import("@vueuse/core")["useDeviceMotion"];
-  const useDeviceOrientation: typeof import("@vueuse/core")["useDeviceOrientation"];
-  const useDevicePixelRatio: typeof import("@vueuse/core")["useDevicePixelRatio"];
-  const useDevicesList: typeof import("@vueuse/core")["useDevicesList"];
-  const useDisplayMedia: typeof import("@vueuse/core")["useDisplayMedia"];
-  const useDocumentVisibility: typeof import("@vueuse/core")["useDocumentVisibility"];
-  const useDraggable: typeof import("@vueuse/core")["useDraggable"];
-  const useDropZone: typeof import("@vueuse/core")["useDropZone"];
-  const useElementBounding: typeof import("@vueuse/core")["useElementBounding"];
-  const useElementByPoint: typeof import("@vueuse/core")["useElementByPoint"];
-  const useElementHover: typeof import("@vueuse/core")["useElementHover"];
-  const useElementSize: typeof import("@vueuse/core")["useElementSize"];
-  const useElementVisibility: typeof import("@vueuse/core")["useElementVisibility"];
-  const useEventBus: typeof import("@vueuse/core")["useEventBus"];
-  const useEventListener: typeof import("@vueuse/core")["useEventListener"];
-  const useEventSource: typeof import("@vueuse/core")["useEventSource"];
-  const useEyeDropper: typeof import("@vueuse/core")["useEyeDropper"];
-  const useFavicon: typeof import("@vueuse/core")["useFavicon"];
-  const useFetch: typeof import("@vueuse/core")["useFetch"];
-  const useFileDialog: typeof import("@vueuse/core")["useFileDialog"];
-  const useFileSystemAccess: typeof import("@vueuse/core")["useFileSystemAccess"];
-  const useFocus: typeof import("@vueuse/core")["useFocus"];
-  const useFocusWithin: typeof import("@vueuse/core")["useFocusWithin"];
-  const useFps: typeof import("@vueuse/core")["useFps"];
-  const useFullscreen: typeof import("@vueuse/core")["useFullscreen"];
-  const useGamepad: typeof import("@vueuse/core")["useGamepad"];
-  const useGeolocation: typeof import("@vueuse/core")["useGeolocation"];
-  const useIdle: typeof import("@vueuse/core")["useIdle"];
-  const useImage: typeof import("@vueuse/core")["useImage"];
-  const useInfiniteScroll: typeof import("@vueuse/core")["useInfiniteScroll"];
-  const useIntersectionObserver: typeof import("@vueuse/core")["useIntersectionObserver"];
-  const useInterval: typeof import("@vueuse/core")["useInterval"];
-  const useIntervalFn: typeof import("@vueuse/core")["useIntervalFn"];
-  const useKeyModifier: typeof import("@vueuse/core")["useKeyModifier"];
-  const useLastChanged: typeof import("@vueuse/core")["useLastChanged"];
-  const useLocalStorage: typeof import("@vueuse/core")["useLocalStorage"];
-  const useMagicKeys: typeof import("@vueuse/core")["useMagicKeys"];
-  const useManualRefHistory: typeof import("@vueuse/core")["useManualRefHistory"];
-  const useMediaControls: typeof import("@vueuse/core")["useMediaControls"];
-  const useMediaQuery: typeof import("@vueuse/core")["useMediaQuery"];
-  const useMemoize: typeof import("@vueuse/core")["useMemoize"];
-  const useMemory: typeof import("@vueuse/core")["useMemory"];
-  const useMounted: typeof import("@vueuse/core")["useMounted"];
-  const useMouse: typeof import("@vueuse/core")["useMouse"];
-  const useMouseInElement: typeof import("@vueuse/core")["useMouseInElement"];
-  const useMousePressed: typeof import("@vueuse/core")["useMousePressed"];
-  const useMutationObserver: typeof import("@vueuse/core")["useMutationObserver"];
-  const useNavigatorLanguage: typeof import("@vueuse/core")["useNavigatorLanguage"];
-  const useNetwork: typeof import("@vueuse/core")["useNetwork"];
-  const useNow: typeof import("@vueuse/core")["useNow"];
-  const useObjectUrl: typeof import("@vueuse/core")["useObjectUrl"];
-  const useOffsetPagination: typeof import("@vueuse/core")["useOffsetPagination"];
-  const useOnline: typeof import("@vueuse/core")["useOnline"];
-  const usePageLeave: typeof import("@vueuse/core")["usePageLeave"];
-  const useParallax: typeof import("@vueuse/core")["useParallax"];
-  const useParentElement: typeof import("@vueuse/core")["useParentElement"];
-  const usePerformanceObserver: typeof import("@vueuse/core")["usePerformanceObserver"];
-  const usePermission: typeof import("@vueuse/core")["usePermission"];
-  const usePointer: typeof import("@vueuse/core")["usePointer"];
-  const usePointerLock: typeof import("@vueuse/core")["usePointerLock"];
-  const usePointerSwipe: typeof import("@vueuse/core")["usePointerSwipe"];
-  const usePreferredColorScheme: typeof import("@vueuse/core")["usePreferredColorScheme"];
-  const usePreferredContrast: typeof import("@vueuse/core")["usePreferredContrast"];
-  const usePreferredDark: typeof import("@vueuse/core")["usePreferredDark"];
-  const usePreferredLanguages: typeof import("@vueuse/core")["usePreferredLanguages"];
-  const usePreferredReducedMotion: typeof import("@vueuse/core")["usePreferredReducedMotion"];
-  const usePrevious: typeof import("@vueuse/core")["usePrevious"];
-  const useRafFn: typeof import("@vueuse/core")["useRafFn"];
-  const useRefHistory: typeof import("@vueuse/core")["useRefHistory"];
-  const useResizeObserver: typeof import("@vueuse/core")["useResizeObserver"];
-  const useScreenOrientation: typeof import("@vueuse/core")["useScreenOrientation"];
-  const useScreenSafeArea: typeof import("@vueuse/core")["useScreenSafeArea"];
-  const useScriptTag: typeof import("@vueuse/core")["useScriptTag"];
-  const useScroll: typeof import("@vueuse/core")["useScroll"];
-  const useScrollLock: typeof import("@vueuse/core")["useScrollLock"];
-  const useSessionStorage: typeof import("@vueuse/core")["useSessionStorage"];
-  const useShare: typeof import("@vueuse/core")["useShare"];
-  const useSlots: typeof import("vue")["useSlots"];
-  const useSorted: typeof import("@vueuse/core")["useSorted"];
-  const useSpeechRecognition: typeof import("@vueuse/core")["useSpeechRecognition"];
-  const useSpeechSynthesis: typeof import("@vueuse/core")["useSpeechSynthesis"];
-  const useStepper: typeof import("@vueuse/core")["useStepper"];
-  const useStorage: typeof import("@vueuse/core")["useStorage"];
-  const useStorageAsync: typeof import("@vueuse/core")["useStorageAsync"];
-  const useStyleTag: typeof import("@vueuse/core")["useStyleTag"];
-  const useSupported: typeof import("@vueuse/core")["useSupported"];
-  const useSwipe: typeof import("@vueuse/core")["useSwipe"];
-  const useTemplateRefsList: typeof import("@vueuse/core")["useTemplateRefsList"];
-  const useTextDirection: typeof import("@vueuse/core")["useTextDirection"];
-  const useTextSelection: typeof import("@vueuse/core")["useTextSelection"];
-  const useTextareaAutosize: typeof import("@vueuse/core")["useTextareaAutosize"];
-  const useThrottle: typeof import("@vueuse/core")["useThrottle"];
-  const useThrottleFn: typeof import("@vueuse/core")["useThrottleFn"];
-  const useThrottledRefHistory: typeof import("@vueuse/core")["useThrottledRefHistory"];
-  const useTimeAgo: typeof import("@vueuse/core")["useTimeAgo"];
-  const useTimeout: typeof import("@vueuse/core")["useTimeout"];
-  const useTimeoutFn: typeof import("@vueuse/core")["useTimeoutFn"];
-  const useTimeoutPoll: typeof import("@vueuse/core")["useTimeoutPoll"];
-  const useTimestamp: typeof import("@vueuse/core")["useTimestamp"];
-  const useTitle: typeof import("@vueuse/core")["useTitle"];
-  const useToNumber: typeof import("@vueuse/core")["useToNumber"];
-  const useToString: typeof import("@vueuse/core")["useToString"];
-  const useToggle: typeof import("@vueuse/core")["useToggle"];
-  const useTransition: typeof import("@vueuse/core")["useTransition"];
-  const useUrlSearchParams: typeof import("@vueuse/core")["useUrlSearchParams"];
-  const useUserMedia: typeof import("@vueuse/core")["useUserMedia"];
-  const useVModel: typeof import("@vueuse/core")["useVModel"];
-  const useVModels: typeof import("@vueuse/core")["useVModels"];
-  const useVibrate: typeof import("@vueuse/core")["useVibrate"];
-  const useVirtualList: typeof import("@vueuse/core")["useVirtualList"];
-  const useWakeLock: typeof import("@vueuse/core")["useWakeLock"];
-  const useWebNotification: typeof import("@vueuse/core")["useWebNotification"];
-  const useWebSocket: typeof import("@vueuse/core")["useWebSocket"];
-  const useWebWorker: typeof import("@vueuse/core")["useWebWorker"];
-  const useWebWorkerFn: typeof import("@vueuse/core")["useWebWorkerFn"];
-  const useWindowFocus: typeof import("@vueuse/core")["useWindowFocus"];
-  const useWindowScroll: typeof import("@vueuse/core")["useWindowScroll"];
-  const useWindowSize: typeof import("@vueuse/core")["useWindowSize"];
-  const watch: typeof import("vue")["watch"];
-  const watchArray: typeof import("@vueuse/core")["watchArray"];
-  const watchAtMost: typeof import("@vueuse/core")["watchAtMost"];
-  const watchDebounced: typeof import("@vueuse/core")["watchDebounced"];
-  const watchDeep: typeof import("@vueuse/core")["watchDeep"];
-  const watchEffect: typeof import("vue")["watchEffect"];
-  const watchIgnorable: typeof import("@vueuse/core")["watchIgnorable"];
-  const watchImmediate: typeof import("@vueuse/core")["watchImmediate"];
-  const watchOnce: typeof import("@vueuse/core")["watchOnce"];
-  const watchPausable: typeof import("@vueuse/core")["watchPausable"];
-  const watchPostEffect: typeof import("vue")["watchPostEffect"];
-  const watchSyncEffect: typeof import("vue")["watchSyncEffect"];
-  const watchThrottled: typeof import("@vueuse/core")["watchThrottled"];
-  const watchTriggerable: typeof import("@vueuse/core")["watchTriggerable"];
-  const watchWithFilter: typeof import("@vueuse/core")["watchWithFilter"];
-  const whenever: typeof import("@vueuse/core")["whenever"];
+  const EffectScope: typeof import('vue')['EffectScope']
+  const ElForm: typeof import('element-plus/es')['ElForm']
+  const ElMessage: typeof import('element-plus/es')['ElMessage']
+  const ElNotification: typeof import('element-plus/es')['ElNotification']
+  const ElMessageBox: typeof import('element-plus/es')['ElMessageBox']
+  const ElTree: typeof import('element-plus/es')['ElTree']
+  const asyncComputed: typeof import('@vueuse/core')['asyncComputed']
+  const autoResetRef: typeof import('@vueuse/core')['autoResetRef']
+  const computed: typeof import('vue')['computed']
+  const computedAsync: typeof import('@vueuse/core')['computedAsync']
+  const computedEager: typeof import('@vueuse/core')['computedEager']
+  const computedInject: typeof import('@vueuse/core')['computedInject']
+  const computedWithControl: typeof import('@vueuse/core')['computedWithControl']
+  const controlledComputed: typeof import('@vueuse/core')['controlledComputed']
+  const controlledRef: typeof import('@vueuse/core')['controlledRef']
+  const createApp: typeof import('vue')['createApp']
+  const createEventHook: typeof import('@vueuse/core')['createEventHook']
+  const createGlobalState: typeof import('@vueuse/core')['createGlobalState']
+  const createInjectionState: typeof import('@vueuse/core')['createInjectionState']
+  const createReactiveFn: typeof import('@vueuse/core')['createReactiveFn']
+  const createReusableTemplate: typeof import('@vueuse/core')['createReusableTemplate']
+  const createSharedComposable: typeof import('@vueuse/core')['createSharedComposable']
+  const createTemplatePromise: typeof import('@vueuse/core')['createTemplatePromise']
+  const createUnrefFn: typeof import('@vueuse/core')['createUnrefFn']
+  const customRef: typeof import('vue')['customRef']
+  const debouncedRef: typeof import('@vueuse/core')['debouncedRef']
+  const debouncedWatch: typeof import('@vueuse/core')['debouncedWatch']
+  const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
+  const defineComponent: typeof import('vue')['defineComponent']
+  const eagerComputed: typeof import('@vueuse/core')['eagerComputed']
+  const effectScope: typeof import('vue')['effectScope']
+  const extendRef: typeof import('@vueuse/core')['extendRef']
+  const getCurrentInstance: typeof import('vue')['getCurrentInstance']
+  const getCurrentScope: typeof import('vue')['getCurrentScope']
+  const h: typeof import('vue')['h']
+  const ignorableWatch: typeof import('@vueuse/core')['ignorableWatch']
+  const inject: typeof import('vue')['inject']
+  const isDefined: typeof import('@vueuse/core')['isDefined']
+  const isProxy: typeof import('vue')['isProxy']
+  const isReactive: typeof import('vue')['isReactive']
+  const isReadonly: typeof import('vue')['isReadonly']
+  const isRef: typeof import('vue')['isRef']
+  const makeDestructurable: typeof import('@vueuse/core')['makeDestructurable']
+  const markRaw: typeof import('vue')['markRaw']
+  const nextTick: typeof import('vue')['nextTick']
+  const onActivated: typeof import('vue')['onActivated']
+  const onBeforeMount: typeof import('vue')['onBeforeMount']
+  const onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
+  const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
+  const onClickOutside: typeof import('@vueuse/core')['onClickOutside']
+  const onDeactivated: typeof import('vue')['onDeactivated']
+  const onErrorCaptured: typeof import('vue')['onErrorCaptured']
+  const onKeyStroke: typeof import('@vueuse/core')['onKeyStroke']
+  const onLongPress: typeof import('@vueuse/core')['onLongPress']
+  const onMounted: typeof import('vue')['onMounted']
+  const onRenderTracked: typeof import('vue')['onRenderTracked']
+  const onRenderTriggered: typeof import('vue')['onRenderTriggered']
+  const onScopeDispose: typeof import('vue')['onScopeDispose']
+  const onServerPrefetch: typeof import('vue')['onServerPrefetch']
+  const onStartTyping: typeof import('@vueuse/core')['onStartTyping']
+  const onUnmounted: typeof import('vue')['onUnmounted']
+  const onUpdated: typeof import('vue')['onUpdated']
+  const pausableWatch: typeof import('@vueuse/core')['pausableWatch']
+  const provide: typeof import('vue')['provide']
+  const reactify: typeof import('@vueuse/core')['reactify']
+  const reactifyObject: typeof import('@vueuse/core')['reactifyObject']
+  const reactive: typeof import('vue')['reactive']
+  const reactiveComputed: typeof import('@vueuse/core')['reactiveComputed']
+  const reactiveOmit: typeof import('@vueuse/core')['reactiveOmit']
+  const reactivePick: typeof import('@vueuse/core')['reactivePick']
+  const readonly: typeof import('vue')['readonly']
+  const ref: typeof import('vue')['ref']
+  const refAutoReset: typeof import('@vueuse/core')['refAutoReset']
+  const refDebounced: typeof import('@vueuse/core')['refDebounced']
+  const refDefault: typeof import('@vueuse/core')['refDefault']
+  const refThrottled: typeof import('@vueuse/core')['refThrottled']
+  const refWithControl: typeof import('@vueuse/core')['refWithControl']
+  const resolveComponent: typeof import('vue')['resolveComponent']
+  const resolveRef: typeof import('@vueuse/core')['resolveRef']
+  const resolveUnref: typeof import('@vueuse/core')['resolveUnref']
+  const shallowReactive: typeof import('vue')['shallowReactive']
+  const shallowReadonly: typeof import('vue')['shallowReadonly']
+  const shallowRef: typeof import('vue')['shallowRef']
+  const syncRef: typeof import('@vueuse/core')['syncRef']
+  const syncRefs: typeof import('@vueuse/core')['syncRefs']
+  const templateRef: typeof import('@vueuse/core')['templateRef']
+  const throttledRef: typeof import('@vueuse/core')['throttledRef']
+  const throttledWatch: typeof import('@vueuse/core')['throttledWatch']
+  const toRaw: typeof import('vue')['toRaw']
+  const toReactive: typeof import('@vueuse/core')['toReactive']
+  const toRef: typeof import('vue')['toRef']
+  const toRefs: typeof import('vue')['toRefs']
+  const toValue: typeof import('vue')['toValue']
+  const triggerRef: typeof import('vue')['triggerRef']
+  const tryOnBeforeMount: typeof import('@vueuse/core')['tryOnBeforeMount']
+  const tryOnBeforeUnmount: typeof import('@vueuse/core')['tryOnBeforeUnmount']
+  const tryOnMounted: typeof import('@vueuse/core')['tryOnMounted']
+  const tryOnScopeDispose: typeof import('@vueuse/core')['tryOnScopeDispose']
+  const tryOnUnmounted: typeof import('@vueuse/core')['tryOnUnmounted']
+  const unref: typeof import('vue')['unref']
+  const unrefElement: typeof import('@vueuse/core')['unrefElement']
+  const until: typeof import('@vueuse/core')['until']
+  const useActiveElement: typeof import('@vueuse/core')['useActiveElement']
+  const useAnimate: typeof import('@vueuse/core')['useAnimate']
+  const useArrayDifference: typeof import('@vueuse/core')['useArrayDifference']
+  const useArrayEvery: typeof import('@vueuse/core')['useArrayEvery']
+  const useArrayFilter: typeof import('@vueuse/core')['useArrayFilter']
+  const useArrayFind: typeof import('@vueuse/core')['useArrayFind']
+  const useArrayFindIndex: typeof import('@vueuse/core')['useArrayFindIndex']
+  const useArrayFindLast: typeof import('@vueuse/core')['useArrayFindLast']
+  const useArrayIncludes: typeof import('@vueuse/core')['useArrayIncludes']
+  const useArrayJoin: typeof import('@vueuse/core')['useArrayJoin']
+  const useArrayMap: typeof import('@vueuse/core')['useArrayMap']
+  const useArrayReduce: typeof import('@vueuse/core')['useArrayReduce']
+  const useArraySome: typeof import('@vueuse/core')['useArraySome']
+  const useArrayUnique: typeof import('@vueuse/core')['useArrayUnique']
+  const useAsyncQueue: typeof import('@vueuse/core')['useAsyncQueue']
+  const useAsyncState: typeof import('@vueuse/core')['useAsyncState']
+  const useAttrs: typeof import('vue')['useAttrs']
+  const useBase64: typeof import('@vueuse/core')['useBase64']
+  const useBattery: typeof import('@vueuse/core')['useBattery']
+  const useBluetooth: typeof import('@vueuse/core')['useBluetooth']
+  const useBreakpoints: typeof import('@vueuse/core')['useBreakpoints']
+  const useBroadcastChannel: typeof import('@vueuse/core')['useBroadcastChannel']
+  const useBrowserLocation: typeof import('@vueuse/core')['useBrowserLocation']
+  const useCached: typeof import('@vueuse/core')['useCached']
+  const useClipboard: typeof import('@vueuse/core')['useClipboard']
+  const useCloned: typeof import('@vueuse/core')['useCloned']
+  const useColorMode: typeof import('@vueuse/core')['useColorMode']
+  const useConfirmDialog: typeof import('@vueuse/core')['useConfirmDialog']
+  const useCounter: typeof import('@vueuse/core')['useCounter']
+  const useCssModule: typeof import('vue')['useCssModule']
+  const useCssVar: typeof import('@vueuse/core')['useCssVar']
+  const useCssVars: typeof import('vue')['useCssVars']
+  const useCurrentElement: typeof import('@vueuse/core')['useCurrentElement']
+  const useCycleList: typeof import('@vueuse/core')['useCycleList']
+  const useDark: typeof import('@vueuse/core')['useDark']
+  const useDateFormat: typeof import('@vueuse/core')['useDateFormat']
+  const useDebounce: typeof import('@vueuse/core')['useDebounce']
+  const useDebounceFn: typeof import('@vueuse/core')['useDebounceFn']
+  const useDebouncedRefHistory: typeof import('@vueuse/core')['useDebouncedRefHistory']
+  const useDeviceMotion: typeof import('@vueuse/core')['useDeviceMotion']
+  const useDeviceOrientation: typeof import('@vueuse/core')['useDeviceOrientation']
+  const useDevicePixelRatio: typeof import('@vueuse/core')['useDevicePixelRatio']
+  const useDevicesList: typeof import('@vueuse/core')['useDevicesList']
+  const useDisplayMedia: typeof import('@vueuse/core')['useDisplayMedia']
+  const useDocumentVisibility: typeof import('@vueuse/core')['useDocumentVisibility']
+  const useDraggable: typeof import('@vueuse/core')['useDraggable']
+  const useDropZone: typeof import('@vueuse/core')['useDropZone']
+  const useElementBounding: typeof import('@vueuse/core')['useElementBounding']
+  const useElementByPoint: typeof import('@vueuse/core')['useElementByPoint']
+  const useElementHover: typeof import('@vueuse/core')['useElementHover']
+  const useElementSize: typeof import('@vueuse/core')['useElementSize']
+  const useElementVisibility: typeof import('@vueuse/core')['useElementVisibility']
+  const useEventBus: typeof import('@vueuse/core')['useEventBus']
+  const useEventListener: typeof import('@vueuse/core')['useEventListener']
+  const useEventSource: typeof import('@vueuse/core')['useEventSource']
+  const useEyeDropper: typeof import('@vueuse/core')['useEyeDropper']
+  const useFavicon: typeof import('@vueuse/core')['useFavicon']
+  const useFetch: typeof import('@vueuse/core')['useFetch']
+  const useFileDialog: typeof import('@vueuse/core')['useFileDialog']
+  const useFileSystemAccess: typeof import('@vueuse/core')['useFileSystemAccess']
+  const useFocus: typeof import('@vueuse/core')['useFocus']
+  const useFocusWithin: typeof import('@vueuse/core')['useFocusWithin']
+  const useFps: typeof import('@vueuse/core')['useFps']
+  const useFullscreen: typeof import('@vueuse/core')['useFullscreen']
+  const useGamepad: typeof import('@vueuse/core')['useGamepad']
+  const useGeolocation: typeof import('@vueuse/core')['useGeolocation']
+  const useIdle: typeof import('@vueuse/core')['useIdle']
+  const useImage: typeof import('@vueuse/core')['useImage']
+  const useInfiniteScroll: typeof import('@vueuse/core')['useInfiniteScroll']
+  const useIntersectionObserver: typeof import('@vueuse/core')['useIntersectionObserver']
+  const useInterval: typeof import('@vueuse/core')['useInterval']
+  const useIntervalFn: typeof import('@vueuse/core')['useIntervalFn']
+  const useKeyModifier: typeof import('@vueuse/core')['useKeyModifier']
+  const useLastChanged: typeof import('@vueuse/core')['useLastChanged']
+  const useLocalStorage: typeof import('@vueuse/core')['useLocalStorage']
+  const useMagicKeys: typeof import('@vueuse/core')['useMagicKeys']
+  const useManualRefHistory: typeof import('@vueuse/core')['useManualRefHistory']
+  const useMediaControls: typeof import('@vueuse/core')['useMediaControls']
+  const useMediaQuery: typeof import('@vueuse/core')['useMediaQuery']
+  const useMemoize: typeof import('@vueuse/core')['useMemoize']
+  const useMemory: typeof import('@vueuse/core')['useMemory']
+  const useMounted: typeof import('@vueuse/core')['useMounted']
+  const useMouse: typeof import('@vueuse/core')['useMouse']
+  const useMouseInElement: typeof import('@vueuse/core')['useMouseInElement']
+  const useMousePressed: typeof import('@vueuse/core')['useMousePressed']
+  const useMutationObserver: typeof import('@vueuse/core')['useMutationObserver']
+  const useNavigatorLanguage: typeof import('@vueuse/core')['useNavigatorLanguage']
+  const useNetwork: typeof import('@vueuse/core')['useNetwork']
+  const useNow: typeof import('@vueuse/core')['useNow']
+  const useObjectUrl: typeof import('@vueuse/core')['useObjectUrl']
+  const useOffsetPagination: typeof import('@vueuse/core')['useOffsetPagination']
+  const useOnline: typeof import('@vueuse/core')['useOnline']
+  const usePageLeave: typeof import('@vueuse/core')['usePageLeave']
+  const useParallax: typeof import('@vueuse/core')['useParallax']
+  const useParentElement: typeof import('@vueuse/core')['useParentElement']
+  const usePerformanceObserver: typeof import('@vueuse/core')['usePerformanceObserver']
+  const usePermission: typeof import('@vueuse/core')['usePermission']
+  const usePointer: typeof import('@vueuse/core')['usePointer']
+  const usePointerLock: typeof import('@vueuse/core')['usePointerLock']
+  const usePointerSwipe: typeof import('@vueuse/core')['usePointerSwipe']
+  const usePreferredColorScheme: typeof import('@vueuse/core')['usePreferredColorScheme']
+  const usePreferredContrast: typeof import('@vueuse/core')['usePreferredContrast']
+  const usePreferredDark: typeof import('@vueuse/core')['usePreferredDark']
+  const usePreferredLanguages: typeof import('@vueuse/core')['usePreferredLanguages']
+  const usePreferredReducedMotion: typeof import('@vueuse/core')['usePreferredReducedMotion']
+  const usePrevious: typeof import('@vueuse/core')['usePrevious']
+  const useRafFn: typeof import('@vueuse/core')['useRafFn']
+  const useRefHistory: typeof import('@vueuse/core')['useRefHistory']
+  const useResizeObserver: typeof import('@vueuse/core')['useResizeObserver']
+  const useScreenOrientation: typeof import('@vueuse/core')['useScreenOrientation']
+  const useScreenSafeArea: typeof import('@vueuse/core')['useScreenSafeArea']
+  const useScriptTag: typeof import('@vueuse/core')['useScriptTag']
+  const useScroll: typeof import('@vueuse/core')['useScroll']
+  const useScrollLock: typeof import('@vueuse/core')['useScrollLock']
+  const useSessionStorage: typeof import('@vueuse/core')['useSessionStorage']
+  const useShare: typeof import('@vueuse/core')['useShare']
+  const useSlots: typeof import('vue')['useSlots']
+  const useSorted: typeof import('@vueuse/core')['useSorted']
+  const useSpeechRecognition: typeof import('@vueuse/core')['useSpeechRecognition']
+  const useSpeechSynthesis: typeof import('@vueuse/core')['useSpeechSynthesis']
+  const useStepper: typeof import('@vueuse/core')['useStepper']
+  const useStorage: typeof import('@vueuse/core')['useStorage']
+  const useStorageAsync: typeof import('@vueuse/core')['useStorageAsync']
+  const useStyleTag: typeof import('@vueuse/core')['useStyleTag']
+  const useSupported: typeof import('@vueuse/core')['useSupported']
+  const useSwipe: typeof import('@vueuse/core')['useSwipe']
+  const useTemplateRefsList: typeof import('@vueuse/core')['useTemplateRefsList']
+  const useTextDirection: typeof import('@vueuse/core')['useTextDirection']
+  const useTextSelection: typeof import('@vueuse/core')['useTextSelection']
+  const useTextareaAutosize: typeof import('@vueuse/core')['useTextareaAutosize']
+  const useThrottle: typeof import('@vueuse/core')['useThrottle']
+  const useThrottleFn: typeof import('@vueuse/core')['useThrottleFn']
+  const useThrottledRefHistory: typeof import('@vueuse/core')['useThrottledRefHistory']
+  const useTimeAgo: typeof import('@vueuse/core')['useTimeAgo']
+  const useTimeout: typeof import('@vueuse/core')['useTimeout']
+  const useTimeoutFn: typeof import('@vueuse/core')['useTimeoutFn']
+  const useTimeoutPoll: typeof import('@vueuse/core')['useTimeoutPoll']
+  const useTimestamp: typeof import('@vueuse/core')['useTimestamp']
+  const useTitle: typeof import('@vueuse/core')['useTitle']
+  const useToNumber: typeof import('@vueuse/core')['useToNumber']
+  const useToString: typeof import('@vueuse/core')['useToString']
+  const useToggle: typeof import('@vueuse/core')['useToggle']
+  const useTransition: typeof import('@vueuse/core')['useTransition']
+  const useUrlSearchParams: typeof import('@vueuse/core')['useUrlSearchParams']
+  const useUserMedia: typeof import('@vueuse/core')['useUserMedia']
+  const useVModel: typeof import('@vueuse/core')['useVModel']
+  const useVModels: typeof import('@vueuse/core')['useVModels']
+  const useVibrate: typeof import('@vueuse/core')['useVibrate']
+  const useVirtualList: typeof import('@vueuse/core')['useVirtualList']
+  const useWakeLock: typeof import('@vueuse/core')['useWakeLock']
+  const useWebNotification: typeof import('@vueuse/core')['useWebNotification']
+  const useWebSocket: typeof import('@vueuse/core')['useWebSocket']
+  const useWebWorker: typeof import('@vueuse/core')['useWebWorker']
+  const useWebWorkerFn: typeof import('@vueuse/core')['useWebWorkerFn']
+  const useWindowFocus: typeof import('@vueuse/core')['useWindowFocus']
+  const useWindowScroll: typeof import('@vueuse/core')['useWindowScroll']
+  const useWindowSize: typeof import('@vueuse/core')['useWindowSize']
+  const watch: typeof import('vue')['watch']
+  const watchArray: typeof import('@vueuse/core')['watchArray']
+  const watchAtMost: typeof import('@vueuse/core')['watchAtMost']
+  const watchDebounced: typeof import('@vueuse/core')['watchDebounced']
+  const watchDeep: typeof import('@vueuse/core')['watchDeep']
+  const watchEffect: typeof import('vue')['watchEffect']
+  const watchIgnorable: typeof import('@vueuse/core')['watchIgnorable']
+  const watchImmediate: typeof import('@vueuse/core')['watchImmediate']
+  const watchOnce: typeof import('@vueuse/core')['watchOnce']
+  const watchPausable: typeof import('@vueuse/core')['watchPausable']
+  const watchPostEffect: typeof import('vue')['watchPostEffect']
+  const watchSyncEffect: typeof import('vue')['watchSyncEffect']
+  const watchThrottled: typeof import('@vueuse/core')['watchThrottled']
+  const watchTriggerable: typeof import('@vueuse/core')['watchTriggerable']
+  const watchWithFilter: typeof import('@vueuse/core')['watchWithFilter']
+  const whenever: typeof import('@vueuse/core')['whenever']
 }
 // for type re-export
 declare global {
@@ -290,1300 +290,1260 @@ declare global {
     InjectionKey,
     PropType,
     Ref,
-    VNode,
-  } from "vue";
+    VNode
+  } from 'vue'
 }
 // for vue template auto import
-import { UnwrapRef } from "vue";
-declare module "vue" {
+import { UnwrapRef } from 'vue'
+declare module 'vue' {
   interface ComponentCustomProperties {
-    readonly EffectScope: UnwrapRef<typeof import("vue")["EffectScope"]>;
-    readonly ElForm: UnwrapRef<typeof import("element-plus/es")["ElForm"]>;
-    readonly ElMessage: UnwrapRef<
-      typeof import("element-plus/es")["ElMessage"]
-    >;
+    readonly EffectScope: UnwrapRef<typeof import('vue')['EffectScope']>
+    readonly ElForm: UnwrapRef<typeof import('element-plus/es')['ElForm']>
+    readonly ElMessage: UnwrapRef<typeof import('element-plus/es')['ElMessage']>
     readonly ElMessageBox: UnwrapRef<
-      typeof import("element-plus/es")["ElMessageBox"]
-    >;
-    readonly ElTree: UnwrapRef<typeof import("element-plus/es")["ElTree"]>;
+      typeof import('element-plus/es')['ElMessageBox']
+    >
+    readonly ElTree: UnwrapRef<typeof import('element-plus/es')['ElTree']>
     readonly asyncComputed: UnwrapRef<
-      typeof import("@vueuse/core")["asyncComputed"]
-    >;
+      typeof import('@vueuse/core')['asyncComputed']
+    >
     readonly autoResetRef: UnwrapRef<
-      typeof import("@vueuse/core")["autoResetRef"]
-    >;
-    readonly computed: UnwrapRef<typeof import("vue")["computed"]>;
+      typeof import('@vueuse/core')['autoResetRef']
+    >
+    readonly computed: UnwrapRef<typeof import('vue')['computed']>
     readonly computedAsync: UnwrapRef<
-      typeof import("@vueuse/core")["computedAsync"]
-    >;
+      typeof import('@vueuse/core')['computedAsync']
+    >
     readonly computedEager: UnwrapRef<
-      typeof import("@vueuse/core")["computedEager"]
-    >;
+      typeof import('@vueuse/core')['computedEager']
+    >
     readonly computedInject: UnwrapRef<
-      typeof import("@vueuse/core")["computedInject"]
-    >;
+      typeof import('@vueuse/core')['computedInject']
+    >
     readonly computedWithControl: UnwrapRef<
-      typeof import("@vueuse/core")["computedWithControl"]
-    >;
+      typeof import('@vueuse/core')['computedWithControl']
+    >
     readonly controlledComputed: UnwrapRef<
-      typeof import("@vueuse/core")["controlledComputed"]
-    >;
+      typeof import('@vueuse/core')['controlledComputed']
+    >
     readonly controlledRef: UnwrapRef<
-      typeof import("@vueuse/core")["controlledRef"]
-    >;
-    readonly createApp: UnwrapRef<typeof import("vue")["createApp"]>;
+      typeof import('@vueuse/core')['controlledRef']
+    >
+    readonly createApp: UnwrapRef<typeof import('vue')['createApp']>
     readonly createEventHook: UnwrapRef<
-      typeof import("@vueuse/core")["createEventHook"]
-    >;
+      typeof import('@vueuse/core')['createEventHook']
+    >
     readonly createGlobalState: UnwrapRef<
-      typeof import("@vueuse/core")["createGlobalState"]
-    >;
+      typeof import('@vueuse/core')['createGlobalState']
+    >
     readonly createInjectionState: UnwrapRef<
-      typeof import("@vueuse/core")["createInjectionState"]
-    >;
+      typeof import('@vueuse/core')['createInjectionState']
+    >
     readonly createReactiveFn: UnwrapRef<
-      typeof import("@vueuse/core")["createReactiveFn"]
-    >;
+      typeof import('@vueuse/core')['createReactiveFn']
+    >
     readonly createReusableTemplate: UnwrapRef<
-      typeof import("@vueuse/core")["createReusableTemplate"]
-    >;
+      typeof import('@vueuse/core')['createReusableTemplate']
+    >
     readonly createSharedComposable: UnwrapRef<
-      typeof import("@vueuse/core")["createSharedComposable"]
-    >;
+      typeof import('@vueuse/core')['createSharedComposable']
+    >
     readonly createTemplatePromise: UnwrapRef<
-      typeof import("@vueuse/core")["createTemplatePromise"]
-    >;
+      typeof import('@vueuse/core')['createTemplatePromise']
+    >
     readonly createUnrefFn: UnwrapRef<
-      typeof import("@vueuse/core")["createUnrefFn"]
-    >;
-    readonly customRef: UnwrapRef<typeof import("vue")["customRef"]>;
+      typeof import('@vueuse/core')['createUnrefFn']
+    >
+    readonly customRef: UnwrapRef<typeof import('vue')['customRef']>
     readonly debouncedRef: UnwrapRef<
-      typeof import("@vueuse/core")["debouncedRef"]
-    >;
+      typeof import('@vueuse/core')['debouncedRef']
+    >
     readonly debouncedWatch: UnwrapRef<
-      typeof import("@vueuse/core")["debouncedWatch"]
-    >;
+      typeof import('@vueuse/core')['debouncedWatch']
+    >
     readonly defineAsyncComponent: UnwrapRef<
-      typeof import("vue")["defineAsyncComponent"]
-    >;
-    readonly defineComponent: UnwrapRef<
-      typeof import("vue")["defineComponent"]
-    >;
+      typeof import('vue')['defineAsyncComponent']
+    >
+    readonly defineComponent: UnwrapRef<typeof import('vue')['defineComponent']>
     readonly eagerComputed: UnwrapRef<
-      typeof import("@vueuse/core")["eagerComputed"]
-    >;
-    readonly effectScope: UnwrapRef<typeof import("vue")["effectScope"]>;
-    readonly extendRef: UnwrapRef<typeof import("@vueuse/core")["extendRef"]>;
+      typeof import('@vueuse/core')['eagerComputed']
+    >
+    readonly effectScope: UnwrapRef<typeof import('vue')['effectScope']>
+    readonly extendRef: UnwrapRef<typeof import('@vueuse/core')['extendRef']>
     readonly getCurrentInstance: UnwrapRef<
-      typeof import("vue")["getCurrentInstance"]
-    >;
-    readonly getCurrentScope: UnwrapRef<
-      typeof import("vue")["getCurrentScope"]
-    >;
-    readonly h: UnwrapRef<typeof import("vue")["h"]>;
+      typeof import('vue')['getCurrentInstance']
+    >
+    readonly getCurrentScope: UnwrapRef<typeof import('vue')['getCurrentScope']>
+    readonly h: UnwrapRef<typeof import('vue')['h']>
     readonly ignorableWatch: UnwrapRef<
-      typeof import("@vueuse/core")["ignorableWatch"]
-    >;
-    readonly inject: UnwrapRef<typeof import("vue")["inject"]>;
-    readonly isDefined: UnwrapRef<typeof import("@vueuse/core")["isDefined"]>;
-    readonly isProxy: UnwrapRef<typeof import("vue")["isProxy"]>;
-    readonly isReactive: UnwrapRef<typeof import("vue")["isReactive"]>;
-    readonly isReadonly: UnwrapRef<typeof import("vue")["isReadonly"]>;
-    readonly isRef: UnwrapRef<typeof import("vue")["isRef"]>;
+      typeof import('@vueuse/core')['ignorableWatch']
+    >
+    readonly inject: UnwrapRef<typeof import('vue')['inject']>
+    readonly isDefined: UnwrapRef<typeof import('@vueuse/core')['isDefined']>
+    readonly isProxy: UnwrapRef<typeof import('vue')['isProxy']>
+    readonly isReactive: UnwrapRef<typeof import('vue')['isReactive']>
+    readonly isReadonly: UnwrapRef<typeof import('vue')['isReadonly']>
+    readonly isRef: UnwrapRef<typeof import('vue')['isRef']>
     readonly makeDestructurable: UnwrapRef<
-      typeof import("@vueuse/core")["makeDestructurable"]
-    >;
-    readonly markRaw: UnwrapRef<typeof import("vue")["markRaw"]>;
-    readonly nextTick: UnwrapRef<typeof import("vue")["nextTick"]>;
-    readonly onActivated: UnwrapRef<typeof import("vue")["onActivated"]>;
-    readonly onBeforeMount: UnwrapRef<typeof import("vue")["onBeforeMount"]>;
-    readonly onBeforeUnmount: UnwrapRef<
-      typeof import("vue")["onBeforeUnmount"]
-    >;
-    readonly onBeforeUpdate: UnwrapRef<typeof import("vue")["onBeforeUpdate"]>;
+      typeof import('@vueuse/core')['makeDestructurable']
+    >
+    readonly markRaw: UnwrapRef<typeof import('vue')['markRaw']>
+    readonly nextTick: UnwrapRef<typeof import('vue')['nextTick']>
+    readonly onActivated: UnwrapRef<typeof import('vue')['onActivated']>
+    readonly onBeforeMount: UnwrapRef<typeof import('vue')['onBeforeMount']>
+    readonly onBeforeUnmount: UnwrapRef<typeof import('vue')['onBeforeUnmount']>
+    readonly onBeforeUpdate: UnwrapRef<typeof import('vue')['onBeforeUpdate']>
     readonly onClickOutside: UnwrapRef<
-      typeof import("@vueuse/core")["onClickOutside"]
-    >;
-    readonly onDeactivated: UnwrapRef<typeof import("vue")["onDeactivated"]>;
-    readonly onErrorCaptured: UnwrapRef<
-      typeof import("vue")["onErrorCaptured"]
-    >;
+      typeof import('@vueuse/core')['onClickOutside']
+    >
+    readonly onDeactivated: UnwrapRef<typeof import('vue')['onDeactivated']>
+    readonly onErrorCaptured: UnwrapRef<typeof import('vue')['onErrorCaptured']>
     readonly onKeyStroke: UnwrapRef<
-      typeof import("@vueuse/core")["onKeyStroke"]
-    >;
+      typeof import('@vueuse/core')['onKeyStroke']
+    >
     readonly onLongPress: UnwrapRef<
-      typeof import("@vueuse/core")["onLongPress"]
-    >;
-    readonly onMounted: UnwrapRef<typeof import("vue")["onMounted"]>;
-    readonly onRenderTracked: UnwrapRef<
-      typeof import("vue")["onRenderTracked"]
-    >;
+      typeof import('@vueuse/core')['onLongPress']
+    >
+    readonly onMounted: UnwrapRef<typeof import('vue')['onMounted']>
+    readonly onRenderTracked: UnwrapRef<typeof import('vue')['onRenderTracked']>
     readonly onRenderTriggered: UnwrapRef<
-      typeof import("vue")["onRenderTriggered"]
-    >;
-    readonly onScopeDispose: UnwrapRef<typeof import("vue")["onScopeDispose"]>;
+      typeof import('vue')['onRenderTriggered']
+    >
+    readonly onScopeDispose: UnwrapRef<typeof import('vue')['onScopeDispose']>
     readonly onServerPrefetch: UnwrapRef<
-      typeof import("vue")["onServerPrefetch"]
-    >;
+      typeof import('vue')['onServerPrefetch']
+    >
     readonly onStartTyping: UnwrapRef<
-      typeof import("@vueuse/core")["onStartTyping"]
-    >;
-    readonly onUnmounted: UnwrapRef<typeof import("vue")["onUnmounted"]>;
-    readonly onUpdated: UnwrapRef<typeof import("vue")["onUpdated"]>;
+      typeof import('@vueuse/core')['onStartTyping']
+    >
+    readonly onUnmounted: UnwrapRef<typeof import('vue')['onUnmounted']>
+    readonly onUpdated: UnwrapRef<typeof import('vue')['onUpdated']>
     readonly pausableWatch: UnwrapRef<
-      typeof import("@vueuse/core")["pausableWatch"]
-    >;
-    readonly provide: UnwrapRef<typeof import("vue")["provide"]>;
-    readonly reactify: UnwrapRef<typeof import("@vueuse/core")["reactify"]>;
+      typeof import('@vueuse/core')['pausableWatch']
+    >
+    readonly provide: UnwrapRef<typeof import('vue')['provide']>
+    readonly reactify: UnwrapRef<typeof import('@vueuse/core')['reactify']>
     readonly reactifyObject: UnwrapRef<
-      typeof import("@vueuse/core")["reactifyObject"]
-    >;
-    readonly reactive: UnwrapRef<typeof import("vue")["reactive"]>;
+      typeof import('@vueuse/core')['reactifyObject']
+    >
+    readonly reactive: UnwrapRef<typeof import('vue')['reactive']>
     readonly reactiveComputed: UnwrapRef<
-      typeof import("@vueuse/core")["reactiveComputed"]
-    >;
+      typeof import('@vueuse/core')['reactiveComputed']
+    >
     readonly reactiveOmit: UnwrapRef<
-      typeof import("@vueuse/core")["reactiveOmit"]
-    >;
+      typeof import('@vueuse/core')['reactiveOmit']
+    >
     readonly reactivePick: UnwrapRef<
-      typeof import("@vueuse/core")["reactivePick"]
-    >;
-    readonly readonly: UnwrapRef<typeof import("vue")["readonly"]>;
-    readonly ref: UnwrapRef<typeof import("vue")["ref"]>;
+      typeof import('@vueuse/core')['reactivePick']
+    >
+    readonly readonly: UnwrapRef<typeof import('vue')['readonly']>
+    readonly ref: UnwrapRef<typeof import('vue')['ref']>
     readonly refAutoReset: UnwrapRef<
-      typeof import("@vueuse/core")["refAutoReset"]
-    >;
+      typeof import('@vueuse/core')['refAutoReset']
+    >
     readonly refDebounced: UnwrapRef<
-      typeof import("@vueuse/core")["refDebounced"]
-    >;
-    readonly refDefault: UnwrapRef<typeof import("@vueuse/core")["refDefault"]>;
+      typeof import('@vueuse/core')['refDebounced']
+    >
+    readonly refDefault: UnwrapRef<typeof import('@vueuse/core')['refDefault']>
     readonly refThrottled: UnwrapRef<
-      typeof import("@vueuse/core")["refThrottled"]
-    >;
+      typeof import('@vueuse/core')['refThrottled']
+    >
     readonly refWithControl: UnwrapRef<
-      typeof import("@vueuse/core")["refWithControl"]
-    >;
+      typeof import('@vueuse/core')['refWithControl']
+    >
     readonly resolveComponent: UnwrapRef<
-      typeof import("vue")["resolveComponent"]
-    >;
-    readonly resolveRef: UnwrapRef<typeof import("@vueuse/core")["resolveRef"]>;
+      typeof import('vue')['resolveComponent']
+    >
+    readonly resolveRef: UnwrapRef<typeof import('@vueuse/core')['resolveRef']>
     readonly resolveUnref: UnwrapRef<
-      typeof import("@vueuse/core")["resolveUnref"]
-    >;
-    readonly shallowReactive: UnwrapRef<
-      typeof import("vue")["shallowReactive"]
-    >;
-    readonly shallowReadonly: UnwrapRef<
-      typeof import("vue")["shallowReadonly"]
-    >;
-    readonly shallowRef: UnwrapRef<typeof import("vue")["shallowRef"]>;
-    readonly syncRef: UnwrapRef<typeof import("@vueuse/core")["syncRef"]>;
-    readonly syncRefs: UnwrapRef<typeof import("@vueuse/core")["syncRefs"]>;
+      typeof import('@vueuse/core')['resolveUnref']
+    >
+    readonly shallowReactive: UnwrapRef<typeof import('vue')['shallowReactive']>
+    readonly shallowReadonly: UnwrapRef<typeof import('vue')['shallowReadonly']>
+    readonly shallowRef: UnwrapRef<typeof import('vue')['shallowRef']>
+    readonly syncRef: UnwrapRef<typeof import('@vueuse/core')['syncRef']>
+    readonly syncRefs: UnwrapRef<typeof import('@vueuse/core')['syncRefs']>
     readonly templateRef: UnwrapRef<
-      typeof import("@vueuse/core")["templateRef"]
-    >;
+      typeof import('@vueuse/core')['templateRef']
+    >
     readonly throttledRef: UnwrapRef<
-      typeof import("@vueuse/core")["throttledRef"]
-    >;
+      typeof import('@vueuse/core')['throttledRef']
+    >
     readonly throttledWatch: UnwrapRef<
-      typeof import("@vueuse/core")["throttledWatch"]
-    >;
-    readonly toRaw: UnwrapRef<typeof import("vue")["toRaw"]>;
-    readonly toReactive: UnwrapRef<typeof import("@vueuse/core")["toReactive"]>;
-    readonly toRef: UnwrapRef<typeof import("vue")["toRef"]>;
-    readonly toRefs: UnwrapRef<typeof import("vue")["toRefs"]>;
-    readonly toValue: UnwrapRef<typeof import("vue")["toValue"]>;
-    readonly triggerRef: UnwrapRef<typeof import("vue")["triggerRef"]>;
+      typeof import('@vueuse/core')['throttledWatch']
+    >
+    readonly toRaw: UnwrapRef<typeof import('vue')['toRaw']>
+    readonly toReactive: UnwrapRef<typeof import('@vueuse/core')['toReactive']>
+    readonly toRef: UnwrapRef<typeof import('vue')['toRef']>
+    readonly toRefs: UnwrapRef<typeof import('vue')['toRefs']>
+    readonly toValue: UnwrapRef<typeof import('vue')['toValue']>
+    readonly triggerRef: UnwrapRef<typeof import('vue')['triggerRef']>
     readonly tryOnBeforeMount: UnwrapRef<
-      typeof import("@vueuse/core")["tryOnBeforeMount"]
-    >;
+      typeof import('@vueuse/core')['tryOnBeforeMount']
+    >
     readonly tryOnBeforeUnmount: UnwrapRef<
-      typeof import("@vueuse/core")["tryOnBeforeUnmount"]
-    >;
+      typeof import('@vueuse/core')['tryOnBeforeUnmount']
+    >
     readonly tryOnMounted: UnwrapRef<
-      typeof import("@vueuse/core")["tryOnMounted"]
-    >;
+      typeof import('@vueuse/core')['tryOnMounted']
+    >
     readonly tryOnScopeDispose: UnwrapRef<
-      typeof import("@vueuse/core")["tryOnScopeDispose"]
-    >;
+      typeof import('@vueuse/core')['tryOnScopeDispose']
+    >
     readonly tryOnUnmounted: UnwrapRef<
-      typeof import("@vueuse/core")["tryOnUnmounted"]
-    >;
-    readonly unref: UnwrapRef<typeof import("vue")["unref"]>;
+      typeof import('@vueuse/core')['tryOnUnmounted']
+    >
+    readonly unref: UnwrapRef<typeof import('vue')['unref']>
     readonly unrefElement: UnwrapRef<
-      typeof import("@vueuse/core")["unrefElement"]
-    >;
-    readonly until: UnwrapRef<typeof import("@vueuse/core")["until"]>;
+      typeof import('@vueuse/core')['unrefElement']
+    >
+    readonly until: UnwrapRef<typeof import('@vueuse/core')['until']>
     readonly useActiveElement: UnwrapRef<
-      typeof import("@vueuse/core")["useActiveElement"]
-    >;
-    readonly useAnimate: UnwrapRef<typeof import("@vueuse/core")["useAnimate"]>;
+      typeof import('@vueuse/core')['useActiveElement']
+    >
+    readonly useAnimate: UnwrapRef<typeof import('@vueuse/core')['useAnimate']>
     readonly useArrayDifference: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayDifference"]
-    >;
+      typeof import('@vueuse/core')['useArrayDifference']
+    >
     readonly useArrayEvery: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayEvery"]
-    >;
+      typeof import('@vueuse/core')['useArrayEvery']
+    >
     readonly useArrayFilter: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayFilter"]
-    >;
+      typeof import('@vueuse/core')['useArrayFilter']
+    >
     readonly useArrayFind: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayFind"]
-    >;
+      typeof import('@vueuse/core')['useArrayFind']
+    >
     readonly useArrayFindIndex: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayFindIndex"]
-    >;
+      typeof import('@vueuse/core')['useArrayFindIndex']
+    >
     readonly useArrayFindLast: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayFindLast"]
-    >;
+      typeof import('@vueuse/core')['useArrayFindLast']
+    >
     readonly useArrayIncludes: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayIncludes"]
-    >;
+      typeof import('@vueuse/core')['useArrayIncludes']
+    >
     readonly useArrayJoin: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayJoin"]
-    >;
+      typeof import('@vueuse/core')['useArrayJoin']
+    >
     readonly useArrayMap: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayMap"]
-    >;
+      typeof import('@vueuse/core')['useArrayMap']
+    >
     readonly useArrayReduce: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayReduce"]
-    >;
+      typeof import('@vueuse/core')['useArrayReduce']
+    >
     readonly useArraySome: UnwrapRef<
-      typeof import("@vueuse/core")["useArraySome"]
-    >;
+      typeof import('@vueuse/core')['useArraySome']
+    >
     readonly useArrayUnique: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayUnique"]
-    >;
+      typeof import('@vueuse/core')['useArrayUnique']
+    >
     readonly useAsyncQueue: UnwrapRef<
-      typeof import("@vueuse/core")["useAsyncQueue"]
-    >;
+      typeof import('@vueuse/core')['useAsyncQueue']
+    >
     readonly useAsyncState: UnwrapRef<
-      typeof import("@vueuse/core")["useAsyncState"]
-    >;
-    readonly useAttrs: UnwrapRef<typeof import("vue")["useAttrs"]>;
-    readonly useBase64: UnwrapRef<typeof import("@vueuse/core")["useBase64"]>;
-    readonly useBattery: UnwrapRef<typeof import("@vueuse/core")["useBattery"]>;
+      typeof import('@vueuse/core')['useAsyncState']
+    >
+    readonly useAttrs: UnwrapRef<typeof import('vue')['useAttrs']>
+    readonly useBase64: UnwrapRef<typeof import('@vueuse/core')['useBase64']>
+    readonly useBattery: UnwrapRef<typeof import('@vueuse/core')['useBattery']>
     readonly useBluetooth: UnwrapRef<
-      typeof import("@vueuse/core")["useBluetooth"]
-    >;
+      typeof import('@vueuse/core')['useBluetooth']
+    >
     readonly useBreakpoints: UnwrapRef<
-      typeof import("@vueuse/core")["useBreakpoints"]
-    >;
+      typeof import('@vueuse/core')['useBreakpoints']
+    >
     readonly useBroadcastChannel: UnwrapRef<
-      typeof import("@vueuse/core")["useBroadcastChannel"]
-    >;
+      typeof import('@vueuse/core')['useBroadcastChannel']
+    >
     readonly useBrowserLocation: UnwrapRef<
-      typeof import("@vueuse/core")["useBrowserLocation"]
-    >;
-    readonly useCached: UnwrapRef<typeof import("@vueuse/core")["useCached"]>;
+      typeof import('@vueuse/core')['useBrowserLocation']
+    >
+    readonly useCached: UnwrapRef<typeof import('@vueuse/core')['useCached']>
     readonly useClipboard: UnwrapRef<
-      typeof import("@vueuse/core")["useClipboard"]
-    >;
-    readonly useCloned: UnwrapRef<typeof import("@vueuse/core")["useCloned"]>;
+      typeof import('@vueuse/core')['useClipboard']
+    >
+    readonly useCloned: UnwrapRef<typeof import('@vueuse/core')['useCloned']>
     readonly useColorMode: UnwrapRef<
-      typeof import("@vueuse/core")["useColorMode"]
-    >;
+      typeof import('@vueuse/core')['useColorMode']
+    >
     readonly useConfirmDialog: UnwrapRef<
-      typeof import("@vueuse/core")["useConfirmDialog"]
-    >;
-    readonly useCounter: UnwrapRef<typeof import("@vueuse/core")["useCounter"]>;
-    readonly useCssModule: UnwrapRef<typeof import("vue")["useCssModule"]>;
-    readonly useCssVar: UnwrapRef<typeof import("@vueuse/core")["useCssVar"]>;
-    readonly useCssVars: UnwrapRef<typeof import("vue")["useCssVars"]>;
+      typeof import('@vueuse/core')['useConfirmDialog']
+    >
+    readonly useCounter: UnwrapRef<typeof import('@vueuse/core')['useCounter']>
+    readonly useCssModule: UnwrapRef<typeof import('vue')['useCssModule']>
+    readonly useCssVar: UnwrapRef<typeof import('@vueuse/core')['useCssVar']>
+    readonly useCssVars: UnwrapRef<typeof import('vue')['useCssVars']>
     readonly useCurrentElement: UnwrapRef<
-      typeof import("@vueuse/core")["useCurrentElement"]
-    >;
+      typeof import('@vueuse/core')['useCurrentElement']
+    >
     readonly useCycleList: UnwrapRef<
-      typeof import("@vueuse/core")["useCycleList"]
-    >;
-    readonly useDark: UnwrapRef<typeof import("@vueuse/core")["useDark"]>;
+      typeof import('@vueuse/core')['useCycleList']
+    >
+    readonly useDark: UnwrapRef<typeof import('@vueuse/core')['useDark']>
     readonly useDateFormat: UnwrapRef<
-      typeof import("@vueuse/core")["useDateFormat"]
-    >;
+      typeof import('@vueuse/core')['useDateFormat']
+    >
     readonly useDebounce: UnwrapRef<
-      typeof import("@vueuse/core")["useDebounce"]
-    >;
+      typeof import('@vueuse/core')['useDebounce']
+    >
     readonly useDebounceFn: UnwrapRef<
-      typeof import("@vueuse/core")["useDebounceFn"]
-    >;
+      typeof import('@vueuse/core')['useDebounceFn']
+    >
     readonly useDebouncedRefHistory: UnwrapRef<
-      typeof import("@vueuse/core")["useDebouncedRefHistory"]
-    >;
+      typeof import('@vueuse/core')['useDebouncedRefHistory']
+    >
     readonly useDeviceMotion: UnwrapRef<
-      typeof import("@vueuse/core")["useDeviceMotion"]
-    >;
+      typeof import('@vueuse/core')['useDeviceMotion']
+    >
     readonly useDeviceOrientation: UnwrapRef<
-      typeof import("@vueuse/core")["useDeviceOrientation"]
-    >;
+      typeof import('@vueuse/core')['useDeviceOrientation']
+    >
     readonly useDevicePixelRatio: UnwrapRef<
-      typeof import("@vueuse/core")["useDevicePixelRatio"]
-    >;
+      typeof import('@vueuse/core')['useDevicePixelRatio']
+    >
     readonly useDevicesList: UnwrapRef<
-      typeof import("@vueuse/core")["useDevicesList"]
-    >;
+      typeof import('@vueuse/core')['useDevicesList']
+    >
     readonly useDisplayMedia: UnwrapRef<
-      typeof import("@vueuse/core")["useDisplayMedia"]
-    >;
+      typeof import('@vueuse/core')['useDisplayMedia']
+    >
     readonly useDocumentVisibility: UnwrapRef<
-      typeof import("@vueuse/core")["useDocumentVisibility"]
-    >;
+      typeof import('@vueuse/core')['useDocumentVisibility']
+    >
     readonly useDraggable: UnwrapRef<
-      typeof import("@vueuse/core")["useDraggable"]
-    >;
+      typeof import('@vueuse/core')['useDraggable']
+    >
     readonly useDropZone: UnwrapRef<
-      typeof import("@vueuse/core")["useDropZone"]
-    >;
+      typeof import('@vueuse/core')['useDropZone']
+    >
     readonly useElementBounding: UnwrapRef<
-      typeof import("@vueuse/core")["useElementBounding"]
-    >;
+      typeof import('@vueuse/core')['useElementBounding']
+    >
     readonly useElementByPoint: UnwrapRef<
-      typeof import("@vueuse/core")["useElementByPoint"]
-    >;
+      typeof import('@vueuse/core')['useElementByPoint']
+    >
     readonly useElementHover: UnwrapRef<
-      typeof import("@vueuse/core")["useElementHover"]
-    >;
+      typeof import('@vueuse/core')['useElementHover']
+    >
     readonly useElementSize: UnwrapRef<
-      typeof import("@vueuse/core")["useElementSize"]
-    >;
+      typeof import('@vueuse/core')['useElementSize']
+    >
     readonly useElementVisibility: UnwrapRef<
-      typeof import("@vueuse/core")["useElementVisibility"]
-    >;
+      typeof import('@vueuse/core')['useElementVisibility']
+    >
     readonly useEventBus: UnwrapRef<
-      typeof import("@vueuse/core")["useEventBus"]
-    >;
+      typeof import('@vueuse/core')['useEventBus']
+    >
     readonly useEventListener: UnwrapRef<
-      typeof import("@vueuse/core")["useEventListener"]
-    >;
+      typeof import('@vueuse/core')['useEventListener']
+    >
     readonly useEventSource: UnwrapRef<
-      typeof import("@vueuse/core")["useEventSource"]
-    >;
+      typeof import('@vueuse/core')['useEventSource']
+    >
     readonly useEyeDropper: UnwrapRef<
-      typeof import("@vueuse/core")["useEyeDropper"]
-    >;
-    readonly useFavicon: UnwrapRef<typeof import("@vueuse/core")["useFavicon"]>;
-    readonly useFetch: UnwrapRef<typeof import("@vueuse/core")["useFetch"]>;
+      typeof import('@vueuse/core')['useEyeDropper']
+    >
+    readonly useFavicon: UnwrapRef<typeof import('@vueuse/core')['useFavicon']>
+    readonly useFetch: UnwrapRef<typeof import('@vueuse/core')['useFetch']>
     readonly useFileDialog: UnwrapRef<
-      typeof import("@vueuse/core")["useFileDialog"]
-    >;
+      typeof import('@vueuse/core')['useFileDialog']
+    >
     readonly useFileSystemAccess: UnwrapRef<
-      typeof import("@vueuse/core")["useFileSystemAccess"]
-    >;
-    readonly useFocus: UnwrapRef<typeof import("@vueuse/core")["useFocus"]>;
+      typeof import('@vueuse/core')['useFileSystemAccess']
+    >
+    readonly useFocus: UnwrapRef<typeof import('@vueuse/core')['useFocus']>
     readonly useFocusWithin: UnwrapRef<
-      typeof import("@vueuse/core")["useFocusWithin"]
-    >;
-    readonly useFps: UnwrapRef<typeof import("@vueuse/core")["useFps"]>;
+      typeof import('@vueuse/core')['useFocusWithin']
+    >
+    readonly useFps: UnwrapRef<typeof import('@vueuse/core')['useFps']>
     readonly useFullscreen: UnwrapRef<
-      typeof import("@vueuse/core")["useFullscreen"]
-    >;
-    readonly useGamepad: UnwrapRef<typeof import("@vueuse/core")["useGamepad"]>;
+      typeof import('@vueuse/core')['useFullscreen']
+    >
+    readonly useGamepad: UnwrapRef<typeof import('@vueuse/core')['useGamepad']>
     readonly useGeolocation: UnwrapRef<
-      typeof import("@vueuse/core")["useGeolocation"]
-    >;
-    readonly useIdle: UnwrapRef<typeof import("@vueuse/core")["useIdle"]>;
-    readonly useImage: UnwrapRef<typeof import("@vueuse/core")["useImage"]>;
+      typeof import('@vueuse/core')['useGeolocation']
+    >
+    readonly useIdle: UnwrapRef<typeof import('@vueuse/core')['useIdle']>
+    readonly useImage: UnwrapRef<typeof import('@vueuse/core')['useImage']>
     readonly useInfiniteScroll: UnwrapRef<
-      typeof import("@vueuse/core")["useInfiniteScroll"]
-    >;
+      typeof import('@vueuse/core')['useInfiniteScroll']
+    >
     readonly useIntersectionObserver: UnwrapRef<
-      typeof import("@vueuse/core")["useIntersectionObserver"]
-    >;
+      typeof import('@vueuse/core')['useIntersectionObserver']
+    >
     readonly useInterval: UnwrapRef<
-      typeof import("@vueuse/core")["useInterval"]
-    >;
+      typeof import('@vueuse/core')['useInterval']
+    >
     readonly useIntervalFn: UnwrapRef<
-      typeof import("@vueuse/core")["useIntervalFn"]
-    >;
+      typeof import('@vueuse/core')['useIntervalFn']
+    >
     readonly useKeyModifier: UnwrapRef<
-      typeof import("@vueuse/core")["useKeyModifier"]
-    >;
+      typeof import('@vueuse/core')['useKeyModifier']
+    >
     readonly useLastChanged: UnwrapRef<
-      typeof import("@vueuse/core")["useLastChanged"]
-    >;
+      typeof import('@vueuse/core')['useLastChanged']
+    >
     readonly useLocalStorage: UnwrapRef<
-      typeof import("@vueuse/core")["useLocalStorage"]
-    >;
+      typeof import('@vueuse/core')['useLocalStorage']
+    >
     readonly useMagicKeys: UnwrapRef<
-      typeof import("@vueuse/core")["useMagicKeys"]
-    >;
+      typeof import('@vueuse/core')['useMagicKeys']
+    >
     readonly useManualRefHistory: UnwrapRef<
-      typeof import("@vueuse/core")["useManualRefHistory"]
-    >;
+      typeof import('@vueuse/core')['useManualRefHistory']
+    >
     readonly useMediaControls: UnwrapRef<
-      typeof import("@vueuse/core")["useMediaControls"]
-    >;
+      typeof import('@vueuse/core')['useMediaControls']
+    >
     readonly useMediaQuery: UnwrapRef<
-      typeof import("@vueuse/core")["useMediaQuery"]
-    >;
-    readonly useMemoize: UnwrapRef<typeof import("@vueuse/core")["useMemoize"]>;
-    readonly useMemory: UnwrapRef<typeof import("@vueuse/core")["useMemory"]>;
-    readonly useMounted: UnwrapRef<typeof import("@vueuse/core")["useMounted"]>;
-    readonly useMouse: UnwrapRef<typeof import("@vueuse/core")["useMouse"]>;
+      typeof import('@vueuse/core')['useMediaQuery']
+    >
+    readonly useMemoize: UnwrapRef<typeof import('@vueuse/core')['useMemoize']>
+    readonly useMemory: UnwrapRef<typeof import('@vueuse/core')['useMemory']>
+    readonly useMounted: UnwrapRef<typeof import('@vueuse/core')['useMounted']>
+    readonly useMouse: UnwrapRef<typeof import('@vueuse/core')['useMouse']>
     readonly useMouseInElement: UnwrapRef<
-      typeof import("@vueuse/core")["useMouseInElement"]
-    >;
+      typeof import('@vueuse/core')['useMouseInElement']
+    >
     readonly useMousePressed: UnwrapRef<
-      typeof import("@vueuse/core")["useMousePressed"]
-    >;
+      typeof import('@vueuse/core')['useMousePressed']
+    >
     readonly useMutationObserver: UnwrapRef<
-      typeof import("@vueuse/core")["useMutationObserver"]
-    >;
+      typeof import('@vueuse/core')['useMutationObserver']
+    >
     readonly useNavigatorLanguage: UnwrapRef<
-      typeof import("@vueuse/core")["useNavigatorLanguage"]
-    >;
-    readonly useNetwork: UnwrapRef<typeof import("@vueuse/core")["useNetwork"]>;
-    readonly useNow: UnwrapRef<typeof import("@vueuse/core")["useNow"]>;
+      typeof import('@vueuse/core')['useNavigatorLanguage']
+    >
+    readonly useNetwork: UnwrapRef<typeof import('@vueuse/core')['useNetwork']>
+    readonly useNow: UnwrapRef<typeof import('@vueuse/core')['useNow']>
     readonly useObjectUrl: UnwrapRef<
-      typeof import("@vueuse/core")["useObjectUrl"]
-    >;
+      typeof import('@vueuse/core')['useObjectUrl']
+    >
     readonly useOffsetPagination: UnwrapRef<
-      typeof import("@vueuse/core")["useOffsetPagination"]
-    >;
-    readonly useOnline: UnwrapRef<typeof import("@vueuse/core")["useOnline"]>;
+      typeof import('@vueuse/core')['useOffsetPagination']
+    >
+    readonly useOnline: UnwrapRef<typeof import('@vueuse/core')['useOnline']>
     readonly usePageLeave: UnwrapRef<
-      typeof import("@vueuse/core")["usePageLeave"]
-    >;
+      typeof import('@vueuse/core')['usePageLeave']
+    >
     readonly useParallax: UnwrapRef<
-      typeof import("@vueuse/core")["useParallax"]
-    >;
+      typeof import('@vueuse/core')['useParallax']
+    >
     readonly useParentElement: UnwrapRef<
-      typeof import("@vueuse/core")["useParentElement"]
-    >;
+      typeof import('@vueuse/core')['useParentElement']
+    >
     readonly usePerformanceObserver: UnwrapRef<
-      typeof import("@vueuse/core")["usePerformanceObserver"]
-    >;
+      typeof import('@vueuse/core')['usePerformanceObserver']
+    >
     readonly usePermission: UnwrapRef<
-      typeof import("@vueuse/core")["usePermission"]
-    >;
-    readonly usePointer: UnwrapRef<typeof import("@vueuse/core")["usePointer"]>;
+      typeof import('@vueuse/core')['usePermission']
+    >
+    readonly usePointer: UnwrapRef<typeof import('@vueuse/core')['usePointer']>
     readonly usePointerLock: UnwrapRef<
-      typeof import("@vueuse/core")["usePointerLock"]
-    >;
+      typeof import('@vueuse/core')['usePointerLock']
+    >
     readonly usePointerSwipe: UnwrapRef<
-      typeof import("@vueuse/core")["usePointerSwipe"]
-    >;
+      typeof import('@vueuse/core')['usePointerSwipe']
+    >
     readonly usePreferredColorScheme: UnwrapRef<
-      typeof import("@vueuse/core")["usePreferredColorScheme"]
-    >;
+      typeof import('@vueuse/core')['usePreferredColorScheme']
+    >
     readonly usePreferredContrast: UnwrapRef<
-      typeof import("@vueuse/core")["usePreferredContrast"]
-    >;
+      typeof import('@vueuse/core')['usePreferredContrast']
+    >
     readonly usePreferredDark: UnwrapRef<
-      typeof import("@vueuse/core")["usePreferredDark"]
-    >;
+      typeof import('@vueuse/core')['usePreferredDark']
+    >
     readonly usePreferredLanguages: UnwrapRef<
-      typeof import("@vueuse/core")["usePreferredLanguages"]
-    >;
+      typeof import('@vueuse/core')['usePreferredLanguages']
+    >
     readonly usePreferredReducedMotion: UnwrapRef<
-      typeof import("@vueuse/core")["usePreferredReducedMotion"]
-    >;
+      typeof import('@vueuse/core')['usePreferredReducedMotion']
+    >
     readonly usePrevious: UnwrapRef<
-      typeof import("@vueuse/core")["usePrevious"]
-    >;
-    readonly useRafFn: UnwrapRef<typeof import("@vueuse/core")["useRafFn"]>;
+      typeof import('@vueuse/core')['usePrevious']
+    >
+    readonly useRafFn: UnwrapRef<typeof import('@vueuse/core')['useRafFn']>
     readonly useRefHistory: UnwrapRef<
-      typeof import("@vueuse/core")["useRefHistory"]
-    >;
+      typeof import('@vueuse/core')['useRefHistory']
+    >
     readonly useResizeObserver: UnwrapRef<
-      typeof import("@vueuse/core")["useResizeObserver"]
-    >;
+      typeof import('@vueuse/core')['useResizeObserver']
+    >
     readonly useScreenOrientation: UnwrapRef<
-      typeof import("@vueuse/core")["useScreenOrientation"]
-    >;
+      typeof import('@vueuse/core')['useScreenOrientation']
+    >
     readonly useScreenSafeArea: UnwrapRef<
-      typeof import("@vueuse/core")["useScreenSafeArea"]
-    >;
+      typeof import('@vueuse/core')['useScreenSafeArea']
+    >
     readonly useScriptTag: UnwrapRef<
-      typeof import("@vueuse/core")["useScriptTag"]
-    >;
-    readonly useScroll: UnwrapRef<typeof import("@vueuse/core")["useScroll"]>;
+      typeof import('@vueuse/core')['useScriptTag']
+    >
+    readonly useScroll: UnwrapRef<typeof import('@vueuse/core')['useScroll']>
     readonly useScrollLock: UnwrapRef<
-      typeof import("@vueuse/core")["useScrollLock"]
-    >;
+      typeof import('@vueuse/core')['useScrollLock']
+    >
     readonly useSessionStorage: UnwrapRef<
-      typeof import("@vueuse/core")["useSessionStorage"]
-    >;
-    readonly useShare: UnwrapRef<typeof import("@vueuse/core")["useShare"]>;
-    readonly useSlots: UnwrapRef<typeof import("vue")["useSlots"]>;
-    readonly useSorted: UnwrapRef<typeof import("@vueuse/core")["useSorted"]>;
+      typeof import('@vueuse/core')['useSessionStorage']
+    >
+    readonly useShare: UnwrapRef<typeof import('@vueuse/core')['useShare']>
+    readonly useSlots: UnwrapRef<typeof import('vue')['useSlots']>
+    readonly useSorted: UnwrapRef<typeof import('@vueuse/core')['useSorted']>
     readonly useSpeechRecognition: UnwrapRef<
-      typeof import("@vueuse/core")["useSpeechRecognition"]
-    >;
+      typeof import('@vueuse/core')['useSpeechRecognition']
+    >
     readonly useSpeechSynthesis: UnwrapRef<
-      typeof import("@vueuse/core")["useSpeechSynthesis"]
-    >;
-    readonly useStepper: UnwrapRef<typeof import("@vueuse/core")["useStepper"]>;
-    readonly useStorage: UnwrapRef<typeof import("@vueuse/core")["useStorage"]>;
+      typeof import('@vueuse/core')['useSpeechSynthesis']
+    >
+    readonly useStepper: UnwrapRef<typeof import('@vueuse/core')['useStepper']>
+    readonly useStorage: UnwrapRef<typeof import('@vueuse/core')['useStorage']>
     readonly useStorageAsync: UnwrapRef<
-      typeof import("@vueuse/core")["useStorageAsync"]
-    >;
+      typeof import('@vueuse/core')['useStorageAsync']
+    >
     readonly useStyleTag: UnwrapRef<
-      typeof import("@vueuse/core")["useStyleTag"]
-    >;
+      typeof import('@vueuse/core')['useStyleTag']
+    >
     readonly useSupported: UnwrapRef<
-      typeof import("@vueuse/core")["useSupported"]
-    >;
-    readonly useSwipe: UnwrapRef<typeof import("@vueuse/core")["useSwipe"]>;
+      typeof import('@vueuse/core')['useSupported']
+    >
+    readonly useSwipe: UnwrapRef<typeof import('@vueuse/core')['useSwipe']>
     readonly useTemplateRefsList: UnwrapRef<
-      typeof import("@vueuse/core")["useTemplateRefsList"]
-    >;
+      typeof import('@vueuse/core')['useTemplateRefsList']
+    >
     readonly useTextDirection: UnwrapRef<
-      typeof import("@vueuse/core")["useTextDirection"]
-    >;
+      typeof import('@vueuse/core')['useTextDirection']
+    >
     readonly useTextSelection: UnwrapRef<
-      typeof import("@vueuse/core")["useTextSelection"]
-    >;
+      typeof import('@vueuse/core')['useTextSelection']
+    >
     readonly useTextareaAutosize: UnwrapRef<
-      typeof import("@vueuse/core")["useTextareaAutosize"]
-    >;
+      typeof import('@vueuse/core')['useTextareaAutosize']
+    >
     readonly useThrottle: UnwrapRef<
-      typeof import("@vueuse/core")["useThrottle"]
-    >;
+      typeof import('@vueuse/core')['useThrottle']
+    >
     readonly useThrottleFn: UnwrapRef<
-      typeof import("@vueuse/core")["useThrottleFn"]
-    >;
+      typeof import('@vueuse/core')['useThrottleFn']
+    >
     readonly useThrottledRefHistory: UnwrapRef<
-      typeof import("@vueuse/core")["useThrottledRefHistory"]
-    >;
-    readonly useTimeAgo: UnwrapRef<typeof import("@vueuse/core")["useTimeAgo"]>;
-    readonly useTimeout: UnwrapRef<typeof import("@vueuse/core")["useTimeout"]>;
+      typeof import('@vueuse/core')['useThrottledRefHistory']
+    >
+    readonly useTimeAgo: UnwrapRef<typeof import('@vueuse/core')['useTimeAgo']>
+    readonly useTimeout: UnwrapRef<typeof import('@vueuse/core')['useTimeout']>
     readonly useTimeoutFn: UnwrapRef<
-      typeof import("@vueuse/core")["useTimeoutFn"]
-    >;
+      typeof import('@vueuse/core')['useTimeoutFn']
+    >
     readonly useTimeoutPoll: UnwrapRef<
-      typeof import("@vueuse/core")["useTimeoutPoll"]
-    >;
+      typeof import('@vueuse/core')['useTimeoutPoll']
+    >
     readonly useTimestamp: UnwrapRef<
-      typeof import("@vueuse/core")["useTimestamp"]
-    >;
-    readonly useTitle: UnwrapRef<typeof import("@vueuse/core")["useTitle"]>;
+      typeof import('@vueuse/core')['useTimestamp']
+    >
+    readonly useTitle: UnwrapRef<typeof import('@vueuse/core')['useTitle']>
     readonly useToNumber: UnwrapRef<
-      typeof import("@vueuse/core")["useToNumber"]
-    >;
+      typeof import('@vueuse/core')['useToNumber']
+    >
     readonly useToString: UnwrapRef<
-      typeof import("@vueuse/core")["useToString"]
-    >;
-    readonly useToggle: UnwrapRef<typeof import("@vueuse/core")["useToggle"]>;
+      typeof import('@vueuse/core')['useToString']
+    >
+    readonly useToggle: UnwrapRef<typeof import('@vueuse/core')['useToggle']>
     readonly useTransition: UnwrapRef<
-      typeof import("@vueuse/core")["useTransition"]
-    >;
+      typeof import('@vueuse/core')['useTransition']
+    >
     readonly useUrlSearchParams: UnwrapRef<
-      typeof import("@vueuse/core")["useUrlSearchParams"]
-    >;
+      typeof import('@vueuse/core')['useUrlSearchParams']
+    >
     readonly useUserMedia: UnwrapRef<
-      typeof import("@vueuse/core")["useUserMedia"]
-    >;
-    readonly useVModel: UnwrapRef<typeof import("@vueuse/core")["useVModel"]>;
-    readonly useVModels: UnwrapRef<typeof import("@vueuse/core")["useVModels"]>;
-    readonly useVibrate: UnwrapRef<typeof import("@vueuse/core")["useVibrate"]>;
+      typeof import('@vueuse/core')['useUserMedia']
+    >
+    readonly useVModel: UnwrapRef<typeof import('@vueuse/core')['useVModel']>
+    readonly useVModels: UnwrapRef<typeof import('@vueuse/core')['useVModels']>
+    readonly useVibrate: UnwrapRef<typeof import('@vueuse/core')['useVibrate']>
     readonly useVirtualList: UnwrapRef<
-      typeof import("@vueuse/core")["useVirtualList"]
-    >;
+      typeof import('@vueuse/core')['useVirtualList']
+    >
     readonly useWakeLock: UnwrapRef<
-      typeof import("@vueuse/core")["useWakeLock"]
-    >;
+      typeof import('@vueuse/core')['useWakeLock']
+    >
     readonly useWebNotification: UnwrapRef<
-      typeof import("@vueuse/core")["useWebNotification"]
-    >;
+      typeof import('@vueuse/core')['useWebNotification']
+    >
     readonly useWebSocket: UnwrapRef<
-      typeof import("@vueuse/core")["useWebSocket"]
-    >;
+      typeof import('@vueuse/core')['useWebSocket']
+    >
     readonly useWebWorker: UnwrapRef<
-      typeof import("@vueuse/core")["useWebWorker"]
-    >;
+      typeof import('@vueuse/core')['useWebWorker']
+    >
     readonly useWebWorkerFn: UnwrapRef<
-      typeof import("@vueuse/core")["useWebWorkerFn"]
-    >;
+      typeof import('@vueuse/core')['useWebWorkerFn']
+    >
     readonly useWindowFocus: UnwrapRef<
-      typeof import("@vueuse/core")["useWindowFocus"]
-    >;
+      typeof import('@vueuse/core')['useWindowFocus']
+    >
     readonly useWindowScroll: UnwrapRef<
-      typeof import("@vueuse/core")["useWindowScroll"]
-    >;
+      typeof import('@vueuse/core')['useWindowScroll']
+    >
     readonly useWindowSize: UnwrapRef<
-      typeof import("@vueuse/core")["useWindowSize"]
-    >;
-    readonly watch: UnwrapRef<typeof import("vue")["watch"]>;
-    readonly watchArray: UnwrapRef<typeof import("@vueuse/core")["watchArray"]>;
+      typeof import('@vueuse/core')['useWindowSize']
+    >
+    readonly watch: UnwrapRef<typeof import('vue')['watch']>
+    readonly watchArray: UnwrapRef<typeof import('@vueuse/core')['watchArray']>
     readonly watchAtMost: UnwrapRef<
-      typeof import("@vueuse/core")["watchAtMost"]
-    >;
+      typeof import('@vueuse/core')['watchAtMost']
+    >
     readonly watchDebounced: UnwrapRef<
-      typeof import("@vueuse/core")["watchDebounced"]
-    >;
-    readonly watchDeep: UnwrapRef<typeof import("@vueuse/core")["watchDeep"]>;
-    readonly watchEffect: UnwrapRef<typeof import("vue")["watchEffect"]>;
+      typeof import('@vueuse/core')['watchDebounced']
+    >
+    readonly watchDeep: UnwrapRef<typeof import('@vueuse/core')['watchDeep']>
+    readonly watchEffect: UnwrapRef<typeof import('vue')['watchEffect']>
     readonly watchIgnorable: UnwrapRef<
-      typeof import("@vueuse/core")["watchIgnorable"]
-    >;
+      typeof import('@vueuse/core')['watchIgnorable']
+    >
     readonly watchImmediate: UnwrapRef<
-      typeof import("@vueuse/core")["watchImmediate"]
-    >;
-    readonly watchOnce: UnwrapRef<typeof import("@vueuse/core")["watchOnce"]>;
+      typeof import('@vueuse/core')['watchImmediate']
+    >
+    readonly watchOnce: UnwrapRef<typeof import('@vueuse/core')['watchOnce']>
     readonly watchPausable: UnwrapRef<
-      typeof import("@vueuse/core")["watchPausable"]
-    >;
-    readonly watchPostEffect: UnwrapRef<
-      typeof import("vue")["watchPostEffect"]
-    >;
-    readonly watchSyncEffect: UnwrapRef<
-      typeof import("vue")["watchSyncEffect"]
-    >;
+      typeof import('@vueuse/core')['watchPausable']
+    >
+    readonly watchPostEffect: UnwrapRef<typeof import('vue')['watchPostEffect']>
+    readonly watchSyncEffect: UnwrapRef<typeof import('vue')['watchSyncEffect']>
     readonly watchThrottled: UnwrapRef<
-      typeof import("@vueuse/core")["watchThrottled"]
-    >;
+      typeof import('@vueuse/core')['watchThrottled']
+    >
     readonly watchTriggerable: UnwrapRef<
-      typeof import("@vueuse/core")["watchTriggerable"]
-    >;
+      typeof import('@vueuse/core')['watchTriggerable']
+    >
     readonly watchWithFilter: UnwrapRef<
-      typeof import("@vueuse/core")["watchWithFilter"]
-    >;
-    readonly whenever: UnwrapRef<typeof import("@vueuse/core")["whenever"]>;
+      typeof import('@vueuse/core')['watchWithFilter']
+    >
+    readonly whenever: UnwrapRef<typeof import('@vueuse/core')['whenever']>
   }
 }
-declare module "@vue/runtime-core" {
+declare module '@vue/runtime-core' {
   interface ComponentCustomProperties {
-    readonly EffectScope: UnwrapRef<typeof import("vue")["EffectScope"]>;
-    readonly ElForm: UnwrapRef<typeof import("element-plus/es")["ElForm"]>;
-    readonly ElMessage: UnwrapRef<
-      typeof import("element-plus/es")["ElMessage"]
-    >;
+    readonly EffectScope: UnwrapRef<typeof import('vue')['EffectScope']>
+    readonly ElForm: UnwrapRef<typeof import('element-plus/es')['ElForm']>
+    readonly ElMessage: UnwrapRef<typeof import('element-plus/es')['ElMessage']>
     readonly ElMessageBox: UnwrapRef<
-      typeof import("element-plus/es")["ElMessageBox"]
-    >;
-    readonly ElTree: UnwrapRef<typeof import("element-plus/es")["ElTree"]>;
+      typeof import('element-plus/es')['ElMessageBox']
+    >
+    readonly ElTree: UnwrapRef<typeof import('element-plus/es')['ElTree']>
     readonly asyncComputed: UnwrapRef<
-      typeof import("@vueuse/core")["asyncComputed"]
-    >;
+      typeof import('@vueuse/core')['asyncComputed']
+    >
     readonly autoResetRef: UnwrapRef<
-      typeof import("@vueuse/core")["autoResetRef"]
-    >;
-    readonly computed: UnwrapRef<typeof import("vue")["computed"]>;
+      typeof import('@vueuse/core')['autoResetRef']
+    >
+    readonly computed: UnwrapRef<typeof import('vue')['computed']>
     readonly computedAsync: UnwrapRef<
-      typeof import("@vueuse/core")["computedAsync"]
-    >;
+      typeof import('@vueuse/core')['computedAsync']
+    >
     readonly computedEager: UnwrapRef<
-      typeof import("@vueuse/core")["computedEager"]
-    >;
+      typeof import('@vueuse/core')['computedEager']
+    >
     readonly computedInject: UnwrapRef<
-      typeof import("@vueuse/core")["computedInject"]
-    >;
+      typeof import('@vueuse/core')['computedInject']
+    >
     readonly computedWithControl: UnwrapRef<
-      typeof import("@vueuse/core")["computedWithControl"]
-    >;
+      typeof import('@vueuse/core')['computedWithControl']
+    >
     readonly controlledComputed: UnwrapRef<
-      typeof import("@vueuse/core")["controlledComputed"]
-    >;
+      typeof import('@vueuse/core')['controlledComputed']
+    >
     readonly controlledRef: UnwrapRef<
-      typeof import("@vueuse/core")["controlledRef"]
-    >;
-    readonly createApp: UnwrapRef<typeof import("vue")["createApp"]>;
+      typeof import('@vueuse/core')['controlledRef']
+    >
+    readonly createApp: UnwrapRef<typeof import('vue')['createApp']>
     readonly createEventHook: UnwrapRef<
-      typeof import("@vueuse/core")["createEventHook"]
-    >;
+      typeof import('@vueuse/core')['createEventHook']
+    >
     readonly createGlobalState: UnwrapRef<
-      typeof import("@vueuse/core")["createGlobalState"]
-    >;
+      typeof import('@vueuse/core')['createGlobalState']
+    >
     readonly createInjectionState: UnwrapRef<
-      typeof import("@vueuse/core")["createInjectionState"]
-    >;
+      typeof import('@vueuse/core')['createInjectionState']
+    >
     readonly createReactiveFn: UnwrapRef<
-      typeof import("@vueuse/core")["createReactiveFn"]
-    >;
+      typeof import('@vueuse/core')['createReactiveFn']
+    >
     readonly createReusableTemplate: UnwrapRef<
-      typeof import("@vueuse/core")["createReusableTemplate"]
-    >;
+      typeof import('@vueuse/core')['createReusableTemplate']
+    >
     readonly createSharedComposable: UnwrapRef<
-      typeof import("@vueuse/core")["createSharedComposable"]
-    >;
+      typeof import('@vueuse/core')['createSharedComposable']
+    >
     readonly createTemplatePromise: UnwrapRef<
-      typeof import("@vueuse/core")["createTemplatePromise"]
-    >;
+      typeof import('@vueuse/core')['createTemplatePromise']
+    >
     readonly createUnrefFn: UnwrapRef<
-      typeof import("@vueuse/core")["createUnrefFn"]
-    >;
-    readonly customRef: UnwrapRef<typeof import("vue")["customRef"]>;
+      typeof import('@vueuse/core')['createUnrefFn']
+    >
+    readonly customRef: UnwrapRef<typeof import('vue')['customRef']>
     readonly debouncedRef: UnwrapRef<
-      typeof import("@vueuse/core")["debouncedRef"]
-    >;
+      typeof import('@vueuse/core')['debouncedRef']
+    >
     readonly debouncedWatch: UnwrapRef<
-      typeof import("@vueuse/core")["debouncedWatch"]
-    >;
+      typeof import('@vueuse/core')['debouncedWatch']
+    >
     readonly defineAsyncComponent: UnwrapRef<
-      typeof import("vue")["defineAsyncComponent"]
-    >;
-    readonly defineComponent: UnwrapRef<
-      typeof import("vue")["defineComponent"]
-    >;
+      typeof import('vue')['defineAsyncComponent']
+    >
+    readonly defineComponent: UnwrapRef<typeof import('vue')['defineComponent']>
     readonly eagerComputed: UnwrapRef<
-      typeof import("@vueuse/core")["eagerComputed"]
-    >;
-    readonly effectScope: UnwrapRef<typeof import("vue")["effectScope"]>;
-    readonly extendRef: UnwrapRef<typeof import("@vueuse/core")["extendRef"]>;
+      typeof import('@vueuse/core')['eagerComputed']
+    >
+    readonly effectScope: UnwrapRef<typeof import('vue')['effectScope']>
+    readonly extendRef: UnwrapRef<typeof import('@vueuse/core')['extendRef']>
     readonly getCurrentInstance: UnwrapRef<
-      typeof import("vue")["getCurrentInstance"]
-    >;
-    readonly getCurrentScope: UnwrapRef<
-      typeof import("vue")["getCurrentScope"]
-    >;
-    readonly h: UnwrapRef<typeof import("vue")["h"]>;
+      typeof import('vue')['getCurrentInstance']
+    >
+    readonly getCurrentScope: UnwrapRef<typeof import('vue')['getCurrentScope']>
+    readonly h: UnwrapRef<typeof import('vue')['h']>
     readonly ignorableWatch: UnwrapRef<
-      typeof import("@vueuse/core")["ignorableWatch"]
-    >;
-    readonly inject: UnwrapRef<typeof import("vue")["inject"]>;
-    readonly isDefined: UnwrapRef<typeof import("@vueuse/core")["isDefined"]>;
-    readonly isProxy: UnwrapRef<typeof import("vue")["isProxy"]>;
-    readonly isReactive: UnwrapRef<typeof import("vue")["isReactive"]>;
-    readonly isReadonly: UnwrapRef<typeof import("vue")["isReadonly"]>;
-    readonly isRef: UnwrapRef<typeof import("vue")["isRef"]>;
+      typeof import('@vueuse/core')['ignorableWatch']
+    >
+    readonly inject: UnwrapRef<typeof import('vue')['inject']>
+    readonly isDefined: UnwrapRef<typeof import('@vueuse/core')['isDefined']>
+    readonly isProxy: UnwrapRef<typeof import('vue')['isProxy']>
+    readonly isReactive: UnwrapRef<typeof import('vue')['isReactive']>
+    readonly isReadonly: UnwrapRef<typeof import('vue')['isReadonly']>
+    readonly isRef: UnwrapRef<typeof import('vue')['isRef']>
     readonly makeDestructurable: UnwrapRef<
-      typeof import("@vueuse/core")["makeDestructurable"]
-    >;
-    readonly markRaw: UnwrapRef<typeof import("vue")["markRaw"]>;
-    readonly nextTick: UnwrapRef<typeof import("vue")["nextTick"]>;
-    readonly onActivated: UnwrapRef<typeof import("vue")["onActivated"]>;
-    readonly onBeforeMount: UnwrapRef<typeof import("vue")["onBeforeMount"]>;
-    readonly onBeforeUnmount: UnwrapRef<
-      typeof import("vue")["onBeforeUnmount"]
-    >;
-    readonly onBeforeUpdate: UnwrapRef<typeof import("vue")["onBeforeUpdate"]>;
+      typeof import('@vueuse/core')['makeDestructurable']
+    >
+    readonly markRaw: UnwrapRef<typeof import('vue')['markRaw']>
+    readonly nextTick: UnwrapRef<typeof import('vue')['nextTick']>
+    readonly onActivated: UnwrapRef<typeof import('vue')['onActivated']>
+    readonly onBeforeMount: UnwrapRef<typeof import('vue')['onBeforeMount']>
+    readonly onBeforeUnmount: UnwrapRef<typeof import('vue')['onBeforeUnmount']>
+    readonly onBeforeUpdate: UnwrapRef<typeof import('vue')['onBeforeUpdate']>
     readonly onClickOutside: UnwrapRef<
-      typeof import("@vueuse/core")["onClickOutside"]
-    >;
-    readonly onDeactivated: UnwrapRef<typeof import("vue")["onDeactivated"]>;
-    readonly onErrorCaptured: UnwrapRef<
-      typeof import("vue")["onErrorCaptured"]
-    >;
+      typeof import('@vueuse/core')['onClickOutside']
+    >
+    readonly onDeactivated: UnwrapRef<typeof import('vue')['onDeactivated']>
+    readonly onErrorCaptured: UnwrapRef<typeof import('vue')['onErrorCaptured']>
     readonly onKeyStroke: UnwrapRef<
-      typeof import("@vueuse/core")["onKeyStroke"]
-    >;
+      typeof import('@vueuse/core')['onKeyStroke']
+    >
     readonly onLongPress: UnwrapRef<
-      typeof import("@vueuse/core")["onLongPress"]
-    >;
-    readonly onMounted: UnwrapRef<typeof import("vue")["onMounted"]>;
-    readonly onRenderTracked: UnwrapRef<
-      typeof import("vue")["onRenderTracked"]
-    >;
+      typeof import('@vueuse/core')['onLongPress']
+    >
+    readonly onMounted: UnwrapRef<typeof import('vue')['onMounted']>
+    readonly onRenderTracked: UnwrapRef<typeof import('vue')['onRenderTracked']>
     readonly onRenderTriggered: UnwrapRef<
-      typeof import("vue")["onRenderTriggered"]
-    >;
-    readonly onScopeDispose: UnwrapRef<typeof import("vue")["onScopeDispose"]>;
+      typeof import('vue')['onRenderTriggered']
+    >
+    readonly onScopeDispose: UnwrapRef<typeof import('vue')['onScopeDispose']>
     readonly onServerPrefetch: UnwrapRef<
-      typeof import("vue")["onServerPrefetch"]
-    >;
+      typeof import('vue')['onServerPrefetch']
+    >
     readonly onStartTyping: UnwrapRef<
-      typeof import("@vueuse/core")["onStartTyping"]
-    >;
-    readonly onUnmounted: UnwrapRef<typeof import("vue")["onUnmounted"]>;
-    readonly onUpdated: UnwrapRef<typeof import("vue")["onUpdated"]>;
+      typeof import('@vueuse/core')['onStartTyping']
+    >
+    readonly onUnmounted: UnwrapRef<typeof import('vue')['onUnmounted']>
+    readonly onUpdated: UnwrapRef<typeof import('vue')['onUpdated']>
     readonly pausableWatch: UnwrapRef<
-      typeof import("@vueuse/core")["pausableWatch"]
-    >;
-    readonly provide: UnwrapRef<typeof import("vue")["provide"]>;
-    readonly reactify: UnwrapRef<typeof import("@vueuse/core")["reactify"]>;
+      typeof import('@vueuse/core')['pausableWatch']
+    >
+    readonly provide: UnwrapRef<typeof import('vue')['provide']>
+    readonly reactify: UnwrapRef<typeof import('@vueuse/core')['reactify']>
     readonly reactifyObject: UnwrapRef<
-      typeof import("@vueuse/core")["reactifyObject"]
-    >;
-    readonly reactive: UnwrapRef<typeof import("vue")["reactive"]>;
+      typeof import('@vueuse/core')['reactifyObject']
+    >
+    readonly reactive: UnwrapRef<typeof import('vue')['reactive']>
     readonly reactiveComputed: UnwrapRef<
-      typeof import("@vueuse/core")["reactiveComputed"]
-    >;
+      typeof import('@vueuse/core')['reactiveComputed']
+    >
     readonly reactiveOmit: UnwrapRef<
-      typeof import("@vueuse/core")["reactiveOmit"]
-    >;
+      typeof import('@vueuse/core')['reactiveOmit']
+    >
     readonly reactivePick: UnwrapRef<
-      typeof import("@vueuse/core")["reactivePick"]
-    >;
-    readonly readonly: UnwrapRef<typeof import("vue")["readonly"]>;
-    readonly ref: UnwrapRef<typeof import("vue")["ref"]>;
+      typeof import('@vueuse/core')['reactivePick']
+    >
+    readonly readonly: UnwrapRef<typeof import('vue')['readonly']>
+    readonly ref: UnwrapRef<typeof import('vue')['ref']>
     readonly refAutoReset: UnwrapRef<
-      typeof import("@vueuse/core")["refAutoReset"]
-    >;
+      typeof import('@vueuse/core')['refAutoReset']
+    >
     readonly refDebounced: UnwrapRef<
-      typeof import("@vueuse/core")["refDebounced"]
-    >;
-    readonly refDefault: UnwrapRef<typeof import("@vueuse/core")["refDefault"]>;
+      typeof import('@vueuse/core')['refDebounced']
+    >
+    readonly refDefault: UnwrapRef<typeof import('@vueuse/core')['refDefault']>
     readonly refThrottled: UnwrapRef<
-      typeof import("@vueuse/core")["refThrottled"]
-    >;
+      typeof import('@vueuse/core')['refThrottled']
+    >
     readonly refWithControl: UnwrapRef<
-      typeof import("@vueuse/core")["refWithControl"]
-    >;
+      typeof import('@vueuse/core')['refWithControl']
+    >
     readonly resolveComponent: UnwrapRef<
-      typeof import("vue")["resolveComponent"]
-    >;
-    readonly resolveRef: UnwrapRef<typeof import("@vueuse/core")["resolveRef"]>;
+      typeof import('vue')['resolveComponent']
+    >
+    readonly resolveRef: UnwrapRef<typeof import('@vueuse/core')['resolveRef']>
     readonly resolveUnref: UnwrapRef<
-      typeof import("@vueuse/core")["resolveUnref"]
-    >;
-    readonly shallowReactive: UnwrapRef<
-      typeof import("vue")["shallowReactive"]
-    >;
-    readonly shallowReadonly: UnwrapRef<
-      typeof import("vue")["shallowReadonly"]
-    >;
-    readonly shallowRef: UnwrapRef<typeof import("vue")["shallowRef"]>;
-    readonly syncRef: UnwrapRef<typeof import("@vueuse/core")["syncRef"]>;
-    readonly syncRefs: UnwrapRef<typeof import("@vueuse/core")["syncRefs"]>;
+      typeof import('@vueuse/core')['resolveUnref']
+    >
+    readonly shallowReactive: UnwrapRef<typeof import('vue')['shallowReactive']>
+    readonly shallowReadonly: UnwrapRef<typeof import('vue')['shallowReadonly']>
+    readonly shallowRef: UnwrapRef<typeof import('vue')['shallowRef']>
+    readonly syncRef: UnwrapRef<typeof import('@vueuse/core')['syncRef']>
+    readonly syncRefs: UnwrapRef<typeof import('@vueuse/core')['syncRefs']>
     readonly templateRef: UnwrapRef<
-      typeof import("@vueuse/core")["templateRef"]
-    >;
+      typeof import('@vueuse/core')['templateRef']
+    >
     readonly throttledRef: UnwrapRef<
-      typeof import("@vueuse/core")["throttledRef"]
-    >;
+      typeof import('@vueuse/core')['throttledRef']
+    >
     readonly throttledWatch: UnwrapRef<
-      typeof import("@vueuse/core")["throttledWatch"]
-    >;
-    readonly toRaw: UnwrapRef<typeof import("vue")["toRaw"]>;
-    readonly toReactive: UnwrapRef<typeof import("@vueuse/core")["toReactive"]>;
-    readonly toRef: UnwrapRef<typeof import("vue")["toRef"]>;
-    readonly toRefs: UnwrapRef<typeof import("vue")["toRefs"]>;
-    readonly toValue: UnwrapRef<typeof import("vue")["toValue"]>;
-    readonly triggerRef: UnwrapRef<typeof import("vue")["triggerRef"]>;
+      typeof import('@vueuse/core')['throttledWatch']
+    >
+    readonly toRaw: UnwrapRef<typeof import('vue')['toRaw']>
+    readonly toReactive: UnwrapRef<typeof import('@vueuse/core')['toReactive']>
+    readonly toRef: UnwrapRef<typeof import('vue')['toRef']>
+    readonly toRefs: UnwrapRef<typeof import('vue')['toRefs']>
+    readonly toValue: UnwrapRef<typeof import('vue')['toValue']>
+    readonly triggerRef: UnwrapRef<typeof import('vue')['triggerRef']>
     readonly tryOnBeforeMount: UnwrapRef<
-      typeof import("@vueuse/core")["tryOnBeforeMount"]
-    >;
+      typeof import('@vueuse/core')['tryOnBeforeMount']
+    >
     readonly tryOnBeforeUnmount: UnwrapRef<
-      typeof import("@vueuse/core")["tryOnBeforeUnmount"]
-    >;
+      typeof import('@vueuse/core')['tryOnBeforeUnmount']
+    >
     readonly tryOnMounted: UnwrapRef<
-      typeof import("@vueuse/core")["tryOnMounted"]
-    >;
+      typeof import('@vueuse/core')['tryOnMounted']
+    >
     readonly tryOnScopeDispose: UnwrapRef<
-      typeof import("@vueuse/core")["tryOnScopeDispose"]
-    >;
+      typeof import('@vueuse/core')['tryOnScopeDispose']
+    >
     readonly tryOnUnmounted: UnwrapRef<
-      typeof import("@vueuse/core")["tryOnUnmounted"]
-    >;
-    readonly unref: UnwrapRef<typeof import("vue")["unref"]>;
+      typeof import('@vueuse/core')['tryOnUnmounted']
+    >
+    readonly unref: UnwrapRef<typeof import('vue')['unref']>
     readonly unrefElement: UnwrapRef<
-      typeof import("@vueuse/core")["unrefElement"]
-    >;
-    readonly until: UnwrapRef<typeof import("@vueuse/core")["until"]>;
+      typeof import('@vueuse/core')['unrefElement']
+    >
+    readonly until: UnwrapRef<typeof import('@vueuse/core')['until']>
     readonly useActiveElement: UnwrapRef<
-      typeof import("@vueuse/core")["useActiveElement"]
-    >;
-    readonly useAnimate: UnwrapRef<typeof import("@vueuse/core")["useAnimate"]>;
+      typeof import('@vueuse/core')['useActiveElement']
+    >
+    readonly useAnimate: UnwrapRef<typeof import('@vueuse/core')['useAnimate']>
     readonly useArrayDifference: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayDifference"]
-    >;
+      typeof import('@vueuse/core')['useArrayDifference']
+    >
     readonly useArrayEvery: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayEvery"]
-    >;
+      typeof import('@vueuse/core')['useArrayEvery']
+    >
     readonly useArrayFilter: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayFilter"]
-    >;
+      typeof import('@vueuse/core')['useArrayFilter']
+    >
     readonly useArrayFind: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayFind"]
-    >;
+      typeof import('@vueuse/core')['useArrayFind']
+    >
     readonly useArrayFindIndex: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayFindIndex"]
-    >;
+      typeof import('@vueuse/core')['useArrayFindIndex']
+    >
     readonly useArrayFindLast: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayFindLast"]
-    >;
+      typeof import('@vueuse/core')['useArrayFindLast']
+    >
     readonly useArrayIncludes: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayIncludes"]
-    >;
+      typeof import('@vueuse/core')['useArrayIncludes']
+    >
     readonly useArrayJoin: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayJoin"]
-    >;
+      typeof import('@vueuse/core')['useArrayJoin']
+    >
     readonly useArrayMap: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayMap"]
-    >;
+      typeof import('@vueuse/core')['useArrayMap']
+    >
     readonly useArrayReduce: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayReduce"]
-    >;
+      typeof import('@vueuse/core')['useArrayReduce']
+    >
     readonly useArraySome: UnwrapRef<
-      typeof import("@vueuse/core")["useArraySome"]
-    >;
+      typeof import('@vueuse/core')['useArraySome']
+    >
     readonly useArrayUnique: UnwrapRef<
-      typeof import("@vueuse/core")["useArrayUnique"]
-    >;
+      typeof import('@vueuse/core')['useArrayUnique']
+    >
     readonly useAsyncQueue: UnwrapRef<
-      typeof import("@vueuse/core")["useAsyncQueue"]
-    >;
+      typeof import('@vueuse/core')['useAsyncQueue']
+    >
     readonly useAsyncState: UnwrapRef<
-      typeof import("@vueuse/core")["useAsyncState"]
-    >;
-    readonly useAttrs: UnwrapRef<typeof import("vue")["useAttrs"]>;
-    readonly useBase64: UnwrapRef<typeof import("@vueuse/core")["useBase64"]>;
-    readonly useBattery: UnwrapRef<typeof import("@vueuse/core")["useBattery"]>;
+      typeof import('@vueuse/core')['useAsyncState']
+    >
+    readonly useAttrs: UnwrapRef<typeof import('vue')['useAttrs']>
+    readonly useBase64: UnwrapRef<typeof import('@vueuse/core')['useBase64']>
+    readonly useBattery: UnwrapRef<typeof import('@vueuse/core')['useBattery']>
     readonly useBluetooth: UnwrapRef<
-      typeof import("@vueuse/core")["useBluetooth"]
-    >;
+      typeof import('@vueuse/core')['useBluetooth']
+    >
     readonly useBreakpoints: UnwrapRef<
-      typeof import("@vueuse/core")["useBreakpoints"]
-    >;
+      typeof import('@vueuse/core')['useBreakpoints']
+    >
     readonly useBroadcastChannel: UnwrapRef<
-      typeof import("@vueuse/core")["useBroadcastChannel"]
-    >;
+      typeof import('@vueuse/core')['useBroadcastChannel']
+    >
     readonly useBrowserLocation: UnwrapRef<
-      typeof import("@vueuse/core")["useBrowserLocation"]
-    >;
-    readonly useCached: UnwrapRef<typeof import("@vueuse/core")["useCached"]>;
+      typeof import('@vueuse/core')['useBrowserLocation']
+    >
+    readonly useCached: UnwrapRef<typeof import('@vueuse/core')['useCached']>
     readonly useClipboard: UnwrapRef<
-      typeof import("@vueuse/core")["useClipboard"]
-    >;
-    readonly useCloned: UnwrapRef<typeof import("@vueuse/core")["useCloned"]>;
+      typeof import('@vueuse/core')['useClipboard']
+    >
+    readonly useCloned: UnwrapRef<typeof import('@vueuse/core')['useCloned']>
     readonly useColorMode: UnwrapRef<
-      typeof import("@vueuse/core")["useColorMode"]
-    >;
+      typeof import('@vueuse/core')['useColorMode']
+    >
     readonly useConfirmDialog: UnwrapRef<
-      typeof import("@vueuse/core")["useConfirmDialog"]
-    >;
-    readonly useCounter: UnwrapRef<typeof import("@vueuse/core")["useCounter"]>;
-    readonly useCssModule: UnwrapRef<typeof import("vue")["useCssModule"]>;
-    readonly useCssVar: UnwrapRef<typeof import("@vueuse/core")["useCssVar"]>;
-    readonly useCssVars: UnwrapRef<typeof import("vue")["useCssVars"]>;
+      typeof import('@vueuse/core')['useConfirmDialog']
+    >
+    readonly useCounter: UnwrapRef<typeof import('@vueuse/core')['useCounter']>
+    readonly useCssModule: UnwrapRef<typeof import('vue')['useCssModule']>
+    readonly useCssVar: UnwrapRef<typeof import('@vueuse/core')['useCssVar']>
+    readonly useCssVars: UnwrapRef<typeof import('vue')['useCssVars']>
     readonly useCurrentElement: UnwrapRef<
-      typeof import("@vueuse/core")["useCurrentElement"]
-    >;
+      typeof import('@vueuse/core')['useCurrentElement']
+    >
     readonly useCycleList: UnwrapRef<
-      typeof import("@vueuse/core")["useCycleList"]
-    >;
-    readonly useDark: UnwrapRef<typeof import("@vueuse/core")["useDark"]>;
+      typeof import('@vueuse/core')['useCycleList']
+    >
+    readonly useDark: UnwrapRef<typeof import('@vueuse/core')['useDark']>
     readonly useDateFormat: UnwrapRef<
-      typeof import("@vueuse/core")["useDateFormat"]
-    >;
+      typeof import('@vueuse/core')['useDateFormat']
+    >
     readonly useDebounce: UnwrapRef<
-      typeof import("@vueuse/core")["useDebounce"]
-    >;
+      typeof import('@vueuse/core')['useDebounce']
+    >
     readonly useDebounceFn: UnwrapRef<
-      typeof import("@vueuse/core")["useDebounceFn"]
-    >;
+      typeof import('@vueuse/core')['useDebounceFn']
+    >
     readonly useDebouncedRefHistory: UnwrapRef<
-      typeof import("@vueuse/core")["useDebouncedRefHistory"]
-    >;
+      typeof import('@vueuse/core')['useDebouncedRefHistory']
+    >
     readonly useDeviceMotion: UnwrapRef<
-      typeof import("@vueuse/core")["useDeviceMotion"]
-    >;
+      typeof import('@vueuse/core')['useDeviceMotion']
+    >
     readonly useDeviceOrientation: UnwrapRef<
-      typeof import("@vueuse/core")["useDeviceOrientation"]
-    >;
+      typeof import('@vueuse/core')['useDeviceOrientation']
+    >
     readonly useDevicePixelRatio: UnwrapRef<
-      typeof import("@vueuse/core")["useDevicePixelRatio"]
-    >;
+      typeof import('@vueuse/core')['useDevicePixelRatio']
+    >
     readonly useDevicesList: UnwrapRef<
-      typeof import("@vueuse/core")["useDevicesList"]
-    >;
+      typeof import('@vueuse/core')['useDevicesList']
+    >
     readonly useDisplayMedia: UnwrapRef<
-      typeof import("@vueuse/core")["useDisplayMedia"]
-    >;
+      typeof import('@vueuse/core')['useDisplayMedia']
+    >
     readonly useDocumentVisibility: UnwrapRef<
-      typeof import("@vueuse/core")["useDocumentVisibility"]
-    >;
+      typeof import('@vueuse/core')['useDocumentVisibility']
+    >
     readonly useDraggable: UnwrapRef<
-      typeof import("@vueuse/core")["useDraggable"]
-    >;
+      typeof import('@vueuse/core')['useDraggable']
+    >
     readonly useDropZone: UnwrapRef<
-      typeof import("@vueuse/core")["useDropZone"]
-    >;
+      typeof import('@vueuse/core')['useDropZone']
+    >
     readonly useElementBounding: UnwrapRef<
-      typeof import("@vueuse/core")["useElementBounding"]
-    >;
+      typeof import('@vueuse/core')['useElementBounding']
+    >
     readonly useElementByPoint: UnwrapRef<
-      typeof import("@vueuse/core")["useElementByPoint"]
-    >;
+      typeof import('@vueuse/core')['useElementByPoint']
+    >
     readonly useElementHover: UnwrapRef<
-      typeof import("@vueuse/core")["useElementHover"]
-    >;
+      typeof import('@vueuse/core')['useElementHover']
+    >
     readonly useElementSize: UnwrapRef<
-      typeof import("@vueuse/core")["useElementSize"]
-    >;
+      typeof import('@vueuse/core')['useElementSize']
+    >
     readonly useElementVisibility: UnwrapRef<
-      typeof import("@vueuse/core")["useElementVisibility"]
-    >;
+      typeof import('@vueuse/core')['useElementVisibility']
+    >
     readonly useEventBus: UnwrapRef<
-      typeof import("@vueuse/core")["useEventBus"]
-    >;
+      typeof import('@vueuse/core')['useEventBus']
+    >
     readonly useEventListener: UnwrapRef<
-      typeof import("@vueuse/core")["useEventListener"]
-    >;
+      typeof import('@vueuse/core')['useEventListener']
+    >
     readonly useEventSource: UnwrapRef<
-      typeof import("@vueuse/core")["useEventSource"]
-    >;
+      typeof import('@vueuse/core')['useEventSource']
+    >
     readonly useEyeDropper: UnwrapRef<
-      typeof import("@vueuse/core")["useEyeDropper"]
-    >;
-    readonly useFavicon: UnwrapRef<typeof import("@vueuse/core")["useFavicon"]>;
-    readonly useFetch: UnwrapRef<typeof import("@vueuse/core")["useFetch"]>;
+      typeof import('@vueuse/core')['useEyeDropper']
+    >
+    readonly useFavicon: UnwrapRef<typeof import('@vueuse/core')['useFavicon']>
+    readonly useFetch: UnwrapRef<typeof import('@vueuse/core')['useFetch']>
     readonly useFileDialog: UnwrapRef<
-      typeof import("@vueuse/core")["useFileDialog"]
-    >;
+      typeof import('@vueuse/core')['useFileDialog']
+    >
     readonly useFileSystemAccess: UnwrapRef<
-      typeof import("@vueuse/core")["useFileSystemAccess"]
-    >;
-    readonly useFocus: UnwrapRef<typeof import("@vueuse/core")["useFocus"]>;
+      typeof import('@vueuse/core')['useFileSystemAccess']
+    >
+    readonly useFocus: UnwrapRef<typeof import('@vueuse/core')['useFocus']>
     readonly useFocusWithin: UnwrapRef<
-      typeof import("@vueuse/core")["useFocusWithin"]
-    >;
-    readonly useFps: UnwrapRef<typeof import("@vueuse/core")["useFps"]>;
+      typeof import('@vueuse/core')['useFocusWithin']
+    >
+    readonly useFps: UnwrapRef<typeof import('@vueuse/core')['useFps']>
     readonly useFullscreen: UnwrapRef<
-      typeof import("@vueuse/core")["useFullscreen"]
-    >;
-    readonly useGamepad: UnwrapRef<typeof import("@vueuse/core")["useGamepad"]>;
+      typeof import('@vueuse/core')['useFullscreen']
+    >
+    readonly useGamepad: UnwrapRef<typeof import('@vueuse/core')['useGamepad']>
     readonly useGeolocation: UnwrapRef<
-      typeof import("@vueuse/core")["useGeolocation"]
-    >;
-    readonly useIdle: UnwrapRef<typeof import("@vueuse/core")["useIdle"]>;
-    readonly useImage: UnwrapRef<typeof import("@vueuse/core")["useImage"]>;
+      typeof import('@vueuse/core')['useGeolocation']
+    >
+    readonly useIdle: UnwrapRef<typeof import('@vueuse/core')['useIdle']>
+    readonly useImage: UnwrapRef<typeof import('@vueuse/core')['useImage']>
     readonly useInfiniteScroll: UnwrapRef<
-      typeof import("@vueuse/core")["useInfiniteScroll"]
-    >;
+      typeof import('@vueuse/core')['useInfiniteScroll']
+    >
     readonly useIntersectionObserver: UnwrapRef<
-      typeof import("@vueuse/core")["useIntersectionObserver"]
-    >;
+      typeof import('@vueuse/core')['useIntersectionObserver']
+    >
     readonly useInterval: UnwrapRef<
-      typeof import("@vueuse/core")["useInterval"]
-    >;
+      typeof import('@vueuse/core')['useInterval']
+    >
     readonly useIntervalFn: UnwrapRef<
-      typeof import("@vueuse/core")["useIntervalFn"]
-    >;
+      typeof import('@vueuse/core')['useIntervalFn']
+    >
     readonly useKeyModifier: UnwrapRef<
-      typeof import("@vueuse/core")["useKeyModifier"]
-    >;
+      typeof import('@vueuse/core')['useKeyModifier']
+    >
     readonly useLastChanged: UnwrapRef<
-      typeof import("@vueuse/core")["useLastChanged"]
-    >;
+      typeof import('@vueuse/core')['useLastChanged']
+    >
     readonly useLocalStorage: UnwrapRef<
-      typeof import("@vueuse/core")["useLocalStorage"]
-    >;
+      typeof import('@vueuse/core')['useLocalStorage']
+    >
     readonly useMagicKeys: UnwrapRef<
-      typeof import("@vueuse/core")["useMagicKeys"]
-    >;
+      typeof import('@vueuse/core')['useMagicKeys']
+    >
     readonly useManualRefHistory: UnwrapRef<
-      typeof import("@vueuse/core")["useManualRefHistory"]
-    >;
+      typeof import('@vueuse/core')['useManualRefHistory']
+    >
     readonly useMediaControls: UnwrapRef<
-      typeof import("@vueuse/core")["useMediaControls"]
-    >;
+      typeof import('@vueuse/core')['useMediaControls']
+    >
     readonly useMediaQuery: UnwrapRef<
-      typeof import("@vueuse/core")["useMediaQuery"]
-    >;
-    readonly useMemoize: UnwrapRef<typeof import("@vueuse/core")["useMemoize"]>;
-    readonly useMemory: UnwrapRef<typeof import("@vueuse/core")["useMemory"]>;
-    readonly useMounted: UnwrapRef<typeof import("@vueuse/core")["useMounted"]>;
-    readonly useMouse: UnwrapRef<typeof import("@vueuse/core")["useMouse"]>;
+      typeof import('@vueuse/core')['useMediaQuery']
+    >
+    readonly useMemoize: UnwrapRef<typeof import('@vueuse/core')['useMemoize']>
+    readonly useMemory: UnwrapRef<typeof import('@vueuse/core')['useMemory']>
+    readonly useMounted: UnwrapRef<typeof import('@vueuse/core')['useMounted']>
+    readonly useMouse: UnwrapRef<typeof import('@vueuse/core')['useMouse']>
     readonly useMouseInElement: UnwrapRef<
-      typeof import("@vueuse/core")["useMouseInElement"]
-    >;
+      typeof import('@vueuse/core')['useMouseInElement']
+    >
     readonly useMousePressed: UnwrapRef<
-      typeof import("@vueuse/core")["useMousePressed"]
-    >;
+      typeof import('@vueuse/core')['useMousePressed']
+    >
     readonly useMutationObserver: UnwrapRef<
-      typeof import("@vueuse/core")["useMutationObserver"]
-    >;
+      typeof import('@vueuse/core')['useMutationObserver']
+    >
     readonly useNavigatorLanguage: UnwrapRef<
-      typeof import("@vueuse/core")["useNavigatorLanguage"]
-    >;
-    readonly useNetwork: UnwrapRef<typeof import("@vueuse/core")["useNetwork"]>;
-    readonly useNow: UnwrapRef<typeof import("@vueuse/core")["useNow"]>;
+      typeof import('@vueuse/core')['useNavigatorLanguage']
+    >
+    readonly useNetwork: UnwrapRef<typeof import('@vueuse/core')['useNetwork']>
+    readonly useNow: UnwrapRef<typeof import('@vueuse/core')['useNow']>
     readonly useObjectUrl: UnwrapRef<
-      typeof import("@vueuse/core")["useObjectUrl"]
-    >;
+      typeof import('@vueuse/core')['useObjectUrl']
+    >
     readonly useOffsetPagination: UnwrapRef<
-      typeof import("@vueuse/core")["useOffsetPagination"]
-    >;
-    readonly useOnline: UnwrapRef<typeof import("@vueuse/core")["useOnline"]>;
+      typeof import('@vueuse/core')['useOffsetPagination']
+    >
+    readonly useOnline: UnwrapRef<typeof import('@vueuse/core')['useOnline']>
     readonly usePageLeave: UnwrapRef<
-      typeof import("@vueuse/core")["usePageLeave"]
-    >;
+      typeof import('@vueuse/core')['usePageLeave']
+    >
     readonly useParallax: UnwrapRef<
-      typeof import("@vueuse/core")["useParallax"]
-    >;
+      typeof import('@vueuse/core')['useParallax']
+    >
     readonly useParentElement: UnwrapRef<
-      typeof import("@vueuse/core")["useParentElement"]
-    >;
+      typeof import('@vueuse/core')['useParentElement']
+    >
     readonly usePerformanceObserver: UnwrapRef<
-      typeof import("@vueuse/core")["usePerformanceObserver"]
-    >;
+      typeof import('@vueuse/core')['usePerformanceObserver']
+    >
     readonly usePermission: UnwrapRef<
-      typeof import("@vueuse/core")["usePermission"]
-    >;
-    readonly usePointer: UnwrapRef<typeof import("@vueuse/core")["usePointer"]>;
+      typeof import('@vueuse/core')['usePermission']
+    >
+    readonly usePointer: UnwrapRef<typeof import('@vueuse/core')['usePointer']>
     readonly usePointerLock: UnwrapRef<
-      typeof import("@vueuse/core")["usePointerLock"]
-    >;
+      typeof import('@vueuse/core')['usePointerLock']
+    >
     readonly usePointerSwipe: UnwrapRef<
-      typeof import("@vueuse/core")["usePointerSwipe"]
-    >;
+      typeof import('@vueuse/core')['usePointerSwipe']
+    >
     readonly usePreferredColorScheme: UnwrapRef<
-      typeof import("@vueuse/core")["usePreferredColorScheme"]
-    >;
+      typeof import('@vueuse/core')['usePreferredColorScheme']
+    >
     readonly usePreferredContrast: UnwrapRef<
-      typeof import("@vueuse/core")["usePreferredContrast"]
-    >;
+      typeof import('@vueuse/core')['usePreferredContrast']
+    >
     readonly usePreferredDark: UnwrapRef<
-      typeof import("@vueuse/core")["usePreferredDark"]
-    >;
+      typeof import('@vueuse/core')['usePreferredDark']
+    >
     readonly usePreferredLanguages: UnwrapRef<
-      typeof import("@vueuse/core")["usePreferredLanguages"]
-    >;
+      typeof import('@vueuse/core')['usePreferredLanguages']
+    >
     readonly usePreferredReducedMotion: UnwrapRef<
-      typeof import("@vueuse/core")["usePreferredReducedMotion"]
-    >;
+      typeof import('@vueuse/core')['usePreferredReducedMotion']
+    >
     readonly usePrevious: UnwrapRef<
-      typeof import("@vueuse/core")["usePrevious"]
-    >;
-    readonly useRafFn: UnwrapRef<typeof import("@vueuse/core")["useRafFn"]>;
+      typeof import('@vueuse/core')['usePrevious']
+    >
+    readonly useRafFn: UnwrapRef<typeof import('@vueuse/core')['useRafFn']>
     readonly useRefHistory: UnwrapRef<
-      typeof import("@vueuse/core")["useRefHistory"]
-    >;
+      typeof import('@vueuse/core')['useRefHistory']
+    >
     readonly useResizeObserver: UnwrapRef<
-      typeof import("@vueuse/core")["useResizeObserver"]
-    >;
+      typeof import('@vueuse/core')['useResizeObserver']
+    >
     readonly useScreenOrientation: UnwrapRef<
-      typeof import("@vueuse/core")["useScreenOrientation"]
-    >;
+      typeof import('@vueuse/core')['useScreenOrientation']
+    >
     readonly useScreenSafeArea: UnwrapRef<
-      typeof import("@vueuse/core")["useScreenSafeArea"]
-    >;
+      typeof import('@vueuse/core')['useScreenSafeArea']
+    >
     readonly useScriptTag: UnwrapRef<
-      typeof import("@vueuse/core")["useScriptTag"]
-    >;
-    readonly useScroll: UnwrapRef<typeof import("@vueuse/core")["useScroll"]>;
+      typeof import('@vueuse/core')['useScriptTag']
+    >
+    readonly useScroll: UnwrapRef<typeof import('@vueuse/core')['useScroll']>
     readonly useScrollLock: UnwrapRef<
-      typeof import("@vueuse/core")["useScrollLock"]
-    >;
+      typeof import('@vueuse/core')['useScrollLock']
+    >
     readonly useSessionStorage: UnwrapRef<
-      typeof import("@vueuse/core")["useSessionStorage"]
-    >;
-    readonly useShare: UnwrapRef<typeof import("@vueuse/core")["useShare"]>;
-    readonly useSlots: UnwrapRef<typeof import("vue")["useSlots"]>;
-    readonly useSorted: UnwrapRef<typeof import("@vueuse/core")["useSorted"]>;
+      typeof import('@vueuse/core')['useSessionStorage']
+    >
+    readonly useShare: UnwrapRef<typeof import('@vueuse/core')['useShare']>
+    readonly useSlots: UnwrapRef<typeof import('vue')['useSlots']>
+    readonly useSorted: UnwrapRef<typeof import('@vueuse/core')['useSorted']>
     readonly useSpeechRecognition: UnwrapRef<
-      typeof import("@vueuse/core")["useSpeechRecognition"]
-    >;
+      typeof import('@vueuse/core')['useSpeechRecognition']
+    >
     readonly useSpeechSynthesis: UnwrapRef<
-      typeof import("@vueuse/core")["useSpeechSynthesis"]
-    >;
-    readonly useStepper: UnwrapRef<typeof import("@vueuse/core")["useStepper"]>;
-    readonly useStorage: UnwrapRef<typeof import("@vueuse/core")["useStorage"]>;
+      typeof import('@vueuse/core')['useSpeechSynthesis']
+    >
+    readonly useStepper: UnwrapRef<typeof import('@vueuse/core')['useStepper']>
+    readonly useStorage: UnwrapRef<typeof import('@vueuse/core')['useStorage']>
     readonly useStorageAsync: UnwrapRef<
-      typeof import("@vueuse/core")["useStorageAsync"]
-    >;
+      typeof import('@vueuse/core')['useStorageAsync']
+    >
     readonly useStyleTag: UnwrapRef<
-      typeof import("@vueuse/core")["useStyleTag"]
-    >;
+      typeof import('@vueuse/core')['useStyleTag']
+    >
     readonly useSupported: UnwrapRef<
-      typeof import("@vueuse/core")["useSupported"]
-    >;
-    readonly useSwipe: UnwrapRef<typeof import("@vueuse/core")["useSwipe"]>;
+      typeof import('@vueuse/core')['useSupported']
+    >
+    readonly useSwipe: UnwrapRef<typeof import('@vueuse/core')['useSwipe']>
     readonly useTemplateRefsList: UnwrapRef<
-      typeof import("@vueuse/core")["useTemplateRefsList"]
-    >;
+      typeof import('@vueuse/core')['useTemplateRefsList']
+    >
     readonly useTextDirection: UnwrapRef<
-      typeof import("@vueuse/core")["useTextDirection"]
-    >;
+      typeof import('@vueuse/core')['useTextDirection']
+    >
     readonly useTextSelection: UnwrapRef<
-      typeof import("@vueuse/core")["useTextSelection"]
-    >;
+      typeof import('@vueuse/core')['useTextSelection']
+    >
     readonly useTextareaAutosize: UnwrapRef<
-      typeof import("@vueuse/core")["useTextareaAutosize"]
-    >;
+      typeof import('@vueuse/core')['useTextareaAutosize']
+    >
     readonly useThrottle: UnwrapRef<
-      typeof import("@vueuse/core")["useThrottle"]
-    >;
+      typeof import('@vueuse/core')['useThrottle']
+    >
     readonly useThrottleFn: UnwrapRef<
-      typeof import("@vueuse/core")["useThrottleFn"]
-    >;
+      typeof import('@vueuse/core')['useThrottleFn']
+    >
     readonly useThrottledRefHistory: UnwrapRef<
-      typeof import("@vueuse/core")["useThrottledRefHistory"]
-    >;
-    readonly useTimeAgo: UnwrapRef<typeof import("@vueuse/core")["useTimeAgo"]>;
-    readonly useTimeout: UnwrapRef<typeof import("@vueuse/core")["useTimeout"]>;
+      typeof import('@vueuse/core')['useThrottledRefHistory']
+    >
+    readonly useTimeAgo: UnwrapRef<typeof import('@vueuse/core')['useTimeAgo']>
+    readonly useTimeout: UnwrapRef<typeof import('@vueuse/core')['useTimeout']>
     readonly useTimeoutFn: UnwrapRef<
-      typeof import("@vueuse/core")["useTimeoutFn"]
-    >;
+      typeof import('@vueuse/core')['useTimeoutFn']
+    >
     readonly useTimeoutPoll: UnwrapRef<
-      typeof import("@vueuse/core")["useTimeoutPoll"]
-    >;
+      typeof import('@vueuse/core')['useTimeoutPoll']
+    >
     readonly useTimestamp: UnwrapRef<
-      typeof import("@vueuse/core")["useTimestamp"]
-    >;
-    readonly useTitle: UnwrapRef<typeof import("@vueuse/core")["useTitle"]>;
+      typeof import('@vueuse/core')['useTimestamp']
+    >
+    readonly useTitle: UnwrapRef<typeof import('@vueuse/core')['useTitle']>
     readonly useToNumber: UnwrapRef<
-      typeof import("@vueuse/core")["useToNumber"]
-    >;
+      typeof import('@vueuse/core')['useToNumber']
+    >
     readonly useToString: UnwrapRef<
-      typeof import("@vueuse/core")["useToString"]
-    >;
-    readonly useToggle: UnwrapRef<typeof import("@vueuse/core")["useToggle"]>;
+      typeof import('@vueuse/core')['useToString']
+    >
+    readonly useToggle: UnwrapRef<typeof import('@vueuse/core')['useToggle']>
     readonly useTransition: UnwrapRef<
-      typeof import("@vueuse/core")["useTransition"]
-    >;
+      typeof import('@vueuse/core')['useTransition']
+    >
     readonly useUrlSearchParams: UnwrapRef<
-      typeof import("@vueuse/core")["useUrlSearchParams"]
-    >;
+      typeof import('@vueuse/core')['useUrlSearchParams']
+    >
     readonly useUserMedia: UnwrapRef<
-      typeof import("@vueuse/core")["useUserMedia"]
-    >;
-    readonly useVModel: UnwrapRef<typeof import("@vueuse/core")["useVModel"]>;
-    readonly useVModels: UnwrapRef<typeof import("@vueuse/core")["useVModels"]>;
-    readonly useVibrate: UnwrapRef<typeof import("@vueuse/core")["useVibrate"]>;
+      typeof import('@vueuse/core')['useUserMedia']
+    >
+    readonly useVModel: UnwrapRef<typeof import('@vueuse/core')['useVModel']>
+    readonly useVModels: UnwrapRef<typeof import('@vueuse/core')['useVModels']>
+    readonly useVibrate: UnwrapRef<typeof import('@vueuse/core')['useVibrate']>
     readonly useVirtualList: UnwrapRef<
-      typeof import("@vueuse/core")["useVirtualList"]
-    >;
+      typeof import('@vueuse/core')['useVirtualList']
+    >
     readonly useWakeLock: UnwrapRef<
-      typeof import("@vueuse/core")["useWakeLock"]
-    >;
+      typeof import('@vueuse/core')['useWakeLock']
+    >
     readonly useWebNotification: UnwrapRef<
-      typeof import("@vueuse/core")["useWebNotification"]
-    >;
+      typeof import('@vueuse/core')['useWebNotification']
+    >
     readonly useWebSocket: UnwrapRef<
-      typeof import("@vueuse/core")["useWebSocket"]
-    >;
+      typeof import('@vueuse/core')['useWebSocket']
+    >
     readonly useWebWorker: UnwrapRef<
-      typeof import("@vueuse/core")["useWebWorker"]
-    >;
+      typeof import('@vueuse/core')['useWebWorker']
+    >
     readonly useWebWorkerFn: UnwrapRef<
-      typeof import("@vueuse/core")["useWebWorkerFn"]
-    >;
+      typeof import('@vueuse/core')['useWebWorkerFn']
+    >
     readonly useWindowFocus: UnwrapRef<
-      typeof import("@vueuse/core")["useWindowFocus"]
-    >;
+      typeof import('@vueuse/core')['useWindowFocus']
+    >
     readonly useWindowScroll: UnwrapRef<
-      typeof import("@vueuse/core")["useWindowScroll"]
-    >;
+      typeof import('@vueuse/core')['useWindowScroll']
+    >
     readonly useWindowSize: UnwrapRef<
-      typeof import("@vueuse/core")["useWindowSize"]
-    >;
-    readonly watch: UnwrapRef<typeof import("vue")["watch"]>;
-    readonly watchArray: UnwrapRef<typeof import("@vueuse/core")["watchArray"]>;
+      typeof import('@vueuse/core')['useWindowSize']
+    >
+    readonly watch: UnwrapRef<typeof import('vue')['watch']>
+    readonly watchArray: UnwrapRef<typeof import('@vueuse/core')['watchArray']>
     readonly watchAtMost: UnwrapRef<
-      typeof import("@vueuse/core")["watchAtMost"]
-    >;
+      typeof import('@vueuse/core')['watchAtMost']
+    >
     readonly watchDebounced: UnwrapRef<
-      typeof import("@vueuse/core")["watchDebounced"]
-    >;
-    readonly watchDeep: UnwrapRef<typeof import("@vueuse/core")["watchDeep"]>;
-    readonly watchEffect: UnwrapRef<typeof import("vue")["watchEffect"]>;
+      typeof import('@vueuse/core')['watchDebounced']
+    >
+    readonly watchDeep: UnwrapRef<typeof import('@vueuse/core')['watchDeep']>
+    readonly watchEffect: UnwrapRef<typeof import('vue')['watchEffect']>
     readonly watchIgnorable: UnwrapRef<
-      typeof import("@vueuse/core")["watchIgnorable"]
-    >;
+      typeof import('@vueuse/core')['watchIgnorable']
+    >
     readonly watchImmediate: UnwrapRef<
-      typeof import("@vueuse/core")["watchImmediate"]
-    >;
-    readonly watchOnce: UnwrapRef<typeof import("@vueuse/core")["watchOnce"]>;
+      typeof import('@vueuse/core')['watchImmediate']
+    >
+    readonly watchOnce: UnwrapRef<typeof import('@vueuse/core')['watchOnce']>
     readonly watchPausable: UnwrapRef<
-      typeof import("@vueuse/core")["watchPausable"]
-    >;
-    readonly watchPostEffect: UnwrapRef<
-      typeof import("vue")["watchPostEffect"]
-    >;
-    readonly watchSyncEffect: UnwrapRef<
-      typeof import("vue")["watchSyncEffect"]
-    >;
+      typeof import('@vueuse/core')['watchPausable']
+    >
+    readonly watchPostEffect: UnwrapRef<typeof import('vue')['watchPostEffect']>
+    readonly watchSyncEffect: UnwrapRef<typeof import('vue')['watchSyncEffect']>
     readonly watchThrottled: UnwrapRef<
-      typeof import("@vueuse/core")["watchThrottled"]
-    >;
+      typeof import('@vueuse/core')['watchThrottled']
+    >
     readonly watchTriggerable: UnwrapRef<
-      typeof import("@vueuse/core")["watchTriggerable"]
-    >;
+      typeof import('@vueuse/core')['watchTriggerable']
+    >
     readonly watchWithFilter: UnwrapRef<
-      typeof import("@vueuse/core")["watchWithFilter"]
-    >;
-    readonly whenever: UnwrapRef<typeof import("@vueuse/core")["whenever"]>;
+      typeof import('@vueuse/core')['watchWithFilter']
+    >
+    readonly whenever: UnwrapRef<typeof import('@vueuse/core')['whenever']>
   }
 }
diff --git a/src/typings/components.d.ts b/src/typings/components.d.ts
index 418010e9..be3ec57a 100644
--- a/src/typings/components.d.ts
+++ b/src/typings/components.d.ts
@@ -5,113 +5,113 @@
 // Read more: https://github.com/vuejs/core/pull/3399
 import '@vue/runtime-core'
 
-export {};
+export {}
 
-declare module "@vue/runtime-core" {
+declare module '@vue/runtime-core' {
   export interface GlobalComponents {
-    AppMain: typeof import("./../layout/components/AppMain.vue")["default"];
-    BarChart: typeof import("./../views/dashboard/components/BarChart.vue")["default"];
-    Breadcrumb: typeof import("./../components/Breadcrumb/index.vue")["default"];
-    DeptTree: typeof import("./../views/system/user/components/dept-tree.vue")["default"];
-    Dictionary: typeof import("./../components/Dictionary/index.vue")["default"];
-    DictItem: typeof import("./../views/system/dict/components/dict-item.vue")["default"];
-    ElAlert: typeof import("element-plus/es")["ElAlert"];
-    ElBreadcrumb: typeof import("element-plus/es")["ElBreadcrumb"];
-    ElBreadcrumbItem: typeof import("element-plus/es")["ElBreadcrumbItem"];
-    ElButton: typeof import("element-plus/es")["ElButton"];
-    ElCard: typeof import("element-plus/es")["ElCard"];
-    ElCheckbox: typeof import("element-plus/es")["ElCheckbox"];
-    ElCheckboxGroup: typeof import("element-plus/es")["ElCheckboxGroup"];
-    ElCol: typeof import("element-plus/es")["ElCol"];
-    ElDatePicker: typeof import("element-plus/es")["ElDatePicker"];
-    ElDialog: typeof import("element-plus/es")["ElDialog"];
-    ElDivider: typeof import("element-plus/es")["ElDivider"];
-    ElDropdown: typeof import("element-plus/es")["ElDropdown"];
-    ElDropdownItem: typeof import("element-plus/es")["ElDropdownItem"];
-    ElDropdownMenu: typeof import("element-plus/es")["ElDropdownMenu"];
-    ElForm: typeof import("element-plus/es")["ElForm"];
-    ElFormItem: typeof import("element-plus/es")["ElFormItem"];
-    ElIcon: typeof import("element-plus/es")["ElIcon"];
-    ElImage: typeof import("element-plus/es")["ElImage"];
-    ElInput: typeof import("element-plus/es")["ElInput"];
-    ElInputNumber: typeof import("element-plus/es")["ElInputNumber"];
-    ElLink: typeof import("element-plus/es")["ElLink"];
-    ElMenu: typeof import("element-plus/es")["ElMenu"];
-    ElMenuItem: typeof import("element-plus/es")["ElMenuItem"];
-    ElOption: typeof import("element-plus/es")["ElOption"];
-    ElPagination: typeof import("element-plus/es")["ElPagination"];
-    ElPopover: typeof import("element-plus/es")["ElPopover"];
-    ElRadio: typeof import("element-plus/es")["ElRadio"];
-    ElRadioButton: typeof import("element-plus/es")["ElRadioButton"];
-    ElRadioGroup: typeof import("element-plus/es")["ElRadioGroup"];
-    ElRate: typeof import("element-plus/es")["ElRate"];
-    ElRow: typeof import("element-plus/es")["ElRow"];
-    ElScrollbar: typeof import("element-plus/es")["ElScrollbar"];
-    ElSelect: typeof import("element-plus/es")["ElSelect"];
-    ElSubMenu: typeof import("element-plus/es")["ElSubMenu"];
-    ElSwitch: typeof import("element-plus/es")["ElSwitch"];
-    ElTable: typeof import("element-plus/es")["ElTable"];
-    ElTableColumn: typeof import("element-plus/es")["ElTableColumn"];
-    ElTabPane: typeof import("element-plus/es")["ElTabPane"];
-    ElTabs: typeof import("element-plus/es")["ElTabs"];
-    ElTag: typeof import("element-plus/es")["ElTag"];
-    ElTooltip: typeof import("element-plus/es")["ElTooltip"];
-    ElTree: typeof import("element-plus/es")["ElTree"];
-    ElTreeSelect: typeof import("element-plus/es")["ElTreeSelect"];
-    ElUpload: typeof import("element-plus/es")["ElUpload"];
-    FixedThead: typeof import("./../views/demo/table/dynamic-table/components/FixedThead.vue")["default"];
-    FunnelChart: typeof import("./../views/dashboard/components/FunnelChart.vue")["default"];
-    GithubCorner: typeof import("./../components/GithubCorner/index.vue")["default"];
-    Hamburger: typeof import("./../components/Hamburger/index.vue")["default"];
-    IconSelect: typeof import("./../components/IconSelect/index.vue")["default"];
-    IEpArrowDown: typeof import("~icons/ep/arrow-down")["default"];
-    IEpCaretBottom: typeof import("~icons/ep/caret-bottom")["default"];
-    IEpCaretTop: typeof import("~icons/ep/caret-top")["default"];
-    IEpClose: typeof import("~icons/ep/close")["default"];
-    IEpCollection: typeof import("~icons/ep/collection")["default"];
-    IEpDelete: typeof import("~icons/ep/delete")["default"];
-    IEpDownload: typeof import("~icons/ep/download")["default"];
-    IEpEdit: typeof import("~icons/ep/edit")["default"];
-    IEpPicture: typeof import("~icons/ep/picture")["default"];
-    IEpPlus: typeof import("~icons/ep/plus")["default"];
-    IEpPosition: typeof import("~icons/ep/position")["default"];
-    IEpRefresh: typeof import("~icons/ep/refresh")["default"];
-    IEpRefreshLeft: typeof import("~icons/ep/refresh-left")["default"];
-    IEpSearch: typeof import("~icons/ep/search")["default"];
-    IEpSetting: typeof import("~icons/ep/setting")["default"];
-    IEpSortDown: typeof import("~icons/ep/sort-down")["default"];
-    IEpSortUp: typeof import("~icons/ep/sort-up")["default"];
-    IEpTop: typeof import("~icons/ep/top")["default"];
-    IEpUploadFilled: typeof import("~icons/ep/upload-filled")["default"];
-    Item: typeof import("./../layout/components/Sidebar/Item.vue")["default"];
-    LangSelect: typeof import("./../components/LangSelect/index.vue")["default"];
-    LeftMenu: typeof import("./../layout/components/Sidebar/LeftMenu.vue")["default"];
-    Link: typeof import("./../layout/components/Sidebar/Link.vue")["default"];
-    Logo: typeof import("./../layout/components/Sidebar/Logo.vue")["default"];
-    MultiUpload: typeof import("./../components/Upload/MultiUpload.vue")["default"];
-    NavBar: typeof import("./../layout/components/NavBar/index.vue")["default"];
-    NavRight: typeof import("./../layout/components/NavBar/NavRight.vue")["default"];
-    Pagination: typeof import("./../components/Pagination/index.vue")["default"];
-    PieChart: typeof import("./../views/dashboard/components/PieChart.vue")["default"];
-    RadarChart: typeof import("./../views/dashboard/components/RadarChart.vue")["default"];
-    RightPanel: typeof import("./../components/RightPanel/index.vue")["default"];
-    RouterLink: typeof import("vue-router")["RouterLink"];
-    RouterView: typeof import("vue-router")["RouterView"];
-    ScrollPane: typeof import("./../layout/components/TagsView/ScrollPane.vue")["default"];
-    Settings: typeof import("./../layout/components/Settings/index.vue")["default"];
-    Sidebar: typeof import("./../layout/components/Sidebar/index.vue")["default"];
-    SidebarItem: typeof import("./../layout/components/Sidebar/SidebarItem.vue")["default"];
-    SingleUpload: typeof import("./../components/Upload/SingleUpload.vue")["default"];
-    SizeSelect: typeof import("./../components/SizeSelect/index.vue")["default"];
-    SvgIcon: typeof import("./../components/SvgIcon/index.vue")["default"];
-    SwitchRoles: typeof import("./../views/demo/permission/components/SwitchRoles.vue")["default"];
-    TagInput: typeof import("./../components/TagInput/index.vue")["default"];
-    TagsView: typeof import("./../layout/components/TagsView/index.vue")["default"];
-    TopMenu: typeof import("./../layout/components/Sidebar/TopMenu.vue")["default"];
-    UnfixedThead: typeof import("./../views/demo/table/dynamic-table/components/UnfixedThead.vue")["default"];
-    WangEditor: typeof import("./../components/WangEditor/index.vue")["default"];
+    AppMain: typeof import('./../layout/components/AppMain.vue')['default']
+    BarChart: typeof import('./../views/dashboard/components/BarChart.vue')['default']
+    Breadcrumb: typeof import('./../components/Breadcrumb/index.vue')['default']
+    DeptTree: typeof import('./../views/system/user/components/dept-tree.vue')['default']
+    Dictionary: typeof import('./../components/Dictionary/index.vue')['default']
+    DictItem: typeof import('./../views/system/dict/components/dict-item.vue')['default']
+    ElAlert: typeof import('element-plus/es')['ElAlert']
+    ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb']
+    ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem']
+    ElButton: typeof import('element-plus/es')['ElButton']
+    ElCard: typeof import('element-plus/es')['ElCard']
+    ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
+    ElCheckboxGroup: typeof import('element-plus/es')['ElCheckboxGroup']
+    ElCol: typeof import('element-plus/es')['ElCol']
+    ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
+    ElDialog: typeof import('element-plus/es')['ElDialog']
+    ElDivider: typeof import('element-plus/es')['ElDivider']
+    ElDropdown: typeof import('element-plus/es')['ElDropdown']
+    ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
+    ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
+    ElForm: typeof import('element-plus/es')['ElForm']
+    ElFormItem: typeof import('element-plus/es')['ElFormItem']
+    ElIcon: typeof import('element-plus/es')['ElIcon']
+    ElImage: typeof import('element-plus/es')['ElImage']
+    ElInput: typeof import('element-plus/es')['ElInput']
+    ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
+    ElLink: typeof import('element-plus/es')['ElLink']
+    ElMenu: typeof import('element-plus/es')['ElMenu']
+    ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
+    ElOption: typeof import('element-plus/es')['ElOption']
+    ElPagination: typeof import('element-plus/es')['ElPagination']
+    ElPopover: typeof import('element-plus/es')['ElPopover']
+    ElRadio: typeof import('element-plus/es')['ElRadio']
+    ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
+    ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
+    ElRate: typeof import('element-plus/es')['ElRate']
+    ElRow: typeof import('element-plus/es')['ElRow']
+    ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
+    ElSelect: typeof import('element-plus/es')['ElSelect']
+    ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
+    ElSwitch: typeof import('element-plus/es')['ElSwitch']
+    ElTable: typeof import('element-plus/es')['ElTable']
+    ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
+    ElTabPane: typeof import('element-plus/es')['ElTabPane']
+    ElTabs: typeof import('element-plus/es')['ElTabs']
+    ElTag: typeof import('element-plus/es')['ElTag']
+    ElTooltip: typeof import('element-plus/es')['ElTooltip']
+    ElTree: typeof import('element-plus/es')['ElTree']
+    ElTreeSelect: typeof import('element-plus/es')['ElTreeSelect']
+    ElUpload: typeof import('element-plus/es')['ElUpload']
+    FixedThead: typeof import('./../views/demo/table/dynamic-table/components/FixedThead.vue')['default']
+    FunnelChart: typeof import('./../views/dashboard/components/FunnelChart.vue')['default']
+    GithubCorner: typeof import('./../components/GithubCorner/index.vue')['default']
+    Hamburger: typeof import('./../components/Hamburger/index.vue')['default']
+    IconSelect: typeof import('./../components/IconSelect/index.vue')['default']
+    IEpArrowDown: typeof import('~icons/ep/arrow-down')['default']
+    IEpCaretBottom: typeof import('~icons/ep/caret-bottom')['default']
+    IEpCaretTop: typeof import('~icons/ep/caret-top')['default']
+    IEpClose: typeof import('~icons/ep/close')['default']
+    IEpCollection: typeof import('~icons/ep/collection')['default']
+    IEpDelete: typeof import('~icons/ep/delete')['default']
+    IEpDownload: typeof import('~icons/ep/download')['default']
+    IEpEdit: typeof import('~icons/ep/edit')['default']
+    IEpPicture: typeof import('~icons/ep/picture')['default']
+    IEpPlus: typeof import('~icons/ep/plus')['default']
+    IEpPosition: typeof import('~icons/ep/position')['default']
+    IEpRefresh: typeof import('~icons/ep/refresh')['default']
+    IEpRefreshLeft: typeof import('~icons/ep/refresh-left')['default']
+    IEpSearch: typeof import('~icons/ep/search')['default']
+    IEpSetting: typeof import('~icons/ep/setting')['default']
+    IEpSortDown: typeof import('~icons/ep/sort-down')['default']
+    IEpSortUp: typeof import('~icons/ep/sort-up')['default']
+    IEpTop: typeof import('~icons/ep/top')['default']
+    IEpUploadFilled: typeof import('~icons/ep/upload-filled')['default']
+    Item: typeof import('./../layout/components/Sidebar/Item.vue')['default']
+    LangSelect: typeof import('./../components/LangSelect/index.vue')['default']
+    LeftMenu: typeof import('./../layout/components/Sidebar/LeftMenu.vue')['default']
+    Link: typeof import('./../layout/components/Sidebar/Link.vue')['default']
+    Logo: typeof import('./../layout/components/Sidebar/Logo.vue')['default']
+    MultiUpload: typeof import('./../components/Upload/MultiUpload.vue')['default']
+    NavBar: typeof import('./../layout/components/NavBar/index.vue')['default']
+    NavRight: typeof import('./../layout/components/NavBar/NavRight.vue')['default']
+    Pagination: typeof import('./../components/Pagination/index.vue')['default']
+    PieChart: typeof import('./../views/dashboard/components/PieChart.vue')['default']
+    RadarChart: typeof import('./../views/dashboard/components/RadarChart.vue')['default']
+    RightPanel: typeof import('./../components/RightPanel/index.vue')['default']
+    RouterLink: typeof import('vue-router')['RouterLink']
+    RouterView: typeof import('vue-router')['RouterView']
+    ScrollPane: typeof import('./../layout/components/TagsView/ScrollPane.vue')['default']
+    Settings: typeof import('./../layout/components/Settings/index.vue')['default']
+    Sidebar: typeof import('./../layout/components/Sidebar/index.vue')['default']
+    SidebarItem: typeof import('./../layout/components/Sidebar/SidebarItem.vue')['default']
+    SingleUpload: typeof import('./../components/Upload/SingleUpload.vue')['default']
+    SizeSelect: typeof import('./../components/SizeSelect/index.vue')['default']
+    SvgIcon: typeof import('./../components/SvgIcon/index.vue')['default']
+    SwitchRoles: typeof import('./../views/demo/permission/components/SwitchRoles.vue')['default']
+    TagInput: typeof import('./../components/TagInput/index.vue')['default']
+    TagsView: typeof import('./../layout/components/TagsView/index.vue')['default']
+    TopMenu: typeof import('./../layout/components/Sidebar/TopMenu.vue')['default']
+    UnfixedThead: typeof import('./../views/demo/table/dynamic-table/components/UnfixedThead.vue')['default']
+    WangEditor: typeof import('./../components/WangEditor/index.vue')['default']
   }
   export interface ComponentCustomProperties {
-    vLoading: typeof import("element-plus/es")["ElLoadingDirective"];
+    vLoading: typeof import('element-plus/es')['ElLoadingDirective']
   }
 }
diff --git a/src/typings/env.d.ts b/src/typings/env.d.ts
index f6231980..3dec1790 100644
--- a/src/typings/env.d.ts
+++ b/src/typings/env.d.ts
@@ -1,20 +1,20 @@
 /// <reference types="vite/client" />
 
-declare module "*.vue" {
-  import { DefineComponent } from "vue";
+declare module '*.vue' {
+  import { DefineComponent } from 'vue'
   // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
-  const component: DefineComponent<{}, {}, any>;
-  export default component;
+  const component: DefineComponent<{}, {}, any>
+  export default component
 }
 
 interface ImportMetaEnv {
   /** 应用端口 */
-  VITE_APP_PORT: string;
+  VITE_APP_PORT: string
   /** API 基础路径 */
-  VITE_APP_BASE_API: string;
-  VITE_APP_API_URL: string;
+  VITE_APP_BASE_API: string
+  VITE_APP_API_URL: string
 }
 
 interface ImportMeta {
-  readonly env: ImportMetaEnv;
+  readonly env: ImportMetaEnv
 }
diff --git a/src/typings/global.d.ts b/src/typings/global.d.ts
index c4bb3362..69301d22 100644
--- a/src/typings/global.d.ts
+++ b/src/typings/global.d.ts
@@ -3,8 +3,8 @@ declare global {
    * 分页查询参数
    */
   interface PageQuery {
-    pageNum: number;
-    pageSize: number;
+    pageNum: number
+    pageSize: number
   }
 
   /**
@@ -12,9 +12,9 @@ declare global {
    */
   interface PageResult<T> {
     /** 数据列表 */
-    list: T;
+    list: T
     /** 总数 */
-    total: number;
+    total: number
   }
 
   /**
@@ -22,21 +22,21 @@ declare global {
    */
   interface TagView {
     /** 页签名称 */
-    name: string;
+    name: string
     /** 页签标题 */
-    title: string;
+    title: string
     /** 页签路由路径 */
-    path: string;
+    path: string
     /** 页签路由完整路径 */
-    fullPath: string;
+    fullPath: string
     /** 页签图标 */
-    icon?: string;
+    icon?: string
     /** 是否固定页签 */
-    affix?: boolean;
+    affix?: boolean
     /** 是否开启缓存 */
-    keepAlive?: boolean;
+    keepAlive?: boolean
     /** 路由查询参数 */
-    query?: any;
+    query?: any
   }
 
   /**
@@ -44,34 +44,34 @@ declare global {
    */
   interface AppSettings {
     /** 系统标题 */
-    title: string;
+    title: string
     /** 系统版本 */
-    version: string;
+    version: string
     /** 是否显示设置 */
-    showSettings: boolean;
+    showSettings: boolean
     /** 是否固定头部 */
-    fixedHeader: boolean;
+    fixedHeader: boolean
     /** 是否显示多标签导航 */
-    tagsView: boolean;
+    tagsView: boolean
     /** 是否显示侧边栏Logo */
-    sidebarLogo: boolean;
+    sidebarLogo: boolean
     /** 导航栏布局(left|top|mix) */
-    layout: string;
+    layout: string
     /** 主题颜色 */
-    themeColor: string;
+    themeColor: string
     /** 主题模式(dark|light) */
-    theme: string;
+    theme: string
     /** 布局大小(default |large |small) */
-    size: string;
+    size: string
     /** 语言( zh-cn| en) */
-    language: string;
+    language: string
     /** 水印配置 */
     watermark: {
       /** 是否开启水印 */
-      enabled: boolean;
+      enabled: boolean
       /** 水印内容 */
-      content: string;
-    };
+      content: string
+    }
   }
 
   /**
@@ -79,11 +79,11 @@ declare global {
    */
   interface OptionType {
     /** 值 */
-    value: string | number;
+    value: string | number
     /** 文本 */
-    label: string;
+    label: string
     /** 子列表  */
-    children?: OptionType[];
+    children?: OptionType[]
   }
 }
-export {};
+export {}
diff --git a/src/typings/router.d.ts b/src/typings/router.d.ts
index 99e187bf..9a333e21 100644
--- a/src/typings/router.d.ts
+++ b/src/typings/router.d.ts
@@ -1,22 +1,22 @@
-import "vue-router";
+import 'vue-router'
 
-declare module "vue-router" {
+declare module 'vue-router' {
   // https://router.vuejs.org/zh/guide/advanced/meta.html#typescript
   // 可以通过扩展 RouteMeta 接口来输入 meta 字段
   interface RouteMeta {
     /** 菜单名称 */
-    title?: string;
+    title?: string
     /** 菜单图标  */
-    icon?: string;
+    icon?: string
     /** 菜单是否隐藏 */
-    hidden?: boolean;
+    hidden?: boolean
     /** 是否固定页签 */
-    affix?: boolean;
+    affix?: boolean
     /** 是否缓存页面 */
-    keepAlive?: boolean;
+    keepAlive?: boolean
     /** 是否在面包屑上隐藏 */
-    breadcrumb?: boolean;
+    breadcrumb?: boolean
     /** 拥有菜单权限的角色编码集合 */
-    roles?: string[];
+    roles?: string[]
   }
 }
diff --git a/src/typings/shims-vue.d.ts b/src/typings/shims-vue.d.ts
index abbc9312..1be3a223 100644
--- a/src/typings/shims-vue.d.ts
+++ b/src/typings/shims-vue.d.ts
@@ -1 +1 @@
-declare module "xlsx/xlsx.mjs";
+declare module 'xlsx/xlsx.mjs'
diff --git a/src/utils/_echarts.ts b/src/utils/_echarts.ts
new file mode 100644
index 00000000..b0c62bf1
--- /dev/null
+++ b/src/utils/_echarts.ts
@@ -0,0 +1,50 @@
+// 引入 echarts 核心模块，核心模块提供了 echarts 使用必须要的接口。
+import * as echarts from 'echarts/core'
+
+/** 引入柱状图 + 折线图 + 饼图，图表后缀都为 Chart，一般常用的就这三个，如果还需要其他的，就自行添加  */
+import {
+  BarChart,
+  LineChart,
+  PieChart,
+  RadarChart,
+  FunnelChart
+} from 'echarts/charts'
+
+// 引入提示框，标题，直角坐标系，数据集，内置数据转换器组件，组件后缀都为 Component
+import {
+  TitleComponent,
+  TooltipComponent,
+  GridComponent,
+  DatasetComponent,
+  TransformComponent,
+  ToolboxComponent,
+  LegendComponent
+} from 'echarts/components'
+
+// 标签自动布局，全局过渡动画等特性
+import { LabelLayout, UniversalTransition } from 'echarts/features'
+
+// 引入 Canvas 渲染器，注意引入 CanvasRenderer 或者 SVGRenderer 是必须的一步
+import { CanvasRenderer } from 'echarts/renderers'
+
+// 注册必须的组件
+echarts.use([
+  TitleComponent,
+  TooltipComponent,
+  GridComponent,
+  DatasetComponent,
+  TransformComponent,
+  ToolboxComponent,
+  LegendComponent,
+  LabelLayout,
+  UniversalTransition,
+  CanvasRenderer,
+  BarChart,
+  LineChart,
+  PieChart,
+  RadarChart,
+  FunnelChart
+])
+
+// 导出
+export default echarts
diff --git a/src/utils/i18n.ts b/src/utils/i18n.ts
index 17ed904a..23dea1eb 100644
--- a/src/utils/i18n.ts
+++ b/src/utils/i18n.ts
@@ -1,12 +1,12 @@
 // translate router.meta.title, be used in breadcrumb sidebar tagsview
-import i18n from "@/lang/index";
+import i18n from '@/lang/index'
 
 export function translateRouteTitle(title: any) {
   // 判断是否存在国际化配置，如果没有原生返回
-  const hasKey = i18n.global.te("route." + title);
+  const hasKey = i18n.global.te('route.' + title)
   if (hasKey) {
-    const translatedTitle = i18n.global.t("route." + title);
-    return translatedTitle;
+    const translatedTitle = i18n.global.t('route.' + title)
+    return translatedTitle
   }
-  return title;
+  return title
 }
diff --git a/src/utils/index.ts b/src/utils/index.ts
index 0d626608..491f540c 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -5,7 +5,7 @@
  * @returns {boolean}
  */
 export function hasClass(ele: HTMLElement, cls: string) {
-  return !!ele.className.match(new RegExp("(\\s|^)" + cls + "(\\s|$)"));
+  return !!ele.className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)'))
 }
 
 /**
@@ -14,7 +14,7 @@ export function hasClass(ele: HTMLElement, cls: string) {
  * @param {string} cls
  */
 export function addClass(ele: HTMLElement, cls: string) {
-  if (!hasClass(ele, cls)) ele.className += " " + cls;
+  if (!hasClass(ele, cls)) ele.className += ' ' + cls
 }
 
 /**
@@ -24,8 +24,8 @@ export function addClass(ele: HTMLElement, cls: string) {
  */
 export function removeClass(ele: HTMLElement, cls: string) {
   if (hasClass(ele, cls)) {
-    const reg = new RegExp("(\\s|^)" + cls + "(\\s|$)");
-    ele.className = ele.className.replace(reg, " ");
+    const reg = new RegExp('(\\s|^)' + cls + '(\\s|$)')
+    ele.className = ele.className.replace(reg, ' ')
   }
 }
 
@@ -34,6 +34,6 @@ export function removeClass(ele: HTMLElement, cls: string) {
  * @returns {Boolean}
  */
 export function isExternal(path: string) {
-  const isExternal = /^(https?:|http?:|mailto:|tel:)/.test(path);
-  return isExternal;
+  const isExternal = /^(https?:|http?:|mailto:|tel:)/.test(path)
+  return isExternal
 }
diff --git a/src/utils/request.ts b/src/utils/request.ts
index d5277513..078321ba 100644
--- a/src/utils/request.ts
+++ b/src/utils/request.ts
@@ -1,63 +1,63 @@
-import axios, { InternalAxiosRequestConfig, AxiosResponse } from "axios";
-import { useUserStoreHook } from "@/store/modules/user";
+import axios, { InternalAxiosRequestConfig, AxiosResponse } from 'axios'
+import { useUserStoreHook } from '@/store/modules/user'
 
 // 创建 axios 实例
 const service = axios.create({
   baseURL: import.meta.env.VITE_APP_BASE_API,
   timeout: 50000,
-  headers: { "Content-Type": "application/json;charset=utf-8" },
-});
+  headers: { 'Content-Type': 'application/json;charset=utf-8' }
+})
 
 // 请求拦截器
 service.interceptors.request.use(
   (config: InternalAxiosRequestConfig) => {
-    const userStore = useUserStoreHook();
+    const userStore = useUserStoreHook()
     if (userStore.token) {
-      config.headers.Authorization = userStore.token;
+      config.headers.Authorization = userStore.token
     }
-    return config;
+    return config
   },
   (error: any) => {
-    return Promise.reject(error);
+    return Promise.reject(error)
   }
-);
+)
 
 // 响应拦截器
 service.interceptors.response.use(
   (response: AxiosResponse) => {
-    const { code, msg } = response.data;
-    if (code === "00000") {
-      return response.data;
+    const { code, msg } = response.data
+    if (code === '00000') {
+      return response.data
     }
     // 响应数据为二进制流处理(Excel导出)
     if (response.data instanceof ArrayBuffer) {
-      return response;
+      return response
     }
 
-    ElMessage.error(msg || "系统出错");
-    return Promise.reject(new Error(msg || "Error"));
+    ElMessage.error(msg || '系统出错')
+    return Promise.reject(new Error(msg || 'Error'))
   },
   (error: any) => {
     if (error.response.data) {
-      const { code, msg } = error.response.data;
+      const { code, msg } = error.response.data
       // token 过期,重新登录
-      if (code === "A0230") {
-        ElMessageBox.confirm("当前页面已失效，请重新登录", "提示", {
-          confirmButtonText: "确定",
-          type: "warning",
+      if (code === 'A0230') {
+        ElMessageBox.confirm('当前页面已失效，请重新登录', '提示', {
+          confirmButtonText: '确定',
+          type: 'warning'
         }).then(() => {
-          const userStore = useUserStoreHook();
+          const userStore = useUserStoreHook()
           userStore.resetToken().then(() => {
-            location.reload();
-          });
-        });
+            location.reload()
+          })
+        })
       } else {
-        ElMessage.error(msg || "系统出错");
+        ElMessage.error(msg || '系统出错')
       }
     }
-    return Promise.reject(error.message);
+    return Promise.reject(error.message)
   }
-);
+)
 
 // 导出 axios 实例
-export default service;
+export default service
diff --git a/src/utils/scroll-to.ts b/src/utils/scroll-to.ts
index c4e48fc2..22999253 100644
--- a/src/utils/scroll-to.ts
+++ b/src/utils/scroll-to.ts
@@ -1,11 +1,11 @@
 const easeInOutQuad = (t: number, b: number, c: number, d: number) => {
-  t /= d / 2;
+  t /= d / 2
   if (t < 1) {
-    return (c / 2) * t * t + b;
+    return (c / 2) * t * t + b
   }
-  t--;
-  return (-c / 2) * (t * (t - 2) - 1) + b;
-};
+  t--
+  return (-c / 2) * (t * (t - 2) - 1) + b
+}
 
 // requestAnimationFrame for Smart Animating http://goo.gl/sx5sts
 const requestAnimFrame = (function () {
@@ -14,28 +14,28 @@ const requestAnimFrame = (function () {
     (window as any).webkitRequestAnimationFrame ||
     (window as any).mozRequestAnimationFrame ||
     function (callback) {
-      window.setTimeout(callback, 1000 / 60);
+      window.setTimeout(callback, 1000 / 60)
     }
-  );
-})();
+  )
+})()
 
 /**
  * Because it's so fucking difficult to detect the scrolling element, just move them all
  * @param {number} amount
  */
 const move = (amount: number) => {
-  document.documentElement.scrollTop = amount;
-  (document.body.parentNode as HTMLElement).scrollTop = amount;
-  document.body.scrollTop = amount;
-};
+  document.documentElement.scrollTop = amount
+  ;(document.body.parentNode as HTMLElement).scrollTop = amount
+  document.body.scrollTop = amount
+}
 
 const position = () => {
   return (
     document.documentElement.scrollTop ||
     (document.body.parentNode as HTMLElement).scrollTop ||
     document.body.scrollTop
-  );
-};
+  )
+}
 
 /**
  * @param {number} to
@@ -43,27 +43,27 @@ const position = () => {
  * @param {Function} callback
  */
 export const scrollTo = (to: number, duration: number, callback?: any) => {
-  const start = position();
-  const change = to - start;
-  const increment = 20;
-  let currentTime = 0;
-  duration = typeof duration === "undefined" ? 500 : duration;
+  const start = position()
+  const change = to - start
+  const increment = 20
+  let currentTime = 0
+  duration = typeof duration === 'undefined' ? 500 : duration
   const animateScroll = function () {
     // increment the time
-    currentTime += increment;
+    currentTime += increment
     // find the value with the quadratic in-out easing function
-    const val = easeInOutQuad(currentTime, start, change, duration);
+    const val = easeInOutQuad(currentTime, start, change, duration)
     // move the document.body
-    move(val);
+    move(val)
     // do the animation unless its over
     if (currentTime < duration) {
-      requestAnimFrame(animateScroll);
+      requestAnimFrame(animateScroll)
     } else {
-      if (callback && typeof callback === "function") {
+      if (callback && typeof callback === 'function') {
         // the animation is done so lets callback
-        callback();
+        callback()
       }
     }
-  };
-  animateScroll();
-};
+  }
+  animateScroll()
+}
diff --git a/src/views/dashboard/components/BarChart.vue b/src/views/dashboard/components/BarChart.vue
index dc089b1c..6f1e588e 100644
--- a/src/views/dashboard/components/BarChart.vue
+++ b/src/views/dashboard/components/BarChart.vue
@@ -15,168 +15,169 @@
 </template>
 
 <script setup lang="ts">
-import * as echarts from "echarts";
+// import * as echarts from 'echarts'
+import echarts from '@/utils/_echarts'
 
 const props = defineProps({
   id: {
     type: String,
-    default: "barChart",
+    default: 'barChart'
   },
   className: {
     type: String,
-    default: "",
+    default: ''
   },
   width: {
     type: String,
-    default: "200px",
-    required: true,
+    default: '200px',
+    required: true
   },
   height: {
     type: String,
-    default: "200px",
-    required: true,
-  },
-});
+    default: '200px',
+    required: true
+  }
+})
 
 const options = {
   grid: {
-    left: "2%",
-    right: "2%",
-    bottom: "10%",
-    containLabel: true,
+    left: '2%',
+    right: '2%',
+    bottom: '10%',
+    containLabel: true
   },
   tooltip: {
-    trigger: "axis",
+    trigger: 'axis',
     axisPointer: {
-      type: "cross",
+      type: 'cross',
       crossStyle: {
-        color: "#999",
-      },
-    },
+        color: '#999'
+      }
+    }
   },
   legend: {
-    x: "center",
-    y: "bottom",
-    data: ["收入", "毛利润", "收入增长率", "利润增长率"],
+    x: 'center',
+    y: 'bottom',
+    data: ['收入', '毛利润', '收入增长率', '利润增长率'],
     textStyle: {
-      color: "#999",
-    },
+      color: '#999'
+    }
   },
   xAxis: [
     {
-      type: "category",
-      data: ["浙江", "北京", "上海", "广东", "深圳"],
+      type: 'category',
+      data: ['浙江', '北京', '上海', '广东', '深圳'],
       axisPointer: {
-        type: "shadow",
-      },
-    },
+        type: 'shadow'
+      }
+    }
   ],
   yAxis: [
     {
-      type: "value",
+      type: 'value',
       min: 0,
       max: 10000,
       interval: 2000,
       axisLabel: {
-        formatter: "{value} ",
-      },
+        formatter: '{value} '
+      }
     },
     {
-      type: "value",
+      type: 'value',
       min: 0,
       max: 100,
       interval: 20,
       axisLabel: {
-        formatter: "{value}%",
-      },
-    },
+        formatter: '{value}%'
+      }
+    }
   ],
   series: [
     {
-      name: "收入",
-      type: "bar",
+      name: '收入',
+      type: 'bar',
       data: [7000, 7100, 7200, 7300, 7400],
       barWidth: 20,
       itemStyle: {
         color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-          { offset: 0, color: "#83bff6" },
-          { offset: 0.5, color: "#188df0" },
-          { offset: 1, color: "#188df0" },
-        ]),
-      },
+          { offset: 0, color: '#83bff6' },
+          { offset: 0.5, color: '#188df0' },
+          { offset: 1, color: '#188df0' }
+        ])
+      }
     },
     {
-      name: "毛利润",
-      type: "bar",
+      name: '毛利润',
+      type: 'bar',
       data: [8000, 8200, 8400, 8600, 8800],
       barWidth: 20,
       itemStyle: {
         color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-          { offset: 0, color: "#25d73c" },
-          { offset: 0.5, color: "#1bc23d" },
-          { offset: 1, color: "#179e61" },
-        ]),
-      },
+          { offset: 0, color: '#25d73c' },
+          { offset: 0.5, color: '#1bc23d' },
+          { offset: 1, color: '#179e61' }
+        ])
+      }
     },
     {
-      name: "收入增长率",
-      type: "line",
+      name: '收入增长率',
+      type: 'line',
       yAxisIndex: 1,
       data: [60, 65, 70, 75, 80],
       itemStyle: {
-        color: "#67C23A",
-      },
+        color: '#67C23A'
+      }
     },
     {
-      name: "利润增长率",
-      type: "line",
+      name: '利润增长率',
+      type: 'line',
       yAxisIndex: 1,
       data: [70, 75, 80, 85, 90],
       itemStyle: {
-        color: "#409EFF",
-      },
-    },
-  ],
-};
-const chart = ref<any>("");
+        color: '#409EFF'
+      }
+    }
+  ]
+}
+const chart = ref<any>('')
 onMounted(() => {
   // 图表初始化
   chart.value = markRaw(
     echarts.init(document.getElementById(props.id) as HTMLDivElement)
-  );
+  )
 
-  chart.value.setOption(options);
+  chart.value.setOption(options)
 
   // 大小自适应
-  window.addEventListener("resize", () => {
-    chart.value.resize();
-  });
-});
+  window.addEventListener('resize', () => {
+    chart.value.resize()
+  })
+})
 const downloadEchart = () => {
   // 获取画布图表地址信息
-  const img = new Image();
+  const img = new Image()
   img.src = chart.value.getDataURL({
-    type: "png",
+    type: 'png',
     pixelRatio: 1,
-    backgroundColor: "#fff",
-  });
+    backgroundColor: '#fff'
+  })
   // 当图片加载完成后，生成 URL 并下载
   img.onload = () => {
-    const canvas = document.createElement("canvas");
-    canvas.width = img.width;
-    canvas.height = img.height;
-    const ctx = canvas.getContext("2d");
+    const canvas = document.createElement('canvas')
+    canvas.width = img.width
+    canvas.height = img.height
+    const ctx = canvas.getContext('2d')
     if (ctx) {
-      ctx.drawImage(img, 0, 0, img.width, img.height);
-      const link = document.createElement("a");
-      link.download = `业绩柱状图.png`;
-      link.href = canvas.toDataURL("image/png", 0.9);
-      document.body.appendChild(link);
-      link.click();
-      link.remove();
+      ctx.drawImage(img, 0, 0, img.width, img.height)
+      const link = document.createElement('a')
+      link.download = `业绩柱状图.png`
+      link.href = canvas.toDataURL('image/png', 0.9)
+      document.body.appendChild(link)
+      link.click()
+      link.remove()
     }
-  };
-};
+  }
+}
 </script>
 <style lang="scss" scoped>
 .title {
diff --git a/src/views/dashboard/components/FunnelChart.vue b/src/views/dashboard/components/FunnelChart.vue
index 30fedb97..3f247b17 100644
--- a/src/views/dashboard/components/FunnelChart.vue
+++ b/src/views/dashboard/components/FunnelChart.vue
@@ -4,103 +4,104 @@
 </template>
 
 <script setup lang="ts">
-import * as echarts from "echarts";
+// import * as echarts from 'echarts'
+import echarts from '@/utils/_echarts'
 
 const props = defineProps({
   id: {
     type: String,
-    default: "funnelChart",
+    default: 'funnelChart'
   },
   className: {
     type: String,
-    default: "",
+    default: ''
   },
   width: {
     type: String,
-    default: "200px",
-    required: true,
+    default: '200px',
+    required: true
   },
   height: {
     type: String,
-    default: "200px",
-    required: true,
-  },
-});
+    default: '200px',
+    required: true
+  }
+})
 
 const options = {
   title: {
     show: true,
-    text: "订单线索转化漏斗图",
-    x: "center",
+    text: '订单线索转化漏斗图',
+    x: 'center',
     padding: 15,
     textStyle: {
       fontSize: 18,
-      fontStyle: "normal",
-      fontWeight: "bold",
-      color: "#337ecc",
-    },
+      fontStyle: 'normal',
+      fontWeight: 'bold',
+      color: '#337ecc'
+    }
   },
   grid: {
-    left: "2%",
-    right: "2%",
-    bottom: "10%",
-    containLabel: true,
+    left: '2%',
+    right: '2%',
+    bottom: '10%',
+    containLabel: true
   },
   legend: {
-    x: "center",
-    y: "bottom",
-    data: ["Show", "Click", "Visit", "Inquiry", "Order"],
+    x: 'center',
+    y: 'bottom',
+    data: ['Show', 'Click', 'Visit', 'Inquiry', 'Order']
   },
 
   series: [
     {
-      name: "Funnel",
-      type: "funnel",
-      left: "20%",
+      name: 'Funnel',
+      type: 'funnel',
+      left: '20%',
       top: 60,
       bottom: 60,
-      width: "60%",
-      sort: "descending",
+      width: '60%',
+      sort: 'descending',
       gap: 2,
       label: {
         show: true,
-        position: "inside",
+        position: 'inside'
       },
       labelLine: {
         length: 10,
         lineStyle: {
           width: 1,
-          type: "solid",
-        },
+          type: 'solid'
+        }
       },
       itemStyle: {
-        borderColor: "#fff",
-        borderWidth: 1,
+        borderColor: '#fff',
+        borderWidth: 1
       },
       emphasis: {
         label: {
-          fontSize: 20,
-        },
+          fontSize: 20
+        }
       },
       data: [
-        { value: 60, name: "Visit" },
-        { value: 40, name: "Inquiry" },
-        { value: 20, name: "Order" },
-        { value: 80, name: "Click" },
-        { value: 100, name: "Show" },
-      ],
-    },
-  ],
-};
+        { value: 60, name: 'Visit' },
+        { value: 40, name: 'Inquiry' },
+        { value: 20, name: 'Order' },
+        { value: 80, name: 'Click' },
+        { value: 100, name: 'Show' }
+      ]
+    }
+  ]
+}
 
 onMounted(() => {
   const chart = echarts.init(
     document.getElementById(props.id) as HTMLDivElement
-  );
-  chart.setOption(options);
+  )
+  chart.setOption(options)
 
-  window.addEventListener("resize", () => {
-    chart.resize();
-  });
-});
+  window.addEventListener('resize', () => {
+    chart.resize()
+  })
+})
 </script>
diff --git a/src/views/dashboard/components/PieChart.vue b/src/views/dashboard/components/PieChart.vue
index e8dd6702..c13939b6 100644
--- a/src/views/dashboard/components/PieChart.vue
+++ b/src/views/dashboard/components/PieChart.vue
@@ -7,73 +7,74 @@
 </template>
 
 <script setup lang="ts">
-import * as echarts from "echarts";
+// import * as echarts from 'echarts'
+import echarts from '@/utils/_echarts'
 
 const props = defineProps({
   id: {
     type: String,
-    default: "pieChart",
+    default: 'pieChart'
   },
   className: {
     type: String,
-    default: "",
+    default: ''
   },
   width: {
     type: String,
-    default: "200px",
-    required: true,
+    default: '200px',
+    required: true
   },
   height: {
     type: String,
-    default: "200px",
-    required: true,
-  },
-});
+    default: '200px',
+    required: true
+  }
+})
 const options = {
   grid: {
-    left: "2%",
-    right: "2%",
-    bottom: "10%",
-    containLabel: true,
+    left: '2%',
+    right: '2%',
+    bottom: '10%',
+    containLabel: true
   },
   legend: {
-    top: "bottom",
+    top: 'bottom',
     textStyle: {
-      color: "#999",
-    },
+      color: '#999'
+    }
   },
   series: [
     {
-      name: "Nightingale Chart",
-      type: "pie",
+      name: 'Nightingale Chart',
+      type: 'pie',
       radius: [50, 130],
-      center: ["50%", "50%"],
-      roseType: "area",
+      center: ['50%', '50%'],
+      roseType: 'area',
       itemStyle: {
         borderRadius: 1,
         color: function (params: any) {
           //自定义颜色
-          const colorList = ["#409EFF", "#67C23A", "#E6A23C", "#F56C6C"];
-          return colorList[params.dataIndex];
-        },
+          const colorList = ['#409EFF', '#67C23A', '#E6A23C', '#F56C6C']
+          return colorList[params.dataIndex]
+        }
       },
       data: [
-        { value: 26, name: "家用电器" },
-        { value: 27, name: "户外运动" },
-        { value: 24, name: "汽车用品" },
-        { value: 23, name: "手机数码" },
-      ],
-    },
-  ],
-};
+        { value: 26, name: '家用电器' },
+        { value: 27, name: '户外运动' },
+        { value: 24, name: '汽车用品' },
+        { value: 23, name: '手机数码' }
+      ]
+    }
+  ]
+}
 
 onMounted(() => {
   const chart = echarts.init(
     document.getElementById(props.id) as HTMLDivElement
-  );
-  chart.setOption(options);
-  window.addEventListener("resize", () => {
-    chart.resize();
-  });
-});
+  )
+  chart.setOption(options)
+  window.addEventListener('resize', () => {
+    chart.resize()
+  })
+})
 </script>
diff --git a/src/views/dashboard/components/RadarChart.vue b/src/views/dashboard/components/RadarChart.vue
index 2081bf24..fc16f7b4 100644
--- a/src/views/dashboard/components/RadarChart.vue
+++ b/src/views/dashboard/components/RadarChart.vue
@@ -7,94 +7,95 @@
 </template>
 
 <script setup lang="ts">
-import * as echarts from "echarts";
+// import * as echarts from 'echarts'
+import echarts from '@/utils/_echarts'
 
 const props = defineProps({
   id: {
     type: String,
-    default: "radarChart",
+    default: 'radarChart'
   },
   className: {
     type: String,
-    default: "",
+    default: ''
   },
   width: {
     type: String,
-    default: "200px",
-    required: true,
+    default: '200px',
+    required: true
   },
   height: {
     type: String,
-    default: "200px",
-    required: true,
-  },
-});
+    default: '200px',
+    required: true
+  }
+})
 
 const options = {
   grid: {
-    left: "2%",
-    right: "2%",
-    bottom: "10%",
-    containLabel: true,
+    left: '2%',
+    right: '2%',
+    bottom: '10%',
+    containLabel: true
   },
   legend: {
-    x: "center",
-    y: "bottom",
-    data: ["预定数量", "下单数量", "发货数量"],
+    x: 'center',
+    y: 'bottom',
+    data: ['预定数量', '下单数量', '发货数量'],
     textStyle: {
-      color: "#999",
-    },
+      color: '#999'
+    }
   },
   radar: {
     // shape: 'circle',
-    radius: "60%",
+    radius: '60%',
     indicator: [
-      { name: "家用电器" },
-      { name: "服装箱包" },
-      { name: "运动户外" },
-      { name: "手机数码" },
-      { name: "汽车用品" },
-      { name: "家具厨具" },
-    ],
+      { name: '家用电器' },
+      { name: '服装箱包' },
+      { name: '运动户外' },
+      { name: '手机数码' },
+      { name: '汽车用品' },
+      { name: '家具厨具' }
+    ]
   },
   series: [
     {
-      name: "Budget vs spending",
-      type: "radar",
+      name: 'Budget vs spending',
+      type: 'radar',
       itemStyle: {
         borderRadius: 6,
         color: function (params: any) {
           //自定义颜色
-          const colorList = ["#409EFF", "#67C23A", "#E6A23C", "#F56C6C"];
-          return colorList[params.dataIndex];
-        },
+          const colorList = ['#409EFF', '#67C23A', '#E6A23C', '#F56C6C']
+          return colorList[params.dataIndex]
+        }
       },
       data: [
         {
           value: [400, 400, 400, 400, 400, 400],
-          name: "预定数量",
+          name: '预定数量'
         },
         {
           value: [300, 300, 300, 300, 300, 300],
-          name: "下单数量",
+          name: '下单数量'
         },
         {
           value: [200, 200, 200, 200, 200, 200],
-          name: "发货数量",
-        },
-      ],
-    },
-  ],
-};
+          name: '发货数量'
+        }
+      ]
+    }
+  ]
+}
 
 onMounted(() => {
   const chart = echarts.init(
     document.getElementById(props.id) as HTMLDivElement
-  );
-  chart.setOption(options);
+  )
+  chart.setOption(options)
 
-  window.addEventListener("resize", () => {
-    chart.resize();
-  });
-});
+  window.addEventListener('resize', () => {
+    chart.resize()
+  })
+})
 </script>
diff --git a/src/views/dashboard/index.vue b/src/views/dashboard/index.vue
index fbb43625..476abc63 100644
--- a/src/views/dashboard/index.vue
+++ b/src/views/dashboard/index.vue
@@ -1,63 +1,63 @@
 <script setup lang="ts">
 defineOptions({
-  name: "Dashboard",
-  inheritAttrs: false,
-});
+  name: 'Dashboard',
+  inheritAttrs: false
+})
 
-import { useUserStore } from "@/store/modules/user";
-import { useTransition, TransitionPresets } from "@vueuse/core";
+import { useUserStore } from '@/store/modules/user'
+import { useTransition, TransitionPresets } from '@vueuse/core'
 
-const userStore = useUserStore();
-const date: Date = new Date();
+const userStore = useUserStore()
+const date: Date = new Date()
 
 const greetings = computed(() => {
-  const hours = date.getHours();
+  const hours = date.getHours()
   if (hours >= 6 && hours < 8) {
-    return "晨起披衣出草堂，轩窗已自喜微凉🌅！";
+    return '晨起披衣出草堂，轩窗已自喜微凉🌅！'
   } else if (hours >= 8 && hours < 12) {
-    return "上午好，" + useUserStore().user.nickname + "！";
+    return '上午好，' + useUserStore().user.nickname + '！'
   } else if (hours >= 12 && hours < 18) {
-    return "下午好，" + useUserStore().user.nickname + "！";
+    return '下午好，' + useUserStore().user.nickname + '！'
   } else if (hours >= 18 && hours < 24) {
-    return "晚上好，" + useUserStore().user.nickname + "！";
+    return '晚上好，' + useUserStore().user.nickname + '！'
   } else if (hours >= 0 && hours < 6) {
-    return "偷偷向银河要了一把碎星，只等你闭上眼睛撒入你的梦中，晚安🌛！";
+    return '偷偷向银河要了一把碎星，只等你闭上眼睛撒入你的梦中，晚安🌛！'
   }
-});
+})
 
-const duration = 5000;
+const duration = 5000
 
 // 销售额
-const amount = ref(0);
+const amount = ref(0)
 const amountOutput = useTransition(amount, {
   duration: duration,
-  transition: TransitionPresets.easeOutExpo,
-});
-amount.value = 2000;
+  transition: TransitionPresets.easeOutExpo
+})
+amount.value = 2000
 
 // 访客数
-const visitCount = ref(0);
+const visitCount = ref(0)
 const visitCountOutput = useTransition(visitCount, {
   duration: duration,
-  transition: TransitionPresets.easeOutExpo,
-});
-visitCount.value = 2000;
+  transition: TransitionPresets.easeOutExpo
+})
+visitCount.value = 2000
 
 // IP数
-const dauCount = ref(0);
+const dauCount = ref(0)
 const dauCountOutput = useTransition(dauCount, {
   duration: duration,
-  transition: TransitionPresets.easeOutExpo,
-});
-dauCount.value = 2000;
+  transition: TransitionPresets.easeOutExpo
+})
+dauCount.value = 2000
 
 // 订单量
-const orderCount = ref(0);
+const orderCount = ref(0)
 const orderCountOutput = useTransition(orderCount, {
   duration: duration,
-  transition: TransitionPresets.easeOutExpo,
-});
-orderCount.value = 2000;
+  transition: TransitionPresets.easeOutExpo
+})
+orderCount.value = 2000
 </script>
 
 <template>
diff --git a/src/views/demo/dict.vue b/src/views/demo/dict.vue
index fcb6e060..7d7bc990 100644
--- a/src/views/demo/dict.vue
+++ b/src/views/demo/dict.vue
@@ -1,7 +1,7 @@
 <!-- 字典组件示例 -->
 <script setup lang="ts">
-const stringValue = ref("1"); // 性别(值为String)
-const numberValue = ref(1); // 性别(值为Number)
+const stringValue = ref('1') // 性别(值为String)
+const numberValue = ref(1) // 性别(值为Number)
 </script>
 
 <template>
diff --git a/src/views/demo/icon-selector.vue b/src/views/demo/icon-selector.vue
index 6a419e2f..540bfc55 100644
--- a/src/views/demo/icon-selector.vue
+++ b/src/views/demo/icon-selector.vue
@@ -1,6 +1,6 @@
 <!-- 图标选择器示例 -->
 <script setup lang="ts">
-const iconName = ref("edit");
+const iconName = ref('edit')
 </script>
 
 <template>
diff --git a/src/views/demo/icons.vue b/src/views/demo/icons.vue
index 5fd397fe..3f073153 100644
--- a/src/views/demo/icons.vue
+++ b/src/views/demo/icons.vue
@@ -48,76 +48,76 @@
 </template>
 
 <script setup lang="ts">
-import SvgIcon from "@/components/SvgIcon/index.vue";
-import * as ElementPlusIconsVue from "@element-plus/icons-vue";
+import SvgIcon from '@/components/SvgIcon/index.vue'
+import * as ElementPlusIconsVue from '@element-plus/icons-vue'
 
 defineOptions({
   // eslint-disable-next-line
-  name: "Icons",
-  inheritAttrs: false,
-});
+  name: 'Icons',
+  inheritAttrs: false
+})
 const svg_icons: string[] = [
-  "api",
-  "cascader",
-  "client",
-  "close",
-  "close_all",
-  "close_left",
-  "close_other",
-  "close_right",
-  "dict",
-  "document",
-  "download",
-  "drag",
-  "edit",
-  "exit-fullscreen",
-  "eye-open",
-  "eye",
-  "fullscreen",
-  "github",
-  "homepage",
-  "language",
-  "link",
-  "menu",
-  "message",
-  "money",
-  "monitor",
-  "order",
-  "password",
-  "peoples",
-  "perm",
-  "publish",
-  "role",
-  "security",
-  "size",
-  "skill",
-  "system",
-  "tree",
-  "user",
-  "uv",
-  "verify-code",
-];
-const icons = ref(ElementPlusIconsVue);
+  'api',
+  'cascader',
+  'client',
+  'close',
+  'close_all',
+  'close_left',
+  'close_other',
+  'close_right',
+  'dict',
+  'document',
+  'download',
+  'drag',
+  'edit',
+  'exit-fullscreen',
+  'eye-open',
+  'eye',
+  'fullscreen',
+  'github',
+  'homepage',
+  'language',
+  'link',
+  'menu',
+  'message',
+  'money',
+  'monitor',
+  'order',
+  'password',
+  'peoples',
+  'perm',
+  'publish',
+  'role',
+  'security',
+  'size',
+  'skill',
+  'system',
+  'tree',
+  'user',
+  'uv',
+  'verify-code'
+]
+const icons = ref(ElementPlusIconsVue)
 
-const { copy } = useClipboard();
+const { copy } = useClipboard()
 
 function generateIconCode(symbol: any) {
-  return `<svg-icon icon-class="${symbol}" />`;
+  return `<svg-icon icon-class="${symbol}" />`
 }
 
 function generateElementIconCode(symbol: any) {
-  return `<el-icon><${symbol} /></el-icon>`;
+  return `<el-icon><${symbol} /></el-icon>`
 }
 
 function handleClipboard(text: any, event: any) {
   // clipboard(text, event);
   copy(text)
     .then(() => {
-      ElMessage.success("Copy successfully");
+      ElMessage.success('Copy successfully')
     })
     .catch(() => {
-      ElMessage.warning("Copy failed");
-    });
+      ElMessage.warning('Copy failed')
+    })
 }
 </script>
 
diff --git a/src/views/demo/permission/components/SwitchRoles.vue b/src/views/demo/permission/components/SwitchRoles.vue
index a2b3c186..cb54b5fc 100644
--- a/src/views/demo/permission/components/SwitchRoles.vue
+++ b/src/views/demo/permission/components/SwitchRoles.vue
@@ -10,18 +10,18 @@
 </template>
 
 <script setup lang="ts">
-import { useUserStoreHook } from "@/store/modules/user";
-import { storeToRefs } from "pinia";
+import { useUserStoreHook } from '@/store/modules/user'
+import { storeToRefs } from 'pinia'
 
-const emit = defineEmits(["change"]);
-const store = storeToRefs(useUserStoreHook());
-const { roles } = store.user.value;
+const emit = defineEmits(['change'])
+const store = storeToRefs(useUserStoreHook())
+const { roles } = store.user.value
 
 const switchRoles = computed({
   get: () => roles[0],
   set: (val) => {
-    Object.assign(roles, [val]);
-    emit("change");
-  },
-});
+    Object.assign(roles, [val])
+    emit('change')
+  }
+})
 </script>
diff --git a/src/views/demo/permission/page.vue b/src/views/demo/permission/page.vue
index 38901295..fd2d0b23 100644
--- a/src/views/demo/permission/page.vue
+++ b/src/views/demo/permission/page.vue
@@ -5,17 +5,17 @@
 </template>
 
 <script setup lang="ts">
-import router from "@/router";
-import SwitchRoles from "./components/SwitchRoles.vue";
+import router from '@/router'
+import SwitchRoles from './components/SwitchRoles.vue'
 
 defineOptions({
   // eslint-disable-next-line
-  name: "PagePermission",
-  inheritAttrs: false,
-});
+  name: 'PagePermission',
+  inheritAttrs: false
+})
 
 function handleRolesChange() {
-  console.log("roles changed");
-  router.push({ path: "/permission/page?" + new Date() });
+  console.log('roles changed')
+  router.push({ path: '/permission/page?' + new Date() })
 }
 </script>
diff --git a/src/views/demo/signature.vue b/src/views/demo/signature.vue
index c63fc444..8d1d4dfc 100644
--- a/src/views/demo/signature.vue
+++ b/src/views/demo/signature.vue
@@ -1,120 +1,120 @@
 <script setup lang="ts">
-import { uploadFileApi } from "@/api/file";
+import { uploadFileApi } from '@/api/file'
 
-const imgUrl = ref("");
-const canvas = ref();
-let ctx: CanvasRenderingContext2D;
+const imgUrl = ref('')
+const canvas = ref()
+let ctx: CanvasRenderingContext2D
 
 // 正在绘制中，用来控制 move 和 end 事件
-let painting = false;
+let painting = false
 
 // 获取触发点相对被触发dom的左、上角距离
 const getOffset = (event: MouseEvent | TouchEvent) => {
-  let offset: [number, number];
+  let offset: [number, number]
   if ((event as MouseEvent).offsetX) {
     // pc端
-    const { offsetX, offsetY } = event as MouseEvent;
-    offset = [offsetX, offsetY];
+    const { offsetX, offsetY } = event as MouseEvent
+    offset = [offsetX, offsetY]
   } else {
     // 移动端
-    const { top, left } = canvas.value.getBoundingClientRect();
-    const offsetX = (event as TouchEvent).touches[0].clientX - left;
-    const offsetY = (event as TouchEvent).touches[0].clientY - top;
-    offset = [offsetX, offsetY];
+    const { top, left } = canvas.value.getBoundingClientRect()
+    const offsetX = (event as TouchEvent).touches[0].clientX - left
+    const offsetY = (event as TouchEvent).touches[0].clientY - top
+    offset = [offsetX, offsetY]
   }
 
-  return offset;
-};
+  return offset
+}
 
 // 绘制起点
 let startX = 0,
-  startY = 0;
+  startY = 0
 
 // 鼠标/触摸 按下时，保存 触发点相对被触发dom的左、上 距离
 const onEventStart = (event: MouseEvent | TouchEvent) => {
-  [startX, startY] = getOffset(event);
-  painting = true;
-};
+  ;[startX, startY] = getOffset(event)
+  painting = true
+}
 
 const onEventMove = (event: MouseEvent | TouchEvent) => {
   if (painting) {
     // 鼠标/触摸 移动时，保存 移动点相对 被触发dom的左、上 距离
-    const [endX, endY] = getOffset(event);
-    paint(startX, startY, endX, endY, ctx);
+    const [endX, endY] = getOffset(event)
+    paint(startX, startY, endX, endY, ctx)
 
     // 每次绘制 或 清除结束后，起点要重置为上次的终点
-    startX = endX;
-    startY = endY;
+    startX = endX
+    startY = endY
   }
-};
+}
 
 const onEventEnd = () => {
   if (painting) {
-    painting = false; // 停止绘制
+    painting = false // 停止绘制
   }
-};
+}
 
 onMounted(() => {
-  ctx = canvas.value.getContext("2d") as CanvasRenderingContext2D;
-});
+  ctx = canvas.value.getContext('2d') as CanvasRenderingContext2D
+})
 const handleToFile = async () => {
   if (isCanvasBlank(canvas.value)) {
     ElMessage({
-      type: "warning",
-      message: "当前签名文件为空",
-    });
-    return;
+      type: 'warning',
+      message: '当前签名文件为空'
+    })
+    return
   }
-  const file = dataURLtoFile(canvas.value.toDataURL(), "签名.png");
+  const file = dataURLtoFile(canvas.value.toDataURL(), '签名.png')
 
-  if (!file) return;
-  const { data } = await uploadFileApi(file);
-  handleClearSign();
-  imgUrl.value = data.url;
-};
+  if (!file) return
+  const { data } = await uploadFileApi(file)
+  handleClearSign()
+  imgUrl.value = data.url
+}
 const handleClearSign = () => {
-  ctx.clearRect(0, 0, canvas.value.width, canvas.value.height);
-};
+  ctx.clearRect(0, 0, canvas.value.width, canvas.value.height)
+}
 const isCanvasBlank = (canvas: HTMLCanvasElement) => {
-  const blank = document.createElement("canvas"); //系统获取一个空canvas对象
-  blank.width = canvas.width;
-  blank.height = canvas.height;
-  return canvas.toDataURL() == blank.toDataURL(); //比较值相等则为空
-};
+  const blank = document.createElement('canvas') //系统获取一个空canvas对象
+  blank.width = canvas.width
+  blank.height = canvas.height
+  return canvas.toDataURL() == blank.toDataURL() //比较值相等则为空
+}
 
 // 保存为图片
 const handleSaveImg = () => {
   if (isCanvasBlank(canvas.value)) {
     ElMessage({
-      type: "warning",
-      message: "当前签名文件为空",
-    });
-    return;
+      type: 'warning',
+      message: '当前签名文件为空'
+    })
+    return
   }
-  const el = document.createElement("a");
+  const el = document.createElement('a')
   // 设置 href 为图片经过 base64 编码后的字符串，默认为 png 格式
-  el.href = canvas.value.toDataURL();
-  el.download = "签名";
+  el.href = canvas.value.toDataURL()
+  el.download = '签名'
   // 创建一个点击事件并对 a 标签进行触发
-  const event = new MouseEvent("click");
-  el.dispatchEvent(event);
-};
+  const event = new MouseEvent('click')
+  el.dispatchEvent(event)
+}
 // 转为file格式，可传递给后端
 const dataURLtoFile = (dataurl: string, filename: string) => {
-  const arr: string[] = dataurl.split(",");
-  if (!arr.length) return;
+  const arr: string[] = dataurl.split(',')
+  if (!arr.length) return
 
-  const mime = arr[0].match(/:(.*?);/);
+  const mime = arr[0].match(/:(.*?);/)
   if (mime) {
-    const bstr = atob(arr[1]);
-    let n = bstr.length;
-    const u8arr = new Uint8Array(n);
+    const bstr = atob(arr[1])
+    let n = bstr.length
+    const u8arr = new Uint8Array(n)
     while (n--) {
-      u8arr[n] = bstr.charCodeAt(n);
+      u8arr[n] = bstr.charCodeAt(n)
     }
-    return new File([u8arr], filename, { type: mime[1] });
+    return new File([u8arr], filename, { type: mime[1] })
   }
-};
+}
 // canvas 画图
 function paint(
   startX: number,
@@ -123,14 +123,14 @@ function paint(
   endY: number,
   ctx: CanvasRenderingContext2D
 ) {
-  ctx.beginPath();
-  ctx.globalAlpha = 1;
-  ctx.lineWidth = 2;
-  ctx.strokeStyle = "#000";
-  ctx.moveTo(startX, startY);
-  ctx.lineTo(endX, endY);
-  ctx.closePath();
-  ctx.stroke();
+  ctx.beginPath()
+  ctx.globalAlpha = 1
+  ctx.lineWidth = 2
+  ctx.strokeStyle = '#000'
+  ctx.moveTo(startX, startY)
+  ctx.lineTo(endX, endY)
+  ctx.closePath()
+  ctx.stroke()
 }
 </script>
 <template>
diff --git a/src/views/demo/table/Export2Excel.js b/src/views/demo/table/Export2Excel.js
index 6a14ff21..d006be75 100644
--- a/src/views/demo/table/Export2Excel.js
+++ b/src/views/demo/table/Export2Excel.js
@@ -1,47 +1,47 @@
 /* eslint-disable */
-import * as XLSX from "xlsx";
+import * as XLSX from 'xlsx'
 
 // TODO: this is a toy example, may be file-saver is a better choice
 // import { saveAs } from 'file-saver'
 function saveAs(blob, fileName) {
-  const type = fileName.split(".")[1];
-  console.log(type);
-  const file = new window.File([blob], fileName, { type: type });
-  console.log(file);
+  const type = fileName.split('.')[1]
+  console.log(type)
+  const file = new window.File([blob], fileName, { type: type })
+  console.log(file)
   // 创建一个指向 File 对象的 URL
-  const url = URL.createObjectURL(file);
+  const url = URL.createObjectURL(file)
 
   // 创建一个 a 标签
-  const a = document.createElement("a");
-  a.href = url;
-  a.download = fileName;
+  const a = document.createElement('a')
+  a.href = url
+  a.download = fileName
 
   // 将 a 标签添加到文档中
-  document.body.appendChild(a);
+  document.body.appendChild(a)
 
   // 模拟点击 a 标签，开始下载
-  a.click();
+  a.click()
 
   // 下载完成后，从文档中移除 a 标签，并释放 URL
-  document.body.removeChild(a);
-  URL.revokeObjectURL(url);
-  return file;
+  document.body.removeChild(a)
+  URL.revokeObjectURL(url)
+  return file
 }
 
 function generateArray(table) {
-  var out = [];
-  var rows = table.querySelectorAll("tr");
-  var ranges = [];
+  var out = []
+  var rows = table.querySelectorAll('tr')
+  var ranges = []
   for (var R = 0; R < rows.length; ++R) {
-    var outRow = [];
-    var row = rows[R];
-    var columns = row.querySelectorAll("td");
+    var outRow = []
+    var row = rows[R]
+    var columns = row.querySelectorAll('td')
     for (var C = 0; C < columns.length; ++C) {
-      var cell = columns[C];
-      var colspan = cell.getAttribute("colspan");
-      var rowspan = cell.getAttribute("rowspan");
-      var cellValue = cell.innerText;
-      if (cellValue !== "" && cellValue == +cellValue) cellValue = +cellValue;
+      var cell = columns[C]
+      var colspan = cell.getAttribute('colspan')
+      var rowspan = cell.getAttribute('rowspan')
+      var cellValue = cell.innerText
+      if (cellValue !== '' && cellValue == +cellValue) cellValue = +cellValue
 
       //Skip ranges
       ranges.forEach(function (range) {
@@ -51,130 +51,130 @@ function generateArray(table) {
           outRow.length >= range.s.c &&
           outRow.length <= range.e.c
         ) {
-          for (var i = 0; i <= range.e.c - range.s.c; ++i) outRow.push(null);
+          for (var i = 0; i <= range.e.c - range.s.c; ++i) outRow.push(null)
         }
-      });
+      })
 
       //Handle Row Span
       if (rowspan || colspan) {
-        rowspan = rowspan || 1;
-        colspan = colspan || 1;
+        rowspan = rowspan || 1
+        colspan = colspan || 1
         ranges.push({
           s: {
             r: R,
-            c: outRow.length,
+            c: outRow.length
           },
           e: {
             r: R + rowspan - 1,
-            c: outRow.length + colspan - 1,
-          },
-        });
+            c: outRow.length + colspan - 1
+          }
+        })
       }
 
       //Handle Value
-      outRow.push(cellValue !== "" ? cellValue : null);
+      outRow.push(cellValue !== '' ? cellValue : null)
 
       //Handle Colspan
-      if (colspan) for (var k = 0; k < colspan - 1; ++k) outRow.push(null);
+      if (colspan) for (var k = 0; k < colspan - 1; ++k) outRow.push(null)
     }
-    out.push(outRow);
+    out.push(outRow)
   }
-  return [out, ranges];
+  return [out, ranges]
 }
 
 function datenum(v, date1904) {
-  if (date1904) v += 1462;
-  var epoch = Date.parse(v);
-  return (epoch - new Date(Date.UTC(1899, 11, 30))) / (24 * 60 * 60 * 1000);
+  if (date1904) v += 1462
+  var epoch = Date.parse(v)
+  return (epoch - new Date(Date.UTC(1899, 11, 30))) / (24 * 60 * 60 * 1000)
 }
 
 function sheet_from_array_of_arrays(data, opts) {
-  var ws = {};
+  var ws = {}
   var range = {
     s: {
       c: 10000000,
-      r: 10000000,
+      r: 10000000
     },
     e: {
       c: 0,
-      r: 0,
-    },
-  };
+      r: 0
+    }
+  }
   for (var R = 0; R != data.length; ++R) {
     for (var C = 0; C != data[R].length; ++C) {
-      if (range.s.r > R) range.s.r = R;
-      if (range.s.c > C) range.s.c = C;
-      if (range.e.r < R) range.e.r = R;
-      if (range.e.c < C) range.e.c = C;
+      if (range.s.r > R) range.s.r = R
+      if (range.s.c > C) range.s.c = C
+      if (range.e.r < R) range.e.r = R
+      if (range.e.c < C) range.e.c = C
       var cell = {
-        v: data[R][C],
-      };
-      if (cell.v == null) continue;
+        v: data[R][C]
+      }
+      if (cell.v == null) continue
       var cell_ref = XLSX.utils.encode_cell({
         c: C,
-        r: R,
-      });
+        r: R
+      })
 
-      if (typeof cell.v === "number") cell.t = "n";
-      else if (typeof cell.v === "boolean") cell.t = "b";
+      if (typeof cell.v === 'number') cell.t = 'n'
+      else if (typeof cell.v === 'boolean') cell.t = 'b'
       else if (cell.v instanceof Date) {
-        cell.t = "n";
-        cell.z = XLSX.SSF._table[14];
-        cell.v = datenum(cell.v);
-      } else cell.t = "s";
+        cell.t = 'n'
+        cell.z = XLSX.SSF._table[14]
+        cell.v = datenum(cell.v)
+      } else cell.t = 's'
 
-      ws[cell_ref] = cell;
+      ws[cell_ref] = cell
     }
   }
-  if (range.s.c < 10000000) ws["!ref"] = XLSX.utils.encode_range(range);
-  return ws;
+  if (range.s.c < 10000000) ws['!ref'] = XLSX.utils.encode_range(range)
+  return ws
 }
 
 function Workbook() {
-  if (!(this instanceof Workbook)) return new Workbook();
-  this.SheetNames = [];
-  this.Sheets = {};
+  if (!(this instanceof Workbook)) return new Workbook()
+  this.SheetNames = []
+  this.Sheets = {}
 }
 
 function s2ab(s) {
-  var buf = new ArrayBuffer(s.length);
-  var view = new Uint8Array(buf);
-  for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xff;
-  return buf;
+  var buf = new ArrayBuffer(s.length)
+  var view = new Uint8Array(buf)
+  for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xff
+  return buf
 }
 
 export function export_table_to_excel(id) {
-  var theTable = document.getElementById(id);
-  var oo = generateArray(theTable);
-  var ranges = oo[1];
+  var theTable = document.getElementById(id)
+  var oo = generateArray(theTable)
+  var ranges = oo[1]
 
   /* original data */
-  var data = oo[0];
-  var ws_name = "SheetJS";
+  var data = oo[0]
+  var ws_name = 'SheetJS'
 
   var wb = new Workbook(),
-    ws = sheet_from_array_of_arrays(data);
+    ws = sheet_from_array_of_arrays(data)
 
   /* add ranges to worksheet */
   // ws['!cols'] = ['apple', 'banan'];
-  ws["!merges"] = ranges;
+  ws['!merges'] = ranges
 
   /* add worksheet to workbook */
-  wb.SheetNames.push(ws_name);
-  wb.Sheets[ws_name] = ws;
+  wb.SheetNames.push(ws_name)
+  wb.Sheets[ws_name] = ws
 
   var wbout = XLSX.write(wb, {
-    bookType: "xlsx",
+    bookType: 'xlsx',
     bookSST: false,
-    type: "binary",
-  });
+    type: 'binary'
+  })
 
   saveAs(
     new Blob([s2ab(wbout)], {
-      type: "application/octet-stream",
+      type: 'application/octet-stream'
     }),
-    "test.xlsx"
-  );
+    'test.xlsx'
+  )
 }
 
 export function export_json_to_excel({
@@ -184,26 +184,26 @@ export function export_json_to_excel({
   filename,
   merges = [],
   autoWidth = true,
-  bookType = "xlsx",
+  bookType = 'xlsx'
 } = {}) {
   /* original data */
-  filename = filename || "excel-list";
-  data = [...data];
-  data.unshift(header);
+  filename = filename || 'excel-list'
+  data = [...data]
+  data.unshift(header)
 
   for (let i = multiHeader.length - 1; i > -1; i--) {
-    data.unshift(multiHeader[i]);
+    data.unshift(multiHeader[i])
   }
 
-  var ws_name = "SheetJS";
+  var ws_name = 'SheetJS'
   var wb = new Workbook(),
-    ws = sheet_from_array_of_arrays(data);
+    ws = sheet_from_array_of_arrays(data)
 
   if (merges.length > 0) {
-    if (!ws["!merges"]) ws["!merges"] = [];
+    if (!ws['!merges']) ws['!merges'] = []
     merges.forEach((item) => {
-      ws["!merges"].push(XLSX.utils.decode_range(item));
-    });
+      ws['!merges'].push(XLSX.utils.decode_range(item))
+    })
   }
 
   if (autoWidth) {
@@ -213,45 +213,45 @@ export function export_json_to_excel({
         /*先判断是否为null/undefined*/
         if (val == null) {
           return {
-            wch: 10,
-          };
+            wch: 10
+          }
         } else if (val.toString().charCodeAt(0) > 255) {
           /*再判断是否为中文*/
           return {
-            wch: val.toString().length * 2,
-          };
+            wch: val.toString().length * 2
+          }
         } else {
           return {
-            wch: val.toString().length,
-          };
+            wch: val.toString().length
+          }
         }
       })
-    );
+    )
     /*以第一行为初始值*/
-    let result = colWidth[0];
+    let result = colWidth[0]
     for (let i = 1; i < colWidth.length; i++) {
       for (let j = 0; j < colWidth[i].length; j++) {
-        if (result[j]["wch"] < colWidth[i][j]["wch"]) {
-          result[j]["wch"] = colWidth[i][j]["wch"];
+        if (result[j]['wch'] < colWidth[i][j]['wch']) {
+          result[j]['wch'] = colWidth[i][j]['wch']
         }
       }
     }
-    ws["!cols"] = result;
+    ws['!cols'] = result
   }
 
   /* add worksheet to workbook */
-  wb.SheetNames.push(ws_name);
-  wb.Sheets[ws_name] = ws;
+  wb.SheetNames.push(ws_name)
+  wb.Sheets[ws_name] = ws
 
   var wbout = XLSX.write(wb, {
     bookType: bookType,
     bookSST: false,
-    type: "binary",
-  });
+    type: 'binary'
+  })
   saveAs(
     new Blob([s2ab(wbout)], {
-      type: "application/octet-stream",
+      type: 'application/octet-stream'
     }),
     `${filename}.${bookType}`
-  );
+  )
 }
diff --git a/src/views/demo/table/drag-table.vue b/src/views/demo/table/drag-table.vue
index c4c65f37..3f9287cb 100644
--- a/src/views/demo/table/drag-table.vue
+++ b/src/views/demo/table/drag-table.vue
@@ -76,78 +76,78 @@
 </template>
 
 <script setup lang="ts">
-import { default as Sortable, SortableEvent } from "sortablejs";
-import { fetchList } from "@/api/article";
+import { default as Sortable, SortableEvent } from 'sortablejs'
+import { fetchList } from '@/api/article'
 
 defineOptions({
   // eslint-disable-next-line
-  name: "DragTable",
-  inheritAttrs: false,
-});
+  name: 'DragTable',
+  inheritAttrs: false
+})
 
 interface List {
-  id: number;
-  timestamp: number;
-  title: string;
-  pageviews: number;
-  status: string;
+  id: number
+  timestamp: number
+  title: string
+  pageviews: number
+  status: string
 }
 
-const listLoading = ref<boolean>(true);
-const list: Ref = ref<List[]>([]);
-const oldList = ref<List[]>([]);
+const listLoading = ref<boolean>(true)
+const list: Ref = ref<List[]>([])
+const oldList = ref<List[]>([])
 
 const formatDate = (timestamp: any) => {
-  const date = new Date(timestamp);
+  const date = new Date(timestamp)
   return date
-    .toLocaleString("zh-CN", {
-      year: "numeric",
-      month: "2-digit",
-      day: "2-digit",
-      hour: "2-digit",
-      minute: "2-digit",
-      second: "2-digit",
-      hour12: false,
+    .toLocaleString('zh-CN', {
+      year: 'numeric',
+      month: '2-digit',
+      day: '2-digit',
+      hour: '2-digit',
+      minute: '2-digit',
+      second: '2-digit',
+      hour12: false
     })
-    .replace(/\//g, "-");
-};
+    .replace(/\//g, '-')
+}
 
 const statusType = (status: string): any => {
   const statusMap = {
-    published: "success",
-    draft: "info",
-    deleted: "danger",
-  };
-  return statusMap[status as keyof typeof statusMap];
-};
+    published: 'success',
+    draft: 'info',
+    deleted: 'danger'
+  }
+  return statusMap[status as keyof typeof statusMap]
+}
 
 // 行拖拽
 const rowDrag = function () {
   // 要拖拽元素的父容器
   const tbody = document.querySelector(
-    ".draggable .el-table__body-wrapper tbody"
-  );
-  if (!tbody) return;
+    '.draggable .el-table__body-wrapper tbody'
+  )
+  if (!tbody) return
   Sortable.create(tbody as HTMLElement, {
     //  可被拖拽的子元素
-    draggable: ".draggable .el-table__row",
+    draggable: '.draggable .el-table__row',
     onEnd(event: SortableEvent) {
       if (event.oldIndex !== undefined && event.newIndex !== undefined) {
-        const currRow = list.value.splice(event.oldIndex, 1)[0];
-        list.value.splice(event.newIndex, 0, currRow);
+        const currRow = list.value.splice(event.oldIndex, 1)[0]
+        list.value.splice(event.newIndex, 0, currRow)
       }
-    },
-  });
-};
+    }
+  })
+}
 
 onMounted(() => {
   fetchList({}).then((res) => {
-    listLoading.value = false;
-    list.value = res.data.items;
-    oldList.value = list.value.map((v: any) => v.id);
-    rowDrag();
-  });
-});
+    listLoading.value = false
+    list.value = res.data.items
+    oldList.value = list.value.map((v: any) => v.id)
+    rowDrag()
+  })
+})
 </script>
 
 <style>
diff --git a/src/views/demo/table/dynamic-table/components/FixedThead.vue b/src/views/demo/table/dynamic-table/components/FixedThead.vue
index 84ce9def..4b86ae67 100644
--- a/src/views/demo/table/dynamic-table/components/FixedThead.vue
+++ b/src/views/demo/table/dynamic-table/components/FixedThead.vue
@@ -27,29 +27,29 @@
 </template>
 
 <script setup lang="ts">
-const defaultFormThead = ["apple", "banana"];
+const defaultFormThead = ['apple', 'banana']
 const tableData = [
   {
-    name: "fruit-1",
-    apple: "apple-10",
-    banana: "banana-10",
-    orange: "orange-10",
+    name: 'fruit-1',
+    apple: 'apple-10',
+    banana: 'banana-10',
+    orange: 'orange-10'
   },
   {
-    name: "fruit-2",
-    apple: "apple-20",
-    banana: "banana-20",
-    orange: "orange-20",
-  },
-];
+    name: 'fruit-2',
+    apple: 'apple-20',
+    banana: 'banana-20',
+    orange: 'orange-20'
+  }
+]
 
-let key = 1; // table key
-const formTheadOptions = ["apple", "banana", "orange"];
-const checkboxVal = ref(defaultFormThead); // checkboxVal
-const formThead = ref(defaultFormThead); // 默认表头 Default header
+let key = 1 // table key
+const formTheadOptions = ['apple', 'banana', 'orange']
+const checkboxVal = ref(defaultFormThead) // checkboxVal
+const formThead = ref(defaultFormThead) // 默认表头 Default header
 
 watch(checkboxVal, (valArr) => {
-  formThead.value = formTheadOptions.filter((i) => valArr.indexOf(i) >= 0);
-  key = key + 1; // 为了保证table 每次都会重渲 In order to ensure the table will be re-rendered each time
-});
+  formThead.value = formTheadOptions.filter((i) => valArr.indexOf(i) >= 0)
+  key = key + 1 // 为了保证table 每次都会重渲 In order to ensure the table will be re-rendered each time
+})
 </script>
diff --git a/src/views/demo/table/dynamic-table/components/UnfixedThead.vue b/src/views/demo/table/dynamic-table/components/UnfixedThead.vue
index 8056267f..2aa3a288 100644
--- a/src/views/demo/table/dynamic-table/components/UnfixedThead.vue
+++ b/src/views/demo/table/dynamic-table/components/UnfixedThead.vue
@@ -26,20 +26,20 @@
 </template>
 
 <script setup lang="ts">
-const formThead = ref(["apple", "banana"]);
+const formThead = ref(['apple', 'banana'])
 
 const tableData = [
   {
-    name: "fruit-1",
-    apple: "apple-10",
-    banana: "banana-10",
-    orange: "orange-10",
+    name: 'fruit-1',
+    apple: 'apple-10',
+    banana: 'banana-10',
+    orange: 'orange-10'
   },
   {
-    name: "fruit-2",
-    apple: "apple-20",
-    banana: "banana-20",
-    orange: "orange-20",
-  },
-];
+    name: 'fruit-2',
+    apple: 'apple-20',
+    banana: 'banana-20',
+    orange: 'orange-20'
+  }
+]
 </script>
diff --git a/src/views/demo/table/dynamic-table/index.vue b/src/views/demo/table/dynamic-table/index.vue
index acabac11..07dc6e49 100644
--- a/src/views/demo/table/dynamic-table/index.vue
+++ b/src/views/demo/table/dynamic-table/index.vue
@@ -13,12 +13,12 @@
 </template>
 
 <script setup lang="ts">
-import FixedThead from "./components/FixedThead.vue";
-import UnfixedThead from "./components/UnfixedThead.vue";
+import FixedThead from './components/FixedThead.vue'
+import UnfixedThead from './components/UnfixedThead.vue'
 
 defineOptions({
   // eslint-disable-next-line
-  name: "DynamicTable",
-  inheritAttrs: false,
-});
+  name: 'DynamicTable',
+  inheritAttrs: false
+})
 </script>
diff --git a/src/views/demo/upload.vue b/src/views/demo/upload.vue
index 7c8051ac..ccf6400f 100644
--- a/src/views/demo/upload.vue
+++ b/src/views/demo/upload.vue
@@ -1,19 +1,19 @@
 <!-- 文件上传组件(单图+多图)示例 -->
 <script setup lang="ts">
-import SingleUpload from "@/components/Upload/SingleUpload.vue";
-import MultiUpload from "@/components/Upload/MultiUpload.vue";
+import SingleUpload from '@/components/Upload/SingleUpload.vue'
+import MultiUpload from '@/components/Upload/MultiUpload.vue'
 
 const singlePicUrl = ref(
-  "https://oss.youlai.tech/youlai-boot/2023/05/20/2b6d8b49fa1047348a0a41cef5aaf69e.gif"
-);
+  'https://oss.youlai.tech/youlai-boot/2023/05/20/2b6d8b49fa1047348a0a41cef5aaf69e.gif'
+)
 // 这里放外链图片，防止被删
 const multiPicUrls = ref([
-  "https://s2.loli.net/2023/05/24/yNsxFC8rLHMZQcK.jpg",
-  "https://s2.loli.net/2023/05/24/RuHFMwW4rG5lIqs.jpg",
-  "https://s2.loli.net/2023/05/24/ZPiGbcpR91WqInB.jpg",
-  "https://s2.loli.net/2023/05/24/e1bcnEq3MFdmlNL.jpg",
-  "https://s2.loli.net/2023/05/24/wZTSPj1yDQNcuhU.jpg",
-]);
+  'https://s2.loli.net/2023/05/24/yNsxFC8rLHMZQcK.jpg',
+  'https://s2.loli.net/2023/05/24/RuHFMwW4rG5lIqs.jpg',
+  'https://s2.loli.net/2023/05/24/ZPiGbcpR91WqInB.jpg',
+  'https://s2.loli.net/2023/05/24/e1bcnEq3MFdmlNL.jpg',
+  'https://s2.loli.net/2023/05/24/wZTSPj1yDQNcuhU.jpg'
+])
 </script>
 <template>
   <div class="app-container">
diff --git a/src/views/demo/wang-editor.vue b/src/views/demo/wang-editor.vue
index d7ff4bb8..5f1eeac6 100644
--- a/src/views/demo/wang-editor.vue
+++ b/src/views/demo/wang-editor.vue
@@ -1,8 +1,8 @@
 <!-- wangEditor富文本编辑器示例 -->
 <script setup lang="ts">
-import Editor from "@/components/WangEditor/index.vue";
+import Editor from '@/components/WangEditor/index.vue'
 
-const value = ref("初始内容");
+const value = ref('初始内容')
 </script>
 
 <template>
diff --git a/src/views/demo/websocket.vue b/src/views/demo/websocket.vue
index 23546a90..9d7af2fc 100644
--- a/src/views/demo/websocket.vue
+++ b/src/views/demo/websocket.vue
@@ -1,114 +1,114 @@
 <!-- websocket 示例 -->
 <script setup lang="ts">
-import SockJS from "sockjs-client";
-import Stomp from "stompjs";
+import SockJS from 'sockjs-client'
+import Stomp from 'stompjs'
 
-import { useUserStoreHook } from "@/store/modules/user";
+import { useUserStoreHook } from '@/store/modules/user'
 
-const userStore = useUserStoreHook();
+const userStore = useUserStoreHook()
 
-const isConnected = ref(false);
-const socketEndpoint = ref("http://47.117.115.107:8989/ws"); // 线上
+const isConnected = ref(false)
+const socketEndpoint = ref('http://47.117.115.107:8989/ws') // 线上
 // const socketEndpoint = ref("http://localhost:8989/ws"); // 本地
 
-const receiver = ref("root");
+const receiver = ref('root')
 
 interface MessageType {
-  type?: string; // 消息类型： tip-提示消息
-  sender?: string;
-  content: string;
+  type?: string // 消息类型： tip-提示消息
+  sender?: string
+  content: string
 }
 
-const messages = ref<MessageType[]>([]);
+const messages = ref<MessageType[]>([])
 
 const topicMessage = ref(
-  "亲爱的大冤种们，由于一只史诗级的BUG，系统版本已经被迫回退到了0.0.1。"
-); // 广播消息
+  '亲爱的大冤种们，由于一只史诗级的BUG，系统版本已经被迫回退到了0.0.1。'
+) // 广播消息
 
 const queneMessage = ref(
-  "hi , " +
+  'hi , ' +
     receiver.value +
-    " , 我是" +
+    ' , 我是' +
     userStore.user.username +
-    " , 想和你交个朋友 ! "
-);
+    ' , 想和你交个朋友 ! '
+)
 
 function sendToAll() {
-  stompClient.send("/app/sendToAll", {}, topicMessage.value);
+  stompClient.send('/app/sendToAll', {}, topicMessage.value)
   messages.value.push({
     sender: userStore.user.username,
-    content: topicMessage.value,
-  });
+    content: topicMessage.value
+  })
 }
 
 function sendToUser() {
-  stompClient.send("/app/sendToUser/" + receiver.value, {}, queneMessage.value);
+  stompClient.send('/app/sendToUser/' + receiver.value, {}, queneMessage.value)
   messages.value.push({
     sender: userStore.user.username,
-    content: queneMessage.value,
-  });
+    content: queneMessage.value
+  })
 }
 
-let stompClient: Stomp.Client;
+let stompClient: Stomp.Client
 
 function connectWebSocket() {
-  let socket = new SockJS(socketEndpoint.value);
+  let socket = new SockJS(socketEndpoint.value)
 
-  stompClient = Stomp.over(socket);
+  stompClient = Stomp.over(socket)
 
   stompClient.connect(
     { Authorization: userStore.token },
     () => {
-      isConnected.value = true;
+      isConnected.value = true
       messages.value.push({
-        sender: "Server",
-        content: "Websocket 已连接",
-        type: "tip",
-      });
+        sender: 'Server',
+        content: 'Websocket 已连接',
+        type: 'tip'
+      })
 
-      stompClient.subscribe("/topic/notice", (res: any) => {
+      stompClient.subscribe('/topic/notice', (res: any) => {
         messages.value.push({
-          sender: "Server",
-          content: res.body,
-        });
-      });
+          sender: 'Server',
+          content: res.body
+        })
+      })
 
-      stompClient.subscribe("/user/queue/greeting", (res) => {
-        const messageData = JSON.parse(res.body) as MessageType;
+      stompClient.subscribe('/user/queue/greeting', (res) => {
+        const messageData = JSON.parse(res.body) as MessageType
         messages.value.push({
           sender: messageData.sender,
-          content: messageData.content,
-        });
-      });
+          content: messageData.content
+        })
+      })
     },
     (error) => {
-      console.log("连接失败: " + error);
-      isConnected.value = false; // 更新连接状态
+      console.log('连接失败: ' + error)
+      isConnected.value = false // 更新连接状态
       messages.value.push({
-        sender: "Server",
-        content: "Websocket 已断开",
-        type: "tip",
-      });
+        sender: 'Server',
+        content: 'Websocket 已断开',
+        type: 'tip'
+      })
     }
-  );
+  )
 }
 
 function disconnectWebSocket() {
   if (stompClient && stompClient.connected) {
     stompClient.disconnect(() => {
-      isConnected.value = false; // 更新连接状态
+      isConnected.value = false // 更新连接状态
       messages.value.push({
-        sender: "Server",
-        content: "Websocket 已断开",
-        type: "tip",
-      });
-    });
+        sender: 'Server',
+        content: 'Websocket 已断开',
+        type: 'tip'
+      })
+    })
   }
 }
 
 onMounted(() => {
-  connectWebSocket();
-});
+  connectWebSocket()
+})
 </script>
 
 <template>
@@ -190,7 +190,7 @@ onMounted(() => {
                 'tip-message': message.type === 'tip',
                 message: message.type !== 'tip',
                 'message--sent': message.sender === userStore.user.username,
-                'message--received': message.sender !== userStore.user.username,
+                'message--received': message.sender !== userStore.user.username
               }"
             >
               <div v-if="message.type != 'tip'" class="message-content">
@@ -199,7 +199,7 @@ onMounted(() => {
                     'message-sender':
                       message.sender === userStore.user.username,
                     'message-receiver':
-                      message.sender !== userStore.user.username,
+                      message.sender !== userStore.user.username
                   }"
                 >
                   {{ message.sender }}
diff --git a/src/views/error-page/401.vue b/src/views/error-page/401.vue
index 79b11aa5..11defd76 100644
--- a/src/views/error-page/401.vue
+++ b/src/views/error-page/401.vue
@@ -1,27 +1,27 @@
 <script setup lang="ts">
-import { reactive, toRefs } from "vue";
-import { useRouter } from "vue-router";
+import { reactive, toRefs } from 'vue'
+import { useRouter } from 'vue-router'
 
-import { defineComponent } from "vue";
+import { defineComponent } from 'vue'
 
 defineComponent({
-  name: "Page401",
-});
+  name: 'Page401'
+})
 
 const state = reactive({
   errGif: new URL(`../../assets/images/401.gif`, import.meta.url).href,
 
   ewizardClap:
-    "https://wpimg.wallstcn.com/007ef517-bafd-4066-aae4-6883632d9646",
-  dialogVisible: false,
-});
+    'https://wpimg.wallstcn.com/007ef517-bafd-4066-aae4-6883632d9646',
+  dialogVisible: false
+})
 
-const { errGif, ewizardClap, dialogVisible } = toRefs(state);
+const { errGif, ewizardClap, dialogVisible } = toRefs(state)
 
-const router = useRouter();
+const router = useRouter()
 
 function back() {
-  router.back();
+  router.back()
 }
 </script>
 
diff --git a/src/views/error-page/404.vue b/src/views/error-page/404.vue
index 4e689952..3cdf1627 100644
--- a/src/views/error-page/404.vue
+++ b/src/views/error-page/404.vue
@@ -1,13 +1,13 @@
 <!-- setup 无法设置组件名称，组件名称keepAlive必须 -->
 <script lang="ts">
 export default {
-  name: "Page404",
-};
+  name: 'Page404'
+}
 </script>
 
 <script setup lang="ts">
 function message() {
-  return "The webmaster said that you can not enter this page...";
+  return 'The webmaster said that you can not enter this page...'
 }
 </script>
 
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index dadf82c3..4ad4eabf 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -103,13 +103,13 @@
           type="primary"
           class="w-full"
           @click.prevent="handleLogin"
-          >{{ $t("login.login") }}
+          >{{ $t('login.login') }}
         </el-button>
 
         <!-- 账号密码提示 -->
         <div class="mt-10 text-sm">
-          <span>{{ $t("login.username") }}: admin</span>
-          <span class="ml-4"> {{ $t("login.password") }}: 123456</span>
+          <span>{{ $t('login.username') }}: admin</span>
+          <span class="ml-4"> {{ $t('login.password') }}: 123456</span>
         </div>
       </el-form>
     </el-card>
@@ -129,104 +129,104 @@
 </template>
 
 <script setup lang="ts">
-import { useI18n } from "vue-i18n";
-import router from "@/router";
-import LangSelect from "@/components/LangSelect/index.vue";
-import SvgIcon from "@/components/SvgIcon/index.vue";
-import IconEpSunny from "~icons/ep/sunny";
-import IconEpMoon from "~icons/ep/moon";
-import { useSettingsStore } from "@/store/modules/settings";
+import { useI18n } from 'vue-i18n'
+import router from '@/router'
+import LangSelect from '@/components/LangSelect/index.vue'
+import SvgIcon from '@/components/SvgIcon/index.vue'
+import IconEpSunny from '~icons/ep/sunny'
+import IconEpMoon from '~icons/ep/moon'
+import { useSettingsStore } from '@/store/modules/settings'
 
 // 状态管理依赖
-import { useUserStore } from "@/store/modules/user";
-import { useAppStore } from "@/store/modules/app";
+import { useUserStore } from '@/store/modules/user'
+import { useAppStore } from '@/store/modules/app'
 
 // API依赖
-import { LocationQuery, LocationQueryValue, useRoute } from "vue-router";
-import { getCaptchaApi } from "@/api/auth";
-import { LoginData } from "@/api/auth/types";
+import { LocationQuery, LocationQueryValue, useRoute } from 'vue-router'
+import { getCaptchaApi } from '@/api/auth'
+import { LoginData } from '@/api/auth/types'
 
-const settingsStore = useSettingsStore();
+const settingsStore = useSettingsStore()
 
-const { title, version } = settingsStore;
+const { title, version } = settingsStore
 /**
  * 明亮/暗黑主题切换
  */
-const isDark = ref<boolean>(settingsStore.theme === "dark");
+const isDark = ref<boolean>(settingsStore.theme === 'dark')
 const handleThemeChange = (isDark: any) => {
-  useToggle(isDark);
+  useToggle(isDark)
   settingsStore.changeSetting({
-    key: "theme",
-    value: isDark ? "dark" : "light",
-  });
-};
+    key: 'theme',
+    value: isDark ? 'dark' : 'light'
+  })
+}
 
 /**
  * 根据屏幕宽度切换设备模式
  */
-const appStore = useAppStore();
-const WIDTH = 992; // 响应式布局容器固定宽度  大屏（>=1200px） 中屏（>=992px） 小屏（>=768px）
-const { width } = useWindowSize();
+const appStore = useAppStore()
+const WIDTH = 992 // 响应式布局容器固定宽度  大屏（>=1200px） 中屏（>=992px） 小屏（>=768px）
+const { width } = useWindowSize()
 watchEffect(() => {
   if (width.value < WIDTH) {
-    appStore.toggleDevice("mobile");
+    appStore.toggleDevice('mobile')
   } else {
-    appStore.toggleDevice("desktop");
+    appStore.toggleDevice('desktop')
   }
-});
+})
 
-const loading = ref(false); // 按钮loading
-const isCapslock = ref(false); // 是否大写锁定
-const passwordVisible = ref(false); // 密码是否可见
-const captchaBase64 = ref(); // 验证码图片Base64字符串
-const loginFormRef = ref(ElForm); // 登录表单ref
+const loading = ref(false) // 按钮loading
+const isCapslock = ref(false) // 是否大写锁定
+const passwordVisible = ref(false) // 密码是否可见
+const captchaBase64 = ref() // 验证码图片Base64字符串
+const loginFormRef = ref(ElForm) // 登录表单ref
 
 const loginData = ref<LoginData>({
-  username: "admin",
-  password: "123456",
-});
+  username: 'admin',
+  password: '123456'
+})
 
-const { t } = useI18n();
+const { t } = useI18n()
 const loginRules = computed(() => {
-  const prefix = appStore.language === "en" ? "Please enter " : "请输入";
+  const prefix = appStore.language === 'en' ? 'Please enter ' : '请输入'
   return {
     username: [
       {
         required: true,
-        trigger: "blur",
-        message: `${prefix}${t("login.username")}`,
-      },
+        trigger: 'blur',
+        message: `${prefix}${t('login.username')}`
+      }
     ],
     password: [
       {
         required: true,
-        trigger: "blur",
+        trigger: 'blur',
         validator: (rule: any, value: any, callback: any) => {
           if (value.length < 6) {
-            callback(new Error("The password can not be less than 6 digits"));
+            callback(new Error('The password can not be less than 6 digits'))
           } else {
-            callback();
+            callback()
           }
         },
-        message: `${prefix}${t("login.password")}`,
-      },
+        message: `${prefix}${t('login.password')}`
+      }
     ],
     captchaCode: [
       {
         required: true,
-        trigger: "blur",
-        message: `${prefix}${t("login.captchaCode")}`,
-      },
-    ],
-  };
-});
+        trigger: 'blur',
+        message: `${prefix}${t('login.captchaCode')}`
+      }
+    ]
+  }
+})
 
 /**
  * 检查输入大小写状态
  */
 function checkCapslock(e: any) {
-  const { key } = e;
-  isCapslock.value = key && key.length === 1 && key >= "A" && key <= "Z";
+  const { key } = e
+  isCapslock.value = key && key.length === 1 && key >= 'A' && key <= 'Z'
 }
 
 /**
@@ -234,74 +234,74 @@ function checkCapslock(e: any) {
  */
 function getCaptcha() {
   getCaptchaApi().then(({ data }) => {
-    loginData.value.captchaKey = data.captchaKey;
-    captchaBase64.value = data.captchaBase64;
-  });
+    loginData.value.captchaKey = data.captchaKey
+    captchaBase64.value = data.captchaBase64
+  })
 }
 
 /**
  * 登录
  */
-const route = useRoute();
-const userStore = useUserStore();
+const route = useRoute()
+const userStore = useUserStore()
 function handleLogin() {
   loginFormRef.value.validate((valid: boolean) => {
     if (valid) {
-      loading.value = true;
+      loading.value = true
       userStore
         .login(loginData.value)
         .then(() => {
-          const query: LocationQuery = route.query;
+          const query: LocationQuery = route.query
 
-          const redirect = (query.redirect as LocationQueryValue) ?? "/";
+          const redirect = (query.redirect as LocationQueryValue) ?? '/'
 
           const otherQueryParams = Object.keys(query).reduce(
             (acc: any, cur: string) => {
-              if (cur !== "redirect") {
-                acc[cur] = query[cur];
+              if (cur !== 'redirect') {
+                acc[cur] = query[cur]
               }
-              return acc;
+              return acc
             },
             {}
-          );
+          )
 
-          router.push({ path: redirect, query: otherQueryParams });
+          router.push({ path: redirect, query: otherQueryParams })
         })
         .catch(() => {
           // 验证失败，重新生成验证码
-          getCaptcha();
+          getCaptcha()
         })
         .finally(() => {
-          loading.value = false;
-        });
+          loading.value = false
+        })
     }
-  });
+  })
 }
 
 onMounted(() => {
-  getCaptcha();
+  getCaptcha()
 
   // 主题初始化
-  const theme = useSettingsStore().theme;
-  useSettingsStore().changeSetting({ key: "theme", value: theme });
-  if (theme == "dark") {
-    document.documentElement.classList.add("dark");
+  const theme = useSettingsStore().theme
+  useSettingsStore().changeSetting({ key: 'theme', value: theme })
+  if (theme == 'dark') {
+    document.documentElement.classList.add('dark')
   } else {
-    document.documentElement.classList.remove("dark");
+    document.documentElement.classList.remove('dark')
   }
-});
+})
 </script>
 
 <style lang="scss" scoped>
 .dark .login-container {
-  background: url("@/assets/images/login-bg-dark.jpg") no-repeat center right;
+  background: url('@/assets/images/login-bg-dark.jpg') no-repeat center right;
 }
 
 .login-container {
   @apply w-full h-full flex-center;
 
   overflow-y: auto;
-  background: url("@/assets/images/login-bg.jpg") no-repeat center right;
+  background: url('@/assets/images/login-bg.jpg') no-repeat center right;
 
   .login-form {
     padding: 30px 10px;
diff --git a/src/views/redirect/index.vue b/src/views/redirect/index.vue
index 4215bf69..d9ee8a14 100644
--- a/src/views/redirect/index.vue
+++ b/src/views/redirect/index.vue
@@ -3,13 +3,13 @@
 </template>
 
 <script setup lang="ts">
-import { useRoute, useRouter } from "vue-router";
+import { useRoute, useRouter } from 'vue-router'
 
-const route = useRoute();
-const router = useRouter();
+const route = useRoute()
+const router = useRouter()
 
-const { params, query } = route;
-const { path } = params;
+const { params, query } = route
+const { path } = params
 
-router.replace({ path: "/" + path, query });
+router.replace({ path: '/' + path, query })
 </script>
diff --git a/src/views/system/dept/index.vue b/src/views/system/dept/index.vue
index 268c4953..ef646942 100644
--- a/src/views/system/dept/index.vue
+++ b/src/views/system/dept/index.vue
@@ -5,61 +5,61 @@ import {
   updateDept,
   addDept,
   getDeptOptions,
-  listDepts,
-} from "@/api/dept";
+  listDepts
+} from '@/api/dept'
 
-import { DeptVO, DeptForm, DeptQuery } from "@/api/dept/types";
+import { DeptVO, DeptForm, DeptQuery } from '@/api/dept/types'
 
 defineOptions({
-  name: "Dept",
-  inheritAttrs: false,
-});
+  name: 'Dept',
+  inheritAttrs: false
+})
 
-const queryFormRef = ref(ElForm);
-const deptFormRef = ref(ElForm);
+const queryFormRef = ref(ElForm)
+const deptFormRef = ref(ElForm)
 
-const loading = ref(false);
-const ids = ref<number[]>([]);
+const loading = ref(false)
+const ids = ref<number[]>([])
 const dialog = reactive({
-  title: "",
-  visible: false,
-});
+  title: '',
+  visible: false
+})
 
-const queryParams = reactive<DeptQuery>({});
-const deptList = ref<DeptVO[]>();
+const queryParams = reactive<DeptQuery>({})
+const deptList = ref<DeptVO[]>()
 
-const deptOptions = ref<OptionType[]>();
+const deptOptions = ref<OptionType[]>()
 
 const formData = reactive<DeptForm>({
   status: 1,
   parentId: 0,
-  sort: 1,
-});
+  sort: 1
+})
 
 const rules = reactive({
-  parentId: [{ required: true, message: "上级部门不能为空", trigger: "blur" }],
-  name: [{ required: true, message: "部门名称不能为空", trigger: "blur" }],
-  sort: [{ required: true, message: "显示排序不能为空", trigger: "blur" }],
-});
+  parentId: [{ required: true, message: '上级部门不能为空', trigger: 'blur' }],
+  name: [{ required: true, message: '部门名称不能为空', trigger: 'blur' }],
+  sort: [{ required: true, message: '显示排序不能为空', trigger: 'blur' }]
+})
 
 /** 查询 */
 function handleQuery() {
-  loading.value = true;
+  loading.value = true
   listDepts(queryParams).then(({ data }) => {
-    deptList.value = data;
-    loading.value = false;
-  });
+    deptList.value = data
+    loading.value = false
+  })
 }
 
 /**重置查询 */
 function resetQuery() {
-  queryFormRef.value.resetFields();
-  handleQuery();
+  queryFormRef.value.resetFields()
+  handleQuery()
 }
 
 /** 行复选框选中记录选中ID集合 */
 function handleSelectionChange(selection: any) {
-  ids.value = selection.map((item: any) => item.id);
+  ids.value = selection.map((item: any) => item.id)
 }
 
 /** 获取部门下拉数据  */
@@ -68,11 +68,11 @@ async function loadDeptOptions() {
     deptOptions.value = [
       {
         value: 0,
-        label: "顶级部门",
-        children: response.data,
-      },
-    ];
-  });
+        label: '顶级部门',
+        children: response.data
+      }
+    ]
+  })
 }
 
 /**
@@ -82,16 +82,16 @@ async function loadDeptOptions() {
  * @param deptId 部门ID
  */
 async function openDialog(parentId?: number, deptId?: number) {
-  await loadDeptOptions();
-  dialog.visible = true;
+  await loadDeptOptions()
+  dialog.visible = true
   if (deptId) {
-    dialog.title = "修改部门";
+    dialog.title = '修改部门'
     getDeptForm(deptId).then(({ data }) => {
-      Object.assign(formData, data);
-    });
+      Object.assign(formData, data)
+    })
   } else {
-    dialog.title = "新增部门";
-    formData.parentId = parentId ?? 0;
+    dialog.title = '新增部门'
+    formData.parentId = parentId ?? 0
   }
 }
 
@@ -99,70 +99,70 @@ async function openDialog(parentId?: number, deptId?: number) {
 function handleSubmit() {
   deptFormRef.value.validate((valid: any) => {
     if (valid) {
-      const deptId = formData.id;
-      loading.value = true;
+      const deptId = formData.id
+      loading.value = true
       if (deptId) {
         updateDept(deptId, formData)
           .then(() => {
-            ElMessage.success("修改成功");
-            closeDialog();
-            handleQuery();
+            ElMessage.success('修改成功')
+            closeDialog()
+            handleQuery()
           })
-          .finally(() => (loading.value = false));
+          .finally(() => (loading.value = false))
       } else {
         addDept(formData)
           .then(() => {
-            ElMessage.success("新增成功");
-            closeDialog();
-            handleQuery();
+            ElMessage.success('新增成功')
+            closeDialog()
+            handleQuery()
           })
-          .finally(() => (loading.value = false));
+          .finally(() => (loading.value = false))
       }
     }
-  });
+  })
 }
 
 /** 删除部门 */
 function handleDelete(deptId?: number) {
-  const deptIds = [deptId || ids.value].join(",");
+  const deptIds = [deptId || ids.value].join(',')
 
   if (!deptIds) {
-    ElMessage.warning("请勾选删除项");
-    return;
+    ElMessage.warning('请勾选删除项')
+    return
   }
 
-  ElMessageBox.confirm(`确认删除已选中的数据项?`, "警告", {
-    confirmButtonText: "确定",
-    cancelButtonText: "取消",
-    type: "warning",
+  ElMessageBox.confirm(`确认删除已选中的数据项?`, '警告', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
   }).then(() => {
     deleteDept(deptIds).then(() => {
-      ElMessage.success("删除成功");
-      resetQuery();
-    });
-  });
+      ElMessage.success('删除成功')
+      resetQuery()
+    })
+  })
 }
 
 /** 关闭弹窗 */
 function closeDialog() {
-  dialog.visible = false;
-  resetForm();
+  dialog.visible = false
+  resetForm()
 }
 
 /** 重置表单  */
 function resetForm() {
-  deptFormRef.value.resetFields();
-  deptFormRef.value.clearValidate();
+  deptFormRef.value.resetFields()
+  deptFormRef.value.clearValidate()
 
-  formData.id = undefined;
-  formData.parentId = 0;
-  formData.status = 1;
-  formData.sort = 1;
+  formData.id = undefined
+  formData.parentId = 0
+  formData.status = 1
+  formData.sort = 1
 }
 
 onMounted(() => {
-  handleQuery();
-});
+  handleQuery()
+})
 </script>
 <template>
   <div class="app-container">
diff --git a/src/views/system/dict/components/dict-item.vue b/src/views/system/dict/components/dict-item.vue
index 6a68e892..456cda91 100644
--- a/src/views/system/dict/components/dict-item.vue
+++ b/src/views/system/dict/components/dict-item.vue
@@ -5,82 +5,82 @@ import {
   getDictFormData,
   addDict,
   updateDict,
-  deleteDict,
-} from "@/api/dict";
-import { DictPageVO, DictForm, DictQuery } from "@/api/dict/types";
+  deleteDict
+} from '@/api/dict'
+import { DictPageVO, DictForm, DictQuery } from '@/api/dict/types'
 
 defineOptions({
-  name: "DictData",
-  inheritAttrs: false,
-});
+  name: 'DictData',
+  inheritAttrs: false
+})
 
 const props = defineProps({
   typeCode: {
     type: String,
     default: () => {
-      return "";
-    },
+      return ''
+    }
   },
   typeName: {
     type: String,
     default: () => {
-      return "";
-    },
-  },
-});
+      return ''
+    }
+  }
+})
 
 watch(
   () => props.typeCode,
   (newVal: string) => {
-    queryParams.typeCode = newVal;
-    formData.typeCode = newVal;
-    resetQuery();
+    queryParams.typeCode = newVal
+    formData.typeCode = newVal
+    resetQuery()
   }
-);
+)
 
-const queryFormRef = ref(ElForm);
-const dataFormRef = ref(ElForm);
+const queryFormRef = ref(ElForm)
+const dataFormRef = ref(ElForm)
 
-const loading = ref(false);
-const ids = ref<number[]>([]);
-const total = ref(0);
+const loading = ref(false)
+const ids = ref<number[]>([])
+const total = ref(0)
 
 const queryParams = reactive<DictQuery>({
   pageNum: 1,
   pageSize: 10,
-  typeCode: props.typeCode,
-});
+  typeCode: props.typeCode
+})
 
-const dictList = ref<DictPageVO[]>();
+const dictList = ref<DictPageVO[]>()
 
 const dialog = reactive({
-  title: "",
-  visible: false,
-});
+  title: '',
+  visible: false
+})
 
 const formData = reactive<DictForm>({
   status: 1,
   typeCode: props.typeCode,
-  sort: 1,
-});
+  sort: 1
+})
 
 const rules = reactive({
-  name: [{ required: true, message: "请输入字典名称", trigger: "blur" }],
-  value: [{ required: true, message: "请输入字典值", trigger: "blur" }],
-});
+  name: [{ required: true, message: '请输入字典名称', trigger: 'blur' }],
+  value: [{ required: true, message: '请输入字典值', trigger: 'blur' }]
+})
 
 /**
  * 查询
  */
 function handleQuery() {
   if (queryParams.typeCode) {
-    loading.value = true;
+    loading.value = true
     getDictPage(queryParams)
       .then(({ data }) => {
-        dictList.value = data.list;
-        total.value = data.total;
+        dictList.value = data.list
+        total.value = data.total
       })
-      .finally(() => (loading.value = false));
+      .finally(() => (loading.value = false))
   }
 }
 
@@ -88,9 +88,9 @@ function handleQuery() {
  * 重置查询
  */
 function resetQuery() {
-  queryFormRef.value.resetFields();
-  queryParams.pageNum = 1;
-  handleQuery();
+  queryFormRef.value.resetFields()
+  queryParams.pageNum = 1
+  handleQuery()
 }
 
 /**
@@ -99,7 +99,7 @@ function resetQuery() {
  * @param selection
  */
 function handleSelectionChange(selection: any) {
-  ids.value = selection.map((item: any) => item.id);
+  ids.value = selection.map((item: any) => item.id)
 }
 
 /**
@@ -108,14 +108,14 @@ function handleSelectionChange(selection: any) {
  * @param dictId 字典ID
  */
 function openDialog(dictId?: number) {
-  dialog.visible = true;
+  dialog.visible = true
   if (dictId) {
-    dialog.title = "修改字典";
+    dialog.title = '修改字典'
     getDictFormData(dictId).then(({ data }) => {
-      Object.assign(formData, data);
-    });
+      Object.assign(formData, data)
+    })
   } else {
-    dialog.title = "新增字典";
+    dialog.title = '新增字典'
   }
 }
 
@@ -125,75 +125,75 @@ function openDialog(dictId?: number) {
 function handleSubmit() {
   dataFormRef.value.validate((isValid: boolean) => {
     if (isValid) {
-      loading.value = false;
-      const dictId = formData.id;
+      loading.value = false
+      const dictId = formData.id
       if (dictId) {
         updateDict(dictId, formData)
           .then(() => {
-            ElMessage.success("修改成功");
-            closeDialog();
-            resetQuery();
+            ElMessage.success('修改成功')
+            closeDialog()
+            resetQuery()
           })
-          .finally(() => (loading.value = false));
+          .finally(() => (loading.value = false))
       } else {
         addDict(formData)
           .then(() => {
-            ElMessage.success("新增成功");
-            closeDialog();
-            resetQuery();
+            ElMessage.success('新增成功')
+            closeDialog()
+            resetQuery()
           })
-          .finally(() => (loading.value = false));
+          .finally(() => (loading.value = false))
       }
     }
-  });
+  })
 }
 
 /**
  * 关闭弹窗
  */
 function closeDialog() {
-  dialog.visible = false;
-  resetForm();
+  dialog.visible = false
+  resetForm()
 }
 
 /**
  * 重置表单
  */
 function resetForm() {
-  dataFormRef.value.resetFields();
-  dataFormRef.value.clearValidate();
+  dataFormRef.value.resetFields()
+  dataFormRef.value.clearValidate()
 
-  formData.id = undefined;
-  formData.status = 1;
-  formData.sort = 1;
-  formData.typeCode = props.typeCode;
+  formData.id = undefined
+  formData.status = 1
+  formData.sort = 1
+  formData.typeCode = props.typeCode
 }
 
 /**
  * 删除字典
  */
 function handleDelete(dictId?: number) {
-  const dictIds = [dictId || ids.value].join(",");
+  const dictIds = [dictId || ids.value].join(',')
   if (!dictIds) {
-    ElMessage.warning("请勾选删除项");
-    return;
+    ElMessage.warning('请勾选删除项')
+    return
   }
 
-  ElMessageBox.confirm("确认删除已选中的数据项?", "警告", {
-    confirmButtonText: "确定",
-    cancelButtonText: "取消",
-    type: "warning",
+  ElMessageBox.confirm('确认删除已选中的数据项?', '警告', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
   }).then(() => {
     deleteDict(dictIds).then(() => {
-      ElMessage.success("删除成功");
-      resetQuery();
-    });
-  });
+      ElMessage.success('删除成功')
+      resetQuery()
+    })
+  })
 }
 
 onMounted(() => {
-  handleQuery();
-});
+  handleQuery()
+})
 </script>
 
 <template>
diff --git a/src/views/system/dict/index.vue b/src/views/system/dict/index.vue
index 5740dce3..a74c8706 100644
--- a/src/views/system/dict/index.vue
+++ b/src/views/system/dict/index.vue
@@ -5,69 +5,69 @@ import {
   getDictTypeForm,
   addDictType,
   updateDictType,
-  deleteDictTypes,
-} from "@/api/dict";
+  deleteDictTypes
+} from '@/api/dict'
 
-import { DictTypePageVO, DictTypeQuery, DictTypeForm } from "@/api/dict/types";
+import { DictTypePageVO, DictTypeQuery, DictTypeForm } from '@/api/dict/types'
 
 defineOptions({
-  name: "DictType",
-  inheritAttrs: false,
-});
+  name: 'DictType',
+  inheritAttrs: false
+})
 
-const queryFormRef = ref(ElForm);
-const dataFormRef = ref(ElForm);
+const queryFormRef = ref(ElForm)
+const dataFormRef = ref(ElForm)
 
-const loading = ref(false);
-const ids = ref<number[]>([]);
-const total = ref(0);
+const loading = ref(false)
+const ids = ref<number[]>([])
+const total = ref(0)
 
 const queryParams = reactive<DictTypeQuery>({
   pageNum: 1,
-  pageSize: 10,
-});
+  pageSize: 10
+})
 
-const dictTypeList = ref<DictTypePageVO[]>();
+const dictTypeList = ref<DictTypePageVO[]>()
 
 const dialog = reactive({
-  title: "",
-  visible: false,
-});
+  title: '',
+  visible: false
+})
 
 const formData = reactive<DictTypeForm>({
-  status: 1,
-});
+  status: 1
+})
 
 const rules = reactive({
-  name: [{ required: true, message: "请输入字典类型名称", trigger: "blur" }],
-  code: [{ required: true, message: "请输入字典类型编码", trigger: "blur" }],
-});
+  name: [{ required: true, message: '请输入字典类型名称', trigger: 'blur' }],
+  code: [{ required: true, message: '请输入字典类型编码', trigger: 'blur' }]
+})
 
 /** 查询 */
 function handleQuery() {
-  loading.value = true;
+  loading.value = true
   getDictTypePage(queryParams)
     .then(({ data }) => {
-      dictTypeList.value = data.list;
-      total.value = data.total;
+      dictTypeList.value = data.list
+      total.value = data.total
     })
     .finally(() => {
-      loading.value = false;
-    });
+      loading.value = false
+    })
 }
 
 /**
  * 重置查询
  */
 function resetQuery() {
-  queryFormRef.value.resetFields();
-  queryParams.pageNum = 1;
-  handleQuery();
+  queryFormRef.value.resetFields()
+  queryParams.pageNum = 1
+  handleQuery()
 }
 
 /** 行复选框选中  */
 function handleSelectionChange(selection: any) {
-  ids.value = selection.map((item: any) => item.id);
+  ids.value = selection.map((item: any) => item.id)
 }
 
 /**
@@ -76,14 +76,14 @@ function handleSelectionChange(selection: any) {
  * @param dicTypeId 字典类型ID
  */
 function openDialog(dicTypeId?: number) {
-  dialog.visible = true;
+  dialog.visible = true
   if (dicTypeId) {
-    dialog.title = "修改字典类型";
+    dialog.title = '修改字典类型'
     getDictTypeForm(dicTypeId).then(({ data }) => {
-      Object.assign(formData, data);
-    });
+      Object.assign(formData, data)
+    })
   } else {
-    dialog.title = "新增字典类型";
+    dialog.title = '新增字典类型'
   }
 }
 
@@ -91,88 +91,88 @@ function openDialog(dicTypeId?: number) {
 function handleSubmit() {
   dataFormRef.value.validate((isValid: boolean) => {
     if (isValid) {
-      loading.value = false;
-      const dictTypeId = formData.id;
+      loading.value = false
+      const dictTypeId = formData.id
       if (dictTypeId) {
         updateDictType(dictTypeId, formData)
           .then(() => {
-            ElMessage.success("修改成功");
-            closeDialog();
-            handleQuery();
+            ElMessage.success('修改成功')
+            closeDialog()
+            handleQuery()
           })
-          .finally(() => (loading.value = false));
+          .finally(() => (loading.value = false))
       } else {
         addDictType(formData)
           .then(() => {
-            ElMessage.success("新增成功");
-            closeDialog();
-            handleQuery();
+            ElMessage.success('新增成功')
+            closeDialog()
+            handleQuery()
           })
-          .finally(() => (loading.value = false));
+          .finally(() => (loading.value = false))
       }
     }
-  });
+  })
 }
 
 /** 关闭字典类型弹窗 */
 function closeDialog() {
-  dialog.visible = false;
-  resetForm();
+  dialog.visible = false
+  resetForm()
 }
 
 /**  重置字典类型表单 */
 function resetForm() {
-  dataFormRef.value.resetFields();
-  dataFormRef.value.clearValidate();
+  dataFormRef.value.resetFields()
+  dataFormRef.value.clearValidate()
 
-  formData.id = undefined;
-  formData.status = 1;
+  formData.id = undefined
+  formData.status = 1
 }
 
 /** 删除字典类型 */
 function handleDelete(dictTypeId?: number) {
-  const dictTypeIds = [dictTypeId || ids.value].join(",");
+  const dictTypeIds = [dictTypeId || ids.value].join(',')
   if (!dictTypeIds) {
-    ElMessage.warning("请勾选删除项");
-    return;
+    ElMessage.warning('请勾选删除项')
+    return
   }
 
-  ElMessageBox.confirm("确认删除已选中的数据项?", "警告", {
-    confirmButtonText: "确定",
-    cancelButtonText: "取消",
-    type: "warning",
+  ElMessageBox.confirm('确认删除已选中的数据项?', '警告', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
   }).then(() => {
     deleteDictTypes(dictTypeIds).then(() => {
-      ElMessage.success("删除成功");
-      resetQuery();
-    });
-  });
+      ElMessage.success('删除成功')
+      resetQuery()
+    })
+  })
 }
 
 const dictDataDialog = reactive({
-  title: "",
-  visible: false,
-});
+  title: '',
+  visible: false
+})
 
-const selectedDictType = reactive({ typeCode: "", typeName: "" }); // 当前选中的字典类型
+const selectedDictType = reactive({ typeCode: '', typeName: '' }) // 当前选中的字典类型
 
 /** 打开字典数据弹窗 */
 function openDictDialog(row: DictTypePageVO) {
-  dictDataDialog.visible = true;
-  dictDataDialog.title = "【" + row.name + "】字典数据";
+  dictDataDialog.visible = true
+  dictDataDialog.title = '【' + row.name + '】字典数据'
 
-  selectedDictType.typeCode = row.code;
-  selectedDictType.typeName = row.name;
+  selectedDictType.typeCode = row.code
+  selectedDictType.typeName = row.name
 }
 
 /**  关闭字典数据弹窗 */
 function closeDictDialog() {
-  dictDataDialog.visible = false;
+  dictDataDialog.visible = false
 }
 
 onMounted(() => {
-  handleQuery();
-});
+  handleQuery()
+})
 </script>
 
 <template>
diff --git a/src/views/system/menu/index.vue b/src/views/system/menu/index.vue
index bca9f991..dd53b281 100644
--- a/src/views/system/menu/index.vue
+++ b/src/views/system/menu/index.vue
@@ -1,38 +1,38 @@
 <script setup lang="ts">
 defineOptions({
   // eslint-disable-next-line vue/no-reserved-component-names
-  name: "Menu",
-  inheritAttrs: false,
-});
+  name: 'Menu',
+  inheritAttrs: false
+})
 
-import { MenuQuery, MenuForm, MenuVO } from "@/api/menu/types";
+import { MenuQuery, MenuForm, MenuVO } from '@/api/menu/types'
 import {
   listMenus,
   getMenuForm,
   getMenuOptions,
   addMenu,
   deleteMenu,
-  updateMenu,
-} from "@/api/menu";
+  updateMenu
+} from '@/api/menu'
 
-import { MenuTypeEnum } from "@/enums/MenuTypeEnum";
+import { MenuTypeEnum } from '@/enums/MenuTypeEnum'
 
-import SvgIcon from "@/components/SvgIcon/index.vue";
-import IconSelect from "@/components/IconSelect/index.vue";
+import SvgIcon from '@/components/SvgIcon/index.vue'
+import IconSelect from '@/components/IconSelect/index.vue'
 
-const queryFormRef = ref(ElForm);
-const menuFormRef = ref(ElForm);
+const queryFormRef = ref(ElForm)
+const menuFormRef = ref(ElForm)
 
-const loading = ref(false);
+const loading = ref(false)
 const dialog = reactive({
-  title: "",
-  visible: false,
-});
+  title: '',
+  visible: false
+})
 
-const queryParams = reactive<MenuQuery>({});
-const menuList = ref<MenuVO[]>([]);
+const queryParams = reactive<MenuQuery>({})
+const menuList = ref<MenuVO[]>([])
 
-const menuOptions = ref<OptionType[]>([]);
+const menuOptions = ref<OptionType[]>([])
 
 const formData = reactive<MenuForm>({
   parentId: 0,
@@ -40,51 +40,51 @@ const formData = reactive<MenuForm>({
   sort: 1,
   type: MenuTypeEnum.MENU,
   alwaysShow: 0,
-  keepAlive: 0,
-});
+  keepAlive: 0
+})
 
 const rules = reactive({
-  parentId: [{ required: true, message: "请选择顶级菜单", trigger: "blur" }],
-  name: [{ required: true, message: "请输入菜单名称", trigger: "blur" }],
-  type: [{ required: true, message: "请选择菜单类型", trigger: "blur" }],
-  path: [{ required: true, message: "请输入路由路径", trigger: "blur" }],
+  parentId: [{ required: true, message: '请选择顶级菜单', trigger: 'blur' }],
+  name: [{ required: true, message: '请输入菜单名称', trigger: 'blur' }],
+  type: [{ required: true, message: '请选择菜单类型', trigger: 'blur' }],
+  path: [{ required: true, message: '请输入路由路径', trigger: 'blur' }],
 
-  component: [{ required: true, message: "请输入组件路径", trigger: "blur" }],
-  visible: [{ required: true, message: "请输入路由路径", trigger: "blur" }],
-});
+  component: [{ required: true, message: '请输入组件路径', trigger: 'blur' }],
+  visible: [{ required: true, message: '请输入路由路径', trigger: 'blur' }]
+})
 
 // 选择表格的行菜单ID
-const selectedRowMenuId = ref<number | undefined>();
+const selectedRowMenuId = ref<number | undefined>()
 
 const menuCacheData = reactive({
-  type: "",
-  path: "",
-});
+  type: '',
+  path: ''
+})
 
 /**
  * 查询
  */
 function handleQuery() {
   // 重置父组件
-  loading.value = true;
+  loading.value = true
   listMenus(queryParams)
     .then(({ data }) => {
-      menuList.value = data;
+      menuList.value = data
     })
     .then(() => {
-      loading.value = false;
-    });
+      loading.value = false
+    })
 }
 
 /** 重置查询 */
 function resetQuery() {
-  queryFormRef.value.resetFields();
-  handleQuery();
+  queryFormRef.value.resetFields()
+  handleQuery()
 }
 
 /**行点击事件 */
 function onRowClick(row: MenuVO) {
-  selectedRowMenuId.value = row.id;
+  selectedRowMenuId.value = row.id
 }
 
 /**
@@ -96,31 +96,31 @@ function onRowClick(row: MenuVO) {
 function openDialog(parentId?: number, menuId?: number) {
   getMenuOptions()
     .then(({ data }) => {
-      menuOptions.value = [{ value: 0, label: "顶级菜单", children: data }];
+      menuOptions.value = [{ value: 0, label: '顶级菜单', children: data }]
     })
     .then(() => {
-      dialog.visible = true;
+      dialog.visible = true
       if (menuId) {
-        dialog.title = "编辑菜单";
+        dialog.title = '编辑菜单'
         getMenuForm(menuId).then(({ data }) => {
-          Object.assign(formData, data);
-          menuCacheData.type = data.type;
-          menuCacheData.path = data.path ?? "";
-        });
+          Object.assign(formData, data)
+          menuCacheData.type = data.type
+          menuCacheData.path = data.path ?? ''
+        })
       } else {
-        dialog.title = "新增菜单";
-        formData.parentId = parentId;
+        dialog.title = '新增菜单'
+        formData.parentId = parentId
       }
-    });
+    })
 }
 
 /** 菜单类型切换事件处理 */
 function onMenuTypeChange() {
   // 如果菜单类型改变，清空路由路径；未改变在切换后还原路由路径
   if (formData.type !== menuCacheData.type) {
-    formData.path = "";
+    formData.path = ''
   } else {
-    formData.path = menuCacheData.path;
+    formData.path = menuCacheData.path
   }
 }
 
@@ -128,71 +128,71 @@ function onMenuTypeChange() {
 function submitForm() {
   menuFormRef.value.validate((isValid: boolean) => {
     if (isValid) {
-      const menuId = formData.id;
+      const menuId = formData.id
       if (menuId) {
         updateMenu(menuId, formData).then(() => {
-          ElMessage.success("修改成功");
-          closeDialog();
-          handleQuery();
-        });
+          ElMessage.success('修改成功')
+          closeDialog()
+          handleQuery()
+        })
       } else {
         addMenu(formData).then(() => {
-          ElMessage.success("新增成功");
-          closeDialog();
-          handleQuery();
-        });
+          ElMessage.success('新增成功')
+          closeDialog()
+          handleQuery()
+        })
       }
     }
-  });
+  })
 }
 
 /** 删除菜单 */
 function handleDelete(menuId: number) {
   if (!menuId) {
-    ElMessage.warning("请勾选删除项");
-    return false;
+    ElMessage.warning('请勾选删除项')
+    return false
   }
 
-  ElMessageBox.confirm("确认删除已选中的数据项?", "警告", {
-    confirmButtonText: "确定",
-    cancelButtonText: "取消",
-    type: "warning",
+  ElMessageBox.confirm('确认删除已选中的数据项?', '警告', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
   })
     .then(() => {
       deleteMenu(menuId).then(() => {
-        ElMessage.success("删除成功");
-        handleQuery();
-      });
+        ElMessage.success('删除成功')
+        handleQuery()
+      })
     })
-    .catch(() => ElMessage.info("已取消删除"));
+    .catch(() => ElMessage.info('已取消删除'))
 }
 
 /** 关闭弹窗 */
 function closeDialog() {
-  dialog.visible = false;
-  resetForm();
+  dialog.visible = false
+  resetForm()
 }
 
 /** 重置表单 */
 function resetForm() {
-  menuFormRef.value.resetFields();
-  menuFormRef.value.clearValidate();
-
-  formData.id = undefined;
-  formData.parentId = 0;
-  formData.visible = 1;
-  formData.sort = 1;
-  formData.perm = undefined;
-  formData.component = undefined;
-  formData.path = undefined;
-  formData.redirect = undefined;
-  formData.alwaysShow = undefined;
-  formData.keepAlive = undefined;
+  menuFormRef.value.resetFields()
+  menuFormRef.value.clearValidate()
+
+  formData.id = undefined
+  formData.parentId = 0
+  formData.visible = 1
+  formData.sort = 1
+  formData.perm = undefined
+  formData.component = undefined
+  formData.path = undefined
+  formData.redirect = undefined
+  formData.alwaysShow = undefined
+  formData.keepAlive = undefined
 }
 
 onMounted(() => {
-  handleQuery();
-});
+  handleQuery()
+})
 </script>
 
 <template>
@@ -240,7 +240,7 @@ onMounted(() => {
         @row-click="onRowClick"
         :tree-props="{
           children: 'children',
-          hasChildren: 'hasChildren',
+          hasChildren: 'hasChildren'
         }"
       >
         <el-table-column label="菜单名称" min-width="200">
diff --git a/src/views/system/role/index.vue b/src/views/system/role/index.vue
index 82790d11..fa803e8e 100644
--- a/src/views/system/role/index.vue
+++ b/src/views/system/role/index.vue
@@ -6,95 +6,95 @@ import {
   addRole,
   deleteRoles,
   getRoleMenuIds,
-  updateRoleMenus,
-} from "@/api/role";
-import { getMenuOptions } from "@/api/menu";
+  updateRoleMenus
+} from '@/api/role'
+import { getMenuOptions } from '@/api/menu'
 
-import { RolePageVO, RoleForm, RoleQuery } from "@/api/role/types";
+import { RolePageVO, RoleForm, RoleQuery } from '@/api/role/types'
 
 defineOptions({
-  name: "Role",
-  inheritAttrs: false,
-});
+  name: 'Role',
+  inheritAttrs: false
+})
 
-const queryFormRef = ref(ElForm);
-const roleFormRef = ref(ElForm);
-const menuRef = ref(ElTree);
+const queryFormRef = ref(ElForm)
+const roleFormRef = ref(ElForm)
+const menuRef = ref(ElTree)
 
-const loading = ref(false);
-const ids = ref<number[]>([]);
-const total = ref(0);
+const loading = ref(false)
+const ids = ref<number[]>([])
+const total = ref(0)
 
 const queryParams = reactive<RoleQuery>({
   pageNum: 1,
-  pageSize: 10,
-});
+  pageSize: 10
+})
 
-const roleList = ref<RolePageVO[]>();
+const roleList = ref<RolePageVO[]>()
 
 const dialog = reactive({
-  title: "",
-  visible: false,
-});
+  title: '',
+  visible: false
+})
 
 const formData = reactive<RoleForm>({
   sort: 1,
   status: 1,
-  code: "",
-  name: "",
-});
+  code: '',
+  name: ''
+})
 
 const rules = reactive({
-  name: [{ required: true, message: "请输入角色名称", trigger: "blur" }],
-  code: [{ required: true, message: "请输入角色编码", trigger: "blur" }],
-  dataScope: [{ required: true, message: "请选择数据权限", trigger: "blur" }],
-  status: [{ required: true, message: "请选择状态", trigger: "blur" }],
-});
+  name: [{ required: true, message: '请输入角色名称', trigger: 'blur' }],
+  code: [{ required: true, message: '请输入角色编码', trigger: 'blur' }],
+  dataScope: [{ required: true, message: '请选择数据权限', trigger: 'blur' }],
+  status: [{ required: true, message: '请选择状态', trigger: 'blur' }]
+})
 
-const menuDialogVisible = ref(false);
+const menuDialogVisible = ref(false)
 
-const menuList = ref<OptionType[]>([]);
+const menuList = ref<OptionType[]>([])
 
 interface CheckedRole {
-  id?: number;
-  name?: string;
+  id?: number
+  name?: string
 }
-let checkedRole: CheckedRole = reactive({});
+let checkedRole: CheckedRole = reactive({})
 
 /** 查询 */
 function handleQuery() {
-  loading.value = true;
+  loading.value = true
   getRolePage(queryParams)
     .then(({ data }) => {
-      roleList.value = data.list;
-      total.value = data.total;
+      roleList.value = data.list
+      total.value = data.total
     })
     .finally(() => {
-      loading.value = false;
-    });
+      loading.value = false
+    })
 }
 /** 重置查询 */
 function resetQuery() {
-  queryFormRef.value.resetFields();
-  queryParams.pageNum = 1;
-  handleQuery();
+  queryFormRef.value.resetFields()
+  queryParams.pageNum = 1
+  handleQuery()
 }
 
 /** 行checkbox 选中事件 */
 function handleSelectionChange(selection: any) {
-  ids.value = selection.map((item: any) => item.id);
+  ids.value = selection.map((item: any) => item.id)
 }
 
 /** 打开角色表单弹窗 */
 function openDialog(roleId?: number) {
-  dialog.visible = true;
+  dialog.visible = true
   if (roleId) {
-    dialog.title = "修改角色";
+    dialog.title = '修改角色'
     getRoleForm(roleId).then(({ data }) => {
-      Object.assign(formData, data);
-    });
+      Object.assign(formData, data)
+    })
   } else {
-    dialog.title = "新增角色";
+    dialog.title = '新增角色'
   }
 }
 
@@ -102,122 +102,122 @@ function openDialog(roleId?: number) {
 function handleSubmit() {
   roleFormRef.value.validate((valid: any) => {
     if (valid) {
-      loading.value = true;
-      const roleId = formData.id;
+      loading.value = true
+      const roleId = formData.id
       if (roleId) {
         updateRole(roleId, formData)
           .then(() => {
-            ElMessage.success("修改成功");
-            closeDialog();
-            resetQuery();
+            ElMessage.success('修改成功')
+            closeDialog()
+            resetQuery()
           })
-          .finally(() => (loading.value = false));
+          .finally(() => (loading.value = false))
       } else {
         addRole(formData)
           .then(() => {
-            ElMessage.success("新增成功");
-            closeDialog();
-            resetQuery();
+            ElMessage.success('新增成功')
+            closeDialog()
+            resetQuery()
           })
-          .finally(() => (loading.value = false));
+          .finally(() => (loading.value = false))
       }
     }
-  });
+  })
 }
 
 /** 关闭表单弹窗 */
 function closeDialog() {
-  dialog.visible = false;
-  resetForm();
+  dialog.visible = false
+  resetForm()
 }
 
 /** 重置表单 */
 function resetForm() {
-  roleFormRef.value.resetFields();
-  roleFormRef.value.clearValidate();
+  roleFormRef.value.resetFields()
+  roleFormRef.value.clearValidate()
 
-  formData.id = undefined;
-  formData.sort = 1;
-  formData.status = 1;
+  formData.id = undefined
+  formData.sort = 1
+  formData.status = 1
 }
 
 /** 删除角色 */
 function handleDelete(roleId?: number) {
-  const roleIds = [roleId || ids.value].join(",");
+  const roleIds = [roleId || ids.value].join(',')
   if (!roleIds) {
-    ElMessage.warning("请勾选删除项");
-    return;
+    ElMessage.warning('请勾选删除项')
+    return
   }
 
-  ElMessageBox.confirm("确认删除已选中的数据项?", "警告", {
-    confirmButtonText: "确定",
-    cancelButtonText: "取消",
-    type: "warning",
+  ElMessageBox.confirm('确认删除已选中的数据项?', '警告', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
   }).then(() => {
-    loading.value = true;
+    loading.value = true
     deleteRoles(roleIds)
       .then(() => {
-        ElMessage.success("删除成功");
-        resetQuery();
+        ElMessage.success('删除成功')
+        resetQuery()
       })
-      .finally(() => (loading.value = false));
-  });
+      .finally(() => (loading.value = false))
+  })
 }
 
 /** 打开分配菜单弹窗 */
 function openMenuDialog(row: RolePageVO) {
-  const roleId = row.id;
+  const roleId = row.id
   if (roleId) {
     checkedRole = {
       id: roleId,
-      name: row.name,
-    };
-    menuDialogVisible.value = true;
-    loading.value = true;
+      name: row.name
+    }
+    menuDialogVisible.value = true
+    loading.value = true
 
     // 获取所有的菜单
     getMenuOptions().then((response) => {
-      menuList.value = response.data;
+      menuList.value = response.data
       // 回显角色已拥有的菜单
       getRoleMenuIds(roleId)
         .then(({ data }) => {
-          const checkedMenuIds = data;
-          console.log("勾选权限", checkedMenuIds);
+          const checkedMenuIds = data
+          console.log('勾选权限', checkedMenuIds)
           checkedMenuIds.forEach((menuId) =>
             menuRef.value.setChecked(menuId, true, false)
-          );
+          )
         })
         .finally(() => {
-          loading.value = false;
-        });
-    });
+          loading.value = false
+        })
+    })
   }
 }
 
 /** 角色分配菜单保存提交 */
 function handleRoleMenuSubmit() {
-  const roleId = checkedRole.id;
+  const roleId = checkedRole.id
   if (roleId) {
     const checkedMenuIds: number[] = menuRef.value
       .getCheckedNodes(false, true)
-      .map((node: any) => node.value);
+      .map((node: any) => node.value)
 
-    loading.value = true;
+    loading.value = true
     updateRoleMenus(roleId, checkedMenuIds)
       .then(() => {
-        ElMessage.success("分配权限成功");
-        menuDialogVisible.value = false;
-        resetQuery();
+        ElMessage.success('分配权限成功')
+        menuDialogVisible.value = false
+        resetQuery()
       })
       .finally(() => {
-        loading.value = false;
-      });
+        loading.value = false
+      })
   }
 }
 
 onMounted(() => {
-  handleQuery();
-});
+  handleQuery()
+})
 </script>
 
 <template>
diff --git a/src/views/system/user/components/dept-tree.vue b/src/views/system/user/components/dept-tree.vue
index 6394b328..d0d714c2 100644
--- a/src/views/system/user/components/dept-tree.vue
+++ b/src/views/system/user/components/dept-tree.vue
@@ -21,49 +21,49 @@
 </template>
 
 <script setup lang="ts">
-import { getDeptOptions } from "@/api/dept";
+import { getDeptOptions } from '@/api/dept'
 
 const props = defineProps({
   modelValue: {
     type: [Number],
-    default: undefined,
-  },
-});
+    default: undefined
+  }
+})
 
-const deptList = ref<OptionType[]>(); // 部门列表
-const deptTreeRef = ref(ElTree); // 部门树
-const deptName = ref(); // 部门名称
+const deptList = ref<OptionType[]>() // 部门列表
+const deptTreeRef = ref(ElTree) // 部门树
+const deptName = ref() // 部门名称
 
-const emits = defineEmits(["node-click"]);
+const emits = defineEmits(['node-click'])
 
-const deptId = useVModel(props, "modelValue", emits);
+const deptId = useVModel(props, 'modelValue', emits)
 
 watchEffect(
   () => {
-    deptTreeRef.value.filter(deptName.value);
+    deptTreeRef.value.filter(deptName.value)
   },
   {
-    flush: "post", // watchEffect会在DOM挂载或者更新之前就会触发，此属性控制在DOM元素更新后运行
+    flush: 'post' // watchEffect会在DOM挂载或者更新之前就会触发，此属性控制在DOM元素更新后运行
   }
-);
+)
 
 /** 部门筛选 */
 function handleFilter(value: string, data: any) {
   if (!value) {
-    return true;
+    return true
   }
-  return data.label.indexOf(value) !== -1;
+  return data.label.indexOf(value) !== -1
 }
 
 /** 部门树节点 Click */
 function handleNodeClick(data: { [key: string]: any }) {
-  deptId.value = data.value;
-  emits("node-click");
+  deptId.value = data.value
+  emits('node-click')
 }
 
 onBeforeMount(() => {
   getDeptOptions().then((response) => {
-    deptList.value = response.data;
-  });
-});
+    deptList.value = response.data
+  })
+})
 </script>
diff --git a/src/views/system/user/index.vue b/src/views/system/user/index.vue
index 7b340e55..e044f358 100644
--- a/src/views/system/user/index.vue
+++ b/src/views/system/user/index.vue
@@ -1,9 +1,9 @@
 <!-- 用户管理 -->
 <script setup lang="ts">
 defineOptions({
-  name: "User",
-  inheritAttrs: false,
-});
+  name: 'User',
+  inheritAttrs: false
+})
 
 import {
   getUserPage,
@@ -14,141 +14,141 @@ import {
   updateUserPassword,
   downloadTemplateApi,
   exportUser,
-  importUser,
-} from "@/api/user";
-import { getDeptOptions } from "@/api/dept";
-import { getRoleOptions } from "@/api/role";
+  importUser
+} from '@/api/user'
+import { getDeptOptions } from '@/api/dept'
+import { getRoleOptions } from '@/api/role'
 
-import { UserForm, UserQuery, UserPageVO } from "@/api/user/types";
-import type { UploadInstance } from "element-plus";
-import { genFileId } from "element-plus";
+import { UserForm, UserQuery, UserPageVO } from '@/api/user/types'
+import type { UploadInstance } from 'element-plus'
+import { genFileId } from 'element-plus'
 
-const queryFormRef = ref(ElForm); // 查询表单
-const userFormRef = ref(ElForm); // 用户表单
-const uploadRef = ref<UploadInstance>(); // 上传组件
+const queryFormRef = ref(ElForm) // 查询表单
+const userFormRef = ref(ElForm) // 用户表单
+const uploadRef = ref<UploadInstance>() // 上传组件
 
-const loading = ref(false); //  加载状态
-const removeIds = ref([]); // 删除用户ID集合 用于批量删除
+const loading = ref(false) //  加载状态
+const removeIds = ref([]) // 删除用户ID集合 用于批量删除
 const queryParams = reactive<UserQuery>({
   pageNum: 1,
-  pageSize: 10,
-});
-const dateTimeRange = ref("");
-const total = ref(0); // 数据总数
-const pageData = ref<UserPageVO[]>(); // 用户分页数据
-const deptList = ref<OptionType[]>(); // 部门下拉数据源
-const roleList = ref<OptionType[]>(); // 角色下拉数据源
+  pageSize: 10
+})
+const dateTimeRange = ref('')
+const total = ref(0) // 数据总数
+const pageData = ref<UserPageVO[]>() // 用户分页数据
+const deptList = ref<OptionType[]>() // 部门下拉数据源
+const roleList = ref<OptionType[]>() // 角色下拉数据源
 
 watch(dateTimeRange, (newVal) => {
   if (newVal) {
-    queryParams.startTime = newVal[0];
-    queryParams.endTime = newVal[1];
+    queryParams.startTime = newVal[0]
+    queryParams.endTime = newVal[1]
   }
-});
+})
 
 // 弹窗对象
 const dialog = reactive({
   visible: false,
-  type: "user-form",
+  type: 'user-form',
   width: 800,
-  title: "",
-});
+  title: ''
+})
 
 // 用户表单数据
 const formData = reactive<UserForm>({
-  status: 1,
-});
+  status: 1
+})
 
 // 用户导入数据
 const importData = reactive({
   deptId: undefined,
   file: undefined,
-  fileList: [],
-});
+  fileList: []
+})
 
 // 校验规则
 const rules = reactive({
-  username: [{ required: true, message: "用户名不能为空", trigger: "blur" }],
-  nickname: [{ required: true, message: "用户昵称不能为空", trigger: "blur" }],
-  deptId: [{ required: true, message: "所属部门不能为空", trigger: "blur" }],
-  roleIds: [{ required: true, message: "用户角色不能为空", trigger: "blur" }],
+  username: [{ required: true, message: '用户名不能为空', trigger: 'blur' }],
+  nickname: [{ required: true, message: '用户昵称不能为空', trigger: 'blur' }],
+  deptId: [{ required: true, message: '所属部门不能为空', trigger: 'blur' }],
+  roleIds: [{ required: true, message: '用户角色不能为空', trigger: 'blur' }],
   email: [
     {
       pattern: /\w[-\w.+]*@([A-Za-z0-9][-A-Za-z0-9]+\.)+[A-Za-z]{2,14}/,
-      message: "请输入正确的邮箱地址",
-      trigger: "blur",
-    },
+      message: '请输入正确的邮箱地址',
+      trigger: 'blur'
+    }
   ],
   mobile: [
     {
       pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
-      message: "请输入正确的手机号码",
-      trigger: "blur",
-    },
-  ],
-});
+      message: '请输入正确的手机号码',
+      trigger: 'blur'
+    }
+  ]
+})
 
 /** 查询 */
 function handleQuery() {
-  loading.value = true;
+  loading.value = true
   getUserPage(queryParams)
     .then(({ data }) => {
-      pageData.value = data.list;
-      total.value = data.total;
+      pageData.value = data.list
+      total.value = data.total
     })
     .finally(() => {
-      loading.value = false;
-    });
+      loading.value = false
+    })
 }
 
 /** 重置查询 */
 function resetQuery() {
-  queryFormRef.value.resetFields();
-  dateTimeRange.value = "";
-  queryParams.pageNum = 1;
-  queryParams.deptId = undefined;
-  queryParams.startTime = undefined;
-  queryParams.endTime = undefined;
-  handleQuery();
+  queryFormRef.value.resetFields()
+  dateTimeRange.value = ''
+  queryParams.pageNum = 1
+  queryParams.deptId = undefined
+  queryParams.startTime = undefined
+  queryParams.endTime = undefined
+  handleQuery()
 }
 
 /** 行选中 */
 function handleSelectionChange(selection: any) {
-  removeIds.value = selection.map((item: any) => item.id);
+  removeIds.value = selection.map((item: any) => item.id)
 }
 
 /** 重置密码 */
 function resetPassword(row: { [key: string]: any }) {
   ElMessageBox.prompt(
-    "请输入用户「" + row.username + "」的新密码",
-    "重置密码",
+    '请输入用户「' + row.username + '」的新密码',
+    '重置密码',
     {
-      confirmButtonText: "确定",
-      cancelButtonText: "取消",
+      confirmButtonText: '确定',
+      cancelButtonText: '取消'
     }
   ).then(({ value }) => {
     if (!value) {
-      ElMessage.warning("请输入新密码");
-      return false;
+      ElMessage.warning('请输入新密码')
+      return false
     }
     updateUserPassword(row.id, value).then(() => {
-      ElMessage.success("密码重置成功，新密码是：" + value);
-    });
-  });
+      ElMessage.success('密码重置成功，新密码是：' + value)
+    })
+  })
 }
 
 /** 加载角色下拉数据源 */
 async function loadRoleOptions() {
   getRoleOptions().then((response) => {
-    roleList.value = response.data;
-  });
+    roleList.value = response.data
+  })
 }
 
 /** 加载部门下拉数据源 */
 async function loadDeptOptions() {
   getDeptOptions().then((response) => {
-    deptList.value = response.data;
-  });
+    deptList.value = response.data
+  })
 }
 
 /**
@@ -158,26 +158,26 @@ async function loadDeptOptions() {
  * @param id 用户ID
  */
 async function openDialog(type: string, id?: number) {
-  dialog.visible = true;
-  dialog.type = type;
+  dialog.visible = true
+  dialog.type = type
 
-  if (dialog.type === "user-form") {
+  if (dialog.type === 'user-form') {
     // 用户表单弹窗
-    await loadDeptOptions();
-    await loadRoleOptions();
+    await loadDeptOptions()
+    await loadRoleOptions()
     if (id) {
-      dialog.title = "修改用户";
+      dialog.title = '修改用户'
       getUserForm(id).then(({ data }) => {
-        Object.assign(formData, { ...data });
-      });
+        Object.assign(formData, { ...data })
+      })
     } else {
-      dialog.title = "新增用户";
+      dialog.title = '新增用户'
     }
-  } else if (dialog.type === "user-import") {
+  } else if (dialog.type === 'user-import') {
     // 用户导入弹窗
-    dialog.title = "导入用户";
-    dialog.width = 600;
-    loadDeptOptions();
+    dialog.title = '导入用户'
+    dialog.width = 600
+    loadDeptOptions()
   }
 }
 
@@ -187,150 +187,150 @@ async function openDialog(type: string, id?: number) {
  * @param type 弹窗类型  用户表单：user-form | 用户导入：user-import
  */
 function closeDialog() {
-  dialog.visible = false;
-  if (dialog.type === "user-form") {
-    userFormRef.value.resetFields();
-    userFormRef.value.clearValidate();
-
-    formData.id = undefined;
-    formData.status = 1;
-  } else if (dialog.type === "user-import") {
-    importData.file = undefined;
-    importData.fileList = [];
+  dialog.visible = false
+  if (dialog.type === 'user-form') {
+    userFormRef.value.resetFields()
+    userFormRef.value.clearValidate()
+
+    formData.id = undefined
+    formData.status = 1
+  } else if (dialog.type === 'user-import') {
+    importData.file = undefined
+    importData.fileList = []
   }
 }
 
 /** 表单提交 */
 const handleSubmit = useThrottleFn(() => {
-  if (dialog.type === "user-form") {
+  if (dialog.type === 'user-form') {
     userFormRef.value.validate((valid: any) => {
       if (valid) {
-        const userId = formData.id;
-        loading.value = true;
+        const userId = formData.id
+        loading.value = true
         if (userId) {
           updateUser(userId, formData)
             .then(() => {
-              ElMessage.success("修改用户成功");
-              closeDialog();
-              resetQuery();
+              ElMessage.success('修改用户成功')
+              closeDialog()
+              resetQuery()
             })
-            .finally(() => (loading.value = false));
+            .finally(() => (loading.value = false))
         } else {
           addUser(formData)
             .then(() => {
-              ElMessage.success("新增用户成功");
-              closeDialog();
-              resetQuery();
+              ElMessage.success('新增用户成功')
+              closeDialog()
+              resetQuery()
             })
-            .finally(() => (loading.value = false));
+            .finally(() => (loading.value = false))
         }
       }
-    });
-  } else if (dialog.type === "user-import") {
+    })
+  } else if (dialog.type === 'user-import') {
     if (!importData?.deptId) {
-      ElMessage.warning("请选择部门");
-      return false;
+      ElMessage.warning('请选择部门')
+      return false
     }
     if (!importData?.file) {
-      ElMessage.warning("上传Excel文件不能为空");
-      return false;
+      ElMessage.warning('上传Excel文件不能为空')
+      return false
     }
     importUser(importData?.deptId, importData?.file).then((response) => {
-      ElMessage.success(response.data);
-      closeDialog();
-      resetQuery();
-    });
+      ElMessage.success(response.data)
+      closeDialog()
+      resetQuery()
+    })
   }
-}, 3000);
+}, 3000)
 
 /** 删除用户 */
 function handleDelete(id?: number) {
-  const userIds = [id || removeIds.value].join(",");
+  const userIds = [id || removeIds.value].join(',')
   if (!userIds) {
-    ElMessage.warning("请勾选删除项");
-    return;
+    ElMessage.warning('请勾选删除项')
+    return
   }
 
-  ElMessageBox.confirm("确认删除用户?", "警告", {
-    confirmButtonText: "确定",
-    cancelButtonText: "取消",
-    type: "warning",
+  ElMessageBox.confirm('确认删除用户?', '警告', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
   }).then(function () {
     deleteUsers(userIds).then(() => {
-      ElMessage.success("删除成功");
-      resetQuery();
-    });
-  });
+      ElMessage.success('删除成功')
+      resetQuery()
+    })
+  })
 }
 
 /** 下载导入模板 */
 function downloadTemplate() {
   downloadTemplateApi().then((response: any) => {
-    const fileData = response.data;
+    const fileData = response.data
     const fileName = decodeURI(
-      response.headers["content-disposition"].split(";")[1].split("=")[1]
-    );
+      response.headers['content-disposition'].split(';')[1].split('=')[1]
+    )
     const fileType =
-      "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8";
+      'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'
 
-    const blob = new Blob([fileData], { type: fileType });
-    const downloadUrl = window.URL.createObjectURL(blob);
+    const blob = new Blob([fileData], { type: fileType })
+    const downloadUrl = window.URL.createObjectURL(blob)
 
-    const downloadLink = document.createElement("a");
-    downloadLink.href = downloadUrl;
-    downloadLink.download = fileName;
+    const downloadLink = document.createElement('a')
+    downloadLink.href = downloadUrl
+    downloadLink.download = fileName
 
-    document.body.appendChild(downloadLink);
-    downloadLink.click();
+    document.body.appendChild(downloadLink)
+    downloadLink.click()
 
-    document.body.removeChild(downloadLink);
-    window.URL.revokeObjectURL(downloadUrl);
-  });
+    document.body.removeChild(downloadLink)
+    window.URL.revokeObjectURL(downloadUrl)
+  })
 }
 
 /** Excel文件 Change */
 function handleFileChange(file: any) {
-  importData.file = file.raw;
-  console.log(importData.file);
+  importData.file = file.raw
+  console.log(importData.file)
 }
 
 /** Excel文件 Exceed  */
 function handleFileExceed(files: any) {
-  uploadRef.value!.clearFiles();
-  const file = files[0];
-  file.uid = genFileId();
-  uploadRef.value!.handleStart(file);
-  importData.file = file;
+  uploadRef.value!.clearFiles()
+  const file = files[0]
+  file.uid = genFileId()
+  uploadRef.value!.handleStart(file)
+  importData.file = file
 }
 
 /** 导出用户 */
 function handleExport() {
   exportUser(queryParams).then((response: any) => {
-    const fileData = response.data;
+    const fileData = response.data
     const fileName = decodeURI(
-      response.headers["content-disposition"].split(";")[1].split("=")[1]
-    );
+      response.headers['content-disposition'].split(';')[1].split('=')[1]
+    )
     const fileType =
-      "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8";
+      'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'
 
-    const blob = new Blob([fileData], { type: fileType });
-    const downloadUrl = window.URL.createObjectURL(blob);
+    const blob = new Blob([fileData], { type: fileType })
+    const downloadUrl = window.URL.createObjectURL(blob)
 
-    const downloadLink = document.createElement("a");
-    downloadLink.href = downloadUrl;
-    downloadLink.download = fileName;
+    const downloadLink = document.createElement('a')
+    downloadLink.href = downloadUrl
+    downloadLink.download = fileName
 
-    document.body.appendChild(downloadLink);
-    downloadLink.click();
+    document.body.appendChild(downloadLink)
+    downloadLink.click()
 
-    document.body.removeChild(downloadLink);
-    window.URL.revokeObjectURL(downloadUrl);
-  });
+    document.body.removeChild(downloadLink)
+    window.URL.revokeObjectURL(downloadUrl)
+  })
 }
 
 onMounted(() => {
-  handleQuery();
-});
+  handleQuery()
+})
 </script>
 
 <template>
@@ -479,7 +479,7 @@ onMounted(() => {
             <el-table-column label="状态" align="center" prop="status">
               <template #default="scope">
                 <el-tag :type="scope.row.status == 1 ? 'success' : 'info'">{{
-                  scope.row.status == 1 ? "启用" : "禁用"
+                  scope.row.status == 1 ? '启用' : '禁用'
                 }}</el-tag>
               </template>
             </el-table-column>
diff --git a/uno.config.ts b/uno.config.ts
index 346dc505..db15beef 100644
--- a/uno.config.ts
+++ b/uno.config.ts
@@ -7,18 +7,19 @@ import {
   presetUno,
   presetWebFonts,
   transformerDirectives,
-  transformerVariantGroup,
-} from "unocss";
+  transformerVariantGroup
+} from 'unocss'
+import { presetRemToPx } from '@unocss/preset-rem-to-px'
 
 export default defineConfig({
   shortcuts: {
-    "flex-center": "flex justify-center items-center",
+    'flex-center': 'flex justify-center items-center'
   },
   theme: {
     colors: {
-      primary: "var(--el-color-primary)",
-      primary_dark: "var(--el-color-primary-light-5)",
-    },
+      primary: 'var(--el-color-primary)',
+      primary_dark: 'var(--el-color-primary-light-5)'
+    }
   },
   presets: [
     presetUno(),
@@ -28,8 +29,11 @@ export default defineConfig({
     presetWebFonts({
       fonts: {
         // ...
-      },
+      }
     }),
+    presetRemToPx({
+      baseFontSize: 16
+    })
   ],
-  transformers: [transformerDirectives(), transformerVariantGroup()],
-});
+  transformers: [transformerDirectives(), transformerVariantGroup()]
+})
diff --git a/vite.config.ts b/vite.config.ts
index 6696f5ff..be004f61 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,30 +1,30 @@
-import vue from "@vitejs/plugin-vue";
-import { UserConfig, ConfigEnv, loadEnv, defineConfig } from "vite";
+import vue from '@vitejs/plugin-vue'
+import { UserConfig, ConfigEnv, loadEnv, defineConfig } from 'vite'
 
-import AutoImport from "unplugin-auto-import/vite";
-import Components from "unplugin-vue-components/vite";
-import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
+import AutoImport from 'unplugin-auto-import/vite'
+import Components from 'unplugin-vue-components/vite'
+import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
 
-import Icons from "unplugin-icons/vite";
-import IconsResolver from "unplugin-icons/resolver";
+import Icons from 'unplugin-icons/vite'
+import IconsResolver from 'unplugin-icons/resolver'
 
-import { createSvgIconsPlugin } from "vite-plugin-svg-icons";
+import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'
 
-import { viteMockServe } from "vite-plugin-mock";
-import vueJsx from "@vitejs/plugin-vue-jsx";
+import { viteMockServe } from 'vite-plugin-mock'
+import vueJsx from '@vitejs/plugin-vue-jsx'
 
-import UnoCSS from "unocss/vite";
-import { resolve } from "path";
+import UnoCSS from 'unocss/vite'
+import { resolve } from 'path'
 
-const pathSrc = resolve(__dirname, "src");
+const pathSrc = resolve(__dirname, 'src')
 //  https://cn.vitejs.dev/config
 export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
-  const env = loadEnv(mode, process.cwd());
+  const env = loadEnv(mode, process.cwd())
   return {
     resolve: {
       alias: {
-        "@": pathSrc,
-      },
+        '@': pathSrc
+      }
     },
     css: {
       // CSS 预处理器
@@ -34,13 +34,13 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
           javascriptEnabled: true,
           additionalData: `
             @use "@/styles/variables.scss" as *;
-          `,
-        },
-      },
+          `
+        }
+      }
     },
     server: {
       // 允许IP访问
-      host: "0.0.0.0",
+      host: '0.0.0.0',
       // 应用端口 (默认:3000)
       port: Number(env.VITE_APP_PORT),
       // 运行是否自动打开浏览器
@@ -52,35 +52,36 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
          *
          * env.VITE_APP_BASE_API: /dev-api
          * env.VITE_APP_API_URL: http://localhost:8989
+         *如果用Mock数据需要注释代理
          */
-        [env.VITE_APP_BASE_API]: {
-          changeOrigin: true,
-          target: env.VITE_APP_API_URL,
-          rewrite: (path) =>
-            path.replace(new RegExp("^" + env.VITE_APP_BASE_API), ""),
-        },
-      },
+        // [env.VITE_APP_BASE_API]: {
+        //   changeOrigin: true,
+        //   target: env.VITE_APP_API_URL,
+        //   rewrite: (path) =>
+        //     path.replace(new RegExp("^" + env.VITE_APP_BASE_API), ""),
+        // },
+      }
     },
     plugins: [
       vue(),
       vueJsx(),
       UnoCSS({
-        hmrTopLevelAwait: false,
+        hmrTopLevelAwait: false
       }),
       // 自动导入参考： https://github.com/sxzz/element-plus-best-practices/blob/main/vite.config.ts
       AutoImport({
         // 自动导入 Vue 相关函数，如：ref, reactive, toRef 等
-        imports: ["vue", "@vueuse/core"],
+        imports: ['vue', '@vueuse/core'],
         // 自动导入 Element Plus 相关函数，如：ElMessage, ElMessageBox... (带样式)
         resolvers: [ElementPlusResolver(), IconsResolver({})],
         eslintrc: {
           enabled: false,
-          filepath: "./.eslintrc-auto-import.json",
-          globalsPropValue: true,
+          filepath: './.eslintrc-auto-import.json',
+          globalsPropValue: true
         },
         vueTemplate: true,
         // 配置文件生成位置(false:关闭自动生成)
-        dts: false,
+        dts: false
         // dts: "src/typings/auto-imports.d.ts",
       }),
 
@@ -89,136 +90,143 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
           // 自动导入 Element Plus 组件
           ElementPlusResolver(),
           // 自动注册图标组件
-          IconsResolver({ enabledCollections: ["ep"] }),
+          IconsResolver({ enabledCollections: ['ep'] })
         ],
         // 指定自定义组件位置(默认:src/components)
-        dirs: ["src/components", "src/**/components"],
+        dirs: ['src/components', 'src/**/components'],
         // 配置文件位置 (false:关闭自动生成)
-        dts: false,
+        dts: false
         // dts: "src/typings/components.d.ts",
       }),
 
       Icons({
-        autoInstall: true,
+        autoInstall: true
       }),
       createSvgIconsPlugin({
         // 指定需要缓存的图标文件夹
-        iconDirs: [resolve(pathSrc, "assets/icons")],
+        iconDirs: [resolve(pathSrc, 'assets/icons')],
         // 指定symbolId格式
-        symbolId: "icon-[dir]-[name]",
+        symbolId: 'icon-[dir]-[name]'
       }),
       viteMockServe({
         ignore: /^\_/,
-        mockPath: "mock",
-        enable: mode === "development",
-      }),
+        mockPath: 'mock',
+        // 是否实时更新
+        watchFiles: true,
+        // localEnabled: mode === "development",
+        localEnabled: true, // 是否应用于本地
+        prodEnabled: false // 是否应用于生产
+      })
     ],
     // 预加载项目必需的组件
     optimizeDeps: {
       include: [
-        "vue",
-        "vue-router",
-        "pinia",
-        "axios",
-        "element-plus/es/components/form/style/css",
-        "element-plus/es/components/form-item/style/css",
-        "element-plus/es/components/button/style/css",
-        "element-plus/es/components/input/style/css",
-        "element-plus/es/components/input-number/style/css",
-        "element-plus/es/components/switch/style/css",
-        "element-plus/es/components/upload/style/css",
-        "element-plus/es/components/menu/style/css",
-        "element-plus/es/components/col/style/css",
-        "element-plus/es/components/icon/style/css",
-        "element-plus/es/components/row/style/css",
-        "element-plus/es/components/tag/style/css",
-        "element-plus/es/components/dialog/style/css",
-        "element-plus/es/components/loading/style/css",
-        "element-plus/es/components/radio/style/css",
-        "element-plus/es/components/radio-group/style/css",
-        "element-plus/es/components/popover/style/css",
-        "element-plus/es/components/scrollbar/style/css",
-        "element-plus/es/components/tooltip/style/css",
-        "element-plus/es/components/dropdown/style/css",
-        "element-plus/es/components/dropdown-menu/style/css",
-        "element-plus/es/components/dropdown-item/style/css",
-        "element-plus/es/components/sub-menu/style/css",
-        "element-plus/es/components/menu-item/style/css",
-        "element-plus/es/components/divider/style/css",
-        "element-plus/es/components/card/style/css",
-        "element-plus/es/components/link/style/css",
-        "element-plus/es/components/breadcrumb/style/css",
-        "element-plus/es/components/breadcrumb-item/style/css",
-        "element-plus/es/components/table/style/css",
-        "element-plus/es/components/tree-select/style/css",
-        "element-plus/es/components/table-column/style/css",
-        "element-plus/es/components/select/style/css",
-        "element-plus/es/components/option/style/css",
-        "element-plus/es/components/pagination/style/css",
-        "element-plus/es/components/tree/style/css",
-        "element-plus/es/components/alert/style/css",
-        "element-plus/es/components/radio-button/style/css",
-        "element-plus/es/components/checkbox-group/style/css",
-        "element-plus/es/components/checkbox/style/css",
-        "element-plus/es/components/tabs/style/css",
-        "element-plus/es/components/tab-pane/style/css",
-        "element-plus/es/components/rate/style/css",
-        "element-plus/es/components/date-picker/style/css",
-        "element-plus/es/components/notification/style/css",
-        "element-plus/es/components/image/style/css",
-        "element-plus/es/components/statistic/style/css",
-        "element-plus/es/components/watermark/style/css",
-        "element-plus/es/components/config-provider/style/css",
-        "@vueuse/core",
-        "sortablejs",
-        "path-to-regexp",
-        "echarts",
-        "@wangeditor/editor",
-        "@wangeditor/editor-for-vue",
-        "vue-i18n",
-      ],
+        'vue',
+        'vue-router',
+        'pinia',
+        'axios',
+        'element-plus/es/components/form/style/css',
+        'element-plus/es/components/form-item/style/css',
+        'element-plus/es/components/button/style/css',
+        'element-plus/es/components/input/style/css',
+        'element-plus/es/components/input-number/style/css',
+        'element-plus/es/components/switch/style/css',
+        'element-plus/es/components/upload/style/css',
+        'element-plus/es/components/menu/style/css',
+        'element-plus/es/components/col/style/css',
+        'element-plus/es/components/icon/style/css',
+        'element-plus/es/components/row/style/css',
+        'element-plus/es/components/tag/style/css',
+        'element-plus/es/components/dialog/style/css',
+        'element-plus/es/components/loading/style/css',
+        'element-plus/es/components/radio/style/css',
+        'element-plus/es/components/radio-group/style/css',
+        'element-plus/es/components/popover/style/css',
+        'element-plus/es/components/scrollbar/style/css',
+        'element-plus/es/components/tooltip/style/css',
+        'element-plus/es/components/dropdown/style/css',
+        'element-plus/es/components/dropdown-menu/style/css',
+        'element-plus/es/components/dropdown-item/style/css',
+        'element-plus/es/components/sub-menu/style/css',
+        'element-plus/es/components/menu-item/style/css',
+        'element-plus/es/components/divider/style/css',
+        'element-plus/es/components/card/style/css',
+        'element-plus/es/components/link/style/css',
+        'element-plus/es/components/breadcrumb/style/css',
+        'element-plus/es/components/breadcrumb-item/style/css',
+        'element-plus/es/components/table/style/css',
+        'element-plus/es/components/tree-select/style/css',
+        'element-plus/es/components/table-column/style/css',
+        'element-plus/es/components/select/style/css',
+        'element-plus/es/components/option/style/css',
+        'element-plus/es/components/pagination/style/css',
+        'element-plus/es/components/tree/style/css',
+        'element-plus/es/components/alert/style/css',
+        'element-plus/es/components/radio-button/style/css',
+        'element-plus/es/components/checkbox-group/style/css',
+        'element-plus/es/components/checkbox/style/css',
+        'element-plus/es/components/tabs/style/css',
+        'element-plus/es/components/tab-pane/style/css',
+        'element-plus/es/components/rate/style/css',
+        'element-plus/es/components/date-picker/style/css',
+        'element-plus/es/components/notification/style/css',
+        'element-plus/es/components/image/style/css',
+        'element-plus/es/components/statistic/style/css',
+        'element-plus/es/components/watermark/style/css',
+        'element-plus/es/components/config-provider/style/css',
+        '@vueuse/core',
+        'sortablejs',
+        'path-to-regexp',
+        'echarts',
+        '@wangeditor/editor',
+        '@wangeditor/editor-for-vue',
+        'vue-i18n'
+      ]
     },
     // 构建配置
     build: {
       chunkSizeWarningLimit: 2000, // 消除打包大小超过500kb警告
-      minify: "terser", // Vite 2.6.x 以上需要配置 minify: "terser", terserOptions 才能生效
+      minify: 'terser', // Vite 2.6.x 以上需要配置 minify: "terser", terserOptions 才能生效
       terserOptions: {
         compress: {
           keep_infinity: true, // 防止 Infinity 被压缩成 1/0，这可能会导致 Chrome 上的性能问题
           drop_console: true, // 生产环境去除 console
-          drop_debugger: true, // 生产环境去除 debugger
+          drop_debugger: true // 生产环境去除 debugger
         },
         format: {
-          comments: false, // 删除注释
-        },
+          comments: false // 删除注释
+        }
       },
       rollupOptions: {
         output: {
-          // manualChunks: {
-          //   "vue-i18n": ["vue-i18n"],
-          // },
+          manualChunks: {
+            echarts: ['echarts'],
+            'element-plus': ['element-plus'],
+            'vue-i18n': ['vue-i18n'],
+            '@vueuse-core': ['@vueuse/core']
+          },
           // 用于从入口点创建的块的打包输出格式[name]表示文件名,[hash]表示该文件内容hash值
-          entryFileNames: "js/[name].[hash].js",
+          entryFileNames: 'js/[name].[hash].js',
           // 用于命名代码拆分时创建的共享块的输出命名
-          chunkFileNames: "js/[name].[hash].js",
+          chunkFileNames: 'js/[name].[hash].js',
           // 用于输出静态资源的命名，[ext]表示文件扩展名
           assetFileNames: (assetInfo: any) => {
-            const info = assetInfo.name.split(".");
-            let extType = info[info.length - 1];
+            const info = assetInfo.name.split('.')
+            let extType = info[info.length - 1]
             // console.log('文件信息', assetInfo.name)
             if (
               /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/i.test(assetInfo.name)
             ) {
-              extType = "media";
+              extType = 'media'
             } else if (/\.(png|jpe?g|gif|svg)(\?.*)?$/.test(assetInfo.name)) {
-              extType = "img";
+              extType = 'img'
             } else if (/\.(woff2?|eot|ttf|otf)(\?.*)?$/i.test(assetInfo.name)) {
-              extType = "fonts";
+              extType = 'fonts'
             }
-            return `${extType}/[name].[hash].[ext]`;
-          },
-        },
-      },
-    },
-  };
-});
+            return `${extType}/[name].[hash].[ext]`
+          }
+        }
+      }
+    }
+  }
+})
-- 
Gitee