Merge branch 'main' into refactor/tailwindcss

style: 样式复查
fix: 修复组件-瀑布流无限滚动示例中失效的链接
2025-11-09 13:53:38 +08:00 · 2025-04-08 15:12:56 +08:00 · 2025-04-08 14:37:20 +08:00 · 2025-04-07 16:33:26 +08:00 · 2025-04-06 16:51:05 +08:00 · 2025-04-02 14:35:39 +08:00
218 changed files with 5690 additions and 3185 deletions
--- a/.nvmrc
+++ b/.nvmrc
@@ -1 +1 @@
-v22.12.0
+v22.14.0
--- a/build/optimize.ts
+++ b/build/optimize.ts
@@ -11,21 +11,25 @@ const include = [
  "dayjs",
  "axios",
  "pinia",
  "vditor",
  "typeit",
  "swiper",
  "qrcode",
  "intro.js",
  "vue-i18n",
  "deep-chat",
  "vxe-table",
  "vue-types",
  "js-cookie",
  "vue-tippy",
  "cropperjs",
  "jsbarcode",
  "codemirror",
  "pinyin-pro",
  "sortablejs",
  "swiper/vue",
  "mint-filter",
  "highlight.js",
  "@vueuse/core",
  "vue3-danmaku",
  "v-contextmenu",
@@ -42,6 +46,7 @@ const include = [
  "@howdyjs/mouse-menu",
  "@logicflow/extension",
  "vue-virtual-scroller",
  "codemirror-editor-vue3",
  "@amap/amap-jsapi-loader",
  "el-table-infinite-scroll",
  "vue-waterfall-plugin-next",
@@ -52,8 +57,8 @@ const include = [
 /**
 * 在预构建中强制排除的依赖项
- * 温馨提示：所有以 `@iconify-icons/` 开头引入的的本地图标模块，都应该加入到下面的 `exclude` 里，因为平台推荐的使用方式是哪里需要哪里引入而且都是单个的引入，不需要预构建，直接让浏览器加载就好
+ * 温馨提示：平台推荐的使用方式是哪里需要哪里引入而且都是单个的引入，不需要预构建，直接让浏览器加载就好
 */
-const exclude = ["@iconify-icons/ep", "@iconify-icons/ri"];
+const exclude = ["@iconify/json"];
 export { include, exclude };
--- a/build/plugins.ts
+++ b/build/plugins.ts
@@ -3,8 +3,10 @@ import vue from "@vitejs/plugin-vue";
 import { pathResolve } from "./utils";
 import { viteBuildInfo } from "./info";
 import svgLoader from "vite-svg-loader";
 import Icons from "unplugin-icons/vite";
 import type { PluginOption } from "vite";
 import vueJsx from "@vitejs/plugin-vue-jsx";
 import tailwindcss from "@tailwindcss/vite";
 import { configCompressPlugin } from "./compress";
 import removeNoMatch from "vite-plugin-router-warn";
 import { visualizer } from "rollup-plugin-visualizer";
@@ -19,7 +21,14 @@ export function getPluginsList(
 ): PluginOption[] {
  const lifecycle = process.env.npm_lifecycle_event;
  return [
-    vue(),
+    tailwindcss(),
    vue({
      template: {
        compilerOptions: {
          isCustomElement: tag => tag === "deep-chat"
        }
      }
    }),
    // jsx、tsx语法支持
    vueJsx(),
    VueI18nPlugin({
@@ -51,6 +60,11 @@ export function getPluginsList(
    }),
    // svg组件化支持
    svgLoader(),
    // 自动按需加载图标
    Icons({
      compiler: "vue3",
      scale: 1
    }),
    VITE_CDN ? cdn : null,
    configCompressPlugin(VITE_COMPRESSION),
    // 线上环境删除console
--- a/eslint.config.js
+++ b/eslint.config.js
@@ -3,21 +3,21 @@ 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 { defineFlatConfig } from "eslint-define-config";
+import { defineConfig, globalIgnores } from "eslint/config";
 import * as parserTypeScript from "@typescript-eslint/parser";
 import pluginTypeScript from "@typescript-eslint/eslint-plugin";
-export default defineFlatConfig([
+export default defineConfig([
-  {
+  globalIgnores([
    ...js.configs.recommended,
    ignores: [
    "**/.*",
    "dist/*",
    "*.d.ts",
    "public/*",
    "src/assets/**",
    "src/**/iconfont/**"
-    ],
+  ]),
  {
    ...js.configs.recommended,
    languageOptions: {
      globals: {
        // index.d.ts
--- a/index.html
+++ b/index.html
@@ -10,9 +10,6 @@
    />
    <title>vue-pure-admin</title>
    <link rel="icon" href="/favicon.ico" />
    <script>
      window.process = {};
    </script>
  </head>
  <body>
--- a/locales/en.yaml
+++ b/locales/en.yaml
@@ -76,6 +76,8 @@ menus:
  pureLoginLog: Login Log
  pureOperationLog: Operation Log
  pureSystemLog: System Log
  pureCodeMirror: CodeMirror
  pureMarkdown: Markdown
  pureEditor: Editor
  pureAbnormal: Abnormal Page
  pureFourZeroFour: "404"
@@ -92,6 +94,7 @@ menus:
  pureDraggable: Draggable
  pureSplitPane: Split Pane
  pureText: Text Ellipsis
  pureSlider: Slider
  pureElButton: Button
  pureButton: Button Animation
  pureCheckButton: Check Button
--- a/locales/zh-CN.yaml
+++ b/locales/zh-CN.yaml
@@ -76,6 +76,8 @@ menus:
  pureLoginLog: 登录日志
  pureOperationLog: 操作日志
  pureSystemLog: 系统日志
  pureCodeMirror: 代码编辑器
  pureMarkdown: Markdown
  pureEditor: 编辑器
  pureAbnormal: 异常页面
  pureFourZeroFour: "404"
@@ -92,6 +94,7 @@ menus:
  pureDraggable: 拖拽
  pureSplitPane: 切割面板
  pureText: 文本省略
  pureSlider: 滑块
  pureElButton: 按钮
  pureCheckButton: 可选按钮
  pureButton: 按钮动效
--- a/package.json
+++ b/package.json
@@ -54,22 +54,26 @@
    "@logicflow/extension": "^1.2.28",
    "@pureadmin/descriptions": "^1.2.1",
    "@pureadmin/table": "^3.2.1",
-    "@pureadmin/utils": "^2.5.0",
+    "@pureadmin/utils": "^2.6.0",
    "@vue-flow/background": "^1.3.2",
-    "@vue-flow/core": "^1.41.6",
+    "@vue-flow/core": "^1.42.5",
-    "@vueuse/core": "^12.0.0",
+    "@vueuse/core": "^12.8.2",
    "@vueuse/motion": "^2.2.6",
    "@wangeditor/editor": "^5.1.23",
    "@wangeditor/editor-for-vue": "^5.1.12",
    "@zxcvbn-ts/core": "^3.0.4",
    "animate.css": "^4.1.1",
-    "axios": "^1.7.9",
+    "axios": "^1.8.4",
    "china-area-data": "^5.0.1",
    "codemirror": "^5.65.19",
    "codemirror-editor-vue3": "^2.8.0",
    "cropperjs": "^1.6.2",
    "dayjs": "^1.11.13",
-    "echarts": "^5.5.1",
+    "deep-chat": "^2.1.1",
    "echarts": "^5.6.0",
    "el-table-infinite-scroll": "^3.0.6",
-    "element-plus": "^2.9.0",
+    "element-plus": "^2.9.7",
    "highlight.js": "^11.11.1",
    "intro.js": "^7.2.0",
    "js-cookie": "^3.0.5",
    "jsbarcode": "^3.11.6",
@@ -79,96 +83,97 @@
    "mqtt": "4.3.7",
    "nprogress": "^0.2.0",
    "path-browserify": "^1.0.1",
-    "pinia": "^2.3.0",
+    "pinia": "^3.0.1",
    "pinyin-pro": "^3.26.0",
-    "plus-pro-components": "^0.1.18",
+    "plus-pro-components": "^0.1.21",
    "qrcode": "^1.5.4",
-    "qs": "^6.13.1",
+    "qs": "^6.14.0",
    "responsive-storage": "^2.2.0",
    "sortablejs": "^1.15.6",
-    "swiper": "^11.1.15",
+    "swiper": "^11.2.6",
    "typeit": "^8.8.7",
    "v-contextmenu": "^3.2.0",
    "v3-infinite-loading": "^1.3.2",
    "vditor": "^3.10.9",
    "version-rocket": "^1.7.4",
    "vue": "^3.5.13",
-    "vue-i18n": "^10.0.5",
+    "vue-i18n": "^11.1.2",
    "vue-json-pretty": "^2.4.0",
-    "vue-pdf-embed": "^2.1.1",
+    "vue-pdf-embed": "^2.1.2",
    "vue-router": "^4.5.0",
-    "vue-tippy": "^6.5.0",
+    "vue-tippy": "^6.7.0",
    "vue-types": "^5.1.3",
    "vue-virtual-scroller": "2.0.0-beta.8",
-    "vue-waterfall-plugin-next": "^2.6.4",
+    "vue-waterfall-plugin-next": "^2.6.5",
    "vue3-danmaku": "^1.6.1",
    "vue3-puzzle-vcode": "^1.1.7",
    "vuedraggable": "^4.1.0",
    "vxe-table": "4.6.25",
-    "wavesurfer.js": "^7.8.10",
+    "wavesurfer.js": "^7.9.4",
-    "xgplayer": "^3.0.20",
+    "xgplayer": "^3.0.21",
    "xlsx": "^0.18.5"
  },
  "devDependencies": {
-    "@commitlint/cli": "^19.6.0",
+    "@commitlint/cli": "^19.8.0",
-    "@commitlint/config-conventional": "^19.6.0",
+    "@commitlint/config-conventional": "^19.8.0",
-    "@commitlint/types": "^19.5.0",
+    "@commitlint/types": "^19.8.0",
-    "@eslint/js": "^9.16.0",
+    "@eslint/js": "^9.23.0",
-    "@faker-js/faker": "^9.3.0",
+    "@faker-js/faker": "^9.6.0",
-    "@iconify-icons/ep": "^1.2.12",
+    "@iconify/json": "^2.2.321",
-    "@iconify-icons/ri": "^1.2.10",
+    "@iconify/vue": "4.2.0",
-    "@iconify/vue": "^4.2.0",
+    "@intlify/unplugin-vue-i18n": "^6.0.5",
-    "@intlify/unplugin-vue-i18n": "^6.0.1",
+    "@tailwindcss/vite": "^4.1.3",
    "@types/codemirror": "^5.60.15",
    "@types/dagre": "^0.7.52",
    "@types/intro.js": "^5.1.5",
    "@types/js-cookie": "^3.0.6",
-    "@types/node": "^20.17.9",
+    "@types/node": "^20.17.28",
    "@types/nprogress": "^0.2.3",
    "@types/path-browserify": "^1.0.3",
    "@types/qrcode": "^1.5.5",
-    "@types/qs": "^6.9.17",
+    "@types/qs": "^6.9.18",
    "@types/sortablejs": "^1.15.8",
-    "@typescript-eslint/eslint-plugin": "^8.18.0",
+    "@typescript-eslint/eslint-plugin": "^8.28.0",
-    "@typescript-eslint/parser": "^8.18.0",
+    "@typescript-eslint/parser": "^8.28.0",
-    "@vitejs/plugin-vue": "^5.2.1",
+    "@vitejs/plugin-vue": "^5.2.3",
-    "@vitejs/plugin-vue-jsx": "^4.1.1",
+    "@vitejs/plugin-vue-jsx": "^4.1.2",
    "autoprefixer": "^10.4.20",
    "boxen": "^8.0.1",
-    "code-inspector-plugin": "^0.18.2",
+    "code-inspector-plugin": "^0.20.7",
    "cssnano": "^7.0.6",
    "dagre": "^0.8.5",
-    "eslint": "^9.16.0",
+    "eslint": "^9.23.0",
-    "eslint-config-prettier": "^9.1.0",
+    "eslint-config-prettier": "^10.1.1",
-    "eslint-define-config": "^2.1.0",
+    "eslint-plugin-prettier": "^5.2.5",
-    "eslint-plugin-prettier": "^5.2.1",
+    "eslint-plugin-vue": "^9.33.0",
    "eslint-plugin-vue": "^9.32.0",
    "gradient-string": "^3.0.0",
    "husky": "^9.1.7",
-    "lint-staged": "^15.2.10",
+    "lint-staged": "^15.5.0",
-    "postcss": "^8.4.49",
+    "postcss": "^8.5.3",
-    "postcss-html": "^1.7.0",
+    "postcss-html": "^1.8.0",
-    "postcss-import": "^16.1.0",
+    "postcss-load-config": "^6.0.1",
    "postcss-scss": "^4.0.9",
-    "prettier": "^3.4.2",
+    "prettier": "^3.5.3",
    "rimraf": "^6.0.1",
-    "rollup-plugin-visualizer": "^5.12.0",
+    "rollup-plugin-visualizer": "^5.14.0",
-    "sass": "^1.82.0",
+    "sass": "^1.86.0",
-    "stylelint": "^16.11.0",
+    "stylelint": "^16.17.0",
-    "stylelint-config-recess-order": "^5.1.1",
+    "stylelint-config-recess-order": "^6.0.0",
-    "stylelint-config-recommended-vue": "^1.5.0",
+    "stylelint-config-recommended-vue": "^1.6.0",
-    "stylelint-config-standard-scss": "^13.1.0",
+    "stylelint-config-standard-scss": "^14.0.0",
-    "stylelint-prettier": "^5.0.2",
+    "stylelint-prettier": "^5.0.3",
    "svgo": "^3.3.2",
-    "tailwindcss": "^3.4.16",
+    "tailwindcss": "^4.1.3",
-    "typescript": "5.6.3",
+    "typescript": "^5.8.2",
-    "vite": "^6.0.3",
+    "unplugin-icons": "^22.1.0",
    "vite": "^6.2.3",
    "vite-plugin-cdn-import": "^1.0.1",
    "vite-plugin-compression": "^0.5.1",
-    "vite-plugin-fake-server": "^2.1.4",
+    "vite-plugin-fake-server": "^2.2.0",
    "vite-plugin-remove-console": "^2.2.0",
    "vite-plugin-router-warn": "^1.0.0",
    "vite-svg-loader": "^5.1.0",
    "vue-eslint-parser": "^9.4.3",
-    "vue-tsc": "^2.1.10"
+    "vue-tsc": "^2.2.8"
  },
  "engines": {
    "node": "^18.18.0 || ^20.9.0 || >=22.0.0",
@@ -178,6 +183,7 @@
    "allowedDeprecatedVersions": {
      "are-we-there-yet": "*",
      "sourcemap-codec": "*",
      "lodash.isequal": "*",
      "domexception": "*",
      "w3c-hr-time": "*",
      "inflight": "*",
@@ -192,6 +198,14 @@
      "allowedVersions": {
        "eslint": "9"
      }
-    }
+    },
    "onlyBuiltDependencies": [
      "@parcel/watcher",
      "core-js",
      "es5-ext",
      "esbuild",
      "typeit",
      "vue-demi"
    ]
  }
 }
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/postcss.config.js
+++ b/postcss.config.js
@@ -3,10 +3,6 @@
 /** @type {import('postcss-load-config').Config} */
 export default {
  plugins: {
    "postcss-import": {},
    "tailwindcss/nesting": {},
    tailwindcss: {},
    autoprefixer: {},
    ...(process.env.NODE_ENV === "production" ? { cssnano: {} } : {})
  }
 };
--- a/src/assets/iconfont/iconfont.js
+++ b/src/assets/iconfont/iconfont.js
@@ -28,8 +28,7 @@
          c = document.createElement("div");
        (c.innerHTML = e._iconfont_svg_string_2208059),
          (c = c.getElementsByTagName("svg")[0]) &&
-            (c.setAttribute("aria-hidden", "true"),
+            ((c.style.position = "absolute"),
            (c.style.position = "absolute"),
            (c.style.width = 0),
            (c.style.height = 0),
            (c.style.overflow = "hidden"),
--- a/src/assets/svg/enter_outlined.svg
+++ b/src/assets/svg/enter_outlined.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" aria-hidden="true" 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>
+<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>
--- a/src/assets/svg/exit_screen.svg
+++ b/src/assets/svg/exit_screen.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" aria-hidden="true" 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>
+<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>
--- a/src/assets/svg/full_screen.svg
+++ b/src/assets/svg/full_screen.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" aria-hidden="true" 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>
+<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>
--- a/src/assets/svg/globalization.svg
+++ b/src/assets/svg/globalization.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" aria-hidden="true" class="globalization" viewBox="0 0 512 512"><path fill="currentColor" d="m478.33 433.6-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 362 368 281.65 401.17 362zm-66.99-19.08a22 22 0 0 0-4.89-30.7c-.2-.15-15-11.13-36.49-34.73 39.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.36-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.93.92 1.19 1.83 2.35 2.74 3.51-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.59 22.52 24.08 38 35.44 38.93 36.1a22 22 0 0 0 30.75-4.9z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" class="globalization" viewBox="0 0 512 512"><path fill="currentColor" d="m478.33 433.6-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 362 368 281.65 401.17 362zm-66.99-19.08a22 22 0 0 0-4.89-30.7c-.2-.15-15-11.13-36.49-34.73 39.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.36-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.93.92 1.19 1.83 2.35 2.74 3.51-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.59 22.52 24.08 38 35.44 38.93 36.1a22 22 0 0 0 30.75-4.9z"/></svg>
--- a/src/assets/svg/keyboard_esc.svg
+++ b/src/assets/svg/keyboard_esc.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" aria-hidden="true" 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>
+<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>
--- a/src/assets/table-bar/drag.svg
+++ b/src/assets/table-bar/drag.svg
@@ -1 +1 @@
-<svg width="32" height="32" fill="currentColor" aria-hidden="true" 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>
+<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>
--- a/src/components/ReCropper/src/index.tsx
+++ b/src/components/ReCropper/src/index.tsx
@@ -119,7 +119,7 @@ export default defineComponent({
        "p-[6px]",
        "h-[30px]",
        "w-[30px]",
-        "outline-none",
+        "outline-hidden",
        "rounded-[4px]",
        "cursor-pointer",
        "hover:bg-[rgba(0,0,0,0.06)]"
--- a/src/components/ReDialog/index.vue
+++ b/src/components/ReDialog/index.vue
@@ -8,8 +8,8 @@ import {
 } from "./index";
 import { ref, computed } from "vue";
 import { isFunction } from "@pureadmin/utils";
-import Fullscreen from "@iconify-icons/ri/fullscreen-fill";
+import Fullscreen from "~icons/ri/fullscreen-fill";
-import ExitFullscreen from "@iconify-icons/ri/fullscreen-exit-fill";
+import ExitFullscreen from "~icons/ri/fullscreen-exit-fill";
 defineOptions({
  name: "ReDialog"
@@ -79,7 +79,7 @@ const fullscreenClass = computed(() => {
    "el-dialog__close",
    "-translate-x-2",
    "cursor-pointer",
-    "hover:!text-[red]"
+    "hover:text-[red]!"
  ];
 });
--- a/src/components/ReFlowChart/src/Control.vue
+++ b/src/components/ReFlowChart/src/Control.vue
@@ -114,7 +114,8 @@ onMounted(() => {
          :style="{
            cursor: item.disabled === false ? 'pointer' : 'not-allowed',
            color: item.disabled === false ? '' : '#00000040',
-            background: 'transparent'
+            background: 'transparent',
            border: 'none'
          }"
          @click="onControl(item, key)"
        >
--- a/src/components/ReFlowChart/src/assets/iconfont/iconfont.js
+++ b/src/components/ReFlowChart/src/assets/iconfont/iconfont.js
@@ -28,8 +28,7 @@
    ((o = document.createElement("div")).innerHTML = i),
      (i = null),
      (e = o.getElementsByTagName("svg")[0]) &&
-        (e.setAttribute("aria-hidden", "true"),
+        ((e.style.position = "absolute"),
        (e.style.position = "absolute"),
        (e.style.width = 0),
        (e.style.height = 0),
        (e.style.overflow = "hidden"),
--- a/src/components/ReIcon/src/Select.vue
+++ b/src/components/ReIcon/src/Select.vue
@@ -2,7 +2,7 @@
 import { IconJson } from "@/components/ReIcon/data";
 import { cloneDeep, isAllEmpty } from "@pureadmin/utils";
 import { ref, computed, CSSProperties, watch } from "vue";
-import Search from "@iconify-icons/ri/search-eye-line";
+import Search from "~icons/ri/search-eye-line";
 type ParameterCSSProperties = (item?: string) => CSSProperties | undefined;
@@ -219,8 +219,8 @@ watch(
  &:hover {
    color: var(--el-color-primary);
    border-color: var(--el-color-primary);
    transition: all 0.4s;
    transform: scaleX(1.05);
    transition: all 0.4s;
  }
 }
--- a/src/components/ReIcon/src/hooks.ts
+++ b/src/components/ReIcon/src/hooks.ts
@@ -1,6 +1,6 @@
 import type { iconType } from "./types";
 import { h, defineComponent, type Component } from "vue";
-import { IconifyIconOnline, IconifyIconOffline, FontIcon } from "../index";
+import { FontIcon, IconifyIconOnline, IconifyIconOffline } from "../index";
 /**
 * 支持 `iconfont`、自定义 `svg` 以及 `iconify` 中所有的图标
@@ -52,7 +52,7 @@ export function useRenderIcon(icon: any, attrs?: iconType): Component {
        const IconifyIcon =
          icon && icon.includes(":") ? IconifyIconOnline : IconifyIconOffline;
        return h(IconifyIcon, {
-          icon: icon,
+          icon,
          ...attrs
        });
      }
--- a/src/components/ReIcon/src/iconfont.ts
+++ b/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: () => [
--- a/src/components/ReIcon/src/iconifyIconOffline.ts
+++ b/src/components/ReIcon/src/iconifyIconOffline.ts
@@ -13,10 +13,26 @@ export default defineComponent({
  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,
          "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" },
@@ -27,4 +43,5 @@ export default defineComponent({
        }
      );
    }
  }
 });
--- a/src/components/ReIcon/src/iconifyIconOnline.ts
+++ b/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" },
--- a/src/components/ReIcon/src/offlineIcon.ts
+++ b/src/components/ReIcon/src/offlineIcon.ts
@@ -1,70 +1,87 @@
 // 这里存放本地图标，在 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 EpMenu from "~icons/ep/menu?raw";
 import EpEdit from "~icons/ep/edit?raw";
 import EpGuide from "~icons/ep/guide?raw";
 import EpSetUp from "~icons/ep/set-up?raw";
 import EpMonitor from "~icons/ep/monitor?raw";
 import EpLollipop from "~icons/ep/lollipop?raw";
 import EpHistogram from "~icons/ep/histogram?raw";
 import EpHomeFilled from "~icons/ep/home-filled?raw";
 // https://icon-sets.iconify.design/ri/?keyword=ri
 import RiMindMap from "~icons/ri/mind-map?raw";
 import RiAdminFill from "~icons/ri/admin-fill?raw";
 import RiTableLine from "~icons/ri/table-line?raw";
 import RiLinksFill from "~icons/ri/links-fill?raw";
 import RiAdminLine from "~icons/ri/admin-line?raw";
 import RiListCheck from "~icons/ri/list-check?raw";
 import RiSearchLine from "~icons/ri/search-line?raw";
 import RiWindowLine from "~icons/ri/window-line?raw";
 import RiUbuntuFill from "~icons/ri/ubuntu-fill?raw";
 import RiHistoryFill from "~icons/ri/history-fill?raw";
 import RiEditBoxLine from "~icons/ri/edit-box-line?raw";
 import RiCodeBoxLine from "~icons/ri/code-box-line?raw";
 import RiArtboardLine from "~icons/ri/artboard-line?raw";
 import RiMarkdownLine from "~icons/ri/markdown-line?raw";
 import RiFileInfoLine from "~icons/ri/file-info-line?raw";
 import RiBankCardLine from "~icons/ri/bank-card-line?raw";
 import RiFilePpt2Line from "~icons/ri/file-ppt-2-line?raw";
 import RiGitBranchLine from "~icons/ri/git-branch-line?raw";
 import RiSettings3Line from "~icons/ri/settings-3-line?raw";
 import RiUserVoiceLine from "~icons/ri/user-voice-line?raw";
 import RiBookmark2Line from "~icons/ri/bookmark-2-line?raw";
 import RiFileSearchLine from "~icons/ri/file-search-line?raw";
 import RiChatSearchLine from "~icons/ri/chat-search-line?raw";
 import RiInformationLine from "~icons/ri/information-line?raw";
 import RiTerminalWindowLine from "~icons/ri/terminal-window-line?raw";
 import RiCheckboxCircleLine from "~icons/ri/checkbox-circle-line?raw";
 import RiBarChartHorizontalLine from "~icons/ri/bar-chart-horizontal-line?raw";
 const icons = [
  // Element Plus Icon: https://github.com/element-plus/element-plus-icons
  ["ep/menu", EpMenu],
  ["ep/edit", EpEdit],
  ["ep/guide", EpGuide],
  ["ep/set-up", EpSetUp],
  ["ep/monitor", EpMonitor],
  ["ep/lollipop", EpLollipop],
  ["ep/histogram", EpHistogram],
  ["ep/home-filled", EpHomeFilled],
  // Remix Icon: https://github.com/Remix-Design/RemixIcon
  ["ri/mind-map", RiMindMap],
  ["ri/admin-fill", RiAdminFill],
  ["ri/table-line", RiTableLine],
  ["ri/links-fill", RiLinksFill],
  ["ri/admin-line", RiAdminLine],
  ["ri/list-check", RiListCheck],
  ["ri/search-line", RiSearchLine],
  ["ri/window-line", RiWindowLine],
  ["ri/ubuntu-fill", RiUbuntuFill],
  ["ri/history-fill", RiHistoryFill],
  ["ri/edit-box-line", RiEditBoxLine],
  ["ri/code-box-line", RiCodeBoxLine],
  ["ri/artboard-line", RiArtboardLine],
  ["ri/markdown-line", RiMarkdownLine],
  ["ri/file-info-line", RiFileInfoLine],
  ["ri/bank-card-line", RiBankCardLine],
  ["ri/file-ppt-2-line", RiFilePpt2Line],
  ["ri/git-branch-line", RiGitBranchLine],
  ["ri/settings-3-line", RiSettings3Line],
  ["ri/user-voice-line", RiUserVoiceLine],
  ["ri/bookmark-2-line", RiBookmark2Line],
  ["ri/file-search-line", RiFileSearchLine],
  ["ri/chat-search-line", RiChatSearchLine],
  ["ri/information-line", RiInformationLine],
  ["ri/terminal-window-line", RiTerminalWindowLine],
  ["ri/checkbox-circle-line", RiCheckboxCircleLine],
  ["ri/bar-chart-horizontal-line", RiBarChartHorizontalLine]
 ];
 // 本地菜单图标，后端在路由的 icon 中返回对应的图标字符串并且前端在此处使用 addIcon 添加即可渲染菜单图标
-// @iconify-icons/ep
+icons.forEach(([name, icon]) => {
-import Menu from "@iconify-icons/ep/menu";
+  addIcon(name as string, getSvgInfo(icon as string));
-import Edit from "@iconify-icons/ep/edit";
+});
 import SetUp from "@iconify-icons/ep/set-up";
 import Guide from "@iconify-icons/ep/guide";
 import Monitor from "@iconify-icons/ep/monitor";
 import Lollipop from "@iconify-icons/ep/lollipop";
 import Histogram from "@iconify-icons/ep/histogram";
 import HomeFilled from "@iconify-icons/ep/home-filled";
 addIcon("ep:menu", Menu);
 addIcon("ep:edit", Edit);
 addIcon("ep:set-up", SetUp);
 addIcon("ep:guide", Guide);
 addIcon("ep:monitor", Monitor);
 addIcon("ep:lollipop", Lollipop);
 addIcon("ep:histogram", Histogram);
 addIcon("ep:home-filled", HomeFilled);
 // @iconify-icons/ri
 import Tag from "@iconify-icons/ri/bookmark-2-line";
 import Ppt from "@iconify-icons/ri/file-ppt-2-line";
 import Card from "@iconify-icons/ri/bank-card-line";
 import Role from "@iconify-icons/ri/admin-fill";
 import Info from "@iconify-icons/ri/file-info-line";
 import Dept from "@iconify-icons/ri/git-branch-line";
 import Table from "@iconify-icons/ri/table-line";
 import Links from "@iconify-icons/ri/links-fill";
 import Search from "@iconify-icons/ri/search-line";
 import FlUser from "@iconify-icons/ri/admin-line";
 import Setting from "@iconify-icons/ri/settings-3-line";
 import MindMap from "@iconify-icons/ri/mind-map";
 import BarChart from "@iconify-icons/ri/bar-chart-horizontal-line";
 import LoginLog from "@iconify-icons/ri/window-line";
 import Artboard from "@iconify-icons/ri/artboard-line";
 import SystemLog from "@iconify-icons/ri/file-search-line";
 import ListCheck from "@iconify-icons/ri/list-check";
 import UbuntuFill from "@iconify-icons/ri/ubuntu-fill";
 import OnlineUser from "@iconify-icons/ri/user-voice-line";
 import EditBoxLine from "@iconify-icons/ri/edit-box-line";
 import OperationLog from "@iconify-icons/ri/history-fill";
 import InformationLine from "@iconify-icons/ri/information-line";
 import TerminalWindowLine from "@iconify-icons/ri/terminal-window-line";
 import CheckboxCircleLine from "@iconify-icons/ri/checkbox-circle-line";
 addIcon("ri:bookmark-2-line", Tag);
 addIcon("ri:file-ppt-2-line", Ppt);
 addIcon("ri:bank-card-line", Card);
 addIcon("ri:admin-fill", Role);
 addIcon("ri:file-info-line", Info);
 addIcon("ri:git-branch-line", Dept);
 addIcon("ri:links-fill", Links);
 addIcon("ri:table-line", Table);
 addIcon("ri:search-line", Search);
 addIcon("ri:admin-line", FlUser);
 addIcon("ri:settings-3-line", Setting);
 addIcon("ri:mind-map", MindMap);
 addIcon("ri:bar-chart-horizontal-line", BarChart);
 addIcon("ri:window-line", LoginLog);
 addIcon("ri:file-search-line", SystemLog);
 addIcon("ri:artboard-line", Artboard);
 addIcon("ri:list-check", ListCheck);
 addIcon("ri:ubuntu-fill", UbuntuFill);
 addIcon("ri:user-voice-line", OnlineUser);
 addIcon("ri:edit-box-line", EditBoxLine);
 addIcon("ri:history-fill", OperationLog);
 addIcon("ri:information-line", InformationLine);
 addIcon("ri:terminal-window-line", TerminalWindowLine);
 addIcon("ri:checkbox-circle-line", CheckboxCircleLine);
--- a/src/components/RePureTableBar/src/bar.tsx
+++ b/src/components/RePureTableBar/src/bar.tsx
@@ -18,8 +18,8 @@ import {
  getKeyList
 } from "@pureadmin/utils";
-import Fullscreen from "@iconify-icons/ri/fullscreen-fill";
+import Fullscreen from "~icons/ri/fullscreen-fill";
-import ExitFullscreen from "@iconify-icons/ri/fullscreen-exit-fill";
+import ExitFullscreen from "~icons/ri/fullscreen-exit-fill";
 import DragIcon from "@/assets/table-bar/drag.svg?component";
 import ExpandIcon from "@/assets/table-bar/expand.svg?component";
 import RefreshIcon from "@/assets/table-bar/refresh.svg?component";
@@ -87,9 +87,9 @@ export default defineComponent({
        "text-black",
        "dark:text-white",
        "duration-100",
-        "hover:!text-primary",
+        "hover:text-primary!",
        "cursor-pointer",
-        "outline-none"
+        "outline-hidden"
      ];
    });
@@ -255,12 +255,12 @@ export default defineComponent({
        <div
          {...attrs}
          class={[
-            "w-[99/100]",
+            "w-full",
            "px-2",
            "pb-2",
            "bg-bg_color",
            isFullscreen.value
-              ? ["!w-full", "!h-full", "z-[2002]", "fixed", "inset-0"]
+              ? ["w-full!", "h-full!", "z-2002", "fixed", "inset-0"]
              : "mt-2"
          ]}
        >
@@ -317,7 +317,7 @@ export default defineComponent({
              >
                <div class={[topClass.value]}>
                  <el-checkbox
-                    class="!-mr-1"
+                    class="-mr-1!"
                    label="列展示"
                    v-model={checkAll.value}
                    indeterminate={isIndeterminate.value}
@@ -347,8 +347,8 @@ export default defineComponent({
                                class={[
                                  "drag-btn w-[16px] mr-2",
                                  isFixedColumn(item)
-                                    ? "!cursor-no-drop"
+                                    ? "cursor-no-drop!"
-                                    : "!cursor-grab"
+                                    : "cursor-grab!"
                                ]}
                                onMouseenter={(event: {
                                  preventDefault: () => void;
--- a/src/components/ReQrcode/src/index.tsx
+++ b/src/components/ReQrcode/src/index.tsx
@@ -11,7 +11,7 @@ import "./index.scss";
 import propTypes from "@/utils/propTypes";
 import { isString, cloneDeep } from "@pureadmin/utils";
 import QRCode, { type QRCodeRenderersOptions } from "qrcode";
-import RefreshRight from "@iconify-icons/ep/refresh-right";
+import RefreshRight from "~icons/ep/refresh-right";
 interface QrcodeLogo {
  src?: string;
--- a/src/components/ReSplitPane/iconfont/iconfont.js
+++ b/src/components/ReSplitPane/iconfont/iconfont.js
@@ -39,8 +39,7 @@
    (t.innerHTML = i),
      (i = null),
      (t = t.getElementsByTagName("svg")[0]) &&
-        (t.setAttribute("aria-hidden", "true"),
+        ((t.style.position = "absolute"),
        (t.style.position = "absolute"),
        (t.style.width = 0),
        (t.style.height = 0),
        (t.style.overflow = "hidden"),
--- a/src/components/ReText/src/index.vue
+++ b/src/components/ReText/src/index.vue
@@ -1,6 +1,6 @@
-<script lang="ts" setup>
+<script setup lang="ts">
-import { h, onMounted, ref, useSlots } from "vue";
+import { h, onMounted, ref } from "vue";
-import { type TippyOptions, useTippy } from "vue-tippy";
+import { type TippyOptions, type TippyContent, useTippy } from "vue-tippy";
 defineOptions({
  name: "ReText"
@@ -17,7 +17,10 @@ const props = defineProps({
  }
 });
-const $slots = useSlots();
+const slots = defineSlots<{
  content: () => TippyContent;
  default: () => any;
 }>();
 const textRef = ref();
 const tippyFunc = ref();
@@ -33,7 +36,7 @@ const isTextEllipsis = (el: HTMLElement) => {
 };
 const getTippyProps = () => ({
-  content: h($slots.content || $slots.default),
+  content: h(slots.content || slots.default),
  ...props.tippyProps
 });
--- a/src/components/ReTreeLine/index.ts
+++ b/src/components/ReTreeLine/index.ts
@@ -90,9 +90,9 @@ export default defineComponent({
        ];
    // 取得每一层的当前节点是不是在当前层级列表的最后一个
    const lastnodeArr = [];
-    let currentNode = this.node;
+    let currentNode: any = this.node;
    while (currentNode) {
-      let parentNode = currentNode.parent;
+      let parentNode: any = currentNode.parent;
      // 兼容element-plus的 el-tree-v2 (Virtualized Tree 虚拟树)
      if (currentNode.level === 1 && !currentNode.parent) {
        // el-tree-v2的第一层node是没有parent的，必需 treeData 创建一个parent
--- a/src/components/ReVxeTableBar/src/bar.tsx
+++ b/src/components/ReVxeTableBar/src/bar.tsx
@@ -12,8 +12,8 @@ import {
  getCurrentInstance
 } from "vue";
-import Fullscreen from "@iconify-icons/ri/fullscreen-fill";
+import Fullscreen from "~icons/ri/fullscreen-fill";
-import ExitFullscreen from "@iconify-icons/ri/fullscreen-exit-fill";
+import ExitFullscreen from "~icons/ri/fullscreen-exit-fill";
 import DragIcon from "@/assets/table-bar/drag.svg?component";
 import ExpandIcon from "@/assets/table-bar/expand.svg?component";
 import RefreshIcon from "@/assets/table-bar/refresh.svg?component";
@@ -80,9 +80,9 @@ export default defineComponent({
        "text-black",
        "dark:text-white",
        "duration-100",
-        "hover:!text-primary",
+        "hover:text-primary!",
        "cursor-pointer",
-        "outline-none"
+        "outline-hidden"
      ];
    });
@@ -248,12 +248,12 @@ export default defineComponent({
        <div
          {...attrs}
          class={[
-            "w-[99/100]",
+            "w-full",
            "px-2",
            "pb-2",
            "bg-bg_color",
            isFullscreen.value
-              ? ["!w-full", "!h-full", "z-[2002]", "fixed", "inset-0"]
+              ? ["w-full!", "h-full!", "z-2002", "fixed", "inset-0"]
              : "mt-2"
          ]}
        >
@@ -310,7 +310,7 @@ export default defineComponent({
              >
                <div class={[topClass.value]}>
                  <el-checkbox
-                    class="!-mr-1"
+                    class="-mr-1!"
                    label="列展示"
                    v-model={checkAll.value}
                    indeterminate={isIndeterminate.value}
@@ -340,8 +340,8 @@ export default defineComponent({
                                class={[
                                  "drag-btn w-[16px] mr-2",
                                  isFixedColumn(item)
-                                    ? "!cursor-no-drop"
+                                    ? "cursor-no-drop!"
-                                    : "!cursor-grab"
+                                    : "cursor-grab!"
                                ]}
                                onMouseenter={(event: {
                                  preventDefault: () => void;
--- a/src/layout/components/lay-footer/index.vue
+++ b/src/layout/components/lay-footer/index.vue
@@ -1,4 +1,4 @@
-<script lang="ts" setup>
+<script setup lang="ts">
 import { getConfig } from "@/config";
 const TITLE = getConfig("Title");
--- a/src/layout/components/lay-navbar/index.vue
+++ b/src/layout/components/lay-navbar/index.vue
@@ -9,10 +9,10 @@ import LaySidebarBreadCrumb from "../lay-sidebar/components/SidebarBreadCrumb.vu
 import LaySidebarTopCollapse from "../lay-sidebar/components/SidebarTopCollapse.vue";
 import GlobalizationIcon from "@/assets/svg/globalization.svg?component";
-import AccountSettingsIcon from "@iconify-icons/ri/user-settings-line";
+import AccountSettingsIcon from "~icons/ri/user-settings-line";
-import LogoutCircleRLine from "@iconify-icons/ri/logout-circle-r-line";
+import LogoutCircleRLine from "~icons/ri/logout-circle-r-line";
-import Setting from "@iconify-icons/ri/settings-3-line";
+import Setting from "~icons/ri/settings-3-line";
-import Check from "@iconify-icons/ep/check";
+import Check from "~icons/ep/check";
 const {
  layout,
@@ -33,7 +33,7 @@ const { t, locale, translationCh, translationEn } = useTranslationLang();
 </script>
 <template>
-  <div class="navbar bg-[#fff] shadow-sm shadow-[rgba(0,21,41,0.08)]">
+  <div class="navbar bg-[#fff] shadow-xs shadow-[rgba(0,21,41,0.08)]">
    <LaySidebarTopCollapse
      v-if="device === 'mobile'"
      class="hamburger-container"
@@ -54,13 +54,13 @@ const { t, locale, translationCh, translationEn } = useTranslationLang();
      <!-- 国际化 -->
      <el-dropdown id="header-translation" trigger="click">
        <GlobalizationIcon
-          class="navbar-bg-hover w-[40px] h-[48px] p-[11px] cursor-pointer outline-none"
+          class="navbar-bg-hover w-[40px] h-[48px] p-[11px] cursor-pointer outline-hidden"
        />
        <template #dropdown>
          <el-dropdown-menu class="translation">
            <el-dropdown-item
              :style="getDropdownItemStyle(locale, 'zh')"
-              :class="['dark:!text-white', getDropdownItemClass(locale, 'zh')]"
+              :class="['dark:text-white!', getDropdownItemClass(locale, 'zh')]"
              @click="translationCh"
            >
              <IconifyIconOffline
@@ -72,7 +72,7 @@ const { t, locale, translationCh, translationEn } = useTranslationLang();
            </el-dropdown-item>
            <el-dropdown-item
              :style="getDropdownItemStyle(locale, 'en')"
-              :class="['dark:!text-white', getDropdownItemClass(locale, 'en')]"
+              :class="['dark:text-white!', getDropdownItemClass(locale, 'en')]"
              @click="translationEn"
            >
              <span v-show="locale === 'en'" class="check-en">
--- a/src/layout/components/lay-notice/components/NoticeItem.vue
+++ b/src/layout/components/lay-notice/components/NoticeItem.vue
@@ -49,7 +49,7 @@ function hoverDescription(event, description) {
 <template>
  <div
-    class="notice-container border-b-[1px] border-solid border-[#f0f0f0] dark:border-[#303030]"
+    class="notice-container border-0 border-b-[1px] border-solid border-[#f0f0f0] dark:border-[#303030]"
  >
    <el-avatar
      v-if="noticeItem.avatar"
@@ -112,7 +112,7 @@ function hoverDescription(event, description) {
  max-width: 238px;
 }
 </style>
-<style scoped lang="scss">
+<style lang="scss" scoped>
 .notice-container {
  display: flex;
  align-items: flex-start;
--- a/src/layout/components/lay-notice/index.vue
+++ b/src/layout/components/lay-notice/index.vue
@@ -3,7 +3,7 @@ import { useI18n } from "vue-i18n";
 import { ref, computed } from "vue";
 import { noticesData } from "./data";
 import NoticeList from "./components/NoticeList.vue";
-import BellIcon from "@iconify-icons/ep/bell";
+import BellIcon from "~icons/ep/bell";
 const { t } = useI18n();
 const noticesNum = ref(0);
--- a/src/layout/components/lay-panel/index.vue
+++ b/src/layout/components/lay-panel/index.vue
@@ -4,7 +4,7 @@ import { emitter } from "@/utils/mitt";
 import { onClickOutside } from "@vueuse/core";
 import { ref, computed, onMounted, onBeforeUnmount } from "vue";
 import { useDataThemeChange } from "@/layout/hooks/useDataThemeChange";
-import CloseIcon from "@iconify-icons/ep/close";
+import CloseIcon from "~icons/ep/close";
 const target = ref(null);
 const show = ref<Boolean>(false);
@@ -16,7 +16,7 @@ const iconClass = computed(() => {
    "flex",
    "justify-center",
    "items-center",
-    "outline-none",
+    "outline-hidden",
    "rounded-[4px]",
    "cursor-pointer",
    "transition-colors",
@@ -51,7 +51,7 @@ onBeforeUnmount(() => {
    <div class="right-panel-background" />
    <div ref="target" class="right-panel bg-bg_color">
      <div
-        class="project-configuration border-b-[1px] border-solid border-[var(--pure-border-color)]"
+        class="project-configuration border-0 border-b-[1px] border-solid border-[var(--pure-border-color)]"
      >
        <h4 class="dark:text-white">
          {{ t("panel.pureSystemSet") }}
@@ -78,7 +78,7 @@ onBeforeUnmount(() => {
      </el-scrollbar>
      <div
-        class="flex justify-end p-3 border-t-[1px] border-solid border-[var(--pure-border-color)]"
+        class="flex justify-end p-3 border-0 border-t-[1px]! border-solid border-[var(--pure-border-color)]"
      >
        <el-button
          v-tippy="{
@@ -121,8 +121,8 @@ onBeforeUnmount(() => {
  width: 100%;
  max-width: 280px;
  box-shadow: 0 0 15px 0 rgb(0 0 0 / 5%);
  transition: all 0.25s cubic-bezier(0.7, 0.3, 0.1, 1);
  transform: translate(100%);
  transition: all 0.25s cubic-bezier(0.7, 0.3, 0.1, 1);
 }
 .show {
--- a/src/layout/components/lay-search/components/SearchFooter.vue
+++ b/src/layout/components/lay-search/components/SearchFooter.vue
@@ -3,8 +3,8 @@ import { useI18n } from "vue-i18n";
 import { useNav } from "@/layout/hooks/useNav";
 import MdiKeyboardEsc from "@/assets/svg/keyboard_esc.svg?component";
 import EnterOutlined from "@/assets/svg/enter_outlined.svg?component";
-import ArrowUpLine from "@iconify-icons/ri/arrow-up-line";
+import ArrowUpLine from "~icons/ri/arrow-up-line";
-import ArrowDownLine from "@iconify-icons/ri/arrow-down-line";
+import ArrowDownLine from "~icons/ri/arrow-down-line";
 withDefaults(defineProps<{ total: number }>(), {
  total: 0
--- a/src/layout/components/lay-search/components/SearchHistoryItem.vue
+++ b/src/layout/components/lay-search/components/SearchHistoryItem.vue
@@ -2,8 +2,8 @@
 import type { optionsItem } from "../types";
 import { transformI18n } from "@/plugins/i18n";
 import { useRenderIcon } from "@/components/ReIcon/src/hooks";
-import StarIcon from "@iconify-icons/ep/star";
+import StarIcon from "~icons/ep/star";
-import CloseIcon from "@iconify-icons/ep/close";
+import CloseIcon from "~icons/ep/close";
 interface Props {
  item: optionsItem;
--- a/src/layout/components/lay-search/components/SearchModal.vue
+++ b/src/layout/components/lay-search/components/SearchModal.vue
@@ -13,7 +13,7 @@ import { ref, computed, shallowRef, watch } from "vue";
 import { useDebounceFn, onKeyStroke } from "@vueuse/core";
 import { usePermissionStoreHook } from "@/store/modules/permission";
 import { cloneDeep, isAllEmpty, storageLocal } from "@pureadmin/utils";
-import SearchIcon from "@iconify-icons/ri/search-line";
+import SearchIcon from "~icons/ri/search-line";
 interface Props {
  /** 弹窗显隐 */
--- a/src/layout/components/lay-search/index.vue
+++ b/src/layout/components/lay-search/index.vue
@@ -14,7 +14,7 @@ function handleSearch() {
      class="search-container w-[40px] h-[48px] flex-c cursor-pointer navbar-bg-hover"
      @click="handleSearch"
    >
-      <IconifyIconOffline icon="ri:search-line" />
+      <IconifyIconOffline icon="ri/search-line" />
    </div>
    <SearchModal v-model:value="show" />
  </div>
--- a/src/layout/components/lay-setting/index.vue
+++ b/src/layout/components/lay-setting/index.vue
@@ -19,9 +19,9 @@ import Segmented, { type OptionsType } from "@/components/ReSegmented";
 import { useDataThemeChange } from "@/layout/hooks/useDataThemeChange";
 import { useDark, useGlobal, debounce, isNumber } from "@pureadmin/utils";
-import Check from "@iconify-icons/ep/check";
+import Check from "~icons/ep/check";
-import LeftArrow from "@iconify-icons/ri/arrow-left-s-line";
+import LeftArrow from "~icons/ri/arrow-left-s-line?width=20&height=20";
-import RightArrow from "@iconify-icons/ri/arrow-right-s-line";
+import RightArrow from "~icons/ri/arrow-right-s-line?width=20&height=20";
 import DayIcon from "@/assets/svg/day.svg?component";
 import DarkIcon from "@/assets/svg/dark.svg?component";
 import SystemIcon from "@/assets/svg/system.svg?component";
@@ -189,7 +189,7 @@ const getThemeColor = computed(() => {
 });
 const pClass = computed(() => {
-  return ["mb-[12px]", "font-medium", "text-sm", "dark:text-white"];
+  return ["mb-[12px]!", "font-medium", "text-sm", "dark:text-white"];
 });
 const themeOptions = computed<Array<OptionsType>>(() => {
@@ -335,7 +335,7 @@ onUnmounted(() => removeMatchMedia);
        "
      />
-      <p :class="['mt-5', pClass]">{{ t("panel.pureThemeColor") }}</p>
+      <p :class="['mt-5!', pClass]">{{ t("panel.pureThemeColor") }}</p>
      <ul class="theme-color">
        <li
          v-for="(item, index) in themeColors"
@@ -354,7 +354,7 @@ onUnmounted(() => removeMatchMedia);
        </li>
      </ul>
-      <p :class="['mt-5', pClass]">{{ t("panel.pureLayoutModel") }}</p>
+      <p :class="['mt-5!', pClass]">{{ t("panel.pureLayoutModel") }}</p>
      <ul class="pure-theme">
        <li
          ref="verticalRef"
@@ -397,7 +397,7 @@ onUnmounted(() => removeMatchMedia);
      </ul>
      <span v-if="useAppStoreHook().getViewportWidth > 1280">
-        <p :class="['mt-5', pClass]">{{ t("panel.pureStretch") }}</p>
+        <p :class="['mt-5!', pClass]">{{ t("panel.pureStretch") }}</p>
        <Segmented
          resize
          class="mb-2 select-none"
@@ -426,21 +426,19 @@ onUnmounted(() => removeMatchMedia);
          >
            <IconifyIconOffline
              :icon="settings.stretch ? RightArrow : LeftArrow"
              height="20"
            />
            <div
-              class="flex-grow border-b border-dashed"
+              class="grow border-0 border-b border-dashed"
              style="border-color: var(--el-color-primary)"
            />
            <IconifyIconOffline
              :icon="settings.stretch ? LeftArrow : RightArrow"
              height="20"
            />
          </div>
        </button>
      </span>
-      <p :class="['mt-4', pClass]">{{ t("panel.pureTagsStyle") }}</p>
+      <p :class="['mt-4!', pClass]">{{ t("panel.pureTagsStyle") }}</p>
      <Segmented
        resize
        class="select-none"
@@ -449,7 +447,7 @@ onUnmounted(() => removeMatchMedia);
        @change="onChange"
      />
-      <p class="mt-5 font-medium text-sm dark:text-white">
+      <p class="mt-5! font-medium text-sm dark:text-white">
        {{ t("panel.pureInterfaceDisplay") }}
      </p>
      <ul class="setting">
--- a/src/layout/components/lay-sidebar/NavHorizontal.vue
+++ b/src/layout/components/lay-sidebar/NavHorizontal.vue
@@ -12,10 +12,10 @@ import LaySidebarItem from "../lay-sidebar/components/SidebarItem.vue";
 import LaySidebarFullScreen from "../lay-sidebar/components/SidebarFullScreen.vue";
 import GlobalizationIcon from "@/assets/svg/globalization.svg?component";
-import AccountSettingsIcon from "@iconify-icons/ri/user-settings-line";
+import AccountSettingsIcon from "~icons/ri/user-settings-line";
-import LogoutCircleRLine from "@iconify-icons/ri/logout-circle-r-line";
+import LogoutCircleRLine from "~icons/ri/logout-circle-r-line";
-import Setting from "@iconify-icons/ri/settings-3-line";
+import Setting from "~icons/ri/settings-3-line";
-import Check from "@iconify-icons/ep/check";
+import Check from "~icons/ep/check";
 const menuRef = ref();
 const showLogo = ref(
@@ -84,13 +84,13 @@ onMounted(() => {
      <!-- 国际化 -->
      <el-dropdown id="header-translation" trigger="click">
        <GlobalizationIcon
-          class="navbar-bg-hover w-[40px] h-[48px] p-[11px] cursor-pointer outline-none"
+          class="navbar-bg-hover w-[40px] h-[48px] p-[11px] cursor-pointer outline-hidden"
        />
        <template #dropdown>
          <el-dropdown-menu class="translation">
            <el-dropdown-item
              :style="getDropdownItemStyle(locale, 'zh')"
-              :class="['dark:!text-white', getDropdownItemClass(locale, 'zh')]"
+              :class="['dark:text-white!', getDropdownItemClass(locale, 'zh')]"
              @click="translationCh"
            >
              <span v-show="locale === 'zh'" class="check-zh">
@@ -100,7 +100,7 @@ onMounted(() => {
            </el-dropdown-item>
            <el-dropdown-item
              :style="getDropdownItemStyle(locale, 'en')"
-              :class="['dark:!text-white', getDropdownItemClass(locale, 'en')]"
+              :class="['dark:text-white!', getDropdownItemClass(locale, 'en')]"
              @click="translationEn"
            >
              <span v-show="locale === 'en'" class="check-en">
--- a/src/layout/components/lay-sidebar/NavMix.vue
+++ b/src/layout/components/lay-sidebar/NavMix.vue
@@ -13,10 +13,10 @@ import LaySidebarExtraIcon from "../lay-sidebar/components/SidebarExtraIcon.vue"
 import LaySidebarFullScreen from "../lay-sidebar/components/SidebarFullScreen.vue";
 import GlobalizationIcon from "@/assets/svg/globalization.svg?component";
-import AccountSettingsIcon from "@iconify-icons/ri/user-settings-line";
+import AccountSettingsIcon from "~icons/ri/user-settings-line";
-import LogoutCircleRLine from "@iconify-icons/ri/logout-circle-r-line";
+import LogoutCircleRLine from "~icons/ri/logout-circle-r-line";
-import Setting from "@iconify-icons/ri/settings-3-line";
+import Setting from "~icons/ri/settings-3-line";
-import Check from "@iconify-icons/ep/check";
+import Check from "~icons/ep/check";
 const menuRef = ref();
 const defaultActive = ref(null);
@@ -105,13 +105,13 @@ watch(
      <!-- 国际化 -->
      <el-dropdown id="header-translation" trigger="click">
        <GlobalizationIcon
-          class="navbar-bg-hover w-[40px] h-[48px] p-[11px] cursor-pointer outline-none"
+          class="navbar-bg-hover w-[40px] h-[48px] p-[11px] cursor-pointer outline-hidden"
        />
        <template #dropdown>
          <el-dropdown-menu class="translation">
            <el-dropdown-item
              :style="getDropdownItemStyle(locale, 'zh')"
-              :class="['dark:!text-white', getDropdownItemClass(locale, 'zh')]"
+              :class="['dark:text-white!', getDropdownItemClass(locale, 'zh')]"
              @click="translationCh"
            >
              <span v-show="locale === 'zh'" class="check-zh">
@@ -121,7 +121,7 @@ watch(
            </el-dropdown-item>
            <el-dropdown-item
              :style="getDropdownItemStyle(locale, 'en')"
-              :class="['dark:!text-white', getDropdownItemClass(locale, 'en')]"
+              :class="['dark:text-white!', getDropdownItemClass(locale, 'en')]"
              @click="translationEn"
            >
              <span v-show="locale === 'en'" class="check-en">
--- a/src/layout/components/lay-sidebar/components/SidebarBreadCrumb.vue
+++ b/src/layout/components/lay-sidebar/components/SidebarBreadCrumb.vue
@@ -105,12 +105,12 @@ watch(
 </script>
 <template>
-  <el-breadcrumb class="!leading-[50px] select-none" separator="/">
+  <el-breadcrumb class="leading-[50px]! select-none" separator="/">
    <transition-group name="breadcrumb">
      <el-breadcrumb-item
        v-for="item in levelList"
        :key="item.path"
-        class="!inline !items-stretch"
+        class="inline! items-stretch!"
      >
        <a @click.prevent="handleLink(item)">
          {{ transformI18n(item.meta.title) }}
--- a/src/layout/components/lay-sidebar/components/SidebarCenterCollapse.vue
+++ b/src/layout/components/lay-sidebar/components/SidebarCenterCollapse.vue
@@ -4,7 +4,7 @@ import { useI18n } from "vue-i18n";
 import { useGlobal } from "@pureadmin/utils";
 import { useNav } from "@/layout/hooks/useNav";
-import ArrowLeft from "@iconify-icons/ri/arrow-left-double-fill";
+import ArrowLeft from "~icons/ri/arrow-left-double-fill";
 interface Props {
  isActive: boolean;
--- a/src/layout/components/lay-sidebar/components/SidebarItem.vue
+++ b/src/layout/components/lay-sidebar/components/SidebarItem.vue
@@ -17,10 +17,10 @@ import {
  useAttrs
 } from "vue";
-import ArrowUp from "@iconify-icons/ep/arrow-up-bold";
+import ArrowUp from "~icons/ep/arrow-up-bold";
-import EpArrowDown from "@iconify-icons/ep/arrow-down-bold";
+import EpArrowDown from "~icons/ep/arrow-down-bold";
-import ArrowLeft from "@iconify-icons/ep/arrow-left-bold";
+import ArrowLeft from "~icons/ep/arrow-left-bold";
-import ArrowRight from "@iconify-icons/ep/arrow-right-bold";
+import ArrowRight from "~icons/ep/arrow-right-bold";
 const attrs = useAttrs();
 const { layout, isCollapse, tooltipEffect, getDivStyle } = useNav();
@@ -144,7 +144,7 @@ function resolvePath(routePath) {
            item?.pathList?.length === 2)
        "
        truncated
-        class="!w-full !pl-4 !text-inherit"
+        class="w-full! pl-4! text-inherit!"
      >
        {{ transformI18n(onlyOneChild.meta.title) }}
      </el-text>
@@ -156,7 +156,7 @@ function resolvePath(routePath) {
              offset: [0, -10],
              theme: tooltipEffect
            }"
-            class="!w-full !text-inherit"
+            class="w-full! text-inherit!"
          >
            {{ transformI18n(onlyOneChild.meta.title) }}
          </ReText>
@@ -196,9 +196,9 @@ function resolvePath(routePath) {
          theme: tooltipEffect
        }"
        :class="{
-          '!w-full': true,
+          'w-full!': true,
-          '!text-inherit': true,
+          'text-inherit!': true,
-          '!pl-4':
+          'pl-4!':
            layout !== 'horizontal' &&
            isCollapse &&
            !toRaw(item.meta.icon) &&
--- a/src/layout/components/lay-sidebar/components/SidebarLeftCollapse.vue
+++ b/src/layout/components/lay-sidebar/components/SidebarLeftCollapse.vue
@@ -4,7 +4,7 @@ import { useI18n } from "vue-i18n";
 import { useGlobal } from "@pureadmin/utils";
 import { useNav } from "@/layout/hooks/useNav";
-import MenuFold from "@iconify-icons/ri/menu-fold-fill";
+import MenuFold from "~icons/ri/menu-fold-fill";
 interface Props {
  isActive: boolean;
@@ -23,7 +23,7 @@ const iconClass = computed(() => {
    "mb-1",
    "w-[16px]",
    "h-[16px]",
-    "inline-block",
+    "inline-block!",
    "align-middle",
    "cursor-pointer",
    "duration-[100ms]"
--- a/src/layout/components/lay-sidebar/components/SidebarLogo.vue
+++ b/src/layout/components/lay-sidebar/components/SidebarLogo.vue
@@ -60,11 +60,11 @@ const { title, getLogo } = useNav();
      height: 32px;
      margin: 2px 0 0 12px;
      overflow: hidden;
      text-overflow: ellipsis;
      font-size: 18px;
      font-weight: 600;
      line-height: 32px;
      color: var(--pure-theme-sub-menu-active-text);
      text-overflow: ellipsis;
      white-space: nowrap;
    }
  }
--- a/src/layout/components/lay-sidebar/components/SidebarTopCollapse.vue
+++ b/src/layout/components/lay-sidebar/components/SidebarTopCollapse.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { useI18n } from "vue-i18n";
-import MenuFold from "@iconify-icons/ri/menu-fold-fill";
+import MenuFold from "~icons/ri/menu-fold-fill";
-import MenuUnfold from "@iconify-icons/ri/menu-unfold-fill";
+import MenuUnfold from "~icons/ri/menu-unfold-fill";
 interface Props {
  isActive: boolean;
@@ -32,7 +32,7 @@ const toggleClick = () => {
  >
    <IconifyIconOffline
      :icon="isActive ? MenuFold : MenuUnfold"
-      class="inline-block align-middle hover:text-primary dark:hover:!text-white"
+      class="inline-block align-middle hover:text-primary dark:hover:text-white!"
    />
  </div>
 </template>
--- a/src/layout/components/lay-tag/index.scss
+++ b/src/layout/components/lay-tag/index.scss
@@ -59,10 +59,10 @@
      color: var(--el-color-primary);
      cursor: pointer;
      border-radius: 4px;
      transform: translate(0, -50%);
      transition:
        background-color 0.12s,
        color 0.12s;
      transform: translate(0, -50%);
      &:hover {
        color: rgb(0 0 0 / 88%) !important;
@@ -127,10 +127,10 @@
    font-weight: normal;
    color: var(--el-text-color-primary);
    white-space: nowrap;
    outline: 0;
    list-style-type: none;
    background: #fff;
    border-radius: 4px;
    outline: 0;
    box-shadow: 0 2px 8px rgb(0 0 0 / 15%);
    li {
--- a/src/layout/components/lay-tag/index.vue
+++ b/src/layout/components/lay-tag/index.vue
@@ -18,11 +18,11 @@ import {
  useResizeObserver
 } from "@pureadmin/utils";
-import ExitFullscreen from "@iconify-icons/ri/fullscreen-exit-fill";
+import ExitFullscreen from "~icons/ri/fullscreen-exit-fill";
-import Fullscreen from "@iconify-icons/ri/fullscreen-fill";
+import Fullscreen from "~icons/ri/fullscreen-fill";
-import ArrowDown from "@iconify-icons/ri/arrow-down-s-line";
+import ArrowDown from "~icons/ri/arrow-down-s-line";
-import ArrowRightSLine from "@iconify-icons/ri/arrow-right-s-line";
+import ArrowRightSLine from "~icons/ri/arrow-right-s-line";
-import ArrowLeftSLine from "@iconify-icons/ri/arrow-left-s-line";
+import ArrowLeftSLine from "~icons/ri/arrow-left-s-line";
 const {
  Close,
@@ -511,6 +511,7 @@ function tagOnClick(item) {
  } else {
    router.push({ path });
  }
  emitter.emit("tagOnClick", item);
 }
 onClickOutside(contextmenuRef, closeMenu, {
@@ -588,7 +589,7 @@ onBeforeUnmount(() => {
        >
          <template v-if="showModel !== 'chrome'">
            <span
-              class="tag-title dark:!text-text_color_primary dark:hover:!text-primary"
+              class="tag-title dark:text-text_color_primary! dark:hover:text-primary!"
            >
              {{ transformI18n(item.meta.title) }}
            </span>
--- a/src/layout/hooks/useNav.ts
+++ b/src/layout/hooks/useNav.ts
@@ -14,8 +14,8 @@ import { useUserStoreHook } from "@/store/modules/user";
 import { useGlobal, isAllEmpty } from "@pureadmin/utils";
 import { useEpThemeStoreHook } from "@/store/modules/epTheme";
 import { usePermissionStoreHook } from "@/store/modules/permission";
-import ExitFullscreen from "@iconify-icons/ri/fullscreen-exit-fill";
+import ExitFullscreen from "~icons/ri/fullscreen-exit-fill";
-import Fullscreen from "@iconify-icons/ri/fullscreen-fill";
+import Fullscreen from "~icons/ri/fullscreen-fill";
 const errorInfo =
  "The current routing configuration is incorrect, please check the configuration";
@@ -64,7 +64,7 @@ export function useNav() {
  const getDropdownItemClass = computed(() => {
    return (locale, t) => {
-      return locale === t ? "" : "dark:hover:!text-primary";
+      return locale === t ? "" : "dark:hover:text-primary!";
    };
  });
--- a/src/layout/hooks/useTag.ts
+++ b/src/layout/hooks/useTag.ts
@@ -21,13 +21,13 @@ import {
  hasClass
 } from "@pureadmin/utils";
-import Fullscreen from "@iconify-icons/ri/fullscreen-fill";
+import Fullscreen from "~icons/ri/fullscreen-fill";
-import CloseAllTags from "@iconify-icons/ri/subtract-line";
+import CloseAllTags from "~icons/ri/subtract-line";
-import CloseOtherTags from "@iconify-icons/ri/text-spacing";
+import CloseOtherTags from "~icons/ri/text-spacing";
-import CloseRightTags from "@iconify-icons/ri/text-direction-l";
+import CloseRightTags from "~icons/ri/text-direction-l";
-import CloseLeftTags from "@iconify-icons/ri/text-direction-r";
+import CloseLeftTags from "~icons/ri/text-direction-r";
-import RefreshRight from "@iconify-icons/ep/refresh-right";
+import RefreshRight from "~icons/ep/refresh-right";
-import Close from "@iconify-icons/ep/close";
+import Close from "~icons/ep/close";
 export function useTags() {
  const route = useRoute();
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -210,8 +210,8 @@ const LayHeader = defineComponent({
  height: 100%;
  &::after {
    display: table;
    clear: both;
    display: table;
    content: "";
  }
--- a/src/layout/types.ts
+++ b/src/layout/types.ts
@@ -1,4 +1,4 @@
-import type { IconifyIcon } from "@iconify/vue";
+import type { FunctionalComponent } from "vue";
 const { VITE_HIDE_HOME } = import.meta.env;
 export const routerArrays: Array<RouteConfigs> =
@@ -8,7 +8,7 @@ export const routerArrays: Array<RouteConfigs> =
          path: "/welcome",
          meta: {
            title: "menus.pureHome",
-            icon: "ep:home-filled"
+            icon: "ep/home-filled"
          }
        }
      ]
@@ -16,7 +16,7 @@ export const routerArrays: Array<RouteConfigs> =
 export type routeMetaType = {
  title?: string;
-  icon?: string | IconifyIcon;
+  icon?: string | FunctionalComponent;
  showLink?: boolean;
  savedPosition?: boolean;
  auths?: Array<string>;
@@ -36,7 +36,7 @@ export type multiTagsType = {
 };
 export type tagsViewsType = {
-  icon: string | IconifyIcon;
+  icon: string | FunctionalComponent;
  text: string;
  divided: boolean;
  disabled: boolean;
--- a/src/router/enums.ts
+++ b/src/router/enums.ts
@@ -1,33 +1,37 @@
 // 完整版菜单比较多，将 rank 抽离出来，在此方便维护
 const home = 0, // 平台规定只有 home 路由的 rank 才能为 0 ，所以后端在返回 rank 的时候需要从非 0 开始
-  vueflow = 1,
+  chatai = 1,
-  ganttastic = 2,
+  vueflow = 2,
-  components = 3,
+  ganttastic = 3,
-  able = 4,
+  components = 4,
-  table = 5,
+  able = 5,
-  form = 6,
+  table = 6,
-  list = 7,
+  form = 7,
-  result = 8,
+  list = 8,
-  error = 9,
+  result = 9,
-  frame = 10,
+  error = 10,
-  nested = 11,
+  frame = 11,
-  permission = 12,
+  nested = 12,
-  system = 13,
+  permission = 13,
-  monitor = 14,
+  system = 14,
-  tabs = 15,
+  monitor = 15,
-  about = 16,
+  tabs = 16,
-  editor = 17,
+  about = 17,
-  flowchart = 18,
+  codemirror = 18,
-  formdesign = 19,
+  markdown = 19,
-  board = 20,
+  editor = 20,
-  ppt = 21,
+  flowchart = 21,
-  mind = 22,
+  formdesign = 22,
-  guide = 23,
+  board = 23,
-  menuoverflow = 24;
+  ppt = 24,
  mind = 25,
  guide = 26,
  menuoverflow = 27;
 export {
  home,
  chatai,
  vueflow,
  ganttastic,
  components,
@@ -44,6 +48,8 @@ export {
  monitor,
  tabs,
  about,
  codemirror,
  markdown,
  editor,
  flowchart,
  formdesign,
--- a/src/router/modules/able.ts
+++ b/src/router/modules/able.ts
@@ -5,7 +5,7 @@ export default {
  path: "/able",
  redirect: "/able/watermark",
  meta: {
-    icon: "ri:ubuntu-fill",
+    icon: "ri/ubuntu-fill",
    title: $t("menus.pureAble"),
    rank: able
  },
@@ -15,8 +15,7 @@ export default {
      name: "MqttClient",
      component: () => import("@/views/able/mqtt-client.vue"),
      meta: {
-        title: $t("menus.pureMqtt"),
+        title: $t("menus.pureMqtt")
        extraIcon: "IF-pure-iconfont-new svg"
      }
    },
    {
--- a/src/router/modules/about.ts
+++ b/src/router/modules/about.ts
@@ -5,7 +5,7 @@ export default {
  path: "/about",
  redirect: "/about/index",
  meta: {
-    icon: "ri:file-info-line",
+    icon: "ri/file-info-line",
    title: $t("menus.pureAbout"),
    rank: about
  },
--- a/src/router/modules/board.ts
+++ b/src/router/modules/board.ts
@@ -6,7 +6,7 @@ export default {
  path: "/board",
  redirect: "/board/index",
  meta: {
-    icon: "ri:artboard-line",
+    icon: "ri/artboard-line",
    title: $t("menus.pureBoard"),
    rank: board
  },
--- a/src/router/modules/chatai.ts
+++ b/src/router/modules/chatai.ts
@@ -0,0 +1,22 @@
 import { chatai } from "@/router/enums";
 export default {
  path: "/chatai",
  redirect: "/chatai/index",
  meta: {
    icon: "ri/chat-search-line",
    title: "chat-ai",
    rank: chatai
  },
  children: [
    {
      path: "/chatai/index",
      name: "ChatAi",
      component: () => import("@/views/chatai/index.vue"),
      meta: {
        title: "chat-ai",
        extraIcon: "IF-pure-iconfont-new svg"
      }
    }
  ]
 } satisfies RouteConfigsTable;
--- a/src/router/modules/codemirror.ts
+++ b/src/router/modules/codemirror.ts
@@ -0,0 +1,23 @@
 import { $t } from "@/plugins/i18n";
 import { codemirror } from "@/router/enums";
 export default {
  path: "/codemirror",
  redirect: "/codemirror/index",
  meta: {
    icon: "ri/code-box-line",
    title: $t("menus.pureCodeMirror"),
    rank: codemirror
  },
  children: [
    {
      path: "/codemirror/index",
      name: "CodeMirror",
      component: () => import("@/views/codemirror/index.vue"),
      meta: {
        title: $t("menus.pureCodeMirror"),
        extraIcon: "IF-pure-iconfont-new svg"
      }
    }
  ]
 } satisfies RouteConfigsTable;
--- a/src/router/modules/components.ts
+++ b/src/router/modules/components.ts
@@ -5,7 +5,7 @@ export default {
  path: "/components",
  redirect: "/components/dialog",
  meta: {
-    icon: "ep:menu",
+    icon: "ep/menu",
    title: $t("menus.pureComponents"),
    rank: components
  },
@@ -47,8 +47,7 @@ export default {
      name: "CheckCard",
      component: () => import("@/views/components/check-card.vue"),
      meta: {
-        title: $t("menus.pureCheckCard"),
+        title: $t("menus.pureCheckCard")
        extraIcon: "IF-pure-iconfont-new svg"
      }
    },
    {
@@ -112,7 +111,15 @@ export default {
      name: "PureText",
      component: () => import("@/views/components/text.vue"),
      meta: {
-        title: $t("menus.pureText"),
+        title: $t("menus.pureText")
      }
    },
    {
      path: "/components/slider",
      name: "PureSlider",
      component: () => import("@/views/components/slider/index.vue"),
      meta: {
        title: $t("menus.pureSlider"),
        extraIcon: "IF-pure-iconfont-new svg"
      }
    },
@@ -129,8 +136,7 @@ export default {
      name: "CheckButton",
      component: () => import("@/views/components/check-button.vue"),
      meta: {
-        title: $t("menus.pureCheckButton"),
+        title: $t("menus.pureCheckButton")
        extraIcon: "IF-pure-iconfont-new svg"
      }
    },
    {
--- a/src/router/modules/editor.ts
+++ b/src/router/modules/editor.ts
@@ -5,7 +5,7 @@ export default {
  path: "/editor",
  redirect: "/editor/index",
  meta: {
-    icon: "ep:edit",
+    icon: "ep/edit",
    title: $t("menus.pureEditor"),
    rank: editor
  },
--- a/src/router/modules/error.ts
+++ b/src/router/modules/error.ts
@@ -5,7 +5,7 @@ export default {
  path: "/error",
  redirect: "/error/403",
  meta: {
-    icon: "ri:information-line",
+    icon: "ri/information-line",
    // showLink: false,
    title: $t("menus.pureAbnormal"),
    rank: error
--- a/src/router/modules/flowchart.ts
+++ b/src/router/modules/flowchart.ts
@@ -5,7 +5,7 @@ export default {
  path: "/flow-chart",
  redirect: "/flow-chart/index",
  meta: {
-    icon: "ep:set-up",
+    icon: "ep/set-up",
    title: $t("menus.pureFlowChart"),
    rank: flowchart
  },
--- a/src/router/modules/form.ts
+++ b/src/router/modules/form.ts
@@ -5,7 +5,7 @@ export default {
  path: "/form",
  redirect: "/form/index",
  meta: {
-    icon: "ri:edit-box-line",
+    icon: "ri/edit-box-line",
    title: $t("menus.pureSchemaForm"),
    rank: form
  },
@@ -15,8 +15,7 @@ export default {
      name: "SchemaForm",
      component: () => import("@/views/schema-form/index.vue"),
      meta: {
-        title: $t("menus.pureSchemaForm"),
+        title: $t("menus.pureSchemaForm")
        extraIcon: "IF-pure-iconfont-new svg"
      }
    }
  ]
--- a/src/router/modules/formdesign.ts
+++ b/src/router/modules/formdesign.ts
@@ -6,7 +6,7 @@ export default {
  path: "/form-design",
  redirect: "/form-design/index",
  meta: {
-    icon: "ri:terminal-window-line",
+    icon: "ri/terminal-window-line",
    title: $t("menus.pureFormDesign"),
    rank: formdesign
  },
--- a/src/router/modules/ganttastic.ts
+++ b/src/router/modules/ganttastic.ts
@@ -5,7 +5,7 @@ export default {
  path: "/ganttastic",
  redirect: "/ganttastic/index",
  meta: {
-    icon: "ri:bar-chart-horizontal-line",
+    icon: "ri/bar-chart-horizontal-line",
    title: $t("menus.pureGanttastic"),
    rank: ganttastic
  },
@@ -15,8 +15,7 @@ export default {
      name: "Ganttastic",
      component: () => import("@/views/ganttastic/index.vue"),
      meta: {
-        title: $t("menus.pureGanttastic"),
+        title: $t("menus.pureGanttastic")
        extraIcon: "IF-pure-iconfont-new svg"
      }
    }
  ]
--- a/src/router/modules/guide.ts
+++ b/src/router/modules/guide.ts
@@ -5,7 +5,7 @@ export default {
  path: "/guide",
  redirect: "/guide/index",
  meta: {
-    icon: "ep:guide",
+    icon: "ep/guide",
    title: $t("menus.pureGuide"),
    rank: guide
  },
--- a/src/router/modules/home.ts
+++ b/src/router/modules/home.ts
@@ -9,7 +9,7 @@ export default {
  component: Layout,
  redirect: "/welcome",
  meta: {
-    icon: "ep:home-filled",
+    icon: "ep/home-filled",
    title: $t("menus.pureHome"),
    rank: home
  },
--- a/src/router/modules/list.ts
+++ b/src/router/modules/list.ts
@@ -5,7 +5,7 @@ export default {
  path: "/list",
  redirect: "/list/card",
  meta: {
-    icon: "ri:list-check",
+    icon: "ri/list-check",
    title: $t("menus.pureList"),
    rank: list
  },
@@ -15,7 +15,7 @@ export default {
      name: "CardList",
      component: () => import("@/views/list/card/index.vue"),
      meta: {
-        icon: "ri:bank-card-line",
+        icon: "ri/bank-card-line",
        title: $t("menus.pureCardList"),
        showParent: true
      }
--- a/src/router/modules/markdown.ts
+++ b/src/router/modules/markdown.ts
@@ -0,0 +1,23 @@
 import { $t } from "@/plugins/i18n";
 import { markdown } from "@/router/enums";
 export default {
  path: "/markdown",
  redirect: "/markdown/index",
  meta: {
    icon: "ri/markdown-line",
    title: $t("menus.pureMarkdown"),
    rank: markdown
  },
  children: [
    {
      path: "/markdown/index",
      name: "Markdown",
      component: () => import("@/views/markdown/index.vue"),
      meta: {
        title: $t("menus.pureMarkdown"),
        extraIcon: "IF-pure-iconfont-new svg"
      }
    }
  ]
 } satisfies RouteConfigsTable;
--- a/src/router/modules/mind.ts
+++ b/src/router/modules/mind.ts
@@ -6,7 +6,7 @@ export default {
  path: "/mind-map",
  redirect: "/mind-map/index",
  meta: {
-    icon: "ri:mind-map",
+    icon: "ri/mind-map",
    title: $t("menus.pureMindMap"),
    rank: mind
  },
--- a/src/router/modules/nested.ts
+++ b/src/router/modules/nested.ts
@@ -6,7 +6,7 @@ export default {
  redirect: "/nested/menu1/menu1-1",
  meta: {
    title: $t("menus.pureMenus"),
-    icon: "ep:histogram",
+    icon: "ep/histogram",
    rank: nested
  },
  children: [
--- a/src/router/modules/ppt.ts
+++ b/src/router/modules/ppt.ts
@@ -5,7 +5,7 @@ export default {
  path: "/ppt",
  redirect: "/ppt/index",
  meta: {
-    icon: "ri:file-ppt-2-line",
+    icon: "ri/file-ppt-2-line",
    title: "PPT",
    rank: ppt
  },
--- a/src/router/modules/result.ts
+++ b/src/router/modules/result.ts
@@ -5,7 +5,7 @@ export default {
  path: "/result",
  redirect: "/result/success",
  meta: {
-    icon: "ri:checkbox-circle-line",
+    icon: "ri/checkbox-circle-line",
    title: $t("menus.pureResult"),
    rank: result
  },
--- a/src/router/modules/table.ts
+++ b/src/router/modules/table.ts
@@ -5,7 +5,7 @@ export default {
  path: "/table",
  redirect: "/table/index",
  meta: {
-    icon: "ri:table-line",
+    icon: "ri/table-line",
    title: $t("menus.pureTable"),
    rank: table
  },
@@ -31,8 +31,7 @@ export default {
      name: "PureTableEdit",
      component: () => import("@/views/table/edit.vue"),
      meta: {
-        title: $t("menus.pureTableEdit"),
+        title: $t("menus.pureTableEdit")
        extraIcon: "IF-pure-iconfont-new svg"
      }
    },
    {
@@ -40,8 +39,7 @@ export default {
      name: "VxeTable",
      component: () => import("@/views/table/virtual.vue"),
      meta: {
-        title: $t("menus.pureVxeTable"),
+        title: $t("menus.pureVxeTable")
        extraIcon: "IF-pure-iconfont-new svg"
      }
    }
  ]
--- a/src/router/modules/vueflow.ts
+++ b/src/router/modules/vueflow.ts
@@ -4,7 +4,7 @@ export default {
  path: "/vue-flow",
  redirect: "/vue-flow/index",
  meta: {
-    icon: "ep:set-up",
+    icon: "ep/set-up",
    title: "vue-flow",
    rank: vueflow
  },
@@ -14,8 +14,7 @@ export default {
      name: "VueFlow",
      component: () => import("@/views/vue-flow/layouting/index.vue"),
      meta: {
-        title: "vue-flow",
+        title: "vue-flow"
        extraIcon: "IF-pure-iconfont-new svg"
      }
    }
  ]
--- a/src/store/modules/app.ts
+++ b/src/store/modules/app.ts
@@ -8,8 +8,7 @@ import {
  responsiveStorageNameSpace
 } from "../utils";
-export const useAppStore = defineStore({
+export const useAppStore = defineStore("pure-app", {
  id: "pure-app",
  state: (): appType => ({
    sidebar: {
      opened:
--- a/src/store/modules/epTheme.ts
+++ b/src/store/modules/epTheme.ts
@@ -6,8 +6,7 @@ import {
  responsiveStorageNameSpace
 } from "../utils";
-export const useEpThemeStore = defineStore({
+export const useEpThemeStore = defineStore("pure-epTheme", {
  id: "pure-epTheme",
  state: () => ({
    epThemeColor:
      storageLocal().getItem<StorageConfigs>(
--- a/src/store/modules/multiTags.ts
+++ b/src/store/modules/multiTags.ts
@@ -14,8 +14,7 @@ import {
 } from "../utils";
 import { usePermissionStoreHook } from "./permission";
-export const useMultiTagsStore = defineStore({
+export const useMultiTagsStore = defineStore("pure-multiTags", {
  id: "pure-multiTags",
  state: () => ({
    // 存储标签页信息（路由信息）
    multiTags: storageLocal().getItem<StorageConfigs>(
@@ -24,12 +23,12 @@ export const useMultiTagsStore = defineStore({
      ? storageLocal().getItem<StorageConfigs>(
          `${responsiveStorageNameSpace()}tags`
        )
-      : [
+      : ([
          ...routerArrays,
          ...usePermissionStoreHook().flatteningRoutes.filter(
            v => v?.meta?.fixedTag
          )
-        ],
+        ] as any),
    multiTagsCache: storageLocal().getItem<StorageConfigs>(
      `${responsiveStorageNameSpace()}configure`
    )?.multiTagsCache
--- a/src/store/modules/permission.ts
+++ b/src/store/modules/permission.ts
@@ -12,8 +12,7 @@ import {
 } from "../utils";
 import { useMultiTagsStoreHook } from "./multiTags";
-export const usePermissionStore = defineStore({
+export const usePermissionStore = defineStore("pure-permission", {
  id: "pure-permission",
  state: () => ({
    // 静态路由生成的菜单
    constantMenus,
@@ -31,7 +30,7 @@ export const usePermissionStore = defineStore({
        filterTree(ascending(this.constantMenus.concat(routes)))
      );
      this.flatteningRoutes = formatFlatteningRoutes(
-        this.constantMenus.concat(routes)
+        this.constantMenus.concat(routes) as any
      );
    },
    cacheOperate({ mode, name }: cacheType) {
--- a/src/store/modules/settings.ts
+++ b/src/store/modules/settings.ts
@@ -1,8 +1,7 @@
 import { defineStore } from "pinia";
 import { type setType, store, getConfig } from "../utils";
-export const useSettingStore = defineStore({
+export const useSettingStore = defineStore("pure-setting", {
  id: "pure-setting",
  state: (): setType => ({
    title: getConfig().Title,
    fixedHeader: getConfig().FixedHeader,
--- a/src/store/modules/user.ts
+++ b/src/store/modules/user.ts
@@ -16,8 +16,7 @@ import {
 import { useMultiTagsStoreHook } from "./multiTags";
 import { type DataInfo, setToken, removeToken, userKey } from "@/utils/auth";
-export const useUserStore = defineStore({
+export const useUserStore = defineStore("pure-user", {
  id: "pure-user",
  state: (): userType => ({
    // 头像
    avatar: storageLocal().getItem<DataInfo<number>>(userKey)?.avatar ?? "",
--- a/src/style/dark.scss
+++ b/src/style/dark.scss
@@ -1,3 +1,4 @@
@use "sass:color";
@use "element-plus/theme-chalk/src/dark/css-vars.scss" as *;
 /* 整体暗色风格适配 */
--- a/src/style/element-plus.scss
+++ b/src/style/element-plus.scss
@@ -83,8 +83,8 @@
  .el-upload-list__item.is-ready &.el-icon--close {
    width: 24px;
    height: 24px;
    border-radius: 4px;
    outline: none;
    border-radius: 4px;
    transition:
      background-color 0.2s,
      color 0.2s;
@@ -117,8 +117,8 @@
  }
  & .el-message__closeBtn {
    border-radius: 4px;
    outline: none;
    border-radius: 4px;
    transition:
      background-color 0.2s,
      color 0.2s;
--- a/src/style/reset.scss
+++ b/src/style/reset.scss
@@ -1,12 +1,3 @@
 *,
 ::before,
 ::after {
  box-sizing: border-box;
  border-color: currentColor;
  border-style: solid;
  border-width: 0;
 }
 #app {
  width: 100%;
  height: 100%;
@@ -25,7 +16,8 @@ body {
  width: 100%;
  height: 100%;
  margin: 0;
-  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB",
+  font-family:
    "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB",
    "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
  line-height: inherit;
  -moz-osx-font-smoothing: grayscale;
@@ -57,8 +49,9 @@ code,
 kbd,
 samp,
 pre {
-  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
+  font-family:
-    "Liberation Mono", "Courier New", monospace;
+    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
    "Courier New", monospace;
  font-size: 1em;
 }
--- a/src/style/sidebar.scss
+++ b/src/style/sidebar.scss
@@ -1,7 +1,5 @@
 /* $sideBarWidth: vertical 模式下主体内容距离网页文档左侧的距离 */
@mixin merge-style($sideBarWidth) {
  $menuActiveText: #7a80b4;
  @media screen and (width >= 150px) and (width <= 420px) {
    .app-main-nofixed-header {
      overflow-y: hidden;
@@ -94,7 +92,7 @@
    height: 100%;
    overflow: visible;
    font-size: 0;
-    background: var(--pure-theme-menu-bg);
+    background: var(--pure-theme-menu-bg) !important;
    border-right: 1px solid var(--pure-border-color);
    /* 展开动画 */
@@ -193,8 +191,8 @@
    .el-menu-item.is-active.nest-menu::before {
      position: absolute;
      inset: 0 8px;
      margin: 4px 0;
      clear: both;
      margin: 4px 0;
      content: "";
      background: var(--el-color-primary) !important;
      border-radius: 3px;
@@ -214,13 +212,13 @@
      position: absolute;
      top: 0;
      left: 0;
      clear: both;
      width: 2px;
      height: 100%;
      clear: both;
      content: "";
      background-color: var(--pure-theme-menu-active-before);
      transition: all var(--pure-transition-duration) ease-in-out;
      transform: translateY(0);
      transition: all var(--pure-transition-duration) ease-in-out;
    }
    .el-menu--collapse .outer-most.el-sub-menu > .el-sub-menu__title::before {
@@ -242,8 +240,8 @@
    .is-active.submenu-title-noDropdown.outer-most::before {
      position: absolute;
      inset: 0 8px;
      margin: 4px 0;
      clear: both;
      margin: 4px 0;
      content: "";
      background: var(--el-color-primary) !important;
      border-radius: 3px;
@@ -415,7 +413,7 @@
    justify-content: space-around;
    width: 100%;
    height: 48px;
-    background: var(--pure-theme-menu-bg);
+    background: var(--pure-theme-menu-bg) !important;
    .horizontal-header-left {
      display: flex;
@@ -437,11 +435,11 @@
        height: 32px;
        margin: 2px 0 0 12px;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 18px;
        font-weight: 600;
        line-height: 32px;
        color: var(--pure-theme-sub-menu-active-text);
        text-overflow: ellipsis;
        white-space: nowrap;
      }
    }
@@ -533,7 +531,7 @@
    .el-sub-menu__title {
      height: 48px;
      line-height: 48px;
-      background: var(--pure-theme-menu-bg);
+      background: var(--pure-theme-menu-bg) !important;
      svg {
        position: static !important;
@@ -579,8 +577,8 @@
    &.hideSidebar {
      .sidebar-container {
        pointer-events: none;
        transition-duration: 0.3s;
        transform: translate3d(-$sideBarWidth, 0, 0);
        transition-duration: 0.3s;
      }
    }
  }
@@ -623,10 +621,10 @@ body[layout="vertical"] {
      .el-sub-menu {
        & > .el-sub-menu__title {
          & > span {
            visibility: visible;
            width: 100%;
            height: 100%;
            text-align: center;
            visibility: visible;
          }
        }
      }
@@ -717,10 +715,10 @@ body[layout="mix"] {
          padding: 0;
          & > span {
            visibility: visible;
            width: 100%;
            height: 100%;
            text-align: center;
            visibility: visible;
          }
        }
      }
--- a/src/style/tailwind.css
+++ b/src/style/tailwind.css
@@ -1,21 +1,46 @@
-@tailwind base;
+@layer theme, base, components, utilities;
-@tailwind components;
+@import "tailwindcss/theme.css" layer(theme);
-@tailwind utilities;
+@import "tailwindcss/utilities.css" layer(utilities);
-@layer components {
+@custom-variant dark (&:is(.dark *));
-  .flex-c {
+
@theme {
  --color-bg_color: var(--el-bg-color);
  --color-primary: var(--el-color-primary);
  --color-text_color_primary: var(--el-text-color-primary);
  --color-text_color_regular: var(--el-text-color-regular);
 }
 /*
  The default border color has changed to `currentColor` in Tailwind CSS v4,
  so we've added these compatibility styles to make sure everything still
  looks the same as it did with Tailwind CSS v3.
  If we ever want to remove these styles, we need to add an explicit border
  color utility to any element that depends on these defaults.
 */
@layer base {
  *,
  ::after,
  ::before,
  ::backdrop,
  ::file-selector-button {
    border-color: var(--color-gray-200, currentColor);
  }
 }
@utility flex-c {
  @apply flex justify-center items-center;
 }
-  .flex-ac {
+@utility flex-ac {
  @apply flex justify-around items-center;
 }
-  .flex-bc {
+@utility flex-bc {
  @apply flex justify-between items-center;
 }
-  .navbar-bg-hover {
+@utility navbar-bg-hover {
-    @apply dark:text-white dark:hover:!bg-[#242424];
+  @apply dark:text-white dark:hover:bg-[#242424]!;
  }
 }
--- a/src/utils/mitt.ts
+++ b/src/utils/mitt.ts
@@ -4,10 +4,11 @@ import mitt from "mitt";
 /** 全局公共事件需要在此处添加类型 */
 type Events = {
  openPanel: string;
-  tagViewsChange: string;
+  tagOnClick: string;
  tagViewsShowModel: string;
  logoChange: boolean;
  tagViewsChange: string;
  changLayoutRoute: string;
  tagViewsShowModel: string;
  imageInfo: {
    img: HTMLImageElement;
    height: number;
--- a/src/utils/print.ts
+++ b/src/utils/print.ts
@@ -9,6 +9,7 @@ const Print = function (dom, options?: object): PrintFunction {
  options = options || {};
  // @ts-expect-error
  if (!(this instanceof Print)) return new Print(dom, options);
  // @ts-expect-error
  this.conf = {
    styleStr: "",
    // Elements that need to dynamically get and set the height
@@ -18,19 +19,26 @@ const Print = function (dom, options?: object): PrintFunction {
    // Callback after printing
    printDoneCallBack: null
  };
  // @ts-expect-error
  for (const key in this.conf) {
    if (key && options.hasOwnProperty(key)) {
      // @ts-expect-error
      this.conf[key] = options[key];
    }
  }
  if (typeof dom === "string") {
    // @ts-expect-error
    this.dom = document.querySelector(dom);
  } else {
    // @ts-expect-error
    this.dom = this.isDOM(dom) ? dom : dom.$el;
  }
  // @ts-expect-error
  if (this.conf.setDomHeightArr && this.conf.setDomHeightArr.length) {
    // @ts-expect-error
    this.setDomHeight(this.conf.setDomHeightArr);
  }
  // @ts-expect-error
  this.init();
 };
--- a/src/views/able/directives.vue
+++ b/src/views/able/directives.vue
@@ -76,7 +76,7 @@ function onReset() {
          immediate: true,
          timeout: 1000
        }"
-        class="!w-[200px]"
+        class="w-[200px]!"
        clearable
        @clear="onInput"
      />
@@ -86,7 +86,7 @@ function onReset() {
      <el-input
        v-model="searchTwo"
        v-optimize="{ event: 'input', fn: onInputTwo, timeout: 400 }"
-        class="!w-[200px]"
+        class="w-[200px]!"
        clearable
      />
    </div>
@@ -100,7 +100,7 @@ function onReset() {
          timeout: 400,
          params: { name: '小明', sex: '男' }
        }"
-        class="!w-[200px]"
+        class="w-[200px]!"
        clearable
      />
    </div>
@@ -112,7 +112,7 @@ function onReset() {
      <el-input
        v-model="searchFour"
        v-optimize:throttle="{ event: 'input', fn: onInputFour, timeout: 1000 }"
-        class="!w-[200px]"
+        class="w-[200px]!"
        clearable
      />
    </div>
@@ -125,7 +125,7 @@ function onReset() {
          fn: onInputFive,
          params: { name: '小明', sex: '男' }
        }"
-        class="!w-[200px]"
+        class="w-[200px]!"
        clearable
      />
    </div>
@@ -134,7 +134,7 @@ function onReset() {
    <div class="mb-2">
      文本复制指令（双击输入框内容即可复制）
-      <el-input v-model="searchSix" v-copy="searchSix" class="!w-[200px]" />
+      <el-input v-model="searchSix" v-copy="searchSix" class="w-[200px]!" />
    </div>
    <div>
      文本复制指令（自定义触发事件，单击复制）
--- a/src/views/able/infinite-scroll.vue
+++ b/src/views/able/infinite-scroll.vue
@@ -51,7 +51,9 @@ const load = () => {
        代码位置 src/views/able/infinite-scroll.vue
      </el-link>
    </template>
-    <p class="mb-2">{{ isBottom ? "已加载全部页" : `加载到第 ${page} 页` }}</p>
+    <div class="mb-2">
      {{ isBottom ? "已加载全部页" : `加载到第 ${page} 页` }}
    </div>
    <el-table
      v-el-table-infinite-scroll="load"
      border
--- a/src/views/able/menu-tree.vue
+++ b/src/views/able/menu-tree.vue
@@ -7,7 +7,7 @@ import { useRenderIcon } from "@/components/ReIcon/src/hooks";
 import { extractPathList, deleteChildren } from "@/utils/tree";
 import { usePermissionStoreHook } from "@/store/modules/permission";
 import type { TreeNode } from "element-plus/es/components/tree-v2/src/types";
-import NodeTree from "@iconify-icons/ri/node-tree";
+import NodeTree from "~icons/ri/node-tree";
 defineOptions({
  name: "MenuTree"
--- a/src/views/able/pinyin.vue
+++ b/src/views/able/pinyin.vue
@@ -21,8 +21,8 @@ defineOptions({
      </div>
    </template>
    <p v-html="html('带 音 调')" />
-    <p class="mt-2" v-html="html('不 带 音 调', { toneType: 'none' })" />
+    <p class="mt-2!" v-html="html('不 带 音 调', { toneType: 'none' })" />
-    <p class="mt-2 custom" v-html="html('自 定 义 样 式')" />
+    <p class="mt-2! custom" v-html="html('自 定 义 样 式')" />
  </el-card>
 </template>
--- a/src/views/able/print/index.vue
+++ b/src/views/able/print/index.vue
@@ -83,7 +83,7 @@ const tableData: User[] = [
        <span class="font-medium">打印功能（报表、图表、图片）</span>
        <el-select
          v-model="value"
-          class="!w-[100px] mr-2"
+          class="w-[100px]! mr-2"
          placeholder="Select"
          size="small"
        >
--- a/src/views/able/sensitive.vue
+++ b/src/views/able/sensitive.vue
@@ -45,6 +45,6 @@ function onInput() {
      </el-tag>
    </div>
    <el-input v-model="modelValue" @input="onInput" />
-    <p class="mt-2">{{ modelValue }}</p>
+    <p class="mt-2!">{{ modelValue }}</p>
  </el-card>
 </template>
--- a/src/views/able/video-frame/index.vue
+++ b/src/views/able/video-frame/index.vue
@@ -170,7 +170,7 @@ onBeforeUnmount(() => {
  </el-card>
 </template>
-<style scoped lang="scss">
+<style lang="scss" scoped>
 ::v-deep(.el-upload-dragger) {
  display: flex;
  align-items: center;
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
xiaoxian521	ed2a24f1e3	Merge branch 'main' into refactor/tailwindcss	2025-04-08 15:12:56 +08:00
xiaoxian521	b86d038a18	style: 样式复查	2025-04-08 14:37:20 +08:00
xiaoxian521	92cfa9763b	fix: 修复组件-瀑布流无限滚动示例中失效的链接	2025-04-07 16:33:26 +08:00
xiaoxian521	881366c78b	chore: 更新`vue-flow`，相关兼容处理	2025-04-06 16:51:05 +08:00
xiaoxian521	f5cc6d2ff4	fix: 修复重构图标后的错误用法	2025-04-02 14:35:39 +08:00
xiaoxian521	e3564eab96	chore: update	2025-03-28 15:06:27 +08:00
xiaoxian521	0a46a04c67	Merge branch 'main' into refactor/tailwindcss	2025-03-28 11:45:36 +08:00
xiaoxian521	4db365038c	refactor: 删除已弃用的依赖包`eslint-define-config`，升级`eslint`至最新版本，相关兼容处理	2025-03-28 09:40:51 +08:00
xiaoxian521	b7d3dc1170	Merge branch 'main' into refactor/tailwindcss	2025-03-28 08:50:40 +08:00
xiaoming	a9ee9ebcf9	refactor: 重构图标模块，使用`@iconify/json`替换不再维护更新的`@iconify-icons/`依赖，优化使用体验，确保图标库可持续更新并支持`Tree-shaking` (#1202 ) refactor: 重构图标模块，使用`@iconify/json`替换不再维护更新的`@iconify-icons/`依赖，优化使用体验，确保图标库可持续更新并支持`Tree-shaking`	2025-03-25 09:18:20 +08:00
xiaoxian521	ab1c7f8bcc	refactor: 升级`tailwindcss`至`v4`版本，带来更快的构建速度、更简化的安装和配置、提供专属`vite`插件	2025-03-16 19:46:35 +08:00
xiaoxian521	b004c224c2	feat: 添加`Ai`聊天组件示例	2025-03-11 09:45:03 +08:00
xiaoxian521	399d3b2987	chore: 升级依赖，相关兼容处理	2025-02-14 11:25:38 +08:00
xiaoxian521	b87eb6fd0a	chore: 升级依赖	2025-01-15 12:10:39 +08:00
xiaoxian521	a0246e31df	feat: 添加`tagOnClick`标签切换全局公共事件	2025-01-09 16:20:31 +08:00
xiaoxian521	e1cd14a946	chore: 升级依赖，相关兼容处理(主要是`typescript`、`vue-tsc`升级最新版)	2025-01-09 15:55:45 +08:00
xiaoxian521	02380f69e1	chore: 优化`src/style/dark.scss`语法	2025-01-07 17:21:00 +08:00
可能	5208272456	chore: 优化登录传参 (#1197 )	2025-01-06 14:30:43 +08:00
xiaoming	551292078e	fix: 修复`aria-hidden`报错 (#1192 )	2025-01-04 02:19:38 +08:00
XiaoYue	79cd159154	chore: 使用`keydown`替换`keypress`，`keypress`事件已弃用 (#1195 )	2024-12-27 09:55:28 +08:00
xiaoming	6d26300181	feat: 添加代码编辑器示例 (#1194 )	2024-12-24 09:14:43 +08:00
xiaoming	0dd6665b2a	feat: 添加`Markdown`示例 (#1193 )	2024-12-23 13:57:37 +08:00
xiaoxian521	bbdd44a917	feat: 添加滑块示例	2024-12-19 17:29:45 +08:00
xiaoxian521	f8690a0b73	fix: 修复使用`this`语法时无法显示代码提示的问题并更新`pinia`相关语法	2024-12-15 23:29:37 +08:00
xiaoxian521	b843eda26f	style: update	2024-12-14 11:20:45 +08:00
		`@@ -1 +1 @@`
			`<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" aria-hidden="true" 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>`				`<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>`
		`@@ -1 +1 @@`
			<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" aria-hidden="true" class="globalization" viewBox="0 0 512 512"><path fill="currentColor" d="m478.33 433.6-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 362 368 281.65 401.17 362zm-66.99-19.08a22 22 0 0 0-4.89-30.7c-.2-.15-15-11.13-36.49-34.73 39.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.36-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.93.92 1.19 1.83 2.35 2.74 3.51-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.59 22.52 24.08 38 35.44 38.93 36.1a22 22 0 0 0 30.75-4.9z"/></svg>				<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" class="globalization" viewBox="0 0 512 512"><path fill="currentColor" d="m478.33 433.6-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 362 368 281.65 401.17 362zm-66.99-19.08a22 22 0 0 0-4.89-30.7c-.2-.15-15-11.13-36.49-34.73 39.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.36-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.93.92 1.19 1.83 2.35 2.74 3.51-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.59 22.52 24.08 38 35.44 38.93 36.1a22 22 0 0 0 30.75-4.9z"/></svg>
		`@@ -1 +1 @@`
			`<svg width="32" height="32" fill="currentColor" aria-hidden="true" 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>`				`<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>`