Added achievement data

2026-05-10 02:28:30 +10:00
parent f2b2eaaabe
commit 217a971360
23 changed files with 479 additions and 470 deletions
@@ -0,0 +1,48 @@
+<script setup lang="ts">
+import {Alliance, Country} from "@/Types/types";
+import InlineBadge from "@/Components/FlightsGoneBy/InlineBadge.vue";
+import AllianceLogo from "@/Components/FlightsGoneBy/AllianceLogo.vue";
+import WakeTurbulence from "@/Components/FlightsGoneBy/WakeTurbulence.vue";
+
+defineProps<{
+    label: string
+    value: string | null
+    variant?: "Country" | "Badge" | "Alliance" | "WTC"
+    country?: Country
+    alliance?: Alliance
+}>()
+</script>
+
+<template>
+    <div class="detail-row">
+        <span class="detail-key">{{label}}</span>
+        <span class="detail-val" v-if="!variant">{{value ?? ''}}</span>
+        <span class="detail-val" v-if="variant == 'Badge'"><InlineBadge variant="generic">{{value ?? ''}}</InlineBadge></span>
+        <span class="detail-val" v-if="variant == 'Country' && country">{{country.name}} <span :class="`fi fi-${country.code.toLowerCase()}`"></span></span>
+        <span class="detail-val" v-if="variant == 'Alliance' && alliance">{{alliance.name}} <AllianceLogo :alliance="alliance"/> </span>
+        <span class="detail-val" v-if="variant == 'WTC'"><WakeTurbulence :value="value" /> </span>
+    </div>
+</template>
+
+<style scoped>
+.detail-row {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    font-size: 0.8rem;
+}
+
+.detail-key {
+    color: var(--muted);
+
+}
+
+.detail-val {
+    color: var(--text);
+    text-align: right;
+    display:inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: 0.5em;
+}
+</style>