|
|
|
@ -1,33 +1,40 @@
|
|
|
|
|
import { Map } from 'react-feather'; |
|
|
|
|
import { PiAirTrafficControlBold } from "react-icons/pi"; |
|
|
|
|
import { PiAirTrafficControlBold } from 'react-icons/pi'; |
|
|
|
|
import { useState } from 'react'; |
|
|
|
|
import { TabContent, TabPane, Nav, NavItem, NavLink, ButtonGroup, Button } from 'reactstrap' |
|
|
|
|
import { |
|
|
|
|
TabContent, |
|
|
|
|
TabPane, |
|
|
|
|
Nav, |
|
|
|
|
NavItem, |
|
|
|
|
NavLink, |
|
|
|
|
ButtonGroup, |
|
|
|
|
Button |
|
|
|
|
} from 'reactstrap'; |
|
|
|
|
|
|
|
|
|
export const VertiportRightMenu = ({ setOpenSetting, openSetting }) => { |
|
|
|
|
const [active, setActive] = useState('1') |
|
|
|
|
const [active, setActive] = useState('1'); |
|
|
|
|
|
|
|
|
|
const toggle = tab => { |
|
|
|
|
if (active !== tab) { |
|
|
|
|
setActive(tab) |
|
|
|
|
} |
|
|
|
|
setActive(tab); |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
return ( |
|
|
|
|
<> |
|
|
|
|
{openSetting ? ( |
|
|
|
|
<div className='right-menu active'> |
|
|
|
|
<div className={`right-menu ${openSetting ? 'active' : ''}`}> |
|
|
|
|
<button |
|
|
|
|
className='right-layer-btn' |
|
|
|
|
onClick={() => setOpenSetting(false)} |
|
|
|
|
onClick={() => setOpenSetting(!openSetting)} |
|
|
|
|
> |
|
|
|
|
<PiAirTrafficControlBold size={22} /> |
|
|
|
|
</button> |
|
|
|
|
<div className='right-layer active bg-line'> |
|
|
|
|
<div className={`right-layer bg-line ${openSetting ? 'active' : ''}`}> |
|
|
|
|
<div className='tab-btn'> |
|
|
|
|
<ButtonGroup> |
|
|
|
|
<Button |
|
|
|
|
active={active === '1'} |
|
|
|
|
onClick={() => { |
|
|
|
|
toggle('1') |
|
|
|
|
toggle('1'); |
|
|
|
|
}} |
|
|
|
|
outline |
|
|
|
|
color='primary' |
|
|
|
@ -37,7 +44,7 @@ export const VertiportRightMenu = ({ setOpenSetting, openSetting }) => {
|
|
|
|
|
<Button |
|
|
|
|
active={active === '2'} |
|
|
|
|
onClick={() => { |
|
|
|
|
toggle('2') |
|
|
|
|
toggle('2'); |
|
|
|
|
}} |
|
|
|
|
outline |
|
|
|
|
color='primary' |
|
|
|
@ -47,7 +54,7 @@ export const VertiportRightMenu = ({ setOpenSetting, openSetting }) => {
|
|
|
|
|
<Button |
|
|
|
|
active={active === '3'} |
|
|
|
|
onClick={() => { |
|
|
|
|
toggle('3') |
|
|
|
|
toggle('3'); |
|
|
|
|
}} |
|
|
|
|
outline |
|
|
|
|
color='primary' |
|
|
|
@ -60,7 +67,9 @@ export const VertiportRightMenu = ({ setOpenSetting, openSetting }) => {
|
|
|
|
|
<TabContent className='py-50' activeTab={active}> |
|
|
|
|
<TabPane tabId='1'> |
|
|
|
|
<div className='layer-content'> |
|
|
|
|
<div class="layer-ti"><h4>출발 스케쥴 목록</h4></div> |
|
|
|
|
<div class='layer-ti'> |
|
|
|
|
<h4>출발 스케쥴 목록</h4> |
|
|
|
|
</div> |
|
|
|
|
<div className='vertiport-table'> |
|
|
|
|
<table className='table-st'> |
|
|
|
|
<thead> |
|
|
|
@ -106,7 +115,9 @@ export const VertiportRightMenu = ({ setOpenSetting, openSetting }) => {
|
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div className='layer-content'> |
|
|
|
|
<div class="layer-ti"><h4>도착 스케쥴 목록</h4></div> |
|
|
|
|
<div class='layer-ti'> |
|
|
|
|
<h4>도착 스케쥴 목록</h4> |
|
|
|
|
</div> |
|
|
|
|
<div className='vertiport-table'> |
|
|
|
|
<table className='table-st'> |
|
|
|
|
<thead> |
|
|
|
@ -152,7 +163,9 @@ export const VertiportRightMenu = ({ setOpenSetting, openSetting }) => {
|
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div className='layer-content'> |
|
|
|
|
<div class="layer-ti"><h4>착륙 대기 목록</h4></div> |
|
|
|
|
<div class='layer-ti'> |
|
|
|
|
<h4>착륙 대기 목록</h4> |
|
|
|
|
</div> |
|
|
|
|
<div className='vertiport-table'> |
|
|
|
|
<table className='table-st'> |
|
|
|
|
<thead> |
|
|
|
@ -200,44 +213,40 @@ export const VertiportRightMenu = ({ setOpenSetting, openSetting }) => {
|
|
|
|
|
</TabPane> |
|
|
|
|
<TabPane tabId='2'> |
|
|
|
|
<p> |
|
|
|
|
Bear claw jelly beans wafer pastry jelly beans candy macaroon biscuit topping. Sesame snaps lemon drops |
|
|
|
|
donut gingerbread dessert cotton candy wafer croissant jelly beans. Sweet roll halvah gingerbread bonbon |
|
|
|
|
apple pie gummies chocolate bar pastry gummi bears. |
|
|
|
|
Bear claw jelly beans wafer pastry jelly beans candy macaroon |
|
|
|
|
biscuit topping. Sesame snaps lemon drops donut gingerbread |
|
|
|
|
dessert cotton candy wafer croissant jelly beans. Sweet roll |
|
|
|
|
halvah gingerbread bonbon apple pie gummies chocolate bar |
|
|
|
|
pastry gummi bears. |
|
|
|
|
</p> |
|
|
|
|
<p> |
|
|
|
|
Croissant danish chocolate bar pie muffin. Gummi bears marshmallow chocolate bar bear claw. Fruitcake halvah |
|
|
|
|
chupa chups dragée carrot cake cookie. Carrot cake oat cake cake chocolate bar cheesecake. Wafer gingerbread |
|
|
|
|
sweet roll candy chocolate bar gingerbread. |
|
|
|
|
Croissant danish chocolate bar pie muffin. Gummi bears |
|
|
|
|
marshmallow chocolate bar bear claw. Fruitcake halvah chupa |
|
|
|
|
chups dragée carrot cake cookie. Carrot cake oat cake cake |
|
|
|
|
chocolate bar cheesecake. Wafer gingerbread sweet roll candy |
|
|
|
|
chocolate bar gingerbread. |
|
|
|
|
</p> |
|
|
|
|
</TabPane> |
|
|
|
|
<TabPane tabId='3'> |
|
|
|
|
<p> |
|
|
|
|
Croissant jelly tootsie roll candy canes. Donut sugar plum jujubes sweet roll chocolate cake wafer. Tart |
|
|
|
|
caramels jujubes. Dragée tart oat cake. Fruitcake cheesecake danish. Danish topping candy jujubes. Candy |
|
|
|
|
canes candy canes lemon drops caramels tiramisu chocolate bar pie. |
|
|
|
|
Croissant jelly tootsie roll candy canes. Donut sugar plum |
|
|
|
|
jujubes sweet roll chocolate cake wafer. Tart caramels |
|
|
|
|
jujubes. Dragée tart oat cake. Fruitcake cheesecake danish. |
|
|
|
|
Danish topping candy jujubes. Candy canes candy canes lemon |
|
|
|
|
drops caramels tiramisu chocolate bar pie. |
|
|
|
|
</p> |
|
|
|
|
<p> |
|
|
|
|
Gummi bears tootsie roll cake wafer. Gummies powder apple pie bear claw. Caramels bear claw fruitcake |
|
|
|
|
topping lemon drops. Carrot cake macaroon ice cream liquorice donut soufflé. Gummi bears carrot cake toffee |
|
|
|
|
bonbon gingerbread lemon drops chocolate cake. |
|
|
|
|
Gummi bears tootsie roll cake wafer. Gummies powder apple pie |
|
|
|
|
bear claw. Caramels bear claw fruitcake topping lemon drops. |
|
|
|
|
Carrot cake macaroon ice cream liquorice donut soufflé. Gummi |
|
|
|
|
bears carrot cake toffee bonbon gingerbread lemon drops |
|
|
|
|
chocolate cake. |
|
|
|
|
</p> |
|
|
|
|
</TabPane> |
|
|
|
|
</TabContent> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
) : ( |
|
|
|
|
<div className='right-menu'> |
|
|
|
|
<button |
|
|
|
|
className='right-layer-btn' |
|
|
|
|
onClick={() => setOpenSetting(true)} |
|
|
|
|
> |
|
|
|
|
<PiAirTrafficControlBold size={22} /> |
|
|
|
|
</button> |
|
|
|
|
<div className='right-layer'> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
)} |
|
|
|
|
</> |
|
|
|
|
); |
|
|
|
|
}; |
|
|
|
|