49 lines
1.7 KiB
Vue
49 lines
1.7 KiB
Vue
<script setup lang="ts">
|
|
import {Flight, UserActionFlightCancelledData} from "@/Types/types";
|
|
import AirportToolTip from "@/Components/FlightsGoneBy/AirportToolTip.vue";
|
|
import AirlineLogo from "@/Components/FlightsGoneBy/AirlineLogo.vue";
|
|
import FlightClassBadge from "@/Components/FlightsGoneBy/FlightClassBadge.vue";
|
|
import AircraftToolTip from "@/Components/FlightsGoneBy/AircraftToolTip.vue";
|
|
import BoardingPass from "@/Components/FlightsGoneBy/BoardingPass.vue";
|
|
|
|
const props = defineProps<{
|
|
flight: Flight
|
|
}>()
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<div class="flight-booked">
|
|
<div class="imported-flight">
|
|
<span v-if="flight.flight_number" class="flight-summary">
|
|
<AirlineLogo :airline="flight.airline" />
|
|
<span>Historical flight <strong>{{ flight.flight_number }}</strong> on {{ flight.departure_date_display }} at {{ flight.departure_time_display }} imported from MyFlightRadar24</span>
|
|
</span>
|
|
<span v-else class="flight-summary">
|
|
<AirlineLogo :airline="flight.airline" />
|
|
<span>Historical flight from <b>{{ flight.departure_airport.municipality }} ({{ flight.departure_airport.display_code }}) → {{ flight.arrival_airport.municipality }} ({{ flight.arrival_airport.display_code }})</b> on {{ flight.departure_date_display }} at {{ flight.departure_time_display }} imported from MyFlightRadar24</span>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
.imported-flight {
|
|
padding: 0.75rem 1.25rem;
|
|
}
|
|
|
|
.flight-summary {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.5rem;
|
|
font-size: 0.875rem;
|
|
color: #9ca3af;
|
|
}
|
|
|
|
.flight-summary strong {
|
|
color: #f9fafb;
|
|
font-weight: 600;
|
|
}
|
|
</style>
|