diff --git a/apps/st/src/components/statistics/verification/ApprovalInputDialog.tsx b/apps/st/src/components/statistics/verification/ApprovalInputDialog.tsx new file mode 100644 index 000000000..49170e7ae --- /dev/null +++ b/apps/st/src/components/statistics/verification/ApprovalInputDialog.tsx @@ -0,0 +1,177 @@ +"use client"; + +import { useEffect, useState } from "react"; + +import { + Button, + Dialog, + DialogClose, + DialogContent, + DialogFooter, + DialogHeader, + DialogTitle, + Input, + Label, + Textarea, +} from "@common/components"; + +export interface ApprovalFormData { + rjctOpnnCn: string; + lastCfmtnPicNm: string; + lastCfmtnPicTelNo: string; + lastCfmtnPicDeptNm: string; + lastCfmtnPicJbgdNm: string; +} + +export interface ApprovalInputDialogProps { + open: boolean; + onOpenChange: (open: boolean) => void; + onConfirm?: (data: ApprovalFormData) => void | Promise; +} + +export function ApprovalInputDialog({ + open, + onOpenChange, + onConfirm, +}: ApprovalInputDialogProps) { + const [rjctOpnnCn, setRjctOpnnCn] = useState(""); + const [lastCfmtnPicNm, setLastCfmtnPicNm] = useState(""); + const [lastCfmtnPicTelNo, setLastCfmtnPicTelNo] = useState(""); + const [lastCfmtnPicDeptNm, setLastCfmtnPicDeptNm] = useState(""); + const [lastCfmtnPicJbgdNm, setLastCfmtnPicJbgdNm] = useState(""); + + const [isSubmitting, setIsSubmitting] = useState(false); + + const resetForm = () => { + setRjctOpnnCn(""); + setLastCfmtnPicNm(""); + setLastCfmtnPicTelNo(""); + setLastCfmtnPicDeptNm(""); + setLastCfmtnPicJbgdNm(""); + }; + + const handleDialogOpenChange = (nextOpen: boolean) => { + if (!nextOpen) resetForm(); + onOpenChange(nextOpen); + }; + + useEffect(() => { + if (!open) { + resetForm(); + } + }, [open]); + + const handleConfirm = async () => { + try { + setIsSubmitting(true); + const formData: ApprovalFormData = { + rjctOpnnCn: rjctOpnnCn.trim(), + lastCfmtnPicNm: lastCfmtnPicNm.trim(), + lastCfmtnPicTelNo: lastCfmtnPicTelNo.trim(), + lastCfmtnPicDeptNm: lastCfmtnPicDeptNm.trim(), + lastCfmtnPicJbgdNm: lastCfmtnPicJbgdNm.trim(), + }; + await onConfirm?.(formData); + } finally { + setIsSubmitting(false); + } + }; + + return ( + + + + 승인 정보 입력 + +
+
+ + { + setLastCfmtnPicNm(e.target.value); + }} + className="!text-[1.3rem]" + placeholder="담당자명을 입력하세요." + disabled={isSubmitting} + /> +
+
+ + { + setLastCfmtnPicTelNo(e.target.value); + }} + className="!text-[1.3rem]" + placeholder="전화번호를 입력하세요." + disabled={isSubmitting} + /> +
+
+ + { + setLastCfmtnPicDeptNm(e.target.value); + }} + className="!text-[1.3rem]" + placeholder="부서명을 입력하세요." + disabled={isSubmitting} + /> +
+
+ + { + setLastCfmtnPicJbgdNm(e.target.value); + }} + className="!text-[1.3rem]" + placeholder="직급명을 입력하세요." + disabled={isSubmitting} + /> +
+
+ +