diff --git a/src/components/ReDialog/index.vue b/src/components/ReDialog/index.vue
index e7fb2f108..1ca02d6e5 100644
--- a/src/components/ReDialog/index.vue
+++ b/src/components/ReDialog/index.vue
@@ -149,19 +149,34 @@ function handleClose(
-
- {{ btn?.label }}
-
+
+
+
+ {{ btn?.label }}
+
+
+
+ {{ btn?.label }}
+
+
diff --git a/src/components/ReDialog/type.ts b/src/components/ReDialog/type.ts
index 827e8c7df..04203f758 100644
--- a/src/components/ReDialog/type.ts
+++ b/src/components/ReDialog/type.ts
@@ -78,6 +78,10 @@ type ButtonProps = {
plain?: boolean;
/** 是否为文字按钮,默认 `false` */
text?: boolean;
+ /** 是否使用`Popconfirm 气泡确认框`进行确认button,默认 `false` */
+ popconfirm?: boolean;
+ /** `Popconfirm`确认框提示信息 */
+ tips?: string;
/** 是否显示文字按钮背景颜色,默认 `false` */
bg?: boolean;
/** 是否为链接按钮,默认 `false` */
diff --git a/src/views/components/dialog/index.vue b/src/views/components/dialog/index.vue
index 1a3be82b1..9d85ea7ed 100644
--- a/src/views/components/dialog/index.vue
+++ b/src/views/components/dialog/index.vue
@@ -4,7 +4,7 @@ import { h, createVNode, ref } from "vue";
import { message } from "@/utils/message";
import formPrimitive from "./formPrimitive.vue";
import forms, { type FormProps } from "./form.vue";
-import { cloneDeep, debounce } from "@pureadmin/utils";
+import { cloneDeep, debounce, isFunction } from "@pureadmin/utils";
import {
addDialog,
closeDialog,
@@ -280,6 +280,44 @@ function onUpdateClick() {
});
}
+// popconfirm 确认框
+function onPopconfirmClick() {
+ addDialog({
+ width: "30%",
+ title: "popconfirm确认框示例",
+ footerButtons: [
+ {
+ label: "取消",
+ bg: true,
+ btnClick: ({ dialog: { options, index } }) => {
+ const done = () => closeDialog(options, index, { command: "cancel" });
+ if (options?.beforeCancel && isFunction(options?.beforeCancel)) {
+ options.beforeCancel(done, { options, index });
+ } else {
+ done();
+ }
+ }
+ },
+ {
+ label: "确认",
+ type: "primary",
+ bg: true,
+ popconfirm: true,
+ tips: `是否确认修改当前数据`,
+ btnClick: ({ dialog: { options, index } }) => {
+ const done = () => closeDialog(options, index, { command: "sure" });
+ if (options?.beforeSure && isFunction(options?.beforeSure)) {
+ options.beforeSure(done, { options, index });
+ } else {
+ done();
+ }
+ }
+ }
+ ],
+ contentRenderer: () =>
这是`Popconfirm`确认框示例
+ });
+}
+
// 结合Form表单(第一种方式,弹框关闭立刻恢复初始值)通过 props 属性接收子组件的 prop 并赋值
function onFormOneClick() {
addDialog({
@@ -496,6 +534,7 @@ function onBeforeSureClick() {
关闭后的回调
嵌套的弹框
更改弹框自身属性值
+ popconfirm确认框