diff --git a/apps/wr/app/map/newWindowPopup.tsx b/apps/wr/app/map/newWindowPopup.tsx index 6da584f8e..ccabfc443 100644 --- a/apps/wr/app/map/newWindowPopup.tsx +++ b/apps/wr/app/map/newWindowPopup.tsx @@ -61,6 +61,7 @@ const NewWindowPopup: React.FC = ({ const [rainTable, setRainTable] = useState(); const [rainPage, setRainPage] = useState(1) const [rainDetailModal, setRainDetailModal] = useState<{ isOpen: boolean, data: customRainBdst | undefined }>({ data: undefined, isOpen: false }); + const [rainList, setRainList] = useState(rainSttnRes || []); // 중수도시설 변수 const { rswtSttn, rswtSttnSearch, rswtSttnInit } = useWrStore( @@ -70,6 +71,7 @@ const NewWindowPopup: React.FC = ({ const [rswtrTable, setRswtrTable] = useState(); const [rswtrDetailModal, setRswtrDetailModal] = useState<{ isOpen: boolean, data: customRswtBdst | undefined }>({ data: undefined, isOpen: false }); const [rswtrPage, setRswtrPage] = useState(1); + const [rswtrList, setRswtrList] = useState(rswtSttnRes || []); // 온배수시설 변수 const { htdflSttn, htdflSttnSearch, initHtdfl } = useWrStore((state) => state); @@ -77,6 +79,7 @@ const NewWindowPopup: React.FC = ({ const [htdflTable, setHtdflTable] = useState(); const [htdflDetailModal, setHtdflDetailModal] = useState<{ isOpen: boolean, data: customHtdflBdst | undefined }>({ data: undefined, isOpen: false }); const [htdflPage, setHtdflPage] = useState(1) + const [htdflList, setHtdflList] = useState(htdflSttnRes || []); //하수처리시설 변수 const { @@ -118,8 +121,7 @@ const NewWindowPopup: React.FC = ({ }; const fetchHasuDetail = async (featureCd: string, data: string) => { try { - const rainRes = await postFectch(`/prcsFclt/ruseInfo/1/10/A/0/0/1/SW/${featureCd}`, [data], fetchType.COMMON); - //TODO : state 처리. + const rainRes = await postFectch(`/prcsFclt/ruseInfo/1/10/A/0/0/1/SW/${featureCd}`, [data], fetchType.COMMON) setHasuList( rainRes.data.map((item: any) => { return { @@ -127,34 +129,41 @@ const NewWindowPopup: React.FC = ({ fctCpc: Number(item.fctCpc) || 0, ruse: item.ruse === false ? "N" : "Y", }; - }); + }) ) - pbnstHasuRes = hasuList - if (hasuList.length > 0) setIsRuseReg({ data: [hasuList[0]] }); - } catch (error) { console.error("Error fetching data:", error); } }; - const detainSttn = async (featureCd: string, layerNm: string) => { if (layerNm == '빗물이용시설') { const res = await getFetch(fetchType.WR, `/reuseFc/rainyInfoList/1/20/0/${featureCd}`) - rainSttnRes = res - setRainDetailModal({ isOpen: true, data: rainSttnRes[0] }); + setRainList(res) } else if(layerNm == '중수도시설'){ const res = await getFetch(fetchType.WR,`/reuseFc/waterreuseFc/1/20/0/${featureCd}`) - rswtSttnRes = res - console.log('중수도', res, featureCd) - setRswtrDetailModal({isOpen:true,data:rswtSttnRes[0]}) + setRswtrList(res) } else{ const res = await getFetch(fetchType.WR, `/drain/facilityList/1/20/0/${featureCd}`) - htdflSttnRes = res + setHtdflList(res) setHtdflDetailModal({ isOpen: true, data: htdflSttnRes[0] }); } } + // 상세 목록 데이터 상태 처리 + useEffect(()=>{ + if (hasuList.length > 0) setIsRuseReg({ data: [hasuList[0]] }); + },[hasuList]) + useEffect(()=>{ + if (rainList.length > 0) setRainDetailModal({ isOpen: true, data: rainList[0] }); + },[rainList]) + useEffect(()=>{ + if (rswtrList.length > 0) setRswtrDetailModal({ isOpen: true, data: rswtrList[0] }); + },[rswtrList]) + useEffect(()=>{ + if (htdflList.length > 0) setHtdflDetailModal({ isOpen: true, data: htdflList[0] }); + },[htdflList]) + const layerId = getSelectedLayers(); if (featureData && typeof featureData.getProperties === "function") { const selectedVal = featureData.getProperties(); @@ -174,7 +183,9 @@ const NewWindowPopup: React.FC = ({ else{ featureCd = selectedVal?.bdst_nm; setFcltPk(featureCd) - detainSttn(featureCd,layerId) + if (layerId) { + detainSttn(featureCd, layerId); + } } setViewMode("detail") }