Bug fix for individual alliance challenges
This commit is contained in:
@@ -1,115 +1,125 @@
|
||||
<script setup lang="ts">
|
||||
import { computed } from 'vue'
|
||||
import { Achievement, Alliance, Flight, User } from '@/Types/types'
|
||||
import { computed, ref } from 'vue'
|
||||
import { Achievement, Airline, Alliance, Flight, User } from '@/Types/types'
|
||||
import Panel from '@/Components/FlightsGoneBy/Panels/Panel.vue'
|
||||
import PanelHeader from '@/Components/FlightsGoneBy/Panels/PanelHeader.vue'
|
||||
import PanelSubHeader from '@/Components/FlightsGoneBy/Panels/PanelSubHeader.vue'
|
||||
import BadgeTable from '@/Components/FlightsGoneBy/GenericBadgeTable.vue'
|
||||
import InlineBadge from '@/Components/FlightsGoneBy/InlineBadge.vue'
|
||||
import AirlineLogo from '@/Components/FlightsGoneBy/AirlineLogo.vue'
|
||||
import AllianceLogo from '@/Components/FlightsGoneBy/AllianceLogo.vue'
|
||||
import FlightBadge from '@/Components/FlightsGoneBy/FlightBadge.vue'
|
||||
import FlightBadge from "@/Components/FlightsGoneBy/FlightBadge.vue";
|
||||
|
||||
defineOptions({ inheritAttrs: false })
|
||||
|
||||
interface AirlineEntry {
|
||||
airline: Airline
|
||||
flights: Flight[]
|
||||
}
|
||||
|
||||
const props = defineProps<{
|
||||
achievement: Achievement
|
||||
user: User
|
||||
followStatus: string
|
||||
majorAlliances: Alliance[]
|
||||
alliance: Alliance
|
||||
airlines: Airline[]
|
||||
flights: Flight[]
|
||||
}>()
|
||||
|
||||
interface AllianceEntry {
|
||||
alliance: Alliance
|
||||
flights: Flight[]
|
||||
}
|
||||
const flightsByAirline = computed(() => {
|
||||
const map = new Map<string, AirlineEntry>()
|
||||
const idToKey = new Map<number, string>()
|
||||
|
||||
|
||||
const alliances = computed<AllianceEntry[]>(() => {
|
||||
const entries = props.majorAlliances.map(alliance => ({ alliance, flights: [] as Flight[] }))
|
||||
const byName = new Map(entries.map(e => [e.alliance.internal_name, e]))
|
||||
|
||||
for (const flight of props.flights) {
|
||||
const key = flight.airline?.alliance?.internal_name
|
||||
if (!key) continue
|
||||
byName.get(key)?.flights.push(flight)
|
||||
for (const airline of props.airlines) {
|
||||
const key = rowKey(airline)
|
||||
map.set(key, { airline, flights: [] })
|
||||
idToKey.set(airline.id, key)
|
||||
for (const alias of airline.merged_from ?? []) {
|
||||
idToKey.set(alias.id, key)
|
||||
}
|
||||
}
|
||||
|
||||
return entries
|
||||
for (const flight of props.flights) {
|
||||
const airline = flight.airline
|
||||
if (!airline) continue
|
||||
const key = idToKey.get(airline.id)
|
||||
if (!key) continue
|
||||
map.get(key)?.flights.push(flight)
|
||||
}
|
||||
|
||||
return map
|
||||
})
|
||||
|
||||
const completedCount = computed(
|
||||
() => alliances.value.filter(a => a.flights.length > 0).length
|
||||
)
|
||||
|
||||
function flightTitle(flight: Flight): string {
|
||||
const name = flight.airline?.name ?? 'Unknown airline'
|
||||
return `${name}: ${flight.departure_airport?.iata_code} → ${flight.arrival_airport?.iata_code}`
|
||||
function rowKey(airline: Airline): string {
|
||||
return airline.iata_code ?? airline.internal_name
|
||||
}
|
||||
|
||||
const rows = computed(() => [...flightsByAirline.value.keys()])
|
||||
|
||||
function entryFor(key: string): AirlineEntry {
|
||||
return flightsByAirline.value.get(key)!
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<!-- Header -->
|
||||
<Panel>
|
||||
<div class="alliance-header">
|
||||
<div class="logo-row">
|
||||
<AllianceLogo
|
||||
v-for="entry in alliances"
|
||||
:key="entry.alliance.internal_name"
|
||||
:alliance="entry.alliance"
|
||||
size="56"
|
||||
/>
|
||||
</div>
|
||||
<AllianceLogo :alliance="alliance" size="56" />
|
||||
<div>
|
||||
<PanelHeader centered>Major Alliances</PanelHeader>
|
||||
<PanelHeader centered>{{ alliance.name }}</PanelHeader>
|
||||
<PanelSubHeader centered>
|
||||
{{ completedCount }} / {{ alliances.length }} alliances flown
|
||||
<slot />
|
||||
</PanelSubHeader>
|
||||
</div>
|
||||
</div>
|
||||
</Panel>
|
||||
|
||||
<!-- Per-alliance breakdown -->
|
||||
<Panel v-for="entry in alliances" :key="entry.alliance.internal_name">
|
||||
|
||||
<!-- Airlines table -->
|
||||
<Panel>
|
||||
<div class="table-toolbar">
|
||||
<PanelHeader>{{ entry.alliance.name }}</PanelHeader>
|
||||
<PanelHeader>Airlines</PanelHeader>
|
||||
</div>
|
||||
|
||||
<BadgeTable
|
||||
:rows="[entry.alliance.internal_name]"
|
||||
:rows="rows"
|
||||
:rowKey="key => key"
|
||||
:hasItems="() => entry.flights.length > 0"
|
||||
:hasItems="key => entryFor(key).flights.length > 0"
|
||||
labelWidth="14em"
|
||||
>
|
||||
<template #label>
|
||||
<div class="airline-label">
|
||||
<AllianceLogo :alliance="entry.alliance" size="24" />
|
||||
<span>{{ entry.alliance.name }}</span>
|
||||
<template #label="{ row: key }">
|
||||
<div class="airline-label" >
|
||||
<AirlineLogo :airline="entryFor(key).airline" size="24" />
|
||||
<span>{{ entryFor(key).airline.name }}</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template #items>
|
||||
<template #items="{ row: key }">
|
||||
<FlightBadge
|
||||
v-for="flight in entry.flights"
|
||||
v-for="flight in entryFor(key).flights"
|
||||
:key="flight.id"
|
||||
:title="flightTitle(flight)"
|
||||
:flight="flight"
|
||||
/>
|
||||
:title="`${flight.departure_airport?.iata_code} → ${flight.arrival_airport?.iata_code}`"
|
||||
:flight="flight" />
|
||||
</template>
|
||||
</BadgeTable>
|
||||
</Panel>
|
||||
|
||||
<!-- Slot for alliance-specific panels -->
|
||||
<slot name="extra" />
|
||||
|
||||
<!-- Requirements -->
|
||||
<Panel>
|
||||
<PanelHeader centered>Requirements</PanelHeader>
|
||||
<p>
|
||||
To complete this challenge you must fly with at least one member airline from each of
|
||||
the three major alliances. Unlike the individual alliance challenges, you don't need
|
||||
to fly every airline in an alliance — just one flight per alliance is enough.
|
||||
To complete this challenge you must fly with every current member airline of
|
||||
<strong>{{ alliance.name }}</strong>. Alliance membership changes over time, so the
|
||||
required airlines reflect the current roster.
|
||||
</p>
|
||||
|
||||
<p>
|
||||
Codeshare flights do not count, the operating carrier must be a member of the
|
||||
alliance.
|
||||
Codeshare flights do not count, the operating carrier must be a member of {{alliance.name}}.
|
||||
</p>
|
||||
</Panel>
|
||||
</template>
|
||||
@@ -123,10 +133,6 @@ function flightTitle(flight: Flight): string {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.logo-row {
|
||||
display: flex;
|
||||
gap: 0.75rem;
|
||||
}
|
||||
|
||||
.table-toolbar {
|
||||
display: flex;
|
||||
@@ -136,6 +142,7 @@ function flightTitle(flight: Flight): string {
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
|
||||
.airline-label {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
@@ -143,4 +150,5 @@ function flightTitle(flight: Flight): string {
|
||||
gap: 0.5rem;
|
||||
padding: 0 0.25rem;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user