release: update 6.0.0

release: update `5.2.0`

.browserslistrc

@@ -0,0 +1,4 @@
+> 1%
+last 2 versions
+not dead
+not ie 11

.dockerignore

@@ -0,0 +1,21 @@
+node_modules
+.DS_Store
+dist
+dist-ssr
+*.local
+.eslintcache
+report.html
+
+yarn.lock
+npm-debug.log*
+.pnpm-error.log*
+.pnpm-debug.log
+tests/**/coverage/
+
+# Editor directories and files
+.idea
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+tsconfig.tsbuildinfo

.env

@@ -1,2 +1,5 @@
-# 项目本地运行端口号
+# 平台本地运行端口号
 VITE_PORT = 8848
+
+# 是否隐藏首页 隐藏 true 不隐藏 false （勿删除，VITE_HIDE_HOME只需在.env文件配置）
+VITE_HIDE_HOME = false

.env.development

@@ -1,14 +1,8 @@
-# 项目本地运行端口号
+# 平台本地运行端口号
 VITE_PORT = 8848
 
 # 开发环境读取配置文件路径
 VITE_PUBLIC_PATH = /
 
-# 开发环境代理
+# 开发环境路由历史模式（Hash模式传"hash"、HTML5模式传"h5"、Hash模式带base参数传"hash,base参数"、HTML5模式带base参数传"h5,base参数"）
-VITE_PROXY_DOMAIN = /api
-
-# 开发环境路由历史模式
 VITE_ROUTER_HISTORY = "hash"
-
-# 开发环境后端地址
-VITE_PROXY_DOMAIN_REAL = "http://127.0.0.1:3000"

.env.production

@@ -1,11 +1,13 @@
-# 线上环境项目打包路径
+# 线上环境平台打包路径
 VITE_PUBLIC_PATH = /
 
-# 线上环境路由历史模式
+# 线上环境路由历史模式（Hash模式传"hash"、HTML5模式传"h5"、Hash模式带base参数传"hash,base参数"、HTML5模式带base参数传"h5,base参数"）
 VITE_ROUTER_HISTORY = "hash"
 
-# 线上环境后端地址
+# 是否在打包时使用cdn替换本地库 替换 true 不替换 false
-VITE_PROXY_DOMAIN_REAL = ""
+VITE_CDN = false
 
-# 是否为打包后的文件提供传统浏览器兼容性支持 支持 true 不支持 false
+# 是否启用gzip压缩或brotli压缩（分两种情况，删除原始文件和不删除原始文件）
-VITE_LEGACY = false
+# 压缩时不删除原始文件的配置：gzip、brotli、both（同时开启 gzip 与 brotli 压缩）、none（不开启压缩，默认）
+# 压缩时删除原始文件的配置：gzip-clear、brotli-clear、both-clear（同时开启 gzip 与 brotli 压缩）、none（不开启压缩，默认）
+VITE_COMPRESSION = "none"

.env.staging

@@ -1,14 +1,16 @@
 # 预发布也需要生产环境的行为
 # https://cn.vitejs.dev/guide/env-and-mode.html#modes
-NODE_ENV=production
+# NODE_ENV = development
 
 VITE_PUBLIC_PATH = /
 
-# 线上环境路由历史模式
+# 预发布环境路由历史模式（Hash模式传"hash"、HTML5模式传"h5"、Hash模式带base参数传"hash,base参数"、HTML5模式带base参数传"h5,base参数"）
 VITE_ROUTER_HISTORY = "hash"
 
-# 线上环境后端地址
+# 是否在打包时使用cdn替换本地库 替换 true 不替换 false
-VITE_PROXY_DOMAIN_REAL = ""
+VITE_CDN = true
 
-# 是否为打包后的文件提供传统浏览器兼容性支持 支持 true 不支持 false
+# 是否启用gzip压缩或brotli压缩（分两种情况，删除原始文件和不删除原始文件）
-VITE_LEGACY = false
+# 压缩时不删除原始文件的配置：gzip、brotli、both（同时开启 gzip 与 brotli 压缩）、none（不开启压缩，默认）
+# 压缩时删除原始文件的配置：gzip-clear、brotli-clear、both-clear（同时开启 gzip 与 brotli 压缩）、none（不开启压缩，默认）
+VITE_COMPRESSION = "none"

.eslintignore

@@ -1,4 +0,0 @@
-public
-dist
-*.d.ts
-package.json

.eslintrc.js

@@ -1,120 +0,0 @@
-module.exports = {
-  root: true,
-  env: {
-    node: true
-  },
-  globals: {
-    // Ref sugar (take 2)
-    $: "readonly",
-    $$: "readonly",
-    $ref: "readonly",
-    $shallowRef: "readonly",
-    $computed: "readonly",
-
-    // index.d.ts
-    // global.d.ts
-    Fn: "readonly",
-    PromiseFn: "readonly",
-    RefType: "readonly",
-    LabelValueOptions: "readonly",
-    EmitType: "readonly",
-    TargetContext: "readonly",
-    ComponentElRef: "readonly",
-    ComponentRef: "readonly",
-    ElRef: "readonly",
-    global: "readonly",
-    ForDataType: "readonly",
-    ComponentRoutes: "readonly",
-
-    // script setup
-    defineProps: "readonly",
-    defineEmits: "readonly",
-    defineExpose: "readonly",
-    withDefaults: "readonly"
-  },
-  extends: [
-    "plugin:vue/vue3-essential",
-    "eslint:recommended",
-    "@vue/typescript/recommended",
-    "@vue/prettier",
-    "@vue/eslint-config-typescript"
-  ],
-  parser: "vue-eslint-parser",
-  parserOptions: {
-    parser: "@typescript-eslint/parser",
-    ecmaVersion: 2020,
-    sourceType: "module",
-    jsxPragma: "React",
-    ecmaFeatures: {
-      jsx: true
-    }
-  },
-  overrides: [
-    {
-      files: ["*.ts", "*.vue"],
-      rules: {
-        "no-undef": "off"
-      }
-    },
-    {
-      files: ["*.vue"],
-      parser: "vue-eslint-parser",
-      parserOptions: {
-        parser: "@typescript-eslint/parser",
-        extraFileExtensions: [".vue"],
-        ecmaVersion: "latest",
-        ecmaFeatures: {
-          jsx: true
-        }
-      },
-      rules: {
-        "no-undef": "off"
-      }
-    }
-  ],
-  rules: {
-    "vue/no-v-html": "off",
-    "vue/require-default-prop": "off",
-    "vue/require-explicit-emits": "off",
-    "vue/multi-word-component-names": "off",
-    "@typescript-eslint/no-explicit-any": "off", // any
-    "no-debugger": "off",
-    "@typescript-eslint/explicit-module-boundary-types": "off", // setup()
-    "@typescript-eslint/ban-types": "off",
-    "@typescript-eslint/ban-ts-comment": "off",
-    "@typescript-eslint/no-empty-function": "off",
-    "@typescript-eslint/no-non-null-assertion": "off",
-    "vue/html-self-closing": [
-      "error",
-      {
-        html: {
-          void: "always",
-          normal: "always",
-          component: "always"
-        },
-        svg: "always",
-        math: "always"
-      }
-    ],
-    "@typescript-eslint/no-unused-vars": [
-      "error",
-      {
-        argsIgnorePattern: "^_",
-        varsIgnorePattern: "^_"
-      }
-    ],
-    "no-unused-vars": [
-      "error",
-      {
-        argsIgnorePattern: "^_",
-        varsIgnorePattern: "^_"
-      }
-    ],
-    "prettier/prettier": [
-      "error",
-      {
-        endOfLine: "auto"
-      }
-    ]
-  }
-};

.gitignore

@@ -5,6 +5,7 @@ dist-ssr
 *.local
 .eslintcache
 report.html
+vite.config.*.timestamp*
 
 yarn.lock
 npm-debug.log*

.husky/commit-msg

@@ -3,4 +3,6 @@
 # shellcheck source=./_/husky.sh
 . "$(dirname "$0")/_/husky.sh"
 
+PATH="/usr/local/bin:$PATH"
+
 npx --no-install commitlint --edit "$1"

.husky/lintstagedrc.js

@@ -1,8 +0,0 @@
-module.exports = {
-  "*.{js,jsx,ts,tsx}": ["eslint --fix", "prettier --write"],
-  "{!(package)*.json,.!(browserslist)*rc}": ["prettier --write--parser json"],
-  "package.json": ["prettier --write"],
-  "*.vue": ["eslint --fix", "prettier --write", "stylelint --fix"],
-  "*.{vue,css,scss,postcss,less}": ["stylelint --fix", "prettier --write"],
-  "*.md": ["prettier --write"]
-};

.husky/pre-commit

@@ -4,7 +4,7 @@
 
 [ -n "$CI" ] && exit 0
 
-# Format and submit code according to lintstagedrc.js configuration
+PATH="/usr/local/bin:$PATH"
-npm run lint:lint-staged
 
-npm run lint:pretty
+# Perform lint check on files in the staging area through .lintstagedrc configuration
+pnpm exec lint-staged

.lintstagedrc

@@ -0,0 +1,20 @@
+{
+  "*.{js,jsx,ts,tsx}": [
+    "prettier --cache --ignore-unknown  --write",
+    "eslint --cache --fix"
+  ],
+  "{!(package)*.json,*.code-snippets,.!({browserslist,npm,nvm})*rc}": [
+    "prettier --cache --write--parser json"
+  ],
+  "package.json": ["prettier --cache --write"],
+  "*.vue": [
+    "prettier --write",
+    "eslint --cache --fix",
+    "stylelint --fix --allow-empty-input"
+  ],
+  "*.{css,scss,html}": [
+    "prettier --cache --ignore-unknown --write",
+    "stylelint --fix --allow-empty-input"
+  ],
+  "*.md": ["prettier --cache --ignore-unknown --write"]
+}

.npmrc

@@ -0,0 +1,4 @@
+shell-emulator=true
+shamefully-hoist=true
+enable-pre-post-scripts=false
+strict-peer-dependencies=false

.nvmrc

@@ -0,0 +1 @@
+v22.14.0

.prettierrc.js

@@ -1,4 +1,7 @@
-module.exports = {
+// @ts-check
+
+/** @type {import("prettier").Config} */
+export default {
   bracketSpacing: true,
   singleQuote: false,
   arrowParens: "avoid",

.stylelintignore

@@ -1,3 +1,4 @@
 /dist/*
 /public/*
 public/*
+src/style/reset.scss

.vscode/extensions.json

@@ -1,15 +1,19 @@
 {
   "recommendations": [
+    "christian-kohler.path-intellisense",
+    "warmthsea.vscode-custom-code-color",
     "vscode-icons-team.vscode-icons",
     "davidanson.vscode-markdownlint",
+    "ms-azuretools.vscode-docker",
     "stylelint.vscode-stylelint",
+    "bradlc.vscode-tailwindcss",
     "dbaeumer.vscode-eslint",
     "esbenp.prettier-vscode",
-    "lokalise.i18n-ally",
+    "redhat.vscode-yaml",
+    "csstools.postcss",
     "mikestead.dotenv",
     "eamodio.gitlens",
     "antfu.iconify",
-    "antfu.unocss",
     "Vue.volar"
   ]
 }

.vscode/settings.json

@@ -6,6 +6,7 @@
   },
   "editor.tabSize": 2,
   "editor.formatOnPaste": true,
+  "editor.guides.bracketPairs": "active",
   "files.autoSave": "afterDelay",
   "git.confirmSync": false,
   "workbench.startupEditor": "newUntitledFile",
@@ -24,15 +25,19 @@
     "editor.defaultFormatter": "esbenp.prettier-vscode"
   },
   "editor.codeActionsOnSave": {
-    "source.fixAll.eslint": true
+    "source.fixAll.eslint": "explicit"
   },
-  "i18n-ally.localesPaths": "locales",
+  "iconify.excludes": [
-  "i18n-ally.keystyle": "nested",
+    "el"
-  "i18n-ally.sortKeys": true,
+  ],
-  "i18n-ally.namespace": true,
+  "vscodeCustomCodeColor.highlightValue": [
-  "i18n-ally.enabledParsers": ["yaml", "js"],
+    "v-loading",
-  "i18n-ally.sourceLanguage": "en",
+    "v-auth",
-  "i18n-ally.displayLanguage": "zh-CN",
+    "v-copy",
-  "i18n-ally.enabledFrameworks": ["vue"],
+    "v-longpress",
-  "iconify.excludes": ["el"]
+    "v-optimize",
+    "v-perms",
+    "v-ripple"
+  ],
+  "vscodeCustomCodeColor.highlightValueColor": "#b392f0",
 }

.vscode/vue3.0.code-snippets

@@ -1,19 +1,19 @@
 {
   "Vue3.0快速生成模板": {
+    "scope": "vue",
     "prefix": "Vue3.0",
     "body": [
       "<template>",
-      "\t<div>\n",
+      "\t<div>test</div>",
-      "\t</div>",
       "</template>\n",
       "<script lang='ts'>",
       "export default {",
       "\tsetup() {",
-      "\t\treturn{\n\n\t\t}",
+      "\t\treturn {}",
-      "\t},",
+      "\t}",
       "}",
       "</script>\n",
-      "<style scoped>\n",
+      "<style lang='scss' scoped>\n",
       "</style>",
       "$2"
     ],

.vscode/vue3.2.code-snippets

@@ -1,14 +1,14 @@
 {
   "Vue3.2+快速生成模板": {
+    "scope": "vue",
     "prefix": "Vue3.2+",
     "body": [
       "<script setup lang='ts'>",
       "</script>\n",
       "<template>",
-      "\t<div>\n",
+      "\t<div>test</div>",
-      "\t</div>",
       "</template>\n",
-      "<style scoped>\n",
+      "<style lang='scss' scoped>\n",
       "</style>",
       "$2"
     ],

.vscode/vue3.3.code-snippets

@@ -0,0 +1,20 @@
+{
+  "Vue3.3+defineOptions快速生成模板": {
+    "scope": "vue",
+    "prefix": "Vue3.3+",
+    "body": [
+      "<script setup lang='ts'>",
+      "defineOptions({",
+      "\tname: ''",
+      "})",
+      "</script>\n",
+      "<template>",
+      "\t<div>test</div>",
+      "</template>\n",
+      "<style lang='scss' scoped>\n",
+      "</style>",
+      "$2"
+    ],
+    "description": "Vue3.3+defineOptions快速生成模板"
+  }
+}

Dockerfile

@@ -0,0 +1,20 @@
+FROM node:20-alpine as build-stage
+
+WORKDIR /app
+RUN corepack enable
+RUN corepack prepare pnpm@latest --activate
+
+RUN npm config set registry https://registry.npmmirror.com
+
+COPY .npmrc package.json pnpm-lock.yaml ./
+RUN pnpm install --frozen-lockfile
+
+COPY . .
+RUN pnpm build
+
+FROM nginx:stable-alpine as production-stage
+
+COPY --from=build-stage /app/dist /usr/share/nginx/html
+EXPOSE 80
+
+CMD ["nginx", "-g", "daemon off;"]

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2022 啝裳
+Copyright (c) 2020-present, pure-admin
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.en-US.md

@@ -1,47 +1,47 @@
-<h1>vue-pure-admin Lite Edition</h1>
+<h1>vue-pure-admin Lite Edition（no i18n version）</h1>
 
-[![license](https://img.shields.io/github/license/xiaoxian521/vue-pure-admin.svg)](LICENSE)
+[![license](https://img.shields.io/github/license/pure-admin/vue-pure-admin.svg)](LICENSE)
 
 **English** | [中文](./README.md)
 
-## introduce
+## Introduce
 
-The lite version is based on the shelf extracted from [vue-pure-admin](https://github.com/xiaoxian521/vue-pure-admin), which contains the main functions and is more suitable for actual project development, the packaged size is only `3MB`
+The simplified version is based on the shelf extracted from [vue-pure-admin](https://github.com/pure-admin/vue-pure-admin), which contains main functions and is more suitable for actual project development. The packaged size is introduced globally [element-plus](https://element-plus.org) is still below `2.3MB`, and the full version of the code will be permanently synchronized. After enabling `brotli` compression and `cdn` to replace the local library mode, the package size is less than `350kb`
 
-## Supporting Video
+## `js` version
 
-- [Click Watch Tutorial](https://www.bilibili.com/video/BV1534y1S7HV)
+[Click me to view js version](https://pure-admin.cn/pages/js/)
-- [Click Watch UI Design](https://www.bilibili.com/video/BV17g411T7rq)
 
-## Docs
+## `max` version
 
-- [Click Watch Docs](https://pure-admin-doc.vercel.app)
+[Click me to view the max version](https://pure-admin.cn/pages/max/)
 
-## Usage
+## Supporting video
 
-### Installation dependencies
+[Click me to view UI design](https://www.bilibili.com/video/BV17g411T7rq)  
+[Click me to view the rapid development tutorial](https://www.bilibili.com/video/BV1kg411v7QT)
 
-pnpm install
+## Nanny-level documents
 
-### Install a package
+[Click me to view vue-pure-admin documentation](https://pure-admin.cn/)  
+[Click me to view @pureadmin/utils documentation](https://pure-admin-utils.netlify.app)
 
-pnpm add packageName
+## Quality service, software outsourcing, sponsorship support
 
-### Uninstall a package
+[Click me to view details](https://pure-admin.cn/pages/service/)
 
-pnpm remove packageName
+## Preview
 
-I think you should fork the project first to develop, so that you can pull the update synchronously when I update! ! !
+[Click me to view the preview station](https://pure-admin-thin.netlify.app/#/login)
 
-## Supporting video tutorial
+## Maintainer
 
-bilibili: https://www.bilibili.com/video/BV1534y1S7HV/
+[xiaoxian521](https://github.com/xiaoxian521)
 
 ## ⚠️ Attention
 
-- The Lite version does not accept any issues and prs. If you have any questions, please go to the full version https://github.com/xiaoxian521/vue-pure-admin/issues/new/choose to mention, thank you! ! !
+The Lite version does not accept any issues and prs. If you have any questions, please go to the full version [issues](https://github.com/pure-admin/vue-pure-admin/issues/new/choose) to mention, thank you!
-- Don't use the `delete-i18n` branch code, this branch is just for you to completely delete the internationalized references, it won't sync the code! ! ! [Completely remove the internationalization tutorial](https://www.bilibili.com/video/BV1Ru411B7k3/), please be sure to use the code from the `main` branch! ! !
 
 ## License
 
-In principle, no fees and copyrights are charged, and you can use it with confidence, but if you need secondary open source, please contact the author for permission!
+[MIT © 2020-present, pure-admin](./LICENSE)

README.md

@@ -1,61 +1,51 @@
-<h1>vue-pure-admin精简版</h1>
+<h1>vue-pure-admin精简版（非国际化版本）</h1>
 
-[![license](https://img.shields.io/github/license/xiaoxian521/vue-pure-admin.svg)](LICENSE)
+[![license](https://img.shields.io/github/license/pure-admin/vue-pure-admin.svg)](LICENSE)
 
 **中文** | [English](./README.en-US.md)
 
 ## 介绍
 
-精简版是基于[vue-pure-admin](https://github.com/xiaoxian521/vue-pure-admin)提炼出的架子，包含主体功能，更适合实际项目开发，打包后的大小仅 `3MB`
+精简版是基于 [vue-pure-admin](https://github.com/pure-admin/vue-pure-admin) 提炼出的架子，包含主体功能，更适合实际项目开发，打包后的大小在全局引入 [element-plus](https://element-plus.org) 的情况下仍然低于 `2.3MB`，并且会永久同步完整版的代码。开启 `brotli` 压缩和 `cdn` 替换本地库模式后，打包大小低于 `350kb`
+
+## 版本选择
+
+当前是非国际化版本，如果您需要国际化版本 [请点击](https://github.com/pure-admin/pure-admin-thin/tree/i18n)
+
+## `js` 版本
+
+[点我查看 js 版本](https://pure-admin.cn/pages/js/)
+
+## `max` 版本
+
+[点我查看 max 版本](https://pure-admin.cn/pages/max/)
 
 ## 配套视频
 
-- [点我查看教程](https://www.bilibili.com/video/BV1534y1S7HV)
+[点我查看 UI 设计](https://www.bilibili.com/video/BV17g411T7rq)  
-- [点我查看 UI 设计](https://www.bilibili.com/video/BV17g411T7rq)
+[点我查看快速开发教程](https://www.bilibili.com/video/BV1kg411v7QT)
 
-## 配套文档
+## 配套保姆级文档
 
-- [点我查看文档](https://pure-admin-doc.vercel.app)
+[点我查看 vue-pure-admin 文档](https://pure-admin.cn/)  
+[点我查看 @pureadmin/utils 文档](https://pure-admin-utils.netlify.app)
+
+## 优质服务、软件外包、赞助支持
+
+[点我查看详情](https://pure-admin.cn/pages/service/)
+
+## 预览
+
+[查看预览](https://pure-admin-thin.netlify.app/#/login)
 
 ## 维护者
 
 [xiaoxian521](https://github.com/xiaoxian521)
 
-## 捐赠
-
-如果你觉得这个项目对您有帮助，可以帮作者买一杯果汁 🍹 表示支持
-
-<img src="https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/f69bf13c5b854ed5b699807cafa0e3ce~tplv-k3u1fbpfcp-zoom-in-crop-mark:1304:0:0:0.awebp?" width="150px" height="150px" />
-
-## QQ 交流群
-
-一群已满，下面是二群，群里严禁`黄`、`赌`、`毒`、`vpn`等违法行为！
-
-<img src="https://pure-admin-doc.vercel.app/img/support/qq.png" width="150px" height="225px" />
-
-## 用法
-
-### 安装依赖
-
-pnpm install
-
-### 安装一个包
-
-pnpm add 包名
-
-### 卸载一个包
-
-pnpm remove 包名
-
-我认为你应该先 fork 项目去开发，以便我更新时您可以同步拉取更新！！！
-
 ## ⚠️ 注意
 
-- 精简版不接受任何 issues 和 pr，如果有问题请到完整版 https://github.com/xiaoxian521/vue-pure-admin/issues/new/choose 去提，谢谢！！！
+精简版不接受任何 `issues` 和 `pr`，如果有问题请到完整版 [issues](https://github.com/pure-admin/vue-pure-admin/issues/new/choose) 去提，谢谢！
-- 不要使用`delete-i18n`分支代码，这个分支只是给你们完全删除国际化的参考，不会同步代码的！！！[完全删除国际化教程](https://www.bilibili.com/video/BV1Ru411B7k3/)，请务必使用`main`分支的代码！！！
 
 ## 许可证
 
-原则上不收取任何费用及版权，可以放心使用，不过如需二次开源（比如用此平台二次开发并开源）请联系作者获取许可！
+[MIT © 2020-present, pure-admin](./LICENSE)
-
-[MIT © xiaoxian521-2020](./LICENSE)

build/cdn.ts

@@ -0,0 +1,55 @@
+import { Plugin as importToCDN } from "vite-plugin-cdn-import";
+
+/**
+ * @description 打包时采用`cdn`模式，仅限外网使用（默认不采用，如果需要采用cdn模式，请在 .env.production 文件，将 VITE_CDN 设置成true）
+ * 平台采用国内cdn：https://www.bootcdn.cn，当然你也可以选择 https://unpkg.com 或者 https://www.jsdelivr.com
+ * 注意：上面提到的仅限外网使用也不是完全肯定的，如果你们公司内网部署的有相关js、css文件，也可以将下面配置对应改一下，整一套内网版cdn
+ */
+export const cdn = importToCDN({
+  //（prodUrl解释： name: 对应下面modules的name，version: 自动读取本地package.json中dependencies依赖中对应包的版本号，path: 对应下面modules的path，当然也可写完整路径，会替换prodUrl）
+  prodUrl: "https://cdn.bootcdn.net/ajax/libs/{name}/{version}/{path}",
+  modules: [
+    {
+      name: "vue",
+      var: "Vue",
+      path: "vue.global.prod.min.js"
+    },
+    {
+      name: "vue-router",
+      var: "VueRouter",
+      path: "vue-router.global.min.js"
+    },
+    // 项目中没有直接安装vue-demi，但是pinia用到了，所以需要在引入pinia前引入vue-demi（https://github.com/vuejs/pinia/blob/v2/packages/pinia/package.json#L77）
+    {
+      name: "vue-demi",
+      var: "VueDemi",
+      path: "index.iife.min.js"
+    },
+    {
+      name: "pinia",
+      var: "Pinia",
+      path: "pinia.iife.min.js"
+    },
+    {
+      name: "element-plus",
+      var: "ElementPlus",
+      path: "index.full.min.js",
+      css: "index.min.css"
+    },
+    {
+      name: "axios",
+      var: "axios",
+      path: "axios.min.js"
+    },
+    {
+      name: "dayjs",
+      var: "dayjs",
+      path: "dayjs.min.js"
+    },
+    {
+      name: "echarts",
+      var: "echarts",
+      path: "echarts.min.js"
+    }
+  ]
+});

build/compress.ts

@@ -0,0 +1,63 @@
+import type { Plugin } from "vite";
+import { isArray } from "@pureadmin/utils";
+import compressPlugin from "vite-plugin-compression";
+
+export const configCompressPlugin = (
+  compress: ViteCompression
+): Plugin | Plugin[] => {
+  if (compress === "none") return null;
+
+  const gz = {
+    // 生成的压缩包后缀
+    ext: ".gz",
+    // 体积大于threshold才会被压缩
+    threshold: 0,
+    // 默认压缩.js|mjs|json|css|html后缀文件，设置成true，压缩全部文件
+    filter: () => true,
+    // 压缩后是否删除原始文件
+    deleteOriginFile: false
+  };
+  const br = {
+    ext: ".br",
+    algorithm: "brotliCompress",
+    threshold: 0,
+    filter: () => true,
+    deleteOriginFile: false
+  };
+
+  const codeList = [
+    { k: "gzip", v: gz },
+    { k: "brotli", v: br },
+    { k: "both", v: [gz, br] }
+  ];
+
+  const plugins: Plugin[] = [];
+
+  codeList.forEach(item => {
+    if (compress.includes(item.k)) {
+      if (compress.includes("clear")) {
+        if (isArray(item.v)) {
+          item.v.forEach(vItem => {
+            plugins.push(
+              compressPlugin(Object.assign(vItem, { deleteOriginFile: true }))
+            );
+          });
+        } else {
+          plugins.push(
+            compressPlugin(Object.assign(item.v, { deleteOriginFile: true }))
+          );
+        }
+      } else {
+        if (isArray(item.v)) {
+          item.v.forEach(vItem => {
+            plugins.push(compressPlugin(vItem));
+          });
+        } else {
+          plugins.push(compressPlugin(item.v));
+        }
+      }
+    }
+  });
+
+  return plugins;
+};

build/index.ts

@@ -1,41 +0,0 @@
-// 处理环境变量
-const warpperEnv = (envConf: Recordable): ViteEnv => {
-  // 此处为默认值，无需修改
-  const ret: ViteEnv = {
-    VITE_PORT: 8848,
-    VITE_PUBLIC_PATH: "",
-    VITE_PROXY_DOMAIN: "",
-    VITE_PROXY_DOMAIN_REAL: "",
-    VITE_ROUTER_HISTORY: "",
-    VITE_LEGACY: false
-  };
-
-  for (const envName of Object.keys(envConf)) {
-    let realName = envConf[envName].replace(/\\n/g, "\n");
-    realName =
-      realName === "true" ? true : realName === "false" ? false : realName;
-
-    if (envName === "VITE_PORT") {
-      realName = Number(realName);
-    }
-    ret[envName] = realName;
-    if (typeof realName === "string") {
-      process.env[envName] = realName;
-    } else if (typeof realName === "object") {
-      process.env[envName] = JSON.stringify(realName);
-    }
-  }
-  return ret;
-};
-
-// 跨域代理重写
-const regExps = (value: string, reg: string): string => {
-  return value.replace(new RegExp(`^${reg}`, "g"), "");
-};
-
-// 环境变量
-const loadEnv = (): ViteEnv => {
-  return import.meta.env;
-};
-
-export { warpperEnv, regExps, loadEnv };

build/info.ts

@@ -1,29 +1,34 @@
 import type { Plugin } from "vite";
-import dayjs, { Dayjs } from "dayjs";
+import gradient from "gradient-string";
+import { getPackageSize } from "./utils";
+import dayjs, { type Dayjs } from "dayjs";
 import duration from "dayjs/plugin/duration";
-import { green, blue, bold } from "picocolors";
+import boxen, { type Options as BoxenOptions } from "boxen";
-import { getPackageSize } from "@pureadmin/utils";
 dayjs.extend(duration);
 
+const welcomeMessage = gradient(["cyan", "magenta"]).multiline(
+  `您好! 欢迎使用 pure-admin 开源项目\n我们为您精心准备了下面两个贴心的保姆级文档\nhttps://pure-admin.cn\nhttps://pure-admin-utils.netlify.app`
+);
+
+const boxenOptions: BoxenOptions = {
+  padding: 0.5,
+  borderColor: "cyan",
+  borderStyle: "round"
+};
+
 export function viteBuildInfo(): Plugin {
   let config: { command: string };
   let startTime: Dayjs;
   let endTime: Dayjs;
+  let outDir: string;
   return {
     name: "vite:buildInfo",
-    configResolved(resolvedConfig: { command: string }) {
+    configResolved(resolvedConfig) {
       config = resolvedConfig;
+      outDir = resolvedConfig.build?.outDir ?? "dist";
     },
     buildStart() {
-      console.log(
+      console.log(boxen(welcomeMessage, boxenOptions));
-        bold(
-          green(
-            `👏欢迎使用${blue(
-              "[vue-pure-admin]"
-            )}，如果您感觉不错，记得点击后面链接给个star哦💖 https://github.com/xiaoxian521/vue-pure-admin`
-          )
-        )
-      );
       if (config.command === "build") {
         startTime = dayjs(new Date());
       }
@@ -32,14 +37,16 @@ export function viteBuildInfo(): Plugin {
       if (config.command === "build") {
         endTime = dayjs(new Date());
         getPackageSize({
+          folder: outDir,
           callback: (size: string) => {
             console.log(
-              bold(
+              boxen(
-                green(
+                gradient(["cyan", "magenta"]).multiline(
                   `🎉 恭喜打包完成（总用时${dayjs
                     .duration(endTime.diff(startTime))
                     .format("mm分ss秒")}，打包后的大小为${size}）`
-                )
+                ),
+                boxenOptions
               )
             );
           }

build/optimize.ts

@@ -0,0 +1,29 @@
+/**
+ * 此文件作用于 `vite.config.ts` 的 `optimizeDeps.include` 依赖预构建配置项
+ * 依赖预构建，`vite` 启动时会将下面 include 里的模块，编译成 esm 格式并缓存到 node_modules/.vite 文件夹，页面加载到对应模块时如果浏览器有缓存就读取浏览器缓存，如果没有会读取本地缓存并按需加载
+ * 尤其当您禁用浏览器缓存时（这种情况只应该发生在调试阶段）必须将对应模块加入到 include里，否则会遇到开发环境切换页面卡顿的问题（vite 会认为它是一个新的依赖包会重新加载并强制刷新页面），因为它既无法使用浏览器缓存，又没有在本地 node_modules/.vite 里缓存
+ * 温馨提示：如果您使用的第三方库是全局引入，也就是引入到 src/main.ts 文件里，就不需要再添加到 include 里了，因为 vite 会自动将它们缓存到 node_modules/.vite
+ */
+const include = [
+  "qs",
+  "mitt",
+  "dayjs",
+  "axios",
+  "pinia",
+  "vue-types",
+  "js-cookie",
+  "vue-tippy",
+  "pinyin-pro",
+  "sortablejs",
+  "@vueuse/core",
+  "@pureadmin/utils",
+  "responsive-storage"
+];
+
+/**
+ * 在预构建中强制排除的依赖项
+ * 温馨提示：平台推荐的使用方式是哪里需要哪里引入而且都是单个的引入，不需要预构建，直接让浏览器加载就好
+ */
+const exclude = ["@iconify/json"];
+
+export { include, exclude };

build/plugins.ts

@@ -1,75 +1,66 @@
-import { resolve } from "path";
+import { cdn } from "./cdn";
-import Unocss from "unocss/vite";
 import vue from "@vitejs/plugin-vue";
 import { viteBuildInfo } from "./info";
 import svgLoader from "vite-svg-loader";
-import legacy from "@vitejs/plugin-legacy";
+import Icons from "unplugin-icons/vite";
+import type { PluginOption } from "vite";
 import vueJsx from "@vitejs/plugin-vue-jsx";
-import { viteMockServe } from "vite-plugin-mock";
+import tailwindcss from "@tailwindcss/vite";
-import VueI18n from "@intlify/vite-plugin-vue-i18n";
+import { configCompressPlugin } from "./compress";
-// import ElementPlus from "unplugin-element-plus/vite";
+import removeNoMatch from "vite-plugin-router-warn";
 import { visualizer } from "rollup-plugin-visualizer";
 import removeConsole from "vite-plugin-remove-console";
-import themePreprocessorPlugin from "@pureadmin/theme";
+import { codeInspectorPlugin } from "code-inspector-plugin";
-import { genScssMultipleScopeVars } from "/@/layout/theme";
+import { vitePluginFakeServer } from "vite-plugin-fake-server";
-import DefineOptions from "unplugin-vue-define-options/vite";
 
-export function getPluginsList(command, VITE_LEGACY) {
+export function getPluginsList(
-  const prodMock = true;
+  VITE_CDN: boolean,
+  VITE_COMPRESSION: ViteCompression
+): PluginOption[] {
   const lifecycle = process.env.npm_lifecycle_event;
   return [
+    tailwindcss(),
     vue(),
-    // https://github.com/intlify/bundle-tools/tree/main/packages/vite-plugin-vue-i18n
-    VueI18n({
-      runtimeOnly: true,
-      compositionOnly: true,
-      include: [resolve("locales/**")]
-    }),
     // jsx、tsx语法支持
     vueJsx(),
-    Unocss(),
+    /**
-    DefineOptions(),
+     * 在页面上按住组合键时，鼠标在页面移动即会在 DOM 上出现遮罩层并显示相关信息，点击一下将自动打开 IDE 并将光标定位到元素对应的代码位置
-    // 线上环境删除console
+     * Mac 默认组合键 Option + Shift
-    removeConsole({ external: ["src/assets/iconfont/iconfont.js"] }),
+     * Windows 默认组合键 Alt + Shift
+     * 更多用法看 https://inspector.fe-dev.cn/guide/start.html
+     */
+    codeInspectorPlugin({
+      bundler: "vite",
+      hideConsole: true
+    }),
     viteBuildInfo(),
-    // 自定义主题
+    /**
-    themePreprocessorPlugin({
+     * 开发环境下移除非必要的vue-router动态路由警告No match found for location with path
-      scss: {
+     * 非必要具体看 https://github.com/vuejs/router/issues/521 和 https://github.com/vuejs/router/issues/359
-        multipleScopeVars: genScssMultipleScopeVars(),
+     * vite-plugin-router-warn只在开发环境下启用，只处理vue-router文件并且只在服务启动或重启时运行一次，性能消耗可忽略不计
-        // 在生产模式是否抽取独立的主题css文件，extract为true以下属性有效
+     */
-        extract: true,
+    removeNoMatch(),
-        // 会选取defaultScopeName对应的主题css文件在html添加link
+    // mock支持
-        themeLinkTagId: "head",
+    vitePluginFakeServer({
-        // "head"||"head-prepend" || "body" ||"body-prepend"
+      logger: false,
-        themeLinkTagInjectTo: "head",
+      include: "mock",
-        // 是否对抽取的css文件内对应scopeName的权重类名移除
+      infixName: false,
-        removeCssScopeName: false
+      enableProd: true
-      }
     }),
     // svg组件化支持
     svgLoader(),
-    // ElementPlus({}),
+    // 自动按需加载图标
-    // mock支持
+    Icons({
-    viteMockServe({
+      compiler: "vue3",
-      mockPath: "mock",
+      scale: 1
-      localEnabled: command === "serve",
-      prodEnabled: command !== "serve" && prodMock,
-      injectCode: `
-          import { setupProdMockServer } from './mockProdServer';
-          setupProdMockServer();
-        `,
-      logger: false
     }),
-    // 是否为打包后的文件提供传统浏览器兼容性支持
+    VITE_CDN ? cdn : null,
-    VITE_LEGACY
+    configCompressPlugin(VITE_COMPRESSION),
-      ? legacy({
+    // 线上环境删除console
-          targets: ["ie >= 11"],
+    removeConsole({ external: ["src/assets/iconfont/iconfont.js"] }),
-          additionalLegacyPolyfills: ["regenerator-runtime/runtime"]
-        })
-      : null,
     // 打包分析
     lifecycle === "report"
       ? visualizer({ open: true, brotliSize: true, filename: "report.html" })
-      : null
+      : (null as any)
   ];
 }

build/utils.ts

@@ -0,0 +1,110 @@
+import dayjs from "dayjs";
+import { readdir, stat } from "node:fs";
+import { fileURLToPath } from "node:url";
+import { dirname, resolve } from "node:path";
+import { sum, formatBytes } from "@pureadmin/utils";
+import {
+  name,
+  version,
+  engines,
+  dependencies,
+  devDependencies
+} from "../package.json";
+
+/** 启动`node`进程时所在工作目录的绝对路径 */
+const root: string = process.cwd();
+
+/**
+ * @description 根据可选的路径片段生成一个新的绝对路径
+ * @param dir 路径片段，默认`build`
+ * @param metaUrl 模块的完整`url`，如果在`build`目录外调用必传`import.meta.url`
+ */
+const pathResolve = (dir = ".", metaUrl = import.meta.url) => {
+  // 当前文件目录的绝对路径
+  const currentFileDir = dirname(fileURLToPath(metaUrl));
+  // build 目录的绝对路径
+  const buildDir = resolve(currentFileDir, "build");
+  // 解析的绝对路径
+  const resolvedPath = resolve(currentFileDir, dir);
+  // 检查解析的绝对路径是否在 build 目录内
+  if (resolvedPath.startsWith(buildDir)) {
+    // 在 build 目录内，返回当前文件路径
+    return fileURLToPath(metaUrl);
+  }
+  // 不在 build 目录内，返回解析后的绝对路径
+  return resolvedPath;
+};
+
+/** 设置别名 */
+const alias: Record<string, string> = {
+  "@": pathResolve("../src"),
+  "@build": pathResolve()
+};
+
+/** 平台的名称、版本、运行所需的`node`和`pnpm`版本、依赖、最后构建时间的类型提示 */
+const __APP_INFO__ = {
+  pkg: { name, version, engines, dependencies, devDependencies },
+  lastBuildTime: dayjs(new Date()).format("YYYY-MM-DD HH:mm:ss")
+};
+
+/** 处理环境变量 */
+const wrapperEnv = (envConf: Recordable): ViteEnv => {
+  // 默认值
+  const ret: ViteEnv = {
+    VITE_PORT: 8848,
+    VITE_PUBLIC_PATH: "",
+    VITE_ROUTER_HISTORY: "",
+    VITE_CDN: false,
+    VITE_HIDE_HOME: "false",
+    VITE_COMPRESSION: "none"
+  };
+
+  for (const envName of Object.keys(envConf)) {
+    let realName = envConf[envName].replace(/\\n/g, "\n");
+    realName =
+      realName === "true" ? true : realName === "false" ? false : realName;
+
+    if (envName === "VITE_PORT") {
+      realName = Number(realName);
+    }
+    ret[envName] = realName;
+    if (typeof realName === "string") {
+      process.env[envName] = realName;
+    } else if (typeof realName === "object") {
+      process.env[envName] = JSON.stringify(realName);
+    }
+  }
+  return ret;
+};
+
+const fileListTotal: number[] = [];
+
+/** 获取指定文件夹中所有文件的总大小 */
+const getPackageSize = options => {
+  const { folder = "dist", callback, format = true } = options;
+  readdir(folder, (err, files: string[]) => {
+    if (err) throw err;
+    let count = 0;
+    const checkEnd = () => {
+      ++count == files.length &&
+        callback(format ? formatBytes(sum(fileListTotal)) : sum(fileListTotal));
+    };
+    files.forEach((item: string) => {
+      stat(`${folder}/${item}`, async (err, stats) => {
+        if (err) throw err;
+        if (stats.isFile()) {
+          fileListTotal.push(stats.size);
+          checkEnd();
+        } else if (stats.isDirectory()) {
+          getPackageSize({
+            folder: `${folder}/${item}/`,
+            callback: checkEnd
+          });
+        }
+      });
+    });
+    files.length === 0 && callback(0);
+  });
+};
+
+export { root, pathResolve, alias, __APP_INFO__, wrapperEnv, getPackageSize };

commitlint.config.js

@@ -1,4 +1,7 @@
-module.exports = {
+// @ts-check
+
+/** @type {import("@commitlint/types").UserConfig} */
+export default {
   ignores: [commit => commit.includes("init")],
   extends: ["@commitlint/config-conventional"],
   rules: {

eslint.config.js

@@ -0,0 +1,173 @@
+import js from "@eslint/js";
+import tseslint from "typescript-eslint";
+import pluginVue from "eslint-plugin-vue";
+import * as parserVue from "vue-eslint-parser";
+import configPrettier from "eslint-config-prettier";
+import pluginPrettier from "eslint-plugin-prettier";
+import { defineConfig, globalIgnores } from "eslint/config";
+
+export default defineConfig([
+  globalIgnores([
+    "**/.*",
+    "dist/*",
+    "*.d.ts",
+    "public/*",
+    "src/assets/**",
+    "src/**/iconfont/**"
+  ]),
+  {
+    ...js.configs.recommended,
+    languageOptions: {
+      globals: {
+        // types/index.d.ts
+        RefType: "readonly",
+        EmitType: "readonly",
+        TargetContext: "readonly",
+        ComponentRef: "readonly",
+        ElRef: "readonly",
+        ForDataType: "readonly",
+        AnyFunction: "readonly",
+        PropType: "readonly",
+        Writable: "readonly",
+        Nullable: "readonly",
+        NonNullable: "readonly",
+        Recordable: "readonly",
+        ReadonlyRecordable: "readonly",
+        Indexable: "readonly",
+        DeepPartial: "readonly",
+        Without: "readonly",
+        Exclusive: "readonly",
+        TimeoutHandle: "readonly",
+        IntervalHandle: "readonly",
+        Effect: "readonly",
+        ChangeEvent: "readonly",
+        WheelEvent: "readonly",
+        ImportMetaEnv: "readonly",
+        Fn: "readonly",
+        PromiseFn: "readonly",
+        ComponentElRef: "readonly",
+        parseInt: "readonly",
+        parseFloat: "readonly"
+      }
+    },
+    plugins: {
+      prettier: pluginPrettier
+    },
+    rules: {
+      ...configPrettier.rules,
+      ...pluginPrettier.configs.recommended.rules,
+      "no-debugger": "off",
+      "no-unused-vars": [
+        "error",
+        {
+          argsIgnorePattern: "^_",
+          varsIgnorePattern: "^_"
+        }
+      ],
+      "prettier/prettier": [
+        "error",
+        {
+          endOfLine: "auto"
+        }
+      ]
+    }
+  },
+  ...tseslint.config({
+    extends: [...tseslint.configs.recommended],
+    files: ["**/*.?([cm])ts", "**/*.?([cm])tsx"],
+    rules: {
+      "@typescript-eslint/no-redeclare": "error",
+      "@typescript-eslint/ban-ts-comment": "off",
+      "@typescript-eslint/no-explicit-any": "off",
+      "@typescript-eslint/prefer-as-const": "warn",
+      "@typescript-eslint/no-empty-function": "off",
+      "@typescript-eslint/no-non-null-assertion": "off",
+      "@typescript-eslint/no-unused-expressions": "off",
+      "@typescript-eslint/no-unsafe-function-type": "off",
+      "@typescript-eslint/no-import-type-side-effects": "error",
+      "@typescript-eslint/explicit-module-boundary-types": "off",
+      "@typescript-eslint/consistent-type-imports": [
+        "error",
+        { disallowTypeAnnotations: false, fixStyle: "inline-type-imports" }
+      ],
+      "@typescript-eslint/prefer-literal-enum-member": [
+        "error",
+        { allowBitwiseExpressions: true }
+      ],
+      "@typescript-eslint/no-unused-vars": [
+        "error",
+        {
+          argsIgnorePattern: "^_",
+          varsIgnorePattern: "^_"
+        }
+      ]
+    }
+  }),
+  {
+    files: ["**/*.d.ts"],
+    rules: {
+      "eslint-comments/no-unlimited-disable": "off",
+      "import/no-duplicates": "off",
+      "no-restricted-syntax": "off",
+      "unused-imports/no-unused-vars": "off"
+    }
+  },
+  {
+    files: ["**/*.?([cm])js"],
+    rules: {
+      "@typescript-eslint/no-require-imports": "off"
+    }
+  },
+  {
+    files: ["**/*.vue"],
+    languageOptions: {
+      globals: {
+        $: "readonly",
+        $$: "readonly",
+        $computed: "readonly",
+        $customRef: "readonly",
+        $ref: "readonly",
+        $shallowRef: "readonly",
+        $toRef: "readonly"
+      },
+      parser: parserVue,
+      parserOptions: {
+        ecmaFeatures: {
+          jsx: true
+        },
+        extraFileExtensions: [".vue"],
+        parser: tseslint.parser,
+        sourceType: "module"
+      }
+    },
+    plugins: {
+      "@typescript-eslint": tseslint.plugin,
+      vue: pluginVue
+    },
+    processor: pluginVue.processors[".vue"],
+    rules: {
+      ...pluginVue.configs.base.rules,
+      ...pluginVue.configs.essential.rules,
+      ...pluginVue.configs.recommended.rules,
+      "no-undef": "off",
+      "no-unused-vars": "off",
+      "vue/no-v-html": "off",
+      "vue/require-default-prop": "off",
+      "vue/require-explicit-emits": "off",
+      "vue/multi-word-component-names": "off",
+      "vue/no-setup-props-reactivity-loss": "off",
+      "vue/html-self-closing": [
+        "error",
+        {
+          html: {
+            void: "always",
+            normal: "always",
+            component: "always"
+          },
+          svg: "always",
+          math: "always"
+        }
+      ]
+    }
+  }
+]);

index.html

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
@@ -10,9 +10,6 @@
     />
     <title>pure-admin-thin</title>
     <link rel="icon" href="/favicon.ico" />
-    <script>
-      window.process = {};
-    </script>
   </head>
 
   <body>
@@ -21,72 +18,54 @@
         html,
         body,
         #app {
+          position: relative;
+          display: flex;
+          align-items: center;
+          justify-content: center;
           width: 100%;
           height: 100%;
-          display: flex;
-          position: relative;
-          justify-content: center;
-          align-items: center;
           overflow: hidden;
         }
 
         .loader,
-        .loader:before,
+        .loader::before,
-        .loader:after {
+        .loader::after {
-          border-radius: 50%;
           width: 2.5em;
           height: 2.5em;
-          -webkit-animation-fill-mode: both;
+          border-radius: 50%;
+          animation: load-animation 1.8s infinite ease-in-out;
           animation-fill-mode: both;
-          -webkit-animation: loadAnimation 1.8s infinite ease-in-out;
-          animation: loadAnimation 1.8s infinite ease-in-out;
         }
 
         .loader {
-          color: #406eeb;
-          font-size: 10px;
-          margin: 80px auto;
           position: relative;
-          text-indent: -9999em;
-          -webkit-transform: translateZ(0);
-          -ms-transform: translateZ(0);
-          transform: translateZ(0);
-          -webkit-animation-delay: -0.16s;
-          animation-delay: -0.16s;
           top: 0;
+          margin: 80px auto;
+          font-size: 10px;
+          color: #406eeb;
+          text-indent: -9999em;
+          transform: translateZ(0);
           transform: translate(-50%, 0);
+          animation-delay: -0.16s;
         }
 
-        .loader:before,
+        .loader::before,
-        .loader:after {
+        .loader::after {
-          content: "";
           position: absolute;
           top: 0;
+          content: "";
         }
 
-        .loader:before {
+        .loader::before {
           left: -3.5em;
-          -webkit-animation-delay: -0.32s;
           animation-delay: -0.32s;
         }
 
-        .loader:after {
+        .loader::after {
           left: 3.5em;
         }
 
-        @-webkit-keyframes loadAnimation {
+        @keyframes load-animation {
-          0%,
-          80%,
-          100% {
-            box-shadow: 0 2.5em 0 -1.3em;
-          }
-
-          40% {
-            box-shadow: 0 2.5em 0 0;
-          }
-        }
-
-        @keyframes loadAnimation {
           0%,
           80%,
           100% {

locales/en.yaml

@@ -1,72 +0,0 @@
-buttons:
-  hsLoginOut: LoginOut
-  hsfullscreen: FullScreen
-  hsexitfullscreen: ExitFullscreen
-  hsrefreshRoute: RefreshRoute
-  hslogin: Login
-  hsadd: Add
-  hsmark: Mark/Cancel
-  hssave: Save
-  hssearch: Search
-  hsexpendAll: Expand All
-  hscollapseAll: Collapse All
-  hssystemSet: Open ProjectConfig
-  hsdelete: Delete
-  hsreload: Reload
-  hscloseCurrentTab: Close CurrentTab
-  hscloseLeftTabs: Close LeftTabs
-  hscloseRightTabs: Close RightTabs
-  hscloseOtherTabs: Close OtherTabs
-  hscloseAllTabs: Close AllTabs
-menus:
-  hshome: Home
-  hslogin: Login
-  hserror: Error Page
-  hsfourZeroFour: "404"
-  hsfourZeroOne: "403"
-  hsFive: "500"
-  permission: Permission Manage
-  permissionPage: Page Permission
-  permissionButton: Button Permission
-status:
-  hsLoad: Loading...
-login:
-  username: Username
-  password: Password
-  verifyCode: VerifyCode
-  remember: Remember Password
-  sure: Sure Password
-  forget: Forget Password?
-  login: Login
-  thirdLogin: Third Login
-  phoneLogin: Phone Login
-  qRCodeLogin: QRCode Login
-  register: Register
-  weChatLogin: WeChat Login
-  alipayLogin: Alipay Login
-  qqLogin: QQ Login
-  weiboLogin: Weibo Login
-  phone: Phone
-  smsVerifyCode: SMS VerifyCode
-  back: Back
-  test: Mock Test
-  tip: After scanning the code, click "Confirm" to complete the login
-  definite: Definite
-  loginSuccess: Login Success
-  registerSuccess: Regist Success
-  tickPrivacy: Please tick Privacy Policy
-  readAccept: I have read it carefully and accept
-  privacyPolicy: Privacy Policy
-  getVerifyCode: Get VerifyCode
-  info: Seconds
-  usernameReg: Please enter username
-  passwordReg: Please enter password
-  verifyCodeReg: Please enter verify code
-  verifyCodeCorrectReg: Please enter correct verify code
-  verifyCodeSixReg: Please enter a 6-digit verify code
-  phoneReg: Please enter the phone
-  phoneCorrectReg: Please enter the correct phone number format
-  passwordRuleReg: The password format should be any combination of 8-18 digits
-  passwordSureReg: Please enter confirm password
-  passwordDifferentReg: The two passwords do not match!
-  passwordUpdateReg: Password has been updated

locales/zh-CN.yaml

@@ -1,72 +0,0 @@
-buttons:
-  hsLoginOut: 退出系统
-  hsfullscreen: 全屏
-  hsexitfullscreen: 退出全屏
-  hsrefreshRoute: 刷新路由
-  hslogin: 登录
-  hsadd: 新增
-  hsmark: 标记/取消
-  hssave: 保存
-  hssearch: 搜索
-  hsexpendAll: 全部展开
-  hscollapseAll: 全部折叠
-  hssystemSet: 打开项目配置
-  hsdelete: 删除
-  hsreload: 重新加载
-  hscloseCurrentTab: 关闭当前标签页
-  hscloseLeftTabs: 关闭左侧标签页
-  hscloseRightTabs: 关闭右侧标签页
-  hscloseOtherTabs: 关闭其他标签页
-  hscloseAllTabs: 关闭全部标签页
-menus:
-  hshome: 首页
-  hslogin: 登录
-  hserror: 错误页面
-  hsfourZeroFour: "404"
-  hsfourZeroOne: "403"
-  hsFive: "500"
-  permission: 权限管理
-  permissionPage: 页面权限
-  permissionButton: 按钮权限
-status:
-  hsLoad: 加载中...
-login:
-  username: 账号
-  password: 密码
-  verifyCode: 验证码
-  remember: 记住密码
-  sure: 确认密码
-  forget: 忘记密码?
-  login: 登录
-  thirdLogin: 第三方登录
-  phoneLogin: 手机登录
-  qRCodeLogin: 二维码登录
-  register: 注册
-  weChatLogin: 微信登录
-  alipayLogin: 支付宝登录
-  qqLogin: QQ登录
-  weiboLogin: 微博登录
-  phone: 手机号码
-  smsVerifyCode: 短信验证码
-  back: 返回
-  test: 模拟测试
-  tip: 扫码后点击"确认"，即可完成登录
-  definite: 确定
-  loginSuccess: 登录成功
-  registerSuccess: 注册成功
-  tickPrivacy: 请勾选隐私政策
-  readAccept: 我已仔细阅读并接受
-  privacyPolicy: 《隐私政策》
-  getVerifyCode: 获取验证码
-  info: 秒后重新获取
-  usernameReg: 请输入账号
-  passwordReg: 请输入密码
-  verifyCodeReg: 请输入验证码
-  verifyCodeCorrectReg: 请输入正确的验证码
-  verifyCodeSixReg: 请输入6位数字验证码
-  phoneReg: 请输入手机号码
-  phoneCorrectReg: 请输入正确的手机号码格式
-  passwordRuleReg: 密码格式应为8-18位数字、字母、符号的任意两种组合
-  passwordSureReg: 请输入确认密码
-  passwordDifferentReg: 两次密码不一致!
-  passwordUpdateReg: 修改密码成功

mock/asyncRoutes.ts

@@ -1,54 +1,69 @@
-// 根据角色动态生成路由
+// 模拟后端动态生成路由
-import { MockMethod } from "vite-plugin-mock";
+import { defineFakeRoute } from "vite-plugin-fake-server/client";
 
+/**
+ * roles：页面级别权限，这里模拟二种 "admin"、"common"
+ * admin：管理员角色
+ * common：普通角色
+ */
 const permissionRouter = {
   path: "/permission",
   meta: {
-    title: "menus.permission",
+    title: "权限管理",
-    icon: "lollipop",
+    icon: "ep:lollipop",
-    rank: 7
+    rank: 10
   },
   children: [
     {
       path: "/permission/page/index",
       name: "PermissionPage",
       meta: {
-        title: "menus.permissionPage"
+        title: "页面权限",
+        roles: ["admin", "common"]
       }
     },
     {
-      path: "/permission/button/index",
+      path: "/permission/button",
-      name: "PermissionButton",
       meta: {
-        title: "menus.permissionButton",
+        title: "按钮权限",
-        authority: []
+        roles: ["admin", "common"]
+      },
+      children: [
+        {
+          path: "/permission/button/router",
+          component: "permission/button/index",
+          name: "PermissionButtonRouter",
+          meta: {
+            title: "路由返回按钮权限",
+            auths: [
+              "permission:btn:add",
+              "permission:btn:edit",
+              "permission:btn:delete"
+            ]
           }
+        },
+        {
+          path: "/permission/button/login",
+          component: "permission/button/perms",
+          name: "PermissionButtonLogin",
+          meta: {
+            title: "登录接口返回按钮权限"
+          }
+        }
+      ]
     }
   ]
 };
 
-// 添加不同按钮权限到/permission/button页面中
+export default defineFakeRoute([
-function setDifAuthority(authority, routes) {
-  routes.children[1].meta.authority = [authority];
-  return routes;
-}
-
-export default [
   {
-    url: "/getAsyncRoutes",
+    url: "/get-async-routes",
     method: "get",
-    response: ({ query }) => {
+    response: () => {
-      if (query.name === "admin") {
       return {
-          code: 0,
+        success: true,
-          info: [setDifAuthority("v-admin", permissionRouter)]
+        data: [permissionRouter]
-        };
-      } else {
-        return {
-          code: 0,
-          info: [setDifAuthority("v-test", permissionRouter)]
       };
     }
   }
-  }
+]);
-] as MockMethod[];

mock/login.ts

@@ -0,0 +1,42 @@
+// 根据角色动态生成路由
+import { defineFakeRoute } from "vite-plugin-fake-server/client";
+
+export default defineFakeRoute([
+  {
+    url: "/login",
+    method: "post",
+    response: ({ body }) => {
+      if (body.username === "admin") {
+        return {
+          success: true,
+          data: {
+            avatar: "https://avatars.githubusercontent.com/u/44761321",
+            username: "admin",
+            nickname: "小铭",
+            // 一个用户可能有多个角色
+            roles: ["admin"],
+            // 按钮级别权限
+            permissions: ["*:*:*"],
+            accessToken: "eyJhbGciOiJIUzUxMiJ9.admin",
+            refreshToken: "eyJhbGciOiJIUzUxMiJ9.adminRefresh",
+            expires: "2030/10/30 00:00:00"
+          }
+        };
+      } else {
+        return {
+          success: true,
+          data: {
+            avatar: "https://avatars.githubusercontent.com/u/52823142",
+            username: "common",
+            nickname: "小林",
+            roles: ["common"],
+            permissions: ["permission:btn:add", "permission:btn:edit"],
+            accessToken: "eyJhbGciOiJIUzUxMiJ9.common",
+            refreshToken: "eyJhbGciOiJIUzUxMiJ9.commonRefresh",
+            expires: "2030/10/30 00:00:00"
+          }
+        };
+      }
+    }
+  }
+]);

mock/refreshToken.ts

@@ -0,0 +1,27 @@
+import { defineFakeRoute } from "vite-plugin-fake-server/client";
+
+// 模拟刷新token接口
+export default defineFakeRoute([
+  {
+    url: "/refresh-token",
+    method: "post",
+    response: ({ body }) => {
+      if (body.refreshToken) {
+        return {
+          success: true,
+          data: {
+            accessToken: "eyJhbGciOiJIUzUxMiJ9.newAdmin",
+            refreshToken: "eyJhbGciOiJIUzUxMiJ9.newAdminRefresh",
+            // `expires`选择这种日期格式是为了方便调试，后端直接设置时间戳或许更方便（每次都应该递增）。如果后端返回的是时间戳格式，前端开发请来到这个目录`src/utils/auth.ts`，把第`38`行的代码换成expires = data.expires即可。
+            expires: "2030/10/30 23:59:59"
+          }
+        };
+      } else {
+        return {
+          success: false,
+          data: {}
+        };
+      }
+    }
+  }
+]);

package.json

@@ -1,140 +1,159 @@
 {
   "name": "pure-admin-thin",
-  "version": "3.4.5",
+  "version": "6.0.0",
   "private": true,
+  "type": "module",
   "scripts": {
-    "dev": "cross-env --max_old_space_size=4096 vite",
+    "dev": "NODE_OPTIONS=--max-old-space-size=4096 vite",
     "serve": "pnpm dev",
-    "build": "rimraf dist && cross-env NODE_OPTIONS=--max-old-space-size=8192 vite build",
+    "build": "rimraf dist && NODE_OPTIONS=--max-old-space-size=8192 vite build",
-    "build:staging": "rimraf dist && cross-env vite build --mode staging",
+    "build:staging": "rimraf dist && vite build --mode staging",
-    "report": "rimraf dist && cross-env vite build",
+    "report": "rimraf dist && vite build",
     "preview": "vite preview",
     "preview:build": "pnpm build && vite preview",
     "typecheck": "tsc --noEmit && vue-tsc --noEmit --skipLibCheck",
-    "cloc": "cross-env --max_old_space_size=4096 cloc . --exclude-dir=node_modules --exclude-lang=YAML",
+    "svgo": "svgo -f . -r",
-    "clean:cache": "rm -rf node_modules && rm -rf .eslintcache && pnpm install",
+    "clean:cache": "rimraf .eslintcache && rimraf pnpm-lock.yaml && rimraf node_modules && pnpm store prune && pnpm install",
-    "lint:eslint": "eslint --cache --max-warnings 0  \"{src,mock}/**/*.{vue,ts,tsx}\" --fix",
+    "lint:eslint": "eslint --cache --max-warnings 0  \"{src,mock,build}/**/*.{vue,js,ts,tsx}\" --fix",
-    "lint:prettier": "prettier --write  \"src/**/*.{js,json,tsx,css,less,scss,vue,html,md}\"",
+    "lint:prettier": "prettier --write  \"src/**/*.{js,ts,json,tsx,css,scss,vue,html,md}\"",
-    "lint:stylelint": "stylelint --cache --fix \"**/*.{vue,css,scss,postcss,less}\" --cache --cache-location node_modules/.cache/stylelint/",
+    "lint:stylelint": "stylelint --cache --fix \"**/*.{html,vue,css,scss}\" --cache-location node_modules/.cache/stylelint/",
-    "lint:lint-staged": "lint-staged -c ./.husky/lintstagedrc.js",
-    "lint:pretty": "pretty-quick --staged",
     "lint": "pnpm lint:eslint && pnpm lint:prettier && pnpm lint:stylelint",
-    "prepare": "husky install",
+    "prepare": "husky",
     "preinstall": "npx only-allow pnpm"
   },
-  "browserslist": [
+  "keywords": [
-    "> 1%",
+    "pure-admin-thin",
-    "not ie 11",
+    "vue-pure-admin",
-    "not op_mini all"
+    "element-plus",
+    "tailwindcss",
+    "pure-admin",
+    "typescript",
+    "pinia",
+    "vue3",
+    "vite",
+    "esm"
   ],
+  "homepage": "https://github.com/pure-admin/pure-admin-thin",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/pure-admin/pure-admin-thin.git"
+  },
+  "bugs": {
+    "url": "https://github.com/pure-admin/vue-pure-admin/issues"
+  },
+  "license": "MIT",
+  "author": {
+    "name": "xiaoxian521",
+    "email": "pureadmin@163.com",
+    "url": "https://github.com/xiaoxian521"
+  },
   "dependencies": {
-    "@ctrl/tinycolor": "^3.4.1",
+    "@pureadmin/descriptions": "^1.2.1",
-    "@pureadmin/components": "^1.1.0",
+    "@pureadmin/table": "^3.2.1",
-    "@pureadmin/descriptions": "^1.1.0",
+    "@pureadmin/utils": "^2.6.0",
-    "@pureadmin/table": "^1.2.0",
+    "@vueuse/core": "^13.1.0",
-    "@pureadmin/utils": "^0.1.1",
+    "@vueuse/motion": "^3.0.3",
-    "@vueuse/core": "^9.1.0",
-    "@vueuse/motion": "^2.0.0-beta.12",
-    "@vueuse/shared": "^9.1.0",
     "animate.css": "^4.1.1",
-    "axios": "^0.27.2",
+    "axios": "^1.9.0",
-    "css-color-function": "^1.3.3",
+    "dayjs": "^1.11.13",
-    "dayjs": "^1.11.4",
+    "echarts": "^5.6.0",
-    "echarts": "^5.3.3",
+    "element-plus": "^2.9.8",
-    "element-plus": "^2.2.14",
+    "js-cookie": "^3.0.5",
-    "element-resize-detector": "^1.2.3",
+    "localforage": "^1.10.0",
-    "js-cookie": "^3.0.1",
+    "mitt": "^3.0.1",
-    "lodash": "^4.17.21",
-    "lodash-es": "^4.17.21",
-    "lodash-unified": "^1.0.2",
-    "mitt": "^3.0.0",
-    "mockjs": "^1.1.0",
     "nprogress": "^0.2.0",
-    "path": "^0.12.7",
+    "path-browserify": "^1.0.1",
-    "pinia": "^2.0.19",
+    "pinia": "^3.0.2",
-    "qrcode": "^1.5.1",
+    "pinyin-pro": "^3.26.0",
-    "qs": "^6.11.0",
+    "qs": "^6.14.0",
-    "resize-observer-polyfill": "^1.5.1",
+    "responsive-storage": "^2.2.0",
-    "responsive-storage": "^2.1.0",
+    "sortablejs": "^1.15.6",
-    "rgb-hex": "^4.0.0",
+    "vue": "^3.5.13",
-    "vue": "^3.2.37",
+    "vue-router": "^4.5.0",
-    "vue-i18n": "^9.2.2",
+    "vue-tippy": "^6.7.0",
-    "vue-router": "^4.1.3",
+    "vue-types": "^6.0.0"
-    "vue-types": "^4.2.1",
-    "vxe-table": "^4.3.0-beta.5",
-    "xe-utils": "^3.5.6"
   },
   "devDependencies": {
-    "@commitlint/cli": "13.1.0",
+    "@commitlint/cli": "^19.8.0",
-    "@commitlint/config-conventional": "13.1.0",
+    "@commitlint/config-conventional": "^19.8.0",
-    "@iconify-icons/ep": "^1.2.7",
+    "@commitlint/types": "^19.8.0",
-    "@iconify-icons/ri": "^1.2.3",
+    "@eslint/js": "^9.25.1",
-    "@iconify/vue": "^3.2.1",
+    "@faker-js/faker": "^9.7.0",
-    "@intlify/vite-plugin-vue-i18n": "^6.0.1",
+    "@iconify/json": "^2.2.331",
-    "@pureadmin/theme": "^2.4.0",
+    "@iconify/vue": "4.2.0",
-    "@types/element-resize-detector": "1.1.3",
+    "@tailwindcss/vite": "^4.1.4",
-    "@types/js-cookie": "^3.0.1",
+    "@types/js-cookie": "^3.0.6",
-    "@types/lodash": "^4.14.180",
+    "@types/node": "^20.17.30",
-    "@types/lodash-es": "^4.17.6",
+    "@types/nprogress": "^0.2.3",
-    "@types/mockjs": "1.0.3",
+    "@types/path-browserify": "^1.0.3",
-    "@types/node": "14.14.14",
+    "@types/qs": "^6.9.18",
-    "@types/nprogress": "0.2.0",
+    "@types/sortablejs": "^1.15.8",
-    "@types/qrcode": "^1.5.0",
+    "@vitejs/plugin-vue": "^5.2.3",
-    "@types/qs": "^6.9.7",
+    "@vitejs/plugin-vue-jsx": "^4.1.2",
-    "@typescript-eslint/eslint-plugin": "^5.10.2",
+    "boxen": "^8.0.1",
-    "@typescript-eslint/parser": "^5.10.2",
+    "code-inspector-plugin": "^0.20.10",
-    "@vitejs/plugin-legacy": "^2.0.0",
+    "cssnano": "^7.0.6",
-    "@vitejs/plugin-vue": "^3.0.1",
+    "eslint": "^9.25.1",
-    "@vitejs/plugin-vue-jsx": "^2.0.0",
+    "eslint-config-prettier": "^10.1.2",
-    "@vue/eslint-config-prettier": "^7.0.0",
+    "eslint-plugin-prettier": "^5.2.6",
-    "@vue/eslint-config-typescript": "^10.0.0",
+    "eslint-plugin-vue": "^10.0.0",
-    "@vue/runtime-core": "^3.2.37",
+    "gradient-string": "^3.0.0",
-    "autoprefixer": "^10.4.8",
+    "husky": "^9.1.7",
-    "cloc": "^2.10.0",
+    "lint-staged": "^15.5.1",
-    "cross-env": "7.0.3",
+    "postcss": "^8.5.3",
-    "eslint": "^8.8.0",
+    "postcss-html": "^1.8.0",
-    "eslint-plugin-prettier": "^4.0.0",
+    "postcss-load-config": "^6.0.1",
-    "eslint-plugin-vue": "^8.4.1",
+    "postcss-scss": "^4.0.9",
-    "font-awesome": "^4.7.0",
+    "prettier": "^3.5.3",
-    "husky": "^7.0.4",
+    "rimraf": "^6.0.1",
-    "lint-staged": "11.1.2",
+    "rollup-plugin-visualizer": "^5.14.0",
-    "picocolors": "^1.0.0",
+    "sass": "^1.87.0",
-    "postcss": "^8.4.16",
+    "stylelint": "^16.19.0",
-    "postcss-html": "^1.5.0",
+    "stylelint-config-recess-order": "^6.0.0",
-    "postcss-import": "^14.1.0",
+    "stylelint-config-recommended-vue": "^1.6.0",
-    "postcss-scss": "^4.0.4",
+    "stylelint-config-standard-scss": "^14.0.0",
-    "prettier": "^2.5.1",
+    "stylelint-prettier": "^5.0.3",
-    "pretty-quick": "3.1.1",
+    "svgo": "^3.3.2",
-    "rimraf": "3.0.2",
+    "tailwindcss": "^4.1.4",
-    "rollup-plugin-visualizer": "^5.7.1",
+    "typescript": "^5.8.3",
-    "sass": "^1.53.0",
+    "typescript-eslint": "^8.31.0",
-    "sass-loader": "^13.0.2",
+    "unplugin-icons": "^22.1.0",
-    "stylelint": "^14.3.0",
+    "vite": "^6.3.3",
-    "stylelint-config-html": "^1.0.0",
+    "vite-plugin-cdn-import": "^1.0.1",
-    "stylelint-config-prettier": "^9.0.3",
+    "vite-plugin-compression": "^0.5.1",
-    "stylelint-config-recommended": "^6.0.0",
+    "vite-plugin-fake-server": "^2.2.0",
-    "stylelint-config-standard": "^24.0.0",
+    "vite-plugin-remove-console": "^2.2.0",
-    "stylelint-order": "^5.0.0",
+    "vite-plugin-router-warn": "^1.0.0",
-    "typescript": "^4.7.4",
+    "vite-svg-loader": "^5.1.0",
-    "unocss": "^0.45.9",
+    "vue-eslint-parser": "^10.1.3",
-    "unplugin-vue-define-options": "^0.7.3",
+    "vue-tsc": "^2.2.10"
-    "vite": "^3.0.9",
+  },
-    "vite-plugin-mock": "^2.9.6",
+  "engines": {
-    "vite-plugin-remove-console": "^1.1.0",
+    "node": "^18.18.0 || ^20.9.0 || >=22.0.0",
-    "vite-svg-loader": "^3.4.0",
+    "pnpm": ">=9"
-    "vue-eslint-parser": "^8.2.0",
-    "vue-tsc": "^0.40.1"
   },
   "pnpm": {
-    "peerDependencyRules": {
+    "allowedDeprecatedVersions": {
-      "ignoreMissing": [
+      "are-we-there-yet": "*",
-        "rollup",
+      "sourcemap-codec": "*",
-        "terser",
+      "lodash.isequal": "*",
-        "webpack"
+      "domexception": "*",
+      "w3c-hr-time": "*",
+      "inflight": "*",
+      "npmlog": "*",
+      "rimraf": "*",
+      "stable": "*",
+      "gauge": "*",
+      "abab": "*",
+      "glob": "*"
+    },
+    "onlyBuiltDependencies": [
+      "@parcel/watcher",
+      "core-js",
+      "es5-ext",
+      "esbuild",
+      "typeit",
+      "vue-demi"
     ]
   }
-  },
-  "repository": "git@github.com:xiaoxian521/pure-admin-thin.git",
-  "author": "xiaoxian521",
-  "license": "MIT"
 }

postcss.config.js

@@ -1,3 +1,8 @@
-module.exports = {
+// @ts-check
-  plugins: [require("autoprefixer"), require("postcss-import")]
+
+/** @type {import('postcss-load-config').Config} */
+export default {
+  plugins: {
+    ...(process.env.NODE_ENV === "production" ? { cssnano: {} } : {})
+  }
 };

public/logo.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" class="icon" viewBox="0 0 1024 1024"><path fill="#386BF3" d="M410.558.109c0 210.974-300.876 361.752-300.876 633.548 0 174.943 134.704 316.787 300.876 316.787s300.877-141.817 300.877-316.787C711.408 361.752 410.558 210.974 410.558.109"/><path fill="#C3D2FB" d="M613.469 73.665c0 211.055-300.877 361.914-300.877 633.547C312.592 882.156 447.296 1024 613.47 1024s300.876-141.817 300.876-316.788C914.29 435.58 613.469 284.72 613.469 73.665"/><path fill="#303F5B" d="M312.592 707.212c0-183.713 137.636-312.171 226.723-441.39 81.702 106.112 172.12 218.74 172.12 367.726A309.755 309.755 0 0 1 420.36 950.064a323.1 323.1 0 0 1-107.769-242.852z"/></svg>

public/platform-config.json

@@ -0,0 +1,26 @@
+{
+  "Version": "6.0.0",
+  "Title": "PureAdmin",
+  "FixedHeader": true,
+  "HiddenSideBar": false,
+  "MultiTagsCache": false,
+  "KeepAlive": true,
+  "Layout": "vertical",
+  "Theme": "light",
+  "DarkMode": false,
+  "OverallStyle": "light",
+  "Grey": false,
+  "Weak": false,
+  "HideTabs": false,
+  "HideFooter": false,
+  "Stretch": false,
+  "SidebarStatus": true,
+  "EpThemeColor": "#409EFF",
+  "ShowLogo": true,
+  "ShowModel": "smart",
+  "MenuArrowIconNoTransition": false,
+  "CachingAsyncRoutes": false,
+  "TooltipEffect": "light",
+  "ResponsiveStorageNameSpace": "responsive-",
+  "MenuSearchHistory": 6
+}

public/serverConfig.json

@@ -1,19 +0,0 @@
-{
-  "Version": "3.4.5",
-  "Title": "PureAdmin",
-  "FixedHeader": true,
-  "HiddenSideBar": false,
-  "MultiTagsCache": false,
-  "KeepAlive": true,
-  "Locale": "zh",
-  "Layout": "vertical",
-  "Theme": "default",
-  "DarkMode": false,
-  "Grey": false,
-  "Weak": false,
-  "HideTabs": false,
-  "SidebarStatus": true,
-  "EpThemeColor": "#409EFF",
-  "ShowLogo": true,
-  "ShowModel": "smart"
-}

src/App.vue

@@ -1,22 +1,25 @@
 <template>
   <el-config-provider :locale="currentLocale">
     <router-view />
+    <ReDialog />
   </el-config-provider>
 </template>
 
 <script lang="ts">
 import { defineComponent } from "vue";
 import { ElConfigProvider } from "element-plus";
-import zhCn from "element-plus/lib/locale/lang/zh-cn";
+import { ReDialog } from "@/components/ReDialog";
-import en from "element-plus/lib/locale/lang/en";
+import zhCn from "element-plus/es/locale/lang/zh-cn";
+
 export default defineComponent({
   name: "app",
   components: {
-    [ElConfigProvider.name]: ElConfigProvider
+    [ElConfigProvider.name]: ElConfigProvider,
+    ReDialog
   },
   computed: {
     currentLocale() {
-      return this.$storage.locale?.locale === "zh" ? zhCn : en;
+      return zhCn;
     }
   }
 });

src/api/routes.ts

@@ -1,10 +1,10 @@
-import { http } from "../utils/http";
+import { http } from "@/utils/http";
 
 type Result = {
-  code: number;
+  success: boolean;
-  info: Array<any>;
+  data: Array<any>;
 };
 
-export const getAsyncRoutes = (params?: object) => {
+export const getAsyncRoutes = () => {
-  return http.request<Result>("get", "/getAsyncRoutes", { params });
+  return http.request<Result>("get", "/get-async-routes");
 };

src/api/user.ts

@@ -1,26 +1,45 @@
-import { http } from "../utils/http";
+import { http } from "@/utils/http";
 
-type Result = {
+export type UserResult = {
-  svg?: string;
+  success: boolean;
-  code?: number;
+  data: {
-  info?: object;
+    /** 头像 */
+    avatar: string;
+    /** 用户名 */
+    username: string;
+    /** 昵称 */
+    nickname: string;
+    /** 当前登录用户的角色 */
+    roles: Array<string>;
+    /** 按钮级别权限 */
+    permissions: Array<string>;
+    /** `token` */
+    accessToken: string;
+    /** 用于调用刷新`accessToken`的接口时所需的`token` */
+    refreshToken: string;
+    /** `accessToken`的过期时间（格式'xxxx/xx/xx xx:xx:xx'） */
+    expires: Date;
+  };
 };
 
-// 获取验证码
+export type RefreshTokenResult = {
-export const getVerify = () => {
+  success: boolean;
-  return http.request<Result>("get", "/captcha");
+  data: {
+    /** `token` */
+    accessToken: string;
+    /** 用于调用刷新`accessToken`的接口时所需的`token` */
+    refreshToken: string;
+    /** `accessToken`的过期时间（格式'xxxx/xx/xx xx:xx:xx'） */
+    expires: Date;
+  };
 };
 
-// 登录
+/** 登录 */
-export const getLogin = (data: object) => {
+export const getLogin = (data?: object) => {
-  return http.request("post", "/login", { data });
+  return http.request<UserResult>("post", "/login", { data });
 };
 
-// 刷新token
+/** 刷新`token` */
-export const refreshToken = (data: object) => {
+export const refreshTokenApi = (data?: object) => {
-  return http.request("post", "/refreshToken", { data });
+  return http.request<RefreshTokenResult>("post", "/refresh-token", { data });
 };
-
-// export const searchVague = (data: object) => {
-//   return http.request("post", "/searchVague", { data });
-// };

src/assets/iconfont/iconfont.css

@@ -1,8 +1,9 @@
 @font-face {
   font-family: "iconfont"; /* Project id 2208059 */
-  src: url("iconfont.woff2?t=1638023560828") format("woff2"),
+  src:
-    url("iconfont.woff?t=1638023560828") format("woff"),
+    url("iconfont.woff2?t=1671895108120") format("woff2"),
-    url("iconfont.ttf?t=1638023560828") format("truetype");
+    url("iconfont.woff?t=1671895108120") format("woff"),
+    url("iconfont.ttf?t=1671895108120") format("truetype");
 }
 
 .iconfont {
@@ -13,26 +14,14 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
-.team-icontabs::before {
+.pure-iconfont-tabs:before {
   content: "\e63e";
 }
 
-.team-iconlogo::before {
+.pure-iconfont-logo:before {
   content: "\e620";
 }
 
-.team-iconxinpin::before {
+.pure-iconfont-new:before {
-  content: "\e614";
-}
-
-.team-iconxinpinrenqiwang::before {
   content: "\e615";
 }
-
-.team-iconexit-fullscreen::before {
-  content: "\e62a";
-}
-
-.team-iconfullscreen::before {
-  content: "\e62b";
-}

src/assets/iconfont/iconfont.json

@@ -2,50 +2,29 @@
   "id": "2208059",
   "name": "pure-admin",
   "font_family": "iconfont",
-  "css_prefix_text": "team-icon",
+  "css_prefix_text": "pure-iconfont-",
-  "description": "pure-admin",
+  "description": "pure-admin-iconfont",
   "glyphs": [
     {
       "icon_id": "20594647",
-      "name": "标签页",
+      "name": "Tabs",
       "font_class": "tabs",
       "unicode": "e63e",
       "unicode_decimal": 58942
     },
     {
       "icon_id": "22129506",
-      "name": "水能",
+      "name": "PureLogo",
       "font_class": "logo",
       "unicode": "e620",
       "unicode_decimal": 58912
     },
-    {
-      "icon_id": "7795613",
-      "name": "新品",
-      "font_class": "xinpin",
-      "unicode": "e614",
-      "unicode_decimal": 58900
-    },
     {
       "icon_id": "7795615",
-      "name": "新品人气王",
+      "name": "New",
-      "font_class": "xinpinrenqiwang",
+      "font_class": "new",
       "unicode": "e615",
       "unicode_decimal": 58901
-    },
-    {
-      "icon_id": "5698509",
-      "name": "全屏缩小",
-      "font_class": "exit-fullscreen",
-      "unicode": "e62a",
-      "unicode_decimal": 58922
-    },
-    {
-      "icon_id": "5698510",
-      "name": "全屏显示",
-      "font_class": "fullscreen",
-      "unicode": "e62b",
-      "unicode_decimal": 58923
     }
   ]
 }

src/assets/login/avatar.svg

@@ -1 +1 @@
-<svg t="1636193306629" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1847" width="32" height="32"><path d="M410.558481 0.10861C410.558481 211.083075 109.682285 361.860579 109.682285 633.656511c0 174.943176 134.703259 316.787527 300.876196 316.787527s300.876197-141.817198 300.876197-316.787527C711.407525 361.751969 410.558481 210.974465 410.558481 0.10861z" fill="#386BF3" p-id="1848"></path><path d="M613.468671 73.664572c0 211.055922-300.876197 361.914883-300.876196 633.547901 0 174.943176 134.703259 316.787527 300.876196 316.787527s300.876197-141.817198 300.876197-316.787527c-0.054305-271.633018-300.876197-422.491979-300.876197-633.547901z" fill="#C3D2FB" p-id="1849"></path><path d="M312.592475 707.212473c0-183.713414 137.635722-312.171612 226.72288-441.390078 81.701694 106.111739 172.119322 218.740063 172.119323 367.725506a309.755045 309.755045 0 0 1-291.074166 316.516003 323.114046 323.114046 0 0 1-107.768037-242.851431z" fill="#303F5B" p-id="1850"></path></svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" class="icon" viewBox="0 0 1024 1024"><path fill="#386BF3" d="M410.558.109c0 210.974-300.876 361.752-300.876 633.548 0 174.943 134.704 316.787 300.876 316.787s300.877-141.817 300.877-316.787C711.408 361.752 410.558 210.974 410.558.109"/><path fill="#C3D2FB" d="M613.469 73.665c0 211.055-300.877 361.914-300.877 633.547C312.592 882.156 447.296 1024 613.47 1024s300.876-141.817 300.876-316.788C914.29 435.58 613.469 284.72 613.469 73.665"/><path fill="#303F5B" d="M312.592 707.212c0-183.713 137.636-312.171 226.723-441.39 81.702 106.112 172.12 218.74 172.12 367.726A309.755 309.755 0 0 1 420.36 950.064a323.1 323.1 0 0 1-107.769-242.852z"/></svg>

src/assets/svg/back_top.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M2.88 18.054a35.897 35.897 0 0 1 8.531-16.32.8.8 0 0 1 1.178 0c.166.18.304.332.413.455a35.897 35.897 0 0 1 8.118 15.865c-2.141.451-4.34.747-6.584.874l-2.089 4.178a.5.5 0 0 1-.894 0l-2.089-4.178a44.019 44.019 0 0 1-6.584-.874zm6.698-1.123l1.157.066L12 19.527l1.265-2.53 1.157-.066a42.137 42.137 0 0 0 4.227-.454A33.913 33.913 0 0 0 12 4.09a33.913 33.913 0 0 0-6.649 12.387c1.395.222 2.805.374 4.227.454zM12 15a3 3 0 1 1 0-6 3 3 0 0 1 0 6zm0-2a1 1 0 1 0 0-2 1 1 0 0 0 0 2z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M2.88 18.054a35.9 35.9 0 0 1 8.531-16.32.8.8 0 0 1 1.178 0q.25.27.413.455a35.9 35.9 0 0 1 8.118 15.865c-2.141.451-4.34.747-6.584.874l-2.089 4.178a.5.5 0 0 1-.894 0l-2.089-4.178a44 44 0 0 1-6.584-.874m6.698-1.123 1.157.066L12 19.527l1.265-2.53 1.157-.066a42 42 0 0 0 4.227-.454A33.9 33.9 0 0 0 12 4.09a33.9 33.9 0 0 0-6.649 12.387q2.093.334 4.227.454M12 15a3 3 0 1 1 0-6 3 3 0 0 1 0 6m0-2a1 1 0 1 0 0-2 1 1 0 0 0 0 2"/></svg>

src/assets/svg/close.svg

@@ -1 +0,0 @@
- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 36 36"><path d="M19.41 18l8.29-8.29a1 1 0 0 0-1.41-1.41L18 16.59l-8.29-8.3a1 1 0 0 0-1.42 1.42l8.3 8.29l-8.3 8.29A1 1 0 1 0 9.7 27.7l8.3-8.29l8.29 8.29a1 1 0 0 0 1.41-1.41z" fill="currentColor"></path></svg>

src/assets/svg/close_all.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 36 36"><path d="M26 17H10a1 1 0 0 0 0 2h16a1 1 0 0 0 0-2z" fill="currentColor"></path></svg>

src/assets/svg/close_left.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><g fill="none"><path d="M7 12l7 7" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path><path d="M7 12l7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path><path d="M21 12H7.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" ></path><path d="M3 3v18" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path></g></svg>

src/assets/svg/close_other.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 20 20"><path d="M3 5h14V3H3v2zm12 8V7H5v6h10zM3 17h14v-2H3v2z" fill="currentColor"></path></svg>

src/assets/svg/close_right.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><g transform="translate(24 0) scale(-1 1)"><g fill="none"><path d="M7 12l7 7" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path><path d="M7 12l7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path><path d="M21 12H7.5" stroke="currentColor" stroke-width="2" stroke-linecap="round"></path><path d="M3 3v18" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path></g></g></svg>

src/assets/svg/dark.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16"><path fill="none" d="M0 0h24v24H0z"/><path d="M11.38 2.019a7.5 7.5 0 1 0 10.6 10.6C21.662 17.854 17.316 22 12.001 22 6.477 22 2 17.523 2 12c0-5.315 4.146-9.661 9.38-9.981z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path d="M11.38 2.019a7.5 7.5 0 1 0 10.6 10.6C21.662 17.854 17.316 22 12.001 22 6.477 22 2 17.523 2 12c0-5.315 4.146-9.661 9.38-9.981"/></svg>

src/assets/svg/day.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 18a6 6 0 1 1 0-12 6 6 0 0 1 0 12zM11 1h2v3h-2V1zm0 19h2v3h-2v-3zM3.515 4.929l1.414-1.414L7.05 5.636 5.636 7.05 3.515 4.93zM16.95 18.364l1.414-1.414 2.121 2.121-1.414 1.414-2.121-2.121zm2.121-14.85l1.414 1.415-2.121 2.121-1.414-1.414 2.121-2.121zM5.636 16.95l1.414 1.414-2.121 2.121-1.414-1.414 2.121-2.121zM23 11v2h-3v-2h3zM4 11v2H1v-2h3z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 18a6 6 0 1 1 0-12 6 6 0 0 1 0 12M11 1h2v3h-2zm0 19h2v3h-2zM3.515 4.929l1.414-1.414L7.05 5.636 5.636 7.05zM16.95 18.364l1.414-1.414 2.121 2.121-1.414 1.414zm2.121-14.85 1.414 1.415-2.121 2.121-1.414-1.414 2.121-2.121zM5.636 16.95l1.414 1.414-2.121 2.121-1.414-1.414zM23 11v2h-3v-2zM4 11v2H1v-2z"/></svg>

src/assets/svg/enter_outlined.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--ant-design" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 1024 1024"><path fill="currentColor" d="M864 170h-60c-4.4 0-8 3.6-8 8v518H310v-73c0-6.7-7.8-10.5-13-6.3l-141.9 112a8 8 0 0 0 0 12.6l141.9 112c5.3 4.2 13 .4 13-6.3v-75h498c35.3 0 64-28.7 64-64V178c0-4.4-3.6-8-8-8z"></path></svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" class="iconify iconify--ant-design" viewBox="0 0 1024 1024"><path fill="currentColor" d="M864 170h-60c-4.4 0-8 3.6-8 8v518H310v-73c0-6.7-7.8-10.5-13-6.3l-141.9 112a8 8 0 0 0 0 12.6l141.9 112c5.3 4.2 13 .4 13-6.3v-75h498c35.3 0 64-28.7 64-64V178c0-4.4-3.6-8-8-8"/></svg>

src/assets/svg/exit_screen.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" class="re-screen" color="#00000073" preserveAspectRatio="xMidYMid meet" viewBox="0 0 16 16"><g fill="currentColor"><path d="M3.5 4H1V3h2V1h1v2.5l-.5.5zM13 3V1h-1v2.5l.5.5H15V3h-2zm-1 9.5V15h1v-2h2v-1h-2.5l-.5.5zM1 12v1h2v2h1v-2.5l-.5-.5H1zm11-1.5l-.5.5h-7l-.5-.5v-5l.5-.5h7l.5.5v5zM10 7H6v2h4V7z"></path></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" class="re-screen" color="#00000073" viewBox="0 0 16 16"><path fill="currentColor" d="M3.5 4H1V3h2V1h1v2.5zM13 3V1h-1v2.5l.5.5H15V3zm-1 9.5V15h1v-2h2v-1h-2.5zM1 12v1h2v2h1v-2.5l-.5-.5zm11-1.5-.5.5h-7l-.5-.5v-5l.5-.5h7l.5.5zM10 7H6v2h4z"/></svg>

src/assets/svg/full_screen.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" class="re-screen" color="#00000073" preserveAspectRatio="xMidYMid meet" viewBox="0 0 16 16"><g fill="currentColor"><path d="M3 12h10V4H3v8zm2-6h6v4H5V6zM2 6H1V2.5l.5-.5H5v1H2v3zm13-3.5V6h-1V3h-3V2h3.5l.5.5zM14 10h1v3.5l-.5.5H11v-1h3v-3zM2 13h3v1H1.5l-.5-.5V10h1v3z"></path></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" class="re-screen" color="#00000073" viewBox="0 0 16 16"><path fill="currentColor" d="M3 12h10V4H3zm2-6h6v4H5zM2 6H1V2.5l.5-.5H5v1H2zm13-3.5V6h-1V3h-3V2h3.5zM14 10h1v3.5l-.5.5H11v-1h3zM2 13h3v1H1.5l-.5-.5V10h1z"/></svg>

src/assets/svg/globalization.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="globalization" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 512 512"><path d="M478.33 433.6l-90-218a22 22 0 0 0-40.67 0l-90 218a22 22 0 1 0 40.67 16.79L316.66 406h102.67l18.33 44.39A22 22 0 0 0 458 464a22 22 0 0 0 20.32-30.4zM334.83 362L368 281.65L401.17 362z" fill="currentColor"></path><path d="M267.84 342.92a22 22 0 0 0-4.89-30.7c-.2-.15-15-11.13-36.49-34.73c39.65-53.68 62.11-114.75 71.27-143.49H330a22 22 0 0 0 0-44H214V70a22 22 0 0 0-44 0v20H54a22 22 0 0 0 0 44h197.25c-9.52 26.95-27.05 69.5-53.79 108.36c-31.41-41.68-43.08-68.65-43.17-68.87a22 22 0 0 0-40.58 17c.58 1.38 14.55 34.23 52.86 83.93c.92 1.19 1.83 2.35 2.74 3.51c-39.24 44.35-77.74 71.86-93.85 80.74a22 22 0 1 0 21.07 38.63c2.16-1.18 48.6-26.89 101.63-85.59c22.52 24.08 38 35.44 38.93 36.1a22 22 0 0 0 30.75-4.9z" fill="currentColor"></path></svg>

src/assets/svg/keyboard_esc.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" class="iconify iconify--mdi" viewBox="0 0 24 24"><path fill="currentColor" d="M1 7h6v2H3v2h4v2H3v2h4v2H1zm10 0h4v2h-4v2h2a2 2 0 0 1 2 2v2c0 1.11-.89 2-2 2H9v-2h4v-2h-2a2 2 0 0 1-2-2V9c0-1.1.9-2 2-2m8 0h2a2 2 0 0 1 2 2v1h-2V9h-2v6h2v-1h2v1c0 1.11-.89 2-2 2h-2a2 2 0 0 1-2-2V9c0-1.1.9-2 2-2"/></svg>

src/assets/svg/mdi_keyboard_esc.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--mdi" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="M1 7h6v2H3v2h4v2H3v2h4v2H1V7m10 0h4v2h-4v2h2a2 2 0 0 1 2 2v2c0 1.11-.89 2-2 2H9v-2h4v-2h-2a2 2 0 0 1-2-2V9c0-1.1.9-2 2-2m8 0h2a2 2 0 0 1 2 2v1h-2V9h-2v6h2v-1h2v1c0 1.11-.89 2-2 2h-2a2 2 0 0 1-2-2V9c0-1.1.9-2 2-2Z"></path></svg>

src/assets/svg/refresh.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 512 512"><path d="M400 148l-21.12-24.57A191.43 191.43 0 0 0 240 64C134 64 48 150 48 256s86 192 192 192a192.09 192.09 0 0 0 181.07-128" fill="none" stroke="currentColor" stroke-linecap="square" stroke-miterlimit="10" stroke-width="32"></path><path d="M464 68.45V220a4 4 0 0 1-4 4H308.45a4 4 0 0 1-2.83-6.83L457.17 65.62a4 4 0 0 1 6.83 2.83z" fill="currentColor"></path></svg>

src/assets/svg/system.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" class="icon" viewBox="0 0 1024 1024"><path d="M554 849.574c0 23.365-18.635 42.307-42 42.307s-42-18.941-42-42.307V662.719c0-23.365 18.635-42.307 42-42.307v-7.051c23.365 0 42 25.993 42 49.358z"/><path d="M893 888.5c0 17.397-14.103 31.5-31.5 31.5h-700c-17.397 0-31.5-14.103-31.5-31.5s14.103-31.5 31.5-31.5h700c17.397 0 31.5 14.103 31.5 31.5m33-714.074C926 135.484 894.686 105 855.744 105H168.256C129.314 105 98 135.484 98 174.426V533h828zM98 630.988C98 669.931 129.314 702 168.256 702h687.488C894.686 702 926 669.931 926 630.988V596H98z"/></svg>

src/assets/table-bar/collapse.svg

@@ -0,0 +1 @@
+<svg width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M13.79 10.21a1 1 0 0 0 1.42 0 1 1 0 0 0 0-1.42l-2.5-2.5a1 1 0 0 0-.33-.21 1 1 0 0 0-.76 0 1 1 0 0 0-.33.21l-2.5 2.5a1 1 0 0 0 1.42 1.42l.79-.8v5.18l-.79-.8a1 1 0 0 0-1.42 1.42l2.5 2.5a1 1 0 0 0 .33.21.94.94 0 0 0 .76 0 1 1 0 0 0 .33-.21l2.5-2.5a1 1 0 0 0-1.42-1.42l-.79.8V9.41ZM7 4h10a1 1 0 0 0 0-2H7a1 1 0 0 0 0 2m10 16H7a1 1 0 0 0 0 2h10a1 1 0 0 0 0-2"/></svg>

src/assets/table-bar/drag.svg

@@ -0,0 +1 @@
+<svg width="32" height="32" fill="currentColor" data-icon="holder" viewBox="64 64 896 896"><path d="M300 276.5a56 56 0 1 0 56-97 56 56 0 0 0-56 97m0 284a56 56 0 1 0 56-97 56 56 0 0 0-56 97M640 228a56 56 0 1 0 112 0 56 56 0 0 0-112 0m0 284a56 56 0 1 0 112 0 56 56 0 0 0-112 0M300 844.5a56 56 0 1 0 56-97 56 56 0 0 0-56 97M640 796a56 56 0 1 0 112 0 56 56 0 0 0-112 0"/></svg>

src/assets/table-bar/expand.svg

@@ -0,0 +1 @@
+<svg width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M22 4V2H2v2h9v14.17l-5.5-5.5-1.42 1.41L12 22l7.92-7.92-1.42-1.41-5.5 5.5V4z"/></svg>

src/assets/table-bar/refresh.svg

@@ -0,0 +1 @@
+<svg width="32" height="32" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 11A8.1 8.1 0 0 0 4.5 9M4 5v4h4m-4 4a8.1 8.1 0 0 0 15.5 2m.5 4v-4h-4"/></svg>

src/assets/table-bar/settings.svg

@@ -0,0 +1 @@
+<svg width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M3.34 17a10 10 0 0 1-.978-2.326 3 3 0 0 0 .002-5.347A10 10 0 0 1 4.865 4.99a3 3 0 0 0 4.631-2.674 10 10 0 0 1 5.007.002 3 3 0 0 0 4.632 2.672A10 10 0 0 1 20.66 7c.433.749.757 1.53.978 2.326a3 3 0 0 0-.002 5.347 10 10 0 0 1-2.501 4.337 3 3 0 0 0-4.631 2.674 10 10 0 0 1-5.007-.002 3 3 0 0 0-4.632-2.672A10 10 0 0 1 3.34 17m5.66.196a5 5 0 0 1 2.25 2.77q.75.071 1.499.001A5 5 0 0 1 15 17.197a5 5 0 0 1 3.525-.565q.435-.614.748-1.298A5 5 0 0 1 18 12c0-1.26.47-2.437 1.273-3.334a8 8 0 0 0-.75-1.298A5 5 0 0 1 15 6.804a5 5 0 0 1-2.25-2.77q-.75-.071-1.499-.001A5 5 0 0 1 9 6.803a5 5 0 0 1-3.525.565 8 8 0 0 0-.748 1.298A5 5 0 0 1 6 12a5 5 0 0 1-1.273 3.334 8 8 0 0 0 .75 1.298A5 5 0 0 1 9 17.196M12 15a3 3 0 1 1 0-6 3 3 0 0 1 0 6m0-2a1 1 0 1 0 0-2 1 1 0 0 0 0 2"/></svg>

src/components/ReAuth/index.ts

@@ -0,0 +1,5 @@
+import auth from "./src/auth";
+
+const Auth = auth;
+
+export { Auth };

src/components/ReAuth/src/auth.tsx

@@ -0,0 +1,20 @@
+import { defineComponent, Fragment } from "vue";
+import { hasAuth } from "@/router/utils";
+
+export default defineComponent({
+  name: "Auth",
+  props: {
+    value: {
+      type: undefined,
+      default: []
+    }
+  },
+  setup(props, { slots }) {
+    return () => {
+      if (!slots) return null;
+      return hasAuth(props.value) ? (
+        <Fragment>{slots.default?.()}</Fragment>
+      ) : null;
+    };
+  }
+});

src/components/ReCol/index.ts

@@ -0,0 +1,29 @@
+import { ElCol } from "element-plus";
+import { h, defineComponent } from "vue";
+
+// 封装element-plus的el-col组件
+export default defineComponent({
+  name: "ReCol",
+  props: {
+    value: {
+      type: Number,
+      default: 24
+    }
+  },
+  render() {
+    const attrs = this.$attrs;
+    const val = this.value;
+    return h(
+      ElCol,
+      {
+        xs: val,
+        sm: val,
+        md: val,
+        lg: val,
+        xl: val,
+        ...attrs
+      },
+      { default: () => this.$slots.default() }
+    );
+  }
+});

src/components/ReDialog/index.ts

@@ -0,0 +1,69 @@
+import { ref } from "vue";
+import reDialog from "./index.vue";
+import { useTimeoutFn } from "@vueuse/core";
+import { withInstall } from "@pureadmin/utils";
+import type {
+  EventType,
+  ArgsType,
+  DialogProps,
+  ButtonProps,
+  DialogOptions
+} from "./type";
+
+const dialogStore = ref<Array<DialogOptions>>([]);
+
+/** 打开弹框 */
+const addDialog = (options: DialogOptions) => {
+  const open = () =>
+    dialogStore.value.push(Object.assign(options, { visible: true }));
+  if (options?.openDelay) {
+    useTimeoutFn(() => {
+      open();
+    }, options.openDelay);
+  } else {
+    open();
+  }
+};
+
+/** 关闭弹框 */
+const closeDialog = (options: DialogOptions, index: number, args?: any) => {
+  dialogStore.value[index].visible = false;
+  options.closeCallBack && options.closeCallBack({ options, index, args });
+
+  const closeDelay = options?.closeDelay ?? 200;
+  useTimeoutFn(() => {
+    dialogStore.value.splice(index, 1);
+  }, closeDelay);
+};
+
+/**
+ * @description 更改弹框自身属性值
+ * @param value 属性值
+ * @param key 属性，默认`title`
+ * @param index 弹框索引（默认`0`，代表只有一个弹框，对于嵌套弹框要改哪个弹框的属性值就把该弹框索引赋给`index`）
+ */
+const updateDialog = (value: any, key = "title", index = 0) => {
+  dialogStore.value[index][key] = value;
+};
+
+/** 关闭所有弹框 */
+const closeAllDialog = () => {
+  dialogStore.value = [];
+};
+
+/** 千万别忘了在下面这三处引入并注册下，放心注册，不使用`addDialog`调用就不会被挂载
+ * https://github.com/pure-admin/vue-pure-admin/blob/main/src/App.vue#L4
+ * https://github.com/pure-admin/vue-pure-admin/blob/main/src/App.vue#L12
+ * https://github.com/pure-admin/vue-pure-admin/blob/main/src/App.vue#L22
+ */
+const ReDialog = withInstall(reDialog);
+
+export type { EventType, ArgsType, DialogProps, ButtonProps, DialogOptions };
+export {
+  ReDialog,
+  dialogStore,
+  addDialog,
+  closeDialog,
+  updateDialog,
+  closeAllDialog
+};

src/components/ReDialog/index.vue

@@ -0,0 +1,206 @@
+<script setup lang="ts">
+import {
+  type EventType,
+  type ButtonProps,
+  type DialogOptions,
+  closeDialog,
+  dialogStore
+} from "./index";
+import { ref, computed } from "vue";
+import { isFunction } from "@pureadmin/utils";
+import Fullscreen from "~icons/ri/fullscreen-fill";
+import ExitFullscreen from "~icons/ri/fullscreen-exit-fill";
+
+defineOptions({
+  name: "ReDialog"
+});
+
+const sureBtnMap = ref({});
+const fullscreen = ref(false);
+
+const footerButtons = computed(() => {
+  return (options: DialogOptions) => {
+    return options?.footerButtons?.length > 0
+      ? options.footerButtons
+      : ([
+          {
+            label: "取消",
+            text: true,
+            bg: true,
+            btnClick: ({ dialog: { options, index } }) => {
+              const done = () =>
+                closeDialog(options, index, { command: "cancel" });
+              if (options?.beforeCancel && isFunction(options?.beforeCancel)) {
+                options.beforeCancel(done, { options, index });
+              } else {
+                done();
+              }
+            }
+          },
+          {
+            label: "确定",
+            type: "primary",
+            text: true,
+            bg: true,
+            popconfirm: options?.popconfirm,
+            btnClick: ({ dialog: { options, index } }) => {
+              if (options?.sureBtnLoading) {
+                sureBtnMap.value[index] = Object.assign(
+                  {},
+                  sureBtnMap.value[index],
+                  {
+                    loading: true
+                  }
+                );
+              }
+              const closeLoading = () => {
+                if (options?.sureBtnLoading) {
+                  sureBtnMap.value[index].loading = false;
+                }
+              };
+              const done = () => {
+                closeLoading();
+                closeDialog(options, index, { command: "sure" });
+              };
+              if (options?.beforeSure && isFunction(options?.beforeSure)) {
+                options.beforeSure(done, { options, index, closeLoading });
+              } else {
+                done();
+              }
+            }
+          }
+        ] as Array<ButtonProps>);
+  };
+});
+
+const fullscreenClass = computed(() => {
+  return [
+    "el-icon",
+    "el-dialog__close",
+    "-translate-x-2",
+    "cursor-pointer",
+    "hover:text-[red]!"
+  ];
+});
+
+function eventsCallBack(
+  event: EventType,
+  options: DialogOptions,
+  index: number,
+  isClickFullScreen = false
+) {
+  if (!isClickFullScreen) fullscreen.value = options?.fullscreen ?? false;
+  if (options?.[event] && isFunction(options?.[event])) {
+    return options?.[event]({ options, index });
+  }
+}
+
+function handleClose(
+  options: DialogOptions,
+  index: number,
+  args = { command: "close" }
+) {
+  closeDialog(options, index, args);
+  eventsCallBack("close", options, index);
+}
+</script>
+
+<template>
+  <el-dialog
+    v-for="(options, index) in dialogStore"
+    :key="index"
+    v-bind="options"
+    v-model="options.visible"
+    class="pure-dialog"
+    :fullscreen="fullscreen ? true : options?.fullscreen ? true : false"
+    @closed="handleClose(options, index)"
+    @opened="eventsCallBack('open', options, index)"
+    @openAutoFocus="eventsCallBack('openAutoFocus', options, index)"
+    @closeAutoFocus="eventsCallBack('closeAutoFocus', options, index)"
+  >
+    <!-- header -->
+    <template
+      v-if="options?.fullscreenIcon || options?.headerRenderer"
+      #header="{ close, titleId, titleClass }"
+    >
+      <div
+        v-if="options?.fullscreenIcon"
+        class="flex items-center justify-between"
+      >
+        <span :id="titleId" :class="titleClass">{{ options?.title }}</span>
+        <i
+          v-if="!options?.fullscreen"
+          :class="fullscreenClass"
+          @click="
+            () => {
+              fullscreen = !fullscreen;
+              eventsCallBack(
+                'fullscreenCallBack',
+                { ...options, fullscreen },
+                index,
+                true
+              );
+            }
+          "
+        >
+          <IconifyIconOffline
+            class="pure-dialog-svg"
+            :icon="
+              options?.fullscreen
+                ? ExitFullscreen
+                : fullscreen
+                  ? ExitFullscreen
+                  : Fullscreen
+            "
+          />
+        </i>
+      </div>
+      <component
+        :is="options?.headerRenderer({ close, titleId, titleClass })"
+        v-else
+      />
+    </template>
+    <component
+      v-bind="options?.props"
+      :is="options.contentRenderer({ options, index })"
+      @close="args => handleClose(options, index, args)"
+    />
+    <!-- footer -->
+    <template v-if="!options?.hideFooter" #footer>
+      <template v-if="options?.footerRenderer">
+        <component :is="options?.footerRenderer({ options, index })" />
+      </template>
+      <span v-else>
+        <template v-for="(btn, key) in footerButtons(options)" :key="key">
+          <el-popconfirm
+            v-if="btn.popconfirm"
+            v-bind="btn.popconfirm"
+            @confirm="
+              btn.btnClick({
+                dialog: { options, index },
+                button: { btn, index: key }
+              })
+            "
+          >
+            <template #reference>
+              <el-button v-bind="btn">{{ btn?.label }}</el-button>
+            </template>
+          </el-popconfirm>
+          <el-button
+            v-else
+            v-bind="btn"
+            :loading="key === 1 && sureBtnMap[index]?.loading"
+            @click="
+              btn.btnClick({
+                dialog: { options, index },
+                button: { btn, index: key }
+              })
+            "
+          >
+            {{ btn?.label }}
+          </el-button>
+        </template>
+      </span>
+    </template>
+  </el-dialog>
+</template>

src/components/ReDialog/type.ts

@@ -0,0 +1,275 @@
+import type { CSSProperties, VNode, Component } from "vue";
+
+type DoneFn = (cancel?: boolean) => void;
+type EventType =
+  | "open"
+  | "close"
+  | "openAutoFocus"
+  | "closeAutoFocus"
+  | "fullscreenCallBack";
+type ArgsType = {
+  /** `cancel` 点击取消按钮、`sure` 点击确定按钮、`close` 点击右上角关闭按钮或空白页或按下了esc键 */
+  command: "cancel" | "sure" | "close";
+};
+type ButtonType =
+  | "primary"
+  | "success"
+  | "warning"
+  | "danger"
+  | "info"
+  | "text";
+
+/** https://element-plus.org/zh-CN/component/dialog.html#attributes */
+type DialogProps = {
+  /** `Dialog` 的显示与隐藏 */
+  visible?: boolean;
+  /** `Dialog` 的标题 */
+  title?: string;
+  /** `Dialog` 的宽度，默认 `50%` */
+  width?: string | number;
+  /** 是否为全屏 `Dialog`（会一直处于全屏状态，除非弹框关闭），默认 `false`，`fullscreen` 和 `fullscreenIcon` 都传时只有 `fullscreen` 会生效 */
+  fullscreen?: boolean;
+  /** 是否显示全屏操作图标，默认 `false`，`fullscreen` 和 `fullscreenIcon` 都传时只有 `fullscreen` 会生效 */
+  fullscreenIcon?: boolean;
+  /** `Dialog CSS` 中的 `margin-top` 值，默认 `15vh` */
+  top?: string;
+  /** 是否需要遮罩层，默认 `true` */
+  modal?: boolean;
+  /** `Dialog` 自身是否插入至 `body` 元素上。嵌套的 `Dialog` 必须指定该属性并赋值为 `true`，默认 `false` */
+  appendToBody?: boolean;
+  /** 是否在 `Dialog` 出现时将 `body` 滚动锁定，默认 `true` */
+  lockScroll?: boolean;
+  /** `Dialog` 的自定义类名 */
+  class?: string;
+  /** `Dialog` 的自定义样式 */
+  style?: CSSProperties;
+  /** `Dialog` 打开的延时时间，单位毫秒，默认 `0` */
+  openDelay?: number;
+  /** `Dialog` 关闭的延时时间，单位毫秒，默认 `0` */
+  closeDelay?: number;
+  /** 是否可以通过点击 `modal` 关闭 `Dialog`，默认 `true` */
+  closeOnClickModal?: boolean;
+  /** 是否可以通过按下 `ESC` 关闭 `Dialog`，默认 `true` */
+  closeOnPressEscape?: boolean;
+  /** 是否显示关闭按钮，默认 `true` */
+  showClose?: boolean;
+  /** 关闭前的回调，会暂停 `Dialog` 的关闭. 回调函数内执行 `done` 参数方法的时候才是真正关闭对话框的时候 */
+  beforeClose?: (done: DoneFn) => void;
+  /** 为 `Dialog` 启用可拖拽功能，默认 `false` */
+  draggable?: boolean;
+  /** 是否让 `Dialog` 的 `header` 和 `footer` 部分居中排列，默认 `false` */
+  center?: boolean;
+  /** 是否水平垂直对齐对话框，默认 `false` */
+  alignCenter?: boolean;
+  /** 当关闭 `Dialog` 时，销毁其中的元素，默认 `false` */
+  destroyOnClose?: boolean;
+};
+
+//element-plus.org/zh-CN/component/popconfirm.html#attributes
+type Popconfirm = {
+  /** 标题 */
+  title?: string;
+  /** 确定按钮文字 */
+  confirmButtonText?: string;
+  /** 取消按钮文字 */
+  cancelButtonText?: string;
+  /** 确定按钮类型，默认 `primary` */
+  confirmButtonType?: ButtonType;
+  /** 取消按钮类型，默认 `text` */
+  cancelButtonType?: ButtonType;
+  /** 自定义图标，默认 `QuestionFilled` */
+  icon?: string | Component;
+  /** `Icon` 颜色，默认 `#f90` */
+  iconColor?: string;
+  /** 是否隐藏 `Icon`，默认 `false` */
+  hideIcon?: boolean;
+  /** 关闭时的延迟，默认 `200` */
+  hideAfter?: number;
+  /** 是否将 `popover` 的下拉列表插入至 `body` 元素，默认 `true` */
+  teleported?: boolean;
+  /** 当 `popover` 组件长时间不触发且 `persistent` 属性设置为 `false` 时, `popover` 将会被删除，默认 `false` */
+  persistent?: boolean;
+  /** 弹层宽度，最小宽度 `150px`，默认 `150` */
+  width?: string | number;
+};
+
+type BtnClickDialog = {
+  options?: DialogOptions;
+  index?: number;
+};
+type BtnClickButton = {
+  btn?: ButtonProps;
+  index?: number;
+};
+/** https://element-plus.org/zh-CN/component/button.html#button-attributes */
+type ButtonProps = {
+  /** 按钮文字 */
+  label: string;
+  /** 按钮尺寸 */
+  size?: "large" | "default" | "small";
+  /** 按钮类型 */
+  type?: "primary" | "success" | "warning" | "danger" | "info";
+  /** 是否为朴素按钮，默认 `false` */
+  plain?: boolean;
+  /** 是否为文字按钮，默认 `false` */
+  text?: boolean;
+  /** 是否显示文字按钮背景颜色，默认 `false` */
+  bg?: boolean;
+  /** 是否为链接按钮，默认 `false` */
+  link?: boolean;
+  /** 是否为圆角按钮，默认 `false` */
+  round?: boolean;
+  /** 是否为圆形按钮，默认 `false` */
+  circle?: boolean;
+  /** 确定按钮的 `Popconfirm` 气泡确认框相关配置 */
+  popconfirm?: Popconfirm;
+  /** 是否为加载中状态，默认 `false` */
+  loading?: boolean;
+  /** 自定义加载中状态图标组件 */
+  loadingIcon?: string | Component;
+  /** 按钮是否为禁用状态，默认 `false` */
+  disabled?: boolean;
+  /** 图标组件 */
+  icon?: string | Component;
+  /** 是否开启原生 `autofocus` 属性，默认 `false` */
+  autofocus?: boolean;
+  /** 原生 `type` 属性，默认 `button` */
+  nativeType?: "button" | "submit" | "reset";
+  /** 自动在两个中文字符之间插入空格 */
+  autoInsertSpace?: boolean;
+  /** 自定义按钮颜色, 并自动计算 `hover` 和 `active` 触发后的颜色 */
+  color?: string;
+  /** `dark` 模式, 意味着自动设置 `color` 为 `dark` 模式的颜色，默认 `false` */
+  dark?: boolean;
+  /** 自定义元素标签 */
+  tag?: string | Component;
+  /** 点击按钮后触发的回调 */
+  btnClick?: ({
+    dialog,
+    button
+  }: {
+    /** 当前 `Dialog` 信息 */
+    dialog: BtnClickDialog;
+    /** 当前 `button` 信息 */
+    button: BtnClickButton;
+  }) => void;
+};
+
+interface DialogOptions extends DialogProps {
+  /** 内容区组件的 `props`，可通过 `defineProps` 接收 */
+  props?: any;
+  /** 是否隐藏 `Dialog` 按钮操作区的内容 */
+  hideFooter?: boolean;
+  /** 确定按钮的 `Popconfirm` 气泡确认框相关配置 */
+  popconfirm?: Popconfirm;
+  /** 点击确定按钮后是否开启 `loading` 加载动画 */
+  sureBtnLoading?: boolean;
+  /**
+   * @description 自定义对话框标题的内容渲染器
+   * @see {@link https://element-plus.org/zh-CN/component/dialog.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E5%A4%B4%E9%83%A8}
+   */
+  headerRenderer?: ({
+    close,
+    titleId,
+    titleClass
+  }: {
+    close: Function;
+    titleId: string;
+    titleClass: string;
+  }) => VNode | Component;
+  /** 自定义内容渲染器 */
+  contentRenderer?: ({
+    options,
+    index
+  }: {
+    options: DialogOptions;
+    index: number;
+  }) => VNode | Component;
+  /** 自定义按钮操作区的内容渲染器，会覆盖`footerButtons`以及默认的 `取消` 和 `确定` 按钮 */
+  footerRenderer?: ({
+    options,
+    index
+  }: {
+    options: DialogOptions;
+    index: number;
+  }) => VNode | Component;
+  /** 自定义底部按钮操作 */
+  footerButtons?: Array<ButtonProps>;
+  /** `Dialog` 打开后的回调 */
+  open?: ({
+    options,
+    index
+  }: {
+    options: DialogOptions;
+    index: number;
+  }) => void;
+  /** `Dialog` 关闭后的回调（只有点击右上角关闭按钮或空白页或按下了esc键关闭页面时才会触发） */
+  close?: ({
+    options,
+    index
+  }: {
+    options: DialogOptions;
+    index: number;
+  }) => void;
+  /** `Dialog` 关闭后的回调。 `args` 返回的 `command` 值解析：`cancel` 点击取消按钮、`sure` 点击确定按钮、`close` 点击右上角关闭按钮或空白页或按下了esc键  */
+  closeCallBack?: ({
+    options,
+    index,
+    args
+  }: {
+    options: DialogOptions;
+    index: number;
+    args: any;
+  }) => void;
+  /** 点击全屏按钮时的回调 */
+  fullscreenCallBack?: ({
+    options,
+    index
+  }: {
+    options: DialogOptions;
+    index: number;
+  }) => void;
+  /** 输入焦点聚焦在 `Dialog` 内容时的回调 */
+  openAutoFocus?: ({
+    options,
+    index
+  }: {
+    options: DialogOptions;
+    index: number;
+  }) => void;
+  /** 输入焦点从 `Dialog` 内容失焦时的回调 */
+  closeAutoFocus?: ({
+    options,
+    index
+  }: {
+    options: DialogOptions;
+    index: number;
+  }) => void;
+  /** 点击底部取消按钮的回调，会暂停 `Dialog` 的关闭. 回调函数内执行 `done` 参数方法的时候才是真正关闭对话框的时候 */
+  beforeCancel?: (
+    done: Function,
+    {
+      options,
+      index
+    }: {
+      options: DialogOptions;
+      index: number;
+    }
+  ) => void;
+  /** 点击底部确定按钮的回调，会暂停 `Dialog` 的关闭. 回调函数内执行 `done` 参数方法的时候才是真正关闭对话框的时候 */
+  beforeSure?: (
+    done: Function,
+    {
+      options,
+      index,
+      closeLoading
+    }: {
+      options: DialogOptions;
+      index: number;
+      /** 关闭确定按钮的 `loading` 加载动画 */
+      closeLoading: Function;
+    }
+  ) => void;
+}
+
+export type { EventType, ArgsType, DialogProps, ButtonProps, DialogOptions };

src/components/ReIcon/index.ts

@@ -2,11 +2,11 @@ import iconifyIconOffline from "./src/iconifyIconOffline";
 import iconifyIconOnline from "./src/iconifyIconOnline";
 import fontIcon from "./src/iconfont";
 
-/** 离线图标组件 */
+/** 本地图标组件 */
 const IconifyIconOffline = iconifyIconOffline;
 /** 在线图标组件 */
 const IconifyIconOnline = iconifyIconOnline;
-/** iconfont组件 */
+/** `iconfont`组件 */
 const FontIcon = fontIcon;
 
 export { IconifyIconOffline, IconifyIconOnline, FontIcon };

src/components/ReIcon/src/hooks.ts

@@ -1,9 +1,10 @@
-import { iconType } from "./types";
+import type { iconType } from "./types";
-import { h, defineComponent, Component } from "vue";
+import { h, defineComponent, type Component } from "vue";
-import { IconifyIconOnline, IconifyIconOffline, FontIcon } from "../index";
+import { FontIcon, IconifyIconOnline, IconifyIconOffline } from "../index";
 
 /**
- * 支持fontawesome4、5+、iconfont、remixicon、element-plus的icons、自定义svg
+ * 支持 `iconfont`、自定义 `svg` 以及 `iconify` 中所有的图标
+ * @see 点击查看文档图标篇 {@link https://pure-admin.cn/pages/icon/}
  * @param icon 必传 图标
  * @param attrs 可选 iconType 属性
  * @returns Component
@@ -32,15 +33,28 @@ export function useRenderIcon(icon: any, attrs?: iconType): Component {
     });
   } else if (typeof icon === "function" || typeof icon?.render === "function") {
     // svg
-    return icon;
+    return attrs ? h(icon, { ...attrs }) : icon;
+  } else if (typeof icon === "object") {
+    return defineComponent({
+      name: "OfflineIcon",
+      render() {
+        return h(IconifyIconOffline, {
+          icon: icon,
+          ...attrs
+        });
+      }
+    });
   } else {
+    // 通过是否存在 : 符号来判断是在线还是本地图标，存在即是在线图标，反之
     return defineComponent({
       name: "Icon",
       render() {
-        const IconifyIcon =
+        if (!icon) return;
-          attrs && attrs["online"] ? IconifyIconOnline : IconifyIconOffline;
+        const IconifyIcon = icon.includes(":")
+          ? IconifyIconOnline
+          : IconifyIconOffline;
         return h(IconifyIcon, {
-          icon: icon,
+          icon,
           ...attrs
         });
       }

src/components/ReIcon/src/iconfont.ts

@@ -27,8 +27,7 @@ export default defineComponent({
       return h(
         "svg",
         {
-          class: "icon-svg",
+          class: "icon-svg"
-          "aria-hidden": true
         },
         {
           default: () => [

src/components/ReIcon/src/iconifyIconOffline.ts

@@ -1,66 +1,38 @@
 import { h, defineComponent } from "vue";
 import { Icon as IconifyIcon, addIcon } from "@iconify/vue/dist/offline";
 
-// element-plus icon
+// Iconify Icon在Vue里本地使用（用于内网环境）
-import Check from "@iconify-icons/ep/check";
-import HomeFilled from "@iconify-icons/ep/home-filled";
-import Setting from "@iconify-icons/ep/setting";
-import Lollipop from "@iconify-icons/ep/lollipop";
-import RefreshRight from "@iconify-icons/ep/refresh-right";
-import ArrowDown from "@iconify-icons/ep/arrow-down";
-import CloseBold from "@iconify-icons/ep/close-bold";
-import Bell from "@iconify-icons/ep/bell";
-import Search from "@iconify-icons/ep/search";
-addIcon("check", Check);
-addIcon("home-filled", HomeFilled);
-addIcon("setting", Setting);
-addIcon("lollipop", Lollipop);
-addIcon("refresh-right", RefreshRight);
-addIcon("arrow-down", ArrowDown);
-addIcon("close-bold", CloseBold);
-addIcon("bell", Bell);
-addIcon("search", Search);
-
-// remixicon
-import ArrowRightSLine from "@iconify-icons/ri/arrow-right-s-line";
-import ArrowLeftSLine from "@iconify-icons/ri/arrow-left-s-line";
-import LogoutCircleRLine from "@iconify-icons/ri/logout-circle-r-line";
-import InformationLine from "@iconify-icons/ri/information-line";
-import ArrowUpLine from "@iconify-icons/ri/arrow-up-line";
-import ArrowDownLine from "@iconify-icons/ri/arrow-down-line";
-import Bookmark2Line from "@iconify-icons/ri/bookmark-2-line";
-import User from "@iconify-icons/ri/user-3-fill";
-import Lock from "@iconify-icons/ri/lock-fill";
-import MenuUnfold from "@iconify-icons/ri/menu-unfold-fill";
-import MenuFold from "@iconify-icons/ri/menu-fold-fill";
-addIcon("arrow-right-s-line", ArrowRightSLine);
-addIcon("arrow-left-s-line", ArrowLeftSLine);
-addIcon("logout-circle-r-line", LogoutCircleRLine);
-addIcon("information-line", InformationLine);
-addIcon("arrow-up-line", ArrowUpLine);
-addIcon("arrow-down-line", ArrowDownLine);
-addIcon("bookmark-2-line", Bookmark2Line);
-addIcon("user", User);
-addIcon("lock", Lock);
-addIcon("menu-unfold", MenuUnfold);
-addIcon("menu-fold", MenuFold);
-
-// Iconify Icon在Vue里离线使用（用于内网环境）https://docs.iconify.design/icon-components/vue/offline.html
 export default defineComponent({
   name: "IconifyIconOffline",
   components: { IconifyIcon },
   props: {
     icon: {
-      type: String,
+      default: null
-      default: ""
     }
   },
   render() {
+    if (typeof this.icon === "object") addIcon(this.icon, this.icon);
     const attrs = this.$attrs;
+    if (typeof this.icon === "string") {
       return h(
         IconifyIcon,
         {
-        icon: `${this.icon}`,
+          icon: this.icon,
+          "aria-hidden": false,
+          style: attrs?.style
+            ? Object.assign(attrs.style, { outline: "none" })
+            : { outline: "none" },
+          ...attrs
+        },
+        {
+          default: () => []
+        }
+      );
+    } else {
+      return h(
+        this.icon,
+        {
+          "aria-hidden": false,
           style: attrs?.style
             ? Object.assign(attrs.style, { outline: "none" })
             : { outline: "none" },
@@ -71,4 +43,5 @@ export default defineComponent({
         }
       );
     }
+  }
 });

src/components/ReIcon/src/iconifyIconOnline.ts

@@ -17,6 +17,7 @@ export default defineComponent({
       IconifyIcon,
       {
         icon: `${this.icon}`,
+        "aria-hidden": false,
         style: attrs?.style
           ? Object.assign(attrs.style, { outline: "none" })
           : { outline: "none" },

src/components/ReIcon/src/offlineIcon.ts

@@ -0,0 +1,23 @@
+// 这里存放本地图标，在 src/layout/index.vue 文件中加载，避免在首启动加载
+import { getSvgInfo } from "@pureadmin/utils";
+import { addIcon } from "@iconify/vue/dist/offline";
+
+// https://icon-sets.iconify.design/ep/?keyword=ep
+import EpHomeFilled from "~icons/ep/home-filled?raw";
+
+// https://icon-sets.iconify.design/ri/?keyword=ri
+import RiSearchLine from "~icons/ri/search-line?raw";
+import RiInformationLine from "~icons/ri/information-line?raw";
+
+const icons = [
+  // Element Plus Icon: https://github.com/element-plus/element-plus-icons
+  ["ep/home-filled", EpHomeFilled],
+  // Remix Icon: https://github.com/Remix-Design/RemixIcon
+  ["ri/search-line", RiSearchLine],
+  ["ri/information-line", RiInformationLine]
+];
+
+// 本地菜单图标，后端在路由的 icon 中返回对应的图标字符串并且前端在此处使用 addIcon 添加即可渲染菜单图标
+icons.forEach(([name, icon]) => {
+  addIcon(name as string, getSvgInfo(icon as string));
+});

src/components/ReIcon/src/types.ts

@@ -11,10 +11,10 @@ export interface iconType {
   horizontalAlign?: boolean;
   verticalAlign?: boolean;
   align?: string;
-  online?: boolean;
   onLoad?: Function;
   includes?: Function;
-
+  // svg 需要什么SVG属性自行添加
+  fill?: string;
   // all icon
   style?: object;
 }

src/components/ReImageVerify/index.ts

@@ -1,7 +0,0 @@
-import reImageVerify from "./src/index.vue";
-import { withInstall } from "@pureadmin/utils";
-
-/** 图形验证码组件 */
-export const ReImageVerify = withInstall(reImageVerify);
-
-export default ReImageVerify;

src/components/ReImageVerify/src/hooks.ts

@@ -1,85 +0,0 @@
-import { ref, onMounted } from "vue";
-
-/**
- * 绘制图形验证码
- * @param width - 图形宽度
- * @param height - 图形高度
- */
-export const useImageVerify = (width = 120, height = 40) => {
-  const domRef = ref<HTMLCanvasElement>();
-  const imgCode = ref("");
-
-  function setImgCode(code: string) {
-    imgCode.value = code;
-  }
-
-  function getImgCode() {
-    if (!domRef.value) return;
-    imgCode.value = draw(domRef.value, width, height);
-  }
-
-  onMounted(() => {
-    getImgCode();
-  });
-
-  return {
-    domRef,
-    imgCode,
-    setImgCode,
-    getImgCode
-  };
-};
-
-function randomNum(min: number, max: number) {
-  const num = Math.floor(Math.random() * (max - min) + min);
-  return num;
-}
-
-function randomColor(min: number, max: number) {
-  const r = randomNum(min, max);
-  const g = randomNum(min, max);
-  const b = randomNum(min, max);
-  return `rgb(${r},${g},${b})`;
-}
-
-function draw(dom: HTMLCanvasElement, width: number, height: number) {
-  let imgCode = "";
-
-  const NUMBER_STRING = "0123456789";
-
-  const ctx = dom.getContext("2d");
-  if (!ctx) return imgCode;
-
-  ctx.fillStyle = randomColor(180, 230);
-  ctx.fillRect(0, 0, width, height);
-  for (let i = 0; i < 4; i += 1) {
-    const text = NUMBER_STRING[randomNum(0, NUMBER_STRING.length)];
-    imgCode += text;
-    const fontSize = randomNum(18, 41);
-    const deg = randomNum(-30, 30);
-    ctx.font = `${fontSize}px Simhei`;
-    ctx.textBaseline = "top";
-    ctx.fillStyle = randomColor(80, 150);
-    ctx.save();
-    ctx.translate(30 * i + 15, 15);
-    ctx.rotate((deg * Math.PI) / 180);
-    ctx.fillText(text, -15 + 5, -15);
-    ctx.restore();
-  }
-  for (let i = 0; i < 5; i += 1) {
-    ctx.beginPath();
-    ctx.moveTo(randomNum(0, width), randomNum(0, height));
-    ctx.lineTo(randomNum(0, width), randomNum(0, height));
-    ctx.strokeStyle = randomColor(180, 230);
-    ctx.closePath();
-    ctx.stroke();
-  }
-  for (let i = 0; i < 41; i += 1) {
-    ctx.beginPath();
-    ctx.arc(randomNum(0, width), randomNum(0, height), 1, 0, 2 * Math.PI);
-    ctx.closePath();
-    ctx.fillStyle = randomColor(150, 200);
-    ctx.fill();
-  }
-  return imgCode;
-}

src/components/ReImageVerify/src/index.vue

@@ -1,46 +0,0 @@
-<script setup lang="ts">
-import { watch } from "vue";
-import { useImageVerify } from "./hooks";
-
-defineOptions({
-  name: "ReImageVerify"
-});
-
-interface Props {
-  code?: string;
-}
-
-interface Emits {
-  (e: "update:code", code: string): void;
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  code: ""
-});
-
-const emit = defineEmits<Emits>();
-
-const { domRef, imgCode, setImgCode, getImgCode } = useImageVerify();
-
-watch(
-  () => props.code,
-  newValue => {
-    setImgCode(newValue);
-  }
-);
-watch(imgCode, newValue => {
-  emit("update:code", newValue);
-});
-
-defineExpose({ getImgCode });
-</script>
-
-<template>
-  <canvas
-    ref="domRef"
-    width="120"
-    height="40"
-    class="cursor-pointer"
-    @click="getImgCode"
-  />
-</template>