From 8b2313f8179b7c86242851568553590a2d69307d Mon Sep 17 00:00:00 2001 From: abearxiong Date: Sun, 18 May 2025 17:32:18 +0800 Subject: [PATCH] update --- .../registry/components/a/confirm.tsx | 145 +++++++++--------- 1 file changed, 69 insertions(+), 76 deletions(-) diff --git a/libs/registry/registry/components/a/confirm.tsx b/libs/registry/registry/components/a/confirm.tsx index fc418a7..4c6a413 100644 --- a/libs/registry/registry/components/a/confirm.tsx +++ b/libs/registry/registry/components/a/confirm.tsx @@ -9,9 +9,34 @@ import { AlertDialogTitle, AlertDialogTrigger, } from '@/components/ui/alert-dialog'; -import { useMemo, useRef, useState } from 'react'; +import { useEffect, useMemo, useState } from 'react'; type useConfirmOptions = { + confrimProps: ConfirmProps; +}; +type Fn = () => void; +export const useConfirm = (opts?: useConfirmOptions) => { + const [open, setOpen] = useState(false); + type ConfirmOptions = { + onOk?: Fn; + onCancel?: Fn; + }; + const confirm = (opts?: ConfirmOptions) => { + setOpen(true); + }; + const module = useMemo(() => { + return ; + }, [open]); + return { + module: module, + open, + setOpen, + confirm, + }; +}; + +type ConfirmProps = { + children?: React.ReactNode; tip?: React.ReactNode; title?: string; description?: string; @@ -19,87 +44,55 @@ type useConfirmOptions = { onCancelText?: string; onOk?: Fn; onCancle?: Fn; - children?: React.ReactNode; + hasTrigger?: boolean; + open?: boolean; + setOpen?: (open: boolean) => void; + footer?: React.ReactNode; }; -type Fn = () => void; -export const useConfirm = (opts?: useConfirmOptions) => { - const [open, setOpen] = useState(false); - const onOkRef = useRef(null); - const onCancle = useRef(null); - type ConfirmOptions = { - onOk?: Fn; - onCancel?: Fn; - }; - const confirm = (opts: ConfirmOptions) => { - setOpen(true); - opts.onOk && (onOkRef.current = opts.onOk); - opts.onCancel && (onCancle.current = opts.onCancel); - }; - const module = useMemo(() => { - if (!open) return null; - return ( - - {opts?.tip ?? '提示'} - - - {opts?.title ?? '是否确认删除?'} - {opts?.description ?? '此操作无法撤销,是否继续。'} - - - { - setOpen(false); - onCancle.current && onCancle.current(); - e.stopPropagation(); - }}> - {opts?.onCancelText ?? '取消'} - - { - setOpen(false); - onOkRef.current && onOkRef.current(); - e.stopPropagation(); - }}> - {opts?.onOkText ?? '确定'} - - - - - ); - }, [open]); - return { - module, - open, - setOpen, - confirm, - }; -}; - -export const Confirm = (opts?: useConfirmOptions) => { +export const Confirm = (props: ConfirmProps) => { + const [isOpen, setIsOpen] = useState(props.open); + const hasTrigger = props.hasTrigger ?? true; + useEffect(() => { + setIsOpen(props.open); + }, [props.open]); return ( - - {opts?.children && {opts?.children ?? opts?.tip ?? '提示'}} - {!opts?.children && {opts?.tip ?? '提示'}} + { + setIsOpen(v); + props?.setOpen?.(v); + }}> + {hasTrigger && ( + <> + {props?.children && {props?.children ?? props?.tip ?? '提示'}} + {!props?.children && {props?.tip ?? '提示'}} + + )} - {opts?.title ?? '是否确认删除?'} - {opts?.description ?? '此操作无法撤销,是否继续。'} + {props?.title ?? '是否确认删除?'} + {props?.description ?? '此操作无法撤销,是否继续。'} - { - opts?.onCancle?.(); - e.stopPropagation(); - }}> - {opts?.onCancelText ?? '取消'} - - { - opts?.onOk?.(); - e.stopPropagation(); - }}> - {opts?.onOkText ?? '确定'} - + {props?.footer &&
{props?.footer}
} + {!props?.footer && ( + <> + { + props?.onCancle?.(); + e.stopPropagation(); + }}> + {props?.onCancelText ?? '取消'} + + { + props?.onOk?.(); + e.stopPropagation(); + }}> + {props?.onOkText ?? '确定'} + {' '} + + )}