38 lines
1.5 KiB
Vue
38 lines
1.5 KiB
Vue
<script setup lang="ts">
|
|
|
|
import Panel from "@/Components/FlightsGoneBy/Panels/Panel.vue";
|
|
import { Airport } from "@/Types/types";
|
|
import InlineBadge from "@/Components/FlightsGoneBy/InlineBadge.vue";
|
|
import DetailRows from "@/Components/FlightsGoneBy/Panels/DetailRows.vue";
|
|
import DetailRow from "@/Components/FlightsGoneBy/Panels/DetailRow.vue";
|
|
import PanelSubHeader from "@/Components/FlightsGoneBy/Panels/PanelSubHeader.vue";
|
|
import PanelHeader from "@/Components/FlightsGoneBy/Panels/PanelHeader.vue";
|
|
|
|
defineProps<{
|
|
label?: string
|
|
airport: Airport
|
|
}>()
|
|
</script>
|
|
|
|
<template>
|
|
<Panel :label="label">
|
|
<PanelHeader class="airport-name">{{ airport.name }}</PanelHeader>
|
|
<PanelSubHeader>
|
|
{{ airport.municipality }},
|
|
{{ airport.region?.country?.name }} <span :class="`fi fi-${airport.region?.country.code.toLowerCase()}`"></span>
|
|
</PanelSubHeader>
|
|
<DetailRows>
|
|
<DetailRow v-if="airport.iata_code" label="IATA" variant="Badge" :value="airport.iata_code" />
|
|
<DetailRow v-if="airport.icao_code" label="ICAO" variant="Badge" :value="airport.icao_code" />
|
|
<DetailRow label="City Served" :value="airport.municipality" />
|
|
<DetailRow label="Region" v-if="airport.region?.name" :value="airport.region.name" />
|
|
<DetailRow label="Country" v-if="airport.region?.country" variant="Country" :country="airport.region.country" :value="airport.region.country.name" />
|
|
</DetailRows>
|
|
</Panel>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
|
|
</style>
|