From 1455f39252e435bf6f067c68d938a72f94d63ba2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?sanguu516=28=EB=B0=95=EC=83=81=ED=98=84=29?= Date: Wed, 20 Sep 2023 11:28:17 +0900 Subject: [PATCH] =?UTF-8?q?LAANC=20=EC=8B=A0=EC=B2=AD=20=EB=B9=84=ED=96=89?= =?UTF-8?q?=EA=B3=84=ED=9A=8D=EC=84=9C=EB=A1=9C=20=EC=9D=B4=EC=A0=84?= =?UTF-8?q?=EC=8B=9C=20=EB=8D=B0=EC=9D=B4=ED=84=B0=20=EC=9C=A0=EC=A7=80=20?= =?UTF-8?q?=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/laanc/FlightPlan.js | 207 +++++----------------------------- src/views/laanc/LeftMenu.js | 165 ++++++++++++++++++++++++++- 2 files changed, 191 insertions(+), 181 deletions(-) diff --git a/src/views/laanc/FlightPlan.js b/src/views/laanc/FlightPlan.js index e3f2cac..5d01af6 100644 --- a/src/views/laanc/FlightPlan.js +++ b/src/views/laanc/FlightPlan.js @@ -33,160 +33,10 @@ import { sensorClickAction } from '../../modules/control/map/actions/controlMapActions'; import { useHistory } from 'react-router-dom'; -const FlightPlan = props => { - const [detailData, setDetailData] = useState(initFlightBas.initDetail); +const FlightPlan = ({ handleChange, handlerNext, data }) => { const user = useSelector(state => state.authState); - const [modal2, setModal2] = useState({ - isOpen: false, - title: '', - desc: '' - }); - const history = useHistory(); - - const handleChange = ({ name, value, type, index, pIndex }) => { - // 입력 값에서 숫자 이외의 문자를 제거 - - const arrName = `${type}List`; - - switch (type) { - case 'area': - case 'pilot': - case 'arcrft': - if (name === 'fltElev' || name === 'bufferZone') { - 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; - } - }; - 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]*$/; - if (!detailData.pilotList[0].memberName) { - setModal2({ - isOpen: true, - title: '필수값 입력 오류', - desc: '이름을 입력해 주세요.' - }); - - return false; - } else if (!check_num.test(detailData.pilotList[0].hpno)) { - setModal2({ - isOpen: true, - title: '필수값 입력 오류', - desc: '연락처를 확인해 주세요.' - }); - return false; - - return false; - } else if (!reg_email.test(detailData.pilotList[0].email)) { - 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].groupNm) { - 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].ownerNm) { - setModal2({ - isOpen: true, - title: '필수값 입력 오류', - desc: '소유자명(법인명)를 입력해 주세요.' - }); - - return false; - } else { - //api 호출 부분 - - handleClick(2); - } - }; - - const handleClick = value => { - props.handlerStep(value); - }; + const history = useHistory(); const handlerLaanc = () => { history.replace('/control'); @@ -227,7 +77,7 @@ const FlightPlan = props => { className='mr-1' color='primary' onClick={e => handlerDrawType('LINE')} - disabled={props.isDisabled || props.isDone} + // disabled={isDisabled || isDone} > WayPoint @@ -235,7 +85,7 @@ const FlightPlan = props => { className='mr-1' color='primary' onClick={e => handlerDrawType('CIRCLE')} - disabled={props.isDisabled || props.isDone} + // disabled={isDisabled || isDone} > Circle @@ -243,7 +93,7 @@ const FlightPlan = props => { className='mr-1' color='primary' onClick={e => handlerDrawType('POLYGON')} - disabled={props.isDisabled || props.isDone} + // disabled={isDisabled || isDone} > Polygon @@ -265,7 +115,7 @@ const FlightPlan = props => { id='memberName' name='memberName' // defaultValue={data.memberName} - value={detailData.pilotList[0].memberName || ''} + value={data.pilotList[0].memberName || ''} onChange={e => { const { name, value } = e.target; handleChange({ @@ -310,7 +160,7 @@ const FlightPlan = props => { id='hpno' name='hpno' // defaultValue={data.hpno} - value={detailData.pilotList[0].hpno || ''} + value={data.pilotList[0].hpno || ''} bsSize='sm' onChange={e => { const { name, value } = e.target; @@ -335,7 +185,7 @@ const FlightPlan = props => { id='email' name='email' // defaultValue={data.email || ''} - value={detailData.pilotList[0].email} + value={data.pilotList[0].email} bsSize='sm' onChange={e => { const { name, value } = e.target; @@ -345,7 +195,7 @@ const FlightPlan = props => { value }); }} - // innerRef={props.data} + // innerRef={data} placeholder='' /> @@ -369,8 +219,8 @@ const FlightPlan = props => { id='schFltStDt' name='schFltStDt' data-enable-time - defaultValue={detailData.schFltStDt} - value={detailData.schFltStDt} + defaultValue={data.schFltStDt} + value={data.schFltStDt} onChange={date => { const value = moment(date[0]).format('YYYY-MM-DD HH:mm:ss') || @@ -396,8 +246,8 @@ const FlightPlan = props => { id='schFltEndDt' name='schFltEndDt' data-enable-time - defaultValue={detailData.schFltEndDt} - value={detailData.schFltEndDt} + defaultValue={data.schFltEndDt} + value={data.schFltEndDt} onChange={date => { const value = moment(date[0]).format('YYYY-MM-DD HH:mm:ss') || @@ -421,7 +271,7 @@ const FlightPlan = props => { type='select' id='fltPurpose' name='fltPurpose' - value={detailData.fltPurpose} + value={data.fltPurpose} bsSize='sm' onChange={e => { const { name, value } = e.target; @@ -431,9 +281,9 @@ const FlightPlan = props => { value }); }} - // innerRef={props.data} + // innerRef={data} // className={classnames({ - // 'is-invalid': props.errors.arcrftTypeCd + // 'is-invalid': errors.arcrftTypeCd // })} > {/* TODO CDNOT 코드연동 필요 */} @@ -469,7 +319,7 @@ const FlightPlan = props => { id='fltElev' name='fltElev' // defaultValue={data.email || ''} - value={detailData.areaList[0].fltElev} + value={data.areaList[0].fltElev} bsSize='sm' onChange={e => { const { name, value } = e.target; @@ -479,7 +329,7 @@ const FlightPlan = props => { value }); }} - // innerRef={props.data} + // innerRef={data} placeholder='100m' /> @@ -494,7 +344,7 @@ const FlightPlan = props => { id='bufferZone' name='bufferZone' // defaultValue={data.email || ''} - value={detailData.areaList[0].bufferZone} + value={data.areaList[0].bufferZone} bsSize='sm' onChange={e => { const { name, value } = e.target; @@ -504,7 +354,7 @@ const FlightPlan = props => { value }); }} - // innerRef={props.data} + // innerRef={data} placeholder='100m' /> @@ -519,7 +369,7 @@ const FlightPlan = props => { id='fltMethod' name='fltMethod' // defaultValue={data.email || ''} - value={detailData.areaList[0].fltMethod} + value={data.areaList[0].fltMethod} bsSize='sm' onChange={e => { const { name, value } = e.target; @@ -529,7 +379,7 @@ const FlightPlan = props => { value }); }} - // innerRef={props.data} + // innerRef={data} placeholder='' /> @@ -551,7 +401,7 @@ const FlightPlan = props => { id='groupNm' name='groupNm' // defaultValue={data.email || ''} - // value={data.email} + value={data.arcrftList[0].groupNm} bsSize='sm' onChange={e => { const { name, value } = e.target; @@ -561,7 +411,7 @@ const FlightPlan = props => { value }); }} - // innerRef={props.data} + // innerRef={data} placeholder='' /> @@ -576,7 +426,7 @@ const FlightPlan = props => { id='arcrftTypeCd' name='arcrftTypeCd' // defaultValue={data.email || ''} - // value={data.email} + value={data.arcrftList[0].arcrftTypeCd} bsSize='sm' onChange={e => { const { name, value } = e.target; @@ -586,7 +436,7 @@ const FlightPlan = props => { value }); }} - // innerRef={props.data} + // innerRef={data} placeholder='100m' /> @@ -601,7 +451,7 @@ const FlightPlan = props => { id='ownerNm' name='ownerNm' // defaultValue={data.email || ''} - // value={data.email} + value={data.arcrftList[0].ownerNm} bsSize='sm' onChange={e => { const { name, value } = e.target; @@ -611,7 +461,7 @@ const FlightPlan = props => { value }); }} - // innerRef={props.data} + // innerRef={data} placeholder='' /> @@ -647,7 +497,6 @@ const FlightPlan = props => { - ); }; diff --git a/src/views/laanc/LeftMenu.js b/src/views/laanc/LeftMenu.js index 82bd411..ec51122 100644 --- a/src/views/laanc/LeftMenu.js +++ b/src/views/laanc/LeftMenu.js @@ -3,12 +3,23 @@ import tp_logo from '../../assets/images/tplogo_wh.png'; import kac_logo from '../../assets/images/kac_logo_wh.png'; import FlightPlan from './FlightPlan'; import Apply from './Apply'; -import { useState } from 'react'; +import { useEffect, useState } from 'react'; import { AiOutlinePoweroff, AiOutlineExclamation } from 'react-icons/ai'; import WebsocketClient from '../../components/websocket/WebsocketClient'; import UserDropdown from '../../@core/layouts/components/navbar/UserDropdown'; +import { ErrorModal } from '../../components/modal/ErrorModal'; +import { + initFlight, + initFlightBas +} from '../../modules/basis/flight/models/basisFlightModel'; function LeftMenu() { const [step, setStep] = useState(1); + const [detailData, setDetailData] = useState(initFlightBas.initDetail); + const [modal2, setModal2] = useState({ + isOpen: false, + title: '', + desc: '' + }); const handlerStep = step => { setStep(step); @@ -17,6 +28,148 @@ function LeftMenu() { const handlerLogout = () => { dispatch(Actions.logout.request()); }; + + useEffect(() => {}, [detailData]); + 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; + } + }; + + 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]*$/; + if (!detailData.pilotList[0].memberName) { + setModal2({ + isOpen: true, + title: '필수값 입력 오류', + desc: '이름을 입력해 주세요.' + }); + + return false; + } else if (!check_num.test(detailData.pilotList[0].hpno)) { + setModal2({ + isOpen: true, + title: '필수값 입력 오류', + desc: '연락처를 확인해 주세요.' + }); + return false; + } else if (!reg_email.test(detailData.pilotList[0].email)) { + 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].groupNm) { + 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].ownerNm) { + setModal2({ + isOpen: true, + title: '필수값 입력 오류', + desc: '소유자명(법인명)를 입력해 주세요.' + }); + + return false; + } else { + //api 호출 부분 + + setStep(2); + } + }; + return ( <>
@@ -41,9 +194,17 @@ function LeftMenu() {
- {step === 1 && } + {step === 1 && ( + + )} {step === 2 && }
+
);