diff --git a/apps/web-antd/package.json b/apps/web-antd/package.json index fcc647708..a74ce8d0a 100644 --- a/apps/web-antd/package.json +++ b/apps/web-antd/package.json @@ -1,6 +1,6 @@ { "name": "@vben/web-antd", - "version": "5.5.7", + "version": "5.5.8", "homepage": "https://vben.pro", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/apps/web-ele/package.json b/apps/web-ele/package.json index a2d84f231..43a43dac7 100644 --- a/apps/web-ele/package.json +++ b/apps/web-ele/package.json @@ -1,6 +1,6 @@ { "name": "@vben/web-ele", - "version": "5.5.7", + "version": "5.5.8", "homepage": "https://vben.pro", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/apps/web-naive/package.json b/apps/web-naive/package.json index dcce96ca2..0a5b6b316 100644 --- a/apps/web-naive/package.json +++ b/apps/web-naive/package.json @@ -1,6 +1,6 @@ { "name": "@vben/web-naive", - "version": "5.5.7", + "version": "5.5.8", "homepage": "https://vben.pro", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/docs/package.json b/docs/package.json index f57dfc854..639ca07a4 100644 --- a/docs/package.json +++ b/docs/package.json @@ -1,6 +1,6 @@ { "name": "@vben/docs", - "version": "5.5.7", + "version": "5.5.8", "private": true, "scripts": { "build": "vitepress build", diff --git a/docs/src/components/common-ui/vben-modal.md b/docs/src/components/common-ui/vben-modal.md index 3c8200f90..fc714e279 100644 --- a/docs/src/components/common-ui/vben-modal.md +++ b/docs/src/components/common-ui/vben-modal.md @@ -56,6 +56,15 @@ Modal 内的内容一般业务中,会比较复杂,所以我们可以将 moda +## 动画类型 + +通过 `animationType` 属性可以控制弹窗的动画效果: + +- `slide`(默认):从顶部向下滑动进入/退出 +- `scale`:缩放淡入/淡出效果 + + + ::: info 注意 - `VbenModal` 组件对与参数的处理优先级是 `slot` > `props` > `state`(通过api更新的状态以及useVbenModal参数)。如果你已经传入了 `slot` 或者 `props`,那么 `setState` 将不会生效,这种情况下你可以通过 `slot` 或者 `props` 来更新状态。 @@ -112,6 +121,7 @@ const [Modal, modalApi] = useVbenModal({ | bordered | 是否显示border | `boolean` | `false` | | zIndex | 弹窗的ZIndex层级 | `number` | `1000` | | overlayBlur | 遮罩模糊度 | `number` | - | +| animationType | 动画类型 | `'slide' \| 'scale'` | `'slide'` | | submitting | 标记为提交中,锁定弹窗当前状态 | `boolean` | `false` | ::: info appendToMain diff --git a/docs/src/demos/vben-modal/animation-type/index.vue b/docs/src/demos/vben-modal/animation-type/index.vue new file mode 100644 index 000000000..79ba9d33a --- /dev/null +++ b/docs/src/demos/vben-modal/animation-type/index.vue @@ -0,0 +1,36 @@ + + + diff --git a/internal/lint-configs/commitlint-config/package.json b/internal/lint-configs/commitlint-config/package.json index a137f947b..16984c2f9 100644 --- a/internal/lint-configs/commitlint-config/package.json +++ b/internal/lint-configs/commitlint-config/package.json @@ -1,6 +1,6 @@ { "name": "@vben/commitlint-config", - "version": "5.5.7", + "version": "5.5.8", "private": true, "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", diff --git a/internal/lint-configs/stylelint-config/package.json b/internal/lint-configs/stylelint-config/package.json index 8e2a97c2c..00f9b1d18 100644 --- a/internal/lint-configs/stylelint-config/package.json +++ b/internal/lint-configs/stylelint-config/package.json @@ -1,6 +1,6 @@ { "name": "@vben/stylelint-config", - "version": "5.5.7", + "version": "5.5.8", "private": true, "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", diff --git a/internal/node-utils/package.json b/internal/node-utils/package.json index 8b8db7454..490df9e92 100644 --- a/internal/node-utils/package.json +++ b/internal/node-utils/package.json @@ -1,6 +1,6 @@ { "name": "@vben/node-utils", - "version": "5.5.7", + "version": "5.5.8", "private": true, "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", diff --git a/internal/tailwind-config/package.json b/internal/tailwind-config/package.json index 8506891b5..72c63819c 100644 --- a/internal/tailwind-config/package.json +++ b/internal/tailwind-config/package.json @@ -1,6 +1,6 @@ { "name": "@vben/tailwind-config", - "version": "5.5.7", + "version": "5.5.8", "private": true, "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", diff --git a/internal/tsconfig/package.json b/internal/tsconfig/package.json index 44ee3f1b0..74cfb915f 100644 --- a/internal/tsconfig/package.json +++ b/internal/tsconfig/package.json @@ -1,6 +1,6 @@ { "name": "@vben/tsconfig", - "version": "5.5.7", + "version": "5.5.8", "private": true, "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", diff --git a/internal/vite-config/package.json b/internal/vite-config/package.json index d7ba6a655..c37777f24 100644 --- a/internal/vite-config/package.json +++ b/internal/vite-config/package.json @@ -1,6 +1,6 @@ { "name": "@vben/vite-config", - "version": "5.5.6", + "version": "5.5.8", "private": true, "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", diff --git a/package.json b/package.json index 8b87dc385..487cff525 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vben-admin-monorepo", - "version": "5.5.7", + "version": "5.5.8", "private": true, "keywords": [ "monorepo", diff --git a/packages/@core/base/design/package.json b/packages/@core/base/design/package.json index 33e924749..13d2fefcf 100644 --- a/packages/@core/base/design/package.json +++ b/packages/@core/base/design/package.json @@ -1,6 +1,6 @@ { "name": "@vben-core/design", - "version": "5.5.7", + "version": "5.5.8", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/@core/base/icons/package.json b/packages/@core/base/icons/package.json index 9a349883c..1e6e5250c 100644 --- a/packages/@core/base/icons/package.json +++ b/packages/@core/base/icons/package.json @@ -1,6 +1,6 @@ { "name": "@vben-core/icons", - "version": "5.5.7", + "version": "5.5.8", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/@core/base/shared/package.json b/packages/@core/base/shared/package.json index b02cc6e47..6599c54c5 100644 --- a/packages/@core/base/shared/package.json +++ b/packages/@core/base/shared/package.json @@ -1,6 +1,6 @@ { "name": "@vben-core/shared", - "version": "5.5.7", + "version": "5.5.8", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/@core/base/shared/src/utils/__tests__/resources.test.ts b/packages/@core/base/shared/src/utils/__tests__/resources.test.ts new file mode 100644 index 000000000..f14ff896e --- /dev/null +++ b/packages/@core/base/shared/src/utils/__tests__/resources.test.ts @@ -0,0 +1,82 @@ +import { beforeEach, describe, expect, it } from 'vitest'; + +import { loadScript } from '../resources'; + +const testJsPath = + 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js'; + +describe('loadScript', () => { + beforeEach(() => { + // 每个测试前清空 head,保证环境干净 + document.head.innerHTML = ''; + }); + + it('should resolve when the script loads successfully', async () => { + const promise = loadScript(testJsPath); + + // 此时脚本元素已被创建并插入 + const script = document.querySelector( + `script[src="${testJsPath}"]`, + ) as HTMLScriptElement; + expect(script).toBeTruthy(); + + // 模拟加载成功 + script.dispatchEvent(new Event('load')); + + // 等待 promise resolve + await expect(promise).resolves.toBeUndefined(); + }); + + it('should not insert duplicate script and resolve immediately if already loaded', async () => { + // 先手动插入一个相同 src 的 script + const existing = document.createElement('script'); + existing.src = 'bar.js'; + document.head.append(existing); + + // 再次调用 + const promise = loadScript('bar.js'); + + // 立即 resolve + await expect(promise).resolves.toBeUndefined(); + + // head 中只保留一个 + const scripts = document.head.querySelectorAll('script[src="bar.js"]'); + expect(scripts).toHaveLength(1); + }); + + it('should reject when the script fails to load', async () => { + const promise = loadScript('error.js'); + + const script = document.querySelector( + 'script[src="error.js"]', + ) as HTMLScriptElement; + expect(script).toBeTruthy(); + + // 模拟加载失败 + script.dispatchEvent(new Event('error')); + + await expect(promise).rejects.toThrow('Failed to load script: error.js'); + }); + + it('should handle multiple concurrent calls and only insert one script tag', async () => { + const p1 = loadScript(testJsPath); + const p2 = loadScript(testJsPath); + + const script = document.querySelector( + `script[src="${testJsPath}"]`, + ) as HTMLScriptElement; + expect(script).toBeTruthy(); + + // 触发一次 load,两个 promise 都应该 resolve + script.dispatchEvent(new Event('load')); + + await expect(p1).resolves.toBeUndefined(); + await expect(p2).resolves.toBeUndefined(); + + // 只插入一次 + const scripts = document.head.querySelectorAll( + `script[src="${testJsPath}"]`, + ); + expect(scripts).toHaveLength(1); + }); +}); diff --git a/packages/@core/base/shared/src/utils/index.ts b/packages/@core/base/shared/src/utils/index.ts index 0323d0315..ec6ac8346 100644 --- a/packages/@core/base/shared/src/utils/index.ts +++ b/packages/@core/base/shared/src/utils/index.ts @@ -8,6 +8,7 @@ export * from './inference'; export * from './letter'; export * from './merge'; export * from './nprogress'; +export * from './resources'; export * from './state-handler'; export * from './time'; export * from './to'; diff --git a/packages/@core/base/shared/src/utils/resources.ts b/packages/@core/base/shared/src/utils/resources.ts new file mode 100644 index 000000000..c5afa7f10 --- /dev/null +++ b/packages/@core/base/shared/src/utils/resources.ts @@ -0,0 +1,21 @@ +/** + * 加载js文件 + * @param src js文件地址 + */ +function loadScript(src: string) { + return new Promise((resolve, reject) => { + if (document.querySelector(`script[src="${src}"]`)) { + // 如果已经加载过,直接 resolve + return resolve(); + } + const script = document.createElement('script'); + script.src = src; + script.addEventListener('load', () => resolve()); + script.addEventListener('error', () => + reject(new Error(`Failed to load script: ${src}`)), + ); + document.head.append(script); + }); +} + +export { loadScript }; diff --git a/packages/@core/base/typings/package.json b/packages/@core/base/typings/package.json index e2ab18701..e0e2c3727 100644 --- a/packages/@core/base/typings/package.json +++ b/packages/@core/base/typings/package.json @@ -1,6 +1,6 @@ { "name": "@vben-core/typings", - "version": "5.5.7", + "version": "5.5.8", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/@core/composables/package.json b/packages/@core/composables/package.json index 08db5106f..39ca108f4 100644 --- a/packages/@core/composables/package.json +++ b/packages/@core/composables/package.json @@ -1,6 +1,6 @@ { "name": "@vben-core/composables", - "version": "5.5.7", + "version": "5.5.8", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/@core/preferences/package.json b/packages/@core/preferences/package.json index 726b473db..786e6c2ce 100644 --- a/packages/@core/preferences/package.json +++ b/packages/@core/preferences/package.json @@ -1,6 +1,6 @@ { "name": "@vben-core/preferences", - "version": "5.5.7", + "version": "5.5.8", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/@core/ui-kit/form-ui/package.json b/packages/@core/ui-kit/form-ui/package.json index 36ae1678f..497da77a9 100644 --- a/packages/@core/ui-kit/form-ui/package.json +++ b/packages/@core/ui-kit/form-ui/package.json @@ -1,6 +1,6 @@ { "name": "@vben-core/form-ui", - "version": "5.5.7", + "version": "5.5.8", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/@core/ui-kit/layout-ui/package.json b/packages/@core/ui-kit/layout-ui/package.json index 57a462fe1..0cf9ff87a 100644 --- a/packages/@core/ui-kit/layout-ui/package.json +++ b/packages/@core/ui-kit/layout-ui/package.json @@ -1,6 +1,6 @@ { "name": "@vben-core/layout-ui", - "version": "5.5.7", + "version": "5.5.8", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/@core/ui-kit/menu-ui/package.json b/packages/@core/ui-kit/menu-ui/package.json index 760d7646e..3f893168e 100644 --- a/packages/@core/ui-kit/menu-ui/package.json +++ b/packages/@core/ui-kit/menu-ui/package.json @@ -1,6 +1,6 @@ { "name": "@vben-core/menu-ui", - "version": "5.5.7", + "version": "5.5.8", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/@core/ui-kit/popup-ui/src/modal/modal-api.ts b/packages/@core/ui-kit/popup-ui/src/modal/modal-api.ts index 27aa82162..18dc90c4a 100644 --- a/packages/@core/ui-kit/popup-ui/src/modal/modal-api.ts +++ b/packages/@core/ui-kit/popup-ui/src/modal/modal-api.ts @@ -59,6 +59,7 @@ export class ModalApi { showCancelButton: true, showConfirmButton: true, title: '', + animationType: 'slide', }; this.store = new Store( diff --git a/packages/@core/ui-kit/popup-ui/src/modal/modal.ts b/packages/@core/ui-kit/popup-ui/src/modal/modal.ts index 2dbab9e42..fa41344ee 100644 --- a/packages/@core/ui-kit/popup-ui/src/modal/modal.ts +++ b/packages/@core/ui-kit/popup-ui/src/modal/modal.ts @@ -5,6 +5,11 @@ import type { MaybePromise } from '@vben-core/typings'; import type { ModalApi } from './modal-api'; export interface ModalProps { + /** + * 动画类型 + * @default 'slide' + */ + animationType?: 'scale' | 'slide'; /** * 是否要挂载到内容区域 * @default false diff --git a/packages/@core/ui-kit/popup-ui/src/modal/modal.vue b/packages/@core/ui-kit/popup-ui/src/modal/modal.vue index b3fdf3fb4..89184750c 100644 --- a/packages/@core/ui-kit/popup-ui/src/modal/modal.vue +++ b/packages/@core/ui-kit/popup-ui/src/modal/modal.vue @@ -94,12 +94,11 @@ const { submitting, title, titleTooltip, + animationType, zIndex, } = usePriorityValues(props, state); -const shouldFullscreen = computed( - () => (fullscreen.value && header.value) || isMobile.value, -); +const shouldFullscreen = computed(() => fullscreen.value || isMobile.value); const shouldDraggable = computed( () => draggable.value && !shouldFullscreen.value && header.value, @@ -244,6 +243,7 @@ function handleClosed() { :modal="modal" :open="state?.isOpen" :show-close="closable" + :animation-type="animationType" :z-index="zIndex" :overlay-blur="overlayBlur" close-class="top-3" diff --git a/packages/@core/ui-kit/shadcn-ui/package.json b/packages/@core/ui-kit/shadcn-ui/package.json index 11d2918f1..0525a303f 100644 --- a/packages/@core/ui-kit/shadcn-ui/package.json +++ b/packages/@core/ui-kit/shadcn-ui/package.json @@ -1,6 +1,6 @@ { "name": "@vben-core/shadcn-ui", - "version": "5.5.7", + "version": "5.5.8", "#main": "./dist/index.mjs", "#module": "./dist/index.mjs", "homepage": "https://github.com/vbenjs/vue-vben-admin", diff --git a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogContent.vue b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogContent.vue index 9f0789878..22ed845af 100644 --- a/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogContent.vue +++ b/packages/@core/ui-kit/shadcn-ui/src/ui/dialog/DialogContent.vue @@ -20,6 +20,7 @@ import DialogOverlay from './DialogOverlay.vue'; const props = withDefaults( defineProps< DialogContentProps & { + animationType?: 'scale' | 'slide'; appendTo?: HTMLElement | string; class?: ClassType; closeClass?: ClassType; @@ -31,7 +32,12 @@ const props = withDefaults( zIndex?: number; } >(), - { appendTo: 'body', closeDisabled: false, showClose: true }, + { + appendTo: 'body', + animationType: 'slide', + closeDisabled: false, + showClose: true, + }, ); const emits = defineEmits< DialogContentEmits & { close: []; closed: []; opened: [] } @@ -43,6 +49,7 @@ const delegatedProps = computed(() => { modal: _modal, open: _open, showClose: __, + animationType: ___, ...delegated } = props; @@ -100,7 +107,11 @@ defineExpose({ v-bind="forwarded" :class=" cn( - 'z-popup bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-top-[48%] w-full p-6 shadow-lg outline-none sm:rounded-xl', + 'z-popup bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 w-full p-6 shadow-lg outline-none sm:rounded-xl', + { + 'data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-top-[48%]': + animationType === 'slide', + }, props.class, ) " diff --git a/packages/@core/ui-kit/tabs-ui/package.json b/packages/@core/ui-kit/tabs-ui/package.json index bc84b4d6a..93c16e1e2 100644 --- a/packages/@core/ui-kit/tabs-ui/package.json +++ b/packages/@core/ui-kit/tabs-ui/package.json @@ -1,6 +1,6 @@ { "name": "@vben-core/tabs-ui", - "version": "5.5.7", + "version": "5.5.8", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/constants/package.json b/packages/constants/package.json index c71e11847..2b098a2ae 100644 --- a/packages/constants/package.json +++ b/packages/constants/package.json @@ -1,6 +1,6 @@ { "name": "@vben/constants", - "version": "5.5.7", + "version": "5.5.8", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/effects/access/package.json b/packages/effects/access/package.json index e4c39eb2a..f620d6dc2 100644 --- a/packages/effects/access/package.json +++ b/packages/effects/access/package.json @@ -1,6 +1,6 @@ { "name": "@vben/access", - "version": "5.5.7", + "version": "5.5.8", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/effects/common-ui/package.json b/packages/effects/common-ui/package.json index 42e2025d6..81f29135d 100644 --- a/packages/effects/common-ui/package.json +++ b/packages/effects/common-ui/package.json @@ -1,6 +1,6 @@ { "name": "@vben/common-ui", - "version": "5.5.7", + "version": "5.5.8", "homepage": "https://github.com/vbenjs/vue-vben-admin", "bugs": "https://github.com/vbenjs/vue-vben-admin/issues", "repository": { diff --git a/packages/effects/common-ui/src/ui/authentication/dingding-login.vue b/packages/effects/common-ui/src/ui/authentication/dingding-login.vue new file mode 100644 index 000000000..4c63301ee --- /dev/null +++ b/packages/effects/common-ui/src/ui/authentication/dingding-login.vue @@ -0,0 +1,113 @@ + + + + + diff --git a/packages/effects/common-ui/src/ui/authentication/third-party-login.vue b/packages/effects/common-ui/src/ui/authentication/third-party-login.vue index 1f339c7f5..d922049d0 100644 --- a/packages/effects/common-ui/src/ui/authentication/third-party-login.vue +++ b/packages/effects/common-ui/src/ui/authentication/third-party-login.vue @@ -1,5 +1,5 @@