diff --git a/apps/wr/app/map/htdflSttn/page.tsx b/apps/wr/app/map/htdflSttn/page.tsx index 035713b35..80830aa90 100644 --- a/apps/wr/app/map/htdflSttn/page.tsx +++ b/apps/wr/app/map/htdflSttn/page.tsx @@ -3,7 +3,6 @@ import Gis from "@common/business_components/ui/map/Gis"; import { useEffect, useRef, useState, useCallback } from "react"; import { mapService } from "../service"; -// import { MapSearchBar } from "../mapSearchBar"; import NewWindowPopup from "../newWindowPopup"; import GisApp from "@common/business_components/ui/map/lib/gis.core"; diff --git a/apps/wr/app/map/mapSearchBar.tsx b/apps/wr/app/map/mapSearchBar.tsx deleted file mode 100644 index b24b5d83a..000000000 --- a/apps/wr/app/map/mapSearchBar.tsx +++ /dev/null @@ -1,414 +0,0 @@ -// "use client" - -// import { useWrStore } from "@/app/store"; -// import SearchInputText from "@/components/ui/searchInput/searchInput"; -// import type { EnvPartSelectDataType, ReturnType, SelectDataType } from "@common/business_components/ui"; -// import { SelectBox } from "@common/business_components/ui"; -// import { Button, Input, Label } from "@common/components/ui"; -// import React, { useEffect, useMemo, useRef, useState } from "react"; -// import { MapSearchFormLeft } from "./mapSearchForm"; - - -// // 건물 검색 타입 정의 -// interface BuildingInfo { -// bdstInfoPk: number; -// ctpvCd: number; -// sggCd: number; -// daddr: string; -// bdstNm: string; -// frstArchPrmsnDt: string; -// archArea: number; -// ctpvNm: string | null; -// sggNm: string | null; -// lat: number | null; -// lot: number | null; -// regDt: string; -// rgtr: string | null; -// mdfcnDt: string; -// mdfr: string | null; -// } - -// type SearchBaseType = { -// searchType: string; -// selectSidoData?: SelectDataType[] | []; -// selectSigunData?: SelectDataType[] | []; -// selectRegionData?: SelectDataType[] | []; -// selectUnitWaterShedData?: SelectDataType[] | []; -// selectMiddleRegionData?: SelectDataType[] | []; -// selectEnvPartData?: EnvPartSelectDataType[] | []; -// onFeatureSelect: () => void; -// btnClass?: string; -// ref?: React.RefObject; -// isAdmin?: boolean; -// leftClassName?: string; -// rightClassName?: string; -// showQueryButton?: boolean; -// showInitButton?: boolean; -// showApplyButton?: boolean; -// checkedLayers?: string[]; -// checkedLayersData?: any[]; -// } - -// const API_URL = `${process.env.NEXT_PUBLIC_SEWERAGE_API_URL}`; - -// const YEARS = Array.from({ length: 100 }, (_, i) => `${2025 - i}`); - -// interface SearchModalProps { -// open: boolean; -// onOpenChange: (open: boolean) => void; -// onFeatureSelect: (row: any) => void; -// } - -// interface SelectedDataTypeWithSggNm { -// text: string; -// val: string; -// sggNm: string; -// } - -// export function MapSearchBar({ -// searchType, -// selectSidoData, -// selectSigunData, -// selectRegionData, -// selectUnitWaterShedData, -// selectMiddleRegionData, -// selectEnvPartData, -// btnClass, -// onFeatureSelect, -// isAdmin = false, -// leftClassName, -// rightClassName, -// showQueryButton = true, -// showInitButton = true, -// showApplyButton = true, -// checkedLayers = [], -// checkedLayersData = [], -// }: SearchBaseType) { - -// // 로딩바 -// const [isLoading, setIsLoading] = useState(false); -// // 상세 정보 조회를 위한 상태 추가 -// const [popupFeature, setPopupFeature] = useState(null); -// const [isChHead, setIsChHead] = useState(false); -// const ref = useRef({} as ReturnType); - -// // zustand store에서 건물 검색 함수와 데이터 가져오기 -// const { -// code, -// bdst, -// findBdst, -// wrMap, -// buildingSearchRes, -// buildingNmSearch, -// buildingNmSearchMultiple -// } = useWrStore((state) => state); - -// const [selectedBuilding, setSelectedBuilding] = useState(null); -// const [buildingSearchText, setBuildingSearchText] = useState(""); -// const [buildingList, setBuildingList] = useState([]); - -// // 전체 목록 -// const [partValue, setPartValue] = useState("A"); -// const [sidoValue, setSidoValue] = useState("0"); -// const [sigunValue, setSigunValue] = useState("0"); -// const [regionValue, setRegionValue] = useState("0"); -// const [untitWaterShedValue, setUntitWaterShedValue] = useState("0"); -// const [middleRegionValue, setMiddleRegionValue] = useState("0"); -// const [envPartValue, setEnvPartValue] = useState("0"); -// const [resetTrigger, setResetTrigger] = useState(false); -// const [sidoText, setSidoText] = useState("0"); -// const [sigunText, setSigunText] = useState("0"); -// // 공급처 후보지 조회 필터 목록 -// const [selectedSido, setSelectedSido] = useState({ text: "전체", val: '0' }); -// const [selectedSigun, setSelectedSigun] = useState({ text: "전체", val: '0' }); -// const [selectedFclt, setSelectedFclt] = useState({ text: "전체", val: '0', sggNm: '전체' }); // 시설명 선택 상태 -// // 전체 시설 -// let allFclt: SelectedDataTypeWithSggNm[] = [{ text: "전체", val: '0', sggNm: '전체' }]; -// const [selectedDong, setSelectedDong] = useState({ text: "전체", val: '0', sggNm: '전체' }); // 시설명 선택 상태 // 행정동 - -// const filteredSigunData = useMemo(() => { -// if (!selectedSido || selectedSido.val === '0' || !selectedSido.val) return [{ text: "전체", val: '0' }]; -// return [ -// { text: "전체", val: '0' }, -// ...code.sggCd.filter((item: { val: string; }) => item.val.substring(0, 2) === selectedSido.val.substring(0, 2)) -// ]; -// }, [selectedSido]); - -// const filteredFcltData = useMemo(() => { -// if (!selectedSigun || selectedSigun.val === '0' || !selectedSigun.val) return [{ text: "전체", val: '0', sggNm: '전체' }]; -// return [ -// { text: "전체", val: '0', sggNm: '전체' }, -// ...allFclt.filter(item => item.sggNm === selectedSido.text) -// ]; -// }, [selectedSigun]); - -// const filteredDong = useMemo(() => { -// if (!selectedSigun || selectedSigun.val === '0' || !selectedSigun.val) return [{ text: "전체", val: '0', sggNm: '전체' }]; -// return [ -// { text: "전체", val: '0', sggNm: '전체' }, -// // ...code.dong.filter(item => item.sggNm === selectedSido.text) -// ]; -// }, [selectedSigun]); - -// // 조회 함수 -// const queryVal = () => { -// // 46 : 하수처리시설 -// // 47 : 하수재이용시설 -// // 48 : 빗물이용시설 -// // 49 : 중수도시설 -// // 50 : 온배수시설 -// console.log("조회버튼 클릭: ", checkedLayers); -// if (checkedLayers && checkedLayers.includes('48')) { -// // searchBuildings -// } -// } - -// // 초기화 함수 -// const initVal = () => { -// setPartValue("A"); -// setSidoValue("0"); -// setSigunValue("0"); -// setRegionValue("0"); -// setUntitWaterShedValue("0"); -// setMiddleRegionValue("0"); -// setEnvPartValue("0"); -// setSidoText("전체"); -// setSigunText("전체"); -// setSelectedSido({ text: "전체", val: '0' }); -// setSelectedSigun({ text: "전체", val: '0' }); -// setSelectedFclt({ text: "전체", val: '0', sggNm: '전체' }); -// setSelectedDong({ text: "전체", val: '0', sggNm: '전체' }); -// setResetTrigger(true); -// }; - -// // 적용 버튼 -// const applyVal = () => { -// onFeatureSelect(); -// }; - -// useEffect(() => { -// if (resetTrigger) { -// setResetTrigger(false); -// } -// }, [resetTrigger]); - -// // 시설 조회 -// useEffect(() => { -// const fetchData = async () => { -// setIsLoading(true); -// if (!selectedSigun || selectedSigun.val === '0' || !selectedSigun.val) { -// allFclt = ([{ text: "전체", val: '0', sggNm: '전체' }]); -// setIsLoading(false); -// return; -// } - -// try { -// const queryParamsFacility = new URLSearchParams({ -// lyrTypeNm: 'tb_il_swage_prcs_fclt', -// page: '0', -// size: '100000', -// sort: 'string', -// }); -// const cqlFiltersFacility: string[] = []; -// if (selectedSigun.text && selectedSigun.val !== '0') { -// cqlFiltersFacility.push(`sgg_nm ILIKE '%${selectedSigun.text}%'`); -// } -// if (cqlFiltersFacility.length > 0) { -// queryParamsFacility.append('cqlFiter', cqlFiltersFacility.join(' and ')); -// } -// console.log("BaseLayout API URL for Facilities:", `v1/fclts?${queryParamsFacility.toString()}`); - -// const facilityRes = await fetch(`${API_URL}/v1/fclts?${queryParamsFacility.toString()}`, { -// method: "GET", -// headers: { accept: "application/json" } -// }).then(res => res.json()); - -// const facilities = (facilityRes.data || []).map((item: any) => ({ -// text: item.swtrmtFcltNm, -// val: item.fid, -// sggNm: item.sggNm -// })); -// allFclt = (facilities); - -// } catch (error) { -// console.error("BaseLayout: 지역/시설 데이터 조회 중 오류 발생:", error); -// allFclt = ([{ text: "전체", val: '0', sggNm: '전체' }]); -// } finally { -// setIsLoading(false); -// } -// }; - -// fetchData(); -// }, [selectedSigun]); - -// useEffect(() => { -// if (ref && ref.current) { -// const customRef = ref.current; -// customRef.partValue = partValue; -// customRef.sidoValue = sidoValue; -// customRef.sigunValue = sigunValue; -// customRef.regionValue = regionValue; -// customRef.unitWaterShedValue = untitWaterShedValue; -// customRef.middleRegionValue = middleRegionValue; -// customRef.envPartValue = envPartValue; -// customRef.sidoText = selectedSido.text; -// customRef.sigunText = selectedSigun.text; -// } -// }, [partValue, sidoValue, sigunValue, regionValue, untitWaterShedValue, middleRegionValue, envPartValue, ref]); - -// // buildingSearchText가 변경될 때 API 호출 -// useEffect(() => { -// if (buildingSearchText && buildingSearchText.length > 1) { -// if (checkedLayers && checkedLayers.length > 0) { -// // 다중 레이어 검색 -// // buildingNmSearchMultiple(checkedLayers, selectedSigun.val || "", buildingSearchText); -// buildingNmSearch("RNB", selectedSigun.val, buildingSearchText); -// } else { -// // 단일 레이어 검색 -// // buildingNmSearch(checkedLayers[0], selectedSigun.val, buildingSearchText); -// } -// } else { -// // 검색 텍스트가 짧으면 리스트 초기화 -// if (checkedLayers && checkedLayers.length > 0) { -// // buildingNmSearchMultiple(checkedLayers, selectedSigun.val || "", ""); -// } else { -// buildingNmSearch("RNB", selectedSigun.val || "", ""); -// } -// } -// }, [buildingSearchText]); - -// return ( -//
-//
-//
-// {searchType == "공급처 후보지 조회" && ( -// <> -// { -// const selected = code.cityCd.find((item: { val: string | number; }) => (item.val === val)); -// setSelectedSido(selected || { text: "전체", val: '0' }); -// setSelectedSigun({ text: "전체", val: '0' }); -// }} -// value={selectedSido.val} -// selectClass={'w-32'} -// /> -// { -// const selected = filteredSigunData.find(item => (item.val === val)); -// setSelectedSigun(selected || { text: "전체", val: '0' }); -// setSelectedFclt({ text: "전체", val: '0', sggNm: '전체' }); -// }} -// value={selectedSigun.val} -// selectClass={'w-32'} -// /> -//
-// -//
-// { -// setBuildingSearchText(searchNm || ""); -// }} -// setRtnData={function (rtnData: any): void { -// // 선택된 건물 데이터 처리 -// // if (rtnData && rtnData.bdstInfoPk) { -// // setSelectedBuilding(rtnData); -// // setBuildingSearchText(rtnData.bdstNm || ""); -// // } -// }} -// searchList={buildingSearchRes || []} -// /> -//
-//
-// -// )} -// {searchType == "우리동네가뭄지도보기" && ( -// <> -// { -// const selected = code.cityCd.find((item: { val: string | number; }) => (item.val === val)); -// setSelectedSido(selected || { text: "전체", val: '0' }); -// setSelectedSigun({ text: "전체", val: '0' }); -// }} -// value={selectedSido.val} -// selectClass={'w-44'} -// /> -// { -// const selected = filteredSigunData.find(item => (item.val === val)); -// setSelectedSigun(selected || { text: "전체", val: '0' }); -// setSelectedDong({ text: "전체", val: '0', sggNm: '전체' }); -// }} -// value={selectedSigun.val} -// selectClass={'w-32'} -// /> -// { -// const selected = filteredDong.find(item => (item.val === val)); -// setSelectedDong(selected || { text: "전체", val: '0', sggNm: '전체' }); -// }} -// value={selectedDong.val} -// selectClass={'w-32'} -// /> -// -// )} -// {searchType == "지도보기" && ( -//
-//
{/* SearchFormLeft 래퍼 */} -// -//
-// -//
-// -//
-//
-// )} -//
-// {/* 버튼 부분 */} -//
-// {showQueryButton && } -// {showInitButton && } -// {showApplyButton && } -//
-//
-//
-// ) -// } diff --git a/apps/wr/app/map/mapSearchForm.tsx b/apps/wr/app/map/mapSearchForm.tsx deleted file mode 100644 index e01c60faf..000000000 --- a/apps/wr/app/map/mapSearchForm.tsx +++ /dev/null @@ -1,340 +0,0 @@ -// "use client" - -// import React, { useEffect, useState } from 'react'; -// import type { SelectDataType } from '@common/business_components/ui/search_input_select'; -// import { SelectBox } from '@common/business_components/ui/select'; - -// /** -// * 검색 폼 왼쪽 컴포넌트 타입 -// * -// * @param isShowPart 구분 조회 여부 -// * @param children 자식 컴포넌트 -// * @param selectSidoData 시도 데이터 -// * @param selectSigunData 시군구 데이터 -// * @param selectRegionData 유역 데이터 -// * @param selectUnitWaterShedData 단위유역 데이터 -// * @param selectMiddleRegionData 중권역 데이터 -// * @param selectEnvPartData 환경청 데이터 -// * @param selectEnvPartSidoData 환경청 시도 데이터 -// * @param selectEnvPartSigunData 환경청 시군구 데이터 -// * @param setRtnPartValue 부분 값 변경 핸들러 -// */ -// type SearchFormLeftProps = { -// isShowPart?: boolean | undefined; -// children: React.ReactNode; -// selectSidoData?: SelectDataType[] | []; -// selectSigunData?: SelectDataType[] | []; -// selectRegionData?: SelectDataType[] | []; -// selectUnitWaterShedData?: SelectDataType[] | []; -// selectMiddleRegionData?: SelectDataType[] | []; -// selectEnvPartData?: EnvPartSelectDataType[] | []; -// selectEnvPartSidoData?: SelectDataType[] | []; -// selectEnvPartSigunData?: SelectDataType[] | []; - -// setRtnPartValue?: (value: string) => void; -// setRtnSidoValue?: (value: string) => void; -// setRtnSigunValue?: (value: string) => void; -// setRtnRegionValue?: (value: string) => void; -// setRtnUnitWaterShedValue?: (value: string) => void; -// setRtnMiddleRegionValue?: (value: string) => void; -// setRtnEnvPartValue?: (value: string) => void; -// setRtnEnvPartSidoValue?: (value: string) => void; -// setRtnEnvPartSigunValue?: (value: string) => void; -// setRtnSidoText?: (value: string) => void; -// setRtnSigunText?: (value: string) => void; -// resetTrigger?: boolean; -// isAdmin?: boolean; -// } - -// export type EnvPartSelectDataType = SelectDataType & { -// adstDliStrCd: string, -// } - -// const selectPartData: SelectDataType[] = [ -// { text: "행정별", val: 'A' }, -// { text: "유역별", val: 'R' }, -// { text: "환경청별", val: 'G' }, -// ]; - -// function MapSearchFormLeft({ isShowPart = false, children, selectSidoData = [], selectSigunData = [], selectRegionData = [], selectUnitWaterShedData = [], selectMiddleRegionData = [], selectEnvPartData = [], setRtnPartValue, setRtnSidoValue, setRtnSidoText, setRtnSigunValue, setRtnSigunText, setRtnRegionValue, setRtnUnitWaterShedValue, setRtnMiddleRegionValue, setRtnEnvPartValue, setRtnEnvPartSidoValue, setRtnEnvPartSigunValue, resetTrigger = false, isAdmin = false }: SearchFormLeftProps) { -// /******************선택된 데이터******************/ -// const [partValue, setPartValue] = useState('A'); -// //행정별 시도 시군구 -// const [sidoValue, setSidoValue] = useState('0'); -// const [sigunValue, setSigunValue] = useState('0'); -// const [sidoText, setSidoText] = useState(''); -// const [sigunText, setSigunText] = useState(''); -// //유역별 -// const [regionValue, setRegionValue] = useState('0'); -// const [unitWaterShedValue, setUnitWaterShedValue] = useState('0'); -// const [middleRegionValue, setMiddleRegionValue] = useState('0'); -// //환경청별 시도 시군구 -// const [envPartValue, setEnvPartValue] = useState('0'); -// // 환경청 -// const [filteredEnvPartSigunDataSelected, setFilteredEnvPartSigunDataSelected] = useState([]); - -// /****************** 셀렉트 리스트 데이터. ******************/ -// // 조회된 조건에 맞는 시도 시군 유역 -// const [filteredSigunData, setFilteredSigunData] = useState([{ text: "전체", val: '0' }]); -// const [filteredUnitWaterShedData, setFilteredUnitWaterShedData] = useState([{ text: "전체", val: '0' }]); -// const [filteredMiddleRegionData, setFilteredMiddleRegionData] = useState([{ text: "전체", val: '0' }]); -// // 조회된 조건에 맞는 환경청 시도 시군 -// const [filteredEnvPartData, setFilteredEnvPartData] = useState([{ text: "전체", val: '0', adstDliStrCd: '' }]); -// const [filteredEnvPartSidoData, setFilteredEnvPartSidoData] = useState([{ text: "전체", val: '0', adstDliStrCd: '' }]); -// const [filteredEnvPartSigunData, setFilteredEnvPartSigunData] = useState([{ text: "전체", val: '0' }]); - -// // 시군구 세팅 -// const initializeSigunData = (sidoCd: string) => { -// if (sidoCd === '0') { -// setSigunValue('0'); -// setFilteredSigunData([{ text: "전체", val: '0' }]); -// } else { -// const newFilteredData = [ -// { text: "전체", val: '0' }, -// ...selectSigunData.filter((item: SelectDataType) => item.val.substring(0, 2) === sidoCd) -// ]; -// setSigunValue('0'); -// setFilteredSigunData(newFilteredData); -// } -// } - -// // 단위유역 세팅 -// const initializeUnitWaterShedData = (regionCd: string) => { -// if (regionCd === '0') { -// setUnitWaterShedValue('0'); -// setFilteredUnitWaterShedData([{ text: "전체", val: '0' }]); -// } else { -// const newFilteredData = [ -// { text: "전체", val: '0' }, -// ...selectUnitWaterShedData.filter((item: SelectDataType) => item.val.substring(0, 1) === regionCd) -// ]; -// setUnitWaterShedValue('0'); -// setFilteredUnitWaterShedData(newFilteredData); -// } -// } - -// // 중권역 세팅 -// const initializeMiddleRegionData = (unitWaterShedCd: string) => { -// if (unitWaterShedCd === '0') { -// setMiddleRegionValue('0'); -// setFilteredMiddleRegionData([{ text: "전체", val: '0' }]); -// } else { -// const newFilteredData = [ -// { text: "전체", val: '0' }, -// ...selectMiddleRegionData.filter((item: SelectDataType) => item.val.substring(0, 2) === unitWaterShedCd) -// ]; -// setMiddleRegionValue('0'); -// setFilteredMiddleRegionData(newFilteredData); -// } -// } - -// // 환경청 세팅 - 시도 -// const initializeCityDataByEnvPartSido = (envPartCd: string) => { -// const foundEnvPart = selectEnvPartData.find((item: EnvPartSelectDataType) => item.val === envPartCd); -// const cityArray = foundEnvPart?.adstDliStrCd.toString().split('|').join('').split(','); - -// // 시군구 데이터 -// const envSigunData = selectSigunData.filter((item: SelectDataType) => cityArray?.includes(item.val)); - -// // 환경청 시도 데이터 -// const sidoArray = [...new Set(envSigunData.map((item: SelectDataType) => item.val.substring(0, 2)))]; -// const envSidoData = selectSidoData.filter((item: SelectDataType) => sidoArray?.includes(item.val)); -// setFilteredEnvPartSigunDataSelected(envSigunData); - -// setFilteredEnvPartSidoData([ -// { text: "전체", val: '0', adstDliStrCd: '' }, -// ...envSidoData.map((item: SelectDataType) => ({ text: item.text, val: item.val, adstDliStrCd: '' })) -// ]); -// } - -// // 환경청 세팅 - 시군구 -// const initializeCityDataByEnvPartSigun = (sidoCd: string) => { -// const envSigunData = filteredEnvPartSigunDataSelected.filter((item: SelectDataType) => item.val.substring(0, 2) === sidoCd); -// setFilteredEnvPartSigunData([ -// { text: "전체", val: '0' }, -// ...envSigunData.map((item: SelectDataType) => ({ text: item.text, val: item.val })) -// ]); -// } - -// const onSelectValue = (val: string, type: string) => { -// let selectedSido; -// let selectedSigun; -// let selectedEnvPartSido; -// let selectedEnvPartSigun; - -// switch (type) { -// case 'part': -// setPartValue(val); -// if (setRtnPartValue) { -// setRtnPartValue(val); -// } -// // 구분 -// if (val == 'R') { -// initializeMiddleRegionData('0'); -// initializeUnitWaterShedData('0'); -// } else if (val == 'G') { -// setFilteredEnvPartData([ -// { text: "전체", val: '0', adstDliStrCd: '' }, -// ...selectEnvPartData.filter((item: EnvPartSelectDataType) => item.val !== null && item.adstDliStrCd !== '') -// ]); -// setEnvPartValue('0'); -// initializeCityDataByEnvPartSido('0'); -// } else { -// initializeSigunData('0'); -// onSelectValue(selectSigunData[0]?.val || '0', 'sigun'); -// } - -// // 다른 selectbox 전체로 초기화 -// onSelectValue(selectSidoData[0]?.val || '0', 'sido'); -// onSelectValue(selectSigunData[0]?.val || '0', 'sigun'); -// break; -// case 'sido': -// setSidoValue(val); -// selectedSido = selectSidoData.find(item => item.val === val); -// setSidoText(selectedSido?.text || ''); -// if (setRtnSidoValue) { -// setRtnSidoValue(val); -// } -// if (setRtnSidoText) { -// setRtnSidoText(selectedSido?.text || ''); -// } -// initializeSigunData(val); -// onSelectValue(selectSigunData[0]?.val || '0', 'sigun'); -// break; -// case 'sigun': -// if (setRtnSigunValue) { -// setRtnSigunValue(val); -// } -// setSigunValue(val); -// selectedSigun = filteredSigunData.find(item => item.val === val); -// if (setRtnSigunText) { -// setRtnSigunText(selectedSigun?.text || ''); -// } -// setSigunText(selectedSigun?.text || ''); -// break; - -// // 유역 세팅 -// case 'region': -// setRegionValue(val); -// if (setRtnRegionValue) { -// setRtnRegionValue(val); -// } -// initializeUnitWaterShedData(val); -// onSelectValue(selectUnitWaterShedData[0]?.val || '0', 'unitWaterShed'); -// break; -// case 'unitWaterShed': -// setUnitWaterShedValue(val); -// if (setRtnUnitWaterShedValue) { -// setRtnUnitWaterShedValue(val); -// } -// initializeMiddleRegionData(val); -// onSelectValue(selectMiddleRegionData[0]?.val || '0', 'middleRegion'); -// break; -// case 'middleRegion': -// setMiddleRegionValue(val); -// if (setRtnMiddleRegionValue) { -// setRtnMiddleRegionValue(val); -// } -// break; - -// // 환경청 세팅 -// case 'envPart': -// setEnvPartValue(val); -// if (setRtnEnvPartValue) { -// setRtnEnvPartValue(val); -// } -// initializeCityDataByEnvPartSido(val); -// onSelectValue(filteredEnvPartSidoData[0]?.val || '0', 'envPartSido'); -// break; -// case 'envPartSido': -// setSidoValue(val); -// selectedEnvPartSido = filteredEnvPartSidoData.find(item => item.val === val); -// setSidoText(selectedEnvPartSido?.text || ''); -// if (setRtnEnvPartSidoValue) { -// setRtnEnvPartSidoValue(val); -// } -// initializeCityDataByEnvPartSigun(val); -// onSelectValue(filteredEnvPartSigunData[0]?.val || '0', 'envPartSigun'); -// break; -// case 'envPartSigun': -// setSigunValue(val); -// selectedEnvPartSigun = filteredEnvPartSigunData.find(item => item.val === val); -// setSigunText(selectedEnvPartSigun?.text || ''); -// if (setRtnEnvPartSigunValue) { -// setRtnEnvPartSigunValue(val); -// } -// break; -// } -// } - -// // 리셋 함수 -// const resetAllValues = () => { -// setPartValue('A'); -// setSidoValue('0'); -// setSigunValue('0'); -// setRegionValue('0'); -// setUnitWaterShedValue('0'); -// setMiddleRegionValue('0'); -// setEnvPartValue('0'); - -// setFilteredSigunData([{ text: "전체", val: '0' }]); -// setFilteredUnitWaterShedData([{ text: "전체", val: '0' }]); -// setFilteredMiddleRegionData([{ text: "전체", val: '0' }]); -// setFilteredEnvPartData([{ text: "전체", val: '0', adstDliStrCd: '' }]); -// setFilteredEnvPartSidoData([{ text: "전체", val: '0', adstDliStrCd: '' }]); -// setFilteredEnvPartSigunData([{ text: "전체", val: '0' }]); - -// if (setRtnPartValue) setRtnPartValue('A'); -// if (setRtnSidoValue) setRtnSidoValue('0'); -// if (setRtnSigunValue) setRtnSigunValue('0'); -// if (setRtnRegionValue) setRtnRegionValue('0'); -// if (setRtnUnitWaterShedValue) setRtnUnitWaterShedValue('0'); -// if (setRtnMiddleRegionValue) setRtnMiddleRegionValue('0'); -// if (setRtnEnvPartValue) setRtnEnvPartValue('0'); -// if (setRtnEnvPartSidoValue) setRtnEnvPartSidoValue('0'); -// if (setRtnEnvPartSigunValue) setRtnEnvPartSigunValue('0'); -// }; - -// // 리셋 트리거 변경 감지 -// useEffect(() => { -// if (resetTrigger) { -// resetAllValues(); -// // 리셋 후 트리거를 false로 설정 -// if (setRtnPartValue) { -// setRtnPartValue('0'); -// } -// } -// }, [resetTrigger]); - -// return ( -// isShowPart ? ( -//
-// onSelectValue(val.toString(), 'part')} value={partValue} selectClass={'w-32'} /> -// {partValue === 'R' ? ( -// <> -// onSelectValue(val.toString(), 'region')} value={regionValue} selectClass={'w-44'} /> -// onSelectValue(val.toString(), 'unitWaterShed')} value={unitWaterShedValue} selectClass={'w-44'} /> -// onSelectValue(val.toString(), 'middleRegion')} value={middleRegionValue} selectClass={'w-44'} /> -// -// ) : partValue === 'G' ? ( -// <> -// onSelectValue(val.toString(), 'envPart')} value={envPartValue} selectClass={'w-44'} /> -// onSelectValue(val.toString(), 'envPartSido')} value={sidoValue} selectClass={'w-44'} /> -// onSelectValue(val.toString(), 'envPartSigun')} value={sigunValue} selectClass={'w-44'} /> -// -// ) : ( -// <> -// onSelectValue(val.toString(), 'sido')} value={sidoValue} selectClass={'w-44'} /> -// onSelectValue(val.toString(), 'sigun')} value={sigunValue} selectClass={'w-44'} /> -// -// )} -//
-// ) : ( -//
-// {children} -//
-// ) -// ) -// } - -// export { MapSearchFormLeft }; diff --git a/apps/wr/app/map/newWindowPopup.tsx b/apps/wr/app/map/newWindowPopup.tsx index 3bb7cd9be..e74e64657 100644 --- a/apps/wr/app/map/newWindowPopup.tsx +++ b/apps/wr/app/map/newWindowPopup.tsx @@ -6,7 +6,7 @@ import type { customRainBdst } from "@/app/store/ruseFcltMng/fcltReg/rainReg"; import type { customRswtBdst } from "@/app/store/ruseFcltMng/fcltReg/rswtReg"; import type { WaterReuseFacility } from "@/app/store/ruseFcltMng/fcltSttn/pbnstSttn/type"; import { fetchType, getFetch, postFectch } from "@/components/lib/api"; -import { excelDownload, tableData } from "@/components/lib/func/commom"; +import { tableData } from "@/components/lib/func/commom"; import { PbnstSttnModal } from "@/components/ui/modal/sttn/pbnstSttnModal/pbnstSttnModal"; import SttnDetailModal from "@/components/ui/modal/sttn/sttnDetailModal/sttnDetailModal"; import { Title, UITab, UiTable } from '@common/business_components'; @@ -55,34 +55,37 @@ const NewWindowPopup: React.FC = ({ const { rainSttn, rainSttnSearch, rainSttnInit } = useWrStore( (state) => state ); - let { rainSttnRes, rainSttnResCount } = rainSttn; + const { rainSttnRes, rainSttnResCount } = rainSttn; 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( (state) => state ); - let { rswtSttnRes, rswtSttnResCount } = rswtSttn; + const { rswtSttnRes, rswtSttnResCount } = rswtSttn; 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); - let { htdflSttnRes, htdflSttnResCount } = htdflSttn; + const { htdflSttnRes,htdflSttnResCount } = htdflSttn; 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 { pbnst, pubHasuInit, } = useWrStore((state) => state); - let { pubFacHeadList, pbnstHasuRes } = pbnst; + const { pubFacHeadList, pbnstHasuRes } = pbnst; + const [hasuList, setHasuList] = useState(pbnstHasuRes || []); const [isRuseReg, setIsRuseReg] = useState<{ data: any | undefined; }>({ data: undefined }); @@ -93,7 +96,7 @@ const NewWindowPopup: React.FC = ({ const getSelectedLayers = () => { let result = null; const layers = gisMap ? gisMap.getLayers().getArray().filter((l: any) => l.getVisible()) : []; // gisMap이 null인지 확인 후 레이어 가져오기 - let featureLayer: { get: (key: string) => any }; // 피처가 속한 레이어를 찾기 위한 변수 + let featureLayer: { get: (key: string) => any } = {get:()=> null}; layers.forEach((layer: any) => { const source = layer.getSource(); if (source && source.hasFeature && featureData @@ -105,8 +108,61 @@ const NewWindowPopup: React.FC = ({ return result; }; - useEffect(() => { - const layerId = getSelectedLayers(); + const fetchpbnstDetail = async (featureCd: string) => { + try { + const response = await getFetch("wr", `/reuseFc/pubFc/${featureCd}`); + // 중복 데이터 추가 방지 + setTabDataFunc(response, featureCd); + } catch (error) { + console.error("Error fetching data:", error); + } + }; + 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) + setHasuList( + rainRes.data.map((item: any) => { + return { + ...item, + fctCpc: Number(item.fctCpc) || 0, + ruse: item.ruse === false ? "N" : "Y", + }; + }) + ) + } 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}`) + setRainList(res) + } + else if(layerNm == '중수도시설'){ + const res = await getFetch(fetchType.WR,`/reuseFc/waterreuseFc/1/20/0/${featureCd}`) + setRswtrList(res) + } + else{ + const res = await getFetch(fetchType.WR, `/drain/facilityList/1/20/0/${featureCd}`) + 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(); let featureCd = layerId == '하수재이용시설' ? selectedVal?.swtrmt_fclt_cd : layerId == '빗물이용시설' || layerId == '중수도시설' || layerId == '온배수시설' ? selectedVal?.bdst_nm : layerId == '하수처리시설' ? selectedVal?.swtrmt_fclt_nm : null; @@ -125,12 +181,13 @@ const NewWindowPopup: React.FC = ({ else { featureCd = selectedVal?.bdst_nm; setFcltPk(featureCd) - detainSttn(featureCd, layerId) + if (layerId) { + detainSttn(featureCd, layerId); + } } setViewMode("detail") } } else if (layerId === null && seletectedLayerNm) { setViewMode("list") } - }, [featureData]); ///////////////////////////////////////////// 피쳐데이터 선택 시 각 시설별 데이터 처리 /////////////////////////////////////////////// ///////////////////////////////////////////// 하수재이용시설 ////////////////////////////////////////////////// @@ -152,8 +209,8 @@ const NewWindowPopup: React.FC = ({ if (!pbnstSttn.isInit) { getFlcts() } - }, [seletectedLayerNm, pbnstSttn.isInit]); - useEffect(() => { + }, [seletectedLayerNm, pbnstSttn.isInit, getFlcts]); + useEffect(()=>{ pbnSttnInit("1", "15", { partValue: "A", sidoValue: '0', @@ -180,15 +237,6 @@ const NewWindowPopup: React.FC = ({ }); } // 재이용시설 조회 - const fetchpbnstDetail = async (featureCd: string) => { - try { - const response = await getFetch("wr", `/reuseFc/pubFc/${featureCd}`); - // 중복 데이터 추가 방지 - setTabDataFunc(response, featureCd); - } catch (error) { - console.error("Error fetching data:", error); - } - }; // 재이용시설 페이징처리 관련 함수 const onPageChangeHandler = useCallback((page: number) => { pbnstSttnSearch( @@ -210,18 +258,18 @@ const NewWindowPopup: React.FC = ({ String(new Date().getFullYear()), fclts ); }, []); - const excelClick = useCallback(() => { - // if (codeData) pbnstSttnSearch(1, "10000", codeData); - excelDownload( - [[]], - "하수재이용시설 현황", - "sample_pbnstSttn.xlsx", - "A1:U2" - ); - }, [pbnstSttnSearch]); +// FIXME: 윤선화차장님 요구사항으로 엑셀 다운로드 삭제. + // const excelClick = useCallback(() => { + // // if (codeData) pbnstSttnSearch(1, "10000", codeData); + // excelDownload( + // [[]], + // "하수재이용시설 현황", + // "sample_pbnstSttn.xlsx", + // "A1:U2" + // ); + // }, [pbnstSttnSearch]); ///////////////////////////////////////////// 하수재이용시설 ////////////////////////////////////////////////// - ///////////////////////////////////////////// 빗물 재이용 ////////////////////////////////////////////////// // 빗물재이용시설 cellClick 이벤트 (상세정보) const rainCellClick = (index: number | undefined, headId: string) => { @@ -235,24 +283,7 @@ const NewWindowPopup: React.FC = ({ onClose(); } } - 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] }); - } - 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] }) - } - else { - const res = await getFetch(fetchType.WR, `/drain/facilityList/1/20/0/${featureCd}`) - htdflSttnRes = res - setHtdflDetailModal({ isOpen: true, data: htdflSttnRes[0] }); - } - } + useEffect(() => { if (!rainSttn.isInit) { @@ -304,10 +335,6 @@ const NewWindowPopup: React.FC = ({ // 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 }); - } } } useEffect(() => { @@ -336,18 +363,18 @@ const NewWindowPopup: React.FC = ({ ); setRswtrTable(chData); }, [code, rswtSttnRes]); - // 엑셀 관련 - const rswtSttnExcelDownload = useCallback(() => { - if (rswtSttn.excelList.length > 0) { - if (rswtSttn.excelList.length === 0) return; - excelDownload( - rswtSttn.excelList, - "중수도시설 현황", - "sample_rswtSttn.xlsx", - "A1:W3", - ); - } - }, [rswtSttn.excelList]) + // FIXME: 윤선화 차장님 요구사항으로 엑셀 다운로드 삭제. + // const rswtSttnExcelDownload = useCallback(() => { + // if (rswtSttn.excelList.length > 0) { + // if (rswtSttn.excelList.length === 0) return; + // excelDownload( + // rswtSttn.excelList, + // "중수도시설 현황", + // "sample_rswtSttn.xlsx", + // "A1:W3", + // ); + // } + // }, [rswtSttn.excelList]) useEffect(() => { rswtSttnSearch(false, rswtrPage, "20", '', '', code.cityCd, code.sggCd); @@ -400,24 +427,8 @@ const NewWindowPopup: React.FC = ({ useEffect(() => { pubHasuInit(String(hasuPage), "0"); }, [hasuPage]); - 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); - const hasuList = rainRes.data.map((item: any) => { - return { - ...item, - fctCpc: Number(item.fctCpc) || 0, - ruse: item.ruse === false ? "N" : "Y", - }; - }); - pbnstHasuRes = hasuList - if (pbnstHasuRes.length > 0) setIsRuseReg({ data: [pbnstHasuRes[0]] }); - - } catch (error) { - console.error("Error fetching data:", error); - } - }; - const hasuCellClick = (index: number | undefined, headId: string) => { + + const hasuCellClick = (index: number | undefined) => { if (index !== undefined && pbnstHasuRes !== undefined) { onFeatureSelect(pbnstHasuRes[index]); onClose(); @@ -458,7 +469,6 @@ const NewWindowPopup: React.FC = ({ headName={""} cellClick={hasuCellClick} onPageChange={setHasuPage} - children={undefined} /> ) @@ -473,21 +483,19 @@ const NewWindowPopup: React.FC = ({ tableData={isRuseReg?.data || []} headlist={pubFacHeadList.slice(0, 4)} pageSize={1} - total={null} + total={0} headName={"위치정보"} cellClick={() => { }} onPageChange={() => { }} - children={undefined} /> { }} onPageChange={() => { }} - children={undefined} /> ) @@ -509,7 +517,6 @@ const NewWindowPopup: React.FC = ({ label: tab.name, onClick: () => setActiveTab(tab.id), }))} - children={undefined} /> = ({ } headlist={pbnstSttn.pbnstSttHeadList} pageSize={20} total={pbnstSttnResCount || 0} - cellClick={(index: number | undefined, headId: string) => { + cellClick={(index: number | undefined) => { pbnstCellClick(index); }} onPageChange={onPageChangeHandler} - /> + > + + ); } @@ -568,7 +576,6 @@ const NewWindowPopup: React.FC = ({ } headlist={rainSttn.rainSttHeadList} pageSize={20} total={rainSttnResCount} @@ -576,7 +583,9 @@ const NewWindowPopup: React.FC = ({ rainCellClick(index ?? undefined, headId); }} onPageChange={setRainPage} - /> + > + + ); } @@ -603,7 +612,6 @@ const NewWindowPopup: React.FC = ({ } headlist={rswtSttn.rswtSttHeadList} pageSize={20} total={rswtSttnResCount} @@ -611,7 +619,9 @@ const NewWindowPopup: React.FC = ({ rswtCellClick(index, headId); }} onPageChange={setRswtrPage} - /> + > + + ); } @@ -638,7 +648,6 @@ const NewWindowPopup: React.FC = ({ } headlist={htdflSttn.htdflSttHeadList} pageSize={20} total={htdflSttnResCount || 0} @@ -646,7 +655,9 @@ const NewWindowPopup: React.FC = ({ htdflCellClick(index ?? undefined, headId); }} onPageChange={setHtdflPage} - /> + > + + ); }