하수재이용시설 등록 운영정보 데이터 가져오기

apps/wr/app/ruseFcltMng/fcltReg/pbnstReg/page.tsx

@@ -21,17 +21,14 @@ import { z } from "zod";
 
 export default function PublicReuseFaciltyInsert() {
   const { code, pbnst, pubHasuInit,pbnstRegInit } = useWrStore((state) => state);
-  const { pubFacHeadList,pbnstHasuRes } = pbnst;
-
-
-  const {pbnstRes} = pbnst
+  const { pubFacHeadList,pbnstHasuRes, pbnstRes } = pbnst;
   const [currentTab, setCurrentTab] = useState<string>("mng");
   const [fcltMng, setFcltMng] = useState<ruseFcltType[]>();
   const [pbnstBiz, setPbnstBiz] = useState<fcBizType[]>();
 
   const [searchTxt, setSearchTxt] = useState<string>();
   const [bdstTable, setbdstTable] = useState<customPbnst[]>();
-
+  const [selectBdst, setSelectBdst] = useState<customPbnst>();
 
 useEffect(() => {
     if (!pbnst.isInit ) {
@@ -56,10 +53,9 @@ useEffect(() => {
     console.log(val);
   };
   const cellClick = (val: number | undefined) => {
-
-    
-    setPbnstBiz(pbnstRes?.fcBizs)
-    setFcltMng([]);
+    if (val === undefined) return;
+    console.log("pbnstRes", pbnstRes);
+    setSelectBdst(pbnstRes);
   };
   const resetContents = () => {
     setFcltMng([]); // 빈 배열로 설정하여 신규 모드로 전환
@@ -135,7 +131,7 @@ useEffect(() => {
                   <TabsTrigger className="!text-xl" value="buse">차수별정보</TabsTrigger>
                 </TabsList>
               <TabsContent className="max-h-full" value="mng">
-                  <PbnstMngForm data={fcltMng || []} />
+                  <PbnstMngForm data={selectBdst} />
               </TabsContent>
               <TabsContent className="max-h-full" value="buse">
                   <PbnstBuseForm data={pbnstBiz || []} />

apps/wr/app/store/ruseFcltMng/fcltReg/pbnstReg/headList.tsx

@@ -17,11 +17,11 @@ export const pubFacHeadListExport: TableUpperProps[] = [
 ];
 
 export const pbnstMngUpHeadListExport: TableUpperProps[] = [
-  { id: "mng", title: "운영방식" },
-  { id: "subCo", title: "대행업체" },
-  { id: "startDay", title: "시작일", upName: "upChangeRe", upSequnce: 1 },
-  { id: "endDay", title: "종료일", upName: "upChangeRe", upSequnce: 2 },
-];
+  { id: "operMthd", title: "운영방식" },
+  { id: "rprtvBzenty", title: "대행업체" },
+  { id: "bgngDt", title: "시작일", upName: "upChangeRe", upSequnce: 1 },
+  { id: "endDt", title: "종료일", upName: "upChangeRe", upSequnce: 2 },
+];   
 
 
 export const pplInstlsHeadListExport: TableUpperProps[] = [

apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm.tsx

@@ -6,7 +6,7 @@ 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 { set, useForm } from "react-hook-form";
+import { set, useFieldArray, useForm } from "react-hook-form";
 import { nullable, z } from "zod";
 import { useWrStore } from "@/app/store";
 import {
@@ -23,7 +23,7 @@ import {
 import RuseMngTable from "@/components/ui/table/pbnstReg/ruseMngTable/ruseMngTable";
 import { TusClientUpload } from "@/components/lib/useTus_wr/useTusWr";
 import type { Upload } from "tus-js-client";
-import type { fcltOperInfoType, ruseFcltType } from "@/app/store/ruseFcltMng/fcltReg/pbnstReg/type";
+import { pbnstRegZod, type customPbnst, type fcltOperInfoType, type operType, type ruseFcltType } from "@/app/store/ruseFcltMng/fcltReg/pbnstReg/type";
 
 const formSchema = z.object({
   fcltNm: z.string().min(2).max(50),
@@ -35,10 +35,11 @@ const formSchema = z.object({
   splyExtraCpct: z.number(),
 });
 
-export function PbnstMngForm({ data }: { data: ruseFcltType[] }) {
+export function PbnstMngForm({ data }: { data: customPbnst }) {
+  console.log("data", data);
   const { pbnst } = useWrStore((state) => state);
-  const { pbnstMngUpHeadList, isInit } = pbnst;
-  const [ruseOperData, setRuseOperData] = useState<fcltOperInfoType[]>();
+  const { pbnstMngUpHeadList} = pbnst;
+  const [ruseOperData, setRuseOperData] = useState<operType[]>();
   const [planFiles, setPlanFiles] = useState<File[] | null>(null);
   const [relationfiles, setRelationFiles] = useState<File[] | null>(null);
 
@@ -53,35 +54,31 @@ export function PbnstMngForm({ data }: { data: ruseFcltType[] }) {
     setProgress(Number(percentage));
   };
 
-  const form = useForm<z.infer<typeof formSchema>>({
-    resolver: zodResolver(formSchema),
-    defaultValues: {
-      fcltNm: "",
-      psysScdg: "",
-      designScdg: "",
-      fcltCpct: 0,
-      swtrmtCpct: 0,
-      ruseCpct: 0,
-      splyExtraCpct: 0,
-    },
+  const form = useForm<z.infer<typeof pbnstRegZod>>({
+    resolver: zodResolver(pbnstRegZod),
+    defaultValues: {...data},
+  });
+  
+  const { fields: fcOpersField } = useFieldArray({
+    control: form.control,
+    name: "fcOpers",
   });
 
-  const selectOptions = data?.map((item) => ({
-    text: item.fcltNm,
-    val: item.pbnstRuseFcltPk,
-  })) || [{ text: "없음", val: "1" }];
+  console.log("fcOpersField", fcOpersField);
+  // const selectOptions = data?.map((item) => ({
+  //   text: item.fcltNm,
+  //   val: item.pbnstRuseFcltPk,
+  // })) || [{ text: "없음", val: "1" }];
 
   const onSelectValue = (val: string) => {};
 
   useEffect(() => {
-    if (isInit) {
-      form.reset();
-      setRuseOperData([{}] as fcltOperInfoType[]);
-    }
-  }, [isInit]);
+      form.reset(data);
+      // setRuseOperData(data.fcOpers);
+  }, [data]);
 
   // 2. Define a submit handler.
-  function onSubmit(values: z.infer<typeof formSchema>) {
+  function onSubmit(values: z.infer<typeof pbnstRegZod>) {
     console.log(values);
   }
 
@@ -126,22 +123,7 @@ export function PbnstMngForm({ data }: { data: ruseFcltType[] }) {
                 <h2 className={formTableName + "pr-3 col-span-10 "}>
                   재이용 시설명
                 </h2>
-                <FormField
-                  control={form.control}
-                  name="fcltNm"
-                  render={({ field }) => (
-                    <FormUi label="">
-                      <SelectBox
-                        label=""
-                        selectArray={selectOptions}
-                        className={""}
-                        selectClass={selectClass}
-                        onSelectValue={() => {}}
-                        {...field}
-                      />
-                    </FormUi>
-                  )}
-                />
+                <span className="mt-4 ml-2">{form.getValues("ruseUtztnFcltNm") ? ": " + form.getValues("ruseUtztnFcltNm") : ""}</span>
               </div>
             </div>
 
@@ -159,7 +141,11 @@ export function PbnstMngForm({ data }: { data: ruseFcltType[] }) {
                   </Button>
                 </div>
                 <RuseMngTable
-                  tableData={[]}
+                  tableData={fcOpersField.map((item, index) => ({
+                    ...item,
+                    bgngDt: item.bgngDt.toLocaleDateString() || "",
+                    endDt: item.endDt.toLocaleDateString()  || "",
+                  }))}
                   headList={pbnst.pbnstMngUpHeadList}
                   upHeadList={pbnst.pbnstMngNm}
                 ></RuseMngTable>
@@ -174,7 +160,7 @@ export function PbnstMngForm({ data }: { data: ruseFcltType[] }) {
                     name="fcltCpct"
                     render={({ field }) => (
                       <FormUi label="시설용량(m³/일)">
-                        <Input placeholder="" type="number" {...field} />
+                        <Input placeholder="" type="number" value={field.value} />
                       </FormUi>
                     )}
                   />
@@ -185,7 +171,7 @@ export function PbnstMngForm({ data }: { data: ruseFcltType[] }) {
                     name="swtrmtCpct"
                     render={({ field }) => (
                       <FormUi label="하수처리량(m³/일)">
-                        <Input placeholder="" type="number" {...field} />
+                        <Input placeholder="" type="number" value={field.value} />
                       </FormUi>
                     )}
                   />
@@ -196,7 +182,7 @@ export function PbnstMngForm({ data }: { data: ruseFcltType[] }) {
                     name="ruseCpct"
                     render={({ field }) => (
                       <FormUi label="재이용량(m³/일)">
-                        <Input placeholder="" type="number" {...field} />
+                        <Input placeholder="" type="number" value={field.value} />
                       </FormUi>
                     )}
                   />
@@ -207,7 +193,7 @@ export function PbnstMngForm({ data }: { data: ruseFcltType[] }) {
                     name="splyExtraCpct"
                     render={({ field }) => (
                       <FormUi label="공급여유량(m³/일)">
-                        <Input placeholder="" type="number" {...field} />
+                        <Input placeholder="" type="number" value={field.value} />
                       </FormUi>
                     )}
                   />

apps/wr/components/ui/table/pbnstReg/ruseMngTable/ruseMngTable.tsx

@@ -29,7 +29,7 @@ export default function RuseMngTable({
           ) : (
             <TableRow key={"table-row-test"}>
               {headList.map((head) => (
-                <TableHead key = {head.id} className={`border border-gray-600 px-2 py-1 `}>
+                <TableHead className={`border border-gray-600 px-2 py-1 `}>
                   {head.title}
                 </TableHead>
               ))}