by2025/admin-vben5
9
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Pre Merge pull request !30 from 玲娜贝er/dev

Browse Source
This commit is contained in:
玲娜贝er 2025-04-30 03:14:56 +00:00 committed by Gitee
commit de4e883899
No known key found for this signature in database
GPG Key ID: 173E9B9CA92EEF8F
126 changed files with 1452 additions and 630 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.gitpod.yml
View File

@ -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

2
.node-version
View File

@ -1 +1 @@
20.14.0
22.1.0

5
.vscode/settings.json vendored
View File

@ -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,

10
CHANGELOG.md
View File

@ -1,3 +1,13 @@
# 1.3.3
**BUG FIX**
- 工作流list展示在开启缩放会有误差导致触底逻辑不会触发
**OTHER**
- 代码生成预览对模板的提示...（下载都懒得点一下吗）
# 1.3.2
**REFACTOR**

60
README.ja-JP.md
View File

@ -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

57
README.md
View File

@ -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

8
README.zh-CN.md
View File

@ -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 |
| :-: | :-: | :-: | :-: | :-: |

13
apps/backend-mock/api/upload.ts Normal file
View File

@ -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")
});

1
apps/backend-mock/routes/[...].ts
View File

@ -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>
`;
});

3
apps/web-antd/.env
View File

@ -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

24
apps/web-antd/src/adapter/component/index.ts
View File

@ -87,8 +87,8 @@ const withDefaultPlaceholder = <T extends Component>(
componentProps: Recordable<any> = {},
) => {
return defineComponent({
inheritAttrs: false,
name: component.name,
inheritAttrs: false,
setup: (props: any, { attrs, expose, slots }) => {
const placeholder =
props?.placeholder ||
@ -162,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,

2
apps/web-antd/src/components/upload/src/file-upload.vue
View File

@ -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>

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

@ -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"

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

@ -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) {

7
apps/web-antd/src/views/workflow/task/constant.ts Normal file
View File

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

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

@ -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) {

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

@ -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) {

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

@ -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) {

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

@ -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) {

2
docs/package.json
View File

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

2
docs/src/components/common-ui/vben-modal.md
View File

@ -59,7 +59,7 @@ Modal 内的内容一般业务中，会比较复杂，所以我们可以将 moda
::: info 注意
- `VbenModal` 组件对与参数的处理优先级是 `slot` > `props` > `state`(通过api更新的状态以及useVbenModal参数)。如果你已经传入了 `slot` 或者 `props`，那么 `setState` 将不会生效，这种情况下你可以通过 `slot` 或者 `props` 来更新状态。
- 如果你使用到了 `connectedComponent` 参数，那么会存在 2 个`useVbenModal`, 此时，如果同时设置了相同的参数，那么以内部为准（也就是没有设置 connectedComponent 的代码）。比如 同时设置了 `onConfirm`，那么以内部的 `onConfirm` 为准。`onOpenChange`事件除外，内外都会触发。
- 如果你使用到了 `connectedComponent` 参数，那么会存在 2 个`useVbenModal`, 此时，如果同时设置了相同的参数，那么以内部为准（也就是没有设置 connectedComponent 的代码）。比如 同时设置了 `onConfirm`，那么以内部的 `onConfirm` 为准。`onOpenChange`事件除外，内外都会触发。另外，如果设置了`destroyOnClose`，内部Modal及其子组件会在被关闭后<b>完全销毁</b>。
- 如果弹窗的默认行为不符合你的预期，可以在`src\bootstrap.ts`中修改`setDefaultModalProps`的参数来设置默认的属性，如默认隐藏全屏按钮，修改默认ZIndex等。
:::

2
docs/src/en/guide/introduction/quick-start.md
View File

@ -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

12
docs/src/guide/in-depth/access.md
View File

@ -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,
},
},
];
```

2
docs/src/guide/introduction/quick-start.md
View File

@ -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

4
docs/src/guide/project/tailwindcss.md
View File

@ -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`版本。

3
docs/src/index.md
View File

@ -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: 🚀

2
internal/lint-configs/commitlint-config/package.json
View File

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

16
internal/lint-configs/eslint-config/src/configs/vue.ts
View File

@ -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 }],

1
internal/lint-configs/stylelint-config/index.mjs
View File

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

2
internal/lint-configs/stylelint-config/package.json
View File

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

2
internal/node-utils/package.json
View File

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

2
internal/tailwind-config/package.json
View File

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

2
internal/tsconfig/package.json
View File

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

2
internal/vite-config/package.json
View File

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

257
internal/vite-config/src/typing.ts
View File

@ -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 {

6
package.json
View File

@ -1,6 +1,6 @@
{
"name": "vben-admin-monorepo",
"version": "5.5.4",
"version": "5.5.5",
"private": true,
"keywords": [
"monorepo",
@ -96,7 +96,7 @@
"node": ">=20.10.0",
"pnpm": ">=9.12.0"
},
"packageManager": "pnpm@9.15.9",
"packageManager": "pnpm@10.10.0",
"pnpm": {
"peerDependencyRules": {
"allowedVersions": {
@ -107,7 +107,7 @@
"@ast-grep/napi": "catalog:",
"@ctrl/tinycolor": "catalog:",
"clsx": "catalog:",
"esbuild": "0.24.0",
"esbuild": "0.25.3",
"pinia": "catalog:",
"vue": "catalog:"
},

2
packages/@core/base/design/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben-core/design",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

2
packages/@core/base/icons/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben-core/icons",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

2
packages/@core/base/shared/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben-core/shared",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

1
packages/@core/base/shared/src/utils/inference.ts
View File

@ -1,3 +1,4 @@
// eslint-disable-next-line vue/prefer-import-from-vue
import { isFunction, isObject, isString } from '@vue/shared';
/**

2
packages/@core/base/typings/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben-core/typings",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

2
packages/@core/composables/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben-core/composables",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

2
packages/@core/preferences/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben-core/preferences",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

2
packages/@core/ui-kit/form-ui/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben-core/form-ui",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

8
packages/@core/ui-kit/form-ui/src/form-render/expandable.ts
View File

@ -2,13 +2,18 @@ import type { FormRenderProps } from '../types';
import { computed, nextTick, onMounted, ref, useTemplateRef, watch } from 'vue';
import { breakpointsTailwind, useBreakpoints } from '@vueuse/core';
import {
breakpointsTailwind,
useBreakpoints,
useElementVisibility,
} from '@vueuse/core';
/**
* 动态计算行数
*/
export function useExpandable(props: FormRenderProps) {
const wrapperRef = useTemplateRef<HTMLElement>('wrapperRef');
const isVisible = useElementVisibility(wrapperRef);
const rowMapping = ref<Record<number, number>>({});
// 是否已经计算过一次
const isCalculated = ref(false);
@ -31,6 +36,7 @@ export function useExpandable(props: FormRenderProps) {
() => props.showCollapseButton,
() => breakpoints.active().value,
() => props.schema?.length,
() => isVisible.value,
],
async ([val]) => {
if (val) {

2
packages/@core/ui-kit/layout-ui/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben-core/layout-ui",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

2
packages/@core/ui-kit/menu-ui/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben-core/menu-ui",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

2
packages/@core/ui-kit/menu-ui/src/components/sub-menu-content.vue
View File

@ -10,7 +10,7 @@ import { VbenIcon } from '@vben-core/shadcn-ui';
import { useMenuContext } from '../hooks';
interface Props extends MenuItemProps {
isMenuMore: boolean;
isMenuMore?: boolean;
isTopLevelMenuSubmenu: boolean;
level?: number;
}

12
packages/@core/ui-kit/popup-ui/src/alert/alert.vue
View File

@ -47,6 +47,10 @@ function onAlertClosed() {
isConfirm.value = false;
}
function onEscapeKeyDown() {
isConfirm.value = false;
}
const getIconRender = computed(() => {
let iconRender: Component | null = null;
if (props.icon) {
@ -91,14 +95,13 @@ const getIconRender = computed(() => {
});
function doCancel() {
isConfirm.value = false;
handleCancel();
handleOpenChange(false);
}
function doConfirm() {
isConfirm.value = true;
handleConfirm();
handleOpenChange(false);
emits('confirm');
}
provideAlertContext({
@ -117,7 +120,7 @@ function handleCancel() {
const loading = ref(false);
async function handleOpenChange(val: boolean) {
await nextTick();
await nextTick(); // 等待标记isConfirm状态
if (!val && props.beforeClose) {
loading.value = true;
try {
@ -141,6 +144,7 @@ async function handleOpenChange(val: boolean) {
:overlay-blur="overlayBlur"
@opened="emits('opened')"
@closed="onAlertClosed"
@escape-key-down="onEscapeKeyDown"
:class="
cn(
containerClass,

8
packages/@core/ui-kit/popup-ui/src/drawer/drawer.ts
View File

@ -52,6 +52,10 @@ export interface DrawerProps {
* 弹窗描述
*/
description?: string;
/**
* 在关闭时销毁抽屉
*/
destroyOnClose?: boolean;
/**
* 是否显示底部
* @default true
@ -143,10 +147,6 @@ export interface DrawerApiOptions extends DrawerState {
* 独立的抽屉组件
*/
connectedComponent?: Component;
/**
* 在关闭时销毁抽屉。仅在使用 connectedComponent 时有效
*/
destroyOnClose?: boolean;
/**
* 关闭前的回调，返回 false 可以阻止关闭
* @returns

63
packages/@core/ui-kit/popup-ui/src/drawer/drawer.vue
View File

@ -1,7 +1,7 @@
<script lang="ts" setup>
import type { DrawerProps, ExtendedDrawerApi } from './drawer';
import { computed, provide, ref, useId, watch } from 'vue';
import { computed, provide, ref, unref, useId, watch } from 'vue';
import {
useIsMobile,
@ -35,6 +35,7 @@ interface Props extends DrawerProps {
const props = withDefaults(defineProps<Props>(), {
appendToMain: false,
closeIconPlacement: 'right',
destroyOnClose: true,
drawerApi: undefined,
submitting: false,
zIndex: 1000,
@ -63,6 +64,7 @@ const {
confirmText,
contentClass,
description,
destroyOnClose,
footer: showFooter,
footerClass,
header: showHeader,
@ -80,17 +82,17 @@ const {
zIndex,
} = usePriorityValues(props, state);
watch(
() => showLoading.value,
(v) => {
if (v && wrapperRef.value) {
wrapperRef.value.scrollTo({
// behavior: 'smooth',
top: 0,
});
}
},
);
// watch(
// () => showLoading.value,
// (v) => {
// if (v && wrapperRef.value) {
// wrapperRef.value.scrollTo({
// // behavior: 'smooth',
// top: 0,
// });
// }
// },
// );
function interactOutside(e: Event) {
if (!closeOnClickModal.value || submitting.value) {
@ -131,6 +133,29 @@ const getAppendTo = computed(() => {
? `#${ELEMENT_ID_MAIN_CONTENT}>div:not(.absolute)>div`
: undefined;
});
/**
* destroyOnClose功能完善
*/
// 是否打开过
const hasOpened = ref(false);
const isClosed = ref(true);
watch(
() => state?.value?.isOpen,
(value) => {
isClosed.value = false;
if (value && !unref(hasOpened)) {
hasOpened.value = true;
}
},
);
function handleClosed() {
isClosed.value = true;
props.drawerApi?.onClosed();
}
const getForceMount = computed(() => {
return !unref(destroyOnClose) && unref(hasOpened);
});
</script>
<template>
<Sheet
@ -144,15 +169,17 @@ const getAppendTo = computed(() => {
cn('flex w-[520px] flex-col', drawerClass, {
'!w-full': isMobile || placement === 'bottom' || placement === 'top',
'max-h-[100vh]': placement === 'bottom' || placement === 'top',
hidden: isClosed,
})
"
:modal="modal"
:open="state?.isOpen"
:side="placement"
:z-index="zIndex"
:force-mount="getForceMount"
:overlay-blur="overlayBlur"
@close-auto-focus="handleFocusOutside"
@closed="() => drawerApi?.onClosed()"
@closed="handleClosed"
@escape-key-down="escapeKeyDown"
@focus-outside="handleFocusOutside"
@interact-outside="interactOutside"
@ -239,19 +266,13 @@ const getAppendTo = computed(() => {
ref="wrapperRef"
:class="
cn('relative flex-1 overflow-y-auto p-3', contentClass, {
'overflow-hidden': showLoading,
'pointer-events-none': showLoading || submitting,
})
"
>
<VbenLoading
v-if="showLoading || submitting"
class="size-full"
spinning
/>
<slot></slot>
</div>
<VbenLoading v-if="showLoading || submitting" spinning />
<SheetFooter
v-if="showFooter"
:class="

4
packages/@core/ui-kit/popup-ui/src/drawer/use-drawer.ts
View File

@ -21,7 +21,9 @@ import VbenDrawer from './drawer.vue';
const USER_DRAWER_INJECT_KEY = Symbol('VBEN_DRAWER_INJECT');
const DEFAULT_DRAWER_PROPS: Partial<DrawerProps> = {};
const DEFAULT_DRAWER_PROPS: Partial<DrawerProps> = {
destroyOnClose: true,
};
export function setDefaultDrawerProps(props: Partial<DrawerProps>) {
Object.assign(DEFAULT_DRAWER_PROPS, props);

31
packages/@core/ui-kit/popup-ui/src/modal/modal.vue
View File

@ -123,17 +123,17 @@ watch(
{ immediate: true },
);
watch(
() => [showLoading.value, submitting.value],
([l, s]) => {
if ((s || l) && wrapperRef.value) {
wrapperRef.value.scrollTo({
// behavior: 'smooth',
top: 0,
});
}
},
);
// watch(
// () => [showLoading.value, submitting.value],
// ([l, s]) => {
// if ((s || l) && wrapperRef.value) {
// wrapperRef.value.scrollTo({
// // behavior: 'smooth',
// top: 0,
// });
// }
// },
// );
function handleFullscreen() {
props.modalApi?.setState((prev) => {
@ -274,18 +274,13 @@ function handleClosed() {
ref="wrapperRef"
:class="
cn('relative min-h-40 flex-1 overflow-y-auto p-3', contentClass, {
'overflow-hidden': showLoading || submitting,
'pointer-events-none': showLoading || submitting,
})
"
>
<VbenLoading
v-if="showLoading || submitting"
class="size-full h-auto min-h-full"
spinning
/>
<slot></slot>
</div>
<VbenLoading v-if="showLoading || submitting" spinning />
<VbenIconButton
v-if="fullscreenButton"
class="hover:bg-accent hover:text-accent-foreground text-foreground/80 flex-center absolute right-10 top-3 hidden size-6 rounded-full px-1 text-lg opacity-70 transition-opacity hover:opacity-100 focus:outline-none disabled:pointer-events-none sm:block"

29
packages/@core/ui-kit/popup-ui/src/modal/use-modal.ts
View File

@ -1,6 +1,14 @@
import type { ExtendedModalApi, ModalApiOptions, ModalProps } from './modal';
import { defineComponent, h, inject, nextTick, provide, reactive } from 'vue';
import {
defineComponent,
h,
inject,
nextTick,
provide,
reactive,
ref,
} from 'vue';
import { useStore } from '@vben-core/shared/store';
@ -9,7 +17,9 @@ import VbenModal from './modal.vue';
const USER_MODAL_INJECT_KEY = Symbol('VBEN_MODAL_INJECT');
const DEFAULT_MODAL_PROPS: Partial<ModalProps> = {};
const DEFAULT_MODAL_PROPS: Partial<ModalProps> = {
destroyOnClose: true,
};
export function setDefaultModalProps(props: Partial<ModalProps>) {
Object.assign(DEFAULT_MODAL_PROPS, props);
@ -24,6 +34,7 @@ export function useVbenModal<TParentModalProps extends ModalProps = ModalProps>(
const { connectedComponent } = options;
if (connectedComponent) {
const extendedApi = reactive({});
const isModalReady = ref(true);
const Modal = defineComponent(
(props: TParentModalProps, { attrs, slots }) => {
provide(USER_MODAL_INJECT_KEY, {
@ -33,6 +44,11 @@ export function useVbenModal<TParentModalProps extends ModalProps = ModalProps>(
Object.setPrototypeOf(extendedApi, api);
},
options,
async reCreateModal() {
isModalReady.value = false;
await nextTick();
isModalReady.value = true;
},
});
checkProps(extendedApi as ExtendedModalApi, {
...props,
@ -41,7 +57,7 @@ export function useVbenModal<TParentModalProps extends ModalProps = ModalProps>(
});
return () =>
h(
connectedComponent,
isModalReady.value ? connectedComponent : 'div',
{
...props,
...attrs,
@ -70,6 +86,13 @@ export function useVbenModal<TParentModalProps extends ModalProps = ModalProps>(
injectData.options?.onOpenChange?.(isOpen);
};
mergedOptions.onClosed = () => {
options.onClosed?.();
if (mergedOptions.destroyOnClose) {
injectData.reCreateModal?.();
}
};
const api = new ModalApi(mergedOptions);
const extendedApi: ExtendedModalApi = api as never;

2
packages/@core/ui-kit/shadcn-ui/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben-core/shadcn-ui",
"version": "5.5.4",
"version": "5.5.5",
"#main": "./dist/index.mjs",
"#module": "./dist/index.mjs",
"homepage": "https://github.com/vbenjs/vue-vben-admin",

3
packages/@core/ui-kit/shadcn-ui/src/components/button/check-button-group.vue
View File

@ -41,7 +41,6 @@ watch(
innerValue.value.length > 0 ? innerValue.value[0] : undefined;
}
},
{ immediate: true },
);
watch(
@ -60,7 +59,7 @@ watch(
innerValue.value = val === undefined ? [] : [val as ValueType];
}
},
{ deep: true },
{ deep: true, immediate: true },
);
async function onBtnClick(value: ValueType) {

2
packages/@core/ui-kit/shadcn-ui/src/components/segmented/segmented.vue
View File

@ -10,7 +10,7 @@ import TabsIndicator from './tabs-indicator.vue';
interface Props {
defaultValue?: string;
tabs: SegmentedItem[];
tabs?: SegmentedItem[];
}
const props = withDefaults(defineProps<Props>(), {

26
packages/@core/ui-kit/shadcn-ui/src/components/select/select.vue
View File

@ -1,4 +1,6 @@
<script lang="ts" setup>
import { CircleX } from '@vben-core/icons';
import {
Select,
SelectContent,
@ -8,6 +10,7 @@ import {
} from '../../ui';
interface Props {
allowClear?: boolean;
class?: any;
// 弹出层的类名
contentClass?: any;
@ -15,12 +18,27 @@ interface Props {
placeholder?: string;
}
const props = defineProps<Props>();
const props = withDefaults(defineProps<Props>(), {
allowClear: false,
});
const modelValue = defineModel<string>();
function handleClear() {
modelValue.value = undefined;
}
</script>
<template>
<Select>
<SelectTrigger :class="props.class">
<SelectValue :placeholder="placeholder" />
<Select v-model="modelValue">
<SelectTrigger :class="props.class" class="flex w-full items-center">
<SelectValue class="flex-auto text-left" :placeholder="placeholder" />
<CircleX
@pointerdown.stop
@click.stop.prevent="handleClear"
v-if="allowClear && modelValue"
data-clear-button
class="mr-1 size-4 cursor-pointer opacity-50 hover:opacity-100"
/>
</SelectTrigger>
<SelectContent :class="props.contentClass">
<template v-for="item in options" :key="item.value">

2
packages/@core/ui-kit/tabs-ui/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben-core/tabs-ui",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

2
packages/constants/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben/constants",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

2
packages/effects/access/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben/access",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

10
packages/effects/access/src/accessible.ts
View File

@ -50,7 +50,15 @@ async function generateAccessible(
delete route.component;
}
// 根据router name判断，如果路由已经存在，则不再添加
if (!names?.includes(route.name)) {
if (names?.includes(route.name)) {
// 找到已存在的路由索引并更新，不更新会造成切换用户时，一级目录未更新，homePath 在二级目录导致的404问题
const index = root.children?.findIndex(
(item) => item.name === route.name,
);
if (index !== undefined && index !== -1 && root.children) {
root.children[index] = route;
}
} else {
root.children?.push(route);
}
} else {

2
packages/effects/common-ui/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben/common-ui",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

2
packages/effects/common-ui/src/components/captcha/hooks/useCaptchaPoints.ts
View File

@ -9,7 +9,7 @@ export function useCaptchaPoints() {
}
function clearPoints() {
points.splice(0, points.length);
points.splice(0);
}
return {
addPoint,

2
packages/effects/common-ui/src/components/json-viewer/style.scss
View File

@ -65,7 +65,7 @@
&.jv-string {
color: hsl(var(--primary));
word-break: break-word;
overflow-wrap: break-word;
white-space: normal;
}
}

8
packages/effects/common-ui/src/components/page/page.vue
View File

@ -3,15 +3,17 @@ import type { StyleValue } from 'vue';
import type { PageProps } from './types';
import { computed, nextTick, onMounted, ref, useTemplateRef } from 'vue';
import { CSS_VARIABLE_LAYOUT_CONTENT_HEIGHT } from '@vben-core/shared/constants';
import { cn } from '@vben-core/shared/utils';
import { computed, nextTick, onMounted, ref, useTemplateRef } from 'vue';
defineOptions({
name: 'Page',
});
const { autoContentHeight = false } = defineProps<PageProps>();
const { autoContentHeight = false, heightOffset = 0 } =
defineProps<PageProps>();
const headerHeight = ref(0);
const footerHeight = ref(0);
@ -23,7 +25,7 @@ const footerRef = useTemplateRef<HTMLDivElement>('footerRef');
const contentStyle = computed<StyleValue>(() => {
if (autoContentHeight) {
return {
height: `calc(var(${CSS_VARIABLE_LAYOUT_CONTENT_HEIGHT}) - ${headerHeight.value}px)`,
height: `calc(var(${CSS_VARIABLE_LAYOUT_CONTENT_HEIGHT}) - ${headerHeight.value}px - ${typeof heightOffset === 'number' ? `${heightOffset}px` : heightOffset})`,
overflowY: shouldAutoHeight.value ? 'auto' : 'unset',
};
}

6
packages/effects/common-ui/src/components/page/types.ts
View File

@ -8,4 +8,10 @@ export interface PageProps {
autoContentHeight?: boolean;
headerClass?: string;
footerClass?: string;
/**
* Custom height offset value (in pixels) to adjust content area sizing
* when used with autoContentHeight
* @default 0
*/
heightOffset?: number;
}

8
packages/effects/common-ui/src/ui/authentication/login.vue
View File

@ -3,18 +3,20 @@ import type { VbenFormSchema } from '@vben-core/form-ui';
import type { AuthenticationProps, LoginAndRegisterParams } from './types';
import { computed, onMounted, reactive, ref } from 'vue';
import { useRouter } from 'vue-router';
import { $t } from '@vben/locales';
import { useVbenForm } from '@vben-core/form-ui';
import { VbenButton, VbenCheckbox } from '@vben-core/shadcn-ui';
import { cloneDeep } from '@vben-core/shared/utils';
import { computed, onMounted, reactive, ref } from 'vue';
import { useRouter } from 'vue-router';
import Title from './auth-title.vue';
import ThirdPartyLogin from './third-party-login.vue';
interface Props extends AuthenticationProps {
formSchema: VbenFormSchema[];
formSchema?: VbenFormSchema[];
}
defineOptions({

11
packages/effects/common-ui/src/ui/authentication/register.vue
View File

@ -1,17 +1,20 @@
<script setup lang="ts">
import type { Recordable } from '@vben/types';
import type { VbenFormSchema } from '@vben-core/form-ui';
import { $t } from '@vben/locales';
import { useVbenForm } from '@vben-core/form-ui';
import { VbenButton } from '@vben-core/shadcn-ui';
import { computed, reactive } from 'vue';
import { useRouter } from 'vue-router';
import { $t } from '@vben/locales';
import { useVbenForm } from '@vben-core/form-ui';
import { VbenButton } from '@vben-core/shadcn-ui';
import Title from './auth-title.vue';
interface Props {
formSchema: VbenFormSchema[];
formSchema?: VbenFormSchema[];
/**
* @zh_CN 是否处于加载处理状态
*/

2
packages/effects/common-ui/src/ui/dashboard/analysis/analysis-charts-tabs.vue
View File

@ -6,7 +6,7 @@ import { computed } from 'vue';
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@vben-core/shadcn-ui';
interface Props {
tabs: TabOption[];
tabs?: TabOption[];
}
defineOptions({

2
packages/effects/common-ui/src/ui/dashboard/analysis/analysis-overview.vue
View File

@ -12,7 +12,7 @@ import {
} from '@vben-core/shadcn-ui';
interface Props {
items: AnalysisOverviewItem[];
items?: AnalysisOverviewItem[];
}
defineOptions({

4
packages/effects/common-ui/src/ui/dashboard/workbench/workbench-project.vue
View File

@ -10,7 +10,7 @@ import {
} from '@vben-core/shadcn-ui';
interface Props {
items: WorkbenchProjectItem[];
items?: WorkbenchProjectItem[];
title: string;
}
@ -37,6 +37,8 @@ defineEmits(['click']);
'border-r-0': index % 3 === 2,
'border-b-0': index < 3,
'pb-4': index > 2,
'rounded-bl-xl': index === items.length - 3,
'rounded-br-xl': index === items.length - 1,
}"
class="border-border group w-full cursor-pointer border-r border-t p-4 transition-all hover:shadow-xl md:w-1/2 lg:w-1/3"
>

6
packages/effects/common-ui/src/ui/dashboard/workbench/workbench-quick-nav.vue
View File

@ -10,7 +10,7 @@ import {
} from '@vben-core/shadcn-ui';
interface Props {
items: WorkbenchQuickNavItem[];
items?: WorkbenchQuickNavItem[];
title: string;
}
@ -35,8 +35,10 @@ defineEmits(['click']);
<div
:class="{
'border-r-0': index % 3 === 2,
'pb-4': index > 2,
'border-b-0': index < 3,
'pb-4': index > 2,
'rounded-bl-xl': index === items.length - 3,
'rounded-br-xl': index === items.length - 1,
}"
class="flex-col-center border-border group w-1/3 cursor-pointer border-r border-t py-8 hover:shadow-xl"
@click="$emit('click', item)"

2
packages/effects/common-ui/src/ui/dashboard/workbench/workbench-todo.vue
View File

@ -10,7 +10,7 @@ import {
} from '@vben-core/shadcn-ui';
interface Props {
items: WorkbenchTodoItem[];
items?: WorkbenchTodoItem[];
title: string;
}

2
packages/effects/common-ui/src/ui/dashboard/workbench/workbench-trends.vue
View File

@ -10,7 +10,7 @@ import {
} from '@vben-core/shadcn-ui';
interface Props {
items: WorkbenchTrendItem[];
items?: WorkbenchTrendItem[];
title: string;
}

2
packages/effects/hooks/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben/hooks",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

2
packages/effects/layouts/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben/layouts",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

4
packages/effects/layouts/src/basic/copyright/copyright.vue
View File

@ -1,8 +1,8 @@
<script lang="ts" setup>
interface Props {
companyName: string;
companyName?: string;
companySiteLink?: string;
date: string;
date?: string;
icp?: string;
icpLink?: string;
}

6
packages/effects/layouts/src/basic/layout.vue
View File

@ -12,7 +12,7 @@ import {
updatePreferences,
usePreferences,
} from '@vben/preferences';
import { useLockStore } from '@vben/stores';
import { useAccessStore } from '@vben/stores';
import { cloneDeep, mapTree } from '@vben/utils';
import { VbenAdminLayout } from '@vben-core/layout-ui';
@ -49,7 +49,7 @@ const {
sidebarCollapsed,
theme,
} = usePreferences();
const lockStore = useLockStore();
const accessStore = useAccessStore();
const { refresh } = useRefresh();
const sidebarTheme = computed(() => {
@ -356,7 +356,7 @@ const headerSlots = computed(() => {
/>
<Transition v-if="preferences.widget.lockScreen" name="slide-up">
<slot v-if="lockStore.isLockScreen" name="lock-screen"></slot>
<slot v-if="accessStore.isLockScreen" name="lock-screen"></slot>
</Transition>
<template v-if="preferencesButtonPosition.fixed">

6
packages/effects/layouts/src/basic/menu/extra-menu.vue
View File

@ -1,15 +1,17 @@
<script lang="ts" setup>
import type { MenuRecordRaw } from '@vben/types';
import type { MenuProps } from '@vben-core/menu-ui';
import { Menu } from '@vben-core/menu-ui';
import { useRoute } from 'vue-router';
import { Menu } from '@vben-core/menu-ui';
import { useNavigation } from './use-navigation';
interface Props extends MenuProps {
collapse?: boolean;
menus: MenuRecordRaw[];
menus?: MenuRecordRaw[];
}
withDefaults(defineProps<Props>(), {

3
packages/effects/layouts/src/basic/menu/menu.vue
View File

@ -1,11 +1,12 @@
<script lang="ts" setup>
import type { MenuRecordRaw } from '@vben/types';
import type { MenuProps } from '@vben-core/menu-ui';
import { Menu } from '@vben-core/menu-ui';
interface Props extends MenuProps {
menus: MenuRecordRaw[];
menus?: MenuRecordRaw[];
}
const props = withDefaults(defineProps<Props>(), {

2
packages/effects/layouts/src/basic/menu/use-mixed-menu.ts
View File

@ -74,7 +74,7 @@ function useMixedMenu() {
*/
const headerActive = computed(() => {
if (!needSplit.value) {
return route.path;
return route.meta?.activePath ?? route.path;
}
return rootMenuPath.value;
});

7
packages/effects/layouts/src/widgets/global-search/global-search.vue
View File

@ -1,6 +1,8 @@
<script setup lang="ts">
import type { MenuRecordRaw } from '@vben/types';
import { nextTick, onMounted, onUnmounted, ref, watch } from 'vue';
import {
ArrowDown,
ArrowUp,
@ -10,9 +12,10 @@ import {
} from '@vben/icons';
import { $t } from '@vben/locales';
import { isWindowsOs } from '@vben/utils';
import { useVbenModal } from '@vben-core/popup-ui';
import { useMagicKeys, whenever } from '@vueuse/core';
import { nextTick, onMounted, onUnmounted, ref, watch } from 'vue';
import SearchPanel from './search-panel.vue';
@ -21,7 +24,7 @@ defineOptions({
});
const props = withDefaults(
defineProps<{ enableShortcutKey?: boolean; menus: MenuRecordRaw[] }>(),
defineProps<{ enableShortcutKey?: boolean; menus?: MenuRecordRaw[] }>(),
{
enableShortcutKey: true,
menus: () => [],

9
packages/effects/layouts/src/widgets/global-search/search-panel.vue
View File

@ -1,21 +1,24 @@
<script setup lang="ts">
import type { MenuRecordRaw } from '@vben/types';
import { nextTick, onMounted, ref, shallowRef, watch } from 'vue';
import { useRouter } from 'vue-router';
import { SearchX, X } from '@vben/icons';
import { $t } from '@vben/locales';
import { mapTree, traverseTreeValues, uniqueByField } from '@vben/utils';
import { VbenIcon, VbenScrollbar } from '@vben-core/shadcn-ui';
import { isHttpUrl } from '@vben-core/shared/utils';
import { onKeyStroke, useLocalStorage, useThrottleFn } from '@vueuse/core';
import { nextTick, onMounted, ref, shallowRef, watch } from 'vue';
import { useRouter } from 'vue-router';
defineOptions({
name: 'SearchPanel',
});
const props = withDefaults(
defineProps<{ keyword: string; menus: MenuRecordRaw[] }>(),
defineProps<{ keyword?: string; menus?: MenuRecordRaw[] }>(),
{
keyword: '',
menus: () => [],

13
packages/effects/layouts/src/widgets/lock-screen/lock-screen.vue
View File

@ -1,12 +1,15 @@
<script setup lang="ts">
import { computed, reactive, ref } from 'vue';
import { LockKeyhole } from '@vben/icons';
import { $t, useI18n } from '@vben/locales';
import { storeToRefs, useLockStore } from '@vben/stores';
import { storeToRefs, useAccessStore } from '@vben/stores';
import { useScrollLock } from '@vben-core/composables';
import { useVbenForm, z } from '@vben-core/form-ui';
import { VbenAvatar, VbenButton } from '@vben-core/shadcn-ui';
import { useDateFormat, useNow } from '@vueuse/core';
import { computed, reactive, ref } from 'vue';
interface Props {
avatar?: string;
@ -23,7 +26,7 @@ withDefaults(defineProps<Props>(), {
defineEmits<{ toLogin: [] }>();
const { locale } = useI18n();
const lockStore = useLockStore();
const accessStore = useAccessStore();
const now = useNow();
const meridiem = useDateFormat(now, 'A');
@ -32,7 +35,7 @@ const minute = useDateFormat(now, 'mm');
const date = useDateFormat(now, 'YYYY-MM-DD dddd', { locales: locale.value });
const showUnlockForm = ref(false);
const { lockScreenPassword } = storeToRefs(lockStore);
const { lockScreenPassword } = storeToRefs(accessStore);
const [Form, { form, validate }] = useVbenForm(
reactive({
@ -63,7 +66,7 @@ async function handleSubmit() {
const { valid } = await validate();
if (valid) {
if (validPass.value) {
lockStore.unlockScreen();
accessStore.unlockScreen();
} else {
form.setFieldError('password', $t('authentication.passwordErrorTip'));
}

2
packages/effects/layouts/src/widgets/preferences/blocks/checkbox-item.vue
View File

@ -14,7 +14,7 @@ defineOptions({
withDefaults(
defineProps<{
disabled?: boolean;
items: SelectOption[];
items?: SelectOption[];
multiple?: boolean;
onBtnClick?: (value: string) => void;
placeholder?: string;

2
packages/effects/layouts/src/widgets/preferences/blocks/toggle-item.vue
View File

@ -7,7 +7,7 @@ defineOptions({
name: 'PreferenceToggleItem',
});
withDefaults(defineProps<{ disabled?: boolean; items: SelectOption[] }>(), {
withDefaults(defineProps<{ disabled?: boolean; items?: SelectOption[] }>(), {
disabled: false,
items: () => [],
});

14
packages/effects/layouts/src/widgets/user-dropdown/user-dropdown.vue
View File

@ -1,13 +1,17 @@
<script setup lang="ts">
import type { AnyFunction } from '@vben/types';
import type { Component } from 'vue';
import type { AnyFunction } from '@vben/types';
import { computed, useTemplateRef, watch } from 'vue';
import { useHoverToggle } from '@vben/hooks';
import { LockKeyhole, LogOut } from '@vben/icons';
import { $t } from '@vben/locales';
import { preferences, usePreferences } from '@vben/preferences';
import { useLockStore } from '@vben/stores';
import { useAccessStore } from '@vben/stores';
import { isWindowsOs } from '@vben/utils';
import { useVbenModal } from '@vben-core/popup-ui';
import {
Badge,
@ -21,8 +25,8 @@ import {
VbenAvatar,
VbenIcon,
} from '@vben-core/shadcn-ui';
import { useMagicKeys, whenever } from '@vueuse/core';
import { computed, useTemplateRef, watch } from 'vue';
import { LockScreenModal } from '../lock-screen';
@ -78,7 +82,7 @@ const emit = defineEmits<{ logout: [] }>();
const { globalLockScreenShortcutKey, globalLogoutShortcutKey } =
usePreferences();
const lockStore = useLockStore();
const accessStore = useAccessStore();
const [LockModal, lockModalApi] = useVbenModal({
connectedComponent: LockScreenModal,
});
@ -129,7 +133,7 @@ function handleOpenLock() {
function handleSubmitLock(lockScreenPassword: string) {
lockModalApi.close();
lockStore.lockScreen(lockScreenPassword);
accessStore.lockScreen(lockScreenPassword);
}
function handleLogout() {

2
packages/effects/plugins/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben/plugins",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

7
packages/effects/plugins/src/vxe-table/style.css
View File

@ -45,13 +45,12 @@
);
--vxe-ui-table-row-current-background-color: hsl(var(--accent));
--vxe-ui-table-row-hover-current-background-color: hsl(var(--accent-hover));
--vxe-ui-font-primary-tinge-color: hsl(var(--primary));
--vxe-ui-font-primary-lighten-color: hsl(var(--primary) / 60%);
--vxe-ui-font-primary-darken-color: hsl(var(--primary));
/* --vxe-ui-table-fixed-scrolling-box-shadow-color: rgb(0 0 0 / 80%); */
/** 右上角toolbar按钮色/翻页主题色保持一致 */
--vxe-ui-font-primary-lighten-color: hsl(var(--primary-500));
--vxe-ui-font-primary-darken-color: hsl(var(--primary-600));
height: auto !important;
}

2
packages/effects/plugins/src/vxe-table/use-vxe-grid.ts
View File

@ -24,8 +24,8 @@ export function useVbenVxeGrid(options: VxeGridProps) {
return () => h(VxeGrid, { ...props, ...attrs, api: extendedApi }, slots);
},
{
inheritAttrs: false,
name: 'VbenVxeGrid',
inheritAttrs: false,
},
);
// Add reactivity support

4
packages/effects/plugins/src/vxe-table/use-vxe-grid.vue
View File

@ -150,7 +150,9 @@ const toolbarOptions = computed(() => {
icon: 'vxe-icon-search',
circle: true,
status: showSearchForm.value ? 'primary' : undefined,
title: $t('common.search'),
title: showSearchForm.value
? $t('common.hideSearchPanel')
: $t('common.showSearchPanel'),
};
// 将搜索按钮合并到用户配置的toolbarConfig.tools中
const toolbarConfig: VxeGridPropTypes.ToolbarConfig = {

2
packages/effects/request/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben/request",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

2
packages/icons/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben/icons",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

2
packages/locales/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben/locales",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

4
packages/locales/src/langs/en-US/common.json
View File

@ -18,5 +18,7 @@
"delete": "Delete",
"create": "Create",
"yes": "Yes",
"no": "No"
"no": "No",
"showSearchPanel": "Show search panel",
"hideSearchPanel": "Hide search panel"
}

4
packages/locales/src/langs/zh-CN/common.json
View File

@ -18,5 +18,7 @@
"delete": "删除",
"create": "新增",
"yes": "是",
"no": "否"
"no": "否",
"showSearchPanel": "显示搜索面板",
"hideSearchPanel": "隐藏搜索面板"
}

2
packages/preferences/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben/preferences",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {

3
packages/stores/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@vben/stores",
"version": "5.5.4",
"version": "5.5.5",
"homepage": "https://github.com/vbenjs/vue-vben-admin",
"bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
"repository": {
@ -25,6 +25,7 @@
"@vben-core/typings": "workspace:*",
"pinia": "catalog:",
"pinia-plugin-persistedstate": "catalog:",
"secure-ls": "catalog:",
"vue": "catalog:",
"vue-router": "catalog:"
}

29
packages/stores/src/modules/access.ts
View File

@ -1,6 +1,7 @@
import type { MenuRecordRaw } from '@vben-core/typings';
import type { RouteRecordRaw } from 'vue-router';
import type { MenuRecordRaw } from '@vben-core/typings';
import { acceptHMRUpdate, defineStore } from 'pinia';
type AccessToken = null | string;
@ -26,6 +27,14 @@ interface AccessState {
* 是否已经检查过权限
*/
isAccessChecked: boolean;
/**
* 是否锁屏状态
*/
isLockScreen: boolean;
/**
* 锁屏密码
*/
lockScreenPassword?: string;
/**
* 登录是否过期
*/
@ -60,6 +69,10 @@ export const useAccessStore = defineStore('core-access', {
}
return findMenu(this.accessMenus, path);
},
lockScreen(password: string) {
this.isLockScreen = true;
this.lockScreenPassword = password;
},
setAccessCodes(codes: string[]) {
this.accessCodes = codes;
},
@ -81,10 +94,20 @@ export const useAccessStore = defineStore('core-access', {
setRefreshToken(token: AccessToken) {
this.refreshToken = token;
},
unlockScreen() {
this.isLockScreen = false;
this.lockScreenPassword = undefined;
},
},
persist: {
// 持久化
pick: ['accessToken', 'refreshToken', 'accessCodes'],
pick: [
'accessToken',
'refreshToken',
'accessCodes',
'isLockScreen',
'lockScreenPassword',
],
},
state: (): AccessState => ({
accessCodes: [],
@ -92,6 +115,8 @@ export const useAccessStore = defineStore('core-access', {
accessRoutes: [],
accessToken: null,
isAccessChecked: false,
isLockScreen: false,
lockScreenPassword: undefined,
loginExpired: false,
refreshToken: null,
}),

Some files were not shown because too many files have changed in this diff Show More