chore: update

feat: RePureTableBar与ReVxeTableBar组件实现全量文本国际化
fix: 迁移typescript-eslint已弃用的tseslint.config配置方式
2025-12-21 15:00:28 +08:00 · 2025-12-09 12:19:45 +08:00 · 2025-12-09 09:16:52 +08:00 · 2025-12-08 14:31:44 +08:00 · 2025-12-01 14:27:16 +08:00 · 2025-11-27 12:24:03 +08:00
36 changed files with 2001 additions and 2009 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -1,9 +1,10 @@
 node_modules
 .DS_Store
+dist
+dist-ssr
 *.local
 .eslintcache
 report.html
-dist
 vite.config.*.timestamp*

 yarn.lock
--- a/.husky/commit-msg
+++ b/.husky/commit-msg
@@ -0,0 +1,8 @@
+#!/bin/sh
+
+# shellcheck source=./_/husky.sh
+. "$(dirname "$0")/_/husky.sh"
+
+PATH="/usr/local/bin:$PATH"
+
+npx --no-install commitlint --edit "$1"
--- a/.husky/common.sh
+++ b/.husky/common.sh
@@ -0,0 +1,9 @@
+#!/bin/sh
+command_exists () {
+  command -v "$1" >/dev/null 2>&1
+}
+
+# Workaround for Windows 10, Git Bash and Pnpm
+if command_exists winpty && test -t 1; then
+  exec < /dev/tty
+fi
--- a/.husky/pre-commit
+++ b/.husky/pre-commit
@@ -0,0 +1,10 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+. "$(dirname "$0")/common.sh"
+
+[ -n "$CI" ] && exit 0
+
+PATH="/usr/local/bin:$PATH"
+
+# Perform lint check on files in the staging area through .lintstagedrc configuration
+pnpm exec lint-staged
--- a/CHANGELOG.zh_CN.md
+++ b/CHANGELOG.zh_CN.md
@@ -2,7 +2,7 @@

 ### 🎫 Feat

-  添加全屏`403`、`404`、`500`页面，全屏错误页面清晰且安全，提升用户体验
+- 添加全屏`403`、`404`、`500`页面，全屏错误页面清晰且安全，提升用户体验

 ### 🐞 Bug fixes

@@ -26,7 +26,7 @@

 ### 🐞 Bug fixes

- 修复`ReSegmented`分段控制器组件在浅色和深色整体风格切换时的闪烁问题
+- 修复`ReSegmented`分段控制器组件在浅色和深色主题模式切换时的闪烁问题
 - 修复`resetRouter`未清空全部路由数据问题
 - 修复标签页-关闭左侧标签页关闭异常问题

@@ -231,8 +231,8 @@

 - 修复`windwos`下点击注册页面会出现滚动条问题
 - 修复`windows`下页面切换，内容区会出现滚动条问题
- 修复`pure-table`带状态表格在深色整体风格下状态样式消失的问题
- 修复系统配置中开启灰色模式和深色整体风格，刷新页面整体风格异常
+- 修复`pure-table`带状态表格在深色主题模式下状态样式消失的问题
+- 修复系统配置中开启灰色模式和深色主题模式，刷新页面主题模式异常

 ### 🍏 Perf

@@ -285,7 +285,7 @@
 - 内嵌`iframe`页支持设置`keepAlive`，保持页面状态
 - 优化导航，弹出的菜单超出内容区自适应且可滚动
 - 添加文件上传示例
- 添加整体风格自适应操作系统浅色、深色、自动主题功能
+- 添加主题模式自适应操作系统浅色、深色、自动主题功能
 - 添加页脚
 - 支持多标签页打开已经登录的系统后无需再登录并添加内免登录功能（用户可选择免登录的天数）
 - 带来高级感的终端命令行
@@ -485,7 +485,7 @@
 - 修复菜单搜索功能弹框打开后搜索框未自动聚集的问题
 - 修复按 `ESC` 退出全屏后，工具栏按钮文案展示问题
 - 修复移动端通知栏 `tooltip` 点击穿透问题
- 修复当左侧菜单收起后，切换到 `horizontal` 导航模式时文字不展示的问题
+- 修复当左侧菜单收起后，切换到 `horizontal` 菜单布局时文字不展示的问题
 - 修复导航 `tab` 关闭其他标签页无法重置状态问题
 - 修复 `getHistoryMode` 函数中环境变量未初始化带来的页面热更新报错
 - 修复导航 `tab` 过多导致关闭左侧标签页无法正常显示
--- a/eslint.config.js
+++ b/eslint.config.js
@@ -72,8 +72,11 @@ export default defineConfig([
      ]
    }
  },
-  ...tseslint.config({
-    extends: [...tseslint.configs.recommended],
+  ...tseslint.configs.recommended.map(config => ({
+    ...config,
+    files: ["**/*.?([cm])ts", "**/*.?([cm])tsx"]
+  })),
+  {
    files: ["**/*.?([cm])ts", "**/*.?([cm])tsx"],
    rules: {
      "@typescript-eslint/no-redeclare": "error",
@@ -102,7 +105,7 @@ export default defineConfig([
        }
      ]
    }
-  }),
+  },
  {
    files: ["**/*.d.ts"],
    rules: {
--- a/index.html
+++ b/index.html
@@ -1,94 +1,84 @@
 <!doctype html>
 <html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
+    <meta name="renderer" content="webkit" />
+    <meta
+      name="viewport"
+      content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=0"
+    />
+    <title>vue-pure-admin</title>
+    <link rel="icon" href="/favicon.ico" />
+  </head>

-<head>
-  <meta charset="UTF-8" />
-  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
-  <meta name="renderer" content="webkit" />
-  <meta name="viewport"
-    content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=0" />
-  <title>vue-pure-admin</title>
-  <link rel="icon" href="/favicon.ico" />
-  <script>
-    var _hmt = _hmt || [];
-    (function () {
-      var hm = document.createElement("script")
-      hm.src = "https://hm.baidu.com/hm.js?d3824e75ef2bf6d851035f74ae1aec68"
-      var s = document.getElementsByTagName("script")[0]
-      s.parentNode.insertBefore(hm, s)
-    })();
-  </script>
-</head>
-
-<body>
-  <div id="app">
-    <style>
-      html,
-      body,
-      #app {
-        position: relative;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        width: 100%;
-        height: 100%;
-        overflow: hidden;
-      }
-
-      .loader,
-      .loader::before,
-      .loader::after {
-        width: 2.5em;
-        height: 2.5em;
-        border-radius: 50%;
-        animation: load-animation 1.8s infinite ease-in-out;
-        animation-fill-mode: both;
-      }
-
-      .loader {
-        position: relative;
-        top: 0;
-        margin: 80px auto;
-        font-size: 10px;
-        color: #406eeb;
-        text-indent: -9999em;
-        transform: translateZ(0);
-        transform: translate(-50%, 0);
-        animation-delay: -0.16s;
-      }
-
-      .loader::before,
-      .loader::after {
-        position: absolute;
-        top: 0;
-        content: "";
-      }
-
-      .loader::before {
-        left: -3.5em;
-        animation-delay: -0.32s;
-      }
-
-      .loader::after {
-        left: 3.5em;
-      }
-
-      @keyframes load-animation {
-
-        0%,
-        80%,
-        100% {
-          box-shadow: 0 2.5em 0 -1.3em;
+  <body>
+    <div id="app">
+      <style>
+        html,
+        body,
+        #app {
+          position: relative;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          width: 100%;
+          height: 100%;
+          overflow: hidden;
        }

-        40% {
-          box-shadow: 0 2.5em 0 0;
+        .loader,
+        .loader::before,
+        .loader::after {
+          width: 2.5em;
+          height: 2.5em;
+          border-radius: 50%;
+          animation: load-animation 1.8s infinite ease-in-out;
+          animation-fill-mode: both;
        }
-      }
-    </style>
-    <div class="loader"></div>
-  </div>
-  <script type="module" src="/src/main.ts"></script>
-</body>

-</html>
+        .loader {
+          position: relative;
+          top: 0;
+          margin: 80px auto;
+          font-size: 10px;
+          color: #406eeb;
+          text-indent: -9999em;
+          transform: translateZ(0);
+          transform: translate(-50%, 0);
+          animation-delay: -0.16s;
+        }
+
+        .loader::before,
+        .loader::after {
+          position: absolute;
+          top: 0;
+          content: "";
+        }
+
+        .loader::before {
+          left: -3.5em;
+          animation-delay: -0.32s;
+        }
+
+        .loader::after {
+          left: 3.5em;
+        }
+
+        @keyframes load-animation {
+          0%,
+          80%,
+          100% {
+            box-shadow: 0 2.5em 0 -1.3em;
+          }
+
+          40% {
+            box-shadow: 0 2.5em 0 0;
+          }
+        }
+      </style>
+      <div class="loader"></div>
+    </div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>
--- a/locales/en.yaml
+++ b/locales/en.yaml
@@ -31,15 +31,15 @@ panel:
  pureCloseSystemSet: Close System Configs
  pureClearCacheAndToLogin: Clear cache and return to login page
  pureClearCache: Clear Cache
-  pureOverallStyle: Overall Style
-  pureOverallStyleLight: Light
-  pureOverallStyleLightTip: Set sail freshly and light up the comfortable work interface
-  pureOverallStyleDark: Dark
-  pureOverallStyleDarkTip: Moonlight Overture, indulge in the tranquility and elegance of the night
-  pureOverallStyleSystem: Auto
-  pureOverallStyleSystemTip: Synchronize time, the interface naturally responds to morning and dusk
+  pureThemeMode: Theme Mode
+  pureThemeModeLight: Light
+  pureThemeModeLightTip: Set sail freshly and light up the comfortable work interface
+  pureThemeModeDark: Dark
+  pureThemeModeDarkTip: Moonlight Overture, indulge in the tranquility and elegance of the night
+  pureThemeModeSystem: Auto
+  pureThemeModeSystemTip: Synchronize time, the interface naturally responds to morning and dusk
  pureThemeColor: Theme Color
-  pureLayoutModel: Layout Model
+  pureMenuLayout: Menu Layout
  pureVerticalTip: The menu on the left is familiar and friendly
  pureHorizontalTip: Top menu, concise overview
  pureMixTip: Mixed menu, flexible
@@ -108,6 +108,7 @@ menus:
  pureTypeit: Typeit
  pureJsonEditor: JSON Editor
  pureColorPicker: Color Picker
+  pureColorPickerPanel: Color PickerPanel
  pureDatePicker: Date Picker
  pureDateTimePicker: DateTimePicker
  pureTimePicker: TimePicker
@@ -237,4 +238,18 @@ login:
  purePassWordRuleReg: The password format should be any combination of 8-18 digits
  purePassWordSureReg: Please enter confirm password
  purePassWordDifferentReg: The two passwords do not match!
-  purePassWordUpdateReg: Password has been updated
+  purePassWordUpdateReg: Password has been updated
+tableBar:
+  pureList: List
+  pureLarge: Large
+  pureDefault: Default
+  pureSmall: Small
+  pureColumnSettings: ColumnSettings
+  pureCollapse: Collapse
+  pureExpand: Expand
+  pureRefresh: Refresh
+  pureDensity: Density
+  pureColumnDisplay: ColumnDisplay
+  pureReset: Reset
+  pureExitFullScreen: ExitFullScreen
+  pureFullScreen: FullScreen
--- a/locales/zh-CN.yaml
+++ b/locales/zh-CN.yaml
@@ -31,15 +31,15 @@ panel:
  pureCloseSystemSet: 关闭配置
  pureClearCacheAndToLogin: 清空缓存并返回登录页
  pureClearCache: 清空缓存
-  pureOverallStyle: 整体风格
-  pureOverallStyleLight: 浅色
-  pureOverallStyleLightTip: 清新启航，点亮舒适的工作界面
-  pureOverallStyleDark: 深色
-  pureOverallStyleDarkTip: 月光序曲，沉醉于夜的静谧雅致
-  pureOverallStyleSystem: 自动
-  pureOverallStyleSystemTip: 同步时光，界面随晨昏自然呼应
+  pureThemeMode: 主题模式
+  pureThemeModeLight: 浅色
+  pureThemeModeLightTip: 清新启航，点亮舒适的工作界面
+  pureThemeModeDark: 深色
+  pureThemeModeDarkTip: 月光序曲，沉醉于夜的静谧雅致
+  pureThemeModeSystem: 自动
+  pureThemeModeSystemTip: 同步时光，界面随晨昏自然呼应
  pureThemeColor: 主题色
-  pureLayoutModel: 导航模式
+  pureMenuLayout: 菜单布局
  pureVerticalTip: 左侧菜单，亲切熟悉
  pureHorizontalTip: 顶部菜单，简洁概览
  pureMixTip: 混合菜单，灵活多变
@@ -108,6 +108,7 @@ menus:
  pureTypeit: 打字机
  pureJsonEditor: JSON编辑器
  pureColorPicker: 颜色选择器
+  pureColorPickerPanel: 颜色选择器面板
  pureDatePicker: 日期选择器
  pureDateTimePicker: 日期时间选择器
  pureTimePicker: 时间选择器
@@ -237,4 +238,18 @@ login:
  purePassWordRuleReg: 密码格式应为8-18位数字、字母、符号的任意两种组合
  purePassWordSureReg: 请输入确认密码
  purePassWordDifferentReg: 两次密码不一致!
-  purePassWordUpdateReg: 修改密码成功
+  purePassWordUpdateReg: 修改密码成功
+tableBar:
+  pureList: 列表
+  pureLarge: 宽松
+  pureDefault: 默认
+  pureSmall: 紧凑
+  pureColumnSettings: 列设置
+  pureCollapse: 折叠
+  pureExpand: 展开
+  pureRefresh: 刷新
+  pureDensity: 密度
+  pureColumnDisplay: 列展示
+  pureReset: 重置
+  pureExitFullScreen: 退出全屏
+  pureFullScreen: 全屏
--- a/package.json
+++ b/package.json
@@ -54,25 +54,25 @@
    "@logicflow/extension": "^1.2.28",
    "@pureadmin/descriptions": "^1.2.1",
    "@pureadmin/table": "^3.3.0",
-    "@pureadmin/utils": "^2.6.2",
+    "@pureadmin/utils": "^2.6.3",
    "@vue-flow/background": "^1.3.2",
-    "@vue-flow/core": "^1.47.0",
-    "@vueuse/core": "^13.9.0",
+    "@vue-flow/core": "^1.48.0",
+    "@vueuse/core": "^14.1.0",
    "@vueuse/motion": "^3.0.3",
    "@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.12.2",
+    "axios": "^1.13.2",
    "china-area-data": "^5.0.1",
    "codemirror": "^5.65.20",
    "codemirror-editor-vue3": "^2.8.0",
    "cropperjs": "^1.6.2",
-    "dayjs": "^1.11.18",
-    "deep-chat": "^2.2.2",
+    "dayjs": "^1.11.19",
+    "deep-chat": "^2.3.0",
    "echarts": "^6.0.0",
-    "el-table-infinite-scroll": "^3.0.7",
-    "element-plus": "^2.11.7",
+    "el-table-infinite-scroll": "^3.0.8",
+    "element-plus": "^2.11.9",
    "highlight.js": "^11.11.1",
    "intro.js": "^7.2.0",
    "js-cookie": "^3.0.5",
@@ -83,24 +83,24 @@
    "mqtt": "4.3.7",
    "nprogress": "^0.2.0",
    "path-browserify": "^1.0.1",
-    "pinia": "^3.0.3",
+    "pinia": "^3.0.4",
    "pinyin-pro": "^3.27.0",
-    "plus-pro-components": "^0.1.29",
+    "plus-pro-components": "^0.1.30",
    "qrcode": "^1.5.4",
    "qs": "^6.14.0",
    "responsive-storage": "^2.2.0",
    "sortablejs": "^1.15.6",
-    "swiper": "^12.0.2",
+    "swiper": "^12.0.3",
    "typeit": "^8.8.7",
    "v-contextmenu": "^3.2.0",
    "v3-infinite-loading": "^1.3.2",
    "vditor": "^3.11.2",
    "version-rocket": "^1.7.4",
-    "vue": "^3.5.22",
-    "vue-i18n": "^11.1.12",
-    "vue-json-pretty": "^2.5.0",
+    "vue": "^3.5.25",
+    "vue-i18n": "^11.2.2",
+    "vue-json-pretty": "^2.6.0",
    "vue-pdf-embed": "^2.1.3",
-    "vue-router": "^4.5.1",
+    "vue-router": "^4.6.3",
    "vue-tippy": "^6.7.1",
    "vue-types": "^6.0.0",
    "vue-virtual-scroller": "2.0.0-beta.8",
@@ -109,7 +109,7 @@
    "vue3-puzzle-vcode": "^1.1.7",
    "vuedraggable": "^4.1.0",
    "vxe-table": "4.6.25",
-    "wavesurfer.js": "^7.11.0",
+    "wavesurfer.js": "^7.11.1",
    "xgplayer": "^3.0.23",
    "xlsx": "^0.18.5"
  },
@@ -117,62 +117,62 @@
    "@commitlint/cli": "^20.1.0",
    "@commitlint/config-conventional": "^20.0.0",
    "@commitlint/types": "^20.0.0",
-    "@eslint/js": "^9.37.0",
-    "@faker-js/faker": "^10.0.0",
-    "@iconify/json": "^2.2.393",
+    "@eslint/js": "^9.39.1",
+    "@faker-js/faker": "^10.1.0",
+    "@iconify/json": "^2.2.412",
    "@iconify/vue": "4.2.0",
    "@intlify/unplugin-vue-i18n": "^11.0.1",
-    "@tailwindcss/vite": "^4.1.14",
-    "@types/codemirror": "^5.60.16",
+    "@tailwindcss/vite": "^4.1.17",
+    "@types/codemirror": "^5.60.17",
    "@types/dagre": "^0.7.53",
    "@types/intro.js": "^5.1.5",
    "@types/js-cookie": "^3.0.6",
-    "@types/node": "^20.19.19",
+    "@types/node": "^20.19.25",
    "@types/nprogress": "^0.2.3",
    "@types/path-browserify": "^1.0.3",
-    "@types/qrcode": "^1.5.5",
+    "@types/qrcode": "^1.5.6",
    "@types/qs": "^6.14.0",
-    "@types/sortablejs": "^1.15.8",
-    "@vitejs/plugin-vue": "^6.0.1",
-    "@vitejs/plugin-vue-jsx": "^5.1.1",
+    "@types/sortablejs": "^1.15.9",
+    "@vitejs/plugin-vue": "^6.0.2",
+    "@vitejs/plugin-vue-jsx": "^5.1.2",
    "boxen": "^8.0.1",
-    "code-inspector-plugin": "^1.2.10",
-    "cssnano": "^7.1.1",
+    "code-inspector-plugin": "^1.3.0",
+    "cssnano": "^7.1.2",
    "dagre": "^0.8.5",
-    "eslint": "^9.37.0",
+    "eslint": "^9.39.1",
    "eslint-config-prettier": "^10.1.8",
    "eslint-plugin-prettier": "^5.5.4",
-    "eslint-plugin-vue": "^10.5.0",
+    "eslint-plugin-vue": "^10.6.2",
    "gradient-string": "^3.0.0",
    "husky": "^9.1.7",
-    "lint-staged": "^16.2.3",
+    "lint-staged": "^16.2.7",
    "postcss": "^8.5.6",
    "postcss-html": "^1.8.0",
    "postcss-load-config": "^6.0.1",
    "postcss-scss": "^4.0.9",
-    "prettier": "^3.6.2",
-    "rimraf": "^6.0.1",
-    "rollup-plugin-visualizer": "^6.0.4",
-    "sass": "^1.93.2",
-    "stylelint": "^16.25.0",
-    "stylelint-config-recess-order": "^7.3.0",
+    "prettier": "^3.7.3",
+    "rimraf": "^6.1.2",
+    "rollup-plugin-visualizer": "^6.0.5",
+    "sass": "^1.94.2",
+    "stylelint": "^16.26.1",
+    "stylelint-config-recess-order": "^7.4.0",
    "stylelint-config-recommended-vue": "^1.6.1",
    "stylelint-config-standard-scss": "^14.0.0",
    "stylelint-prettier": "^5.0.3",
    "svgo": "^4.0.0",
-    "tailwindcss": "^4.1.14",
+    "tailwindcss": "^4.1.17",
    "typescript": "^5.9.3",
-    "typescript-eslint": "^8.46.0",
-    "unplugin-icons": "^22.4.2",
-    "vite": "^7.1.9",
+    "typescript-eslint": "^8.48.0",
+    "unplugin-icons": "^22.5.0",
+    "vite": "^7.2.4",
    "vite-plugin-cdn-import": "^1.0.1",
    "vite-plugin-compression": "^0.5.1",
-    "vite-plugin-fake-server": "^2.2.0",
+    "vite-plugin-fake-server": "^2.2.2",
    "vite-plugin-remove-console": "^2.2.0",
    "vite-plugin-router-warn": "^1.0.0",
    "vite-svg-loader": "^5.1.0",
    "vue-eslint-parser": "^10.2.0",
-    "vue-tsc": "^3.1.1"
+    "vue-tsc": "^3.1.5"
  },
  "engines": {
    "node": "^20.19.0 || >=22.13.0",
@@ -206,4 +206,4 @@
      "vue3-danmaku"
    ]
  }
-}
+}
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/public/platform-config.json
+++ b/public/platform-config.json
@@ -9,7 +9,7 @@
  "Layout": "vertical",
  "Theme": "light",
  "DarkMode": false,
-  "OverallStyle": "light",
+  "ThemeMode": "light",
  "Grey": false,
  "Weak": false,
  "HideTabs": false,
--- a/src/App.vue
+++ b/src/App.vue
@@ -16,7 +16,6 @@ import en from "element-plus/es/locale/lang/en";
 import zhCn from "element-plus/es/locale/lang/zh-cn";
 import plusEn from "plus-pro-components/es/locale/lang/en";
 import plusZhCn from "plus-pro-components/es/locale/lang/zh-cn";
-import { ElNotification } from "element-plus";

 export default defineComponent({
  name: "app",
@@ -55,31 +54,5 @@ export default defineComponent({
      );
    }
  }
-  // mounted() {
-  //   ElNotification({
-  //     title: "平台最新活动与动态",
-  //     duration: 0,
-  //     customClass: "fullpage-notification",
-  //     // @ts-expect-error
-  //     style: { width: "260px" },
-  //     position: "bottom-right",
-  //     dangerouslyUseHTMLString: true,
-  //     message: `
-  //       <a target='_blank' class='block text-base text-center border mt-4 rounded hover:text-[red]!' href='https://pure-admin.cn/pages/service/#%E6%9C%80%E6%96%B0%E6%B4%BB%E5%8A%A8%E4%B8%8E%E5%8A%A8%E6%80%81'>
-  //       点我查看
-  //       </a>
-  //     `
-  //   });
-  // }
 });
 </script>
-
-<style>
-.fullpage-notification > .el-notification__group > .el-notification__closeBtn {
-  top: 15px;
-}
-.fullpage-notification > div > h2 {
-  color: red;
-  font-size: 18px;
-}
-</style>
--- a/src/components/RePureTableBar/src/bar.tsx
+++ b/src/components/RePureTableBar/src/bar.tsx
@@ -1,5 +1,5 @@
 import Sortable from "sortablejs";
-import { transformI18n } from "@/plugins/i18n";
+import { $t, transformI18n } from "@/plugins/i18n";
 import { useEpThemeStoreHook } from "@/store/modules/epTheme";
 import {
  type PropType,
@@ -30,7 +30,7 @@ const props = {
  /** 头部最左边的标题 */
  title: {
    type: String,
-    default: "列表"
+    default: $t("tableBar.pureList")
  },
  /** 对于树形表格，如果想启用展开和折叠功能，传入当前表格的ref即可 */
  tableRef: {
@@ -169,19 +169,19 @@ export default defineComponent({
            style={getDropdownItemStyle.value("large")}
            onClick={() => (size.value = "large")}
          >
-            宽松
+            {transformI18n($t("tableBar.pureLarge"))}
          </el-dropdown-item>
          <el-dropdown-item
            style={getDropdownItemStyle.value("default")}
            onClick={() => (size.value = "default")}
          >
-            默认
+            {transformI18n($t("tableBar.pureDefault"))}
          </el-dropdown-item>
          <el-dropdown-item
            style={getDropdownItemStyle.value("small")}
            onClick={() => (size.value = "small")}
          >
-            紧凑
+            {transformI18n($t("tableBar.pureSmall"))}
          </el-dropdown-item>
        </el-dropdown-menu>
      )
@@ -245,7 +245,9 @@ export default defineComponent({
      reference: () => (
        <SettingIcon
          class={["w-[16px]", iconClass.value]}
-          v-tippy={rendTippyProps("列设置")}
+          v-tippy={rendTippyProps(
+            transformI18n($t("tableBar.pureColumnSettings"))
+          )}
        />
      )
    };
@@ -268,7 +270,7 @@ export default defineComponent({
            {slots?.title ? (
              slots.title()
            ) : (
-              <p class="font-bold truncate">{props.title}</p>
+              <p class="font-bold truncate">{transformI18n(props.title)}</p>
            )}
            <div class="flex items-center justify-around">
              {slots?.buttons ? (
@@ -282,7 +284,9 @@ export default defineComponent({
                      transform: isExpandAll.value ? "none" : "rotate(-90deg)"
                    }}
                    v-tippy={rendTippyProps(
-                      isExpandAll.value ? "折叠" : "展开"
+                      isExpandAll.value
+                        ? transformI18n($t("tableBar.pureCollapse"))
+                        : transformI18n($t("tableBar.pureExpand"))
                    )}
                    onClick={() => onExpand()}
                  />
@@ -295,14 +299,18 @@ export default defineComponent({
                  iconClass.value,
                  loading.value ? "animate-spin" : ""
                ]}
-                v-tippy={rendTippyProps("刷新")}
+                v-tippy={rendTippyProps(
+                  transformI18n($t("tableBar.pureRefresh"))
+                )}
                onClick={() => onReFresh()}
              />
              <el-divider direction="vertical" />
              <el-dropdown
                v-slots={dropdown}
                trigger="click"
-                v-tippy={rendTippyProps("密度")}
+                v-tippy={rendTippyProps(
+                  transformI18n($t("tableBar.pureDensity"))
+                )}
              >
                <CollapseIcon class={["w-[16px]", iconClass.value]} />
              </el-dropdown>
@@ -318,13 +326,13 @@ export default defineComponent({
                <div class={[topClass.value]}>
                  <el-checkbox
                    class="-mr-1!"
-                    label="列展示"
+                    label={transformI18n($t("tableBar.pureColumnDisplay"))}
                    v-model={checkAll.value}
                    indeterminate={isIndeterminate.value}
                    onChange={value => handleCheckAllChange(value)}
                  />
                  <el-button type="primary" link onClick={() => onReset()}>
-                    重置
+                    {transformI18n($t("tableBar.pureReset"))}
                  </el-button>
                </div>

@@ -382,7 +390,11 @@ export default defineComponent({
              <iconifyIconOffline
                class={["w-[16px]", iconClass.value]}
                icon={isFullscreen.value ? ExitFullscreen : Fullscreen}
-                v-tippy={isFullscreen.value ? "退出全屏" : "全屏"}
+                v-tippy={
+                  isFullscreen.value
+                    ? transformI18n($t("tableBar.pureExitFullScreen"))
+                    : transformI18n($t("tableBar.pureFullScreen"))
+                }
                onClick={() => onFullscreen()}
              />
            </div>
--- a/src/directives/ripple/index.ts
+++ b/src/directives/ripple/index.ts
@@ -10,8 +10,10 @@ export interface RippleOptions {
  circle?: boolean;
 }

-export interface RippleDirectiveBinding
-  extends Omit<DirectiveBinding, "modifiers" | "value"> {
+export interface RippleDirectiveBinding extends Omit<
+  DirectiveBinding,
+  "modifiers" | "value"
+> {
  value?: boolean | { class: string };
  modifiers: {
    center?: boolean;
--- a/src/layout/components/lay-footer/index.vue
+++ b/src/layout/components/lay-footer/index.vue
@@ -8,7 +8,7 @@ const TITLE = getConfig("Title");
  <footer
    class="layout-footer text-[rgba(0,0,0,0.6)] dark:text-[rgba(220,220,242,0.8)]"
  >
-    Copyright © 2020-2025
+    Copyright © 2020-present
    <a
      class="hover:text-primary!"
      href="https://github.com/pure-admin"
@@ -16,23 +16,12 @@ const TITLE = getConfig("Title");
    >
      &nbsp;{{ TITLE }}
    </a>
-    <!-- <div class="ml-8">
-      <span>赞助商：</span>
-      <a
-        class="hover:text-primary"
-        href="https://ai-tools.cn/resume/start"
-        target="_blank"
-      >
-        二猫 AI 简历
-      </a>
-    </div> -->
  </footer>
 </template>

 <style lang="scss" scoped>
 .layout-footer {
  display: flex;
-  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  width: 100%;
--- a/src/layout/components/lay-setting/index.vue
+++ b/src/layout/components/lay-setting/index.vue
@@ -37,7 +37,7 @@ const horizontalRef = ref();

 const {
  dataTheme,
-  overallStyle,
+  themeMode,
  layoutTheme,
  themeColors,
  toggleClass,
@@ -50,7 +50,7 @@ if (unref(layoutTheme)) {
  const layout = unref(layoutTheme).layout;
  const theme = unref(layoutTheme).theme;
  document.documentElement.setAttribute("data-theme", theme);
-  setLayoutModel(layout);
+  setMenuLayout(layout);
 }

 /** 默认灵动模式 */
@@ -195,24 +195,24 @@ const pClass = computed(() => {
 const themeOptions = computed<Array<OptionsType>>(() => {
  return [
    {
-      label: t("panel.pureOverallStyleLight"),
+      label: t("panel.pureThemeModeLight"),
      icon: DayIcon,
      theme: "light",
-      tip: t("panel.pureOverallStyleLightTip"),
+      tip: t("panel.pureThemeModeLightTip"),
      iconAttrs: { fill: isDark.value ? "#fff" : "#000" }
    },
    {
-      label: t("panel.pureOverallStyleDark"),
+      label: t("panel.pureThemeModeDark"),
      icon: DarkIcon,
      theme: "dark",
-      tip: t("panel.pureOverallStyleDarkTip"),
+      tip: t("panel.pureThemeModeDarkTip"),
      iconAttrs: { fill: isDark.value ? "#fff" : "#000" }
    },
    {
-      label: t("panel.pureOverallStyleSystem"),
+      label: t("panel.pureThemeModeSystem"),
      icon: SystemIcon,
      theme: "system",
-      tip: t("panel.pureOverallStyleSystemTip"),
+      tip: t("panel.pureThemeModeSystemTip"),
      iconAttrs: { fill: isDark.value ? "#fff" : "#000" }
    }
  ];
@@ -238,8 +238,8 @@ const markOptions = computed<Array<OptionsType>>(() => {
  ];
 });

-/** 设置导航模式 */
-function setLayoutModel(layout: string) {
+/** 设置菜单布局 */
+function setMenuLayout(layout: string) {
  layoutTheme.value.layout = layout;
  window.document.body.setAttribute("layout", layout);
  $storage.layout = {
@@ -249,7 +249,7 @@ function setLayoutModel(layout: string) {
    sidebarStatus: $storage.layout?.sidebarStatus,
    epThemeColor: $storage.layout?.epThemeColor,
    themeColor: $storage.layout?.themeColor,
-    overallStyle: $storage.layout?.overallStyle
+    themeMode: $storage.layout?.themeMode
  };
  useAppStoreHook().setLayout(layout);
 }
@@ -276,15 +276,15 @@ watch($storage, ({ layout }) => {

 const mediaQueryList = window.matchMedia("(prefers-color-scheme: dark)");

-/** 根据操作系统主题设置平台整体风格 */
+/** 根据操作系统主题设置平台主题模式 */
 function updateTheme() {
-  if (overallStyle.value !== "system") return;
+  if (themeMode.value !== "system") return;
  if (mediaQueryList.matches) {
    dataTheme.value = true;
  } else {
    dataTheme.value = false;
  }
-  dataThemeChange(overallStyle.value);
+  dataThemeChange(themeMode.value);
 }

 function removeMatchMedia() {
@@ -317,18 +317,18 @@ onUnmounted(() => removeMatchMedia);
 <template>
  <LayPanel>
    <div class="p-5">
-      <p :class="pClass">{{ t("panel.pureOverallStyle") }}</p>
+      <p :class="pClass">{{ t("panel.pureThemeMode") }}</p>
      <Segmented
        resize
        class="select-none"
-        :modelValue="overallStyle === 'system' ? 2 : dataTheme ? 1 : 0"
+        :modelValue="themeMode === 'system' ? 2 : dataTheme ? 1 : 0"
        :options="themeOptions"
        @change="
          theme => {
            theme.index === 1 && theme.index !== 2
              ? (dataTheme = true)
              : (dataTheme = false);
-            overallStyle = theme.option.theme;
+            themeMode = theme.option.theme;
            dataThemeChange(theme.option.theme);
            theme.index === 2 && watchSystemThemeChange();
          }
@@ -354,7 +354,7 @@ onUnmounted(() => removeMatchMedia);
        </li>
      </ul>

-      <p :class="['mt-5!', pClass]">{{ t("panel.pureLayoutModel") }}</p>
+      <p :class="['mt-5!', pClass]">{{ t("panel.pureMenuLayout") }}</p>
      <ul class="pure-theme">
        <li
          ref="verticalRef"
@@ -363,7 +363,7 @@ onUnmounted(() => removeMatchMedia);
            zIndex: 41000
          }"
          :class="layoutTheme.layout === 'vertical' ? 'is-select' : ''"
-          @click="setLayoutModel('vertical')"
+          @click="setMenuLayout('vertical')"
        >
          <div />
          <div />
@@ -376,7 +376,7 @@ onUnmounted(() => removeMatchMedia);
            zIndex: 41000
          }"
          :class="layoutTheme.layout === 'horizontal' ? 'is-select' : ''"
-          @click="setLayoutModel('horizontal')"
+          @click="setMenuLayout('horizontal')"
        >
          <div />
          <div />
@@ -389,7 +389,7 @@ onUnmounted(() => removeMatchMedia);
            zIndex: 41000
          }"
          :class="layoutTheme.layout === 'mix' ? 'is-select' : ''"
-          @click="setLayoutModel('mix')"
+          @click="setMenuLayout('mix')"
        >
          <div />
          <div />
--- a/src/layout/components/lay-tag/index.scss
+++ b/src/layout/components/lay-tag/index.scss
@@ -321,10 +321,9 @@

  .chrome-tab-divider {
    position: absolute;
-    right: 7px;
+    left: 7px;
    width: 1px;
    height: 14px;
-    background-color: #2b2d2f;
  }

  &:hover {
--- a/src/layout/components/lay-tag/index.vue
+++ b/src/layout/components/lay-tag/index.vue
@@ -618,6 +618,10 @@ onBeforeUnmount(() => {
            />
          </template>
          <div v-else class="chrome-tab">
+            <span
+              v-if="index !== 0 && index !== activeIndex"
+              class="chrome-tab-divider bg-[#e2e2e2] dark:bg-[#2d2d2d]"
+            />
            <div class="chrome-tab__bg">
              <TagChrome />
            </div>
@@ -631,7 +635,6 @@ onBeforeUnmount(() => {
            >
              <IconifyIconOffline :icon="Close" />
            </span>
-            <span class="chrome-tab-divider" />
          </div>
        </div>
      </div>
--- a/src/layout/hooks/useDataThemeChange.ts
+++ b/src/layout/hooks/useDataThemeChange.ts
@@ -33,7 +33,7 @@ export function useDataThemeChange() {

  const { $storage } = useGlobal<GlobalPropertiesApi>();
  const dataTheme = ref<boolean>($storage?.layout?.darkMode);
-  const overallStyle = ref<string>($storage?.layout?.overallStyle);
+  const themeMode = ref<string>($storage?.layout?.themeMode);
  const body = document.documentElement as HTMLElement;

  function toggleClass(flag: boolean, clsName: string, target?: HTMLElement) {
@@ -59,7 +59,7 @@ export function useDataThemeChange() {
      sidebarStatus: $storage.layout?.sidebarStatus,
      epThemeColor: $storage.layout?.epThemeColor,
      themeColor: isClick ? theme : storageThemeColor,
-      overallStyle: overallStyle.value
+      themeMode: themeMode.value
    };

    if (theme === "default" || theme === "light") {
@@ -89,9 +89,9 @@ export function useDataThemeChange() {
    }
  };

-  /** 浅色、深色整体风格切换 */
-  function dataThemeChange(overall?: string) {
-    overallStyle.value = overall;
+  /** 浅色、深色主题模式切换 */
+  function dataThemeChange(mode?: string) {
+    themeMode.value = mode;
    if (useEpThemeStoreHook().epTheme === "light" && dataTheme.value) {
      setLayoutThemeColor("default", false);
    } else {
@@ -126,7 +126,7 @@ export function useDataThemeChange() {
  return {
    body,
    dataTheme,
-    overallStyle,
+    themeMode,
    layoutTheme,
    themeColors,
    onReset,
--- a/src/layout/hooks/useLayout.ts
+++ b/src/layout/hooks/useLayout.ts
@@ -29,7 +29,7 @@ export function useLayout() {
        sidebarStatus: $config?.SidebarStatus ?? true,
        epThemeColor: $config?.EpThemeColor ?? "#409EFF",
        themeColor: $config?.Theme ?? "light",
-        overallStyle: $config?.OverallStyle ?? "light"
+        themeMode: $config?.ThemeMode ?? "light"
      };
    }
    /** 灰色模式、色弱模式、隐藏标签页 */
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -67,16 +67,16 @@ const set: setType = reactive({
  })
 });

-function setTheme(layoutModel: string) {
-  window.document.body.setAttribute("layout", layoutModel);
+function setTheme(menuLayout: string) {
+  window.document.body.setAttribute("layout", menuLayout);
  $storage.layout = {
-    layout: `${layoutModel}`,
+    layout: `${menuLayout}`,
    theme: $storage.layout?.theme,
    darkMode: $storage.layout?.darkMode,
    sidebarStatus: $storage.layout?.sidebarStatus,
    epThemeColor: $storage.layout?.epThemeColor,
    themeColor: $storage.layout?.themeColor,
-    overallStyle: $storage.layout?.overallStyle
+    themeMode: $storage.layout?.themeMode
  };
 }

@@ -123,7 +123,7 @@ onMounted(() => {
 });

 onBeforeMount(() => {
-  useDataThemeChange().dataThemeChange($storage.layout?.overallStyle);
+  useDataThemeChange().dataThemeChange($storage.layout?.themeMode);
 });

 const LayHeader = defineComponent({
--- a/src/plugins/elementPlus.ts
+++ b/src/plugins/elementPlus.ts
@@ -3,15 +3,13 @@ import type { App, Component } from "vue";
 import {
  /**
   * 为了方便演示平台将 element-plus 导出的所有组件引入，实际使用中如果你没用到哪个组件，将其注释掉就行
-   * 导出来源：https://github.com/element-plus/element-plus/blob/dev/packages/element-plus/component.ts#L111-L211
+   * 导出来源：https://github.com/element-plus/element-plus/blob/dev/packages/element-plus/component.ts#L116-L226
   * */
  ElAffix,
  ElAlert,
  ElAutocomplete,
  ElAutoResizer,
  ElAvatar,
-  ElAnchor,
-  ElAnchorLink,
  ElBacktop,
  ElBadge,
  ElBreadcrumb,
@@ -32,6 +30,7 @@ import {
  ElCollapse,
  ElCollapseItem,
  ElCollapseTransition,
+  ElColorPickerPanel,
  ElColorPicker,
  ElConfigProvider,
  ElContainer,
@@ -40,6 +39,7 @@ import {
  ElHeader,
  ElMain,
  ElDatePicker,
+  ElDatePickerPanel,
  ElDescriptions,
  ElDescriptionsItem,
  ElDialog,
@@ -56,6 +56,7 @@ import {
  ElImageViewer,
  ElInput,
  ElInputNumber,
+  ElInputTag,
  ElLink,
  ElMenu,
  ElMenuItem,
@@ -107,17 +108,22 @@ import {
  ElWatermark,
  ElTour,
  ElTourStep,
+  ElAnchor,
+  ElAnchorLink,
  ElSegmented,
+  ElMention,
+  ElSplitter,
+  ElSplitterPanel,
  /**
   * 为了方便演示平台将 element-plus 导出的所有插件引入，实际使用中如果你没用到哪个插件，将其注释掉就行
   * 导出来源：https://github.com/element-plus/element-plus/blob/dev/packages/element-plus/plugin.ts#L11-L16
   * */
-  ElLoading, // v-loading 指令
  ElInfiniteScroll, // v-infinite-scroll 指令
-  ElPopoverDirective, // v-popover 指令
+  ElLoading, // v-loading 指令
  ElMessage, // $message 全局属性对象globalProperties
  ElMessageBox, // $msgbox、$alert、$confirm、$prompt 全局属性对象globalProperties
-  ElNotification // $notify 全局属性对象globalProperties
+  ElNotification, // $notify 全局属性对象globalProperties
+  ElPopoverDirective // v-popover 指令
 } from "element-plus";

 const components = [
@@ -126,8 +132,6 @@ const components = [
  ElAutocomplete,
  ElAutoResizer,
  ElAvatar,
-  ElAnchor,
-  ElAnchorLink,
  ElBacktop,
  ElBadge,
  ElBreadcrumb,
@@ -148,6 +152,7 @@ const components = [
  ElCollapse,
  ElCollapseItem,
  ElCollapseTransition,
+  ElColorPickerPanel,
  ElColorPicker,
  ElConfigProvider,
  ElContainer,
@@ -156,6 +161,7 @@ const components = [
  ElHeader,
  ElMain,
  ElDatePicker,
+  ElDatePickerPanel,
  ElDescriptions,
  ElDescriptionsItem,
  ElDialog,
@@ -172,6 +178,7 @@ const components = [
  ElImageViewer,
  ElInput,
  ElInputNumber,
+  ElInputTag,
  ElLink,
  ElMenu,
  ElMenuItem,
@@ -223,16 +230,21 @@ const components = [
  ElWatermark,
  ElTour,
  ElTourStep,
-  ElSegmented
+  ElAnchor,
+  ElAnchorLink,
+  ElSegmented,
+  ElMention,
+  ElSplitter,
+  ElSplitterPanel
 ];

 const plugins = [
-  ElLoading,
  ElInfiniteScroll,
-  ElPopoverDirective,
+  ElLoading,
  ElMessage,
  ElMessageBox,
-  ElNotification
+  ElNotification,
+  ElPopoverDirective
 ];

 /** 按需引入`element-plus` */
--- a/src/router/modules/components.ts
+++ b/src/router/modules/components.ts
@@ -119,8 +119,7 @@ export default {
      name: "PureSlider",
      component: () => import("@/views/components/slider/index.vue"),
      meta: {
-        title: $t("menus.pureSlider"),
-        extraIcon: "IF-pure-iconfont-new svg"
+        title: $t("menus.pureSlider")
      }
    },
    {
@@ -195,6 +194,15 @@ export default {
        title: $t("menus.pureColorPicker")
      }
    },
+    {
+      path: "/components/color-picker-panel",
+      name: "ColorPickerPanel",
+      component: () => import("@/views/components/color-picker-panel.vue"),
+      meta: {
+        title: $t("menus.pureColorPickerPanel"),
+        extraIcon: "IF-pure-iconfont-new svg"
+      }
+    },
    {
      path: "/components/selector",
      name: "Selector",
--- a/src/store/modules/app.ts
+++ b/src/store/modules/app.ts
@@ -18,7 +18,7 @@ export const useAppStore = defineStore("pure-app", {
      withoutAnimation: false,
      isClickCollapse: false
    },
-    // 这里的layout用于监听容器拖拉后恢复对应的导航模式
+    // 这里的layout用于监听容器拖拉后恢复对应的菜单布局
    layout:
      storageLocal().getItem<StorageConfigs>(
        `${responsiveStorageNameSpace()}layout`
--- a/src/store/modules/epTheme.ts
+++ b/src/store/modules/epTheme.ts
@@ -21,7 +21,7 @@ export const useEpThemeStore = defineStore("pure-epTheme", {
    getEpThemeColor(state) {
      return state.epThemeColor;
    },
-    /** 用于mix导航模式下hamburger-svg的fill属性 */
+    /** 用于mix菜单布局下hamburger-svg的fill属性 */
    fill(state) {
      if (state.epTheme === "light") {
        return "#409eff";
--- a/src/style/sidebar.scss
+++ b/src/style/sidebar.scss
@@ -231,7 +231,6 @@
    .is-active.submenu-title-noDropdown.outer-most > * {
      z-index: 1;
      color: #fff;
-      background: transparent !important;
    }

    .is-active.submenu-title-noDropdown.outer-most::before {
--- a/src/utils/localforage/types.d.ts
+++ b/src/utils/localforage/types.d.ts
@@ -65,8 +65,7 @@ interface LocalForageDbMethodsOptional {
 }

 interface LocalForageDriverDbMethods
-  extends LocalForageDbMethodsCore,
-    LocalForageDriverMethodsOptional {}
+  extends LocalForageDbMethodsCore, LocalForageDriverMethodsOptional {}

 interface LocalForageDriverSupportFunc {
  (): Promise<boolean>;
@@ -94,8 +93,7 @@ interface LocalForageSerializer {
 }

 interface LocalForageDbMethods
-  extends LocalForageDbMethodsCore,
-    LocalForageDbMethodsOptional {}
+  extends LocalForageDbMethodsCore, LocalForageDbMethodsOptional {}

 export interface LocalForage extends LocalForageDbMethods {
  LOCALSTORAGE: string;
--- a/src/utils/message.ts
+++ b/src/utils/message.ts
@@ -4,6 +4,13 @@ import { type MessageHandler, ElMessage } from "element-plus";

 type messageStyle = "el" | "antd";
 type messageTypes = "info" | "success" | "warning" | "error";
+type messagePlacement =
+  | "top"
+  | "top-left"
+  | "top-right"
+  | "bottom"
+  | "bottom-left"
+  | "bottom-right";

 interface MessageParams {
  /** 消息类型，可选 `info` 、`success` 、`warning` 、`error` ，默认 `info` */
@@ -20,8 +27,10 @@ interface MessageParams {
  duration?: number;
  /** 是否显示关闭按钮，默认值 `false` */
  showClose?: boolean;
-  /** `Message` 距离窗口顶部的偏移量，默认 `16` */
+  /** `Message` 消息距离窗口边缘的偏移量，默认 `16` */
  offset?: number;
+  /** `Message` 消息放置位置，默认 `top` */
+  placement?: messagePlacement;
  /** 设置组件的根元素，默认 `document.body` */
  appendTo?: string | HTMLElement;
  /** 合并内容相同的消息，不支持 `VNode` 类型的消息，默认值 `false` */
@@ -56,6 +65,7 @@ const message = (
      duration = 2000,
      showClose = false,
      offset = 16,
+      placement = "top",
      appendTo = document.body,
      grouping = false,
      repeatNum = 1,
@@ -71,6 +81,7 @@ const message = (
      duration,
      showClose,
      offset,
+      placement,
      appendTo,
      grouping,
      repeatNum,
--- a/src/utils/responsive.ts
+++ b/src/utils/responsive.ts
@@ -19,8 +19,8 @@ export const injectResponsiveStorage = (app: App, config: PlatformConfigs) => {
        darkMode: config.DarkMode ?? false,
        sidebarStatus: config.SidebarStatus ?? true,
        epThemeColor: config.EpThemeColor ?? "#409EFF",
-        themeColor: config.Theme ?? "light", // 主题色（对应系统配置中的主题色，与theme不同的是它不会受到浅色、深色整体风格切换的影响，只会在手动点击主题色时改变）
-        overallStyle: config.OverallStyle ?? "light" // 整体风格（浅色：light、深色：dark、自动：system）
+        themeColor: config.Theme ?? "light", // 主题色（对应系统配置中的主题色，与theme不同的是它不会受到浅色、深色主题模式切换的影响，只会在手动点击主题色时改变）
+        themeMode: config.ThemeMode ?? "light" // 主题模式（浅色：light、深色：dark、自动：system）
      },
      // 系统配置-界面显示
      configure: Storage.getData("configure", nameSpace) ?? {
--- a/src/views/account-settings/index.vue
+++ b/src/views/account-settings/index.vue
@@ -25,7 +25,7 @@ const router = useRouter();
 const isOpen = ref(deviceDetection() ? false : true);
 const { $storage } = useGlobal<GlobalPropertiesApi>();
 onBeforeMount(() => {
-  useDataThemeChange().dataThemeChange($storage.layout?.overallStyle);
+  useDataThemeChange().dataThemeChange($storage.layout?.themeMode);
 });

 const userInfo = ref({
--- a/src/views/components/color-picker-panel.vue
+++ b/src/views/components/color-picker-panel.vue
@@ -0,0 +1,68 @@
+<script setup lang="ts">
+import { ref } from "vue";
+
+defineOptions({
+  name: "ColorPickerPanel"
+});
+
+const disabled = ref(false);
+const color = ref("rgba(255, 69, 0, 0.68)");
+const predefineColors = [
+  "#ff4500",
+  "#ff8c00",
+  "#ffd700",
+  "#90ee90",
+  "#00ced1",
+  "#1e90ff",
+  "#c71585",
+  "rgba(255, 69, 0, 0.68)",
+  "rgb(255, 120, 0)",
+  "hsv(51, 100, 98)",
+  "hsva(120, 40, 94, 0.5)",
+  "hsl(181, 100%, 37%)",
+  "hsla(209, 100%, 56%, 0.73)",
+  "#c7158577"
+];
+</script>
+
+<template>
+  <el-card shadow="never">
+    <template #header>
+      <div class="card-header">
+        <el-space wrap :size="40">
+          <el-link
+            v-tippy="{
+              content: '点击查看详细文档'
+            }"
+            href="https://element-plus.org/zh-CN/component/color-picker-panel.html"
+            target="_blank"
+            style="font-size: 16px; font-weight: 800"
+          >
+            颜色选择器面板
+          </el-link>
+          <el-radio-group v-model="disabled">
+            <el-radio :value="false">启用</el-radio>
+            <el-radio :value="true">禁用</el-radio>
+          </el-radio-group>
+        </el-space>
+      </div>
+      <el-link
+        class="mt-2"
+        href="https://github.com/pure-admin/vue-pure-admin/blob/main/src/views/components/color-picker-panel.vue"
+        target="_blank"
+      >
+        代码位置 src/views/components/color-picker-panel.vue
+      </el-link>
+    </template>
+
+    <div class="mb-2">选择透明度、预定义颜色、无边框</div>
+    <el-color-picker-panel
+      v-model="color"
+      show-alpha
+      :border="false"
+      :disabled="disabled"
+      :predefine="predefineColors"
+    />
+    <el-divider />
+  </el-card>
+</template>
--- a/src/views/components/message.vue
+++ b/src/views/components/message.vue
@@ -199,6 +199,31 @@ defineOptions({

    <el-divider />

+    <h4 class="mb-4!">
+      控制消息出现的位置，消息可以显示在窗口的顶部(默认) 或其他位置
+    </h4>
+
+    <el-space wrap>
+      <el-button @click="message('顶部中间')"> 顶部中间 </el-button>
+      <el-button @click="message('顶部左侧', { placement: 'top-left' })">
+        顶部左侧
+      </el-button>
+      <el-button @click="message('顶部右侧', { placement: 'top-right' })">
+        顶部右侧
+      </el-button>
+      <el-button @click="message('底部中间', { placement: 'bottom' })">
+        底部中间
+      </el-button>
+      <el-button @click="message('底部左侧', { placement: 'bottom-left' })">
+        底部左侧
+      </el-button>
+      <el-button @click="message('底部右侧', { placement: 'bottom-right' })">
+        底部右侧
+      </el-button>
+    </el-space>
+
+    <el-divider />
+
    <el-button @click="closeAllMessage"> 关闭所有消息提示 </el-button>
  </el-card>
 </template>
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -52,8 +52,8 @@ const currentPage = computed(() => {
 const { t } = useI18n();
 const { initStorage } = useLayout();
 initStorage();
-const { dataTheme, overallStyle, dataThemeChange } = useDataThemeChange();
-dataThemeChange(overallStyle.value);
+const { dataTheme, themeMode, dataThemeChange } = useDataThemeChange();
+dataThemeChange(themeMode.value);
 const { title, getDropdownItemStyle, getDropdownItemClass } = useNav();
 const { locale, translationCh, translationEn } = useTranslationLang();

@@ -336,9 +336,9 @@ watch(loginDay, value => {
      </div>
    </div>
    <div
-      class="w-full flex-c flex-wrap absolute bottom-3 text-sm text-[rgba(0,0,0,0.6)] dark:text-[rgba(220,220,242,0.8)]"
+      class="w-full flex-c absolute bottom-3 text-sm text-[rgba(0,0,0,0.6)] dark:text-[rgba(220,220,242,0.8)]"
    >
-      Copyright © 2020-2025
+      Copyright © 2020-present
      <a
        class="hover:text-primary!"
        href="https://github.com/pure-admin"
@@ -346,16 +346,6 @@ watch(loginDay, value => {
      >
        &nbsp;{{ title }}
      </a>
-      <!-- <div class="ml-8">
-        <span>赞助商：</span>
-        <a
-          class="hover:text-primary"
-          href="https://ai-tools.cn/resume/start"
-          target="_blank"
-        >
-          二猫 AI 简历
-        </a>
-      </div> -->
    </div>
  </div>
 </template>
--- a/types/global.d.ts
+++ b/types/global.d.ts
@@ -93,7 +93,7 @@ declare global {
    Layout?: string;
    Theme?: string;
    DarkMode?: boolean;
-    OverallStyle?: string;
+    ThemeMode?: string;
    Grey?: boolean;
    Weak?: boolean;
    HideTabs?: boolean;
@@ -140,7 +140,7 @@ declare global {
    sidebarStatus?: boolean;
    epThemeColor?: string;
    themeColor?: string;
-    overallStyle?: string;
+    themeMode?: string;
    showLogo?: boolean;
    showModel?: string;
    menuSearchHistory?: number;
@@ -169,7 +169,7 @@ declare global {
      sidebarStatus?: boolean;
      epThemeColor?: string;
      themeColor?: string;
-      overallStyle?: string;
+      themeMode?: string;
    };
    configure: {
      grey?: boolean;
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -59,4 +59,4 @@ export default ({ mode }: ConfigEnv): UserConfigExport => {
      __APP_INFO__: JSON.stringify(__APP_INFO__)
    }
  };
-};
+};
Author	SHA1	Message	Date
xiaoxian521	b5dd755d91	chore: update	2025-12-09 12:19:45 +08:00
xiaoxian521	841fbdfd95	feat: `RePureTableBar`与`ReVxeTableBar`组件实现全量文本国际化	2025-12-09 09:16:52 +08:00
xiaoxian521	aeb4feb6f9	fix: 迁移`typescript-eslint`已弃用的`tseslint.config`配置方式	2025-12-08 14:31:44 +08:00
xiaoxian521	d56211996f	chore(deps): update	2025-12-01 14:27:16 +08:00
xiaoming	fb744dbab7	refactor: 将系统配置中的“整体风格”更名为“主题模式”，“导航模式”更名为“菜单布局”，以提升命名的专业性与清晰度 (#1247 )	2025-11-27 12:24:03 +08:00
SoulEater	080ccae0ff	perf: 优化页签风格为谷歌模式下的布局和样式 (#1245 )	2025-11-26 08:14:30 +08:00
xiaoming	c22cafaa1e	feat: 添加颜色选择器面板组件 (#1242 )	2025-11-17 10:55:39 +08:00
xiaoxian521	f7bf20af97	chore: 导入`element-plus`最新版本的新组件	2025-11-15 08:07:26 +08:00
xiaoming	1b7c0577d9	chore: `message`工具函数适配`ElMessage`最新版本的`API`变更以及补充相关示例 (#1241 )	2025-11-13 07:54:28 +08:00