docs: version update

This reverts commit b52f3ba0c5.

.gitpod.yml

@@ -2,5 +2,5 @@ ports:
   - port: 5555
     onOpen: open-preview
 tasks:
-  - init: corepack enable && pnpm install
+  - init: npm i -g corepack && pnpm install
     command: pnpm run dev:play

.husky/commit-msg

@@ -1,6 +0,0 @@
-echo Start running commit-msg hook...
-
-# Check whether the git commit information is standardized
-pnpm exec commitlint --edit "$1"
-
-echo Run commit-msg hook done.

.husky/post-merge

@@ -1,3 +0,0 @@
-# 每次 git pull 之后, 安装依赖
-
-pnpm install

.husky/pre-commit

@@ -1,7 +0,0 @@
-# update `.vscode/vben-admin.code-workspace` file
-pnpm vsh code-workspace --auto-commit
-
-# Format and submit code according to lintstagedrc.js configuration
-pnpm exec lint-staged
-
-echo Run pre-commit hook done.

.lintstagedrc.mjs

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

.node-version

@@ -1 +1 @@
-20.14.0
+22.1.0

.npmrc

@@ -1,5 +1,5 @@
 registry = "https://registry.npmmirror.com"
-public-hoist-pattern[]=husky
+public-hoist-pattern[]=lefthook
 public-hoist-pattern[]=eslint
 public-hoist-pattern[]=prettier
 public-hoist-pattern[]=prettier-plugin-tailwindcss

.vscode/settings.json

@@ -14,7 +14,7 @@
   "editor.tabSize": 2,
   "editor.detectIndentation": false,
   "editor.cursorBlinking": "expand",
-  "editor.largeFileOptimizations": false,
+  "editor.largeFileOptimizations": true,
   "editor.accessibilitySupport": "off",
   "editor.cursorSmoothCaretAnimation": "on",
   "editor.guides.bracketPairs": "active",
@@ -91,6 +91,7 @@
     "**/bower_components": true,
     "**/.turbo": true,
     "**/.idea": true,
+    "**/.vitepress": true,
     "**/tmp": true,
     "**/.git": true,
     "**/.svn": true,
@@ -113,6 +114,8 @@
     "**/yarn.lock": true
   },
 
+  "typescript.tsserver.exclude": ["**/node_modules", "**/dist", "**/.turbo"],
+
   // search
   "search.searchEditor.singleClickBehaviour": "peekDefinition",
   "search.followSymlinks": false,
@@ -217,7 +220,7 @@
     "*.env": "$(capture).env.*",
     "README.md": "README*,CHANGELOG*,LICENSE,CNAME",
     "package.json": "pnpm-lock.yaml,pnpm-workspace.yaml,.gitattributes,.gitignore,.gitpod.yml,.npmrc,.browserslistrc,.node-version,.git*,.tazerc.json",
-    "eslint.config.mjs": ".eslintignore,.prettierignore,.stylelintignore,.commitlintrc.*,.prettierrc.*,stylelint.config.*,.lintstagedrc.mjs,cspell.json",
+    "eslint.config.mjs": ".eslintignore,.prettierignore,.stylelintignore,.commitlintrc.*,.prettierrc.*,stylelint.config.*,.lintstagedrc.mjs,cspell.json,lefthook.yml",
     "tailwind.config.mjs": "postcss.*"
   },
   "commentTranslate.hover.enabled": false,

CHANGELOG.md

@@ -1,3 +1,40 @@
+# 1.3.5
+
+**BUG FIX**
+
+- 某些带Vxe表格弹窗 关闭后没有正常清理表格数据的问题
+
+# 1.3.4
+
+**BUG FIX**
+
+- 文件上传多次触发导致数据不一致 https://gitee.com/dapppp/ruoyi-plus-vben5/issues/IC3BK6
+
+**PREFORMANCE**
+
+- 浏览器返回按钮/手势操作时 弹窗不会被关闭(keepAlive导致)
+
+# 1.3.3
+
+**BUG FIX**
+
+- 工作流list展示在开启缩放会有误差导致触底逻辑不会触发
+
+**OTHER**
+
+- 代码生成预览对模板的提示...（下载都懒得点一下吗）
+
+# 1.3.2
+
+**REFACTOR**
+
+- 所有表格操作列宽度调整为'auto', 这样会根据子元素宽度适配(比如没有分配权限的情况)
+- 菜单图标更新了一部分 sql同步更新
+
+**OTHER**
+
+- 暂时锁死vite依赖 i18n会报错
+
 # 1.3.1
 
 **REFACTOR**

README.ja-JP.md

@@ -1,4 +1,9 @@
-<div align="center"> <a href="https://github.com/anncwb/vue-vben-admin"> <img alt="VbenAdmin Logo" width="215" src="https://unpkg.com/@vbenjs/static-source@0.1.7/source/logo-v1.webp"> </a> <br> <br>
+<div align="center">
+  <a href="https://github.com/anncwb/vue-vben-admin">
+    <img alt="VbenAdmin Logo" width="215" src="https://unpkg.com/@vbenjs/static-source@0.1.7/source/logo-v1.webp">
+  </a>
+  <br>
+  <br>
 
 [![license](https://img.shields.io/github/license/anncwb/vue-vben-admin.svg)](LICENSE)
 
@@ -15,27 +20,27 @@ Vue Vben Adminは、最新の`vue3`、`vite`、`TypeScript`などの主流技術
 
 ## アップグレード通知
 
-これは最新バージョン5.0であり、以前のバージョンとは互換性がありません。新しいプロジェクトを開始する場合は、最新バージョンを使用することをお勧めします。古いバージョンを表示したい場合は、[v2ブランチ](https://github.com/vbenjs/vue-vben-admin/tree/v2)を使用してください。
+これは最新バージョン `5.0` であり、以前のバージョンとは互換性がありません。新しいプロジェクトを開始する場合は、最新バージョンを使用することをお勧めします。古いバージョンを表示したい場合は、[v2ブランチ](https://github.com/vbenjs/vue-vben-admin/tree/v2)を使用してください。
 
 ## 特徴
 
-- **最新技術スタック**: Vue 3やViteなどの最先端フロントエンド技術で開発
-- **TypeScript**: アプリケーション規模のJavaScriptのための言語
-- **テーマ**: 複数のテーマカラーが利用可能で、カスタマイズオプションも豊富
-- **国際化**: 完全な内蔵国際化サポート
-- **権限管理**: 動的ルートベースの権限生成ソリューションを内蔵
+- **最新技術スタック**：Vue 3やViteなどの最先端フロントエンド技術で開発
+- **TypeScript**：アプリケーション規模のJavaScriptのための言語
+- **テーマ**：複数のテーマカラーが利用可能で、カスタマイズオプションも豊富
+- **国際化**：完全な内蔵国際化サポート
+- **権限管理**：動的ルートベースの権限生成ソリューションを内蔵
 
 ## プレビュー
 
 - [Vben Admin](https://vben.pro/) - フルバージョンの中国語サイト
 
-テストアカウント: vben/123456
+テストアカウント：vben/123456
 
-<p align="center">
+<div align="center">
   <img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview1.png">
   <img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview2.png">
   <img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview3.png">
-</p>
+</div>
 
 ### Gitpodを使用
 
@@ -49,30 +54,27 @@ Gitpod（GitHub用の無料オンライン開発環境）でプロジェクト
 
 ## インストールと使用
 
-- プロジェクトコードを取得
+1. プロジェクトコードを取得
 
 ```bash
 git clone https://github.com/vbenjs/vue-vben-admin.git
 ```
 
-- 依存関係のインストール
+2. 依存関係のインストール
 
 ```bash
 cd vue-vben-admin
-
-corepack enable
-
+npm i -g corepack
 pnpm install
-
 ```
 
-- 実行
+3. 実行
 
 ```bash
 pnpm dev
 ```
 
-- ビルド
+4. ビルド
 
 ```bash
 pnpm build
@@ -86,17 +88,17 @@ pnpm build
 
 ご参加をお待ちしております！[Issueを提出](https://github.com/anncwb/vue-vben-admin/issues/new/choose)するか、Pull Requestを送信してください。
 
-**Pull Request:**
+**Pull Request プロセス：**
 
-1. コードをフォーク！
-2. 自分のブランチを作成: `git checkout -b feat/xxxx`
-3. 変更をコミット: `git commit -am 'feat(function): add xxxxx'`
-4. ブランチをプッシュ: `git push origin feat/xxxx`
+1. コードをフォーク
+2. 自分のブランチを作成：`git checkout -b feat/xxxx`
+3. 変更をコミット：`git commit -am 'feat(function): add xxxxx'`
+4. ブランチをプッシュ：`git push origin feat/xxxx`
 5. `pull request`を送信
 
 ## Git貢献提出規則
 
-- 参考 [vue](https://github.com/vuejs/vue/blob/dev/.github/COMMIT_CONVENTION.md) 規則 ([Angular](https://github.com/conventional-changelog/conventional-changelog/tree/master/packages/conventional-changelog-angular))
+参考 [vue](https://github.com/vuejs/vue/blob/dev/.github/COMMIT_CONVENTION.md) 規則 ([Angular](https://github.com/conventional-changelog/conventional-changelog/tree/master/packages/conventional-changelog-angular))
 
 - `feat` 新機能の追加
 - `fix` 問題/バグの修正
@@ -109,7 +111,6 @@ pnpm build
 - `chore` 依存関係の更新/スキャフォールディング設定の変更など
 - `ci` 継続的インテグレーション
 - `types` 型定義ファイルの変更
-  - `wip` 開発中
 
 ## ブラウザサポート
 
@@ -117,9 +118,9 @@ pnpm build
 
 モダンブラウザをサポートし、IEはサポートしません
 
-| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari |
-| :-: | :-: | :-: | :-: | :-: |
-| サポートしない | 最新2バージョン | 最新2バージョン | 最新2バージョン | 最新2バージョン |
+| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari |
+| :-: | :-: | :-: | :-: |
+| 最新2バージョン | 最新2バージョン | 最新2バージョン | 最新2バージョン |
 
 ## メンテナー
 
@@ -140,8 +141,7 @@ pnpm build
 ## 貢献者
 
 <a href="https://github.com/vbenjs/vue-vben-admin/graphs/contributors">
- <img alt="Contributors"
-        src="https://opencollective.com/vbenjs/contributors.svg?button=false" />
+  <img alt="Contributors" src="https://opencollective.com/vbenjs/contributors.svg?button=false" />
 </a>
 
 ## Discord

README.md

@@ -1,4 +1,9 @@
-<div align="center"> <a href="https://github.com/anncwb/vue-vben-admin"> <img alt="VbenAdmin Logo" width="215" src="https://unpkg.com/@vbenjs/static-source@0.1.7/source/logo-v1.webp"> </a> <br> <br>
+<div align="center">
+  <a href="https://github.com/anncwb/vue-vben-admin">
+    <img alt="VbenAdmin Logo" width="215" src="https://unpkg.com/@vbenjs/static-source@0.1.7/source/logo-v1.webp">
+  </a>
+  <br>
+  <br>
 
 [![license](https://img.shields.io/github/license/anncwb/vue-vben-admin.svg)](LICENSE)
 
@@ -17,7 +22,7 @@ Vue Vben Admin is a free and open source middle and back-end template. Using the
 
 This is the latest version, 5.0, and it is not compatible with previous versions. If you are starting a new project, it is recommended to use the latest version. If you wish to view the old version, please use the [v2 branch](https://github.com/vbenjs/vue-vben-admin/tree/v2).
 
-## Feature
+## Features
 
 - **Latest Technology Stack**: Developed with cutting-edge front-end technologies like Vue 3 and Vite
 - **TypeScript**: A language for application-scale JavaScript
@@ -31,11 +36,11 @@ This is the latest version, 5.0, and it is not compatible with previous versions
 
 Test Account: vben/123456
 
-<p align="center">
+<div align="center">
   <img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview1.png">
   <img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview2.png">
   <img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview3.png">
-</p>
+</div>
 
 ### Use Gitpod
 
@@ -47,31 +52,29 @@ Open the project in Gitpod (free online dev environment for GitHub) and start co
 
 [Document](https://doc.vben.pro/)
 
-## Install and use
+## Install and Use
 
-- Get the project code
+1. Get the project code
 
 ```bash
 git clone https://github.com/vbenjs/vue-vben-admin.git
 ```
 
-- Installation dependencies
+2. Install dependencies
 
 ```bash
 cd vue-vben-admin
-
-corepack enable
-
+npm i -g corepack
 pnpm install
 ```
 
-- run
+3. Run
 
 ```bash
 pnpm dev
 ```
 
-- build
+4. Build
 
 ```bash
 pnpm build
@@ -81,21 +84,21 @@ pnpm build
 
 [CHANGELOG](https://github.com/vbenjs/vue-vben-admin/releases)
 
-## How to contribute
+## How to Contribute
 
-You are very welcome to join！[Raise an issue](https://github.com/anncwb/vue-vben-admin/issues/new/choose) Or submit a Pull Request。
+You are very welcome to join! [Raise an issue](https://github.com/anncwb/vue-vben-admin/issues/new/choose) or submit a Pull Request.
 
-**Pull Request:**
+**Pull Request Process:**
 
-1. Fork code!
-2. Create your own branch: `git checkout -b feat/xxxx`
+1. Fork the code
+2. Create your branch: `git checkout -b feat/xxxx`
 3. Submit your changes: `git commit -am 'feat(function): add xxxxx'`
 4. Push your branch: `git push origin feat/xxxx`
-5. submit`pull request`
+5. Submit `pull request`
 
-## Git Contribution submission specification
+## Git Contribution Submission Specification
 
-- reference [vue](https://github.com/vuejs/vue/blob/dev/.github/COMMIT_CONVENTION.md) specification ([Angular](https://github.com/conventional-changelog/conventional-changelog/tree/master/packages/conventional-changelog-angular))
+Reference [vue](https://github.com/vuejs/vue/blob/dev/.github/COMMIT_CONVENTION.md) specification ([Angular](https://github.com/conventional-changelog/conventional-changelog/tree/master/packages/conventional-changelog-angular))
 
 - `feat` Add new features
 - `fix` Fix the problem/BUG
@@ -108,17 +111,16 @@ You are very welcome to join！[Raise an issue](https://github.com/anncwb/vue-vb
 - `chore` Dependency update/scaffolding configuration modification etc.
 - `ci` Continuous integration
 - `types` Type definition file changes
-  - `wip` In development
 
-## Browser support
+## Browser Support
 
 The `Chrome 80+` browser is recommended for local development
 
 Support modern browsers, not IE
 
-| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari |
-| :-: | :-: | :-: | :-: | :-: |
-| not support | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
+| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari |
+| :-: | :-: | :-: | :-: |
+| last 2 versions | last 2 versions | last 2 versions | last 2 versions |
 
 ## Maintainer
 
@@ -136,11 +138,10 @@ If you think this project is helpful to you, you can help the author buy a cup o
 
 <a style="display: block;width: 100px;height: 50px;line-height: 50px; color: #fff;text-align: center; background: #408aee;border-radius: 4px;" href="https://www.paypal.com/paypalme/cvvben">Paypal Me</a>
 
-## Contributor
+## Contributors
 
 <a href="https://github.com/vbenjs/vue-vben-admin/graphs/contributors">
-  <img alt="Contributors"
-        src="https://opencollective.com/vbenjs/contributors.svg?button=false" />
+  <img alt="Contributors" src="https://opencollective.com/vbenjs/contributors.svg?button=false" />
 </a>
 
 ## Discord

README.zh-CN.md

@@ -76,7 +76,7 @@ admin 账号: admin admin123
 git clone https://gitee.com/dapppp/ruoyi-plus-vben5.git
 ```
 
-- 安装依赖
+2. 安装依赖
 
 ```bash
 cd ruoyi-plus-vben5
@@ -150,7 +150,7 @@ VITE_GLOB_WEBSOCKET_ENABLE=false
 pnpm dev:antd
 ```
 
-- 打包
+4. 打包
 
 ```bash
 pnpm build:antd
@@ -164,7 +164,7 @@ pnpm build:antd
 
 ## Git 贡献提交规范
 
-- 参考 [vue](https://github.com/vuejs/vue/blob/dev/.github/COMMIT_CONVENTION.md) 规范 ([Angular](https://github.com/conventional-changelog/conventional-changelog/tree/master/packages/conventional-changelog-angular))
+参考 [vue](https://github.com/vuejs/vue/blob/dev/.github/COMMIT_CONVENTION.md) 规范 ([Angular](https://github.com/conventional-changelog/conventional-changelog/tree/master/packages/conventional-changelog-angular))
 
 - `feat` 增加新功能
 - `fix` 修复问题/BUG
@@ -186,7 +186,7 @@ pnpm build:antd
 
 本地开发推荐使用`Chrome` 最新版本浏览器
 
-支持现代浏览器, 不支持 IE
+支持现代浏览器，不支持 IE
 
 | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari |
 | :-: | :-: | :-: | :-: | :-: |

apps/backend-mock/api/upload.ts

@@ -0,0 +1,13 @@
+import { verifyAccessToken } from '~/utils/jwt-utils';
+import { unAuthorizedResponse } from '~/utils/response';
+
+export default eventHandler((event) => {
+  const userinfo = verifyAccessToken(event);
+  if (!userinfo) {
+    return unAuthorizedResponse(event);
+  }
+  return useResponseSuccess({
+    url: 'https://unpkg.com/@vbenjs/static-source@0.1.7/source/logo-v1.webp',
+  });
+  // return useResponseError("test")
+});

apps/backend-mock/routes/[...].ts

@@ -7,6 +7,7 @@ export default defineEventHandler(() => {
 <li><a href="/api/menu">/api/menu/all</a></li>
 <li><a href="/api/auth/codes">/api/auth/codes</a></li>
 <li><a href="/api/auth/login">/api/auth/login</a></li>
+<li><a href="/api/upload">/api/upload</a></li>
 </ul>
 `;
 });

apps/web-antd/.env

@@ -3,3 +3,6 @@ VITE_APP_TITLE=Plus Admin
 
 # 应用命名空间，用于缓存、store等功能的前缀，确保隔离
 VITE_APP_NAMESPACE=vben-web-antd
+
+# 对store进行加密的密钥，在将store持久化到localStorage时会使用该密钥进行加密
+VITE_APP_STORE_SECURE_KEY=please-replace-me-with-your-own-key

apps/web-antd/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vben/web-antd",
-  "version": "1.3.0",
+  "version": "1.3.5",
   "homepage": "https://vben.pro",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
   "repository": {

apps/web-antd/src/adapter/component/index.ts

@@ -9,7 +9,6 @@ import type { BaseFormComponentType } from '@vben/common-ui';
 import type { Recordable } from '@vben/types';
 
 import {
-  computed,
   defineAsyncComponent,
   defineComponent,
   getCurrentInstance,
@@ -88,18 +87,13 @@ const withDefaultPlaceholder = <T extends Component>(
   componentProps: Recordable<any> = {},
 ) => {
   return defineComponent({
-    inheritAttrs: false,
     name: component.name,
+    inheritAttrs: false,
     setup: (props: any, { attrs, expose, slots }) => {
-      /**
-       * 需要使用computed 否则后续updateSchema更新的placeholder无法显示(响应式问题)
-       */
-      const placeholder = computed(
-        () =>
+      const placeholder =
         props?.placeholder ||
         attrs?.placeholder ||
-          $t(`ui.placeholder.${type}`),
-      );
+        $t(`ui.placeholder.${type}`);
 
       // 透传组件暴露的方法
       const innerRef = ref();
@@ -118,7 +112,7 @@ const withDefaultPlaceholder = <T extends Component>(
           component,
           {
             ...componentProps,
-            placeholder: placeholder.value,
+            placeholder,
             ...props,
             ...attrs,
             ref: innerRef,
@@ -168,20 +162,34 @@ async function initComponentAdapter() {
     // 如果你的组件体积比较大，可以使用异步加载
     // Button: () =>
     // import('xxx').then((res) => res.Button),
-    ApiSelect: withDefaultPlaceholder(ApiComponent, 'select', {
+    ApiSelect: withDefaultPlaceholder(
+      {
+        ...ApiComponent,
+        name: 'ApiSelect',
+      },
+      'select',
+      {
         component: Select,
         loadingSlot: 'suffixIcon',
         visibleEvent: 'onDropdownVisibleChange',
         modelPropName: 'value',
-    }),
-    ApiTreeSelect: withDefaultPlaceholder(ApiComponent, 'select', {
+      },
+    ),
+    ApiTreeSelect: withDefaultPlaceholder(
+      {
+        ...ApiComponent,
+        name: 'ApiTreeSelect',
+      },
+      'select',
+      {
         component: TreeSelect,
         fieldNames: { label: 'label', value: 'value', children: 'children' },
         loadingSlot: 'suffixIcon',
         modelPropName: 'value',
         optionsPropName: 'treeData',
         visibleEvent: 'onVisibleChange',
-    }),
+      },
+    ),
     AutoComplete,
     Checkbox,
     CheckboxGroup,

apps/web-antd/src/components/upload/src/file-upload.vue

@@ -98,7 +98,7 @@ Upload.Dragger只会影响样式
           {{ $t('component.upload.upload') }}
         </a-button>
       </div>
-      <div v-if="enableDragUpload && innerFileList?.length < maxCount">
+      <div v-if="enableDragUpload">
         <p class="ant-upload-drag-icon">
           <InboxOutlined />
         </p>

apps/web-antd/src/components/upload/src/hook.ts

@@ -160,6 +160,8 @@ export function useUpload(
     return undefined;
   }
 
+  // 用来标识是否为上传 这样在watch内部不需要请求api
+  let isUpload = false;
   function handleChange(info: UploadChangeParam) {
     /**
      * 移除当前文件
@@ -199,7 +201,8 @@ export function useUpload(
         currentFile.fileName = transformFilename(cb);
         currentFile.name = transformFilename(cb);
         currentFile.thumbUrl = transformThumbUrl(cb);
-
+        // 标记为上传 watch根据值做处理
+        isUpload = true;
         // ossID添加 单个文件会被当做string
         if (props.maxCount === 1) {
           bindValue.value = ossId;
@@ -321,6 +324,14 @@ export function useUpload(
       if (value.length === 0) {
         return;
       }
+
+      // 上传完毕 不需要调用获取信息接口
+      if (isUpload) {
+        // 清理 使下一次状态可用
+        isUpload = false;
+        return;
+      }
+
       const resp = await ossInfo(value);
       function transformFile(info: OssFile) {
         const cb = { type: 'info', response: info } as const;

apps/web-antd/src/router/guard.ts

@@ -1,6 +1,6 @@
 import type { Router } from 'vue-router';
 
-import { DEFAULT_HOME_PATH, LOGIN_PATH } from '@vben/constants';
+import { LOGIN_PATH } from '@vben/constants';
 import { preferences } from '@vben/preferences';
 import { useAccessStore, useUserStore } from '@vben/stores';
 import { startProgress, stopProgress } from '@vben/utils';
@@ -56,7 +56,7 @@ function setupAccessGuard(router: Router) {
         return decodeURIComponent(
           (to.query?.redirect as string) ||
             userStore.userInfo?.homePath ||
-            DEFAULT_HOME_PATH,
+            preferences.app.defaultHomePath,
         );
       }
       return true;
@@ -75,7 +75,7 @@ function setupAccessGuard(router: Router) {
           path: LOGIN_PATH,
           // 如不需要，直接删除 query
           query:
-            to.fullPath === DEFAULT_HOME_PATH
+            to.fullPath === preferences.app.defaultHomePath
               ? {}
               : { redirect: encodeURIComponent(to.fullPath) },
           // 携带当前跳转的页面，登录后重新跳转该页面
@@ -108,8 +108,8 @@ function setupAccessGuard(router: Router) {
     accessStore.setAccessRoutes(accessibleRoutes);
     accessStore.setIsAccessChecked(true);
     const redirectPath = (from.query.redirect ??
-      (to.path === DEFAULT_HOME_PATH
-        ? userInfo.homePath || DEFAULT_HOME_PATH
+      (to.path === preferences.app.defaultHomePath
+        ? userInfo.homePath || preferences.app.defaultHomePath
         : to.fullPath)) as string;
 
     return {

apps/web-antd/src/router/routes/core.ts

@@ -1,6 +1,7 @@
 import type { RouteRecordRaw } from 'vue-router';
 
-import { DEFAULT_HOME_PATH, LOGIN_PATH } from '@vben/constants';
+import { LOGIN_PATH } from '@vben/constants';
+import { preferences } from '@vben/preferences';
 
 import { $t } from '#/locales';
 
@@ -34,7 +35,7 @@ const coreRoutes: RouteRecordRaw[] = [
     },
     name: 'Root',
     path: '/',
-    redirect: DEFAULT_HOME_PATH,
+    redirect: preferences.app.defaultHomePath,
     children: [],
   },
   {

apps/web-antd/src/router/routes/local.ts

@@ -2,6 +2,11 @@ import type { RouteRecordStringComponent } from '@vben/types';
 
 import { $t } from '@vben/locales';
 
+const {
+  version,
+  // vite inject-metadata 插件注入的全局变量
+} = __VBEN_ADMIN_METADATA__ || {};
+
 /**
  * 该文件放非后台返回的路由 比如个人中心 等需要跳转显示的页面
  */
@@ -134,8 +139,8 @@ export const localMenuList: RouteRecordStringComponent[] = [
           icon: 'lucide:book-open-text',
           keepAlive: true,
           title: '更新记录',
-          badge: '1.3.0',
-          badgeVariants: '#CC0033',
+          badge: `当前: ${version}`,
+          badgeVariants: 'bg-primary',
         },
       },
     ],

apps/web-antd/src/store/auth.ts

@@ -4,7 +4,8 @@ import type { UserInfo } from '@vben/types';
 import { ref } from 'vue';
 import { useRouter } from 'vue-router';
 
-import { DEFAULT_HOME_PATH, LOGIN_PATH } from '@vben/constants';
+import { LOGIN_PATH } from '@vben/constants';
+import { preferences } from '@vben/preferences';
 import { resetAllStores, useAccessStore, useUserStore } from '@vben/stores';
 
 import { notification } from 'ant-design-vue';
@@ -55,7 +56,9 @@ export const useAuthStore = defineStore('auth', () => {
       if (accessStore.loginExpired) {
         accessStore.setLoginExpired(false);
       } else {
-        onSuccess ? await onSuccess?.() : await router.push(DEFAULT_HOME_PATH);
+        onSuccess
+          ? await onSuccess?.()
+          : await router.push(preferences.app.defaultHomePath);
       }
 
       if (userInfo?.realName) {

apps/web-antd/src/views/_core/authentication/code-login.vue

@@ -18,7 +18,7 @@ import { useAuthStore } from '#/store';
 defineOptions({ name: 'CodeLogin' });
 
 const loading = ref(false);
-const CODE_LENGTH = 6;
+const CODE_LENGTH = 4;
 
 const tenantInfo = ref<TenantResp>({
   tenantEnabled: false,
@@ -85,8 +85,8 @@ const formSchema = computed((): VbenFormSchema[] => {
                 : $t('authentication.sendCode');
             return text;
           },
-          // 验证码长度 在这设置
-          codeLength: 4,
+          // 验证码长度
+          codeLength: CODE_LENGTH,
           placeholder: $t('authentication.code'),
           handleSendCode: async () => {
             const { valid, value } = await form.validateField('phoneNumber');

apps/web-antd/src/views/_core/social-callback/index.vue

@@ -4,7 +4,8 @@ import type { AuthApi } from '#/api';
 import { onMounted } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 
-import { DEFAULT_HOME_PATH, DEFAULT_TENANT_ID } from '@vben/constants';
+import { DEFAULT_TENANT_ID } from '@vben/constants';
+import { preferences } from '@vben/preferences';
 import { useAccessStore } from '@vben/stores';
 
 import { message } from 'ant-design-vue';
@@ -70,7 +71,7 @@ onMounted(async () => {
     // 500 你还没有绑定第三方账号，绑定后才可以登录！
   } finally {
     setTimeout(() => {
-      router.push(DEFAULT_HOME_PATH);
+      router.push(preferences.app.defaultHomePath);
     }, 1500);
   }
 });

apps/web-antd/src/views/demo/demo/data.ts

@@ -51,7 +51,8 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
   },
 ];
 

apps/web-antd/src/views/demo/tree/data.ts

@@ -60,7 +60,8 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
   },
 ];
 

apps/web-antd/src/views/monitor/online/data.ts

@@ -79,6 +79,7 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 120,
+    resizable: false,
+    width: 'auto',
   },
 ];

apps/web-antd/src/views/monitor/operlog/data.tsx

@@ -86,6 +86,7 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 120,
+    resizable: false,
+    width: 'auto',
   },
 ];

apps/web-antd/src/views/system/client/data.tsx

@@ -95,7 +95,8 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
   },
 ];
 

apps/web-antd/src/views/system/config/data.ts

@@ -71,7 +71,8 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
   },
 ];
 

apps/web-antd/src/views/system/dept/data.ts

@@ -39,11 +39,13 @@ export const columns: VxeGridProps['columns'] = [
   {
     field: 'orderNum',
     title: '排序',
-    width: 180,
+    resizable: false,
+    width: 'auto',
   },
   {
     field: 'status',
-    width: 180,
+    resizable: false,
+    width: 'auto',
     title: '状态',
     slots: {
       default: ({ row }) => {

apps/web-antd/src/views/system/dict/data/data.ts

@@ -45,7 +45,8 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
   },
 ];
 

apps/web-antd/src/views/system/dict/data/dict-data-drawer.vue

@@ -77,7 +77,7 @@ const [BasicDrawer, drawerApi] = useVbenDrawer({
 
     const { dictCode, dictType } = drawerApi.getData() as DrawerProps;
     isUpdate.value = !!dictCode;
-    formApi.setFieldValue('dictType', dictType);
+    await formApi.setFieldValue('dictType', dictType);
 
     if (dictCode && isUpdate.value) {
       const record = await dictDetailInfo(dictCode);

apps/web-antd/src/views/system/dict/type/data.ts

@@ -39,7 +39,8 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
   },
 ];
 

apps/web-antd/src/views/system/menu/data.tsx

@@ -145,7 +145,8 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 200,
+    resizable: false,
+    width: 'auto',
   },
 ];
 

apps/web-antd/src/views/system/notice/data.ts

@@ -69,7 +69,8 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
   },
 ];
 

apps/web-antd/src/views/system/oss-config/data.tsx

@@ -81,7 +81,8 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
   },
 ];
 

apps/web-antd/src/views/system/oss/data.tsx

@@ -69,7 +69,8 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
   },
 ];
 

apps/web-antd/src/views/system/post/data.ts

@@ -65,7 +65,8 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
   },
 ];
 

apps/web-antd/src/views/system/post/post-drawer.vue

@@ -8,6 +8,7 @@ import { addFullName, cloneDeep } from '@vben/utils';
 import { useVbenForm } from '#/adapter/form';
 import { postAdd, postInfo, postUpdate } from '#/api/system/post';
 import { getDeptTree } from '#/api/system/user';
+import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
 
 import { drawerSchema } from './data';
 
@@ -50,8 +51,16 @@ async function setupDeptSelect() {
   ]);
 }
 
+const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
+  {
+    initializedGetter: defaultFormValueGetter(formApi),
+    currentGetter: defaultFormValueGetter(formApi),
+  },
+);
+
 const [BasicDrawer, drawerApi] = useVbenDrawer({
-  onCancel: handleCancel,
+  onBeforeClose,
+  onClosed: handleClosed,
   onConfirm: handleConfirm,
   async onOpenChange(isOpen) {
     if (!isOpen) {
@@ -67,31 +76,33 @@ const [BasicDrawer, drawerApi] = useVbenDrawer({
       const record = await postInfo(id);
       await formApi.setValues(record);
     }
+    await markInitialized();
     drawerApi.drawerLoading(false);
   },
 });
 
 async function handleConfirm() {
   try {
-    drawerApi.drawerLoading(true);
+    drawerApi.lock(true);
     const { valid } = await formApi.validate();
     if (!valid) {
       return;
     }
     const data = cloneDeep(await formApi.getValues());
     await (isUpdate.value ? postUpdate(data) : postAdd(data));
+    resetInitialized();
     emit('reload');
-    await handleCancel();
+    drawerApi.close();
   } catch (error) {
     console.error(error);
   } finally {
-    drawerApi.drawerLoading(false);
+    drawerApi.lock(false);
   }
 }
 
-async function handleCancel() {
-  drawerApi.close();
+async function handleClosed() {
   await formApi.resetForm();
+  resetInitialized();
 }
 </script>
 

apps/web-antd/src/views/system/role-assign/data.tsx

@@ -37,6 +37,7 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
   },
 ];

apps/web-antd/src/views/system/role-assign/role-assign-drawer.vue

@@ -17,6 +17,7 @@ const emit = defineEmits<{ reload: [] }>();
 const [BasicDrawer, drawerApi] = useVbenDrawer({
   onConfirm: handleSubmit,
   onCancel: handleReset,
+  destroyOnClose: true,
 });
 
 const route = useRoute();

apps/web-antd/src/views/system/role/data.tsx

@@ -94,7 +94,8 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
   },
 ];
 

apps/web-antd/src/views/system/role/index.vue

@@ -226,7 +226,11 @@ function handleAssignRole(record: Role) {
                 </MenuItem>
               </Menu>
             </template>
-            <a-button size="small" type="link">
+            <a-button
+              size="small"
+              type="link"
+              v-access:code="'system:role:edit'"
+            >
               {{ $t('pages.common.more') }}
             </a-button>
           </Dropdown>

apps/web-antd/src/views/system/role/role-auth-modal.vue

@@ -52,7 +52,7 @@ const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
 const [BasicModal, modalApi] = useVbenModal({
   fullscreenButton: false,
   onBeforeClose,
-  onCancel: handleClosed,
+  onClosed: handleClosed,
   onConfirm: handleConfirm,
   onOpenChange: async (isOpen) => {
     if (!isOpen) {

apps/web-antd/src/views/system/role/role-drawer.vue

@@ -85,6 +85,7 @@ const [BasicDrawer, drawerApi] = useVbenDrawer({
   onBeforeClose,
   onClosed: handleClosed,
   onConfirm: handleConfirm,
+  destroyOnClose: true,
   async onOpenChange(isOpen) {
     if (!isOpen) {
       return null;

apps/web-antd/src/views/system/tenant/data.tsx

@@ -68,7 +68,8 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 200,
+    resizable: false,
+    width: 'auto',
   },
 ];
 

apps/web-antd/src/views/system/tenantPackage/data.ts

@@ -29,7 +29,8 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
   },
 ];
 

apps/web-antd/src/views/system/tenantPackage/tenant-package-drawer.vue

@@ -85,6 +85,7 @@ const [BasicDrawer, drawerApi] = useVbenDrawer({
   onBeforeClose,
   onClosed: handleClosed,
   onConfirm: handleConfirm,
+  destroyOnClose: true,
   async onOpenChange(isOpen) {
     if (!isOpen) {
       return null;

apps/web-antd/src/views/system/user/data.tsx

@@ -87,7 +87,7 @@ export const columns: VxeGridProps['columns'] = [
     slots: { default: 'action' },
     title: '操作',
     resizable: false,
-    width: 180,
+    width: 'auto',
   },
 ];
 

apps/web-antd/src/views/tool/gen/code-preview-modal.vue

@@ -20,7 +20,7 @@ import {
 } from '@vben/icons';
 
 import { useClipboard } from '@vueuse/core';
-import { Skeleton, Tree } from 'ant-design-vue';
+import { Alert, Skeleton, Tree } from 'ant-design-vue';
 
 import { previewCode } from '#/api/tool/gen';
 
@@ -185,6 +185,11 @@ const { copy } = useClipboard({ legacy: true });
             </div>
           </template>
         </Tree>
+        <Alert
+          class="mt-2"
+          show-icon
+          message="👆显示的名称为模板的文件名，非最终下载文件名..."
+        />
       </div>
       <CodeMirror
         v-model="codeContent"

apps/web-antd/src/views/workflow/category/data.ts

@@ -33,7 +33,8 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 200,
+    resizable: false,
+    width: 'auto',
   },
 ];
 

apps/web-antd/src/views/workflow/leave/data.tsx

@@ -91,7 +91,8 @@ export const columns: VxeGridProps['columns'] = [
     fixed: 'right',
     slots: { default: 'action' },
     title: '操作',
-    width: 210,
+    resizable: false,
+    width: 'auto',
   },
 ];
 

apps/web-antd/src/views/workflow/processDefinition/category-tree.vue

@@ -1,7 +1,9 @@
 <script setup lang="ts">
+import type { PropType } from 'vue';
+
 import type { CategoryTree } from '#/api/workflow/category/model';
 
-import { onMounted, type PropType, ref } from 'vue';
+import { onMounted, ref } from 'vue';
 
 import { SyncOutlined } from '@ant-design/icons-vue';
 import { InputSearch, Skeleton, Tree } from 'ant-design-vue';

apps/web-antd/src/views/workflow/processDefinition/data.tsx

@@ -63,7 +63,7 @@ export const columns: VxeGridProps['columns'] = [
     slots: { default: 'action' },
     title: '操作',
     resizable: false,
-    width: 200,
+    width: 'auto',
   },
 ];
 

apps/web-antd/src/views/workflow/processDefinition/process-definition-modal.vue

@@ -75,7 +75,7 @@ const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
 
 const [BasicDrawer, modalApi] = useVbenModal({
   onBeforeClose,
-  onCancel: handleClosed,
+  onClosed: handleClosed,
   onConfirm: handleConfirm,
   async onOpenChange(isOpen) {
     if (!isOpen) {

apps/web-antd/src/views/workflow/task/allTaskWaiting.vue

@@ -28,6 +28,7 @@ import { categoryTree } from '#/api/workflow/category';
 import { pageByAllTaskFinish, pageByAllTaskWait } from '#/api/workflow/task';
 
 import { ApprovalCard, ApprovalPanel, CopyComponent } from '../components';
+import { bottomOffset } from './constant';
 
 const emptyImage = Empty.PRESENTED_IMAGE_SIMPLE;
 
@@ -140,7 +141,9 @@ const handleScroll = debounce(async (e: Event) => {
   // e.target.scrollHeight 是元素的总高度。
   const { scrollTop, clientHeight, scrollHeight } = e.target as HTMLElement;
   // 判断是否滚动到底部
-  const isBottom = scrollTop + clientHeight >= scrollHeight;
+  const isBottom = scrollTop + clientHeight >= scrollHeight - bottomOffset;
+  console.log('scrollTop + clientHeight', scrollTop + clientHeight);
+  console.log('scrollHeight', scrollHeight);
 
   // 滚动到底部且没有加载完成
   if (isBottom && !isLoadComplete.value) {

apps/web-antd/src/views/workflow/task/constant.ts

@@ -0,0 +1,7 @@
+/**
+ * 底部偏移量
+ * 在缩放时会差大概0.5px 导致触底逻辑不会触发
+ * 在这里设置手动补偿
+ * @see https://gitee.com/dapppp/ruoyi-plus-vben5/issues/IC28RE#note_40175381
+ */
+export const bottomOffset = 2;

apps/web-antd/src/views/workflow/task/myDocument.vue

@@ -24,6 +24,7 @@ import { cloneDeep, debounce } from 'lodash-es';
 import { pageByCurrent } from '#/api/workflow/instance';
 
 import { ApprovalCard, ApprovalPanel } from '../components';
+import { bottomOffset } from './constant';
 
 const emptyImage = Empty.PRESENTED_IMAGE_SIMPLE;
 
@@ -95,7 +96,7 @@ const handleScroll = debounce(async (e: Event) => {
   // e.target.scrollHeight 是元素的总高度。
   const { scrollTop, clientHeight, scrollHeight } = e.target as HTMLElement;
   // 判断是否滚动到底部
-  const isBottom = scrollTop + clientHeight >= scrollHeight;
+  const isBottom = scrollTop + clientHeight >= scrollHeight - bottomOffset;
 
   // 滚动到底部且没有加载完成
   if (isBottom && !isLoadComplete.value) {

apps/web-antd/src/views/workflow/task/taskCopyList.vue

@@ -26,6 +26,7 @@ import { categoryTree } from '#/api/workflow/category';
 import { pageByTaskCopy } from '#/api/workflow/task';
 
 import { ApprovalCard, ApprovalPanel, CopyComponent } from '../components';
+import { bottomOffset } from './constant';
 
 const emptyImage = Empty.PRESENTED_IMAGE_SIMPLE;
 
@@ -99,7 +100,7 @@ const handleScroll = debounce(async (e: Event) => {
   // e.target.scrollHeight 是元素的总高度。
   const { scrollTop, clientHeight, scrollHeight } = e.target as HTMLElement;
   // 判断是否滚动到底部
-  const isBottom = scrollTop + clientHeight >= scrollHeight;
+  const isBottom = scrollTop + clientHeight >= scrollHeight - bottomOffset;
 
   // 滚动到底部且没有加载完成
   if (isBottom && !isLoadComplete.value) {

apps/web-antd/src/views/workflow/task/taskFinish.vue

@@ -26,6 +26,7 @@ import { categoryTree } from '#/api/workflow/category';
 import { pageByTaskFinish } from '#/api/workflow/task';
 
 import { ApprovalCard, ApprovalPanel, CopyComponent } from '../components';
+import { bottomOffset } from './constant';
 
 const emptyImage = Empty.PRESENTED_IMAGE_SIMPLE;
 
@@ -99,7 +100,7 @@ const handleScroll = debounce(async (e: Event) => {
   // e.target.scrollHeight 是元素的总高度。
   const { scrollTop, clientHeight, scrollHeight } = e.target as HTMLElement;
   // 判断是否滚动到底部
-  const isBottom = scrollTop + clientHeight >= scrollHeight;
+  const isBottom = scrollTop + clientHeight >= scrollHeight - bottomOffset;
 
   // 滚动到底部且没有加载完成
   if (isBottom && !isLoadComplete.value) {

apps/web-antd/src/views/workflow/task/taskWaiting.vue

@@ -27,6 +27,7 @@ import { categoryTree } from '#/api/workflow/category';
 import { pageByTaskWait } from '#/api/workflow/task';
 
 import { ApprovalCard, ApprovalPanel, CopyComponent } from '../components';
+import { bottomOffset } from './constant';
 
 const emptyImage = Empty.PRESENTED_IMAGE_SIMPLE;
 
@@ -100,7 +101,7 @@ const handleScroll = debounce(async (e: Event) => {
   // e.target.scrollHeight 是元素的总高度。
   const { scrollTop, clientHeight, scrollHeight } = e.target as HTMLElement;
   // 判断是否滚动到底部
-  const isBottom = scrollTop + clientHeight >= scrollHeight;
+  const isBottom = scrollTop + clientHeight >= scrollHeight - bottomOffset;
 
   // 滚动到底部且没有加载完成
   if (isBottom && !isLoadComplete.value) {

apps/web-antd/src/views/演示使用自行删除/sse/index.vue

@@ -1,9 +1,11 @@
 <script setup lang="ts">
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
 import { Page, useVbenModal } from '@vben/common-ui';
 
 import { Space } from 'ant-design-vue';
 
-import { useVbenVxeGrid, type VxeGridProps } from '#/adapter/vxe-table';
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
 
 import { sseList } from './api';
 import sendMsgModal from './send-msg-modal.vue';
@@ -31,7 +33,8 @@ const gridOptions: VxeGridProps = {
       fixed: 'right',
       slots: { default: 'action' },
       title: '操作',
-      width: 180,
+      resizable: false,
+      width: 'auto',
     },
   ],
   height: 'auto',

docs/.vitepress/theme/styles/variables.css

@@ -104,6 +104,11 @@
   --vp-custom-block-tip-text: var(--vp-c-text-1);
   --vp-custom-block-tip-bg: var(--vp-c-brand-soft);
   --vp-custom-block-tip-code-bg: var(--vp-c-brand-soft);
+
+  /**
+  * modal zIndex
+  */
+  --popup-z-index: 1000;
 }
 
 @media (min-width: 640px) {

docs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vben/docs",
-  "version": "5.5.4",
+  "version": "5.5.6",
   "private": true,
   "scripts": {
     "build": "vitepress build",

docs/src/components/common-ui/vben-alert.md

@@ -12,6 +12,12 @@ Alert提供的功能与Modal类似，但只适用于简单应用场景。例如
 
 :::
 
+::: tip 注意
+
+Alert提供的快捷方法alert、confirm、prompt动态创建的弹窗在已打开的情况下，不支持HMR（热更新），代码变更后需要关闭这些弹窗后重新打开。
+
+:::
+
 ::: tip README
 
 下方示例代码中的，存在一些主题色未适配、样式缺失的问题，这些问题只在文档内会出现，实际使用并不会有这些问题，可忽略，不必纠结。
@@ -32,6 +38,23 @@ Alert提供的功能与Modal类似，但只适用于简单应用场景。例如
 
 <DemoPreview dir="demos/vben-alert/prompt" />
 
+## useAlertContext
+
+当弹窗的content、footer、icon使用自定义组件时，在这些组件中可以使用 `useAlertContext` 获取当前弹窗的上下文对象，用来主动控制弹窗。
+
+::: tip 注意
+
+`useAlertContext`只能用在setup或者函数式组件中。
+
+:::
+
+### Methods
+
+| 方法      | 描述               | 类型     | 版本要求 |
+| --------- | ------------------ | -------- | -------- |
+| doConfirm | 调用弹窗的确认操作 | ()=>void | >5.5.4   |
+| doCancel  | 调用弹窗的取消操作 | ()=>void | >5.5.4   |
+
 ## 类型说明
 
 ```ts
@@ -69,8 +92,14 @@ export type AlertProps = {
   contentClass?: string;
   /** 执行beforeClose回调期间，在内容区域显示一个loading遮罩*/
   contentMasking?: boolean;
+  /** 弹窗底部内容（与按钮在同一个容器中） */
+  footer?: Component | string;
   /** 弹窗的图标（在标题的前面） */
   icon?: Component | IconType;
+  /**
+   * 弹窗遮罩模糊效果
+   */
+  overlayBlur?: number;
   /** 是否显示取消按钮 */
   showCancel?: boolean;
   /** 弹窗标题 */

docs/src/components/common-ui/vben-api-component.md

@@ -131,26 +131,37 @@ function fetchApi(): Promise<Record<string, any>> {
 
 ### Props
 
-| 属性名 | 描述 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| modelValue(v-model) | 当前值 | `any` | - |
-| component | 欲包装的组件（以下称为目标组件） | `Component` | - |
-| numberToString | 是否将value从数字转为string | `boolean` | `false` |
-| api | 获取数据的函数 | `(arg?: any) => Promise<OptionsItem[] \| Record<string, any>>` | - |
-| params | 传递给api的参数 | `Record<string, any>` | - |
-| resultField | 从api返回的结果中提取options数组的字段名 | `string` | - |
-| labelField | label字段名 | `string` | `label` |
-| childrenField | 子级数据字段名，需要层级数据的组件可用 | `string` | `` |
-| valueField | value字段名 | `string` | `value` |
-| optionsPropName | 目标组件接收options数据的属性名称 | `string` | `options` |
-| modelPropName | 目标组件的双向绑定属性名，默认为modelValue。部分组件可能为value | `string` | `modelValue` |
-| immediate | 是否立即调用api | `boolean` | `true` |
-| alwaysLoad | 每次`visibleEvent`事件发生时都重新请求数据 | `boolean` | `false` |
-| beforeFetch | 在api请求之前的回调函数 | `AnyPromiseFunction<any, any>` | - |
-| afterFetch | 在api请求之后的回调函数 | `AnyPromiseFunction<any, any>` | - |
-| options | 直接传入选项数据，也作为api返回空数据时的后备数据 | `OptionsItem[]` | - |
-| visibleEvent | 触发重新请求数据的事件名 | `string` | - |
-| loadingSlot | 目标组件的插槽名称，用来显示一个"加载中"的图标 | `string` | - |
+| 属性名 | 描述 | 类型 | 默认值 | 版本要求 |
+| --- | --- | --- | --- | --- |
+| modelValue(v-model) | 当前值 | `any` | - | - |
+| component | 欲包装的组件（以下称为目标组件） | `Component` | - | - |
+| numberToString | 是否将value从数字转为string | `boolean` | `false` | - |
+| api | 获取数据的函数 | `(arg?: any) => Promise<OptionsItem[] \| Record<string, any>>` | - | - |
+| params | 传递给api的参数 | `Record<string, any>` | - | - |
+| resultField | 从api返回的结果中提取options数组的字段名 | `string` | - | - |
+| labelField | label字段名 | `string` | `label` | - |
+| childrenField | 子级数据字段名，需要层级数据的组件可用 | `string` | `` | - |
+| valueField | value字段名 | `string` | `value` | - |
+| optionsPropName | 目标组件接收options数据的属性名称 | `string` | `options` | - |
+| modelPropName | 目标组件的双向绑定属性名，默认为modelValue。部分组件可能为value | `string` | `modelValue` | - |
+| immediate | 是否立即调用api | `boolean` | `true` | - |
+| alwaysLoad | 每次`visibleEvent`事件发生时都重新请求数据 | `boolean` | `false` | - |
+| beforeFetch | 在api请求之前的回调函数 | `AnyPromiseFunction<any, any>` | - | - |
+| afterFetch | 在api请求之后的回调函数 | `AnyPromiseFunction<any, any>` | - | - |
+| options | 直接传入选项数据，也作为api返回空数据时的后备数据 | `OptionsItem[]` | - | - |
+| visibleEvent | 触发重新请求数据的事件名 | `string` | - | - |
+| loadingSlot | 目标组件的插槽名称，用来显示一个"加载中"的图标 | `string` | - | - |
+| autoSelect | 自动设置选项 | `'first' \| 'last' \| 'one'\| ((item: OptionsItem[]) => OptionsItem) \| false` | `false` | >5.5.4 |
+
+#### autoSelect 自动设置选项
+
+如果当前值为undefined，在选项数据成功加载之后，自动从备选项中选择一个作为当前值。默认值为`false`，即不自动选择选项。注意：该属性不应用于多选组件。可选值有：
+
+- `"first"`：自动选择第一个选项
+- `"last"`：自动选择最后一个选项
+- `"one"`：有且仅有一个选项时，自动选择它
+- `自定义函数`：自定义选择逻辑，函数的参数为options，返回值为选择的选项
+- `false`：不自动选择选项
 
 ### Methods
 
@@ -158,3 +169,5 @@ function fetchApi(): Promise<Record<string, any>> {
 | --- | --- | --- | --- |
 | getComponentRef | 获取被包装的组件的实例 | ()=>T | >5.5.4 |
 | updateParam | 设置接口请求参数（将与params属性合并） | (newParams: Record<string, any>)=>void | >5.5.4 |
+| getOptions | 获取已加载的选项数据 | ()=>OptionsItem[] | >5.5.4 |
+| getValue | 获取当前值 | ()=>any | >5.5.4 |

docs/src/components/common-ui/vben-drawer.md

@@ -78,7 +78,7 @@ const [Drawer, drawerApi] = useVbenDrawer({
 | --- | --- | --- | --- |
 | appendToMain | 是否挂载到内容区域（默认挂载到body） | `boolean` | `false` |
 | connectedComponent | 连接另一个Modal组件 | `Component` | - |
-| destroyOnClose | 关闭时销毁`connectedComponent` | `boolean` | `false` |
+| destroyOnClose | 关闭时销毁 | `boolean` | `false` |
 | title | 标题 | `string\|slot` | - |
 | titleTooltip | 标题提示信息 | `string\|slot` | - |
 | description | 描述信息 | `string\|slot` | - |
@@ -128,10 +128,11 @@ const [Drawer, drawerApi] = useVbenDrawer({
 除了上面的属性类型包含`slot`，还可以通过插槽来自定义弹窗的内容。
 
 | 插槽名         | 描述                                               |
-| -------------- | ------------------- |
+| -------------- | -------------------------------------------------- |
 | default        | 默认插槽 - 弹窗内容                                |
 | prepend-footer | 取消按钮左侧                                       |
-| append-footer  | 取消按钮右侧        |
+| center-footer  | 取消按钮和确认按钮中间（不使用 footer 插槽时有效） |
+| append-footer  | 确认按钮右侧                                       |
 | close-icon     | 关闭按钮图标                                       |
 | extra          | 额外内容(标题右侧)                                 |
 

docs/src/components/common-ui/vben-form.md

@@ -310,7 +310,7 @@ useVbenForm 返回的第二个参数，是一个对象，包含了一些表单
 | actionWrapperClass | 表单操作区域class | `any` | - |
 | handleReset | 表单重置回调 | `(values: Record<string, any>,) => Promise<void> \| void` | - |
 | handleSubmit | 表单提交回调 | `(values: Record<string, any>,) => Promise<void> \| void` | - |
-| handleValuesChange | 表单值变化回调 | `(values: Record<string, any>,) => void` | - |
+| handleValuesChange | 表单值变化回调 | `(values: Record<string, any>, fieldsChanged: string[]) => void` | - |
 | actionButtonsReverse | 调换操作按钮位置 | `boolean` | `false` |
 | resetButtonOptions | 重置按钮组件参数 | `ActionButtonOptions` | - |
 | submitButtonOptions | 提交按钮组件参数 | `ActionButtonOptions` | - |
@@ -325,6 +325,12 @@ useVbenForm 返回的第二个参数，是一个对象，包含了一些表单
 | submitOnChange | 字段值改变时提交表单(内部防抖，这个属性一般用于表格的搜索表单) | `boolean` | false |
 | compact | 是否紧凑模式(忽略为校验信息所预留的空间) | `boolean` | false |
 
+::: tip handleValuesChange
+
+`handleValuesChange` 回调函数的第一个参数`values`装载了表单改变后的当前值对象，第二个参数`fieldsChanged`是一个数组，包含了所有被改变的字段名。注意：第二个参数仅在v5.5.4(不含)以上版本可用，并且传递的是已在schema中定义的字段名。如果你使用了字段映射并且需要检查是哪些字段发生了变化的话，请注意该参数并不会包含映射后的字段名。
+
+:::
+
 ::: tip fieldMappingTime
 
 此属性用于将表单内的数组值映射成 2 个字段，它应当传入一个数组，数组的每一项是一个映射规则，规则的第一个成员是一个字符串，表示需要映射的字段名，第二个成员是一个数组，表示映射后的字段名，第三个成员是一个可选的格式掩码，用于格式化日期时间字段；也可以提供一个格式化函数（参数分别为当前值和当前字段名，返回格式化后的值）。如果明确地将格式掩码设为null，则原值映射而不进行格式化（适用于非日期时间字段）。例如：`[['timeRange', ['startTime', 'endTime'], 'YYYY-MM-DD']]`，`timeRange`应当是一个至少具有2个成员的数组类型的值。Form会将`timeRange`的值前两个值分别按照格式掩码`YYYY-MM-DD`格式化后映射到`startTime`和`endTime`字段上。每一项的第三个参数是一个可选的格式掩码，

docs/src/components/common-ui/vben-modal.md

@@ -59,8 +59,7 @@ Modal 内的内容一般业务中，会比较复杂，所以我们可以将 moda
 ::: info 注意
 
 - `VbenModal` 组件对与参数的处理优先级是 `slot` > `props` > `state`(通过api更新的状态以及useVbenModal参数)。如果你已经传入了 `slot` 或者 `props`，那么 `setState` 将不会生效，这种情况下你可以通过 `slot` 或者 `props` 来更新状态。
-- 如果你使用到了 `connectedComponent` 参数，那么会存在 2 个`useVbenModal`, 此时，如果同时设置了相同的参数，那么以内部为准（也就是没有设置 connectedComponent 的代码）。比如 同时设置了 `onConfirm`，那么以内部的 `onConfirm` 为准。`onOpenChange`事件除外，内外都会触发。
-- 使用了`connectedComponent`参数时，可以配置`destroyOnClose`属性来决定当关闭弹窗时，是否要销毁`connectedComponent`组件（重新创建`connectedComponent`组件，这将会把其内部所有的变量、状态、数据等恢复到初始状态。）。
+- 如果你使用到了 `connectedComponent` 参数，那么会存在 2 个`useVbenModal`, 此时，如果同时设置了相同的参数，那么以内部为准（也就是没有设置 connectedComponent 的代码）。比如 同时设置了 `onConfirm`，那么以内部的 `onConfirm` 为准。`onOpenChange`事件除外，内外都会触发。另外，如果设置了`destroyOnClose`，内部Modal及其子组件会在被关闭后<b>完全销毁</b>。
 - 如果弹窗的默认行为不符合你的预期，可以在`src\bootstrap.ts`中修改`setDefaultModalProps`的参数来设置默认的属性，如默认隐藏全屏按钮，修改默认ZIndex等。
 
 :::
@@ -84,7 +83,7 @@ const [Modal, modalApi] = useVbenModal({
 | --- | --- | --- | --- |
 | appendToMain | 是否挂载到内容区域（默认挂载到body） | `boolean` | `false` |
 | connectedComponent | 连接另一个Modal组件 | `Component` | - |
-| destroyOnClose | 关闭时销毁`connectedComponent` | `boolean` | `false` |
+| destroyOnClose | 关闭时销毁 | `boolean` | `false` |
 | title | 标题 | `string\|slot` | - |
 | titleTooltip | 标题提示信息 | `string\|slot` | - |
 | description | 描述信息 | `string\|slot` | - |
@@ -139,10 +138,11 @@ const [Modal, modalApi] = useVbenModal({
 除了上面的属性类型包含`slot`，还可以通过插槽来自定义弹窗的内容。
 
 | 插槽名         | 描述                                               |
-| -------------- | ------------------- |
+| -------------- | -------------------------------------------------- |
 | default        | 默认插槽 - 弹窗内容                                |
 | prepend-footer | 取消按钮左侧                                       |
-| append-footer  | 取消按钮右侧        |
+| center-footer  | 取消按钮和确认按钮中间（不使用 footer 插槽时有效） |
+| append-footer  | 确认按钮右侧                                       |
 
 ### modalApi
 

docs/src/demos/vben-alert/confirm/index.vue

@@ -1,6 +1,10 @@
 <script lang="ts" setup>
+import { h, ref } from 'vue';
+
 import { alert, confirm, VbenButton } from '@vben/common-ui';
 
+import { Checkbox, message } from 'ant-design-vue';
+
 function showConfirm() {
   confirm('This is an alert message')
     .then(() => {
@@ -18,6 +22,34 @@ function showIconConfirm() {
   });
 }
 
+function showfooterConfirm() {
+  const checked = ref(false);
+  confirm({
+    cancelText: '不要虾扯蛋',
+    confirmText: '是的，我们都是NPC',
+    content:
+      '刚才发生的事情，为什么我似乎早就经历过一般？\n我甚至能在事情发生过程中潜意识里预知到接下来会发生什么。\n\n听起来挺玄乎的，你有过这种感觉吗？',
+    footer: () =>
+      h(
+        Checkbox,
+        {
+          checked: checked.value,
+          class: 'flex-1',
+          'onUpdate:checked': (v) => (checked.value = v),
+        },
+        '不再提示',
+      ),
+    icon: 'question',
+    title: '未解之谜',
+  }).then(() => {
+    if (checked.value) {
+      message.success('我不会再拿这个问题烦你了');
+    } else {
+      message.info('下次还要继续问你哟');
+    }
+  });
+}
+
 function showAsyncConfirm() {
   confirm({
     beforeClose({ isConfirm }) {
@@ -37,6 +69,7 @@ function showAsyncConfirm() {
   <div class="flex gap-4">
     <VbenButton @click="showConfirm">Confirm</VbenButton>
     <VbenButton @click="showIconConfirm">Confirm With Icon</VbenButton>
+    <VbenButton @click="showfooterConfirm">Confirm With Footer</VbenButton>
     <VbenButton @click="showAsyncConfirm">Async Confirm</VbenButton>
   </div>
 </template>

docs/src/demos/vben-alert/prompt/index.vue

@@ -1,9 +1,9 @@
 <script lang="ts" setup>
 import { h } from 'vue';
 
-import { alert, prompt, VbenButton } from '@vben/common-ui';
+import { alert, prompt, useAlertContext, VbenButton } from '@vben/common-ui';
 
-import { Input, RadioGroup } from 'ant-design-vue';
+import { Input, RadioGroup, Select } from 'ant-design-vue';
 import { BadgeJapaneseYen } from 'lucide-vue-next';
 
 function showPrompt() {
@@ -18,18 +18,32 @@ function showPrompt() {
     });
 }
 
-function showSelectPrompt() {
+function showSlotsPrompt() {
   prompt({
-    component: Input,
-    componentProps: {
+    component: () => {
+      // 获取弹窗上下文。注意：只能在setup或者函数式组件中调用
+      const { doConfirm } = useAlertContext();
+      return h(
+        Input,
+        {
+          onKeydown(e: KeyboardEvent) {
+            if (e.key === 'Enter') {
+              e.preventDefault();
+              // 调用弹窗提供的确认方法
+              doConfirm();
+            }
+          },
           placeholder: '请输入',
-      prefix: '充值金额',
+          prefix: '充值金额：',
           type: 'number',
         },
-    componentSlots: {
+        {
           addonAfter: () => h(BadgeJapaneseYen),
         },
-    content: '此弹窗演示了如何使用componentSlots传递自定义插槽',
+      );
+    },
+    content:
+      '此弹窗演示了如何使用自定义插槽，并且可以使用useAlertContext获取到弹窗的上下文。\n在输入框中按下回车键会触发确认操作。',
     icon: 'question',
     modelPropName: 'value',
   }).then((val) => {
@@ -37,6 +51,29 @@ function showSelectPrompt() {
   });
 }
 
+function showSelectPrompt() {
+  prompt({
+    component: Select,
+    componentProps: {
+      options: [
+        { label: 'Option A', value: 'Option A' },
+        { label: 'Option B', value: 'Option B' },
+        { label: 'Option C', value: 'Option C' },
+      ],
+      placeholder: '请选择',
+      // 弹窗会设置body的pointer-events为none，这回影响下拉框的点击事件
+      popupClassName: 'pointer-events-auto',
+    },
+    content: '此弹窗演示了如何使用component传递自定义组件',
+    icon: 'question',
+    modelPropName: 'value',
+  }).then((val) => {
+    if (val) {
+      alert(`你选择了${val}`);
+    }
+  });
+}
+
 function sleep(ms: number) {
   return new Promise((resolve) => setTimeout(resolve, ms));
 }
@@ -44,7 +81,6 @@ function sleep(ms: number) {
 function showAsyncPrompt() {
   prompt({
     async beforeClose(scope) {
-      console.log(scope);
       if (scope.isConfirm) {
         if (scope.value) {
           // 模拟异步操作，如果不成功，可以返回false
@@ -75,6 +111,7 @@ function showAsyncPrompt() {
 <template>
   <div class="flex gap-4">
     <VbenButton @click="showPrompt">Prompt</VbenButton>
+    <VbenButton @click="showSlotsPrompt"> Prompt With slots </VbenButton>
     <VbenButton @click="showSelectPrompt">Prompt With Select</VbenButton>
     <VbenButton @click="showAsyncPrompt">Prompt With Async</VbenButton>
   </div>

docs/src/en/guide/essentials/development.md

@@ -98,8 +98,8 @@ The execution command is: `pnpm run [script]` or `npm run [script]`.
     "postinstall": "pnpm -r run stub --if-present",
     // Only allow using pnpm
     "preinstall": "npx only-allow pnpm",
-    // Install husky
-    "prepare": "is-ci || husky",
+    // Install lefthook
+    "prepare": "is-ci || lefthook install",
     // Preview the application
     "preview": "turbo-run preview",
     // Package specification check

docs/src/en/guide/essentials/settings.md

@@ -60,6 +60,29 @@ VITE_INJECT_APP_LOADING=true
 VITE_ARCHIVER=true
 ```
 
+```bash [.env.production]
+# Public Path for Resources, must start and end with /
+VITE_BASE=/
+
+# API URL
+VITE_GLOB_API_URL=https://mock-napi.vben.pro/api
+
+# Whether to enable compression, can be set to none, brotli, gzip
+VITE_COMPRESS=gzip
+
+# Whether to enable PWA
+VITE_PWA=false
+
+# vue-router mode
+VITE_ROUTER_HISTORY=hash
+
+# Whether to inject global loading
+VITE_INJECT_APP_LOADING=true
+
+# Whether to generate dist.zip after packaging
+VITE_ARCHIVER=true
+```
+
 :::
 
 ## Dynamic Configuration in Production Environment
@@ -142,6 +165,7 @@ import { defineOverridesPreferences } from '@vben/preferences';
 /**
  * @description Project configuration file
  * Only a part of the configuration in the project needs to be covered, and unnecessary configurations do not need to be covered. The default configuration will be automatically used
+ * !!! Please clear the cache after changing the configuration, otherwise it may not take effect
  */
 export const overridesPreferences = defineOverridesPreferences({
   // overrides
@@ -164,6 +188,7 @@ const defaultPreferences: Preferences = {
     contentCompact: 'wide',
     defaultAvatar:
       'https://unpkg.com/@vbenjs/static-source@0.1.7/source/avatar-v1.webp',
+    defaultHomePath: '/analytics',
     dynamicTitle: true,
     enableCheckUpdates: true,
     enablePreferences: true,
@@ -171,7 +196,7 @@ const defaultPreferences: Preferences = {
     isMobile: false,
     layout: 'sidebar-nav',
     locale: 'zh-CN',
-    loginExpiredMode: 'modal',
+    loginExpiredMode: 'page',
     name: 'Vben Admin',
     preferencesButtonPosition: 'auto',
     watermark: false,
@@ -190,14 +215,16 @@ const defaultPreferences: Preferences = {
     enable: true,
     icp: '',
     icpLink: '',
+    settingShow: true,
   },
   footer: {
-    enable: true,
+    enable: false,
     fixed: false,
   },
   header: {
     enable: true,
     hidden: false,
+    menuAlign: 'start',
     mode: 'fixed',
   },
   logo: {
@@ -219,23 +246,28 @@ const defaultPreferences: Preferences = {
   sidebar: {
     autoActivateChild: false,
     collapsed: false,
+    collapsedButton: true,
     collapsedShowTitle: false,
     enable: true,
     expandOnHover: true,
-    extraCollapse: true,
+    extraCollapse: false,
+    fixedButton: true,
     hidden: false,
-    width: 230,
+    width: 224,
   },
   tabbar: {
     draggable: true,
     enable: true,
-    height: 36,
+    height: 38,
     keepAlive: true,
+    maxCount: 0,
+    middleClickToClose: false,
     persist: true,
     showIcon: true,
     showMaximize: true,
     showMore: true,
     styleType: 'chrome',
+    wheelable: true,
   },
   theme: {
     builtinType: 'default',
@@ -246,7 +278,7 @@ const defaultPreferences: Preferences = {
     mode: 'dark',
     radius: '0.5',
     semiDarkHeader: false,
-    semiDarkSidebar: true,
+    semiDarkSidebar: false,
   },
   transition: {
     enable: true,
@@ -260,9 +292,9 @@ const defaultPreferences: Preferences = {
     languageToggle: true,
     lockScreen: true,
     notification: true,
+    refresh: true,
     sidebarToggle: true,
     themeToggle: true,
-    refresh: true,
   },
 };
 ```
@@ -289,6 +321,8 @@ interface AppPreferences {
   contentCompact: ContentCompactType;
   // /** Default application avatar */
   defaultAvatar: string;
+  /** Default homepage path */
+  defaultHomePath: string;
   // /** Enable dynamic title */
   dynamicTitle: boolean;
   /** Whether to enable update checks */
@@ -342,6 +376,8 @@ interface CopyrightPreferences {
   icp: string;
   /** Link to the ICP */
   icpLink: string;
+  /** Whether to show in settings panel */
+  settingShow?: boolean;
 }
 
 interface FooterPreferences {
@@ -356,6 +392,8 @@ interface HeaderPreferences {
   enable: boolean;
   /** Whether the header is hidden, css-hidden */
   hidden: boolean;
+  /** Header menu alignment */
+  menuAlign: LayoutHeaderMenuAlignType;
   /** Header display mode */
   mode: LayoutHeaderModeType;
 }
@@ -376,8 +414,12 @@ interface NavigationPreferences {
   styleType: NavigationStyleType;
 }
 interface SidebarPreferences {
+  /** Automatically activate child menu when clicking on directory */
+  autoActivateChild: boolean;
   /** Whether the sidebar is collapsed */
   collapsed: boolean;
+  /** Whether the sidebar collapse button is visible */
+  collapsedButton: boolean;
   /** Whether to show title when sidebar is collapsed */
   collapsedShowTitle: boolean;
   /** Whether the sidebar is visible */
@@ -386,6 +428,8 @@ interface SidebarPreferences {
   expandOnHover: boolean;
   /** Whether the sidebar extension area is collapsed */
   extraCollapse: boolean;
+  /** Whether the sidebar fixed button is visible */
+  fixedButton: boolean;
   /** Whether the sidebar is hidden - css */
   hidden: boolean;
   /** Sidebar width */
@@ -414,6 +458,10 @@ interface TabbarPreferences {
   height: number;
   /** Whether tab caching is enabled */
   keepAlive: boolean;
+  /** Maximum number of tabs */
+  maxCount: number;
+  /** Whether to close tab when middle-clicked */
+  middleClickToClose: boolean;
   /** Whether tabs are persistent */
   persist: boolean;
   /** Whether icons in multiple tabs are enabled */
@@ -424,6 +472,8 @@ interface TabbarPreferences {
   showMore: boolean;
   /** Tab style */
   styleType: TabsStyleType;
+  /** Whether mouse wheel response is enabled */
+  wheelable: boolean;
 }
 interface ThemePreferences {
   /** Built-in theme name */
@@ -511,5 +561,6 @@ interface Preferences {
 
 - The `overridesPreferences` method only needs to override a part of the configurations in the project. There's no need to override configurations that are not needed; they will automatically use the default settings.
 - Any configuration item can be overridden. You just need to override it within the `overridesPreferences` method. Do not modify the default configuration file.
+- Please clear the cache after changing the configuration, otherwise it may not take effect.
 
 :::

docs/src/en/guide/introduction/quick-start.md

@@ -58,7 +58,7 @@ Open a terminal in your code directory and execute the following commands:
 cd vue-vben-admin
 
 # Enable the project-specified version of pnpm
-corepack enable
+npm i -g corepack
 
 # Install dependencies
 pnpm install

docs/src/en/guide/other/faq.md

@@ -18,7 +18,7 @@ If you encounter a problem, you can start looking from the following aspects:
 
 ## Dependency Issues
 
-In a `Monorepo` project, it is necessary to develop the habit of executing `pnpm install` every time you `git pull` the code, as new dependency packages are often added. The project has already configured automatic execution of `pnpm install` in `.husky/git-merge`, but sometimes there might be issues. If it does not execute automatically, it is recommended to execute it manually once.
+In a `Monorepo` project, it's important to get into the habit of running `pnpm install` after every `git pull` because new dependencies are often added. The project has configured automatic execution of `pnpm install` in `lefthook.yml`, but sometimes there might be issues. If it does not execute automatically, it is recommended to execute it manually once.
 
 ## About Cache Update Issues
 

docs/src/en/guide/project/standard.md

@@ -33,8 +33,8 @@ The project integrates the following code verification tools:
 - [Prettier](https://prettier.io/) for code formatting
 - [Commitlint](https://commitlint.js.org/) for checking the standard of git commit messages
 - [Publint](https://publint.dev/) for checking the standard of npm packages
-- [Lint Staged](https://github.com/lint-staged/lint-staged) for running code verification before git commits
 - [Cspell](https://cspell.org/) for checking spelling errors
+- [lefthook](https://github.com/evilmartians/lefthook) for managing Git hooks, automatically running code checks and formatting before commits
 
 ## ESLint
 
@@ -148,18 +148,66 @@ The cspell configuration file is `cspell.json`, which can be modified according
 
 Git hooks are generally combined with various lints to check code style during git commits. If the check fails, the commit will not proceed. Developers need to modify and resubmit.
 
-### husky
+### lefthook
 
-One issue is that the check will verify all code, but we only want to check the code we are committing. This is where husky comes in.
+One issue is that the check will verify all code, but we only want to check the code we are committing. This is where lefthook comes in.
 
-The most effective solution is to perform Lint checks locally before committing. A common practice is to use husky or pre-commit to perform a Lint check before local submission.
+The most effective solution is to perform Lint checks locally before committing. A common practice is to use lefthook to perform a Lint check before local submission.
 
-The project defines corresponding hooks inside `.husky`.
+The project defines corresponding hooks inside `lefthook.yml`:
 
-#### How to Disable Husky
+- `pre-commit`: Runs before commit, used for code formatting and checking
 
-If you want to disable Husky, simply delete the .husky directory.
+  - `code-workspace`: Updates VSCode workspace configuration
+  - `lint-md`: Formats Markdown files
+  - `lint-vue`: Formats and checks Vue files
+  - `lint-js`: Formats and checks JavaScript/TypeScript files
+  - `lint-style`: Formats and checks style files
+  - `lint-package`: Formats package.json
+  - `lint-json`: Formats other JSON files
 
-### lint-staged
+- `post-merge`: Runs after merge, used for automatic dependency installation
 
-Used for automatically fixing style issues of committed files. Its configuration file is `.lintstagedrc.mjs`, which can be modified according to project needs.
+  - `install`: Runs `pnpm install` to install new dependencies
+
+- `commit-msg`: Runs during commit, used for checking commit message format
+  - `commitlint`: Uses commitlint to check commit messages
+
+#### How to Disable lefthook
+
+If you want to disable lefthook, there are two ways:
+
+::: code-group
+
+```bash [Temporary disable]
+git commit -m 'feat: add home page' --no-verify
+```
+
+```bash [Permanent disable]
+# Simply delete the lefthook.yml file
+rm lefthook.yml
+```
+
+:::
+
+#### How to Modify lefthook Configuration
+
+If you want to modify lefthook's configuration, you can edit the `lefthook.yml` file. For example:
+
+```yaml
+pre-commit:
+  parallel: true # Execute tasks in parallel
+  jobs:
+    - name: lint-js
+      run: pnpm prettier --cache --ignore-unknown --write {staged_files}
+      glob: '*.{js,jsx,ts,tsx}'
+```
+
+Where:
+
+- `parallel`: Whether to execute tasks in parallel
+- `jobs`: Defines the list of tasks to execute
+- `name`: Task name
+- `run`: Command to execute
+- `glob`: File pattern to match
+- `{staged_files}`: Represents the list of staged files

docs/src/guide/essentials/development.md

@@ -98,8 +98,8 @@ npm 脚本是项目常见的配置，用于执行一些常见的任务，比如
     "postinstall": "pnpm -r run stub --if-present",
     // 只允许使用pnpm
     "preinstall": "npx only-allow pnpm",
-    // husky的安装
-    "prepare": "is-ci || husky",
+    // lefthook的安装
+    "prepare": "is-ci || lefthook install",
     // 预览应用
     "preview": "turbo-run preview",
     // 包规范检查

docs/src/guide/essentials/settings.md

@@ -187,6 +187,7 @@ const defaultPreferences: Preferences = {
     contentCompact: 'wide',
     defaultAvatar:
       'https://unpkg.com/@vbenjs/static-source@0.1.7/source/avatar-v1.webp',
+    defaultHomePath: '/analytics',
     dynamicTitle: true,
     enableCheckUpdates: true,
     enablePreferences: true,
@@ -194,7 +195,7 @@ const defaultPreferences: Preferences = {
     isMobile: false,
     layout: 'sidebar-nav',
     locale: 'zh-CN',
-    loginExpiredMode: 'modal',
+    loginExpiredMode: 'page',
     name: 'Vben Admin',
     preferencesButtonPosition: 'auto',
     watermark: false,
@@ -213,14 +214,16 @@ const defaultPreferences: Preferences = {
     enable: true,
     icp: '',
     icpLink: '',
+    settingShow: true,
   },
   footer: {
-    enable: true,
+    enable: false,
     fixed: false,
   },
   header: {
     enable: true,
     hidden: false,
+    menuAlign: 'start',
     mode: 'fixed',
   },
   logo: {
@@ -242,23 +245,28 @@ const defaultPreferences: Preferences = {
   sidebar: {
     autoActivateChild: false,
     collapsed: false,
+    collapsedButton: true,
     collapsedShowTitle: false,
     enable: true,
     expandOnHover: true,
-    extraCollapse: true,
+    extraCollapse: false,
+    fixedButton: true,
     hidden: false,
-    width: 230,
+    width: 224,
   },
   tabbar: {
     draggable: true,
     enable: true,
-    height: 36,
+    height: 38,
     keepAlive: true,
+    maxCount: 0,
+    middleClickToClose: false,
     persist: true,
     showIcon: true,
     showMaximize: true,
     showMore: true,
     styleType: 'chrome',
+    wheelable: true,
   },
   theme: {
     builtinType: 'default',
@@ -269,7 +277,7 @@ const defaultPreferences: Preferences = {
     mode: 'dark',
     radius: '0.5',
     semiDarkHeader: false,
-    semiDarkSidebar: true,
+    semiDarkSidebar: false,
   },
   transition: {
     enable: true,
@@ -312,6 +320,8 @@ interface AppPreferences {
   contentCompact: ContentCompactType;
   // /** 应用默认头像 */
   defaultAvatar: string;
+  /** 默认首页地址 */
+  defaultHomePath: string;
   // /** 开启动态标题 */
   dynamicTitle: boolean;
   /** 是否开启检查更新 */
@@ -366,6 +376,8 @@ interface CopyrightPreferences {
   icp: string;
   /** 备案号链接 */
   icpLink: string;
+  /** 设置面板是否显示*/
+  settingShow?: boolean;
 }
 
 interface FooterPreferences {
@@ -380,6 +392,8 @@ interface HeaderPreferences {
   enable: boolean;
   /** 顶栏是否隐藏,css-隐藏 */
   hidden: boolean;
+  /** 顶栏菜单位置 */
+  menuAlign: LayoutHeaderMenuAlignType;
   /** header显示模式 */
   mode: LayoutHeaderModeType;
 }
@@ -401,8 +415,12 @@ interface NavigationPreferences {
 }
 
 interface SidebarPreferences {
+  /** 点击目录时自动激活子菜单   */
+  autoActivateChild: boolean;
   /** 侧边栏是否折叠 */
   collapsed: boolean;
+  /** 侧边栏折叠按钮是否可见 */
+  collapsedButton: boolean;
   /** 侧边栏折叠时，是否显示title */
   collapsedShowTitle: boolean;
   /** 侧边栏是否可见 */
@@ -411,6 +429,8 @@ interface SidebarPreferences {
   expandOnHover: boolean;
   /** 侧边栏扩展区域是否折叠 */
   extraCollapse: boolean;
+  /** 侧边栏固定按钮是否可见 */
+  fixedButton: boolean;
   /** 侧边栏是否隐藏 - css */
   hidden: boolean;
   /** 侧边栏宽度 */
@@ -439,6 +459,10 @@ interface TabbarPreferences {
   height: number;
   /** 开启标签页缓存功能 */
   keepAlive: boolean;
+  /** 限制最大数量 */
+  maxCount: number;
+  /** 是否点击中键时关闭标签 */
+  middleClickToClose: boolean;
   /** 是否持久化标签 */
   persist: boolean;
   /** 是否开启多标签页图标 */
@@ -449,6 +473,8 @@ interface TabbarPreferences {
   showMore: boolean;
   /** 标签页风格 */
   styleType: TabsStyleType;
+  /** 是否开启鼠标滚轮响应 */
+  wheelable: boolean;
 }
 
 interface ThemePreferences {

docs/src/guide/in-depth/access.md

@@ -114,8 +114,6 @@ async function generateAccess(options: GenerateMenuAndRoutesOptions) {
 ```ts
 const dashboardMenus = [
   {
-    // 这里固定写死 BasicLayout，不可更改
-    component: 'BasicLayout',
     meta: {
       order: -1,
       title: 'page.dashboard.title',
@@ -144,6 +142,16 @@ const dashboardMenus = [
       },
     ],
   },
+  {
+    name: 'Test',
+    path: '/test',
+    component: '/test/index',
+    meta: {
+      title: 'page.test',
+      // 部分特殊页面如果不需要基础布局（页面顶部和侧边栏），可将noBasicLayout设置为true
+      noBasicLayout: true,
+    },
+  },
 ];
 ```
 

docs/src/guide/introduction/quick-start.md

@@ -58,7 +58,7 @@ git clone https://gitee.com/annsion/vue-vben-admin.git
 cd vue-vben-admin
 
 # 使用项目指定的pnpm版本进行依赖安装
-corepack enable
+npm i -g corepack
 
 # 安装依赖
 pnpm install

docs/src/guide/other/faq.md

@@ -18,7 +18,7 @@
 
 ## 依赖问题
 
-在 `Monorepo` 项目下，需要养成每次 `git pull`代码都要执行`pnpm install`的习惯，因为经常会有新的依赖包加入，项目在`.husky/git-merge`已经配置了自动执行`pnpm install`，但是有时候会出现问题，如果没有自动执行，建议手动执行一次。
+在 `Monorepo` 项目下，需要养成每次 `git pull`代码都要执行`pnpm install`的习惯，因为经常会有新的依赖包加入，项目在`lefthook.yml`已经配置了自动执行`pnpm install`，但是有时候会出现问题，如果没有自动执行，建议手动执行一次。
 
 ## 关于缓存更新问题
 

docs/src/guide/project/standard.md

@@ -33,8 +33,8 @@
 - [Prettier](https://prettier.io/) 用于代码格式化
 - [Commitlint](https://commitlint.js.org/) 用于检查 git 提交信息的规范
 - [Publint](https://publint.dev/) 用于检查 npm 包的规范
-- [Lint Staged](https://github.com/lint-staged/lint-staged) 用于在 git 提交前运行代码校验
 - [Cspell](https://cspell.org/) 用于检查拼写错误
+- [lefthook](https://github.com/evilmartians/lefthook) 用于管理 Git hooks，在提交前自动运行代码校验和格式化
 
 ## ESLint
 
@@ -148,18 +148,66 @@ cspell 配置文件为 `cspell.json`，可以根据项目需求进行修改。
 
 git hook 一般结合各种 lint，在 git 提交代码的时候进行代码风格校验，如果校验没通过，则不会进行提交。需要开发者自行修改后再次进行提交
 
-### husky
+### lefthook
 
-有一个问题就是校验会校验全部代码，但是我们只想校验我们自己提交的代码，这个时候就可以使用 husky。
+有一个问题就是校验会校验全部代码，但是我们只想校验我们自己提交的代码，这个时候就可以使用 lefthook。
 
-最有效的解决方案就是将 Lint 校验放到本地，常见做法是使用 husky 或者 pre-commit 在本地提交之前先做一次 Lint 校验。
+最有效的解决方案就是将 Lint 校验放到本地，常见做法是使用 lefthook 在本地提交之前先做一次 Lint 校验。
 
-项目在 `.husky` 内部定义了相应的 hooks
+项目在 `lefthook.yml` 内部定义了相应的 hooks：
 
-#### 如何关闭 Husky
+- `pre-commit`: 在提交前运行，用于代码格式化和检查
 
-如果你想关闭 Husky，直接删除 `.husky` 目录即可。
+  - `code-workspace`: 更新 VSCode 工作区配置
+  - `lint-md`: 格式化 Markdown 文件
+  - `lint-vue`: 格式化并检查 Vue 文件
+  - `lint-js`: 格式化并检查 JavaScript/TypeScript 文件
+  - `lint-style`: 格式化并检查样式文件
+  - `lint-package`: 格式化 package.json
+  - `lint-json`: 格式化其他 JSON 文件
 
-### lint-staged
+- `post-merge`: 在合并后运行，用于自动安装依赖
 
-用于自动修复提交文件风格问题,其配置文件为 `.lintstagedrc.mjs`，可以根据项目需求进行修改。
+  - `install`: 运行 `pnpm install` 安装新依赖
+
+- `commit-msg`: 在提交时运行，用于检查提交信息格式
+  - `commitlint`: 使用 commitlint 检查提交信息
+
+#### 如何关闭 lefthook
+
+如果你想关闭 lefthook，有两种方式：
+
+::: code-group
+
+```bash [临时关闭]
+git commit -m 'feat: add home page' --no-verify
+```
+
+```bash [永久关闭]
+# 删除 lefthook.yml 文件即可
+rm lefthook.yml
+```
+
+:::
+
+#### 如何修改 lefthook 配置
+
+如果你想修改 lefthook 的配置，可以编辑 `lefthook.yml` 文件。例如：
+
+```yaml
+pre-commit:
+  parallel: true # 并行执行任务
+  jobs:
+    - name: lint-js
+      run: pnpm prettier --cache --ignore-unknown --write {staged_files}
+      glob: '*.{js,jsx,ts,tsx}'
+```
+
+其中：
+
+- `parallel`: 是否并行执行任务
+- `jobs`: 定义要执行的任务列表
+- `name`: 任务名称
+- `run`: 要执行的命令
+- `glob`: 匹配的文件模式
+- `{staged_files}`: 表示暂存的文件列表

docs/src/guide/project/tailwindcss.md

@@ -11,3 +11,7 @@
 当前只有对应的包下面存在 `tailwind.config.mjs` 文件才会启用 tailwindcss 的编译，否则不会启用 tailwindcss。如果你是纯粹的 SDK 包，不需要使用 tailwindcss，可以不用创建 `tailwind.config.mjs` 文件。
 
 :::
+
+## 提示
+
+现`tailwindcss`已至v4.x版本，使用方法与`tailwindcss: ^3.4.17`有差异，v4.0无法与v3.x版本兼容，在开发前请确认`package.json`中的`tailwindcss`版本。

docs/src/index.md

@@ -20,6 +20,9 @@ hero:
     - theme: alt
       text: 在 GitHub 查看
       link: https://github.com/vbenjs/vue-vben-admin
+    - theme: alt
+      text: DeepWiki 文档
+      link: https://deepwiki.com/vbenjs/vue-vben-admin
 
 features:
   - icon: 🚀

internal/lint-configs/commitlint-config/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vben/commitlint-config",
-  "version": "5.5.4",
+  "version": "5.5.6",
   "private": true,
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",

internal/lint-configs/eslint-config/src/configs/perfectionist.ts

@@ -70,7 +70,7 @@ export async function perfectionist(): Promise<Linter.Config[]> {
           },
         ],
         'perfectionist/sort-objects': [
-          'error',
+          'off',
           {
             customGroups: {
               items: 'items',

internal/lint-configs/eslint-config/src/configs/vue.ts

@@ -10,7 +10,15 @@ export async function vue(): Promise<Linter.Config[]> {
     interopDefault(import('@typescript-eslint/parser')),
   ] as const);
 
+  const flatEssential = pluginVue.configs?.['flat/essential'] || [];
+  const flatStronglyRecommended =
+    pluginVue.configs?.['flat/strongly-recommended'] || [];
+  const flatRecommended = pluginVue.configs?.['flat/recommended'] || [];
+
   return [
+    ...flatEssential,
+    ...flatStronglyRecommended,
+    ...flatRecommended,
     {
       files: ['**/*.vue'],
       languageOptions: {
@@ -43,12 +51,9 @@ export async function vue(): Promise<Linter.Config[]> {
       plugins: {
         vue: pluginVue,
       },
-      processor: pluginVue.processors['.vue'],
+      processor: pluginVue.processors?.['.vue'],
       rules: {
-        ...pluginVue.configs.base.rules,
-        ...pluginVue.configs['vue3-essential'].rules,
-        ...pluginVue.configs['vue3-strongly-recommended'].rules,
-        ...pluginVue.configs['vue3-recommended'].rules,
+        ...pluginVue.configs?.base?.rules,
 
         'vue/attribute-hyphenation': [
           'error',
@@ -131,7 +136,6 @@ export async function vue(): Promise<Linter.Config[]> {
         'vue/require-default-prop': 'error',
         'vue/require-explicit-emits': 'error',
         'vue/require-prop-types': 'off',
-        'vue/script-setup-uses-vars': 'error',
         'vue/singleline-html-element-content-newline': 'off',
         'vue/space-infix-ops': 'error',
         'vue/space-unary-ops': ['error', { nonwords: false, words: true }],

internal/lint-configs/eslint-config/src/custom-config.ts

@@ -28,6 +28,13 @@ const customConfig: Linter.Config[] = [
       'perfectionist/sort-objects': 'off',
     },
   },
+  {
+    files: ['**/**.vue'],
+    ignores: restrictedImportIgnores,
+    rules: {
+      'perfectionist/sort-objects': 'off',
+    },
+  },
   {
     // apps内部的一些基础规则
     files: ['apps/**/**'],

internal/lint-configs/stylelint-config/index.mjs

@@ -43,6 +43,7 @@ export default {
     'stylelint-scss',
   ],
   rules: {
+    'at-rule-no-deprecated': null,
     'at-rule-no-unknown': [
       true,
       {

internal/lint-configs/stylelint-config/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vben/stylelint-config",
-  "version": "5.5.4",
+  "version": "5.5.6",
   "private": true,
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",

internal/node-utils/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vben/node-utils",
-  "version": "5.5.4",
+  "version": "5.5.6",
   "private": true,
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",

internal/tailwind-config/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vben/tailwind-config",
-  "version": "5.5.4",
+  "version": "5.5.6",
   "private": true,
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",

internal/tailwind-config/tsconfig.json

@@ -1,6 +1,9 @@
 {
   "$schema": "https://json.schemastore.org/tsconfig",
   "extends": "@vben/tsconfig/node.json",
+  "compilerOptions": {
+    "moduleResolution": "bundler"
+  },
   "include": ["src"],
   "exclude": ["node_modules"]
 }

internal/tsconfig/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vben/tsconfig",
-  "version": "5.5.4",
+  "version": "5.5.6",
   "private": true,
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",

internal/vite-config/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vben/vite-config",
-  "version": "5.5.4",
+  "version": "5.5.6",
   "private": true,
   "homepage": "https://github.com/vbenjs/vue-vben-admin",
   "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",

internal/vite-config/src/typing.ts

@@ -3,149 +3,328 @@ import type { ConfigEnv, PluginOption, UserConfig } from 'vite';
 import type { PluginOptions } from 'vite-plugin-dts';
 import type { Options as PwaPluginOptions } from 'vite-plugin-pwa';
 
+/**
+ * ImportMap 配置接口
+ * @description 用于配置模块导入映射，支持自定义导入路径和范围
+ * @example
+ * ```typescript
+ * {
+ *   imports: {
+ *     'vue': 'https://unpkg.com/vue@3.2.47/dist/vue.esm-browser.js'
+ *   },
+ *   scopes: {
+ *     'https://site.com/': {
+ *       'vue': 'https://unpkg.com/vue@3.2.47/dist/vue.esm-browser.js'
+ *     }
+ *   }
+ * }
+ * ```
+ */
 interface IImportMap {
+  /** 模块导入映射 */
   imports?: Record<string, string>;
+  /** 作用域特定的导入映射 */
   scopes?: {
     [scope: string]: Record<string, string>;
   };
 }
+
+/**
+ * 打印插件配置选项
+ * @description 用于配置控制台打印信息
+ */
 interface PrintPluginOptions {
   /**
-   * 打印的数据
+   * 打印的数据映射
+   * @description 键值对形式的数据，将在控制台打印
+   * @example
+   * ```typescript
+   * {
+   *   'App Version': '1.0.0',
+   *   'Build Time': '2024-01-01'
+   * }
+   * ```
    */
   infoMap?: Record<string, string | undefined>;
 }
 
+/**
+ * Nitro Mock 插件配置选项
+ * @description 用于配置 Nitro Mock 服务器的行为
+ */
 interface NitroMockPluginOptions {
   /**
-   * mock server 包名
+   * Mock 服务器包名
+   * @default '@vbenjs/nitro-mock'
    */
   mockServerPackage?: string;
 
   /**
-   * mock 服务端口
+   * Mock 服务端口
+   * @default 3000
    */
   port?: number;
 
   /**
-   * mock 日志是否打印
+   * 是否打印 Mock 日志
+   * @default false
    */
   verbose?: boolean;
 }
 
+/**
+ * 归档插件配置选项
+ * @description 用于配置构建产物的压缩归档
+ */
 interface ArchiverPluginOptions {
   /**
    * 输出文件名
-   * @default dist
+   * @default 'dist'
    */
   name?: string;
   /**
    * 输出目录
-   * @default .
+   * @default '.'
    */
   outputDir?: string;
 }
 
 /**
- * importmap 插件配置
+ * ImportMap 插件配置
+ * @description 用于配置模块的 CDN 导入
  */
 interface ImportmapPluginOptions {
   /**
    * CDN 供应商
-   * @default jspm.io
+   * @default 'jspm.io'
+   * @description 支持 esm.sh 和 jspm.io 两种 CDN 供应商
    */
   defaultProvider?: 'esm.sh' | 'jspm.io';
-  /** importmap 配置 */
+  /**
+   * ImportMap 配置数组
+   * @description 配置需要从 CDN 导入的包
+   * @example
+   * ```typescript
+   * [
+   *   { name: 'vue' },
+   *   { name: 'pinia', range: '^2.0.0' }
+   * ]
+   * ```
+   */
   importmap?: Array<{ name: string; range?: string }>;
-  /** 手动配置importmap */
+  /**
+   * 手动配置 ImportMap
+   * @description 自定义 ImportMap 配置
+   */
   inputMap?: IImportMap;
 }
 
 /**
- * 用于判断是否需要加载插件
+ * 条件插件配置
+ * @description 用于根据条件动态加载插件
  */
 interface ConditionPlugin {
-  // 判断条件
+  /**
+   * 判断条件
+   * @description 当条件为 true 时加载插件
+   */
   condition?: boolean;
-  // 插件对象
+  /**
+   * 插件对象
+   * @description 返回插件数组或 Promise
+   */
   plugins: () => PluginOption[] | PromiseLike<PluginOption[]>;
 }
 
+/**
+ * 通用插件配置选项
+ * @description 所有插件共用的基础配置
+ */
 interface CommonPluginOptions {
-  /** 是否开启devtools */
+  /**
+   * 是否开启开发工具
+   * @default false
+   */
   devtools?: boolean;
-  /** 环境变量 */
+  /**
+   * 环境变量
+   * @description 自定义环境变量
+   */
   env?: Record<string, any>;
-  /** 是否注入metadata */
+  /**
+   * 是否注入元数据
+   * @default true
+   */
   injectMetadata?: boolean;
-  /** 是否构建模式 */
+  /**
+   * 是否为构建模式
+   * @default false
+   */
   isBuild?: boolean;
-  /** 构建模式 */
+  /**
+   * 构建模式
+   * @default 'development'
+   */
   mode?: string;
-  /** 开启依赖分析 */
+  /**
+   * 是否开启依赖分析
+   * @default false
+   * @description 使用 rollup-plugin-visualizer 分析依赖
+   */
   visualizer?: boolean | PluginVisualizerOptions;
 }
 
+/**
+ * 应用插件配置选项
+ * @description 用于配置应用构建时的插件选项
+ */
 interface ApplicationPluginOptions extends CommonPluginOptions {
-  /** 开启后，会在打包dist同级生成dist.zip */
+  /**
+   * 是否开启压缩归档
+   * @default false
+   * @description 开启后会在打包目录生成 zip 文件
+   */
   archiver?: boolean;
-  /** 压缩归档插件配置 */
+  /**
+   * 压缩归档插件配置
+   * @description 配置压缩归档的行为
+   */
   archiverPluginOptions?: ArchiverPluginOptions;
-  /** 开启 gzip|brotli 压缩 */
+  /**
+   * 是否开启压缩
+   * @default false
+   * @description 支持 gzip 和 brotli 压缩
+   */
   compress?: boolean;
-  /** 压缩类型 */
+  /**
+   * 压缩类型
+   * @default ['gzip']
+   * @description 可选的压缩类型
+   */
   compressTypes?: ('brotli' | 'gzip')[];
-  /** 在构建的时候抽离配置文件 */
+  /**
+   * 是否抽离配置文件
+   * @default false
+   * @description 在构建时抽离配置文件
+   */
   extraAppConfig?: boolean;
-  /** 是否开启html插件  */
+  /**
+   * 是否开启 HTML 插件
+   * @default true
+   */
   html?: boolean;
-  /** 是否开启i18n */
+  /**
+   * 是否开启国际化
+   * @default false
+   */
   i18n?: boolean;
-  /** 是否开启 importmap CDN  */
+  /**
+   * 是否开启 ImportMap CDN
+   * @default false
+   */
   importmap?: boolean;
-  /** importmap 插件配置 */
+  /**
+   * ImportMap 插件配置
+   */
   importmapOptions?: ImportmapPluginOptions;
-  /** 是否注入app loading */
+  /**
+   * 是否注入应用加载动画
+   * @default true
+   */
   injectAppLoading?: boolean;
-  /** 是否注入全局scss */
+  /**
+   * 是否注入全局 SCSS
+   * @default true
+   */
   injectGlobalScss?: boolean;
-  /** 是否注入版权信息 */
+  /**
+   * 是否注入版权信息
+   * @default true
+   */
   license?: boolean;
-  /** 是否开启nitro mock */
+  /**
+   * 是否开启 Nitro Mock
+   * @default false
+   */
   nitroMock?: boolean;
-  /** nitro mock 插件配置 */
+  /**
+   * Nitro Mock 插件配置
+   */
   nitroMockOptions?: NitroMockPluginOptions;
-  /** 开启控制台自定义打印 */
+  /**
+   * 是否开启控制台打印
+   * @default false
+   */
   print?: boolean;
-  /** 打印插件配置 */
+  /**
+   * 打印插件配置
+   */
   printInfoMap?: PrintPluginOptions['infoMap'];
-  /** 是否开启pwa */
+  /**
+   * 是否开启 PWA
+   * @default false
+   */
   pwa?: boolean;
-  /** pwa 插件配置 */
+  /**
+   * PWA 插件配置
+   */
   pwaOptions?: Partial<PwaPluginOptions>;
-  /** 是否开启vxe-table懒加载 */
+  /**
+   * 是否开启 VXE Table 懒加载
+   * @default false
+   */
   vxeTableLazyImport?: boolean;
 }
 
+/**
+ * 库插件配置选项
+ * @description 用于配置库构建时的插件选项
+ */
 interface LibraryPluginOptions extends CommonPluginOptions {
-  /** 开启 dts 输出 */
+  /**
+   * 是否开启 DTS 输出
+   * @default true
+   * @description 生成 TypeScript 类型声明文件
+   */
   dts?: boolean | PluginOptions;
 }
 
+/**
+ * 应用配置选项类型
+ */
 type ApplicationOptions = ApplicationPluginOptions;
 
+/**
+ * 库配置选项类型
+ */
 type LibraryOptions = LibraryPluginOptions;
 
+/**
+ * 应用配置定义函数类型
+ * @description 用于定义应用构建配置
+ */
 type DefineApplicationOptions = (config?: ConfigEnv) => Promise<{
+  /** 应用插件配置 */
   application?: ApplicationOptions;
+  /** Vite 配置 */
   vite?: UserConfig;
 }>;
 
+/**
+ * 库配置定义函数类型
+ * @description 用于定义库构建配置
+ */
 type DefineLibraryOptions = (config?: ConfigEnv) => Promise<{
+  /** 库插件配置 */
   library?: LibraryOptions;
+  /** Vite 配置 */
   vite?: UserConfig;
 }>;
 
+/**
+ * 配置定义类型
+ * @description 应用或库的配置定义
+ */
 type DefineConfig = DefineApplicationOptions | DefineLibraryOptions;
 
 export type {

lefthook.yml

@@ -0,0 +1,76 @@
+# EXAMPLE USAGE:
+#
+#   Refer for explanation to following link:
+#   https://lefthook.dev/configuration/
+#
+# pre-push:
+#   jobs:
+#     - name: packages audit
+#       tags:
+#         - frontend
+#         - security
+#       run: yarn audit
+#
+#     - name: gems audit
+#       tags:
+#         - backend
+#         - security
+#       run: bundle audit
+#
+# pre-commit:
+#   parallel: true
+#   jobs:
+#     - run: yarn eslint {staged_files}
+#       glob: "*.{js,ts,jsx,tsx}"
+#
+#     - name: rubocop
+#       glob: "*.rb"
+#       exclude:
+#         - config/application.rb
+#         - config/routes.rb
+#       run: bundle exec rubocop --force-exclusion {all_files}
+#
+#     - name: govet
+#       files: git ls-files -m
+#       glob: "*.go"
+#       run: go vet {files}
+#
+#     - script: "hello.js"
+#       runner: node
+#
+#     - script: "hello.go"
+#       runner: go run
+
+pre-commit:
+  parallel: true
+  commands:
+    code-workspace:
+      run: pnpm vsh code-workspace --auto-commit
+    lint-md:
+      run: pnpm prettier --cache --ignore-unknown --write {staged_files}
+      glob: '*.md'
+    lint-vue:
+      run: pnpm prettier --write {staged_files} && pnpm eslint --cache --fix {staged_files} && pnpm stylelint --fix --allow-empty-input {staged_files}
+      glob: '*.vue'
+    lint-js:
+      run: pnpm prettier --cache --ignore-unknown --write {staged_files} && pnpm eslint --cache --fix {staged_files}
+      glob: '*.{js,jsx,ts,tsx}'
+    lint-style:
+      run: pnpm prettier --cache --ignore-unknown --write {staged_files} && pnpm stylelint --fix --allow-empty-input {staged_files}
+      glob: '*.{scss,less,styl,html,vue,css}'
+    lint-package:
+      run: pnpm prettier --cache --write {staged_files}
+      glob: 'package.json'
+    lint-json:
+      run: pnpm prettier --cache --write --parser json {staged_files}
+      glob: '{!(package)*.json,*.code-snippets,.!(browserslist)*rc}'
+
+post-merge:
+  commands:
+    install:
+      run: pnpm install
+
+commit-msg:
+  commands:
+    commitlint:
+      run: pnpm exec commitlint --edit $1

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vben-admin-monorepo",
-  "version": "5.5.4",
+  "version": "5.5.6",
   "private": true,
   "keywords": [
     "monorepo",
@@ -48,14 +48,14 @@
     "lint": "vsh lint",
     "postinstall": "pnpm -r run stub --if-present",
     "preinstall": "npx only-allow pnpm",
-    "prepare": "is-ci || husky",
     "preview": "turbo-run preview",
     "publint": "vsh publint",
     "reinstall": "pnpm clean --del-lock && pnpm install",
     "test:unit": "vitest run --dom",
     "test:e2e": "turbo run test:e2e",
     "update:deps": "npx taze -r -w",
-    "version": "pnpm exec changeset version && pnpm install --no-frozen-lockfile"
+    "version": "pnpm exec changeset version && pnpm install --no-frozen-lockfile",
+    "catalog": "pnpx codemod pnpm/catalog"
   },
   "devDependencies": {
     "@changesets/changelog-github": "catalog:",
@@ -78,9 +78,8 @@
     "cross-env": "catalog:",
     "cspell": "catalog:",
     "happy-dom": "catalog:",
-    "husky": "catalog:",
     "is-ci": "catalog:",
-    "lint-staged": "catalog:",
+    "lefthook": "catalog:",
     "playwright": "catalog:",
     "rimraf": "catalog:",
     "tailwindcss": "catalog:",
@@ -96,7 +95,7 @@
     "node": ">=20.10.0",
     "pnpm": ">=9.12.0"
   },
-  "packageManager": "pnpm@9.15.9",
+  "packageManager": "pnpm@10.10.0",
   "pnpm": {
     "peerDependencyRules": {
       "allowedVersions": {
@@ -107,7 +106,7 @@
       "@ast-grep/napi": "catalog:",
       "@ctrl/tinycolor": "catalog:",
       "clsx": "catalog:",
-      "esbuild": "0.24.0",
+      "esbuild": "0.25.3",
       "pinia": "catalog:",
       "vue": "catalog:"
     },