diff --git a/src/components/vertiport/VertiportLeftMenu.js b/src/components/vertiport/VertiportLeftMenu.js
new file mode 100644
index 0000000..9833ce8
--- /dev/null
+++ b/src/components/vertiport/VertiportLeftMenu.js
@@ -0,0 +1,264 @@
+import moment from 'moment';
+import { useState, useEffect } from 'react';
+import { X } from 'react-feather';
+import { useDispatch, useSelector } from 'react-redux';
+import drone_img from '../../assets/images/drone.jpg';
+import uam_img from '../../assets/images/uam_img.jpg';
+import drone_yellow from '../../assets/images/drone_yellow.png';
+import { GET_ARCTFT_TYPE_CD, GET_WGHT_TYPE_CD } from '../../utility/CondeUtil';
+import { controlGpLogAction } from '../../modules/control/gp';
+import ControlAlarmDetail from '../../views/control/alarm/ControlAlarmDetail';
+import {
+ Navigation2,
+ Compass,
+ Sun,
+ Cloud,
+ CloudRain,
+ CloudSnow
+} from 'react-feather';
+import { Table } from 'reactstrap';
+
+export const VertiportLeftMenu = ({ setOpenReportList }) => {
+ const dispatch = useDispatch();
+
+ // 비정상상황 모달
+ const [historyModal, setHistoryModal] = useState(false);
+
+ // 기체 상세정보
+ const { controlGpDetail, controlDetail } = useSelector(
+ state => state.controlGpDtlState
+ );
+
+ // 비정상상황 히스토리 내역
+ const { controlGpWarnLog } = useSelector(state => state.controlGpLogState);
+
+ // 해당 드론의 비정상상황 알림내역 불러옴
+ useEffect(() => {
+ if (historyModal) {
+ if (controlGpDetail) {
+ dispatch(controlGpLogAction.request({ id: controlGpDetail.controlId }));
+ }
+ }
+ }, [historyModal]);
+
+ // 날씨 아이콘 표출
+ const weathericon = () => {
+ if (controlDetail) {
+ let wheatherDetail = controlDetail.items.item;
+ let skyDetail = wheatherDetail[6].fcstValue;
+ if (skyDetail == 1 || skyDetail == 2 || skyDetail == 4) {
+ return
시각 | +날씨 | +기온 | +풍향 | +풍속 | +
---|---|---|---|---|
+ {controlDetail?.items.item[0].baseTime.substring( + 0, + 2 + )} + 시 + | +{weathericon()} | +{controlDetail?.items.item[12].fcstValue}℃ | +
+ |
+ {controlDetail?.items.item[4].fcstValue} m/s | +