diff --git a/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/pbnstReg/page.tsx b/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/pbnstReg/page.tsx index 5f1d0d19c..219d5cfbe 100644 --- a/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/pbnstReg/page.tsx +++ b/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/pbnstReg/page.tsx @@ -220,6 +220,7 @@ export default function PublicReuseFaciltyInsert() { setSelectRow(pbnstHasuRes?.[val]); if (selectRow) { pbnstRegClick(selectRow); + setIndexMng(0) } else { console.error("선택된 행이 없습니다."); } @@ -427,6 +428,7 @@ export default function PublicReuseFaciltyInsert() { } }} onInvalid={onInvalid} + newIndexMng={(formWatch?.length -1)} > } bodyClass="w-[68vw] max-w-none h-[90vh]" diff --git a/apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm.tsx b/apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm.tsx index c55c3567e..5b4d93d94 100644 --- a/apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm.tsx +++ b/apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm.tsx @@ -9,7 +9,7 @@ import { } from "@common/business_components/ui"; import { Form, FormField } from "@common/business_components/ui/form"; import { Button, Input } from "@common/components"; -import { useEffect, useRef, useState } from "react"; +import { useEffect, useState } from "react"; import { useFieldArray, type UseFormReturn } from "react-hook-form"; import { commonButonSize, @@ -18,7 +18,6 @@ import { } from "@/components/lib/class/comClass"; import { TusClientUpload } from "@/components/lib/useTus_wr/useTusWr"; import { - type fcFileType, type PbnstRegArrrayType, type selectLabel, } from "@/app/store/ruseFcltMng/fcltReg/pbnstReg/type"; @@ -52,15 +51,11 @@ export function PbnstMngForm({ const { code, pbnst, fileDelete, fileDownLoad } = useWrStore( (state) => state ); - const fileInitRef = useRef<{ index: number; key: string } | null>(null); - const [regFileList, setRegFileList] = useState(null); const [planFiles, setPlanFiles] = useState(null); const [relationfiles, setRelationFiles] = useState(null); const [fcltNm, setFcltNm] = useState(null); const [mngMtdCode, setMngMtdCode] = useState<{ name: string; val: SelectDataType[] }[]>(); - - const { fields: fcOpersField, prepend, @@ -155,72 +150,57 @@ export function PbnstMngForm({ } }; - const regFileFilter = ( - files: FilesType[], - fileKnd: string, - regFile: fcFileType[] - ) => { - const exFileDatas = - regFile?.filter((item) => item.fileKnd !== fileKnd) || []; - const currentdata = files.map((item) => ({ - fileTkn: item.atflCd, - filePath: item.file.name, - fileKnd: fileKnd, - rgtr: TEST_UUID, - mdfr: TEST_UUID, - })); - return [...exFileDatas, ...currentdata]; - }; + // const regFileFilter = ( + // files: FilesType[], + // fileKnd: string, + // regFile: fcFileType[] + // ) => { + // const exFileDatas = + // regFile?.filter((item) => item.fileKnd !== fileKnd) || []; + // const currentdata = files.map((item) => ({ + // fileTkn: item.atflCd, + // filePath: item.file.name, + // fileKnd: fileKnd, + // rgtr: TEST_UUID, + // mdfr: TEST_UUID, + // })); + // return [...exFileDatas, ...currentdata]; + // }; - useEffect(() =>{ - console.log('로그') - - },[]) useEffect(() => { - setRelationFiles([]) - setPlanFiles([]) - setRegFileList([]) + setRelationFiles([]); + setPlanFiles([]); + console.log("indexMng ", indexMng); const currentItem = form.getValues(`items.${indexMng}`); - const currentKey = JSON.stringify(currentItem); - const defaultFiles = currentItem?.fcFiles || []; - const relationFileList = defaultFiles.filter( (item) => item.fileKnd === "계통도" ); const planFileList = defaultFiles.filter( (item) => item.fileKnd === "평면도" ); - setRelationFiles( - relationFileList.length > 0 - ? relationFileList.map((item) => ({ - atflCd: item.fileTkn, - file: new File([], item.filePath), - })) - : null - ); - - setPlanFiles( - planFileList.length > 0 - ? planFileList.map((item) => ({ - atflCd: item.fileTkn, - file: new File([], item.filePath), - })) - : null - ); - - // ✅ 다음 루프에선 다시 안 하도록 저장 - fileInitRef.current = { - index: indexMng, - key: currentKey, - }; - }, [indexMng, form.getValues(`items.${indexMng}`)]); + + setRelationFiles( + relationFileList.length > 0 + ? relationFileList.map((item) => ({ + atflCd: item.fileTkn, + file: new File([], item.filePath), + })) + : null + ); + setPlanFiles( + planFileList.length > 0 + ? planFileList.map((item) => ({ + atflCd: item.fileTkn, + file: new File([], item.filePath), + })) + : null + ); + }, [form.getValues(`items.${indexMng}`)]); useEffect( () => { - - //폼이 들어오면 폼에 대한 이름 셀렉트박스를만들기 위해 if (mngRegForm && mngRegForm.length >= 0) { const fcltNmList = mngRegForm?.map((item, index) => ({ text: item.ruseUtztnFcltNm, @@ -234,29 +214,36 @@ export function PbnstMngForm({ [mngRegForm] ); + const formFileChange = (file: FilesType[], type: string) => { + return file?.map((item) => ({ + fileTkn: item.atflCd, + filePath: item.file.name, + fileKnd: type, + rgtr: TEST_UUID, + mdfr: TEST_UUID, + })); + }; useEffect(() => { - console.log('regFileList ', regFileList) - if (regFileList && regFileList?.length > 0) { - form.setValue(`items.${indexMng}.fcFiles`, regFileList); - } - }, [regFileList, indexMng]); - - useEffect(() => { - console.log('relationfiles ' ,relationfiles) if (relationfiles) { - setRegFileList(regFileFilter(relationfiles, "계통도", regFileList || [])); + console.log("indexMng relationfiles", indexMng); + form.setValue(`items.${indexMng}.fcFiles`, [ + ...(formFileChange(planFiles ?? [], "평면도") ?? []), + ...formFileChange(relationfiles, "계통도"), + ]); + //setRegFileList(regFileFilter(relationfiles, "계통도", regFileList || [])); } }, [relationfiles]); useEffect(() => { - console.log('planFiles ' ,planFiles) - if (planFiles) { - setRegFileList(regFileFilter(planFiles, "평면도", regFileList || [])); + // setRegFileList(regFileFilter(planFiles, "평면도", regFileList || [])); + console.log("indexMng planFiles", indexMng); + form.setValue(`items.${indexMng}.fcFiles`, [ + ...(formFileChange(planFiles ?? [], "평면도") ?? []), + ...formFileChange(relationfiles ?? [], "계통도"), + ]); } }, [planFiles]); - - useEffect(() => { if (code.ruseMngMtd) { setMngMtdCode([{ name: "ruseMngMtd", val: code.ruseMngMtd }]); @@ -264,7 +251,6 @@ export function PbnstMngForm({ }, [code]); - return (
@@ -376,7 +362,7 @@ export function PbnstMngForm({ maxLength={numSize} //입력제한 type="text" onChange={(e) => { - handleCommaNumberChange(e, field.onChange); + handleCommaNumberChange(e, field.onChange); }} value={formatCommaNumber(field.value)} readOnly={readonly} @@ -399,7 +385,7 @@ export function PbnstMngForm({ maxLength={numSize} //입력제한 type="text" onChange={(e) => { - handleCommaNumberChange(e, field.onChange); + handleCommaNumberChange(e, field.onChange); }} value={formatCommaNumber(field.value)} readOnly={readonly} @@ -421,7 +407,7 @@ export function PbnstMngForm({ maxLength={numSize} //입력제한 type="text" onChange={(e) => { - handleCommaNumberChange(e, field.onChange); + handleCommaNumberChange(e, field.onChange); }} value={formatCommaNumber(field.value)} readOnly={readonly} @@ -456,6 +442,7 @@ export function PbnstMngForm({ ) : ( item.file) || []} setFiles={(files: File[] | null) => { if (files) fileHandler(files, "relation"); @@ -493,6 +480,7 @@ export function PbnstMngForm({ ) : ( item.file) || []} setFiles={(files: File[] | null) => { if (files) fileHandler(files, "plan"); diff --git a/apps/wr/components/ui/modal/fcltReg/pbnstRegModal/pbnstRegModal.tsx b/apps/wr/components/ui/modal/fcltReg/pbnstRegModal/pbnstRegModal.tsx index e890af27e..ec79dd42b 100644 --- a/apps/wr/components/ui/modal/fcltReg/pbnstRegModal/pbnstRegModal.tsx +++ b/apps/wr/components/ui/modal/fcltReg/pbnstRegModal/pbnstRegModal.tsx @@ -25,18 +25,20 @@ export function PbnstRegModal({ form, setPbnstInsert, onInvalid, + newIndexMng }: { form: UseFormReturn<{ items: PbnstRegArrrayType }>; setPbnstInsert: (data: customPbnst) => void; onInvalid: ( errors: FieldErrors<{ items: z.infer[] }> ) => void; + newIndexMng:number }) { const { t } = useTranslation("base"); //TODO: 유즈 스테이트에 set만해도 되나? const [, setCurrentTab] = useState("mng"); - const [indexMng, setIndexMng] = useState(0); + const [indexMng, setIndexMng] = useState(newIndexMng); const [indexBiz, setIndexBiz] = useState(0); const onSubmit = async (valuse: { items: PbnstRegArrrayType }) => { @@ -59,13 +61,8 @@ export function PbnstRegModal({ console.log("form errors:", form.formState.errors); }, [form.formState.errors]); - useEffect(() => { - const firstForm = form.getValues("items"); - if (firstForm) { - setIndexMng(firstForm.length - 1); - } - }, [form]); + return ( <>