diff --git a/apps/sn/app/(map-layout)/map/searchBar/searchBar.tsx b/apps/sn/app/(map-layout)/map/searchBar/searchBar.tsx index b57e66c24..43ceb14de 100644 --- a/apps/sn/app/(map-layout)/map/searchBar/searchBar.tsx +++ b/apps/sn/app/(map-layout)/map/searchBar/searchBar.tsx @@ -1,82 +1,31 @@ "use client"; -import { - SearchDiv, - SearchFormLeft, - SelectBox, - type SelectDataType, -} from "@common/business_components/ui"; -import { useCallback, useEffect, useState } from "react"; + +import { useState } from "react"; +import { CtpvSggPrcsFcltSelectBox } from "@/components/ui/ctpvSggPrcsFcltSelectBox"; + export function SearchBar() { - const [sidoValue, setSidoValue] = useState(""); - const [sigunValue, setSigunValue] = useState(""); - const [filteredSigunData, setFilteredSigunData] = useState([ - { text: "시도 선택", val: "0" }, - ]); - - const initializeSigunData = useCallback((sidoCd: string) => { - if (sidoCd === "0") { - setSigunValue("0"); - setFilteredSigunData([{ text: "시도 선택", val: "0" }]); - } else { - const newFilteredData = [ - { text: "데이터", val: "0" }, - // ...Common.selectSigunData.filter( - // (item: SelectDataType) => item.val.substring(0, 2) === sidoCd, - // ), - ]; - setSigunValue("0"); - setFilteredSigunData(newFilteredData); - } - }, []); - const onSelectValue = useCallback( - (val: string, type: string) => { - switch (type) { - case "ctpvCd": - initializeSigunData(val); - setSidoValue(val); - break; - case "sggCd": - setSigunValue(val); - } - }, - [initializeSigunData], - ); + const [ctpv, setCtpv] = useState(0); + const [sgg, setSgg] = useState(0); + const [sggName, setSggName] = useState(''); + const [selectedSwagePrcsFclt, setSelectedSwagePrcsFclt] = useState('0'); return ( <> -
-
-
-
- onSelectValue(val.toString(), "ctpvCd")} - value={sidoValue || /* Common.selectSidoData[0]?.val || */ ""} - /> - onSelectValue(val.toString(), "sggCd")} - value={sigunValue} - /> - onSelectValue(val.toString(), "sggCd")} - value={sigunValue} - /> -
-
-
+
+ { + setCtpv(sidoId); + setSgg(0); + }} + onSigunguChange={setSgg} + setSggName={setSggName} + selectedSwagePrcsFclt={selectedSwagePrcsFclt} + onSwagePrcsFcltChange={setSelectedSwagePrcsFclt} + />
); diff --git a/apps/sn/app/(with-base-layout)/ii/BaseLayout.tsx b/apps/sn/app/(with-base-layout)/ii/BaseLayout.tsx index c83d56232..5d5443db2 100644 --- a/apps/sn/app/(with-base-layout)/ii/BaseLayout.tsx +++ b/apps/sn/app/(with-base-layout)/ii/BaseLayout.tsx @@ -85,10 +85,6 @@ const BaseLayout = ({ onAnalysis, }: BaseLayout) => { - const defaultOption: ApiSelectOption = { val: '0', text: '전체' }; - - const [treatmentFacilityOptions, setTreatmentFacilityOptions] = useState([]); - // 파일 다운로드 const isChckFile = () => { // Excel 다운로드 함수가 있으면 Excel 다운로드 실행 @@ -157,6 +153,7 @@ const BaseLayout = ({ { setCtpvCd(sidoId); setSggCd(0); diff --git a/apps/sn/app/components/ui/ctpvSggPrcsFcltSelectBox.tsx b/apps/sn/app/components/ui/ctpvSggPrcsFcltSelectBox.tsx index 8e6f9d4eb..7e401ef3a 100644 --- a/apps/sn/app/components/ui/ctpvSggPrcsFcltSelectBox.tsx +++ b/apps/sn/app/components/ui/ctpvSggPrcsFcltSelectBox.tsx @@ -53,55 +53,53 @@ export function CtpvSggPrcsFcltSelectBox({ })(); }, []); - // useEffect(() => { - // onSwagePrcsFcltChange?.('0'); + useEffect(() => { + onSwagePrcsFcltChange?.('0'); - // const fetchData = async () => { - // if (!sggName) { - // console.log("BaseLayout: Skipping fetchData because sigungu.val is:", sggName); - // setPrcsFcltOptions([defaultOption]); - // if (setIsLoading) setIsLoading(false); - // return; - // } + const fetchData = async () => { + if (!sggName) { + console.log("BaseLayout: Skipping fetchData because sigungu.val is:", sggName); + setPrcsFcltOptions([]); + if (setIsLoading) setIsLoading(false); + return; + } - // if (setIsLoading) setIsLoading(true); - // try { + if (setIsLoading) setIsLoading(true); + try { - // const queryParamsFacility = new URLSearchParams({ - // lyrTypeNm: 'tb_il_swage_prcs_fclt', - // page: '0', - // size: '100000', // 요청하신 URL에 맞게 50으로 변경 가능 - // sort: 'string', - // }); - // const cqlFiltersFacility: string[] = []; - // if (sggName) cqlFiltersFacility.push(`sgg_nm ILIKE '%${sggName}%'`); - // if (cqlFiltersFacility.length > 0) queryParamsFacility.append('cqlFiter', cqlFiltersFacility.join(' and ')); + const queryParamsFacility = new URLSearchParams({ + lyrTypeNm: 'tb_il_swage_prcs_fclt', + page: '0', + size: '100000', // 요청하신 URL에 맞게 50으로 변경 가능 + sort: 'string', + }); + const cqlFiltersFacility: string[] = []; + if (sggName) cqlFiltersFacility.push(`sgg_nm ILIKE '%${sggName}%'`); + if (cqlFiltersFacility.length > 0) queryParamsFacility.append('cqlFiter', cqlFiltersFacility.join(' and ')); - // console.log("BaseLayout API URL for Facilities:", `v1/fclts?${queryParamsFacility.toString()}`); + console.log("BaseLayout API URL for Facilities:", `v1/fclts?${queryParamsFacility.toString()}`); - // const facilityRes = await getData(`v1/fclts?${queryParamsFacility.toString()}`); + const facilityRes = await getData(`v1/fclts?${queryParamsFacility.toString()}`); - // console.log('facilityRes.data', facilityRes.data); + console.log('facilityRes.data', facilityRes.data); - // const facilities = (facilityRes.data || []) - // .map((item: any) => ({ - // text: item.swtrmtFcltNm, - // val: item.fid - // })) - // .sort((a: ApiSelectOption, b: ApiSelectOption) => a.text.localeCompare(b.text, 'ko')); - // setPrcsFcltOptions(facilities); - // console.log("BaseLayout Fetched Treatment Facilities:", prcsFcltOptions); + const facilities = (facilityRes.data || []) + .map((item: any) => ({ + text: item.swtrmtFcltNm, + val: item.fid + })) + .sort((a: ApiSelectOption, b: ApiSelectOption) => a.text.localeCompare(b.text, 'ko')); + setPrcsFcltOptions(facilities); + } catch (error) { + console.error("BaseLayout: 지역/시설 데이터 조회 중 오류 발생:", error); + setPrcsFcltOptions([]); + } finally { + if (setIsLoading) setIsLoading(false); + } + }; - // } catch (error) { - // console.error("BaseLayout: 지역/시설 데이터 조회 중 오류 발생:", error); - // setPrcsFcltOptions([]); - // } finally { - // if (setIsLoading) setIsLoading(false); - // } - // }; - - // fetchData(); - // }, [sggName]); + fetchData(); + }, [sggName]); return ( @@ -112,8 +110,8 @@ export function CtpvSggPrcsFcltSelectBox({ selectClass="rounded-lg bg-white" label="" selectArray={ - [{ val: 0, text: '전체' }, - ...ctpv.map(opt => ({ val: opt.id, text: opt.name })) + [defaultOption, + ...ctpv.map(opt => ({ val: opt.id, text: opt.name })) ] } value={sido} @@ -129,10 +127,10 @@ export function CtpvSggPrcsFcltSelectBox({ selectClass="w-48 rounded-lg bg-white truncate" label="" selectArray={ - [{ val: 0, text: '전체' }, - ...sgg - .filter(opt => String(opt.id).slice(0, 2) === String(sido)) - .map(opt => ({ val: opt.id, text: opt.name })) + [defaultOption, + ...sgg + .filter(opt => String(opt.id).slice(0, 2) === String(sido)) + .map(opt => ({ val: opt.id, text: opt.name })) ] } value={sigungu} @@ -146,11 +144,11 @@ export function CtpvSggPrcsFcltSelectBox({ <> onSwagePrcsFcltChange?.(val)} selectContentClass="z-[101]" /> diff --git a/apps/sn/app/store/index.ts b/apps/sn/app/store/index.ts index ea5171b44..e173c7509 100644 --- a/apps/sn/app/store/index.ts +++ b/apps/sn/app/store/index.ts @@ -31,9 +31,6 @@ export const fetchCtpvSggData = async (set: (state: any) => void) => { })) .sort((a: Option, b: Option) => a.name.localeCompare(b.name, 'ko')); - console.log("CTPV List:", ctpvList); - console.log("SGG List:", sggList); - set({ ctpv: ctpvList, sgg: sggList }); } catch (e: any) { // alert("시도, 시군구 데이터 로드 실패: " + e.message);