fix: alert beforeClose callback arguments fixed (#5845)

This commit is contained in:
Netfan
2025-04-01 22:55:29 +08:00
committed by GitHub
parent 1d9f1be004
commit ecf518bb02
5 changed files with 43 additions and 21 deletions

View File

@@ -2,7 +2,7 @@ import type { Component } from 'vue';
import type { Recordable } from '@vben-core/typings';
import type { AlertProps } from './alert';
import type { AlertProps, BeforeCloseScope } from './alert';
import { h, ref, render } from 'vue';
@@ -131,9 +131,10 @@ export function vbenConfirm(
export async function vbenPrompt<T = any>(
options: Omit<AlertProps, 'beforeClose'> & {
beforeClose?: (
val: T,
) => boolean | Promise<boolean | undefined> | undefined;
beforeClose?: (scope: {
isConfirm: boolean;
value: T | undefined;
}) => boolean | Promise<boolean | undefined> | undefined;
component?: Component;
componentProps?: Recordable<any>;
defaultValue?: T;
@@ -165,9 +166,12 @@ export async function vbenPrompt<T = any>(
contents.push(componentRef);
const props: AlertProps & Recordable<any> = {
...delegated,
async beforeClose() {
async beforeClose(scope: BeforeCloseScope) {
if (delegated.beforeClose) {
return await delegated.beforeClose(modelValue.value);
return await delegated.beforeClose({
...scope,
value: modelValue.value,
});
}
},
content: h(

View File

@@ -2,9 +2,15 @@ import type { Component } from 'vue';
export type IconType = 'error' | 'info' | 'question' | 'success' | 'warning';
export type BeforeCloseScope = {
isConfirm: boolean;
};
export type AlertProps = {
/** 关闭前的回调如果返回false则终止关闭 */
beforeClose?: () => boolean | Promise<boolean | undefined> | undefined;
beforeClose?: (
scope: BeforeCloseScope,
) => boolean | Promise<boolean | undefined> | undefined;
/** 边框 */
bordered?: boolean;
/** 取消按钮的标题 */

View File

@@ -92,15 +92,17 @@ function handleConfirm() {
isConfirm.value = true;
emits('confirm');
}
function handleCancel() {
open.value = false;
isConfirm.value = false;
}
const loading = ref(false);
async function handleOpenChange(val: boolean) {
if (!val && props.beforeClose) {
loading.value = true;
try {
const res = await props.beforeClose();
const res = await props.beforeClose({ isConfirm: isConfirm.value });
if (res !== false) {
open.value = false;
}
@@ -141,6 +143,7 @@ async function handleOpenChange(val: boolean) {
size="icon"
class="rounded-full"
:disabled="loading"
@click="handleCancel"
>
<X class="text-muted-foreground size-4" />
</VbenButton>
@@ -154,22 +157,20 @@ async function handleOpenChange(val: boolean) {
<VbenLoading v-if="loading" :spinning="loading" />
</AlertDialogDescription>
<div class="flex justify-end gap-x-2">
<AlertDialogCancel
v-if="showCancel"
@click="handleCancel"
:disabled="loading"
>
<AlertDialogCancel v-if="showCancel" :disabled="loading">
<component
:is="components.DefaultButton || VbenButton"
variant="ghost"
@click="handleCancel"
>
{{ cancelText || $t('cancel') }}
</component>
</AlertDialogCancel>
<AlertDialogAction @click="handleConfirm">
<AlertDialogAction>
<component
:is="components.PrimaryButton || VbenButton"
:loading="loading"
@click="handleConfirm"
>
{{ confirmText || $t('confirm') }}
</component>