pav
/
pav-fe-kac-pal
9
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

laanc 신청서 작업중

pull/2/head
sanguu516(박상현) 1 year ago
parent
f446e17c9a
commit
b269e54add
4 changed files with 225 additions and 354 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 55
      src/containers/basis/flight/laanc/LaancPlanContainer.js
  2. 2
      src/navigation/flightPlan/index.js
  3. 348
      src/views/laanc/Apply.js
  4. 46
      src/views/laanc/FlightPlan.js

55
src/containers/basis/flight/laanc/LaancPlanContainer.js
Unescape View File

@ -25,6 +25,8 @@ import {
const LaancPlanContainer = () => { const LaancPlanContainer = () => {
const [step, setStep] = useState(1); const [step, setStep] = useState(1);
const [detailData, setDetailData] = useState(initFlightBas.initDetail); const [detailData, setDetailData] = useState(initFlightBas.initDetail);
const [centeredModal, setCenteredModal] = useState(false);
const [formModal, setFormModal] = useState(false); const [formModal, setFormModal] = useState(false);
const [disabledAnimation, setDisabledAnimation] = useState(true); const [disabledAnimation, setDisabledAnimation] = useState(true);
const [modal2, setModal2] = useState({ const [modal2, setModal2] = useState({
@ -32,7 +34,6 @@ const LaancPlanContainer = () => {
title: '', title: '',
desc: '' desc: ''
}); });
const [centeredModal, setCenteredModal] = useState(false);
//날씨 임시 데이터 //날씨 임시 데이터
const [wheather, setWheather] = useState([ const [wheather, setWheather] = useState([
{ {
@ -123,32 +124,7 @@ const LaancPlanContainer = () => {
const currentDate = moment(); // 현재 날짜와 시간을 가져옵니다. const currentDate = moment(); // 현재 날짜와 시간을 가져옵니다.
if (!detailData.pilotList[0].memberName) { if (!schFltStDt.isAfter(currentDate) || !schFltEndDt.isAfter(currentDate)) {
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 (
!schFltStDt.isAfter(currentDate) ||
!schFltEndDt.isAfter(currentDate)
) {
setModal2({ setModal2({
isOpen: true, isOpen: true,
title: '필수값 입력 오류', title: '필수값 입력 오류',
@ -193,14 +169,6 @@ const LaancPlanContainer = () => {
desc: '비행방식를 입력해 주세요.' desc: '비행방식를 입력해 주세요.'
}); });
return false;
} else if (!detailData.arcrftList[0].groupNm) {
setModal2({
isOpen: true,
title: '필수값 입력 오류',
desc: '기체 신고 번호를 입력해 주세요.'
});
return false; return false;
} else if (!detailData.arcrftList[0].arcrftTypeCd) { } else if (!detailData.arcrftList[0].arcrftTypeCd) {
setModal2({ setModal2({
@ -210,11 +178,11 @@ const LaancPlanContainer = () => {
}); });
return false; return false;
} else if (!detailData.arcrftList[0].ownerNm) { } else if (!detailData.arcrftList[0].groupNm) {
setModal2({ setModal2({
isOpen: true, isOpen: true,
title: '필수값 입력 오류', title: '필수값 입력 오류',
desc: '소유자명(법인명)를 입력해 주세요.' desc: '기체 신고 번호를 입력해 주세요.'
}); });
return false; return false;
@ -245,11 +213,22 @@ const LaancPlanContainer = () => {
handlerWeather={handlerWeather} handlerWeather={handlerWeather}
setDisabledAnimation={setDisabledAnimation} setDisabledAnimation={setDisabledAnimation}
disabledAnimation={disabledAnimation} disabledAnimation={disabledAnimation}
centeredModal={centeredModal}
setCenteredModal={setCenteredModal}
/> />
</> </>
)} )}
{step === 2 && <Apply handlerStep={handlerStep} data={detailData} />} {step === 2 && (
<Apply
handlerStep={handlerStep}
data={detailData}
disabledAnimation={disabledAnimation}
setDisabledAnimation={setDisabledAnimation}
centeredModal={centeredModal}
setCenteredModal={setCenteredModal}
/>
)}
</Modal> </Modal>
<ErrorModal modal={modal2} setModal={setModal2} /> <ErrorModal modal={modal2} setModal={setModal2} />
</div> </div>

2
src/navigation/flightPlan/index.js
Unescape View File

@ -16,7 +16,7 @@ export default [
navLink: '/basis/flight/plan/index' navLink: '/basis/flight/plan/index'
}, },
{ {
id: 'flight_plan_001_01_01', id: 'laanc_001_01_01',
type: 'item', type: 'item',
title: 'LAANC 신청 목록', title: 'LAANC 신청 목록',
navLink: '/basis/laanc/index' navLink: '/basis/laanc/index'

348
src/views/laanc/Apply.js
Unescape View File

@ -7,19 +7,20 @@ import { useDispatch, useSelector } from 'react-redux';
import Flatpickr from 'react-flatpickr'; import Flatpickr from 'react-flatpickr';
import '@styles/react/libs/flatpickr/flatpickr.scss'; import '@styles/react/libs/flatpickr/flatpickr.scss';
import moment from 'moment'; import moment from 'moment';
import { AlertCircle } from 'react-feather';
import FlightArea from './FlightArea';
import { import {
Button,
InputGroup,
ButtonGroup,
InputGroupAddon,
Input,
Row, Row,
Col, Col,
Button,
Modal,
ModalHeader,
ModalBody,
ModalFooter,
Alert,
FormGroup, FormGroup,
Label, Label,
Card, Input
CardBody,
CustomInput
} from 'reactstrap'; } from 'reactstrap';
import { import {
initFlight, initFlight,
@ -33,8 +34,16 @@ import {
sensorClickAction sensorClickAction
} from '../../modules/control/map/actions/controlMapActions'; } from '../../modules/control/map/actions/controlMapActions';
const Apply = ({ data, handlerStep }) => { const Apply = ({
data,
handlerStep,
disabledAnimation,
setDisabledAnimation,
centeredModal,
setCenteredModal
}) => {
const [detailData, setDetailData] = useState(initFlightBas.initDetail); const [detailData, setDetailData] = useState(initFlightBas.initDetail);
const { user } = useSelector(state => state.authState);
const history = useHistory(); const history = useHistory();
// 변경감지 // 변경감지
@ -52,80 +61,73 @@ const Apply = ({ data, handlerStep }) => {
}; };
return ( return (
<div className=''> <>
<div className='layer-content'> <ModalHeader>
<div className='layer-ti'> LAANC 승인 요청
<h4 className='ti'>LAANC 승인 요청</h4> <Button
{/* <button className='btn-icon' outline color='primary'> */}
{/* <X size={20} /> */}
{/* </button> */}
<Button.Ripple
color='danger' color='danger'
className='badge badge-danger' onClick={() => setDisabledAnimation(!disabledAnimation)}
onClick={() => handlerLaanc()}
> >
취소 취소
</Button.Ripple> </Button>
</div> </ModalHeader>
</div> <ModalBody>
<Row> <div className='mb-1'>
<Col sm='12'> <div className='ti'>비행승인 사전결과 확인</div>
<Row> <div className='laanc-map-sm'>지도영역</div>
<Col> <div className='mt-1'>
<div className='search-cont search-info pd-0'> <Alert color='danger'>
<div className='cont-ti mb-1 d-flex justify-content-between align-items-sm-center align-items-start flex-sm-row'> <div className='alert-body'>
<div className='final'></div> <AlertCircle size={15} />{' '}
<span className='ms-1'>사전 결과 미 승인 대상입니다.</span>
</div> </div>
<dl> </Alert>
<dt>
<div className='layer-ti'>
<h4>유효성 검사 정보</h4>
</div> </div>
<CustomInput <div className='vertically-centered-modal'>
inline <FlightArea
type='checkbox' centeredModal={centeredModal}
id='pilotYn' setCenteredModal={setCenteredModal}
label='조종사자격정보유무'
name='pilotYn'
value='A'
// checked={true}
// checked={checkState.all}
// onChange={handleChangeCheckbox}
/> />
<CustomInput
inline
type='checkbox'
id='DronYn'
label='기체보험가입여부'
name='DronYn'
value='B'
// checked={true}
// checked={checkState.all}
// onChange={handleChangeCheckbox}
/>
</dt>
<div className='search-info-ti d-flex justify-content-between'>
<h4 className='ti'>LAANC 승인 사전 결과 확인</h4>
</div> </div>
<CustomInput </div>
inline <div>
type='checkbox' <Row>
id='exampleCustomCheckbox' <Col className='list-input' md='6' sm='12'>
label='승인 처리를 위해 다음 스텝을 진행해주세요.' <FormGroup>
name='aprvlYn' <div className='ti'>조종사 정보</div>
value='C' <Label for='test'>
// checked={true} <span className='necessary'>*</span>성명
// checked={checkState.all} </Label>
// onChange={handleChangeCheckbox} <Input
type='text'
id='memberName'
name='memberName'
size='sm'
placeholder=''
value={user.memberName}
disabled
/> />
<div className='search-info-box'> </FormGroup>
</Col>
<Col className='list-input' md='6' sm='12'>
<FormGroup>
<div className='ti'>승인 유형</div>
<Label for='test'>
<span className='necessary'>*</span>종류
</Label>
<Input type='select' name='select' size='sm' id='test' disabled>
<option>상업</option>
<option>비상업</option>
</Input>
</FormGroup>
</Col>
<Col className='list-input' md='12'>
<div className='ti'>비행 계획 정보</div>
<Row> <Row>
<Col className='list-input' lg={4} md={4} sm={12}> <Col className='list-input' md='6'>
<FormGroup> <FormGroup>
<Label for='test'> <Label for='test'>
<span className='necessary'>*</span> <span className='necessary'>*</span>비행 시작 일자
비행시작일자
</Label> </Label>
<Flatpickr <Flatpickr
className='form-control form-control-sm' className='form-control form-control-sm'
@ -133,12 +135,14 @@ const Apply = ({ data, handlerStep }) => {
id='schFltStDt' id='schFltStDt'
name='schFltStDt' name='schFltStDt'
data-enable-time data-enable-time
// defaultValue={data.schFltStDt} defaultValue={data.schFltStDt}
value={data.schFltStDt} value={data.schFltStDt}
options={{
minDate: moment().format('YYYY-MM-DD')
}}
onChange={date => { onChange={date => {
const value = const value =
moment(date[0]).format('YYYY-MM-DD HH:mm:ss') || moment(date[0]).format('YYYY-MM-DD HH:mm:ss') || '';
'';
handleChange({ handleChange({
name: 'schFltStDt', name: 'schFltStDt',
value value
@ -149,11 +153,10 @@ const Apply = ({ data, handlerStep }) => {
/> />
</FormGroup> </FormGroup>
</Col> </Col>
<Col className='list-input' lg={4} md={4} sm={12}> <Col className='list-input' md='6'>
<FormGroup> <FormGroup>
<Label for='test'> <Label for='test'>
<span className='necessary'>*</span> <span className='necessary'>*</span>비행 종료 일자
비행종료일자
</Label> </Label>
<Flatpickr <Flatpickr
className='form-control form-control-sm' className='form-control form-control-sm'
@ -161,185 +164,78 @@ const Apply = ({ data, handlerStep }) => {
id='schFltEndDt' id='schFltEndDt'
name='schFltEndDt' name='schFltEndDt'
data-enable-time data-enable-time
// defaultValue={data.schFltEndDt} defaultValue={data.schFltEndDt}
value={data.schFltEndDt} value={data.schFltEndDt}
options={{
minDate: moment().format('YYYY-MM-DD')
}}
onChange={date => { onChange={date => {
const value = const value =
moment(date[0]).format('YYYY-MM-DD HH:mm:ss') || moment(date[0]).format('YYYY-MM-DD HH:mm:ss') || '';
'';
handleChange({ handleChange({
name: 'schFltEndDt', name: 'schFltEndDt',
value value
}); });
}} }}
disabled
placeholder='비행 종료일자 선택(클릭)' placeholder='비행 종료일자 선택(클릭)'
disabled
// {...{options:{minDate: "today"}}} // {...{options:{minDate: "today"}}}
/> />
</FormGroup> </FormGroup>
</Col> </Col>
<Col className='list-input' lg={4} md={4} sm={12}>
<FormGroup>
<Label for='test'>
<span className='necessary'>*</span>비행 목적
</Label>
<Input
type='select'
id='fltPurpose'
name='fltPurpose'
value={data.fltPurpose}
bsSize='sm'
onChange={e => {
const { name, value } = e.target;
handleChange({
type: 'plan',
name,
value
});
}}
disabled
// innerRef={props.data}
// className={classnames({
// 'is-invalid': props.errors.arcrftTypeCd
// })}
>
{/* TODO CDNOT 코드연동 필요 */}
<option value=''>= 선택 =</option>
<option value='시험비행'>= 시험비행 =</option>
<option value='교육비행'>= 교육비행 =</option>
<option value='사진/영상촬영'>
= 사진/영상촬영 =
</option>
<option value='비행훈련'>= 비행훈련 =</option>
<option value='비행교육'>= 비행교육 =</option>
<option value='비행실기시험'>
= 비행실기시험 =
</option>
</Input>
</FormGroup>
</Col>
</Row> </Row>
</div> </Col>
<div className='search-info-box'>
<Col className='list-input' md='12'>
<div className='ti'>기체 정보</div>
<Row> <Row>
<Col className='list-input' lg={4} md={4} sm={12}> <Col className='list-input' md='12'>
<FormGroup> <FormGroup>
<Label for='test'> <Label for='test'>
<span className='necessary'>*</span>고도 <span className='necessary'>*</span>기체 중량
</Label> </Label>
<Input <Input
type='text' type='text'
id='fltElev' id='test'
name='fltElev' size='sm'
// defaultValue={data.email || ''} placeholder=''
value={data.areaList[0].fltElev}
bsSize='sm'
onChange={e => {
const { name, value } = e.target;
handleChange({
type: 'area',
name,
value
});
}}
// innerRef={data}
placeholder='100m'
disabled disabled
/> />
</FormGroup> </FormGroup>
</Col> </Col>
<Col className='list-input' lg={4} md={4} sm={12}> </Row>
<FormGroup>
<Label for='test'>
<span className='necessary'>*</span>반경
</Label>
<Input
type='text'
id='bufferZone'
name='bufferZone'
// defaultValue={data.email || ''}
value={data.areaList[0].bufferZone}
bsSize='sm'
onChange={e => {
const { name, value } = e.target;
handleChange({
type: 'area',
name,
value
});
}}
// innerRef={data}
placeholder='100m'
disabled
/>
</FormGroup>
</Col> </Col>
<Col className='list-input' lg={4} md={4} sm={12}>
<FormGroup> <Col className='list-input' md='12'>
<Label for='test'> <div className='ti'>미 승인 사유</div>
<span className='necessary'>*</span>비행방식 <div className='cancel-box'>내용</div>
</Label>
<Input
type='text'
id='fltMethod'
name='fltMethod'
// defaultValue={data.email || ''}
value={data.areaList[0].fltMethod}
bsSize='sm'
onChange={e => {
const { name, value } = e.target;
handleChange({
type: 'area',
name,
value
});
}}
// innerRef={data}
placeholder=''
disabled
/>
</FormGroup>
</Col> </Col>
</Row> </Row>
</div> </div>
<div className='search-info-ti d-flex justify-content-between'> </ModalBody>
<h4 className='ti'>조종사 준수사항 처벌 동의 약관</h4> <ModalFooter>
</div> <Button outline color='danger' onClick={() => handlerStep(1)}>
<CustomInput
inline
type='checkbox'
id='aprvlYn'
label='조종자 준수사항 미 준수 시 처벌에 동의합니다.'
name='aprvlYn'
value='D'
// checked={true}
// checked={checkState.all}
// onChange={handleChangeCheckbox}
/>
<div className='d-flex align-items-center'>
<Button.Ripple
color='danger'
bsSize='sm'
onClick={() => handleClick(1)}
>
이전 이전
</Button.Ripple> </Button>
<Button.Ripple <ul className='step'>
className='mr-1' <li>
color='primary' <span className='on'></span>
beSize='sm' </li>
//onClick={() => handleClick(3)} <li>
<span className='on'></span>
</li>
<li>
<span></span>
</li>
</ul>
<Button
outline
onClick={() => setDisabledAnimation(!disabledAnimation)}
> >
다음 다음
</Button.Ripple> </Button>
</div> </ModalFooter>
</dl> </>
</div>
</Col>
</Row>
</Col>
</Row>
</div>
); );
}; };
export default Apply; export default Apply;

46
src/views/laanc/FlightPlan.js
Unescape View File

@ -40,16 +40,18 @@ const FlightPlan = ({
data, data,
handlerWeather, handlerWeather,
disabledAnimation, disabledAnimation,
setDisabledAnimation setDisabledAnimation,
centeredModal,
setCenteredModal
}) => { }) => {
const user = useSelector(state => state.authState); const { user } = useSelector(state => state.authState);
const [centeredModal, setCenteredModal] = useState(false);
const history = useHistory(); const history = useHistory();
const handlerLaanc = () => { const handlerLaanc = () => {
history.replace('/control'); history.replace('/control');
}; };
console.log('>>', user);
return ( return (
<> <>
@ -77,15 +79,7 @@ const FlightPlan = ({
name='memberName' name='memberName'
size='sm' size='sm'
placeholder='' placeholder=''
value={data.pilotList[0].memberName || ''} value={user.memberName}
onChange={e => {
const { name, value } = e.target;
handleChange({
type: 'pilot',
name,
value
});
}}
disabled disabled
/> />
</FormGroup> </FormGroup>
@ -97,17 +91,16 @@ const FlightPlan = ({
<span className='necessary'>*</span>종류 <span className='necessary'>*</span>종류
</Label> </Label>
<Input type='select' name='select' size='sm' id='test'> <Input type='select' name='select' size='sm' id='test'>
<option>무인 비행기</option> <option value=''>= 선택 =</option>
<option>무인 헬리콥터</option> <option>상업</option>
<option>무인 멀티콥터</option> <option>비상업</option>
<option>무인 비행선</option>
</Input> </Input>
</FormGroup> </FormGroup>
</Col> </Col>
<Col className='list-input' md='12'> <Col className='list-input' md='12'>
<div className='ti'>비행 계획 정보</div> <div className='ti'>비행 계획 정보</div>
<Row> <Row>
<Col className='list-input' md='4'> <Col className='list-input' md='6'>
<FormGroup> <FormGroup>
<Label for='test'> <Label for='test'>
<span className='necessary'>*</span>비행 시작 일자 <span className='necessary'>*</span>비행 시작 일자
@ -135,7 +128,7 @@ const FlightPlan = ({
/> />
</FormGroup> </FormGroup>
</Col> </Col>
<Col className='list-input' md='4'> <Col className='list-input' md='6'>
<FormGroup> <FormGroup>
<Label for='test'> <Label for='test'>
<span className='necessary'>*</span>비행 종료 일자 <span className='necessary'>*</span>비행 종료 일자
@ -164,7 +157,7 @@ const FlightPlan = ({
/> />
</FormGroup> </FormGroup>
</Col> </Col>
<Col className='list-input' md='4'> <Col className='list-input' md='12'>
<FormGroup> <FormGroup>
<Label for='test'> <Label for='test'>
<span className='necessary'>*</span>비행 목적 <span className='necessary'>*</span>비행 목적
@ -324,12 +317,11 @@ const FlightPlan = ({
<span className='necessary'>*</span>기체 종류 <span className='necessary'>*</span>기체 종류
</Label> </Label>
<Input <Input
type='text' type='select'
id='arcrftTypeCd' id='arcrftTypeCd'
name='arcrftTypeCd' name='arcrftTypeCd'
// defaultValue={data.email || ''}
value={data.arcrftList[0].arcrftTypeCd} value={data.arcrftList[0].arcrftTypeCd}
bsSize='sm' size='sm'
onChange={e => { onChange={e => {
const { name, value } = e.target; const { name, value } = e.target;
handleChange({ handleChange({
@ -338,9 +330,13 @@ const FlightPlan = ({
value value
}); });
}} }}
// innerRef={data} >
placeholder='100m' <option value=''>= 선택 =</option>
/> <option>무인 비행기</option>
<option>무인 헬리콥터</option>
<option>무인 멀티콥터</option>
<option>무인 비행선</option>
</Input>
</FormGroup> </FormGroup>
</Col> </Col>
<Col className='list-input' md='4'> <Col className='list-input' md='4'>

Write Preview
Loading…
Cancel
Save