현황에서 셀 클릭하면 지도 확대되도록 변경

apps/wr/app/map/newWindowPopup.tsx

@@ -116,7 +116,6 @@ const NewWindowPopup: React.FC<NewWindowPopupProps> = ({
     data:any | undefined;
   }>({ data: undefined });
   const [hasuTable, setHasuTable] = useState<pubHasuType[]>();
-  const [selectRow, setSelectRow] = useState<pubHasuType>();
   const [hasuPage, setHasuPage] = useState<number>(1);
   if (!featureData) return;
   ///////////////////////////////////////////// 피쳐데이터 선택 시 각 시설별 데이터 처리 ///////////////////////////////////////////////
@@ -141,19 +140,19 @@ const NewWindowPopup: React.FC<NewWindowPopupProps> = ({
         else if (layerId == '중수도시설') {
           featureCd = selectedVal?.bdst_nm;
           setFcltPk(featureCd)
-          rswtSttnSearch(1, '20', '', featureCd, code.cityCd, code.sggCd);
+          rswtSttnSearch(true,1, '20', '', featureCd, code.cityCd, code.sggCd);
           setRswtrDetailModal({ isOpen: true, data: rswtSttnRes[0] });
         }
         else if (layerId == '온배수시설') {
           featureCd = selectedVal?.bdst_nm;
           setFcltPk(featureCd)
-          htdflSttnSearch(1, '20', '', featureCd, code.cityCd, code.sggCd);
+          htdflSttnSearch(true,1, '20', '', featureCd, code.cityCd, code.sggCd);
           setHtdflDetailModal({ isOpen: true, data: htdflSttnRes[0] });
         }
         else if (layerId == '하수처리시설') {
           featureCd = selectedVal?.swtrmt_fclt_nm;
           setFcltPk(featureCd); // 현재 호출된 featureCd 저장
-          const res = fetchHasuDetail(featureCd,selectedVal?.swtrmt_fclt_cd);
+          fetchHasuDetail(featureCd,selectedVal?.swtrmt_fclt_cd);
         };
         setViewMode("detail")
 
@@ -171,11 +170,11 @@ const NewWindowPopup: React.FC<NewWindowPopupProps> = ({
       pbnstSttn.pbnstSttnRes[index]
     ) {
       setFcltPk(pbnstSttn.pbnstSttnRes[index].pbnstRuseFcltPk);
-      fetchpbnstDetail(pbnstSttn.pbnstSttnRes[index].pbnstRuseFcltPk)
-      // onFeatureSelect(pbnstSttn.pbnstSttnRes[index]);
-      setActiveTab(pbnstSttn.pbnstSttnRes[index].pbnstRuseFcltPk)
-      setViewMode("detail")
-      // onClose()
+      // fetchpbnstDetail(pbnstSttn.pbnstSttnRes[index].pbnstRuseFcltPk)
+      onFeatureSelect(pbnstSttn.pbnstSttnRes[index]);
+      // setActiveTab(pbnstSttn.pbnstSttnRes[index].pbnstRuseFcltPk)
+      // setViewMode("detail")
+      onClose()
     }
   };
   const getSelectedLayers = () => {
@@ -273,10 +272,10 @@ const NewWindowPopup: React.FC<NewWindowPopupProps> = ({
       index !== undefined &&
       rainTable !== undefined &&
       headId !== 'chBuildingYn') {
-      setRainDetailModal({ isOpen: true, data: rainTable[index] })
-      setViewMode('detail')
-      // onFeatureSelect(rainTable[index]);
-      // onClose();
+      // setRainDetailModal({ isOpen: true, data: rainTable[index] })
+      // setViewMode('detail')
+      onFeatureSelect(rainTable[index]);
+      onClose();
     } else if (headId === 'chBuildingYn' && index !== undefined && rainTable !== undefined) {
       if (rainTable[index] && rainTable[index]?.chgBuilding[0]?.bdstChgNm !== null)
         setRainBdstChgProps({ isOpen: true, chBuilding: rainTable[index].chgBuilding });
@@ -329,8 +328,10 @@ const NewWindowPopup: React.FC<NewWindowPopupProps> = ({
   // 중수도시설 cellClick 이벤트 (상세정보)
   const rswtCellClick = (index: number | undefined, headId: string) => {
     if (headId !== 'chBuildingYn' && index !== undefined && rswtrTable !== undefined) {
-      setRswtrDetailModal({ isOpen: true, data: rswtrTable[index] });
-      setViewMode('detail')
+      // setRswtrDetailModal({ isOpen: true, data: rswtrTable[index] });
+      // setViewMode('detail')
+      onFeatureSelect(rswtrTable[index]);
+      onClose();
     } else if (headId === 'chBuildingYn' && index !== undefined && rswtrTable !== undefined) {
       if (rswtrTable[index] && rswtrTable[index]?.chBuildingYn === 'Y') {
         setRswtrBdstChgProps({ isOpen: true, chBuilding: rswtrTable[index].chgBuilding });
@@ -339,7 +340,8 @@ const NewWindowPopup: React.FC<NewWindowPopupProps> = ({
   }
   useEffect(() => {
     if (!rswtSttn.isInit) {
-      rswtSttnInit(1, "20", "0", '', code.cityCd, code.sggCd);
+      rswtSttnInit(false,1, "20", "0", '', code.cityCd, code.sggCd);
+      console.log('rswtSttnInit', rswtSttnRes);
     }
   }, [rswtSttn.isInit, rswtSttnInit]);
 
@@ -361,8 +363,7 @@ const NewWindowPopup: React.FC<NewWindowPopupProps> = ({
         (item: customRswtBdst) =>
           item.reuseBuilding[0]?.rswtrObj !== undefined
       );
-
-    setRswtrTable(chData);
+      setRswtrTable(chData);
   }, [code, rswtSttnRes]);
   // 엑셀 관련 
   const rswtSttnExcelDownload = useCallback(() => {
@@ -378,20 +379,18 @@ const NewWindowPopup: React.FC<NewWindowPopupProps> = ({
   }, [rswtSttn.excelList])
 
   useEffect(() => {
-    rswtSttnSearch(rswtrPage, "20", '', '', code.cityCd, code.sggCd);
+    rswtSttnSearch(false,rswtrPage, "20", '', '', code.cityCd, code.sggCd);
   }, [rswtrPage]);
   ///////////////////////////////////////////// 중수도 시설 //////////////////////////////////////////////////
 
   ///////////////////////////////////////////// 온배수 시설 //////////////////////////////////////////////////
   // 온배수시설 cellClick 이벤트 (상세정보)
   const htdflCellClick = (index: number | undefined, headId: string) => {
-    if (
-      headId !== "chBuildingYn" &&
-      index !== undefined &&
-      htdflTable !== undefined
-    ) {
-      setHtdflDetailModal({ isOpen: true, data: htdflTable[index] });
-      setViewMode('detail')
+    if (index !== undefined && htdflTable !== undefined) {
+      // setHtdflDetailModal({ isOpen: true, data: htdflTable[index] });
+      // setViewMode('detail')
+      onFeatureSelect(htdflTable[index]);
+      onClose();
     }
   };
   useEffect(() => {
@@ -414,10 +413,11 @@ const NewWindowPopup: React.FC<NewWindowPopupProps> = ({
   }, [code, htdflSttnRes, htdflSttn.htdflSttHeadList]);
 
   useEffect(() => {
-    htdflSttnSearch(htdflPage, "20", '', '', code.cityCd, code.sggCd);
+    htdflSttnSearch(true,htdflPage, "20", '', '', code.cityCd, code.sggCd);
   }, [htdflPage]);
   ///////////////////////////////////////////// 온배수 시설 //////////////////////////////////////////////////
 
+  ///////////////////////////////////////////// 하수처리 시설 //////////////////////////////////////////////////
   useEffect(() => {
     if (code.sggCd.length && pbnstHasuRes.length > 0) {
       setHasuTable(tableData(pbnstHasuRes, { code }));
@@ -442,14 +442,19 @@ const NewWindowPopup: React.FC<NewWindowPopupProps> = ({
           };
         });
         pbnstHasuRes = hasuList
-        // console.log(hasuList)
         if(pbnstHasuRes.length >0)setIsRuseReg({ data:[pbnstHasuRes[0]] });
-        console.log(pbnstHasuRes)
         
     } catch (error) {
       console.error("Error fetching data:", error);
     }
   };
+  const hasuCellClick = (index: number | undefined, headId: string) => {
+    if (index !== undefined && pbnstHasuRes !== undefined) {
+      onFeatureSelect(pbnstHasuRes[index]);
+      onClose();
+    }
+  };
+///////////////////////////////////////////// 하수처리 시설 //////////////////////////////////////////////////
 
   // 체크된 레이어에 따른 조건부 컴포넌트 렌더링 함수
   const renderConditionalContent = () => {
@@ -482,7 +487,7 @@ const NewWindowPopup: React.FC<NewWindowPopupProps> = ({
               pageSize={10}
               total={100000}
               headName={""}
-              cellClick={() => { }}
+              cellClick={hasuCellClick}
               onPageChange={setHasuPage}
               children={undefined}
             />