diff --git a/src/components/flight/NewFlightApprovalsReport.js b/src/components/flight/NewFlightApprovalsReport.js index 8b1e5cf1..b2c3a7f3 100644 --- a/src/components/flight/NewFlightApprovalsReport.js +++ b/src/components/flight/NewFlightApprovalsReport.js @@ -3,6 +3,7 @@ import Flatpickr from 'react-flatpickr'; import { Button, Input, CustomInput, Col, Row } from '@component/ui'; import { Search, Calendar } from 'react-feather'; import dayjs from 'dayjs'; +import { CityCategories, DistrictCategories } from '@configs/constants'; export default function NewFlightApprovalsReport(props) { // 달력 @@ -95,20 +96,26 @@ export default function NewFlightApprovalsReport(props) { value={props.filterArea} onChange={e => props.setFilterArea(e.target.value)} > - - + {Object.values(CityCategories).map(city => ( + + ))}
props.setFilterArea(e.target.value)} > - - + {DistrictCategories[props.filterArea]?.map(district => ( + + ))}
diff --git a/src/configs/constants.ts b/src/configs/constants.ts index b576c2f2..0d58cca7 100644 --- a/src/configs/constants.ts +++ b/src/configs/constants.ts @@ -135,3 +135,29 @@ export const QS_OPTION: IQsOptionType = { addQueryPrefix: true, arrayFormat: 'repeat' }; + +// 시도 검색 카테고리 +// 시도 검색 카테고리 +export const CityCategories = { + 서울: '서울', + 인천: '인천', + 경기: '경기' +} as const; + +export type CityCategory = keyof typeof CityCategories; + +// 시군구 검색 카테고리 +export const DistrictCategories = { + 서울: ['은평구', '영등포구', '양천구', '구로구', '강서구', '마포구'], + 인천: ['부평구', '계양구', '서구'], + 경기: [ + '김포시', + '고양시 덕양구', + '고양시 일산동구', + '부천시 소사구', + '부천시 원미구', + '부천시 오정구' + ] +} as const; + +export type DistrictCategory = typeof DistrictCategories[CityCategory][number]; diff --git a/src/containers/flight/NewFlightApprovalsContainer.js b/src/containers/flight/NewFlightApprovalsContainer.js index 8a6f88af..f8f0090a 100644 --- a/src/containers/flight/NewFlightApprovalsContainer.js +++ b/src/containers/flight/NewFlightApprovalsContainer.js @@ -45,7 +45,7 @@ export default function NewFlightApprovalsContainer({ mode }) { const [filterId, setFilterId] = useState(''); // 지역 - const [filterArea, setFilterArea] = useState(''); + const [filterArea, setFilterArea] = useState('경기'); // 미니맵 레이어 const [previewLayer, setPreviewLayer] = useState(); @@ -334,22 +334,16 @@ export default function NewFlightApprovalsContainer({ mode }) { return ( <>
-
+

지도유형

- - - + + +
@@ -357,12 +351,8 @@ export default function NewFlightApprovalsContainer({ mode }) {

거리측정

- - + +