diff --git a/src/components/basis/flight/plan/FlightPlanAreaForm.js b/src/components/basis/flight/plan/FlightPlanAreaForm.js
index 2de4002..0d9fdc4 100644
--- a/src/components/basis/flight/plan/FlightPlanAreaForm.js
+++ b/src/components/basis/flight/plan/FlightPlanAreaForm.js
@@ -1,20 +1,24 @@
-import React from 'react';
+import React, { useState, useEffect } from 'react';
+import classnames from 'classnames';
import {
Card,
CardBody,
Col,
FormGroup,
+ FormFeedback,
Input,
Label,
Row,
- Button
+ Button,
+ Form
} from 'reactstrap';
-const FlightPlanAreaForm = () => {
+
+const FlightPlanAreaForm = (props) => {
return (
-
+
+
+ 확인
+
+
+ props.setModal({ ...props.modal, isOpen: !props.modal.isOpen })
+ }
+ >
+ 취소
+
-
-
+
)
diff --git a/src/components/modal/FormModal.js b/src/components/basis/flight/plan/FlightPlanAreaModal.js
similarity index 50%
rename from src/components/modal/FormModal.js
rename to src/components/basis/flight/plan/FlightPlanAreaModal.js
index 5c7f92f..3bcee8f 100644
--- a/src/components/modal/FormModal.js
+++ b/src/components/basis/flight/plan/FlightPlanAreaModal.js
@@ -1,6 +1,11 @@
+import { useState } from 'react';
import { Button, Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
+import FlightPlanAreaContainer from '../../../../containers/basis/flight/plan/FlightPlanAreaContainer';
+
+export const FlightPlanAreaModal = props => {
+
+ const [onSubmit, setOnSubmit] = useState(false);
-export const FormModal = props => {
return (
{
{props.modal.title}
- {props.modal.contents}
+
-
+ {/*
-
+ */}
);
diff --git a/src/containers/basis/flight/plan/FlightPlanAreaContainer.js b/src/containers/basis/flight/plan/FlightPlanAreaContainer.js
index 1e2cecd..b8f822f 100644
--- a/src/containers/basis/flight/plan/FlightPlanAreaContainer.js
+++ b/src/containers/basis/flight/plan/FlightPlanAreaContainer.js
@@ -1,29 +1,59 @@
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 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(() => {
setAirArea(areaList);
- }, [areaList])
+ }, [areaList])
return (
@@ -34,8 +64,14 @@ const FlightPlanAreaContainer = () => {
/>
) : null}
-
-
+
+
diff --git a/src/containers/basis/flight/plan/FlightPlanDetailContainer.js b/src/containers/basis/flight/plan/FlightPlanDetailContainer.js
index 99809ec..7e7d452 100644
--- a/src/containers/basis/flight/plan/FlightPlanDetailContainer.js
+++ b/src/containers/basis/flight/plan/FlightPlanDetailContainer.js
@@ -1,18 +1,21 @@
-import React, {useState} from 'react';
+import React, {useEffect, useState} from 'react';
import FlightPlanForm from '../../../../components/basis/flight/plan/FlightPlanForm';
import { CustomDetailLayout } from '../../../../components/layout/CustomDetailLayout';
-import { FormModal } from '../../../../components/modal/FormModal';
+import { FlightPlanAreaModal } from '../../../../components/basis/flight/plan/FlightPlanAreaModal';
import FlightPlanAreaContainer from './FlightPlanAreaContainer';
+import { useSelector } from 'react-redux';
const FlightPlanDetailContainer = () => {
+ const dispatch = useDispatch();
+ const history = useHistory();
+
+ const { flightPlanArea } = useSelector(state => state.flightState);
+
const [modal, setModal] = useState({
isOpen: false,
- title: '',
- contents: '',
+ title: '',
});
-
-
const saveFlightPlanArea = () => {
console.log('비행 구역 설정 저장');
@@ -21,20 +24,23 @@ const FlightPlanDetailContainer = () => {
const openModal = () => {
setModal({
isOpen: true,
- title: '비행 구역 설정',
- contents:
+ title: '비행 구역 설정',
});
}
+ useEffect(() => {
+
+ }, [flightPlanArea]);
+
return (
-
)
diff --git a/src/modules/basis/flight/actions/basisFlightAction.ts b/src/modules/basis/flight/actions/basisFlightAction.ts
index f7cd37c..402a7ba 100644
--- a/src/modules/basis/flight/actions/basisFlightAction.ts
+++ b/src/modules/basis/flight/actions/basisFlightAction.ts
@@ -1,6 +1,6 @@
import { AxiosError } from 'axios';
import { createAsyncAction, ActionType} from 'typesafe-actions';
-import { FlightAreaData } from '../models/basisFlightModel';
+import { FlightAreaData, FlightPlanArea } from '../models/basisFlightModel';
// 공역 조회
@@ -8,14 +8,26 @@ const AREA_LIST_REQUEST = 'basis/flight/area/LIST_REQUEST';
const AREA_LIST_SUCCESS = 'basis/flight/area/LIST_SUCCESS';
const AREA_LIST_FAILURE = 'basis/flight/area/LIST_FAILURE';
+// 비행 구역 설정
+const FLIGHT_PLAN_AREA_REQUEST = 'basis/flight/plan/area/LIST_REQUEST';
+const FLIGHT_PLAN_AREA_SUCCESS = 'basis/flight/plan/area/LIST_SUCCESS';
+const FLIGHT_PLAN_AREA_FAILURE = 'basis/flight/plan/area/LIST_FAILURE';
+
export const AREA_LIST = createAsyncAction(
AREA_LIST_REQUEST,
AREA_LIST_SUCCESS,
AREA_LIST_FAILURE
)();
+export const FLIGHT_PLAN_AREA = createAsyncAction(
+ FLIGHT_PLAN_AREA_REQUEST,
+ FLIGHT_PLAN_AREA_SUCCESS,
+ FLIGHT_PLAN_AREA_FAILURE
+)();
+
const actions = {
- AREA_LIST
+ AREA_LIST,
+ FLIGHT_PLAN_AREA
};
export type FlightAction = ActionType;
\ No newline at end of file
diff --git a/src/modules/basis/flight/models/basisFlightModel.ts b/src/modules/basis/flight/models/basisFlightModel.ts
index 3880268..abcedbc 100644
--- a/src/modules/basis/flight/models/basisFlightModel.ts
+++ b/src/modules/basis/flight/models/basisFlightModel.ts
@@ -1,11 +1,21 @@
export interface FlightState {
areaList: FlightAreaData | undefined
+ flightPlanArea: FlightPlanArea | undefined
}
export interface FlightAreaData {
areaList: []
}
+export interface FlightPlanArea {
+ address : '',
+ coordinates : '',
+ redius : '',
+ altitude_m : '',
+ altitude_ft : '',
+}
+
export const initFlight = {
- areaList: undefined
+ areaList: undefined,
+ flightPlanArea: undefined
};
\ No newline at end of file
diff --git a/src/modules/basis/flight/reducers/basisFlightReducer.ts b/src/modules/basis/flight/reducers/basisFlightReducer.ts
index 32ad54b..708445a 100644
--- a/src/modules/basis/flight/reducers/basisFlightReducer.ts
+++ b/src/modules/basis/flight/reducers/basisFlightReducer.ts
@@ -12,4 +12,10 @@ export const flightReducer = createReducer (
const {data} = action.payload;
draft.areaList = data;
})
-) ;
\ No newline at end of file
+)
+.handleAction(Actions.FLIGHT_PLAN_AREA.request, (state, action) =>
+ produce(state, draft => {
+ const data = action.payload;
+ draft.flightPlanArea = data;
+ })
+)
\ No newline at end of file
diff --git a/src/modules/basis/flight/sagas/basisFlightSaga.ts b/src/modules/basis/flight/sagas/basisFlightSaga.ts
index 9676eaa..82362ef 100644
--- a/src/modules/basis/flight/sagas/basisFlightSaga.ts
+++ b/src/modules/basis/flight/sagas/basisFlightSaga.ts
@@ -38,6 +38,24 @@ function* listAreaSaga(action: ActionType) {
}
}
+function* createFlightPlanArea(action: ActionType) {
+ try {
+ const data = action.payload;
+
+ yield put(
+ Actions.FLIGHT_PLAN_AREA.success({
+ data: data
+ })
+ )
+
+ } catch (error: any) {
+ yield put(
+ Actions.FLIGHT_PLAN_AREA.failure(error)
+ )
+ }
+}
+
export function* flightSaga() {
yield takeEvery(Actions.AREA_LIST.request, listAreaSaga);
+ yield takeEvery(Actions.FLIGHT_PLAN_AREA.request, createFlightPlanArea);
}
\ No newline at end of file