sanguu516(박상현)
1 year ago
2 changed files with 354 additions and 12 deletions
@ -0,0 +1,330 @@ |
|||||||
|
import React, { useEffect, useState } from 'react'; |
||||||
|
import { Search } from 'react-feather'; |
||||||
|
import { BiBuildings, BiGridAlt } from 'react-icons/bi'; |
||||||
|
import { CgTrees } from 'react-icons/cg'; |
||||||
|
import { VscRadioTower } from 'react-icons/vsc'; |
||||||
|
import { useDispatch, useSelector } from 'react-redux'; |
||||||
|
import Flatpickr from 'react-flatpickr'; |
||||||
|
import '@styles/react/libs/flatpickr/flatpickr.scss'; |
||||||
|
import moment from 'moment'; |
||||||
|
import { |
||||||
|
Button, |
||||||
|
InputGroup, |
||||||
|
ButtonGroup, |
||||||
|
InputGroupAddon, |
||||||
|
Input, |
||||||
|
Row, |
||||||
|
Col, |
||||||
|
FormGroup, |
||||||
|
Label, |
||||||
|
Card, |
||||||
|
CardBody, |
||||||
|
CustomInput |
||||||
|
} from 'reactstrap'; |
||||||
|
import { |
||||||
|
initFlight, |
||||||
|
initFlightBas |
||||||
|
} from '../../../../modules/basis/flight/models/basisFlightModel'; |
||||||
|
import { |
||||||
|
areaClickAction, |
||||||
|
environmentClickAction, |
||||||
|
mapTypeChangeAction, |
||||||
|
sensorClickAction |
||||||
|
} from '../../../../modules/control/map/actions/controlMapActions'; |
||||||
|
|
||||||
|
const Apply = props => { |
||||||
|
const [detailData, setDetailData] = useState(initFlightBas.initDetail); |
||||||
|
// 변경감지
|
||||||
|
const handleChange = ({ name, value, type, index, pIndex }) => { |
||||||
|
setDetailData(prevState => ({ |
||||||
|
...prevState, |
||||||
|
[name]: value |
||||||
|
})); |
||||||
|
}; |
||||||
|
|
||||||
|
return ( |
||||||
|
<div className=''> |
||||||
|
<div className='layer-content'> |
||||||
|
<div className='layer-ti'> |
||||||
|
<h4 className='ti'>LAANC 승인 요청</h4> |
||||||
|
{/* <button className='btn-icon' outline color='primary'> */} |
||||||
|
{/* <X size={20} /> */} |
||||||
|
{/* </button> */} |
||||||
|
<Button.Ripple |
||||||
|
color='danger' |
||||||
|
className='badge badge-danger' |
||||||
|
onClick={() => props.handlerLaanc()} |
||||||
|
> |
||||||
|
취소 |
||||||
|
</Button.Ripple> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<Row> |
||||||
|
<Col sm='12'> |
||||||
|
<Row> |
||||||
|
<Col> |
||||||
|
<div className='search-cont search-info pd-0'> |
||||||
|
<div className='cont-ti mb-1 d-flex justify-content-between align-items-sm-center align-items-start flex-sm-row'> |
||||||
|
<div className='final'></div> |
||||||
|
</div> |
||||||
|
<dl> |
||||||
|
<dt> |
||||||
|
<div className='layer-ti'> |
||||||
|
<h4>유효성 검사 정보</h4> |
||||||
|
</div> |
||||||
|
<CustomInput |
||||||
|
inline |
||||||
|
type='checkbox' |
||||||
|
id='pilotYn' |
||||||
|
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> |
||||||
|
<CustomInput |
||||||
|
inline |
||||||
|
type='checkbox' |
||||||
|
id='exampleCustomCheckbox' |
||||||
|
label='승인 처리를 위해 다음 스텝을 진행해주세요.' |
||||||
|
name='aprvlYn' |
||||||
|
value='C' |
||||||
|
// checked={true}
|
||||||
|
// checked={checkState.all}
|
||||||
|
// onChange={handleChangeCheckbox}
|
||||||
|
/> |
||||||
|
<div className='search-info-box'> |
||||||
|
<Row> |
||||||
|
<Col className='list-input' lg={4} md={4} sm={12}> |
||||||
|
<FormGroup> |
||||||
|
<Label for='test'> |
||||||
|
<span className='necessary'>*</span> |
||||||
|
비행시작일자 |
||||||
|
</Label> |
||||||
|
<Flatpickr |
||||||
|
className='form-control form-control-sm' |
||||||
|
type='text' |
||||||
|
id='schFltStDt' |
||||||
|
name='schFltStDt' |
||||||
|
data-enable-time |
||||||
|
// defaultValue={data.schFltStDt}
|
||||||
|
// value={data.schFltStDt}
|
||||||
|
onChange={date => { |
||||||
|
const value = |
||||||
|
moment(date[0]).format('YYYY-MM-DD HH:mm:ss') || |
||||||
|
''; |
||||||
|
handleChange({ |
||||||
|
name: 'schFltStDt', |
||||||
|
value |
||||||
|
}); |
||||||
|
}} |
||||||
|
placeholder='비행 시작일자 선택(클릭)' |
||||||
|
/> |
||||||
|
</FormGroup> |
||||||
|
</Col> |
||||||
|
<Col className='list-input' lg={4} md={4} sm={12}> |
||||||
|
<FormGroup> |
||||||
|
<Label for='test'> |
||||||
|
<span className='necessary'>*</span> |
||||||
|
비행종료일자 |
||||||
|
</Label> |
||||||
|
<Flatpickr |
||||||
|
className='form-control form-control-sm' |
||||||
|
type='text' |
||||||
|
id='schFltEndDt' |
||||||
|
name='schFltEndDt' |
||||||
|
data-enable-time |
||||||
|
// defaultValue={data.schFltEndDt}
|
||||||
|
// value={data.schFltEndDt}
|
||||||
|
onChange={date => { |
||||||
|
const value = |
||||||
|
moment(date[0]).format('YYYY-MM-DD HH:mm:ss') || |
||||||
|
''; |
||||||
|
handleChange({ |
||||||
|
name: 'schFltEndDt', |
||||||
|
value |
||||||
|
}); |
||||||
|
}} |
||||||
|
placeholder='비행 종료일자 선택(클릭)' |
||||||
|
// {...{options:{minDate: "today"}}}
|
||||||
|
/> |
||||||
|
</FormGroup> |
||||||
|
</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 |
||||||
|
}); |
||||||
|
}} |
||||||
|
// 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> |
||||||
|
</div> |
||||||
|
<div className='search-info-box'> |
||||||
|
<Row> |
||||||
|
<Col className='list-input' lg={4} md={4} sm={12}> |
||||||
|
<FormGroup> |
||||||
|
<Label for='test'> |
||||||
|
<span className='necessary'>*</span>고도 |
||||||
|
</Label> |
||||||
|
<Input |
||||||
|
type='text' |
||||||
|
id='email' |
||||||
|
name='email' |
||||||
|
// defaultValue={data.email || ''}
|
||||||
|
// value={data.email}
|
||||||
|
bsSize='sm' |
||||||
|
onChange={e => { |
||||||
|
const { name, value } = e.target; |
||||||
|
handleChange({ |
||||||
|
type: 'plan', |
||||||
|
name, |
||||||
|
value |
||||||
|
}); |
||||||
|
}} |
||||||
|
// innerRef={props.data}
|
||||||
|
placeholder='100m' |
||||||
|
/> |
||||||
|
</FormGroup> |
||||||
|
</Col> |
||||||
|
<Col className='list-input' lg={4} md={4} sm={12}> |
||||||
|
<FormGroup> |
||||||
|
<Label for='test'> |
||||||
|
<span className='necessary'>*</span>반경 |
||||||
|
</Label> |
||||||
|
<Input |
||||||
|
type='text' |
||||||
|
id='email' |
||||||
|
name='email' |
||||||
|
// defaultValue={data.email || ''}
|
||||||
|
// value={data.email}
|
||||||
|
bsSize='sm' |
||||||
|
onChange={e => { |
||||||
|
const { name, value } = e.target; |
||||||
|
handleChange({ |
||||||
|
type: 'plan', |
||||||
|
name, |
||||||
|
value |
||||||
|
}); |
||||||
|
}} |
||||||
|
// innerRef={props.data}
|
||||||
|
placeholder='100m' |
||||||
|
/> |
||||||
|
</FormGroup> |
||||||
|
</Col> |
||||||
|
<Col className='list-input' lg={4} md={4} sm={12}> |
||||||
|
<FormGroup> |
||||||
|
<Label for='test'> |
||||||
|
<span className='necessary'>*</span>비행방식 |
||||||
|
</Label> |
||||||
|
<Input |
||||||
|
type='text' |
||||||
|
id='email' |
||||||
|
name='email' |
||||||
|
// defaultValue={data.email || ''}
|
||||||
|
// value={data.email}
|
||||||
|
bsSize='sm' |
||||||
|
onChange={e => { |
||||||
|
const { name, value } = e.target; |
||||||
|
handleChange({ |
||||||
|
type: 'plan', |
||||||
|
name, |
||||||
|
value |
||||||
|
}); |
||||||
|
}} |
||||||
|
// innerRef={props.data}
|
||||||
|
placeholder='' |
||||||
|
/> |
||||||
|
</FormGroup> |
||||||
|
</Col> |
||||||
|
</Row> |
||||||
|
</div> |
||||||
|
<div className='search-info-ti d-flex justify-content-between'> |
||||||
|
<h4 className='ti'>조종사 준수사항 처벌 동의 약관</h4> |
||||||
|
</div> |
||||||
|
<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={props.handlerStep(1)}
|
||||||
|
> |
||||||
|
이전 |
||||||
|
</Button.Ripple> |
||||||
|
<Button.Ripple |
||||||
|
className='mr-1' |
||||||
|
color='primary' |
||||||
|
beSize='sm' |
||||||
|
// onClick={props.handlerStep(3)}
|
||||||
|
> |
||||||
|
다음 |
||||||
|
</Button.Ripple> |
||||||
|
</div> |
||||||
|
</dl> |
||||||
|
</div> |
||||||
|
</Col> |
||||||
|
</Row> |
||||||
|
</Col> |
||||||
|
</Row> |
||||||
|
</div> |
||||||
|
); |
||||||
|
}; |
||||||
|
export default Apply; |
||||||
Loading…
Reference in new issue