pav
/
pav-home
9
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

예약 페이지 생성

master
김장현 11 months ago
parent
79deb90758
commit
7a50181d88
9 changed files with 201 additions and 134 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      package-lock.json
  2. 3
      src/@core/layouts/components/menu/vertical-menu/index.js
  3. 12
      src/@core/layouts/components/navbar/NavbarUser.js
  4. 13
      src/navigation/reservation/index.js
  5. 10
      src/router/routes/RouteReservation.js
  6. 2
      src/router/routes/index.js
  7. 270
      src/views/control/setting/ControlReservation.js
  8. 15
      src/views/control/setting/ControlSetting.js
  9. 6
      src/views/reservation/ReservationView.js

2
package-lock.json generated
Unescape View File

@ -12784,7 +12784,7 @@
"load-script": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/load-script/-/load-script-1.0.0.tgz",
"integrity": "sha1-BJGTngvuVkPuSUp+PaPSuscMbKQ="
"integrity": "sha512-kPEjMFtZvwL9TaZo0uZ2ml+Ye9HUMmPwbYRJ324qF9tqMejwykJ5ggTyvzmrbBeapCAbk98BSbTeovHEEP1uCA=="
},
"loader-runner": {
"version": "2.4.0",

3
src/@core/layouts/components/menu/vertical-menu/index.js
Unescape View File

@ -10,6 +10,7 @@ import statics from '@src/navigation/statics';
import system from '@src/navigation/system';
import analysis from '@src/navigation/analysis';
import flightPlan from '@src/navigation/flightPlan';
import reservation from '@src/navigation/reservation';
// ** Third Party Components
import classnames from 'classnames';
@ -43,6 +44,8 @@ const Sidebar = props => {
return analysis;
case 'flightPlan':
return flightPlan;
case 'reservation':
return reservation;
}
};

12
src/@core/layouts/components/navbar/NavbarUser.js
Unescape View File

@ -130,6 +130,18 @@ const NavbarUser = props => {
날씨 정보
</NavLink>
</NavItem>
<NavItem>
<NavLink
onClick={e => handlerTopMenu('reservation')}
active={topMenuCd === 'reservation'}
// active={active === '2'}
// onClick={() => {
// toggle('2')
// }}
>
도심항공교통(UAM) 예약
</NavLink>
</NavItem>
</Nav>
{/* <div className='bookmark-wrapper d-flex align-items-center'>
<NavItem className='d-none d-lg-block'>

13
src/navigation/reservation/index.js
Unescape View File

@ -0,0 +1,13 @@
export default [
{
id: 'reservation_001',
title: '도심항공교통(UAM) 예약',
navLink: '#'
},
{
id: 'reservation_001_01',
type: 'item',
title: '도심항공교통(UAM) 예약',
navLink: '/reservation'
}
];

10
src/router/routes/RouteReservation.js
Unescape View File

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

2
src/router/routes/index.js
Unescape View File

@ -5,6 +5,7 @@ import RouteBasis from './RouteBasis';
import RouteDashboard from './RouteDashboard';
import RouteSystem from './RouteSystem';
import RouteWeather from './RouteWeather';
import RouteReservation from './RouteReservation';
// ** Document title
const TemplateTitle = '%s - Dron Control System';
@ -20,6 +21,7 @@ const Routes = [
...RouteBasis,
...RouteSystem,
...RouteWeather,
...RouteReservation,
{
path: '/home',
component: lazy(() => import('../../views/Home'))

270
src/views/control/setting/ControlReservation.js
Unescape View File

@ -34,152 +34,166 @@ export default function ControlReservation({ modal, handler }) {
return stepNumber === currentStep ? 'active-step' : 'inactive-step';
}
return (
<div
className='vertically-centered-modal'
>
<Modal
<div className='vertically-centered-modal'>
{/* <Modal
isOpen={modal}
toggle={handler}
className='modal-dialog-centered modal-lg modal-uam-reservation'
>
<ModalHeader
> */}
{/* <ModalHeader
toggle={handler}
>
{search ? (
reserveStep !== 4 ? (
<div className='uam-reservation-header'>
<h5>도심항공교통(UAM) 예약</h5>
<div>
<ul className='step'>
<li className={getStepColorClass(1, step)}>➀ 항공교통 조회</li>
<li className={getStepColorClass(2, step)}>➁ 항공교통 선택</li>
<li className={getStepColorClass(3, step)}>➂ 탑승정보 입력</li>
<li className={getStepColorClass(4, step)}>➃ 결제</li>
</ul>
</div>
</div>
) : (
<div className='uam-reservation-header'>
<h4>도심항공교통(UAM) 예약</h4>
<div>
결제완료
</div>
</div>
)
) : (
<div className='uam-reservation-header'>
<h5>도심항공교통(UAM) 예약</h5>
> */}
{search ? (
reserveStep !== 4 ? (
<div className='uam-reservation-header'>
<h5>도심항공교통(UAM) 예약</h5>
<div>
<ul className='step'>
<li className={getStepColorClass(1, step)}>➀ 항공교통 조회</li>
<li className={getStepColorClass(2, step)}>➁ 항공교통 선택</li>
<li className={getStepColorClass(3, step)}>➂ 탑승정보 입력</li>
<li className={getStepColorClass(4, step)}>➃ 결제</li>
</ul>
</div>
</div>
)}
</ModalHeader>
<ModalBody>
{!search ? (
) : (
<div className='uam-reservation-header'>
<h4>도심항공교통(UAM) 예약</h4>
<div>결제완료</div>
</div>
)
) : (
<div className='uam-reservation-header'>
<h5>도심항공교통(UAM) 예약</h5>
<ul className='step'>
<li className={getStepColorClass(1, step)}>➀ 항공교통 조회</li>
<li className={getStepColorClass(2, step)}>➁ 항공교통 선택</li>
<li className={getStepColorClass(3, step)}>➂ 탑승정보 입력</li>
<li className={getStepColorClass(4, step)}>➃ 결제</li>
</ul>
</div>
)}
{/* </ModalHeader> */}
{/* <ModalBody> */}
{!search ? (
<div>
<div>
<Nav justified pills>
<NavItem>
<NavLink
active={activeTab === 1}
onClick={() => setActiveTab(1)}
>
<span>왕복</span>
</NavLink>
</NavItem>
<NavItem>
<NavLink
active={activeTab === 2}
onClick={() => setActiveTab(2)}
>
<span>편도</span>
</NavLink>
</NavItem>
</Nav>
</div>
<div className='uam-reservation-tab-list'>
<div
className={`list ${airTraficCheck === 1 ? 'active' : ''}`}
onClick={() => {
setAirTraficCheck(1);
}}
>
출발지
</div>
<div
className={`list ${airTraficCheck === 2 ? 'active' : ''}`}
onClick={() => {
setAirTraficCheck(2);
}}
>
도착지
</div>
<div
className={`list ${airTraficCheck === 3 ? 'active' : ''}`}
onClick={() => {
setAirTraficCheck(3);
}}
>
탑승일
</div>
<div
className={`list ${airTraficCheck === 4 ? 'active' : ''}`}
onClick={() => {
setAirTraficCheck(4);
}}
>
탑승객
</div>
<div
className={`list finish ${isChoise ? 'active' : ''}`}
onClick={() => {
setSearch(true);
setStep(2);
}}
>
항공교통 조회
</div>
</div>
<>
{airTraficCheck === 1 && <Step1 />}
{airTraficCheck === 2 && <Step2 />}
{airTraficCheck === 3 && <Step3 />}
{airTraficCheck === 4 && <Step4 setIsChoise={setIsChoise} />}
</>
</div>
) : (
<>
{reserveStep === 1 && <ReserveStep1 />}
{reserveStep === 2 && <ReserveStep2 />}
{reserveStep === 3 && <ReserveStep3 />}
{reserveStep === 4 && <ReserveStep4 />}
{reserveStep !== 4 ? (
<div>
<div>
<Nav justified pills>
<NavItem>
<NavLink
active={activeTab === 1}
onClick={() => setActiveTab(1)}
>
<span>
왕복
</span>
</NavLink>
</NavItem>
<NavItem>
<NavLink
active={activeTab === 2}
onClick={() => setActiveTab(2)}
>
<span>
편도
</span>
</NavLink>
</NavItem>
</Nav>
<button
onClick={() => {
if (reserveStep === 1) {
setIsChoise(false);
setSearch(false);
setAirTraficCheck(1);
} else {
setReserveStep(reserveStep - 1);
setStep(step - 1);
}
}}
>
취소
</button>
</div>
<div className='uam-reservation-tab-list'>
<div className={`list ${airTraficCheck === 1 ? 'active' : ''}`} onClick={() => {setAirTraficCheck(1);}}>
출발지
</div>
<div className={`list ${airTraficCheck === 2 ? 'active' : ''}`} onClick={() => {setAirTraficCheck(2);}}>
도착지
</div>
<div className={`list ${airTraficCheck === 3 ? 'active' : ''}`} onClick={() => {setAirTraficCheck(3);}}>
탑승일
</div>
<div className={`list ${airTraficCheck === 4 ? 'active' : ''}`} onClick={() => {setAirTraficCheck(4);}}>
탑승객
</div>
<div className={`list finish ${isChoise ? 'active' : ''}`} onClick={() => {setSearch(true); setStep(2);}}>
항공교통 조회
</div>
<div>
<button
onClick={() => {
setReserveStep(reserveStep + 1);
setStep(step + 1);
}}
>
{reserveStep === 3 ? '결제하기' : '다음'}
</button>
</div>
<>
{airTraficCheck === 1 && <Step1 />}
{airTraficCheck === 2 && <Step2 />}
{airTraficCheck === 3 && <Step3 />}
{airTraficCheck === 4 && <Step4 setIsChoise={setIsChoise} />}
</>
</div>
) : (
<>
{reserveStep === 1 && <ReserveStep1 />}
{reserveStep === 2 && <ReserveStep2 />}
{reserveStep === 3 && <ReserveStep3 />}
{reserveStep === 4 && <ReserveStep4 />}
{reserveStep !== 4 ? (
<div>
<div>
<button
onClick={() => {
if (reserveStep === 1) {
setIsChoise(false);
setSearch(false);
setAirTraficCheck(1);
} else {
setReserveStep(reserveStep - 1);
setStep(step - 1);
}
}}
>
취소
</button>
</div>
<div>
<button
onClick={() => {
setReserveStep(reserveStep + 1);
setStep(step + 1);
}}
>
{reserveStep === 3 ? '결제하기' : '다음'}
</button>
</div>
</div>
) : (
<div>
<div>
<button
onClick={handler}
>
확인
</button>
</div>
</div>
)}
</>
<div>
<div>
<button onClick={handler}>확인</button>
</div>
</div>
)}
</ModalBody>
</Modal>
</>
)}
{/* </ModalBody> */}
{/* </Modal> */}
</div>
);
}

15
src/views/control/setting/ControlSetting.js
Unescape View File

@ -4,6 +4,7 @@ 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 { useHistory } from 'react-router-dom';
import {
Button,
InputGroup,
@ -24,6 +25,7 @@ import ControlFsm from './ControlFsm';
const ControlSetting = props => {
const [modal, setModal] = useState(false);
const dispatch = useDispatch();
const history = useHistory();
const mapControl = useSelector(state => state.controlMapReducer);
@ -39,7 +41,7 @@ const ControlSetting = props => {
// setModal(!modal);
// };
const handlerModal = (modalName) => {
const handlerModal = modalName => {
setModal(modalName);
};
@ -188,8 +190,13 @@ const ControlSetting = props => {
<div className='layer-content-box'>
<div className='map-btn'>
<ButtonGroup>
<Button color='primary' onClick={() => handlerModal('reservation')}>
도심항공교통(UAM) 예약 바로가기
<Button
color='primary'
onClick={() => {
history.push('');
}}
>
도심항공교통(UAM) 예약 바로가기
</Button>
</ButtonGroup>
</div>
@ -203,7 +210,7 @@ const ControlSetting = props => {
<div className='map-btn'>
<ButtonGroup>
<Button color='primary' onClick={() => handlerModal('fsm')}>
FSM 비행계획서 작성 바로가기
FSM 비행계획서 작성 바로가기
</Button>
</ButtonGroup>
</div>

6
src/views/reservation/ReservationView.js
Unescape View File

@ -0,0 +1,6 @@
import ControlReservation from '../control/setting/ControlReservation';
import '../../assets/css/custom.css';
export default function ReservationView() {
return <ControlReservation />;
}
Write Preview
Loading…
Cancel
Save