|
|
@ -3,6 +3,7 @@ import { |
|
|
|
Card, |
|
|
|
Card, |
|
|
|
CardBody, |
|
|
|
CardBody, |
|
|
|
Button, |
|
|
|
Button, |
|
|
|
|
|
|
|
Input |
|
|
|
} from 'reactstrap'; |
|
|
|
} from 'reactstrap'; |
|
|
|
import { useDispatch, useSelector } from 'react-redux'; |
|
|
|
import { useDispatch, useSelector } from 'react-redux'; |
|
|
|
import { FeatureAirZone } from '../../../map/naver/feature/FeatureAirZone'; |
|
|
|
import { FeatureAirZone } from '../../../map/naver/feature/FeatureAirZone'; |
|
|
@ -23,6 +24,7 @@ const FlightPlanAreaMap = (props) => { |
|
|
|
const [mode, setMode] = useState(); |
|
|
|
const [mode, setMode] = useState(); |
|
|
|
const [mapAreaCoordList, setMapAreaCoordList] = useState(initFlightBas.initDetail.areaList); |
|
|
|
const [mapAreaCoordList, setMapAreaCoordList] = useState(initFlightBas.initDetail.areaList); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const [searchData, setSearchData] = useState(); |
|
|
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
useEffect(() => { |
|
|
|
NaverMapInit();
|
|
|
|
NaverMapInit();
|
|
|
@ -50,20 +52,6 @@ const FlightPlanAreaMap = (props) => { |
|
|
|
}, [areaCoordList]); |
|
|
|
}, [areaCoordList]); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const search = (latlng) => { |
|
|
|
|
|
|
|
naver.maps.Service.reverseGeocode({ |
|
|
|
|
|
|
|
coords: latlng, |
|
|
|
|
|
|
|
orders: [ |
|
|
|
|
|
|
|
naver.maps.Service.OrderType.ADDR, |
|
|
|
|
|
|
|
naver.maps.Service.OrderType.ROAD_ADDR |
|
|
|
|
|
|
|
].join(',') |
|
|
|
|
|
|
|
}, ) |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const ModeInit = () => { |
|
|
|
const ModeInit = () => { |
|
|
|
setMode(mapControl.drawType) |
|
|
|
setMode(mapControl.drawType) |
|
|
|
} |
|
|
|
} |
|
|
@ -136,6 +124,18 @@ const FlightPlanAreaMap = (props) => { |
|
|
|
setMapAreaCoordList(areaList); |
|
|
|
setMapAreaCoordList(areaList); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const handleSearch = () => { |
|
|
|
|
|
|
|
console.log(searchData, 'encoding') |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const handleChange = e => { |
|
|
|
|
|
|
|
const {name, value} = e.target; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if(name=='searchInput') { |
|
|
|
|
|
|
|
setSearchData(encodeURI(value)); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
return ( |
|
|
|
<Card className='mb-0'> |
|
|
|
<Card className='mb-0'> |
|
|
|
<CardBody> |
|
|
|
<CardBody> |
|
|
@ -160,13 +160,6 @@ const FlightPlanAreaMap = (props) => { |
|
|
|
handleConfirm={props.handleConfirm} |
|
|
|
handleConfirm={props.handleConfirm} |
|
|
|
/> : null} |
|
|
|
/> : null} |
|
|
|
|
|
|
|
|
|
|
|
{/* <Button.Ripple |
|
|
|
|
|
|
|
color='primary' |
|
|
|
|
|
|
|
className='area-button' |
|
|
|
|
|
|
|
onClick = {e => props.handleConfirm(mapAreaCoordList)} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
확인 |
|
|
|
|
|
|
|
</Button.Ripple> */} |
|
|
|
|
|
|
|
<Button.Ripple |
|
|
|
<Button.Ripple |
|
|
|
color='primary' |
|
|
|
color='primary' |
|
|
|
className='area-button' |
|
|
|
className='area-button' |
|
|
@ -180,6 +173,24 @@ const FlightPlanAreaMap = (props) => { |
|
|
|
> |
|
|
|
> |
|
|
|
초기화 |
|
|
|
초기화 |
|
|
|
</Button.Ripple> |
|
|
|
</Button.Ripple> |
|
|
|
|
|
|
|
<Input |
|
|
|
|
|
|
|
type='text' |
|
|
|
|
|
|
|
id='searchInput' |
|
|
|
|
|
|
|
name='searchInput' |
|
|
|
|
|
|
|
className='area-input' |
|
|
|
|
|
|
|
placeholder='검색명을 입력하세요.' |
|
|
|
|
|
|
|
onChange={handleChange} |
|
|
|
|
|
|
|
// bsSize='sm'
|
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
<Button.Ripple |
|
|
|
|
|
|
|
// className='mr-1'
|
|
|
|
|
|
|
|
className='area-button' |
|
|
|
|
|
|
|
color='primary' |
|
|
|
|
|
|
|
onClick={handleSearch} |
|
|
|
|
|
|
|
// size='sm'
|
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
검색 |
|
|
|
|
|
|
|
</Button.Ripple> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|