ONAANDALL/frontend
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

재이용 시설 폼 오류 수정

Browse Source
This commit is contained in:
leedj312
2025-08-13 23:10:59 +09:00
parent aacadcb929
commit a4a050a56c
3 changed files with 70 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/pbnstReg/page.tsx
+2
View File
@@ -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)}
></PbnstRegModal>
}
bodyClass="w-[68vw] max-w-none h-[90vh]"
apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm.tsx
+64 -76
View File
@@ -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<fcFileType[] | null>(null);
const [planFiles, setPlanFiles] = useState<FilesType[] | null>(null);
const [relationfiles, setRelationFiles] = useState<FilesType[] | null>(null);
const [fcltNm, setFcltNm] = useState<selectLabel[] | null>(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 (
<div className=" !mx-[1.6rem] !p-0r">
<div>
@@ -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({
) : (
<FormUi label="계통도">
<FileUpload
key={`items.${indexMng}.planFiles`}
files={relationfiles?.map((item) => item.file) || []}
setFiles={(files: File[] | null) => {
if (files) fileHandler(files, "relation");
@@ -493,6 +480,7 @@ export function PbnstMngForm({
) : (
<FormUi label="평면도">
<FileUpload
key={`items.${indexMng}.planFiles`}
files={planFiles?.map((item) => item.file) || []}
setFiles={(files: File[] | null) => {
if (files) fileHandler(files, "plan");
apps/wr/components/ui/modal/fcltReg/pbnstRegModal/pbnstRegModal.tsx
+4 -7
View File
@@ -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<typeof pbnstRegZod>[] }>
) => void;
newIndexMng:number
}) {
const { t } = useTranslation("base");
//TODO: 유즈 스테이트에 set만해도 되나?
const [, setCurrentTab] = useState<string>("mng");
const [indexMng, setIndexMng] = useState<number>(0);
const [indexMng, setIndexMng] = useState<number>(newIndexMng);
const [indexBiz, setIndexBiz] = useState<number>(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 (
<>
<h1 className="text-2xl font-medium text-label pl-8">