vertiport 페이지 생성

src/@core/layouts/components/menu/vertical-menu/index.js

@@ -12,6 +12,7 @@ import analysis from '@src/navigation/analysis';
 import laanc from '@src/navigation/laanc';
 import cstmrService from '@src/navigation/cstmrService';
 import statistics from '@src/navigation/statistics';
+import vertiport from '@src/navigation/vertiport';
 
 // ** Third Party Components
 import classnames from 'classnames';
@@ -49,6 +50,8 @@ const Sidebar = props => {
         return statistics;
       case 'cstmrService':
         return cstmrService;
+      case 'vertiport':
+        return vertiport;
     }
   };
 

src/@core/layouts/components/navbar/NavbarUser.js

@@ -123,6 +123,14 @@ const NavbarUser = props => {
             고객 서비스
           </NavLink>
         </NavItem>
+        <NavItem>
+          <NavLink
+            onClick={e => handlerTopMenu('vertiport')}
+            active={topMenuCd === 'vertiport'}
+          >
+            vertiport
+          </NavLink>
+        </NavItem>
         <NavItem>
           <NavLink
             onClick={() =>
@@ -148,7 +156,7 @@ const NavbarUser = props => {
           </NavLink>
         </NavItem>
       </Nav>
-       <div className='bookmark-wrapper d-flex align-items-center'>
+      <div className='bookmark-wrapper d-flex align-items-center'>
         <NavItem className='d-none d-lg-block'>
           <NavLink className='nav-link-style'>
             <ThemeToggler />

src/components/dashboard/DroneFlightSchedule.js

@@ -140,8 +140,10 @@ export default function DroneFlightSchedule({
                     }}
                   >
                     <option value='all'>그룹선택</option>
-                    {competentAgency?.map(i => (
+                    {competentAgency?.map((i, idx) => (
-                      <option value={i.value}>{i.text}</option>
+                      <option key={idx} value={i.value}>
+                        {i.text}
+                      </option>
                     ))}
                   </Input>
                 )}

src/navigation/vertiport/index.js

@@ -0,0 +1,13 @@
+export default [
+  {
+    id: 'vertiport_001',
+    title: 'vertiport',
+    navLink: '#'
+  },
+  {
+    id: 'vertiport_001_01',
+    type: 'item',
+    title: '버티 포트',
+    navLink: '/vertiport/index'
+  }
+];

src/router/routes/RouteVertiport.js

@@ -0,0 +1,10 @@
+import { lazy } from 'react';
+
+const RouteVertiport = [
+  {
+    path: '/vertiport/index',
+    component: lazy(() => import('../../views/vertiport/VertiportView'))
+  }
+];
+
+export default RouteVertiport;

src/router/routes/index.js

@@ -8,6 +8,7 @@ import RouteWeather from './RouteWeather';
 import RouteLaance from './RouteLaance';
 import RouterCstmrService from './RouterCstmrService';
 import RouteStatistics from './RouteStatistics';
+import RouteVertiport from './RouteVertiport';
 // ** Document title
 const TemplateTitle = '%s - Dron Control System';
 
@@ -25,6 +26,7 @@ const Routes = [
   ...RouteLaance,
   ...RouterCstmrService,
   ...RouteStatistics,
+  ...RouteVertiport,
   {
     path: '/home',
     component: lazy(() => import('../../views/Home'))

src/views/control/main/ControlMain.js

@@ -113,7 +113,6 @@ const ControlMain = () => {
 
   // 화면 왼쪽 사이드 메뉴 오픈 시 다른 메뉴 닫기
   const openMenu = val => {
-    console.log(val, '--');
     if (val === 'reportList') {
       setOpenReportList(true);
       setOpenAlarmList(false);

src/views/vertiport/VertiportView.js

@@ -0,0 +1,37 @@
+import '@styles/react/libs/flatpickr/flatpickr.scss';
+import '@styles/react/libs/tables/react-dataTable-component.scss';
+import '../../assets/css/custom.css';
+
+import { useState } from 'react';
+import { Map } from 'react-feather';
+
+export default function VertiportView() {
+  // 오른쪽 사이드 메뉴 표출 여부
+  const [openSetting, setOpenSetting] = useState(true);
+
+  return (
+    <>
+      {openSetting ? (
+        <div className='right-menu active'>
+          <button
+            className='right-layer-btn'
+            onClick={() => setOpenSetting(false)}
+          >
+            <Map size={18} />
+          </button>
+          <div className='right-layer active'>{/* 오른쪽 레이어 영역 */}</div>
+        </div>
+      ) : (
+        <div className='right-menu'>
+          <button
+            className='right-layer-btn'
+            onClick={() => setOpenSetting(true)}
+          >
+            <Map size={18} />
+          </button>
+          <div className='right-layer'></div>
+        </div>
+      )}
+    </>
+  );
+}