Add more airlines and fix edit bugs

This commit is contained in:
2026-04-20 13:36:58 +10:00
parent 8d7d8f02d3
commit 5deefcbfb3
22 changed files with 1109 additions and 1530 deletions
@@ -1,42 +1,3 @@
<template>
<!-- Year full width -->
<div class="flight-charts glass">
<FlightsPerYearChart :flights="flights" :upcoming-flights="upcomingFlights" />
</div>
<!-- Month + Day of week -->
<div class="flight-charts glass charts-row">
<FlightsPerMonthChart :flights="flights" :upcoming-flights="upcomingFlights" />
<FlightsPerDayChart :flights="flights" :upcoming-flights="upcomingFlights" />
</div>
<!-- Reasons + Class + Seat type -->
<div class="flight-charts glass charts-row">
<FlightReasonsChart :flights="[...flights, ...upcomingFlights]" />
<FlightClassChart :flights="[...flights, ...upcomingFlights]" />
<SeatTypeChart :flights="[...flights, ...upcomingFlights]" />
</div>
<!-- Countries (tall) + Continents & Flight Type stacked -->
<div class="flight-charts glass charts-row">
<CountriesChart :max-visible="18" :flights="flights" :upcoming-flights="upcomingFlights" class="chart-tall" />
<div class="charts-stack">
<ContinentsChart :flights="flights" :upcoming-flights="upcomingFlights" />
<FlightTypeChart :flights="[...flights, ...upcomingFlights]" :upcoming-flights="upcomingFlights" />
</div>
</div>
<!-- Airlines + Airports -->
<div class="flight-charts glass charts-row">
<TopAirlinesChart :flights="flights" :upcoming-flights="upcomingFlights" />
<TopAirportsChart :flights="flights" :upcoming-flights="upcomingFlights" />
</div>
<!-- Routes + International vs Domestic -->
<div class="flight-charts glass charts-row">
<TopRoutesChart :flights="[...flights, ...upcomingFlights]" :upcoming-flights="upcomingFlights" />
</div>
</template>
<script setup lang="ts">
import type { Flight } from '@/Types/types'
@@ -52,13 +13,58 @@ import TopAirlinesChart from '@/Components/FlightsGoneBy/Charts/TopAirlinesChart
import TopAirportsChart from '@/Components/FlightsGoneBy/Charts/TopAirportsChart.vue'
import TopRoutesChart from '@/Components/FlightsGoneBy/Charts/TopRoutesChart.vue'
import FlightTypeChart from '@/Components/FlightsGoneBy/Charts/FlightTypeChart.vue'
import {FlightStats} from "@/Composables/useFlightStats";
defineProps<{
flights: Flight[]
upcomingFlights: Flight[]
flightStats: FlightStats
}>()
</script>
<template>
<!-- Year full width -->
<div class="flight-charts glass">
<FlightsPerYearChart :flight-stats="flightStats" />
</div>
<!-- Month + Day of week -->
<div class="flight-charts glass charts-row">
<FlightsPerMonthChart :flight-stats="flightStats" />
<FlightsPerDayChart :flight-stats="flightStats" />
</div>
<!-- Reasons + Class + Seat type -->
<div class="flight-charts glass charts-row">
<FlightClassChart :flight-stats="flightStats" />
<FlightReasonsChart :flight-stats="flightStats" />
<SeatTypeChart :flight-stats="flightStats" />
</div>
<!-- Countries (tall) + Continents & Flight Type stacked -->
<div class="flight-charts glass charts-row">
<CountriesChart :max-visible="18" :flight-stats="flightStats" class="chart-tall" />
<div class="charts-stack">
<ContinentsChart :flight-stats="flightStats" />
<FlightTypeChart :flight-stats="flightStats" />
</div>
</div>
<!-- Airlines + Airports -->
<div class="flight-charts glass charts-row">
<TopAirlinesChart :flight-stats="flightStats" />
<TopAirportsChart :flight-stats="flightStats" />
</div>
<!-- Routes + International vs Domestic -->
<div class="flight-charts glass charts-row">
<!--
<TopRoutesChart :flights="[...flights, ...upcomingFlights]" :upcoming-flights="upcomingFlights" />
-->
</div>
</template>
<style scoped>
.flight-charts {
display: flex;