|
|
|
import { useEffect, useState } from 'react';
|
|
|
|
import { useHistory, useParams, useLocation } from 'react-router-dom';
|
|
|
|
import LaancStep1 from '../../views/laanc/LaancStep1'; // laanc step 1
|
|
|
|
import LaancStep2 from '../../views/laanc/LaancStep2'; // laanc step 2
|
|
|
|
import LaancStep3 from '../../views/laanc/LaacnStep3'; // laanc step 3
|
|
|
|
import moment from 'moment';
|
|
|
|
import { WeatherContainer } from '../basis/flight/plan/WeatherContainer';
|
|
|
|
import { ErrorModal } from '../../components/modal/ErrorModal';
|
|
|
|
import {
|
|
|
|
initFlight,
|
|
|
|
initFlightBas
|
|
|
|
} from '../../modules/basis/flight/models/basisFlightModel';
|
|
|
|
import {
|
|
|
|
Row,
|
|
|
|
Col,
|
|
|
|
Button,
|
|
|
|
Modal,
|
|
|
|
ModalHeader,
|
|
|
|
ModalBody,
|
|
|
|
ModalFooter,
|
|
|
|
Alert,
|
|
|
|
FormGroup,
|
|
|
|
Label,
|
|
|
|
Input
|
|
|
|
} from 'reactstrap';
|
|
|
|
|
|
|
|
export default function LaancPlanContainer({ currentParm }) {
|
|
|
|
const [step, setStep] = useState(1);
|
|
|
|
const [detailData, setDetailData] = useState(initFlightBas.initDetail);
|
|
|
|
const [centeredModal, setCenteredModal] = useState(false);
|
|
|
|
const [formModal, setFormModal] = useState(false);
|
|
|
|
const [disabledAnimation, setDisabledAnimation] = useState(true);
|
|
|
|
const [modal2, setModal2] = useState({
|
|
|
|
isOpen: false,
|
|
|
|
title: '',
|
|
|
|
desc: ''
|
|
|
|
});
|
|
|
|
//날씨 임시 데이터
|
|
|
|
const [wheather, setWheather] = useState([
|
|
|
|
{
|
|
|
|
coordList: [
|
|
|
|
{
|
|
|
|
lat: 37.40284040287055,
|
|
|
|
lon: 126.68639226254697
|
|
|
|
}
|
|
|
|
]
|
|
|
|
}
|
|
|
|
]);
|
|
|
|
|
|
|
|
// step 핸들러
|
|
|
|
const handlerStep = step => {
|
|
|
|
setStep(step);
|
|
|
|
};
|
|
|
|
|
|
|
|
const handlerLogout = () => {
|
|
|
|
dispatch(Actions.logout.request());
|
|
|
|
};
|
|
|
|
|
|
|
|
useEffect(() => {}, [detailData]);
|
|
|
|
|
|
|
|
// 날씨 핸들러
|
|
|
|
const handlerWeather = () => {
|
|
|
|
setFormModal(!formModal);
|
|
|
|
};
|
|
|
|
|
|
|
|
// 비행계획서 작성 핸들러
|
|
|
|
const handleChange = ({ name, value, type, index, pIndex }) => {
|
|
|
|
const arrName = `${type}List`;
|
|
|
|
|
|
|
|
switch (type) {
|
|
|
|
case 'area':
|
|
|
|
case 'pilot':
|
|
|
|
case 'arcrft':
|
|
|
|
if (name === 'fltElev' || name === 'bufferZone' || name === 'hpno') {
|
|
|
|
const newValue = value.replace(/[^0-9]/g, '');
|
|
|
|
setDetailData(prevState => {
|
|
|
|
const arr = [...prevState[arrName]];
|
|
|
|
const updateData = {
|
|
|
|
...prevState[arrName][0],
|
|
|
|
[name]: newValue
|
|
|
|
};
|
|
|
|
arr[0] = updateData;
|
|
|
|
return {
|
|
|
|
...prevState,
|
|
|
|
[arrName]: arr
|
|
|
|
};
|
|
|
|
});
|
|
|
|
} else {
|
|
|
|
setDetailData(prevState => {
|
|
|
|
const arr = [...prevState[arrName]];
|
|
|
|
const updateData = {
|
|
|
|
...prevState[arrName][0],
|
|
|
|
[name]: value
|
|
|
|
};
|
|
|
|
arr[0] = updateData;
|
|
|
|
return {
|
|
|
|
...prevState,
|
|
|
|
[arrName]: arr
|
|
|
|
};
|
|
|
|
});
|
|
|
|
}
|
|
|
|
break;
|
|
|
|
case 'plan':
|
|
|
|
default:
|
|
|
|
setDetailData(prevState => ({
|
|
|
|
...prevState,
|
|
|
|
[name]: value
|
|
|
|
}));
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
// 스텝 1 다음 버튼 이벤트
|
|
|
|
const handlerNext = () => {
|
|
|
|
const reg_email =
|
|
|
|
/^([0-9a-zA-Z_\.-]+)@([0-9a-zA-Z_-]+)(\.[0-9a-zA-Z_-]+){1,2}$/;
|
|
|
|
const check_num = /[0-9]/;
|
|
|
|
const check_kor =
|
|
|
|
/^[가-힣a-zA-Z0-9][^!@#$%^&*()+\=\[\]{};':"\\|,.<>\/?\s]*$/;
|
|
|
|
// 시작일자
|
|
|
|
const schFltStDt = moment(detailData.schFltStDt, 'YYYY-MM-DD HH:mm:ss');
|
|
|
|
// 종료일자
|
|
|
|
const schFltEndDt = moment(detailData.schFltEndDt, 'YYYY-MM-DD HH:mm:ss');
|
|
|
|
|
|
|
|
const currentDate = moment(); // 현재 날짜와 시간을 가져옵니다.
|
|
|
|
|
|
|
|
if (!schFltStDt.isAfter(currentDate) || !schFltEndDt.isAfter(currentDate)) {
|
|
|
|
setModal2({
|
|
|
|
isOpen: true,
|
|
|
|
title: '필수값 입력 오류',
|
|
|
|
desc: '비행 일자가 이미 지난 일자입니다.'
|
|
|
|
});
|
|
|
|
return false;
|
|
|
|
} else if (schFltStDt.isAfter(schFltEndDt)) {
|
|
|
|
setModal2({
|
|
|
|
isOpen: true,
|
|
|
|
title: '필수값 입력 오류',
|
|
|
|
desc: '비행일자를 확인해주세요.'
|
|
|
|
});
|
|
|
|
return false;
|
|
|
|
} else if (!detailData.fltPurpose) {
|
|
|
|
setModal2({
|
|
|
|
isOpen: true,
|
|
|
|
title: '필수값 입력 오류',
|
|
|
|
desc: '비행목적을 선택해 주세요.'
|
|
|
|
});
|
|
|
|
|
|
|
|
return false;
|
|
|
|
} else if (!detailData.areaList[0].fltElev) {
|
|
|
|
setModal2({
|
|
|
|
isOpen: true,
|
|
|
|
title: '필수값 입력 오류',
|
|
|
|
desc: '고도를 입력해 주세요.'
|
|
|
|
});
|
|
|
|
|
|
|
|
return false;
|
|
|
|
} else if (!detailData.areaList[0].bufferZone) {
|
|
|
|
setModal2({
|
|
|
|
isOpen: true,
|
|
|
|
title: '필수값 입력 오류',
|
|
|
|
desc: '반경을 입력해 주세요.'
|
|
|
|
});
|
|
|
|
|
|
|
|
return false;
|
|
|
|
} else if (!detailData.areaList[0].fltMethod) {
|
|
|
|
setModal2({
|
|
|
|
isOpen: true,
|
|
|
|
title: '필수값 입력 오류',
|
|
|
|
desc: '비행방식를 입력해 주세요.'
|
|
|
|
});
|
|
|
|
|
|
|
|
return false;
|
|
|
|
} else if (!detailData.arcrftList[0].arcrftTypeCd) {
|
|
|
|
setModal2({
|
|
|
|
isOpen: true,
|
|
|
|
title: '필수값 입력 오류',
|
|
|
|
desc: '기체 종류를 입력해 주세요.'
|
|
|
|
});
|
|
|
|
|
|
|
|
return false;
|
|
|
|
} else if (!detailData.arcrftList[0].groupNm) {
|
|
|
|
setModal2({
|
|
|
|
isOpen: true,
|
|
|
|
title: '필수값 입력 오류',
|
|
|
|
desc: '기체 신고 번호를 입력해 주세요.'
|
|
|
|
});
|
|
|
|
|
|
|
|
return false;
|
|
|
|
} else {
|
|
|
|
//api 호출 부분
|
|
|
|
|
|
|
|
setStep(2);
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
return (
|
|
|
|
<>
|
|
|
|
<div className='disabled-animation-modal'>
|
|
|
|
<Modal
|
|
|
|
isOpen={disabledAnimation}
|
|
|
|
toggle={() => setDisabledAnimation(!disabledAnimation)}
|
|
|
|
className='modal-dialog-centered laanc-modal'
|
|
|
|
fade={false}
|
|
|
|
backdrop={false}
|
|
|
|
>
|
|
|
|
{step === 1 && (
|
|
|
|
<>
|
|
|
|
<LaancStep1
|
|
|
|
// handlerStep={handlerStep}
|
|
|
|
data={detailData}
|
|
|
|
handleChange={handleChange}
|
|
|
|
handlerNext={handlerNext}
|
|
|
|
handlerWeather={handlerWeather}
|
|
|
|
setDisabledAnimation={setDisabledAnimation}
|
|
|
|
disabledAnimation={disabledAnimation}
|
|
|
|
centeredModal={centeredModal}
|
|
|
|
setCenteredModal={setCenteredModal}
|
|
|
|
currentParm={currentParm}
|
|
|
|
/>
|
|
|
|
</>
|
|
|
|
)}
|
|
|
|
{step === 2 && (
|
|
|
|
<LaancStep2
|
|
|
|
handlerStep={handlerStep}
|
|
|
|
data={detailData}
|
|
|
|
disabledAnimation={disabledAnimation}
|
|
|
|
setDisabledAnimation={setDisabledAnimation}
|
|
|
|
centeredModal={centeredModal}
|
|
|
|
setCenteredModal={setCenteredModal}
|
|
|
|
/>
|
|
|
|
)}
|
|
|
|
{step === 3 && (
|
|
|
|
<LaancStep3
|
|
|
|
handlerStep={handlerStep}
|
|
|
|
data={detailData}
|
|
|
|
disabledAnimation={disabledAnimation}
|
|
|
|
setDisabledAnimation={setDisabledAnimation}
|
|
|
|
/>
|
|
|
|
)}
|
|
|
|
</Modal>
|
|
|
|
<ErrorModal modal={modal2} setModal={setModal2} />
|
|
|
|
</div>
|
|
|
|
</>
|
|
|
|
);
|
|
|
|
}
|