|
|
|
@ -1,24 +1,54 @@
|
|
|
|
|
import React, { useEffect, useState } from 'react'; |
|
|
|
|
import { useForm } from 'react-hook-form'; |
|
|
|
|
import {useHistory} from 'react-router-dom'; |
|
|
|
|
import { useDispatch, useSelector } from 'react-redux'; |
|
|
|
|
import FlightPlanAreaForm from '../../../../components/basis/flight/plan/FlightPlanAreaForm'; |
|
|
|
|
import { Button, Col, Row } from 'reactstrap'; |
|
|
|
|
import {Col, Row, Form } from 'reactstrap'; |
|
|
|
|
import * as Actions from '../../../../modules/basis/flight/actions/basisFlightAction'; |
|
|
|
|
import FlightPlanAreaMap from '../../../../components/basis/flight/plan/FlightPlanAreaMap'; |
|
|
|
|
import * as yup from 'yup'; |
|
|
|
|
import { yupResolver } from '@hookform/resolvers/yup'; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const FlightPlanAreaContainer = () => { |
|
|
|
|
const FlightPlanAreaContainer = (props) => { |
|
|
|
|
const dispatch = useDispatch(); |
|
|
|
|
const { areaList } = useSelector(state => state.flightState); |
|
|
|
|
const history = useHistory(); |
|
|
|
|
|
|
|
|
|
const { areaList } = useSelector(state => state.flightState); |
|
|
|
|
const [airArea, setAirArea] = useState(null); |
|
|
|
|
|
|
|
|
|
const validSchema = yup.object().shape({ |
|
|
|
|
// address: yup.string().trim().required('주소가 올바르지 않습니다.'),
|
|
|
|
|
// coodinates: yup.string().trim().required('좌표가 올바르지 않습니다.'),
|
|
|
|
|
// radius: yup.string().trim().required('반경을 입력해 주세요.'),
|
|
|
|
|
// altitude_m: yup.string().trim().required('고도(m)를 입력해 주세요.'),
|
|
|
|
|
// altitude_ft: yup.string().trim().required('고도(ft)를 입력해 주세요.'),
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
const { register, getValues, setValue, errors, handleSubmit } = useForm({ |
|
|
|
|
defaultValues: { |
|
|
|
|
address: '', |
|
|
|
|
coodinates: '', |
|
|
|
|
radius: '', |
|
|
|
|
altitude_m: '', |
|
|
|
|
altitude_ft: '', |
|
|
|
|
}, |
|
|
|
|
resolver: yupResolver(validSchema) |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const getAriAreaList = () => { |
|
|
|
|
const getAirAreaList = () => { |
|
|
|
|
dispatch(Actions.AREA_LIST.request()); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const createAirArea = async data => {
|
|
|
|
|
dispatch(Actions.FLIGHT_PLAN_AREA.request(data)); |
|
|
|
|
|
|
|
|
|
props.setModal({ ...props.modal, isOpen: !props.modal.isOpen }); |
|
|
|
|
props.setOnSubmit(false); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
getAriAreaList(); |
|
|
|
|
getAirAreaList(); |
|
|
|
|
}, []); |
|
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
@ -35,7 +65,13 @@ const FlightPlanAreaContainer = () => {
|
|
|
|
|
) : null}
|
|
|
|
|
</Col> |
|
|
|
|
<Col md={6} lg={6}>
|
|
|
|
|
<FlightPlanAreaForm />
|
|
|
|
|
<FlightPlanAreaForm |
|
|
|
|
modal={props.modal} |
|
|
|
|
setModal={props.setModal} |
|
|
|
|
data={register} |
|
|
|
|
errors={errors} |
|
|
|
|
submit={handleSubmit(createAirArea)} |
|
|
|
|
/> |
|
|
|
|
</Col> |
|
|
|
|
</Row> |
|
|
|
|
|
|
|
|
|