release: update 6.3.0

chore(deps): update
fix: 迁移typescript-eslint已弃用的tseslint.config配置方式
2025-12-15 14:50:29 +08:00 · 2025-12-10 10:07:37 +08:00 · 2025-12-10 10:01:44 +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
23 changed files with 1870 additions and 1952 deletions
--- a/CHANGELOG.en_US.md
+++ b/CHANGELOG.en_US.md
@@ -1,3 +1,27 @@
+# 6.3.0 (2025-12-10)
+
+### ✔️ Refactor
+
+- Renamed "Overall Style" in system configuration to "Theme Mode" and "Navigation Mode" to "Menu Layout" to improve naming professionalism and clarity.
+- Migrated the deprecated `tseslint.config` configuration method of `typescript-eslint`.
+
+### 🎫 Feat
+
+- Added a color picker panel component.
+
+### 🐞 Bug fixes
+
+- Fixed an issue where the selected/activated state style of the navigation menu was displayed incorrectly when using `iconfont` icons.
+- Fixed a style issue with the column settings pop-up of the `RePureTableBar` and `ReVxeTableBar` components.
+
+### 🍏 Perf
+
+- Adapting the `ReDialog` component to the latest version of `el-dialog` with API changes and supplementary examples
+- Adapting the `ReDrawer` component to the latest version of `el-drawer` with API changes and supplementary examples
+- Adapting the `message` utility function to the latest version of `ElMessage` with API changes and supplementary examples
+- Importing the latest version of `element-plus` components
+- Optimizing the tab layout and style for Google Chrome mode
+
 # 6.2.0 (2025-10-16)

 ### 🎫 Features
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,27 @@
+# 6.3.0 (2025-12-10)
+
+### ✔️ Refactor
+
+- Renamed "Overall Style" in system configuration to "Theme Mode" and "Navigation Mode" to "Menu Layout" to improve naming professionalism and clarity.
+- Migrated the deprecated `tseslint.config` configuration method of `typescript-eslint`.
+
+### 🎫 Feat
+
+- Added a color picker panel component.
+
+### 🐞 Bug fixes
+
+- Fixed an issue where the selected/activated state style of the navigation menu was displayed incorrectly when using `iconfont` icons.
+- Fixed a style issue with the column settings pop-up of the `RePureTableBar` and `ReVxeTableBar` components.
+
+### 🍏 Perf
+
+- Adapting the `ReDialog` component to the latest version of `el-dialog` with API changes and supplementary examples
+- Adapting the `ReDrawer` component to the latest version of `el-drawer` with API changes and supplementary examples
+- Adapting the `message` utility function to the latest version of `ElMessage` with API changes and supplementary examples
+- Importing the latest version of `element-plus` components
+- Optimizing the tab layout and style for Google Chrome mode
+
 # 6.2.0 (2025-10-16)

 ### 🎫 Features
--- a/CHANGELOG.zh_CN.md
+++ b/CHANGELOG.zh_CN.md
@@ -1,8 +1,32 @@
+# 6.3.0 (2025-12-10)
+
+### ✔️ Refactor
+
+- 将系统配置中的“整体风格”更名为“主题模式”，“导航模式”更名为“菜单布局”，以提升命名的专业性与清晰度
+- 迁移`typescript-eslint`已弃用的`tseslint.config`配置方式
+
+### 🎫 Feat
+
+- 添加颜色选择器面板组件
+
+### 🐞 Bug fixes
+
+- 修复导航菜单在使用`iconfont`图标时，选中/激活状态的样式显示异常问题
+- 修复`RePureTableBar`和`ReVxeTableBar`组件的列设置弹窗样式问题
+
+### 🍏 Perf
+
+- `ReDialog`组件适配`el-dialog`最新版本的`API`变更以及补充相关示例
+- `ReDrawer`组件适配`el-drawer`最新版本的`API`变更以及补充相关示例
+- `message`工具函数适配`ElMessage`最新版本的`API`变更以及补充相关示例
+- 导入`element-plus`最新版本的新组件
+- 优化页签风格为谷歌模式下的布局和样式
+
 # 6.2.0 (2025-10-16)

 ### 🎫 Feat

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

 ### 🐞 Bug fixes

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

 ### 🐞 Bug fixes

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

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

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

 ### 🍏 Perf

@@ -285,7 +309,7 @@
 - 内嵌`iframe`页支持设置`keepAlive`，保持页面状态
 - 优化导航，弹出的菜单超出内容区自适应且可滚动
 - 添加文件上传示例
- 添加整体风格自适应操作系统浅色、深色、自动主题功能
+- 添加主题模式自适应操作系统浅色、深色、自动主题功能
 - 添加页脚
 - 支持多标签页打开已经登录的系统后无需再登录并添加内免登录功能（用户可选择免登录的天数）
 - 带来高级感的终端命令行
@@ -485,7 +509,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/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
--- 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: 混合菜单，灵活多变
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "vue-pure-admin",
-  "version": "6.2.0",
+  "version": "6.3.0",
  "private": true,
  "type": "module",
  "scripts": {
@@ -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.12.0",
    "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,70 +109,70 @@
    "vue3-puzzle-vcode": "^1.1.7",
    "vuedraggable": "^4.1.0",
    "vxe-table": "4.6.25",
-    "wavesurfer.js": "^7.11.0",
+    "wavesurfer.js": "^7.12.1",
    "xgplayer": "^3.0.23",
    "xlsx": "^0.18.5"
  },
  "devDependencies": {
-    "@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",
+    "@commitlint/cli": "^20.2.0",
+    "@commitlint/config-conventional": "^20.2.0",
+    "@commitlint/types": "^20.2.0",
+    "@eslint/js": "^9.39.1",
+    "@faker-js/faker": "^10.1.0",
+    "@iconify/json": "^2.2.416",
    "@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.26",
    "@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.4",
+    "rimraf": "^6.1.2",
+    "rollup-plugin-visualizer": "^6.0.5",
+    "sass": "^1.95.1",
+    "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.49.0",
+    "unplugin-icons": "^22.5.0",
+    "vite": "^7.2.7",
    "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.8"
  },
  "engines": {
    "node": "^20.19.0 || >=22.13.0",
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/public/platform-config.json
+++ b/public/platform-config.json
@@ -1,5 +1,5 @@
 {
-  "Version": "6.2.0",
+  "Version": "6.3.0",
  "Title": "PureAdmin",
  "FixedHeader": true,
  "HiddenSideBar": false,
@@ -9,7 +9,7 @@
  "Layout": "vertical",
  "Theme": "light",
  "DarkMode": false,
-  "OverallStyle": "light",
+  "ThemeMode": "light",
  "Grey": false,
  "Weak": false,
  "HideTabs": false,
--- 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-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/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/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/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/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();

--- 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;
Author	SHA1	Message	Date
xiaoxian521	324caafb10	release: update `6.3.0`	2025-12-10 10:07:37 +08:00
xiaoxian521	3d86eded69	chore(deps): update	2025-12-10 10:01:44 +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