diff --git a/client/src/components/Dashboard/FlightCard/FlightCard.tsx b/client/src/components/Dashboard/FlightCard/FlightCard.tsx
index 1d19058b029459608146abd8ba41387047833666..dd3a9987bf80db4de611bd2c0a61c827f4f92ecd 100644
--- a/client/src/components/Dashboard/FlightCard/FlightCard.tsx
+++ b/client/src/components/Dashboard/FlightCard/FlightCard.tsx
@@ -11,16 +11,17 @@ interface IFlightCard {
function FlightCard({ flight, extraInfo }: IFlightCard) {
return (
<>
- <div className='flight-card'>
- <span>{flight.id}</span>
- {extraInfo && <span>Departure Time: {new Date(flight.departureTime).toLocaleString()}</span>}
- {extraInfo && <span>Arrival Time: {new Date(flight.arrivalTime).toLocaleString()}</span>}
- <span className='flight-path'>{airportCode(flight.origin)} - {airportCode(flight.destination)}</span>
- <span>{flight.origin} - {flight.destination}</span>
- <Link to={'/flight/' + flight.id}>View Flight</Link>
- </div>
+
+ <div className='flight-card'>
+ <span>Flight Number: {flight.id}</span>
+ <span>Departure Time: {new Date(flight.departureTime).toLocaleString()}</span>
+ <span>Arrival Time: {new Date(flight.arrivalTime).toLocaleString()}</span>
+ <span className='flight-path'>{flight.origin} - {flight.destination}</span>
+ <Link to={'/Flight/' + flight.id}>View Flight</Link>
+ </div>
</>
);
}
export default FlightCard;
+
diff --git a/client/src/components/Dashboard/Flights/Flights.scss b/client/src/components/Dashboard/Flights/Flights.scss
index 9cabf460c2016b19398d619f43069a435bc92294..ad5eea8aaead5fec6e153c86b50f776d41d5207c 100644
--- a/client/src/components/Dashboard/Flights/Flights.scss
+++ b/client/src/components/Dashboard/Flights/Flights.scss
@@ -22,6 +22,7 @@
border-radius: 5px;
background-color: var(--main);
color: white;
+ margin-left: 25px;
}
.view-more:hover {
diff --git a/client/src/components/Dashboard/Flights/Flights.tsx b/client/src/components/Dashboard/Flights/Flights.tsx
index 9739ea66fd5fd9e0f82b51ea858a6c9ebb5c8e27..20a824586fb6cb3f60a58c04614413bd58160548 100644
--- a/client/src/components/Dashboard/Flights/Flights.tsx
+++ b/client/src/components/Dashboard/Flights/Flights.tsx
@@ -2,24 +2,26 @@ import { useLoaderData } from 'react-router';
import { ICustomerDashboardData } from '../../../services/Dashboard/CustomerDashboard';
import { IAirlineDashboardData } from '../../../services/Dashboard/AirlineDashboard';
import FlightCard from '../FlightCard/FlightCard';
-import FlightCreationForm from '../../FlightCreationForm/FlightCreationForm';
import './Flights.scss';
+import { Link } from 'react-router-dom';
function Flights() {
const data = useLoaderData() as ICustomerDashboardData | IAirlineDashboardData;
-
if (data.type === 'customer') {
return (
<>
<div className='flights'>
<div className='flex-row'>
<span className='flights-title'>Upcoming Flights</span>
- <button type='submit' className='view-more'>View more</button>
+ <Link to={"/"}>
+ <button type='button' className='view-more'>View more</button>
+ </Link>
</div>
<div className='flight-list'>
{data.upcomingFlights.length > 0
- ? data.upcomingFlights.map((flight) => {
- return <FlightCard key={flight.id} flight={flight}></FlightCard>
+ ? data.upcomingFlights.slice(0,3).map((item) => {
+ // Only pass the flight data to the FlightCard
+ return <FlightCard key={item.flight.id} flight={item.flight}></FlightCard>
})
: <div>No Upcoming Flights</div>}
</div>
@@ -28,23 +30,37 @@ function Flights() {
<div className='flights'>
<div className='flex-row'>
<span className='flights-title'>Flights History</span>
- <button type='submit' className='view-more'>View more</button>
+ <button type='button' className='view-more'>View more</button>
</div>
<div className='flight-list'>
- {data.upcomingFlights.length > 0
- ? data.flightsHistory.map((flight) => {
- return <FlightCard key={flight.id} flight={flight}></FlightCard>
+ {data.flightsHistory.length > 0
+ ? data.flightsHistory.slice(0,3).map((item) => {
+ // Only pass the flight data to the FlightCard
+ return <FlightCard key={item.flight.id} flight={item.flight}></FlightCard>
})
: <div>No Flights History</div>}
</div>
</div>
</>
);
- } else {
+ }
+ else {
return (
<>
- <div>
- <FlightCreationForm></FlightCreationForm>
+ <div className='flights'>
+ <div className='flex-row'>
+ <span className='flights-title'>Flights List</span>
+ <Link to="/register-flight">
+ <button type='button' className='view-more'>Add flight</button>
+ </Link>
+ </div>
+ <div className='flight-list'>
+ {data.flightList.length > 0
+ ? data.flightList.slice(0,3).map((flight) => {
+ return <FlightCard key={flight.id} flight={flight}></FlightCard>
+ })
+ : <div>No Flights have been created yet.</div>}
+ </div>
</div>
</>
);
diff --git a/client/src/components/Login/Login.tsx b/client/src/components/Login/Login.tsx
index d9190f95cd2070fcaffa0d123dcc2a3569121c31..edb557747a2fba32d18c7096a950116fd824f281 100644
--- a/client/src/components/Login/Login.tsx
+++ b/client/src/components/Login/Login.tsx
@@ -5,6 +5,7 @@ import { AxiosError } from 'axios';
import { useAuth } from '../../hooks/useAuth';
import { loginUser } from '../../services/Login/Login';
import { userToDashboard } from '../../helpers/UserType';
+import UserStorage from "../../helpers/UserStorage";
import './Login.scss';
export interface ILoginForm {
@@ -25,6 +26,8 @@ export function Login() {
const result = await loginUser(formValue);
if (result) {
giveAuth();
+ const userId = result.data.id;
+ UserStorage.storeUserId(userId)
updateUser(result.data);
navigate(`/${userToDashboard(result.data)}`);
} else {
diff --git a/client/src/components/Register/Register.tsx b/client/src/components/Register/Register.tsx
index dd9bd0a46e3a887b3e08ca9af01a5a9837ceea52..5b85c96545c6439751bc1e763b86e8b09052a177 100644
--- a/client/src/components/Register/Register.tsx
+++ b/client/src/components/Register/Register.tsx
@@ -6,6 +6,7 @@ import { registerUser } from '../../services/Register/Register';
import { useAuth } from '../../hooks/useAuth';
import './Register.scss';
import { userToDashboard } from '../../helpers/UserType';
+import UserStorage from "../../helpers/UserStorage";
export interface IRegisterForm {
name: string;
@@ -37,6 +38,8 @@ export function Register() {
try {
const result = await registerUser(formValue);
giveAuth();
+ const userId = result.data.id;
+ UserStorage.storeUserId(userId)
updateUser(result.data);
navigate(`/${userToDashboard(result.data)}`);
} catch (error) {
diff --git a/client/src/main.tsx b/client/src/main.tsx
index 9904a9ee69eda4a8ddce9aa805745da420bd32b9..1989c3ac260a199058faef4752e097c990105822 100644
--- a/client/src/main.tsx
+++ b/client/src/main.tsx
@@ -20,6 +20,7 @@ import { GetFlightData } from './services/Flight/Flight.ts';
import { GetFlightList } from './services/FlightList/FlightList.ts';
import { GetBookingList } from './services/BookingList/BookingList.ts';
import './index.scss';
+import FlightCreationForm from './components/FlightCreationForm/FlightCreationForm.tsx';
const router = createBrowserRouter([
{
@@ -76,6 +77,10 @@ const router = createBrowserRouter([
path: 'booking/list',
loader: GetBookingList,
element: <BookingList></BookingList>
+ },
+ {
+ path: 'register-flight',
+ element: <FlightCreationForm></FlightCreationForm>
}
]
}
diff --git a/client/src/services/Dashboard/AirlineDashboard.ts b/client/src/services/Dashboard/AirlineDashboard.ts
index 3600759203a56849066fbb9075b6e8847218dedc..b0e1dda10fcbd384fa1f04b9c69cee1bcdb3abdf 100644
--- a/client/src/services/Dashboard/AirlineDashboard.ts
+++ b/client/src/services/Dashboard/AirlineDashboard.ts
@@ -1,9 +1,46 @@
+import Api from "../../helpers/Api";
+import UserStorage from "../../helpers/UserStorage";
+
+export interface ISeat {
+ id: number;
+ classType: number;
+ seatNumber: string;
+ isAvailable: boolean;
+}
+
+export interface ISeats {
+ $id: string;
+ $values: ISeat[];
+}
+
+export interface IFlight {
+ id: number;
+ origin: string;
+ destination: string;
+ arrivalTime: string;
+ departureTime: string;
+ economyCapacity: number;
+ businessCapacity: number;
+ economyPrice: number;
+ businessPrice: number;
+ seats: ISeats
+}
+
export interface IAirlineDashboardData {
type: 'airline'
+ flightList: IFlight[];
}
-export async function GetAirlineDashboardData(): Promise<IAirlineDashboardData> {
- return {
- type: 'airline'
- };
-}
+export async function GetAirlineDashboardData({request}: {request: Request}): Promise<IAirlineDashboardData> {
+ try {
+ const id = UserStorage.getUserId();
+ const response = await Api.get(`Flight?airlineId=${id}`, { withCredentials: true });
+ const flights = response.data.$values;
+ return {
+ type: 'airline',
+ flightList: flights
+ };
+ } catch (error) {
+ throw error;
+ }
+}
\ No newline at end of file
diff --git a/client/src/services/Dashboard/CustomerDashboard.ts b/client/src/services/Dashboard/CustomerDashboard.ts
index c05a16f6b5ba461863973a17a342293dbb07b4f2..f3bd27c8e7195f72796ed63c9cf61d635b468be2 100644
--- a/client/src/services/Dashboard/CustomerDashboard.ts
+++ b/client/src/services/Dashboard/CustomerDashboard.ts
@@ -1,3 +1,5 @@
+import Api from "../../helpers/Api";
+
export interface ISeat {
id: number;
classType: number;
@@ -30,9 +32,18 @@ export interface ICustomerDashboardData {
}
export async function GetCustomerDashboardData(): Promise<ICustomerDashboardData> {
- return {
- type: 'customer',
- upcomingFlights: [],
- flightsHistory: []
+ try {
+ const upcomingFlights = Api.get('Booking/upcoming', { withCredentials: true });
+ const flightsHistory = Api.get('Booking/history', { withCredentials: true });
+ const [uData, hData] = await Promise.all([upcomingFlights, flightsHistory]);
+
+ return {
+ type: 'customer',
+ upcomingFlights: uData.data,
+ flightsHistory: hData.data
+ };
+ } catch (error) {
+ throw error;
}
}
+