Added Support and Analytics for Release

This commit is contained in:
2026-07-10 21:59:35 +10:00
parent d765161b9a
commit 85eeba982f
24 changed files with 673 additions and 320 deletions
@@ -22,8 +22,11 @@ const columnsToShow = computed(() => page.auth.user?.resolved_settings?.departur
const showColumn = (column: string) => columnsToShow.value.includes(column)
const allHeaders = [
{ title: '', key: 'airline', sortable: true },
{ title: '', key: 'airline', sortable: true, resizable: false},
{ title: 'FLIGHT', key: 'flight_number', sortable: true },
{ title: 'AIRLINE', key: 'airline.name', sortable: true},
{ title: 'IATA', key: 'airline.iata_code', sortable: true},
{ title: 'ICAO', key: 'airline.icao_code', sortable: true},
{ title: 'FROM', key: 'departure_airport', sortable: true },
{ title: 'TO', key: 'arrival_airport', sortable: true },
{ title: 'DATE', key: 'departure_date', sortable: true },
@@ -31,9 +34,16 @@ const allHeaders = [
{ title: 'ARRIVE', key: 'arrival_time', sortable: false },
{ title: 'DURATION', key: 'duration', sortable: true },
{ title: 'DISTANCE', key: 'distance', sortable: true },
{ title: 'MANUFACTURER', key: 'aircraft.manufacturer_code', sortable: true },
{ title: 'MODEL', key: 'aircraft.model_full_name', sortable: true },
{ title: 'AIRCRAFT', key: 'aircraft.display_name_short', sortable: true },
{ title: 'AIRCRAFT', key: 'aircraft', sortable: true },
{ title: 'REG', key: 'registration', sortable: true },
{ title: 'CLASS', key: 'flight_class', sortable: true },
{ title: 'CLASS', key: 'class_seat_combined', sortable: true },
{ title: 'SEAT TYPE', key: 'seat_type_id', sortable: true },
{ title: 'SEAT NO.', key: 'seat_number', sortable: true },
{ title: 'REASON', key: 'flight_reason_id', sortable: true },
{ title: '', key: 'actions', sortable: false },
]
@@ -43,16 +53,18 @@ const headers = computed(() =>
const CLASS_ORDER: Record<string, number> = {
'Unspecified': 0,
'Economy': 1,
'Premium Economy': 2,
'Business': 3,
'First': 4,
'Private': 5,
'Crew' : 6,
'General Aviation': 1,
'Economy': 2,
'Premium Economy': 3,
'Business': 4,
'First': 5,
'Private': 6,
'Crew' : 7,
}
const customKeySort = {
class_seat_combined: (a: Flight['flight_class'], b: Flight['flight_class']) => (CLASS_ORDER[a?.name ?? ''] ?? -1) - (CLASS_ORDER[b?.name ?? ''] ?? -1),
flight_class: (a: Flight['flight_class'], b: Flight['flight_class']) => (CLASS_ORDER[a?.name ?? ''] ?? -1) - (CLASS_ORDER[b?.name ?? ''] ?? -1),
class_seat_combined: (a: Flight['class_seat_combined'], b: Flight['class_seat_combined']) => (CLASS_ORDER[a] ?? -1) - (CLASS_ORDER[b] ?? -1),
airline: (a: Flight['airline'], b: Flight['airline']) => (a?.iata_code ?? '').localeCompare(b?.iata_code ?? ''),
aircraft: (a: Flight['aircraft'], b: Flight['aircraft']) => (a?.designator ?? '').localeCompare(b?.designator ?? ''),
duration: (a: any, b: any) => (a ?? 0) - (b ?? 0),
@@ -25,6 +25,21 @@ const props = defineProps<{
const page = usePage<SharedProps>()
const reasonBadgeVariant = (reason: string) => {
switch (reason) {
case 'No Particular Reason':
return 'economy'
case 'Pleasure':
return 'generic'
case 'Business':
return 'business'
case 'Crew':
return 'crew'
case 'Visiting Friends / Relatives':
return 'general_aviation'
}
}
const showColumn = (column: string) => props.columnsToShow.includes(column)
</script>
@@ -50,6 +65,19 @@ const showColumn = (column: string) => props.columnsToShow.includes(column)
</div>
</td>
<td v-if="showColumn('airline.name')" class="v-data-table__td">
<Mono >{{ flight.airline?.name }}</Mono>
</td>
<td v-if="showColumn('airline.iata_code')" class="v-data-table__td ">
<Mono muted small >{{ flight.airline?.iata_code }}</Mono>
</td>
<td v-if="showColumn('airline.icao_code')" class="v-data-table__td ">
<Mono muted small>{{ flight.airline?.icao_code }}</Mono>
</td>
<td v-if="showColumn('departure_airport')" class="v-data-table__td">
<AirportToolTip :airport="flight.departure_airport">
<Mono class="iata">{{ flight.departure_airport.display_code }}</Mono><br/>
@@ -89,6 +117,21 @@ const showColumn = (column: string) => props.columnsToShow.includes(column)
</Mono>
</td>
<td v-if="showColumn('aircraft.manufacturer_code')" class="v-data-table__td aircraft-cell">
<Mono muted small>{{ flight.aircraft?.manufacturer_code }}</Mono>
</td>
<td v-if="showColumn('aircraft.model_full_name')" class="v-data-table__td aircraft-cell">
<Mono muted small>{{ flight.aircraft?.model_full_name }}</Mono>
</td>
<td v-if="showColumn('aircraft.display_name_short')" class="v-data-table__td aircraft-cell">
<AircraftToolTip v-if="flight.aircraft" :aircraft="flight.aircraft" :flight="flight">
<Mono muted small>{{ flight.aircraft?.display_name_short }}</Mono>
</AircraftToolTip>
</td>
<td v-if="showColumn('aircraft')" class="v-data-table__td aircraft-cell">
<AircraftToolTip v-if="flight.aircraft" :aircraft="flight.aircraft" :flight="flight">
<Mono muted small>{{ flight.aircraft?.designator }}</Mono>
@@ -99,6 +142,22 @@ const showColumn = (column: string) => props.columnsToShow.includes(column)
<Mono muted smaller v-if="flight.aircraft_registration">{{ flight.aircraft_registration }}</Mono>
</td>
<td v-if="showColumn('flight_class')" class="v-data-table__td class-badges-cell">
<FlightClassBadge :flight="flight" />
</td>
<td v-if="showColumn('seat_type_id')" class="v-data-table__td class-badges-cell">
<InlineBadge v-if="flight.seat_type?.name && flight.seat_type?.name !== 'Unassigned'" variant="economy">{{ flight.seat_type?.name }}</InlineBadge>
</td>
<td v-if="showColumn('seat_number')" class="v-data-table__td class-badges-cell">
<InlineBadge v-if="flight.seat_number" variant="economy">{{ flight.seat_number }}</InlineBadge>
</td>
<td v-if="showColumn('flight_reason_id')" class="v-data-table__td class-badges-cell">
<InlineBadge v-if="flight.flight_reason" :variant="reasonBadgeVariant(flight.flight_reason.name)">{{ flight.flight_reason?.name.replace('Visiting Friends / Relatives', 'VFR') }}</InlineBadge>
</td>
<td v-if="showColumn('class_seat_combined')" class="v-data-table__td class-badges-cell">
<span class="class-cell">
<CrewTooltip v-if="flight.flight_reason?.name == 'Crew'" :crew-type="flight.crew_type!">
@@ -89,6 +89,7 @@ function timeAgo(dateStr: string): string {
overflow: hidden;
}
.card-top {
display: flex;
align-items: center;
@@ -1,10 +1,22 @@
<script setup lang="ts">
import { Link, usePage } from "@inertiajs/vue3"
import { SharedProps } from "@/Types/types"
const page = usePage<SharedProps>().props
const year = new Date().getFullYear()
</script>
<template>
<footer class="glass">
&copy; FlightsGoneBy. All rights reserved.
<span class="footer-copyright">
&copy; {{ year }} FlightsGoneBy
</span>
<span class="footer-links">
<Link v-if="page.auth.user" :href="route('support')" class="footer-link">
Support
</Link>
</span>
</footer>
</template>
@@ -15,6 +27,50 @@ footer {
min-height: 32px;
display: flex;
align-items: center;
justify-content: center;
justify-content: space-between;
padding: 0 1.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.footer-copyright {
font-family: 'Share Tech Mono', monospace;
font-size: 0.68rem;
letter-spacing: 0.12em;
text-transform: uppercase;
color: #556;
}
.footer-links {
display: flex;
align-items: center;
gap: 1rem;
}
.footer-link {
font-family: 'Share Tech Mono', monospace;
font-size: 0.68rem;
letter-spacing: 0.12em;
text-transform: uppercase;
color: #778;
text-decoration: none;
transition: color 0.15s ease;
}
.footer-link:hover {
color: #ffc107;
}
@media (max-width: 600px) {
footer {
padding: 0 1rem;
}
.footer-copyright {
font-size: 0.6rem;
}
.footer-link {
font-size: 0.6rem;
}
}
</style>
@@ -35,17 +35,36 @@ onUnmounted(() => document.removeEventListener('click', handleClickOutside))
<!-- Desktop nav -->
<nav class="nav-desktop">
<template v-if="!page.props.auth?.user">
<Link :href="route('login')" class="nav-link">Log In</Link>
<Link :href="route('register')" class="nav-link nav-link--highlight">Register</Link>
<Link :href="route('login')" class="nav-link">
<i class="mdi mdi-login" aria-hidden="true" />
Log In
</Link>
<Link :href="route('register')" class="nav-link nav-link--highlight">
<i class="mdi mdi-account-plus" aria-hidden="true" />
Register
</Link>
</template>
<template v-else>
<Link :href="route('flights.add')" class="nav-link">Add Flight</Link>
<Link :href="route('profile.view', { user: page.props.auth?.user.name })" class="nav-link">Profile</Link>
<Link :href="route('feed')" class="nav-link">Feed</Link>
<Link v-if="page.props.auth.roles.includes('admin')" :href="route('admin.dashboard')" class="nav-link">Admin</Link>
<Link :href="route('flights.add')" class="nav-link">
<i class="mdi mdi-airplane-plus" aria-hidden="true" />
Add Flight
</Link>
<Link :href="route('profile.view', { user: page.props.auth?.user.name })" class="nav-link">
<i class="mdi mdi-account" aria-hidden="true" />
Profile
</Link>
<Link :href="route('feed')" class="nav-link">
<i class="mdi mdi-timeline-text" aria-hidden="true" />
Feed
</Link>
<Link v-if="page.props.auth.roles.includes('admin')" :href="route('admin.dashboard')" class="nav-link">
<i class="mdi mdi-shield-account" aria-hidden="true" />
Admin
</Link>
<div class="dropdown" ref="dropdownRef">
<button class="nav-link dropdown-trigger" @click.stop="dropdownOpen = !dropdownOpen">
<i class="mdi mdi-account-circle" aria-hidden="true" />
{{ page.props.auth.user.name }}
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
@@ -53,10 +72,24 @@ onUnmounted(() => document.removeEventListener('click', handleClickOutside))
</svg>
</button>
<div v-if="dropdownOpen" class="dropdown-menu">
<Link :href="route('import.fr24')" class="dropdown-item">Import from FR24</Link>
<Link :href="route('user.settings')" class="dropdown-item">Settings</Link>
<Link :href="route('import.fr24')" class="dropdown-item">
<i class="mdi mdi-cloud-download" aria-hidden="true" />
Import from FR24
</Link>
<Link :href="route('user.settings')" class="dropdown-item">
<i class="mdi mdi-cog" aria-hidden="true" />
Settings
</Link>
<div class="dropdown-divider" />
<button class="dropdown-item dropdown-item--danger" @click="logout">Log Out</button>
<Link :href="route('support')" class="dropdown-item">
<i class="mdi mdi-lifebuoy" aria-hidden="true" />
Support
</Link>
<div class="dropdown-divider" />
<button class="dropdown-item dropdown-item--danger" @click="logout">
<i class="mdi mdi-logout" aria-hidden="true" />
Log Out
</button>
</div>
</div>
</template>
@@ -71,18 +104,47 @@ onUnmounted(() => document.removeEventListener('click', handleClickOutside))
<Transition name="slide">
<nav v-if="menuOpen" class="nav-mobile" @click.stop>
<template v-if="!page.props.auth?.user">
<Link :href="route('login')" class="nav-link" @click="menuOpen = false">Log In</Link>
<Link :href="route('register')" class="nav-link nav-link--highlight" @click="menuOpen = false">Register</Link>
<Link :href="route('login')" class="nav-link" @click="menuOpen = false">
<i class="mdi mdi-login" aria-hidden="true" />
Log In
</Link>
<Link :href="route('register')" class="nav-link nav-link--highlight" @click="menuOpen = false">
<i class="mdi mdi-account-plus" aria-hidden="true" />
Register
</Link>
</template>
<template v-else>
<span class="nav-greeting">Welcome, {{ page.props.auth.user.name }}</span>
<Link :href="route('flights.add')" class="nav-link" @click="menuOpen = false">Add Flight</Link>
<Link :href="route('profile.view', { user: page.props.auth.user.name })" class="nav-link" @click="menuOpen = false">Profile</Link>
<Link :href="route('feed')" class="nav-link nav-link" @click="menuOpen = false">Feed</Link>
<Link :href="route('import.fr24')" class="nav-link" @click="menuOpen = false">Import from FR24</Link>
<Link :href="route('user.settings')" class="nav-link" @click="menuOpen = false">Settings</Link>
<Link :href="route('flights.add')" class="nav-link" @click="menuOpen = false">
<i class="mdi mdi-airplane-plus" aria-hidden="true" />
Add Flight
</Link>
<Link :href="route('profile.view', { user: page.props.auth.user.name })" class="nav-link" @click="menuOpen = false">
<i class="mdi mdi-account" aria-hidden="true" />
Profile
</Link>
<Link :href="route('feed')" class="nav-link nav-link" @click="menuOpen = false">
<i class="mdi mdi-timeline-text" aria-hidden="true" />
Feed
</Link>
<Link :href="route('import.fr24')" class="nav-link" @click="menuOpen = false">
<i class="mdi mdi-cloud-download" aria-hidden="true" />
Import from FR24
</Link>
<Link :href="route('user.settings')" class="nav-link" @click="menuOpen = false">
<i class="mdi mdi-cog" aria-hidden="true" />
Settings
</Link>
<div class="dropdown-divider" />
<button class="nav-link nav-link--danger" @click="logout">Log Out</button>
<Link :href="route('support')" class="dropdown-item">
<i class="mdi mdi-lifebuoy" aria-hidden="true" />
Support
</Link>
<div class="dropdown-divider" />
<button class="nav-link nav-link--danger" @click="logout">
<i class="mdi mdi-logout" aria-hidden="true" />
Log Out
</button>
</template>
</nav>
</Transition>
@@ -121,7 +183,7 @@ header {
.nav-link {
display: flex;
align-items: center;
gap: 0.3em;
gap: 0.4em;
height: 100%;
padding: 0.3em 0.75em;
font-size: 0.875rem;
@@ -136,6 +198,12 @@ header {
transition: color 0.15s ease, background 0.15s ease;
}
.nav-link .mdi {
font-size: 1rem;
line-height: 1;
opacity: 0.8;
}
.nav-link:visited {
color: var(--text);
}
@@ -193,7 +261,9 @@ header {
}
.dropdown-item {
display: block;
display: flex;
align-items: center;
gap: 0.5em;
width: 100%;
padding: 0.4em 0.75em;
font-size: 0.875rem;
@@ -209,6 +279,12 @@ header {
transition: color 0.15s ease, background 0.15s ease;
}
.dropdown-item .mdi {
font-size: 1rem;
line-height: 1;
opacity: 0.8;
}
.dropdown-item:hover {
color: var(--accent);
background: rgba(56, 189, 248, 0.07);
@@ -0,0 +1,11 @@
<script setup lang="ts">
</script>
<template>
</template>
<style scoped>
</style>