원수,취수 모달창 수정

apps/wr/components/ui/form/fcltReg/pbnstReg/buseReg/bugRegForm.tsx

@@ -111,9 +111,9 @@ export function PbnstBuseForm({
   const fcOrgwts = form.watch(`items.${indexMng}.fcBizs.${indexBiz}.fcOrgwts`);
 
   useEffect(() => {
-    console.log("fcOrgwts ", fcOrgwts);
+    console.log("fcOrgwts", fcOrgwts);
     if (fcOrgwts && fcOrgwts?.length > 0) {
-      const swtrmtFcltFkList = fcOrgwts.map((item) => item.swtrmtFcltFk);
+      const swtrmtFcltFkList = fcOrgwts?.map((item) => item.swtrmtFcltFk);
 
       console.log("swtrmtFcltFkList ", swtrmtFcltFkList);
 
@@ -128,8 +128,6 @@ export function PbnstBuseForm({
 
   useEffect(() => {
     if (fcOrgwtsNmList && fcOrgwtsNmList.length > 0) {
-      console.log("fcOrgwtsNmList ", fcOrgwtsNmList);
-      console.log("fcOrgwts ", fcOrgwts);
 
       fcOrgwts?.forEach((item, index) => {
         const orgwtNm = fcOrgwtsNmList.find(
@@ -421,6 +419,7 @@ export function PbnstBuseForm({
                   </div>
                   <RuseMngTable
                     key={`fcOrgwts-${indexMng}-${indexBiz}`} // 이게 핵심!
+                    
                     tableData={
                       form.getValues(
                         `items.${indexMng}.fcBizs.${indexBiz}.fcOrgwts`
@@ -724,6 +723,9 @@ export function PbnstBuseForm({
             bodyClass={"w-[70vw] max-w-none max-h-[90vh] overflow-y-auto"}
             body={
               <FcOrgwtsRegModal
+              initTableData={form.getValues(
+                        `items.${indexMng}.fcBizs.${indexBiz}.fcOrgwts`
+                      ) ?? []}
                 closeModal={() => {
                   setIsFcOrgwts(false);
                 }}

apps/wr/components/ui/modal/fcltReg/fcOrgwtsRegModal/fcOrgwtsRegModal.tsx

@@ -14,13 +14,16 @@ import { Button } from "@common/business_components/ui/table/lib/button";
 import { Input } from "@common/components/ui";
 import { ArrowLeft, ArrowRight } from "lucide-react";
 import { useEffect, useRef, useState } from "react";
+import toast from "react-hot-toast";
 
 export default function FcOrgwtsRegModal({
   onRightSet,
   closeModal,
+  initTableData,
 }: {
   onRightSet?: (rightData: fcOrgwtType[]) => void;
   closeModal?: (val: boolean) => void;
+  initTableData?: any[];
 }) {
   const { code, pbnst, getSwtrmtFcltNm, searchFclts } = useWrStore(
     (state) => state
@@ -31,6 +34,30 @@ export default function FcOrgwtsRegModal({
   const leftRef = useRef<pubHasuType[] | null>([] as pubHasuType[]);
   const [rightData, setRightData] = useState<pubHasuType[]>();
   const [inputVal, setInputVal] = useState<string>("");
+  const saveData = () => {
+    if (rightData && rightData?.length > 0) {
+      if (onRightSet)
+        onRightSet(
+          (rightData as pubHasuType[])?.map((item) => {
+            return {
+              ...item,
+              swtrmtFcltFk: item.bscFctCd, // 임시값, 실제 데이터에 맞게 수정
+              orgwtWtritQnt: Number(item.fctCpc), // 임시값, 실제 데이터에 맞게 수정
+              tmsYn: "N", // 임시값, 실제 데이터에 맞게 수정
+              dschgFmYn: "N", // 임시값, 실제 데이터에 맞게 수정
+              dtlPstnExpln: item.addr, // 임시값, 실제 데이터에 맞게 수정
+              choose: false, // 임시값, 실제 데이터에 맞게 수정
+            }
+            // 필요한 경우 다른 속성들도 추가
+          }) as unknown as fcOrgwtType[]
+        );
+
+      closeModal?.(false)
+    }
+    else {
+      toast.error("취수하수처리장 목록을 선택해주세요.")
+    }
+  }
 
   useEffect(() => {
     if (Array.isArray(searchFclts)) {
@@ -48,46 +75,50 @@ export default function FcOrgwtsRegModal({
   }, [searchFclts]);
   useEffect(() => {
     if (code.sggCd.length > 0 && pbnstHasuRes.length > 0) {
-      setbdstTable(tableData(pbnstHasuRes, { code }));
-
-      console.log("bdstTable ", bdstTable);
+      const data = pbnstHasuRes.filter((item) => !initTableData?.find((initItem) => initItem.ruseUtztnFcltNm === item.bscFctNm))
+      leftRef.current?.filter((item) => !initTableData?.find((initItem) => initItem.ruseUtztnFcltNm === item.bscFctNm));
+      setbdstTable(tableData(data, { code }));
     }
-  }, [code, pbnstHasuRes]);
+  }, [code, pbnstHasuRes, initTableData]);
+  
 
   useEffect(() => {
-    console.log("rightData    ", rightData);
-    if (onRightSet)
-      onRightSet(
-        (rightData as pubHasuType[])?.map((item) => ({
-          swtrmtFcltFk: item.bscFctCd, // 임시값, 실제 데이터에 맞게 수정
-          orgwtWtritQnt: Number(item.fctCpc), // 임시값, 실제 데이터에 맞게 수정
-          tmsYn: "N", // 임시값, 실제 데이터에 맞게 수정
-          dschgFmYn: "N", // 임시값, 실제 데이터에 맞게 수정
-          dtlPstnExpln: item.addr, // 임시값, 실제 데이터에 맞게 수정
-          choose: false, // 임시값, 실제 데이터에 맞게 수정
-          // 필요한 경우 다른 속성들도 추가
-        })) as unknown as fcOrgwtType[]
-      );
-  }, [rightData]);
+    if (initTableData && Array.isArray(initTableData)) {
+      setRightData(initTableData.map(item => ({
+        ...item,
+        choose: item.choose,
+        sido: item.dtlPstnExpln?.split(" ")[0] || "",
+        gugun: item.dtlPstnExpln?.split(" ")[1] || "",
+        bscFctNm: item.ruseUtztnFcltNm,
+        addr: item.dtlPstnExpln,
+        orgwtWtritQnt: String(item.orgwtWtritQnt),
+        fctCpc: String(item.orgwtWtritQnt),
+        swtrmtFcltFk: item.swtrmtFcltFk,
+      })));
+      rightRef.current = initTableData.map(item => ({ ...item }));
+    }
+  }, []);
 
   return (
     <div className="flex flex-col h-[80vh]">
       <div className="shrink-0 p-4 border-b z-10 bg-white">
         <div className="flex items-center">
           <Title title="취수하수처리장 추가" />
-          {/* <Button size="sm" onClick={() => closeModal?.(false)}>저장</Button> */}
+          
           <div className="flex items-center gap-2 mt-8">
 
-          <Label className="text-xl text-gray-600">시설명</Label>
-          <Input
-            className="w-48 text-xl"
-            type="text"
-            value={inputVal}
-            onChange={(e) => setInputVal(e.target.value)}
-          />
-          <Button size="sm" onClick={() => getSwtrmtFcltNm(inputVal)}>
-            조회
-          </Button>
+
+            <Label className="text-xl text-gray-600">시설명</Label>
+            <Input
+              className="w-48 text-xl"
+              type="text"
+              value={inputVal}
+              onChange={(e) => setInputVal(e.target.value)}
+            />
+            <Button size="sm" onClick={() => getSwtrmtFcltNm(inputVal)}>
+              조회
+            </Button>
+            <Button size="sm" onClick={saveData}>저장</Button>
           </div>
         </div>
       </div>
@@ -107,10 +138,10 @@ export default function FcOrgwtsRegModal({
 
       {/* 테이블 영역 */}
       <div className="flex flex-row gap-4 flex-grow p-4 overflow-x-auto">
-      {/* 왼쪽 테이블 */}
+        {/* 왼쪽 테이블 */}
 
-      <div className="w-5/12 min-w-[400px]">
-      <Label className="text-2xl text-gray-600 mb-2 block text-right">
+        <div className="w-5/12 min-w-[400px]">
+          <Label className="text-2xl text-gray-600 mb-2 block text-right">
             공공하수처리시설 목록
           </Label>
           <RuseMngTable
@@ -123,7 +154,7 @@ export default function FcOrgwtsRegModal({
 
         {/* 중간 이동 버튼 */}
         <div className="flex flex-col justify-center items-center gap-4 w-[200px] min-w-[120px]">
-        <ArrowRight
+          <ArrowRight
             onClick={() => {
               const checked = leftRef.current?.filter((item) => item.choose);
               const unchecked = leftRef.current?.filter((item) => !item.choose);
@@ -159,7 +190,7 @@ export default function FcOrgwtsRegModal({
 
         {/* 오른쪽 테이블 */}
         <div className="w-5/12 min-w-[400px]">
-        <Label className="text-2xl text-gray-600 mb-2 block text-right">
+          <Label className="text-2xl text-gray-600 mb-2 block text-right">
             취수하수처리장 목록
           </Label>
           <RuseMngTable