66 lines
1.4 KiB
TypeScript
66 lines
1.4 KiB
TypeScript
"use client";
|
||
|
||
import Modal from "@/components/Modal";
|
||
|
||
/**
|
||
* 站点风格确认框:基于 Modal,仅取消/关闭可关,避免点遮罩误关。
|
||
* danger 主按钮使用 btn-danger,其余用 btn-primary。
|
||
*/
|
||
export default function ConfirmDialog({
|
||
open,
|
||
title,
|
||
message,
|
||
confirmLabel = "确定",
|
||
cancelLabel = "取消",
|
||
danger = false,
|
||
busy = false,
|
||
onConfirm,
|
||
onCancel,
|
||
}: {
|
||
open: boolean;
|
||
title: string;
|
||
message: string;
|
||
confirmLabel?: string;
|
||
cancelLabel?: string;
|
||
danger?: boolean;
|
||
busy?: boolean;
|
||
onConfirm: () => void;
|
||
onCancel: () => void;
|
||
}) {
|
||
return (
|
||
<Modal
|
||
open={open}
|
||
title={title}
|
||
onClose={onCancel}
|
||
busy={busy}
|
||
zIndexClass="z-[1100]"
|
||
maxWidthClass="max-w-sm"
|
||
panelClassName="p-5"
|
||
footer={
|
||
<>
|
||
<button
|
||
type="button"
|
||
onClick={onCancel}
|
||
disabled={busy}
|
||
className="btn btn-line btn-sm"
|
||
>
|
||
{cancelLabel}
|
||
</button>
|
||
<button
|
||
type="button"
|
||
onClick={onConfirm}
|
||
disabled={busy}
|
||
className={`btn btn-sm ${danger ? "btn-danger" : "btn-primary"}`}
|
||
>
|
||
{busy ? "处理中…" : confirmLabel}
|
||
</button>
|
||
</>
|
||
}
|
||
>
|
||
<p className="text-[13.5px] leading-relaxed" style={{ color: "var(--ink-2)" }}>
|
||
{message}
|
||
</p>
|
||
</Modal>
|
||
);
|
||
}
|