diff --git a/apps/wr/app/store/ruseFcltMng/fcltReg/pbnstReg/type.tsx b/apps/wr/app/store/ruseFcltMng/fcltReg/pbnstReg/type.tsx index 528f4c349..8350995d9 100644 --- a/apps/wr/app/store/ruseFcltMng/fcltReg/pbnstReg/type.tsx +++ b/apps/wr/app/store/ruseFcltMng/fcltReg/pbnstReg/type.tsx @@ -28,13 +28,6 @@ export type publicReuseFacilityType = { register?: string; swtrmtFcltFk: string; }; -export type fcltOperInfoType = { - mng: string; - subCo: string; - startDay: string; - endDay: string; - pbnstRuseFcltPk: string; -}; export type ruseFcltType = { swtrmtFcltFk: string; @@ -74,8 +67,8 @@ const fcOperSchema = z.object({ pbnstRuseFcltFk: z.number().default(0), operMthd: z.string(), rprtvBzenty: z.string(), - bgngDt: z.string(), - endDt: z.string(), + bgngDt: z.date().default(new Date()), + endDt: z.date().default(new Date()), regDt: z.date().nullish(), rgtr: z.string(), mdfcnDt: z.date(), @@ -204,6 +197,7 @@ export const pbnstRegZod = z.object({ fcFiles: z.array(fcFileSchema).default([]), fcBizs: z.array(fcBizSchema).default([]), fcOpers: z.array(fcOperSchema).default([]), + hasuhasu: z.number().default(0), }); const pubHasuZod = z.object({ @@ -222,6 +216,7 @@ export const exampleData = { pbnstRuseFcltPk: 1, swtrmtFcltFk: "11000SW001R", ruseUtztnFcltNm: "재이용시설 A", + hasuhasu: 0, fcltCpct: "100", ruseCpct: "90", splyExtraCpct: "10", @@ -444,8 +439,8 @@ export const exampleData = { pbnstRuseFcltFk: 1, operMthd: "위탁", rprtvBzenty: "기관명", - bgngDt: "20230930", - mdfcnDt:"20231230", + bgngDt: new Date("2023-09-30"), + endDt: new Date("2023-12-31"), rgtr: TEST_UUID, mdfr: TEST_UUID, }, @@ -454,7 +449,8 @@ export const exampleData = { pbnstRuseFcltFk: 1, operMthd: "직영", rprtvBzenty: "기관명", - bgngDt: "20241130", + bgngDt: new Date("2024-11-30"), + endDt: new Date("2024-12-31"), rgtr:TEST_UUID , mdfr: TEST_UUID, }, 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 1061a1df3..43abc4e3f 100644 --- a/apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm.tsx +++ b/apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm.tsx @@ -5,7 +5,7 @@ import { FileUpload, FormUi, UiTable } from "@common/business_components/ui"; import { Form, FormField } from "@common/business_components/ui/form"; import { Button, Input, TableHead, TableRow } from "@common/components"; import { zodResolver } from "@hookform/resolvers/zod"; -import { useEffect, useState } from "react"; +import { use, useEffect, useRef, useState } from "react"; import { set, useFieldArray, useForm } from "react-hook-form"; import { nullable, z } from "zod"; import { useWrStore } from "@/app/store"; @@ -51,7 +51,10 @@ export function PbnstMngForm({ data }: { data: customPbnst }) { setProgress(Number(percentage)); }; + + + const ref = useRef(data.fcOpers ?? null); const form = useForm>({ resolver: zodResolver(pbnstRegZod), defaultValues: {...data}, @@ -66,12 +69,12 @@ export function PbnstMngForm({ data }: { data: customPbnst }) { useEffect(() => { form.reset(data); - // setRuseOperData(data.fcOpers); + setRuseOperData(data.fcOpers); }, [data]); // 2. Define a submit handler. function onSubmit(values: z.infer) { - console.log(values); + console.log("submit",values); pbnstUpdate(values); } @@ -141,6 +144,7 @@ export function PbnstMngForm({ data }: { data: customPbnst }) { tableData={fcOpersField} headList={pbnst.pbnstMngUpHeadList} upHeadList={pbnst.pbnstMngNm} + ref={ref} > @@ -161,7 +165,7 @@ export function PbnstMngForm({ data }: { data: customPbnst }) {
( diff --git a/apps/wr/components/ui/table/pbnstReg/ruseMngTable/ruseMngTable.tsx b/apps/wr/components/ui/table/pbnstReg/ruseMngTable/ruseMngTable.tsx index 5eabc06bb..e5733406b 100644 --- a/apps/wr/components/ui/table/pbnstReg/ruseMngTable/ruseMngTable.tsx +++ b/apps/wr/components/ui/table/pbnstReg/ruseMngTable/ruseMngTable.tsx @@ -1,5 +1,6 @@ import { headMakeprfmnc } from "@/app/ruseFcltMng/prfmncReg/chkgdnReg/TableHead"; import type { chHeadType } from "@/app/store/prfmncReg/chkgdnReg/rainChkgdn/headList"; +import type { customPbnst, fcltOperInfoType, fcOrgwtType, operType, ppInstlType } from "@/app/store/ruseFcltMng/fcltReg/pbnstReg/type"; import { selectClass, type TableUpperProps } from "@/app/store/ruseFcltMng/fcltReg/rainReg"; import { DatePicker, SelectBox, type SelectDataType } from "@common/business_components/ui"; import { @@ -12,93 +13,114 @@ import { TableRow, } from "@common/components/ui"; import moment from "moment"; -import { useState } from "react"; +import React, { useEffect, useState } from "react"; -export default function RuseMngTable({ - tableData, - headList, - upHeadList, - code = [], -}: { +type RuseMngTableProps = { tableData: any[]; headList: TableUpperProps[]; - upHeadList?: chHeadType[]; - code?:{name:string, val:SelectDataType[] }[] -}) { -const [tableState, setTableState] = useState([...tableData]); + upHeadList: chHeadType[]; + code?: { name: string, val: SelectDataType[] }[]; +}; - return ( - <> - - - {upHeadList ? ( - headMakeprfmnc(headList, upHeadList) - ) : ( - - {headList.map((head) => ( - - {head.title} - - ))} - - )} - +const RuseMngTable = React.forwardRef( + ({ + tableData, + headList, + upHeadList, + code = [] + }, ref) => { + const [tableState, setTableState] = useState([...tableData]); + useEffect(() => { + if (ref && typeof ref === "object" && "current" in ref) { + ref.current = tableState; + } + }, [tableState]); - - {tableState.map((item, i) => ( - - {headList.map((head, j) => ( - {}} - > - {head.edit === true ? ( - {}} - value={item[head.id] || ""} - /> - ) : head.type === "select" ? ( - item.name === head.selectData)?.val ?? []} - value={ - item[head.id] - } - className={""} - selectClass={selectClass} - onSelectValue={(val) => { - setTableState((prev)=>{ - prev[i][head.id] = val - return [...prev] - }) - }} - > - ) : head.type === "date" ? ( - { - item[head.id] = moment(date).format('yyyyMMdd'); + useEffect(() => { + setTableState(tableData); + }, [tableData]); + return ( + <> +
+ + {upHeadList ? ( + headMakeprfmnc(headList, upHeadList) + ) : ( + + {headList.map((head) => ( + + {head.title} + + ))} + + )} + + + + {tableState.map((item, i) => ( + + {headList.map((head, j) => ( + { }} + > + {head.edit === true ? ( + { + setTableState(prev => { + const next = [...prev]; + next[i] = { ...next[i], [head.id]: txt.target.value }; + return next; + }) + }} + value={tableState[i][head.id] || ""} + /> + ) : head.type === "select" ? ( + item.name === head.selectData)?.val ?? []} + value={ + item[head.id] } - }} - selectClass={"w-full"} - /> - ) : ( - `${item[head.id] || ""}` - )} - - ))} - - ))} - -
- - ); -} + className={""} + selectClass={selectClass} + onSelectValue={(val) => { + setTableState((prev) => { + prev[i][head.id] = val + return [...prev] + }) + }} + > + ) : head.type === "date" ? ( + { + setTableState(prev => { + const next = [...prev]; + next[i] = { ...next[i], [head.id]: date }; + return next; + }) + } + } + } + selectClass={"w-full"} + /> + ) : ( + `${item[head.id] || ""}` + )} + + ))} + + ))} + + + + ); + }) +export default RuseMngTable; \ No newline at end of file