|
|
@ -21,25 +21,12 @@ import { Table } from 'reactstrap'; |
|
|
|
export const VertiportLeftMenu = ({ setOpenReportList }) => { |
|
|
|
export const VertiportLeftMenu = ({ setOpenReportList }) => { |
|
|
|
const dispatch = useDispatch(); |
|
|
|
const dispatch = useDispatch(); |
|
|
|
|
|
|
|
|
|
|
|
// 비정상상황 모달
|
|
|
|
|
|
|
|
const [historyModal, setHistoryModal] = useState(false); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 기체 상세정보
|
|
|
|
// 기체 상세정보
|
|
|
|
const { controlGpDetail, controlDetail } = useSelector( |
|
|
|
const { controlGpDetail, controlDetail } = useSelector( |
|
|
|
state => state.controlGpDtlState |
|
|
|
state => state.controlGpDtlState |
|
|
|
); |
|
|
|
); |
|
|
|
|
|
|
|
|
|
|
|
// 비정상상황 히스토리 내역
|
|
|
|
|
|
|
|
const { controlGpWarnLog } = useSelector(state => state.controlGpLogState); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 해당 드론의 비정상상황 알림내역 불러옴
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
|
|
|
if (historyModal) { |
|
|
|
|
|
|
|
if (controlGpDetail) { |
|
|
|
|
|
|
|
dispatch(controlGpLogAction.request({ id: controlGpDetail.controlId })); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}, [historyModal]); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 날씨 아이콘 표출
|
|
|
|
// 날씨 아이콘 표출
|
|
|
|
const weathericon = () => { |
|
|
|
const weathericon = () => { |
|
|
@ -81,16 +68,6 @@ export const VertiportLeftMenu = ({ setOpenReportList }) => { |
|
|
|
</button> |
|
|
|
</button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<div className='layer-content-box mb-1'> |
|
|
|
|
|
|
|
<button |
|
|
|
|
|
|
|
type='button' |
|
|
|
|
|
|
|
className='history-btn' |
|
|
|
|
|
|
|
onClick={() => setHistoryModal(!historyModal)} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
비정상상황 알림내역 |
|
|
|
|
|
|
|
</button> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div className='layer-content-box'> |
|
|
|
<div className='layer-content-box'> |
|
|
|
<div className='drone-ti'> |
|
|
|
<div className='drone-ti'> |
|
|
|
<img src={drone_yellow} width='40' /> |
|
|
|
<img src={drone_yellow} width='40' /> |
|
|
@ -202,61 +179,7 @@ export const VertiportLeftMenu = ({ setOpenReportList }) => { |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div className='layer-content'> |
|
|
|
|
|
|
|
<div className='layer-ti'> |
|
|
|
|
|
|
|
<h4>날씨 정보</h4> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div className='layer-content-box'> |
|
|
|
|
|
|
|
<div className='layer-content-info'> |
|
|
|
|
|
|
|
<div className='layer-weather-table'> |
|
|
|
|
|
|
|
<div className='layer-weather-address'> |
|
|
|
|
|
|
|
현재위치의 날씨 정보입니다. |
|
|
|
|
|
|
|
<span className='mt-0'> |
|
|
|
|
|
|
|
<Compass size={20} /> |
|
|
|
|
|
|
|
{controlDetail?.stAreaNm} |
|
|
|
|
|
|
|
</span> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<Table responsive> |
|
|
|
|
|
|
|
<thead> |
|
|
|
|
|
|
|
<tr> |
|
|
|
|
|
|
|
<th>시각</th> |
|
|
|
|
|
|
|
<th>날씨</th> |
|
|
|
|
|
|
|
<th>기온</th> |
|
|
|
|
|
|
|
<th>풍향</th> |
|
|
|
|
|
|
|
<th>풍속</th> |
|
|
|
|
|
|
|
</tr> |
|
|
|
|
|
|
|
</thead> |
|
|
|
|
|
|
|
<tbody> |
|
|
|
|
|
|
|
<tr> |
|
|
|
|
|
|
|
<td> |
|
|
|
|
|
|
|
{controlDetail?.items.item[0].baseTime.substring( |
|
|
|
|
|
|
|
0, |
|
|
|
|
|
|
|
2 |
|
|
|
|
|
|
|
)} |
|
|
|
|
|
|
|
시 |
|
|
|
|
|
|
|
</td> |
|
|
|
|
|
|
|
<td>{weathericon()}</td> |
|
|
|
|
|
|
|
<td>{controlDetail?.items.item[12].fcstValue}℃</td> |
|
|
|
|
|
|
|
<td> |
|
|
|
|
|
|
|
<Navigation2 |
|
|
|
|
|
|
|
style={{ |
|
|
|
|
|
|
|
transform: `rotate(${controlDetail?.items.item[3].fcstValue}deg)` |
|
|
|
|
|
|
|
}} |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
</td> |
|
|
|
|
|
|
|
<td>{controlDetail?.items.item[4].fcstValue} m/s</td> |
|
|
|
|
|
|
|
</tr> |
|
|
|
|
|
|
|
</tbody> |
|
|
|
|
|
|
|
</Table> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<ControlAlarmDetail |
|
|
|
|
|
|
|
historyModal={historyModal} |
|
|
|
|
|
|
|
setHistoryModal={setHistoryModal} |
|
|
|
|
|
|
|
controlGpWarnLog={controlGpWarnLog} |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|