54 lines
1.9 KiB
TypeScript
54 lines
1.9 KiB
TypeScript
|
// 兼容verbatimModuleSyntax：拆分/标记类型与值导入
|
|||
|
|
import { ElMessageBox } from "element-plus";
|
|||
|
|
import type { ElMessageBoxOptions } from "element-plus";
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 极简删除确认框封装（支持返回值判断）
|
|||
|
|
* @param {string} [message] - 自定义删除提示信息（可选）
|
|||
|
|
* @param {Partial<MessageBoxConfirmOptions>} [customOptions] - 自定义配置（可选）
|
|||
|
|
* @returns {Promise<boolean>} 确认返回true，取消/关闭返回false
|
|||
|
|
*/
|
|||
|
|
export const deleteConfirm = (
|
|||
|
|
message?: string,
|
|||
|
|
customOptions?: Partial<ElMessageBoxOptions>
|
|||
|
|
) => {
|
|||
|
|
// 删除场景默认配置
|
|||
|
|
const defaultOptions: ElMessageBoxOptions = {
|
|||
|
|
title: "删除确认",
|
|||
|
|
message: message || "此操作将永久删除该数据，无法恢复，是否继续？",
|
|||
|
|
confirmButtonText: "确认删除",
|
|||
|
|
cancelButtonText: "取消",
|
|||
|
|
type: "error",
|
|||
|
|
//center: true,
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
// 合并默认配置与自定义配置
|
|||
|
|
const finalOptions = { ...defaultOptions, ...customOptions };
|
|||
|
|
|
|||
|
|
// 核心修改：无论确认/取消，都resolve布尔值，不触发reject
|
|||
|
|
return new Promise<boolean>((resolve) => {
|
|||
|
|
ElMessageBox.confirm(finalOptions.message, finalOptions.title, finalOptions)
|
|||
|
|
.then(() => resolve(true)) // 确认：返回true
|
|||
|
|
.catch(() => resolve(false)); // 取消/关闭：返回false（不再reject）
|
|||
|
|
});
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 使用示例
|
|||
|
|
const handleDelete = async (id: number) => {
|
|||
|
|
// 直接获取返回值：true=确认，false=取消
|
|||
|
|
const isConfirmed = await deleteConfirm('是否删除数据？', { title: '自定义标题', type: 'warning' })
|
|||
|
|
|
|||
|
|
if (isConfirmed) {
|
|||
|
|
// 确认删除：执行业务逻辑
|
|||
|
|
// await api.deleteData(id) // 真实接口请求
|
|||
|
|
ElMessage.success(`ID为${id}的数据删除成功！`)
|
|||
|
|
console.log(`执行删除操作，数据ID：${id}`)
|
|||
|
|
} else {
|
|||
|
|
// 取消删除：给出提示（可选）
|
|||
|
|
ElMessage.info('已取消删除操作')
|
|||
|
|
console.log('用户取消删除')
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
*/
|