diff --git a/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/htdflSttn/page.tsx b/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/htdflSttn/page.tsx index 2f31e616c..257b224aa 100644 --- a/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/htdflSttn/page.tsx +++ b/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/htdflSttn/page.tsx @@ -37,17 +37,20 @@ import { useCallback, useEffect, useRef, useState } from "react"; import { useAlertStore } from "@/src/shared/lib"; import { useTranslation } from "react-i18next"; +const defaultSigunOptions: SelectDataType[] = [{ text: "전체", val: "0" }]; + export default function HtdflSttn() { - const { auth, code, htdflSttn, htdflSttnSearch, initHtdfl } = useWrStore((state) => state); + const { auth, code, htdflSttn, htdflSttnSearch, initHtdfl, getLaeSeCdCheck } = useWrStore((state) => state); const { laeSeCd } = auth; // 지자체구분코드 const { htdflSttnRes, htdflSttnResCount } = htdflSttn; const isDownloadTriggered = useRef(false); + const skipNextSearchRef = useRef(true); const { t } = useTranslation('base'); const [pageNation, setPageNation] = useState(1); const [isChHead, setIsChHead] = useState(false); const [resetPage, isResetPage] = useState(false); const [bdstTable, setBdstTable] = useState(); - const [selectSgg, setSelectSgg] = useState() + const [selectSgg, setSelectSgg] = useState(defaultSigunOptions) const [objSearch, setObjSearch] = useState({ sgg: "", city: "" }); const [detailModal, setDetailModal] = useState<{ isOpen: boolean; @@ -59,22 +62,23 @@ export default function HtdflSttn() { // }>({ isOpen: false, chBuilding: [] }); const [fcltNm, setFcltNm] = useState(""); const alert = useAlertStore((state) => state.setMessage); - - console.log("laeSeCd : ", laeSeCd); - useEffect(() => { - htdflSttnSearch(false, pageNation, htdflSttnSize, String(getConValue()), fcltNm, code.cityCd, code.sggCd); - isResetPage(false) - }, [pageNation]); + const isAllAreaUser = laeSeCd === "0"; + const isLaeSeCdReady = + laeSeCd === "0" || laeSeCd.length === 2 || laeSeCd.length === 5; + const fixedSidoValue = + !isAllAreaUser && laeSeCd?.length ? laeSeCd.slice(0, 2) : ""; + const fixedSigunValue = + !isAllAreaUser && laeSeCd?.length === 5 ? laeSeCd : "0"; const getSelCity = (val: string | number) => { const cityValue = String(val); if (cityValue === "0") { - setSelectSgg([]); + setSelectSgg(defaultSigunOptions); setObjSearch({ city: cityValue, sgg: "" }); } else { const data = getCity(cityValue, code.sggCd); - setSelectSgg(data); + setSelectSgg(data.length > 0 ? data : defaultSigunOptions); const firstSggVal = data.find(item => item.val === "0")?.val || (data[0]?.val ?? ""); setObjSearch({ city: cityValue, sgg: firstSggVal }); @@ -85,16 +89,24 @@ export default function HtdflSttn() { setObjSearch({ ...objSearch, sgg: String(val) }) }; - const getConValue = () => { + const getConValue = (): string => { if (!objSearch.city || objSearch.city === "0") { return "0"; } if (objSearch.sgg && objSearch.sgg !== "0") { - return objSearch.sgg; + return String(objSearch.sgg); } - return objSearch.city; + return String(objSearch.city); }; + const getFixedConValue = useCallback((): string => { + if (laeSeCd === undefined || laeSeCd === "0") { + return getConValue(); + } + + return laeSeCd.length === 5 ? laeSeCd : laeSeCd.slice(0, 2); + }, [laeSeCd, objSearch]); + const cellClick = (index: number | undefined, headId: string) => { if ( headId !== "chBuildingYn" && @@ -106,9 +118,37 @@ export default function HtdflSttn() { }; const excelClick = useCallback(() => { + if (!isLaeSeCdReady) { + return; + } + isDownloadTriggered.current = true; - htdflSttnSearch(true, 1, htdflSttnResCount, String(getConValue()), fcltNm, code.cityCd, code.sggCd); - }, [htdflSttnSearch, objSearch, code.cityCd, code.sggCd, fcltNm, htdflSttnResCount]); + htdflSttnSearch(true, 1, htdflSttnResCount, String(getFixedConValue()), fcltNm, code.cityCd, code.sggCd); + }, [htdflSttnSearch, fcltNm, htdflSttnResCount, code.cityCd, code.sggCd, getFixedConValue, isLaeSeCdReady]); + + useEffect(() => { + getLaeSeCdCheck(); + }, [getLaeSeCdCheck]); + + useEffect(() => { + if (!isLaeSeCdReady) { + return; + } + + if (laeSeCd === "0") { + setSelectSgg(defaultSigunOptions); + setObjSearch({ city: "0", sgg: "" }); + return; + } + + const cityValue = laeSeCd.slice(0, 2); + const sigunOptions = getCity(cityValue, code.sggCd); + setSelectSgg(sigunOptions.length > 0 ? sigunOptions : defaultSigunOptions); + setObjSearch({ + city: cityValue, + sgg: laeSeCd.length === 5 ? laeSeCd : "0", + }); + }, [laeSeCd, code.sggCd, isLaeSeCdReady]); useEffect(() => { if (!isDownloadTriggered.current) { @@ -135,10 +175,27 @@ export default function HtdflSttn() { }, [htdflSttn.excelList, code]); useEffect(() => { - if (!htdflSttn.isInit) { - initHtdfl(false, 1, htdflSttnSize, "0", fcltNm, code.cityCd, code.sggCd); + if (!isLaeSeCdReady || htdflSttn.isInit) { + return; } - }, [htdflSttn.isInit, initHtdfl]); + + skipNextSearchRef.current = true; + initHtdfl(false, 1, htdflSttnSize, String(getFixedConValue()), fcltNm, code.cityCd, code.sggCd); + }, [htdflSttn.isInit, initHtdfl, fcltNm, code.cityCd, code.sggCd, getFixedConValue, isLaeSeCdReady]); + + useEffect(() => { + if (!isLaeSeCdReady) { + return; + } + + if (skipNextSearchRef.current) { + skipNextSearchRef.current = false; + return; + } + + htdflSttnSearch(false, pageNation, htdflSttnSize, String(getFixedConValue()), fcltNm, code.cityCd, code.sggCd); + isResetPage(false) + }, [pageNation, htdflSttnSearch, fcltNm, code.cityCd, code.sggCd, getFixedConValue, isLaeSeCdReady]); useEffect(() => { const data = tableData(htdflSttnRes, { code }); @@ -171,15 +228,24 @@ export default function HtdflSttn() { className="col-span-2 w-1/6 h-full text-2xl" label="시도" selectClass={""} - selectArray={code.cityCd} + selectArray={ + !isAllAreaUser && fixedSidoValue + ? code.cityCd.filter((item) => item.val === fixedSidoValue) + : code.cityCd + } + value={objSearch.city || "0"} onSelectValue={getSelCity} /> item.val === "0" || item.val === fixedSigunValue) + : selectSgg || defaultSigunOptions + } + value={objSearch.sgg || "0"} onSelectValue={getSgg} />
@@ -201,7 +267,10 @@ export default function HtdflSttn() {
diff --git a/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/rainSttn/page.tsx b/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/rainSttn/page.tsx index 9de317a08..dae95f113 100644 --- a/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/rainSttn/page.tsx +++ b/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/rainSttn/page.tsx @@ -35,18 +35,21 @@ import { useCallback, useEffect, useRef, useState } from "react"; import { useAlertStore } from "@/src/shared/lib"; import { useTranslation } from "react-i18next"; +const defaultSigunOptions: SelectDataType[] = [{ text: "전체", val: "0" }]; + export default function RainSttn() { - const { code, rainSttn, rainSttnSearch, rainSttnInit } = useWrStore( + const { auth, code, rainSttn, rainSttnSearch, rainSttnInit, getLaeSeCdCheck } = useWrStore( (state) => state ); const { rainSttnRes, rainSttnResCount } = rainSttn; + const { laeSeCd } = auth; const [pageNation, setPageNation] = useState(1); const [isChHead, setIsChHead] = useState(false); const [bdstTable, setBdstTable] = useState(); - const [selectSgg, setSelectSgg] = useState(); + const [selectSgg, setSelectSgg] = useState(defaultSigunOptions); const [resetPage, isResetPage] = useState(false); - const isDownloadTriggered = useRef(false); + const [isDownloadTriggered, setIsDownloadTriggered] = useState(false); const [objSearch, setObjSearch] = useState({ sgg: "", city: "", @@ -59,6 +62,14 @@ export default function RainSttn() { const [fcltNm, setFcltNm] = useState(""); const { t } = useTranslation("base"); const alert = useAlertStore((state) => state.setMessage); + const skipNextSearchRef = useRef(true); + const isAllAreaUser = laeSeCd === "0"; + const isLaeSeCdReady = + laeSeCd === "0" || laeSeCd.length === 2 || laeSeCd.length === 5; + const fixedSidoValue = + !isAllAreaUser && laeSeCd?.length ? laeSeCd.slice(0, 2) : ""; + const fixedSigunValue = + !isAllAreaUser && laeSeCd?.length === 5 ? laeSeCd : "0"; const cellClick = (index: number | undefined) => { if (index !== undefined && bdstTable !== undefined) { @@ -69,11 +80,11 @@ export default function RainSttn() { const getSelCity = (val: string | number) => { const cityValue = String(val); if (cityValue === "0") { - setSelectSgg([]); + setSelectSgg(defaultSigunOptions); setObjSearch({ city: cityValue, sgg: "" }); } else { const data = getCity(cityValue, code.sggCd); - setSelectSgg(data); + setSelectSgg(data.length > 0 ? data : defaultSigunOptions); const firstSggVal = data.find((item) => item.val === "0")?.val || (data[0]?.val ?? ""); setObjSearch({ city: cityValue, sgg: firstSggVal }); @@ -84,21 +95,135 @@ export default function RainSttn() { setObjSearch({ ...objSearch, sgg: String(val) }); }; - const getConValue = () => { + const getConValue = (): string => { if (!objSearch.city || objSearch.city === "0") { return "0"; } if (objSearch.sgg && objSearch.sgg !== "0") { - return objSearch.sgg; + return String(objSearch.sgg); } - return objSearch.city; + return String(objSearch.city); }; - useEffect(() => { - if (!rainSttn.isInit) { - rainSttnInit(false, 1, rainSttnSize, "0", fcltNm, code as unknown as Record); + const getFixedConValue = useCallback((): string => { + if (laeSeCd === undefined || laeSeCd === "0") { + return getConValue(); } - }, [rainSttn.isInit, rainSttnInit]); + + return laeSeCd.length === 5 ? laeSeCd : laeSeCd.slice(0, 2); + }, [laeSeCd, objSearch]); + + useEffect(() => { + getLaeSeCdCheck(); + }, [getLaeSeCdCheck]); + + useEffect(() => { + if (!isLaeSeCdReady) { + return; + } + + if (laeSeCd === "0") { + setSelectSgg(defaultSigunOptions); + setObjSearch({ city: "0", sgg: "" }); + return; + } + + const cityValue = laeSeCd.slice(0, 2); + const sigunOptions = getCity(cityValue, code.sggCd); + setSelectSgg(sigunOptions.length > 0 ? sigunOptions : defaultSigunOptions); + setObjSearch({ + city: cityValue, + sgg: laeSeCd.length === 5 ? laeSeCd : "0", + }); + }, [laeSeCd, code.sggCd, isLaeSeCdReady]); + + useEffect(() => { + if (!isLaeSeCdReady || rainSttn.isInit) { + return; + } + + skipNextSearchRef.current = true; + rainSttnInit( + false, + 1, + rainSttnSize, + getFixedConValue(), + fcltNm, + code as unknown as Record + ); + }, [rainSttn.isInit, rainSttnInit, fcltNm, code, getFixedConValue, isLaeSeCdReady]); + + useEffect(() => { + if (!isLaeSeCdReady) { + return; + } + + if (skipNextSearchRef.current) { + skipNextSearchRef.current = false; + return; + } + + rainSttnSearch( + false, + pageNation, + rainSttnSize, + String(getFixedConValue()), + fcltNm, + code as unknown as Record + ); + isResetPage(false); + }, [pageNation, rainSttnSearch, fcltNm, code, getFixedConValue, isLaeSeCdReady]); + + useEffect(() => { + if (!isLaeSeCdReady) { + return; + } + + if (!isDownloadTriggered) { + return; + } + if (rainSttn.excelList.length > 0) { + const sheetArray: SheetParameter[] = [{ + data: rainSttn.excelList, + headerNum: 3, + headerRange: "A1:W3", + sheetName: 'sheet1', + startCol: 'A', + decimalArray0: [6,10,12,14,16] // 0부터 시작 + }]; + excelDownloadNumStyle( + "빗물이용시설 현황", + "sample_rainSttn.xlsx", // public 폴더에 있는 template 파일 경로 + sheetArray + ); + } else { + alert(t("excelDownErrMsg")); + } + setIsDownloadTriggered(false); + }, [rainSttn.excelList, isDownloadTriggered, alert, t, isLaeSeCdReady]); + + const excelClick = useCallback(() => { + if (!isLaeSeCdReady) { + return; + } + + setIsDownloadTriggered(true); + rainSttnSearch( + true, + 1, + rainSttnResCount, + String(getFixedConValue()), + fcltNm, + code as unknown as Record + ); + }, [ + rainSttnSearch, + fcltNm, + rainSttnResCount, + code, + getFixedConValue, + isLaeSeCdReady, + ]); useEffect(() => { const data = tableData(rainSttnRes, { code }); @@ -143,60 +268,6 @@ export default function RainSttn() { setBdstTable(chData); }, [code, rainSttnRes]); - useEffect(() => { - rainSttnSearch( - false, - pageNation, - rainSttnSize, - String(getConValue()), - fcltNm, - code as unknown as Record - ); - isResetPage(false); - }, [pageNation]); - - useEffect(() => { - if (!isDownloadTriggered.current) { - return; - } - if (rainSttn.excelList.length > 0) { - const sheetArray: SheetParameter[] = [{ - data: rainSttn.excelList, - headerNum: 3, - headerRange: "A1:W3", - sheetName: 'sheet1', - startCol: 'A', - decimalArray0: [6,10,12,14,16] // 0부터 시작 - }]; - excelDownloadNumStyle( - "빗물이용시설 현황", - "sample_rainSttn.xlsx", // public 폴더에 있는 template 파일 경로 - sheetArray - ); - } else { - alert(t("excelDownErrMsg")); - } - isDownloadTriggered.current = false; - }, [rainSttn.excelList]); - - const excelClick = useCallback(() => { - isDownloadTriggered.current = true; - rainSttnSearch( - true, - 1, - rainSttnResCount, - String(getConValue()), - fcltNm, - code as unknown as Record - ); - }, [ - rainSttnSearch, - objSearch, - code.cityCd, - code.sggCd, - fcltNm, - rainSttnResCount, - ]); return ( <> @@ -210,15 +281,24 @@ export default function RainSttn() { className="col-span-2 w-1/6 h-full text-2xl" label="시도" selectClass={""} - selectArray={code.cityCd} + selectArray={ + !isAllAreaUser && fixedSidoValue + ? code.cityCd.filter((item) => item.val === fixedSidoValue) + : code.cityCd + } + value={objSearch.city || "0"} onSelectValue={getSelCity} /> item.val === "0" || item.val === fixedSigunValue) + : selectSgg || defaultSigunOptions + } + value={objSearch.sgg || "0"} onSelectValue={getSgg} />
@@ -243,7 +323,7 @@ export default function RainSttn() { false, 1, rainSttnSize, - String(getConValue()), + String(getFixedConValue()), fcltNm, code as unknown as Record ); diff --git a/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/rswtSttn/page.tsx b/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/rswtSttn/page.tsx index c95c7aafe..912cce28d 100644 --- a/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/rswtSttn/page.tsx +++ b/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/rswtSttn/page.tsx @@ -35,24 +35,35 @@ import { useCallback, useEffect, useRef, useState } from "react"; import { useAlertStore } from "@/src/shared/lib"; import { useTranslation } from "react-i18next"; +const defaultSigunOptions: SelectDataType[] = [{ text: "전체", val: "0" }]; + export default function RswtSttn() { - const { code, rswtSttn, rswtSttnSearch, rswtSttnInit } = useWrStore( + const { auth, code, rswtSttn, rswtSttnSearch, rswtSttnInit, getLaeSeCdCheck } = useWrStore( (state) => state ); const [pageNation, setPageNation] = useState(1); const { rswtSttnRes, rswtSttnResCount } = rswtSttn; + const { laeSeCd } = auth; const [isChHead, setIsChHead] = useState(false); const [resetPage, isResetPage] = useState(false); const [bdstTable, setBdstTable] = useState(); const isDownloadTriggered = useRef(false); - const [selectSgg, setSelectSgg] = useState() + const skipNextSearchRef = useRef(true); + const [selectSgg, setSelectSgg] = useState(defaultSigunOptions) const [objSearch, setObjSearch] = useState({ sgg: "", city: "" }); const [detailModal, setDetailModal] = useState<{ isOpen: boolean, data: customRswtBdst | undefined }>({ data: undefined, isOpen: false }) const [fcltNm, setFcltNm] = useState(""); const { t } = useTranslation('base'); const alert = useAlertStore((state) => state.setMessage); + const isAllAreaUser = laeSeCd === "0"; + const isLaeSeCdReady = + laeSeCd === "0" || laeSeCd.length === 2 || laeSeCd.length === 5; + const fixedSidoValue = + !isAllAreaUser && laeSeCd?.length ? laeSeCd.slice(0, 2) : ""; + const fixedSigunValue = + !isAllAreaUser && laeSeCd?.length === 5 ? laeSeCd : "0"; const cellClick = (index: number | undefined) => { if ( index !== undefined && bdstTable !== undefined) { @@ -64,11 +75,11 @@ export default function RswtSttn() { const cityValue = String(val); if (cityValue === "0") { - setSelectSgg([]); + setSelectSgg(defaultSigunOptions); setObjSearch({ city: cityValue, sgg: "" }); } else { const data = getCity(cityValue, code.sggCd); - setSelectSgg(data); + setSelectSgg(data.length > 0 ? data : defaultSigunOptions); const firstSggVal = data.find(item => item.val === "0")?.val || (data[0]?.val ?? ""); setObjSearch({ city: cityValue, sgg: firstSggVal }); @@ -79,21 +90,63 @@ export default function RswtSttn() { setObjSearch({ ...objSearch, sgg: String(val) }) }; - const getConValue = () => { + const getConValue = (): string => { if (!objSearch.city || objSearch.city === "0") { return "0"; } if (objSearch.sgg && objSearch.sgg !== "0") { - return objSearch.sgg; + return String(objSearch.sgg); } - return objSearch.city; + return String(objSearch.city); }; - useEffect(() => { - if (!rswtSttn.isInit&&code) { - rswtSttnInit(false, 1, rswtSttnSize, code.userSiSggCd, fcltNm, code as unknown as Record); + const getFixedConValue = useCallback((): string => { + if (laeSeCd === undefined || laeSeCd === "0") { + return getConValue(); } - }, [rswtSttn.isInit, rswtSttnInit]); + + return laeSeCd.length === 5 ? laeSeCd : laeSeCd.slice(0, 2); + }, [laeSeCd, objSearch]); + + useEffect(() => { + getLaeSeCdCheck(); + }, [getLaeSeCdCheck]); + + useEffect(() => { + if (!isLaeSeCdReady) { + return; + } + + if (laeSeCd === "0") { + setSelectSgg(defaultSigunOptions); + setObjSearch({ city: "0", sgg: "" }); + return; + } + + const cityValue = laeSeCd.slice(0, 2); + const sigunOptions = getCity(cityValue, code.sggCd); + setSelectSgg(sigunOptions.length > 0 ? sigunOptions : defaultSigunOptions); + setObjSearch({ + city: cityValue, + sgg: laeSeCd.length === 5 ? laeSeCd : "0", + }); + }, [laeSeCd, code.sggCd, isLaeSeCdReady]); + + useEffect(() => { + if (!isLaeSeCdReady || rswtSttn.isInit) { + return; + } + + skipNextSearchRef.current = true; + rswtSttnInit( + false, + 1, + rswtSttnSize, + getFixedConValue(), + fcltNm, + code as unknown as Record + ); + }, [rswtSttn.isInit, rswtSttnInit, fcltNm, code, getFixedConValue, isLaeSeCdReady]); useEffect(() => { const data = tableData(rswtSttnRes, { code }); @@ -150,14 +203,27 @@ export default function RswtSttn() { }, [rswtSttn.excelList]); const excelClick = useCallback(() => { + if (!isLaeSeCdReady) { + return; + } + isDownloadTriggered.current = true; - rswtSttnSearch(true, 1, rswtSttnResCount, String(getConValue()), fcltNm, code as unknown as Record); - }, [rswtSttnSearch, objSearch, code.cityCd, code.sggCd, fcltNm, rswtSttnResCount]); + rswtSttnSearch(true, 1, rswtSttnResCount, String(getFixedConValue()), fcltNm, code as unknown as Record); + }, [rswtSttnSearch, fcltNm, rswtSttnResCount, code, getFixedConValue, isLaeSeCdReady]); useEffect(() => { - rswtSttnSearch(false, pageNation, rswtSttnSize, String(getConValue()), fcltNm, code as unknown as Record); + if (!isLaeSeCdReady) { + return; + } + + if (skipNextSearchRef.current) { + skipNextSearchRef.current = false; + return; + } + + rswtSttnSearch(false, pageNation, rswtSttnSize, String(getFixedConValue()), fcltNm, code as unknown as Record); isResetPage(false) - }, [pageNation]); + }, [pageNation, rswtSttnSearch, fcltNm, code, getFixedConValue, isLaeSeCdReady]); return ( <> @@ -171,7 +237,12 @@ export default function RswtSttn() { className="col-span-2 w-1/6 h-full text-2xl" label="시도" selectClass={""} - selectArray={code.cityCd} + selectArray={ + !isAllAreaUser && fixedSidoValue + ? code.cityCd.filter((item) => item.val === fixedSidoValue) + : code.cityCd + } + value={objSearch.city || "0"} onSelectValue={ getSelCity } @@ -180,8 +251,12 @@ export default function RswtSttn() { className="col-span-2 w-1/6 h-full text-2xl ml-4" label="시군구" selectClass={""} - selectArray={selectSgg || []} - value={objSearch.sgg} // value props 추가 + selectArray={ + !isAllAreaUser && laeSeCd?.length === 5 + ? (selectSgg || defaultSigunOptions).filter((item) => item.val === "0" || item.val === fixedSigunValue) + : selectSgg || defaultSigunOptions + } + value={objSearch.sgg || "0"} onSelectValue={ getSgg } @@ -205,7 +280,10 @@ export default function RswtSttn() {
diff --git a/apps/wr/app/store/ruseFcltMng/fcltSttn/pbnstSttn/index.tsx b/apps/wr/app/store/ruseFcltMng/fcltSttn/pbnstSttn/index.tsx index 9e2c47a04..ee94ada00 100644 --- a/apps/wr/app/store/ruseFcltMng/fcltSttn/pbnstSttn/index.tsx +++ b/apps/wr/app/store/ruseFcltMng/fcltSttn/pbnstSttn/index.tsx @@ -112,6 +112,12 @@ export const hasuListFetch = async ( year: string, flcts: string[] ) => { + + // 시설 코드가 없으면 FO 조회를 호출하지 않고 빈 결과 반환 + if (flcts.length === 0) { + return { data: [], count: 0 }; + } + let url = ``; let filteredFclt = flcts; const filterData = @@ -163,6 +169,11 @@ export const hasuListFetch = async ( url += "/" + searchNm; } + // 시설 코드가 없으면 FO 조회를 호출하지 않고 빈 결과 반환 + if (filteredFclt.length === 0) { + return { data: [], count: 0 }; + } + const pbnList = await postFectch( `/prcsFclt/ruseInfo/1/${filteredFclt.length}/` + url, filteredFclt, diff --git a/packages/common/business_components/src/ui/search_base_form/index.tsx b/packages/common/business_components/src/ui/search_base_form/index.tsx index 9cef315c3..e4fef1e1e 100644 --- a/packages/common/business_components/src/ui/search_base_form/index.tsx +++ b/packages/common/business_components/src/ui/search_base_form/index.tsx @@ -26,6 +26,7 @@ type SearchBaseType = { leftSelectClassName?: string; buttonOrder?: ("query" | "init" | "excel")[]; initSidoValue?: string | ''; + initSigunValue?: string | ''; excelDisabled?: boolean; } export type ReturnType = { @@ -61,11 +62,12 @@ function SearchBaseForm ({ leftSelectClassName, buttonOrder, initSidoValue='', + initSigunValue='', excelDisabled=false, }: SearchBaseType) { const [partValue, setPartValue] = useState("A"); const [sidoValue, setSidoValue] = useState(initSidoValue?initSidoValue:"0"); - const [sigunValue, setSigunValue] = useState("0"); + const [sigunValue, setSigunValue] = useState(initSigunValue?initSigunValue:"0"); const [sidoText, setSidoText] = useState(""); const [sigunText, setSigunText] = useState(""); const [regionValue, setRegionValue] = useState("0"); @@ -115,18 +117,24 @@ function SearchBaseForm ({ if(initSidoValue){ setSidoValue(initSidoValue); } + if(initSigunValue){ + setSigunValue(initSigunValue); + } setResetTrigger(true); initClick(); - }, [initSidoValue, setResetTrigger, initClick]); + }, [initSidoValue, initSigunValue, setResetTrigger, initClick]); useEffect(() => { if (resetTrigger) { if(initSidoValue!=""){ setSidoValue(initSidoValue); } + if(initSigunValue!=""){ + setSigunValue(initSigunValue); + } setResetTrigger(false); } - }, [resetTrigger]); + }, [resetTrigger, initSidoValue, initSigunValue]); const excelDownload = () => { excelClick({ partValue: partValue, @@ -179,6 +187,7 @@ function SearchBaseForm ({ leftClassName={leftClassName} leftSelectClassName={leftSelectClassName} initSidoValue={initSidoValue} + initSigunValue={initSigunValue} > {leftChildren} diff --git a/packages/common/business_components/src/ui/search_form_left/index.tsx b/packages/common/business_components/src/ui/search_form_left/index.tsx index 04537ec5e..0b04562b4 100644 --- a/packages/common/business_components/src/ui/search_form_left/index.tsx +++ b/packages/common/business_components/src/ui/search_form_left/index.tsx @@ -47,6 +47,7 @@ type SearchFormLeftProps = { leftClassName?: string; leftSelectClassName?: string; initSidoValue?: string; + initSigunValue?: string; } export type EnvPartSelectDataType = SelectDataType & { @@ -59,12 +60,12 @@ const selectPartData:SelectDataType[] = [ { text: "환경청별", val: 'G' }, ]; -function SearchFormLeft({ isShowPart = false, children, selectSidoData = [], selectSigunData = [], selectRegionData = [], selectUnitWaterShedData = [], selectMiddleRegionData = [], selectEnvPartData = [], setRtnPartValue, setRtnSidoValue, setRtnSidoText, setRtnSigunValue, setRtnSigunText, setRtnRegionValue, setRtnUnitWaterShedValue, setRtnMiddleRegionValue, setRtnEnvPartValue, setRtnEnvPartSidoValue, setRtnEnvPartSigunValue, resetTrigger = false, isAdmin = false, leftClassName, leftSelectClassName, initSidoValue }: SearchFormLeftProps) { +function SearchFormLeft({ isShowPart = false, children, selectSidoData = [], selectSigunData = [], selectRegionData = [], selectUnitWaterShedData = [], selectMiddleRegionData = [], selectEnvPartData = [], setRtnPartValue, setRtnSidoValue, setRtnSidoText, setRtnSigunValue, setRtnSigunText, setRtnRegionValue, setRtnUnitWaterShedValue, setRtnMiddleRegionValue, setRtnEnvPartValue, setRtnEnvPartSidoValue, setRtnEnvPartSigunValue, resetTrigger = false, isAdmin = false, leftClassName, leftSelectClassName, initSidoValue, initSigunValue }: SearchFormLeftProps) { /******************선택된 데이터******************/ const [partValue, setPartValue] = useState('A'); //행정별 시도 시군구 const [sidoValue, setSidoValue] = useState(initSidoValue?initSidoValue : '0'); - const [sigunValue, setSigunValue] = useState('0'); + const [sigunValue, setSigunValue] = useState(initSigunValue?initSigunValue : '0'); const [sidoText, setSidoText] = useState(''); const [sigunText, setSigunText] = useState(''); //유역별 @@ -87,6 +88,39 @@ function SearchFormLeft({ isShowPart = false, children, selectSidoData = [], sel const [filteredEnvPartSigunData, setFilteredEnvPartSigunData] = useState([{ text: "전체", val: '0' }]); const [initTrigger, setInitTrigger] = useState(false); + + useEffect(() => { + if (!initSidoValue) return; + if (!selectSidoData.some((item) => item.val === initSidoValue)) return; + + const selectedSido = selectSidoData.find((item) => item.val === initSidoValue); + setSidoValue(initSidoValue); + setSidoText(selectedSido?.text || ""); + if (setRtnSidoValue) setRtnSidoValue(initSidoValue); + if (setRtnSidoText) setRtnSidoText(selectedSido?.text || ""); + initializeSigunData(initSidoValue); + }, [initSidoValue, selectSidoData]); + + useEffect(() => { + if (!initSidoValue || !initSigunValue) return; + + const initializedSigunData = [ + { text: "전체", val: '0' }, + ...selectSigunData.filter( + (item: SelectDataType) => item.val.substring(0, 2) === initSidoValue + ) + ]; + const selectedSigun = initializedSigunData.find((item) => item.val === initSigunValue); + + if (!selectedSigun) return; + + setFilteredSigunData(initializedSigunData); + setSigunValue(initSigunValue); + setSigunText(selectedSigun.text || ""); + if (setRtnSigunValue) setRtnSigunValue(initSigunValue); + if (setRtnSigunText) setRtnSigunText(selectedSigun.text || ""); + }, [initSidoValue, initSigunValue, selectSigunData, setRtnSigunText, setRtnSigunValue]); + // 시군구 세팅 const initializeSigunData = (sidoCd: string) => { if (sidoCd === '0') { @@ -204,7 +238,7 @@ function SearchFormLeft({ isShowPart = false, children, selectSidoData = [], sel setRtnSidoText(selectedSido?.text || ''); } initializeSigunData(val); - onSelectValue('0', 'sigun'); + onSelectValue(val === initSidoValue && initSigunValue ? initSigunValue : '0', 'sigun'); break; case 'sigun': if (setRtnSigunValue) { @@ -276,7 +310,7 @@ function SearchFormLeft({ isShowPart = false, children, selectSidoData = [], sel const resetAllValues = () => { setPartValue('A'); setSidoValue(initSidoValue?initSidoValue:'0'); - setSigunValue('0'); + setSigunValue(initSigunValue?initSigunValue:'0'); setRegionValue('0'); setUnitWaterShedValue('0'); setMiddleRegionValue('0'); @@ -291,7 +325,7 @@ function SearchFormLeft({ isShowPart = false, children, selectSidoData = [], sel if (setRtnPartValue) setRtnPartValue('A'); if (setRtnSidoValue) setRtnSidoValue(initSidoValue?initSidoValue:'0'); - if (setRtnSigunValue) setRtnSigunValue('0'); + if (setRtnSigunValue) setRtnSigunValue(initSigunValue?initSigunValue:'0'); if (setRtnRegionValue) setRtnRegionValue('0'); if (setRtnUnitWaterShedValue) setRtnUnitWaterShedValue('0'); if (setRtnMiddleRegionValue) setRtnMiddleRegionValue('0');