diff --git a/packages/common/business_components/src/ui/dialog_ui/index.tsx b/packages/common/business_components/src/ui/dialog_ui/index.tsx index 0858a66b8..4201cbdfa 100644 --- a/packages/common/business_components/src/ui/dialog_ui/index.tsx +++ b/packages/common/business_components/src/ui/dialog_ui/index.tsx @@ -41,7 +41,7 @@ export function UiModal({ {(open && body) ? useDirectRender ? body - :
{body}
+ : <>{body} : <> } {noFooterYn === 'N' && ( diff --git a/packages/common/business_components/src/ui/map/Gis.js b/packages/common/business_components/src/ui/map/Gis.js index 3d810b48d..7aadc2296 100644 --- a/packages/common/business_components/src/ui/map/Gis.js +++ b/packages/common/business_components/src/ui/map/Gis.js @@ -124,7 +124,9 @@ function Gis({ checkInterval = 3000, height: height = "h-[calc(100vh-5rem)]", onOpenPopup = (data) => { }, - droughtDates = { startYmd: '', endYmd: '' } + droughtDates = { startYmd: '', endYmd: '' }, + defaultZoom = gisCore.defaults.zoom, + defaultLonLat = [127.4875, 37.4916], }) { const mapRef = useRef(); const [mapObject, setMapObject] = useState({}); @@ -209,9 +211,9 @@ function Gis({ }).extend([]), view: new View({ projection: GisApp.TO_PROJ, - zoom: gisCore.defaults.zoom, + zoom: defaultZoom, center: olProj.transform( - [127.4875, 37.4916], + defaultLonLat, GisApp.FROM_PROJ, GisApp.TO_PROJ, ), diff --git a/packages/common/business_components/src/ui/map/searchBar/comboSearchBar.tsx b/packages/common/business_components/src/ui/map/searchBar/comboSearchBar.tsx index 3289ae53f..e59fd762c 100644 --- a/packages/common/business_components/src/ui/map/searchBar/comboSearchBar.tsx +++ b/packages/common/business_components/src/ui/map/searchBar/comboSearchBar.tsx @@ -57,10 +57,47 @@ export const ComboSearchBar = ({ const url = `/geoserver/hasudo/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=hasudo:tb_ms_ctpv&outputFormat=application/json&propertyName=mctpv_korn_nm,mctpv_cd`; const res = await fetch(url).then(res => res.json()); - const list = res.features.map((f: any) => ({ - text: f.properties.mctpv_korn_nm, - val: f.properties.mctpv_cd, - })); + const list = res.features + .map((f: any) => ({ + text: f.properties.mctpv_korn_nm, + val: f.properties.mctpv_cd, + })).sort((a, b) => { + // 커스텀 순서 정의 + const customOrder = [ + "서울특별시", + "부산광역시", + "대구광역시", + "인천광역시", + "광주광역시", + "대전광역시", + "울산광역시", + "세종특별자치시", + "경기도", + "강원특별자치도", // 경기도 다음에 배치 + "충청북도", + "충청남도", + "전북특별자치도", // 충청남도 다음에 배치 + "전라남도", + "경상북도", + "경상남도", + "제주특별자치도" + ]; + + const indexA = customOrder.indexOf(a.text); + const indexB = customOrder.indexOf(b.text); + + // 둘 다 커스텀 순서에 있으면 해당 순서로 + if (indexA !== -1 && indexB !== -1) { + return indexA - indexB; + } + + // 하나만 커스텀 순서에 있으면 그것을 앞으로 + if (indexA !== -1) return -1; + if (indexB !== -1) return 1; + + // 둘 다 커스텀 순서에 없으면 기본 알파벳 순서 + return a.text.localeCompare(b.text, 'ko'); + }); setSidoData([{ text: "선택", val: "0" }, ...list]); }; @@ -68,10 +105,12 @@ export const ComboSearchBar = ({ const url = `/geoserver/hasudo/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=hasudo:tb_ms_sgg&outputFormat=application/json&propertyName=sgg_cd,sgg_korn_nm`; const res = await fetch(url).then(res => res.json()); - const list = res.features.map((f: any) => ({ - text: f.properties.sgg_korn_nm, - val: f.properties.sgg_cd, - })); + const list = res.features + .map((f: any) => ({ + text: f.properties.sgg_korn_nm, + val: f.properties.sgg_cd, + })) + .sort((a, b) => a.text.localeCompare(b.text, 'ko')); setSigunData(list); }; diff --git a/packages/common/business_components/src/ui/map/searchBar/procSearchBar.tsx b/packages/common/business_components/src/ui/map/searchBar/procSearchBar.tsx index dbded59af..bcf474c2b 100644 --- a/packages/common/business_components/src/ui/map/searchBar/procSearchBar.tsx +++ b/packages/common/business_components/src/ui/map/searchBar/procSearchBar.tsx @@ -43,11 +43,49 @@ export const ProcSearchBar = ({ gisMaps, facilityTypes }: SearchBarProps) => { const url = `/geoserver/hasudo/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=hasudo:tb_ms_ctpv&outputFormat=application/json&propertyName=mctpv_korn_nm,mctpv_cd`; const res = await fetch(url).then(res => res.json()); - const list = res.features.map((f: any) => ({ - text: f.properties.mctpv_korn_nm, - val: f.properties.mctpv_cd, - })); - setSidoData([{ text: "선택", val: "0" }, ...list]); + const list = res.features + .map((f: any) => ({ + text: f.properties.mctpv_korn_nm, + val: f.properties.mctpv_cd, + })) + .sort((a, b) => { + // 커스텀 순서 정의 + const customOrder = [ + "서울특별시", + "부산광역시", + "대구광역시", + "인천광역시", + "광주광역시", + "대전광역시", + "울산광역시", + "세종특별자치시", + "경기도", + "강원특별자치도", // 경기도 다음에 배치 + "충청북도", + "충청남도", + "전북특별자치도", // 충청남도 다음에 배치 + "전라남도", + "경상북도", + "경상남도", + "제주특별자치도" + ]; + + const indexA = customOrder.indexOf(a.text); + const indexB = customOrder.indexOf(b.text); + + // 둘 다 커스텀 순서에 있으면 해당 순서로 + if (indexA !== -1 && indexB !== -1) { + return indexA - indexB; + } + + // 하나만 커스텀 순서에 있으면 그것을 앞으로 + if (indexA !== -1) return -1; + if (indexB !== -1) return 1; + + // 둘 다 커스텀 순서에 없으면 기본 알파벳 순서 + return a.text.localeCompare(b.text, 'ko'); + }); + setSidoData([{ text: "시도", val: "0" }, ...list]); }; const fetchSigungu = async () => { @@ -144,7 +182,9 @@ export const ProcSearchBar = ({ gisMaps, facilityTypes }: SearchBarProps) => { })); } - setFacilityData([{ text: "시도", val: "0" }, ...list]); + // 가나다순 정렬 후 set + const sorted = list.slice().sort((a, b) => a.text.localeCompare(b.text, 'ko')); + setFacilityData([{ text: "시도", val: "0" }, ...sorted]); setFacilityValue("0"); }; diff --git a/packages/common/business_components/src/ui/map/searchBar/searchBar.tsx b/packages/common/business_components/src/ui/map/searchBar/searchBar.tsx index e750ab1a7..dd65019a8 100644 --- a/packages/common/business_components/src/ui/map/searchBar/searchBar.tsx +++ b/packages/common/business_components/src/ui/map/searchBar/searchBar.tsx @@ -58,10 +58,48 @@ export const SearchBar = ({ const json = await res.json(); const sidoList = json .filter((item: any) => item.lwpoCd?.length === 2) - .map((item: any) => ({ val: item.lwpoCd, text: item.lwpoCdNm })); + .map((item: any) => ({ val: item.lwpoCd, text: item.lwpoCdNm })) + .sort((a, b) => { + // 커스텀 순서 정의 + const customOrder = [ + "서울특별시", + "부산광역시", + "대구광역시", + "인천광역시", + "광주광역시", + "대전광역시", + "울산광역시", + "세종특별자치시", + "경기도", + "강원특별자치도", // 경기도 다음에 배치 + "충청북도", + "충청남도", + "전북특별자치도", // 충청남도 다음에 배치 + "전라남도", + "경상북도", + "경상남도", + "제주특별자치도" + ]; + + const indexA = customOrder.indexOf(a.text); + const indexB = customOrder.indexOf(b.text); + + // 둘 다 커스텀 순서에 있으면 해당 순서로 + if (indexA !== -1 && indexB !== -1) { + return indexA - indexB; + } + + // 하나만 커스텀 순서에 있으면 그것을 앞으로 + if (indexA !== -1) return -1; + if (indexB !== -1) return 1; + + // 둘 다 커스텀 순서에 없으면 기본 알파벳 순서 + return a.text.localeCompare(b.text, 'ko'); + }); const sigunList = json .filter((item: any) => item.lwpoCd?.length > 2) - .map((item: any) => ({ val: item.lwpoCd, text: item.lwpoCdNm })); + .map((item: any) => ({ val: item.lwpoCd, text: item.lwpoCdNm })) + .sort((a, b) => a.text.localeCompare(b.text, 'ko')); setSidoData([{ text: "시도", val: "0" }, ...sidoList]); setSigunData(sigunList); };