Compare commits
20
Commits
cf1a2f6cba
...
1.4.4
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
f31f1bc2fc | ||
|
|
91a6873b64 | ||
|
|
4a9b1ad56a | ||
|
|
ad61508b3c | ||
|
|
95ed0e339f | ||
|
|
4102dd29ef | ||
|
|
28fd782a40 | ||
|
|
3c66a3945c | ||
|
|
a68e31dad7 | ||
|
|
023ce6f964 | ||
|
|
c66c734868 | ||
|
|
94a7bc2807 | ||
|
|
4a296705a6 | ||
|
|
a6bf1c09fe | ||
|
|
ef73dc0bc3 | ||
|
|
b395de6719 | ||
|
|
3b4ded2fab | ||
|
|
5492cc72d7 | ||
|
|
76118d0bfd | ||
|
|
c0b8d10add |
@@ -17,7 +17,10 @@ class PopulateAirportTimezones extends Command
|
||||
*/
|
||||
public function handle()
|
||||
{
|
||||
Airport::whereNull('timezone')->chunkById(100, function ($airports) {
|
||||
Airport::where(function ($query) {
|
||||
$query->whereNull('timezone')
|
||||
->orWhere('timezone', 'Undefined');
|
||||
})->chunkById(100, function ($airports) {
|
||||
foreach ($airports as $airport) {
|
||||
$zoneName = null;
|
||||
$attempts = 0;
|
||||
|
||||
@@ -7,6 +7,7 @@ use App\Models\IgnoredMissingLivery;
|
||||
use App\Models\User;
|
||||
use App\Models\UserFlight;
|
||||
use App\Services\AdminService;
|
||||
use Illuminate\Http\JsonResponse;
|
||||
use Illuminate\Http\Request;
|
||||
use Illuminate\Support\Carbon;
|
||||
use Inertia\Inertia;
|
||||
@@ -66,4 +67,17 @@ class AdminController extends Controller
|
||||
return back();
|
||||
}
|
||||
|
||||
public function ignoreMissingAirline(Request $request): JsonResponse
|
||||
{
|
||||
$validated = $request->validate([
|
||||
'flight_id' => ['required', 'integer', 'exists:user_flights,id'],
|
||||
]);
|
||||
|
||||
$flight = UserFlight::findOrFail($validated['flight_id']);
|
||||
|
||||
$flight->ignoreMissingAirline()->firstOrCreate([]);
|
||||
|
||||
return response()->json(['status' => 'ok']);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -245,15 +245,19 @@ class FlightController extends Controller
|
||||
$newFlight = auth()->user()->flights()->create($this->flightPayload($validated));
|
||||
|
||||
UserAction::create([
|
||||
'user_id' => $newFlight->user_id,
|
||||
'type' => $newFlight->departure_date->isFuture() ? 'flight_booked' : 'flight_logged',
|
||||
'data' => [
|
||||
'user_id' => $newFlight->user_id,
|
||||
'type' => $newFlight->departure_date->isFuture() ? 'flight_booked' : 'flight_logged',
|
||||
'data' => [
|
||||
'flight' => $newFlight->snapshot($newFlight->id),
|
||||
],
|
||||
]);
|
||||
|
||||
if ($request->boolean('add_more')) {
|
||||
return redirect()->route('flights.add')
|
||||
->with('success', 'Flight saved. Add another below.');
|
||||
}
|
||||
|
||||
return redirect()->route('profile.departure-board', [Auth::user()->name, $newFlight->id]);
|
||||
return redirect()->route('profile.flight', [Auth::user()->name, $newFlight->id]);
|
||||
}
|
||||
|
||||
|
||||
|
||||
@@ -58,28 +58,50 @@ class SearchController extends Controller
|
||||
{
|
||||
$q = request('q', '');
|
||||
$len = strlen($q);
|
||||
$showClosed = request()->boolean('show_closed');
|
||||
$showNoCode = request()->boolean('show_no_code');
|
||||
|
||||
if ($len < 3) return [];
|
||||
|
||||
return Airport::with('region.country')
|
||||
->when(!$showClosed, fn($query) => $query->where('active', true))
|
||||
->when(!$showNoCode, fn($query) => $query->where(function ($sub) {
|
||||
$sub->whereNotNull('iata_code')
|
||||
->orWhereNotNull('icao_code');
|
||||
}))
|
||||
->when($len === 3, fn($query) => $query->where('iata_code', 'ilike', $q))
|
||||
->when($len >= 4, fn($query) => $query->where(function ($sub) use ($q, $len) {
|
||||
$sub->when($len === 4, fn($s) => $s->where('icao_code', 'ilike', $q))
|
||||
->orWhere('name', 'ilike', "%{$q}%")
|
||||
->orWhere('municipality', 'ilike', "%{$q}%");
|
||||
})->orderByRaw("
|
||||
CASE
|
||||
WHEN icao_code = ? THEN 0
|
||||
WHEN iata_code = ? THEN 1
|
||||
ELSE 2
|
||||
END
|
||||
", [$q, $q]))
|
||||
}))
|
||||
->orderByRaw("
|
||||
CASE
|
||||
WHEN active THEN 0
|
||||
ELSE 1
|
||||
END
|
||||
")
|
||||
->orderByRaw("
|
||||
CASE
|
||||
WHEN iata_code IS NOT NULL AND icao_code IS NOT NULL THEN 0
|
||||
WHEN iata_code IS NOT NULL OR icao_code IS NOT NULL THEN 1
|
||||
ELSE 2
|
||||
END
|
||||
")
|
||||
->orderByRaw("
|
||||
CASE
|
||||
WHEN icao_code = ? THEN 0
|
||||
WHEN iata_code = ? THEN 1
|
||||
ELSE 2
|
||||
END
|
||||
", [$q, $q])
|
||||
->limit(15)
|
||||
->get(['id', 'name', 'municipality', 'iata_code', 'icao_code', 'region_id'])
|
||||
->map(fn($airport) => [
|
||||
->get(['id', 'name', 'municipality', 'iata_code', 'icao_code', 'region_id', 'active'])
|
||||
->map(fn(Airport $airport) => [
|
||||
'value' => $airport->id,
|
||||
'title' => $airport->display_name,
|
||||
'country_code' => strtolower($airport->region->country->code),
|
||||
'active' => $airport->active,
|
||||
])
|
||||
->values();
|
||||
}
|
||||
|
||||
@@ -3,6 +3,7 @@
|
||||
namespace App\Http\Controllers;
|
||||
|
||||
use App\Models\Achievement;
|
||||
use App\Models\AchievementCategory;
|
||||
use App\Models\Aircraft;
|
||||
use App\Models\Airport;
|
||||
use App\Models\Alliance;
|
||||
@@ -105,8 +106,14 @@ class UserProfileController extends Controller
|
||||
$achievements = Achievement::with(['category', 'difficulty'])
|
||||
->orderBy('id', 'asc')
|
||||
->get()
|
||||
->groupBy(fn(Achievement $a) => $a->category->name)
|
||||
->map(fn($group) => $group->sortBy('sort_order')->values());
|
||||
->groupBy(fn(Achievement $a) => $a->category->internal_name)
|
||||
->sortBy(function ($group, $internalName) {
|
||||
$index = array_search($internalName, AchievementCategory::ORDER);
|
||||
return $index === false ? PHP_INT_MAX : $index;
|
||||
})
|
||||
->mapWithKeys(fn($group) => [
|
||||
$group->first()->category->name => $group->sortBy('sort_order')->values(),
|
||||
]);
|
||||
|
||||
$userAchievements = $user->achievements()
|
||||
->with('achievement')
|
||||
|
||||
@@ -16,6 +16,16 @@ use Illuminate\Database\Eloquent\Relations\HasMany;
|
||||
*/
|
||||
class AchievementCategory extends Model
|
||||
{
|
||||
const array ORDER = [
|
||||
'number_of_flights',
|
||||
'distance',
|
||||
'general_flying',
|
||||
'countries_and_continents',
|
||||
'aircraft',
|
||||
'airlines_and_alliances',
|
||||
'fun_challenges',
|
||||
];
|
||||
|
||||
protected $fillable = [
|
||||
'internal_name',
|
||||
'name',
|
||||
|
||||
@@ -20,12 +20,14 @@ class Airport extends Model
|
||||
'icao_code',
|
||||
'iata_code',
|
||||
'local_code',
|
||||
'active',
|
||||
];
|
||||
|
||||
protected $casts = [
|
||||
'latitude_deg' => 'float',
|
||||
'longitude_deg' => 'float',
|
||||
'elevation_ft' => 'integer',
|
||||
'active' => 'boolean',
|
||||
];
|
||||
|
||||
protected $appends = [
|
||||
@@ -37,6 +39,8 @@ class Airport extends Model
|
||||
'LHR', 'LGW', 'STN', 'LTN', 'LCY', 'SEN',
|
||||
];
|
||||
|
||||
|
||||
|
||||
protected function displayName() : Attribute{
|
||||
return Attribute::make(
|
||||
get: function () {
|
||||
@@ -53,6 +57,11 @@ class Airport extends Model
|
||||
);
|
||||
}
|
||||
|
||||
public function scopeActive($query)
|
||||
{
|
||||
return $query->where('active', true);
|
||||
}
|
||||
|
||||
public function region(): BelongsTo
|
||||
{
|
||||
return $this->belongsTo(Region::class);
|
||||
|
||||
@@ -9,6 +9,7 @@ use Illuminate\Database\Eloquent\Casts\Attribute;
|
||||
use Carbon\Carbon;
|
||||
use Illuminate\Database\Eloquent\Model;
|
||||
use Illuminate\Database\Eloquent\Relations\BelongsTo;
|
||||
use Illuminate\Database\Eloquent\Relations\HasOne;
|
||||
use Illuminate\Support\Collection;
|
||||
use Illuminate\Support\Facades\Storage;
|
||||
|
||||
@@ -271,6 +272,16 @@ class UserFlight extends Model
|
||||
}
|
||||
|
||||
|
||||
public function ignoreMissingAirline(): HasOne
|
||||
{
|
||||
return $this->hasOne(UserFlightIgnoreMissingAirline::class);
|
||||
}
|
||||
|
||||
public function isIgnoringMissingAirline(): bool
|
||||
{
|
||||
return $this->ignoreMissingAirline()->exists();
|
||||
}
|
||||
|
||||
public function aircraft(): BelongsTo
|
||||
{
|
||||
return $this->belongsTo(Aircraft::class);
|
||||
|
||||
@@ -0,0 +1,20 @@
|
||||
<?php
|
||||
|
||||
namespace App\Models;
|
||||
|
||||
use Illuminate\Database\Eloquent\Model;
|
||||
use Illuminate\Database\Eloquent\Relations\BelongsTo;
|
||||
|
||||
class UserFlightIgnoreMissingAirline extends Model
|
||||
{
|
||||
protected $table = 'user_flights_ignore_missing_airlines';
|
||||
|
||||
protected $fillable = [
|
||||
'user_flight_id',
|
||||
];
|
||||
|
||||
public function userFlight(): BelongsTo
|
||||
{
|
||||
return $this->belongsTo(UserFlight::class);
|
||||
}
|
||||
}
|
||||
@@ -98,7 +98,8 @@ class AchievementService
|
||||
->where('achievement_id', $achievement->id)
|
||||
->first();
|
||||
|
||||
$alreadyUnlocked = $existing !== null;
|
||||
$alreadyUnlocked = $existing !== null
|
||||
&& (! $achievement->progressive || $existing->progress >= $achievement->threshold);
|
||||
|
||||
UserAchievement::updateOrCreate(
|
||||
['user_id' => $user->id, 'achievement_id' => $achievement->id],
|
||||
|
||||
@@ -51,26 +51,28 @@ class AdminService
|
||||
{
|
||||
$flights = UserFlight::whereNotNull('flight_number')
|
||||
->whereNull('airline_id')
|
||||
->with('user:id,name') // adjust to your actual user relation/columns
|
||||
->whereDoesntHave('ignoreMissingAirline')
|
||||
->with('user:id,name')
|
||||
->get(['id', 'flight_number', 'user_id']);
|
||||
|
||||
return $flights
|
||||
->map(function ($flight) {
|
||||
// Extract the 2-character IATA-style prefix (letters and/or digits)
|
||||
preg_match('/^([A-Za-z0-9]{2})\d+/', trim($flight->flight_number), $matches);
|
||||
|
||||
return [
|
||||
'id' => $flight->id,
|
||||
'code' => $matches[1] ?? null,
|
||||
'flight_number' => $flight->flight_number,
|
||||
'link' => "/u/{$flight->user->name}/flight/{$flight->id}",
|
||||
];
|
||||
})
|
||||
->filter(fn ($f) => $f['code'] !== null) // drop any that didn't match the pattern
|
||||
->filter(fn ($f) => $f['code'] !== null)
|
||||
->groupBy('code')
|
||||
->map(function ($group, $code) {
|
||||
return [
|
||||
'code' => $code,
|
||||
'flights' => $group->map(fn ($f) => [
|
||||
'id' => $f['id'],
|
||||
'flight_number' => $f['flight_number'],
|
||||
'link' => $f['link'],
|
||||
])->values()->all(),
|
||||
|
||||
@@ -72,7 +72,7 @@ class SettingsRegistry
|
||||
'type' => 'select',
|
||||
'label' => 'Default Page',
|
||||
'category' => 'FlightsGoneBy Settings',
|
||||
'default' => 'feed_first',
|
||||
'default' => 'profile',
|
||||
'options' => [
|
||||
['value' => 'feed_first', 'label' => 'My Feed if Following People, My Profile if Not'],
|
||||
['value' => 'profile', 'label' => 'My Profile'],
|
||||
@@ -155,7 +155,7 @@ class SettingsRegistry
|
||||
['value' => 'seat_type_id', 'label' => 'Seat Type'],
|
||||
['value' => 'seat_number', 'label' => 'Seat Number'],
|
||||
['value' => 'flight_reason_id', 'label' => 'Reason'],
|
||||
|
||||
['value' => 'note', 'label' => 'Note'],
|
||||
['value' => 'aircraft.display_name_short', 'label' => 'Aircraft Full Name'],
|
||||
['value' => 'class_seat_combined', 'label' => 'Class/Seat Type/Seat Number Combined'],
|
||||
],
|
||||
|
||||
+1
-1
@@ -67,7 +67,7 @@ return Application::configure(basePath: dirname(__DIR__))
|
||||
'message' => 'You don\'t have permission to access this page.',
|
||||
],
|
||||
404 => [
|
||||
'title' => 'You Flight Has Been Cancelled',
|
||||
'title' => 'Your Flight Has Been Cancelled',
|
||||
'message' => 'The page you are looking for doesn\'t exist or has been moved.',
|
||||
],
|
||||
419 => [
|
||||
|
||||
@@ -0,0 +1,26 @@
|
||||
<?php
|
||||
|
||||
use Illuminate\Database\Migrations\Migration;
|
||||
use Illuminate\Database\Schema\Blueprint;
|
||||
use Illuminate\Support\Facades\Schema;
|
||||
|
||||
return new class extends Migration
|
||||
{
|
||||
public function up(): void
|
||||
{
|
||||
Schema::create('user_flights_ignore_missing_airlines', function (Blueprint $table) {
|
||||
$table->id();
|
||||
$table->foreignId('user_flight_id')
|
||||
->constrained('user_flights')
|
||||
->cascadeOnDelete();
|
||||
$table->timestamps();
|
||||
|
||||
$table->unique('user_flight_id');
|
||||
});
|
||||
}
|
||||
|
||||
public function down(): void
|
||||
{
|
||||
Schema::dropIfExists('user_flights_ignore_missing_airlines');
|
||||
}
|
||||
};
|
||||
@@ -0,0 +1,57 @@
|
||||
<?php
|
||||
|
||||
use App\Models\Achievement;
|
||||
use App\Models\AchievementCategory;
|
||||
use Illuminate\Database\Migrations\Migration;
|
||||
|
||||
return new class extends Migration
|
||||
{
|
||||
public function up(): void
|
||||
{
|
||||
$newCategory = AchievementCategory::create([
|
||||
'internal_name' => 'number_of_flights',
|
||||
'name' => 'Number of Flights',
|
||||
'description' => 'Achievements for reaching flight count milestones.',
|
||||
]);
|
||||
|
||||
$achievementsToUpdate = [
|
||||
'general_flying.first_flight',
|
||||
'general_flying.10_flights',
|
||||
'general_flying.500_flights',
|
||||
'general_flying.50_flights',
|
||||
'general_flying.100_flights',
|
||||
'general_flying.1000_flights',
|
||||
];
|
||||
|
||||
foreach ($achievementsToUpdate as $internalName) {
|
||||
$achievement = Achievement::where('internal_name', $internalName)->first();
|
||||
|
||||
if (!$achievement) {
|
||||
continue; // or throw, depending how strict you want this
|
||||
}
|
||||
|
||||
$achievement->update([
|
||||
'achievement_category_id' => $newCategory->id,
|
||||
'internal_name' => str_replace('general_flying.', 'number_of_flights.', $internalName),
|
||||
]);
|
||||
}
|
||||
}
|
||||
|
||||
public function down(): void
|
||||
{
|
||||
$oldCategory = AchievementCategory::where('internal_name', 'general_flying')->first();
|
||||
|
||||
if ($oldCategory) {
|
||||
Achievement::where('internal_name', 'like', 'number_of_flights.%')
|
||||
->get()
|
||||
->each(function (Achievement $achievement) use ($oldCategory) {
|
||||
$achievement->update([
|
||||
'achievement_category_id' => $oldCategory->id,
|
||||
'internal_name' => str_replace('number_of_flights.', 'general_flying.', $achievement->internal_name),
|
||||
]);
|
||||
});
|
||||
}
|
||||
|
||||
AchievementCategory::where('internal_name', 'number_of_flights')->delete();
|
||||
}
|
||||
};
|
||||
@@ -0,0 +1,133 @@
|
||||
<?php
|
||||
|
||||
use App\Models\Airport;
|
||||
use Illuminate\Database\Migrations\Migration;
|
||||
use Illuminate\Database\Schema\Blueprint;
|
||||
use Illuminate\Support\Facades\Schema;
|
||||
|
||||
return new class extends Migration
|
||||
{
|
||||
/**
|
||||
* Run the migrations.
|
||||
*/
|
||||
public function up(): void
|
||||
{
|
||||
Schema::table('airports', function (Blueprint $table) {
|
||||
$table->boolean('active')->default(true);
|
||||
});
|
||||
|
||||
Airport::whereIataCode('TXL')->update(['active' => false]);
|
||||
$this->importCsv();
|
||||
}
|
||||
|
||||
/**
|
||||
* Reverse the migrations.
|
||||
*/
|
||||
public function down(): void
|
||||
{
|
||||
Schema::table('airports', function (Blueprint $table) {
|
||||
$table->dropColumn('active');
|
||||
});
|
||||
}
|
||||
|
||||
private function importCsv(): void
|
||||
{
|
||||
$path = storage_path('app/private/seed_data/airports.csv');
|
||||
|
||||
if (! file_exists($path)) {
|
||||
throw new \RuntimeException("Airports CSV not found at: {$path}");
|
||||
}
|
||||
|
||||
$handle = fopen($path, 'rb');
|
||||
|
||||
if ($handle === false) {
|
||||
throw new \RuntimeException("Failed to open airports CSV at: {$path}");
|
||||
}
|
||||
|
||||
// Skip header row
|
||||
fgetcsv($handle);
|
||||
|
||||
$regionMap = DB::table('regions')->pluck('id', 'code')->all();
|
||||
|
||||
$batch = [];
|
||||
$batchSize = 500;
|
||||
$now = now()->toDateTimeString();
|
||||
|
||||
while (($row = fgetcsv($handle)) !== false) {
|
||||
if (count($row) < 19) {
|
||||
continue;
|
||||
}
|
||||
|
||||
// id, ident, type, name, latitude_deg, longitude_deg, elevation_ft,
|
||||
// continent, iso_country, iso_region, municipality, scheduled_service,
|
||||
// icao_code, iata_code, gps_code, local_code, home_link, wikipedia_link, keywords
|
||||
[
|
||||
,
|
||||
,
|
||||
$type,
|
||||
$name,
|
||||
$latitudeDeg,
|
||||
$longitudeDeg,
|
||||
$elevationFt,
|
||||
,
|
||||
,
|
||||
$isoRegion,
|
||||
$municipality,
|
||||
,
|
||||
$icaoCode,
|
||||
$iataCode,
|
||||
,
|
||||
$localCode,
|
||||
] = $row;
|
||||
|
||||
$icaoCode = trim(str_replace(["\r", "\n"], '', $icaoCode));
|
||||
$iataCode = trim(str_replace(["\r", "\n"], '', $iataCode));
|
||||
|
||||
// Only importing airports with no IATA/ICAO code — coded airports are already in the DB
|
||||
if ($icaoCode !== '' || $iataCode !== '') {
|
||||
continue;
|
||||
}
|
||||
|
||||
$type = trim($type);
|
||||
$name = trim($name);
|
||||
$localCode = trim($localCode);
|
||||
$isoRegion = trim($isoRegion);
|
||||
|
||||
if (! isset($regionMap[$isoRegion])) {
|
||||
continue;
|
||||
}
|
||||
|
||||
$elevationFt = trim($elevationFt);
|
||||
|
||||
$batch[] = [
|
||||
'type' => $type,
|
||||
'name' => $name,
|
||||
'latitude_deg' => (float) trim($latitudeDeg),
|
||||
'longitude_deg' => (float) trim($longitudeDeg),
|
||||
'elevation_ft' => $elevationFt !== '' ? (int) $elevationFt : null,
|
||||
'region_id' => $regionMap[$isoRegion],
|
||||
'municipality' => trim($municipality) !== '' ? trim($municipality) : null,
|
||||
'icao_code' => null,
|
||||
'iata_code' => null,
|
||||
'local_code' => $localCode !== '' ? $localCode : null,
|
||||
'timezone' => 'Undefined',
|
||||
'active' => $type !== 'closed',
|
||||
'created_at' => $now,
|
||||
'updated_at' => $now,
|
||||
];
|
||||
|
||||
echo "Added: {$name}\n";
|
||||
|
||||
if (count($batch) >= $batchSize) {
|
||||
DB::table('airports')->insert($batch);
|
||||
$batch = [];
|
||||
}
|
||||
}
|
||||
|
||||
fclose($handle);
|
||||
|
||||
if (! empty($batch)) {
|
||||
DB::table('airports')->insert($batch);
|
||||
}
|
||||
}
|
||||
};
|
||||
@@ -1,25 +1,63 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, computed } from "vue"
|
||||
import axios from "axios"
|
||||
import { MissingAirline } from "@/Types/types"
|
||||
|
||||
defineProps<{
|
||||
const props = defineProps<{
|
||||
airline: MissingAirline
|
||||
}>()
|
||||
|
||||
// Track ids we've dismissed locally (optimistic UI) and ones currently in-flight
|
||||
const dismissedIds = ref<Set<number>>(new Set())
|
||||
const pendingIds = ref<Set<number>>(new Set())
|
||||
|
||||
const visibleFlights = computed(() =>
|
||||
props.airline.flights.filter(flight => !dismissedIds.value.has(flight.id))
|
||||
)
|
||||
|
||||
async function dismissFlight(flightId: number) {
|
||||
if (pendingIds.value.has(flightId)) return
|
||||
|
||||
pendingIds.value.add(flightId)
|
||||
// Optimistically remove the pill
|
||||
dismissedIds.value.add(flightId)
|
||||
|
||||
try {
|
||||
await axios.post('/admin/ignore-missing-airline', {
|
||||
flight_id: flightId,
|
||||
})
|
||||
} catch (error) {
|
||||
// Revert on failure so the flight isn't silently lost from view
|
||||
dismissedIds.value.delete(flightId)
|
||||
console.error('Failed to ignore missing airline for flight', flightId, error)
|
||||
} finally {
|
||||
pendingIds.value.delete(flightId)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="missing-airline-card">
|
||||
<div class="card-header">
|
||||
<span class="airline-code">{{ airline.code }}</span>
|
||||
<span class="flight-count">{{ airline.flights.length }} flight{{ airline.flights.length === 1 ? '' : 's' }}</span>
|
||||
<span class="flight-count">{{ visibleFlights.length }} flight{{ visibleFlights.length === 1 ? '' : 's' }}</span>
|
||||
</div>
|
||||
|
||||
<ul class="flight-list">
|
||||
<li v-for="flight in airline.flights" :key="flight.link" class="flight-item">
|
||||
<a :href="flight.link" class="flight-link" target="_blank" rel="noopener">
|
||||
<div class="flight-list">
|
||||
<v-chip
|
||||
v-for="flight in visibleFlights"
|
||||
:key="flight.link"
|
||||
class="flight-chip"
|
||||
size="small"
|
||||
closable
|
||||
:disabled="pendingIds.has(flight.id)"
|
||||
@click:close="dismissFlight(flight.id)"
|
||||
>
|
||||
<a :href="flight.link" class="flight-link" target="_blank" rel="noopener" @click.stop>
|
||||
{{ flight.flight_number }}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</v-chip>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -62,30 +100,23 @@ defineProps<{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.5rem;
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.flight-item {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.flight-link {
|
||||
.flight-chip {
|
||||
font-family: 'Share Tech Mono', monospace;
|
||||
font-size: 0.72rem;
|
||||
letter-spacing: 0.06em;
|
||||
background: rgba(255, 255, 255, 0.04) !important;
|
||||
border: 1px solid rgba(255, 255, 255, 0.06);
|
||||
}
|
||||
|
||||
.flight-link {
|
||||
color: #9fb3c8;
|
||||
text-decoration: none;
|
||||
background: rgba(255, 255, 255, 0.04);
|
||||
border: 1px solid rgba(255, 255, 255, 0.06);
|
||||
border-radius: 4px;
|
||||
padding: 0.25rem 0.5rem;
|
||||
transition: color 0.15s ease, border-color 0.15s ease;
|
||||
transition: color 0.15s ease;
|
||||
}
|
||||
|
||||
.flight-link:hover {
|
||||
color: #ffc107;
|
||||
border-color: rgba(255, 193, 7, 0.4);
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, nextTick } from 'vue'
|
||||
import { ref, nextTick, watch } from 'vue'
|
||||
import axios from 'axios'
|
||||
|
||||
const props = defineProps<{
|
||||
@@ -12,8 +12,14 @@ const model = defineModel<{ value: number, title: string, country_code: string }
|
||||
|
||||
const airportOptions = ref(props.prefilledOptions ?? [])
|
||||
const autocompleteRef = ref<any>(null)
|
||||
const showClosed = ref(false)
|
||||
const showNoCode = ref(false)
|
||||
const lastQuery = ref('')
|
||||
const menuOpen = ref(false)
|
||||
|
||||
const onFocus = () => {
|
||||
menuOpen.value = true
|
||||
|
||||
nextTick(() => {
|
||||
const input = autocompleteRef.value?.$el?.querySelector('input')
|
||||
input?.select()
|
||||
@@ -21,6 +27,8 @@ const onFocus = () => {
|
||||
}
|
||||
|
||||
const searchAirports = async (query: string) => {
|
||||
lastQuery.value = query
|
||||
|
||||
if (!query || query.length < 2) {
|
||||
airportOptions.value = props.prefilledOptions ?? []
|
||||
return
|
||||
@@ -28,15 +36,27 @@ const searchAirports = async (query: string) => {
|
||||
|
||||
if (query === model.value?.title) return
|
||||
|
||||
const { data } = await axios.get('/search/airports', { params: { q: query } })
|
||||
const { data } = await axios.get('/search/airports', {
|
||||
params: {
|
||||
q: query,
|
||||
show_closed: showClosed.value ? 1 : undefined,
|
||||
show_no_code: showNoCode.value ? 1 : undefined,
|
||||
},
|
||||
})
|
||||
airportOptions.value = data
|
||||
}
|
||||
|
||||
// Re-run the last search when either checkbox is toggled, so results update immediately
|
||||
watch([showClosed, showNoCode], () => {
|
||||
if (lastQuery.value) searchAirports(lastQuery.value)
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<v-autocomplete
|
||||
ref="autocompleteRef"
|
||||
v-model="model"
|
||||
v-model:menu="menuOpen"
|
||||
:label="label ?? 'Airport'"
|
||||
:items="airportOptions"
|
||||
:error-messages="errorMessages"
|
||||
@@ -48,6 +68,7 @@ const searchAirports = async (query: string) => {
|
||||
clearable
|
||||
hide-no-data
|
||||
return-object
|
||||
autocomplete="off"
|
||||
:custom-filter="() => true"
|
||||
>
|
||||
<template #prepend-inner>
|
||||
@@ -55,6 +76,27 @@ const searchAirports = async (query: string) => {
|
||||
<span v-if="model" :class="`fi fi-${model.country_code}`"></span>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<template #prepend-item>
|
||||
<div class="px-4 py-1 d-flex align-center" style="gap: 16px;" @mousedown.prevent>
|
||||
<v-checkbox
|
||||
v-model="showClosed"
|
||||
label="Show Closed Airports"
|
||||
density="compact"
|
||||
hide-details
|
||||
style="flex: none; transform: scale(0.65); transform-origin: left center;"
|
||||
/>
|
||||
<v-checkbox
|
||||
v-model="showNoCode"
|
||||
label="Show Airports with No Code"
|
||||
density="compact"
|
||||
hide-details
|
||||
style="flex: none; transform: scale(0.65); transform-origin: left center;"
|
||||
/>
|
||||
</div>
|
||||
<v-divider class="mt-1" />
|
||||
</template>
|
||||
|
||||
<template #item="{ item, props: itemProps }">
|
||||
<v-list-item v-bind="itemProps">
|
||||
<template #prepend>
|
||||
@@ -62,7 +104,6 @@ const searchAirports = async (query: string) => {
|
||||
<span :class="`fi fi-${item.country_code}`"></span>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
</v-list-item>
|
||||
</template>
|
||||
</v-autocomplete>
|
||||
|
||||
@@ -17,7 +17,7 @@ const props = defineProps<{
|
||||
const page = usePage<SharedProps>().props
|
||||
const ITEMS_PER_PAGE = 25
|
||||
|
||||
const defaultColumns = ['airline', 'flight_number', 'departure_airport', 'arrival_airport', 'departure_date', 'departure_time', 'arrival_time', 'duration', 'distance', 'aircraft', 'registration', 'class_seat_combined']
|
||||
const defaultColumns = ['airline', 'flight_number', 'departure_airport', 'arrival_airport', 'departure_date', 'departure_time', 'arrival_time', 'duration', 'distance', 'aircraft', 'registration', 'class_seat_combined', 'note']
|
||||
const columnsToShow = computed(() => page.auth.user?.resolved_settings?.departure_board_columns ?? defaultColumns)
|
||||
const showColumn = (column: string) => columnsToShow.value.includes(column)
|
||||
|
||||
@@ -44,6 +44,7 @@ const allHeaders = [
|
||||
{ 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: 'NOTE', key: 'note', sortable: true },
|
||||
{ title: '', key: 'actions', sortable: false },
|
||||
]
|
||||
|
||||
|
||||
@@ -41,7 +41,7 @@ const reasonBadgeVariant = (reason: string) => {
|
||||
}
|
||||
|
||||
const showColumn = (column: string) => props.columnsToShow.includes(column)
|
||||
|
||||
console.log(props.columnsToShow)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -170,6 +170,10 @@ const showColumn = (column: string) => props.columnsToShow.includes(column)
|
||||
</span>
|
||||
</td>
|
||||
|
||||
<td v-if="showColumn('note')" class="v-data-table__td note-cell">
|
||||
<span v-if="flight.note" class="note-text">{{ flight.note }}</span>
|
||||
</td>
|
||||
|
||||
<td class="v-data-table__td actions-cell">
|
||||
<UserFlightContextMenu :profile-user="user" :can-edit="canEdit" :flight="flight" />
|
||||
</td>
|
||||
@@ -184,6 +188,17 @@ const showColumn = (column: string) => props.columnsToShow.includes(column)
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
|
||||
.note-cell {
|
||||
min-width: 200px;
|
||||
max-width: 320px;
|
||||
}
|
||||
|
||||
.note-text {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.city-name{
|
||||
color: #556;
|
||||
text-transform: uppercase;
|
||||
@@ -211,23 +226,14 @@ const showColumn = (column: string) => props.columnsToShow.includes(column)
|
||||
align-items: center;
|
||||
vertical-align: middle;
|
||||
gap: 0.5rem;
|
||||
overflow-x: auto;
|
||||
max-width: 160px;
|
||||
/* Hide scrollbar but keep functionality */
|
||||
scrollbar-width: none;
|
||||
&::-webkit-scrollbar { display: none; }
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
.iata {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.class-cell {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
vertical-align: middle;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
|
||||
.actions-cell {
|
||||
width: 40px;
|
||||
@@ -277,15 +283,5 @@ const showColumn = (column: string) => props.columnsToShow.includes(column)
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.class-badges-cell {
|
||||
max-width: 140px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.class-cell > *:not(:first-child) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -370,13 +370,37 @@ export default defineComponent({
|
||||
link.click()
|
||||
}
|
||||
|
||||
function loopPoints(origin: LngLat, radiusDeg = 0.2, steps = 48): LngLat[] {
|
||||
const [lng, lat] = origin
|
||||
|
||||
// Widen the longitude radius to compensate for mercator distortion at this latitude
|
||||
const lngRadius = radiusDeg / Math.max(Math.cos(lat * Math.PI / 180), 0.15)
|
||||
|
||||
// Center the loop above the origin so the airport point sits at the bottom of the loop
|
||||
const centerLat = lat + radiusDeg
|
||||
|
||||
const points: LngLat[] = []
|
||||
for (let i = 0; i <= steps; i++) {
|
||||
const theta = (i / steps) * Math.PI * 2
|
||||
points.push([
|
||||
lng + Math.sin(theta) * lngRadius,
|
||||
centerLat - radiusDeg * Math.cos(theta),
|
||||
])
|
||||
}
|
||||
return points // first and last point === origin, at the bottom of the loop
|
||||
}
|
||||
|
||||
const getArc = (flight: Flight): LngLat[] => {
|
||||
const key = routeKey(flight.departure_airport, flight.arrival_airport)
|
||||
if (!arcCache.has(key)) {
|
||||
arcCache.set(key, greatCirclePoints(
|
||||
[flight.departure_airport.longitude_deg, flight.departure_airport.latitude_deg],
|
||||
[flight.arrival_airport.longitude_deg, flight.arrival_airport.latitude_deg],
|
||||
))
|
||||
const isSameAirport = flight.departure_airport.id === flight.arrival_airport.id
|
||||
|
||||
arcCache.set(key, isSameAirport
|
||||
? loopPoints([flight.departure_airport.longitude_deg, flight.departure_airport.latitude_deg])
|
||||
: greatCirclePoints(
|
||||
[flight.departure_airport.longitude_deg, flight.departure_airport.latitude_deg],
|
||||
[flight.arrival_airport.longitude_deg, flight.arrival_airport.latitude_deg],
|
||||
))
|
||||
}
|
||||
return arcCache.get(key)!
|
||||
}
|
||||
@@ -666,8 +690,10 @@ export default defineComponent({
|
||||
? { top: 20, bottom: 20, left: 55, right: 55 }
|
||||
: { top: 60, bottom: 60, left: 60, right: 60 }
|
||||
|
||||
const lngs = props.flights.flatMap(f => [f.departure_airport.longitude_deg, f.arrival_airport.longitude_deg])
|
||||
const lats = props.flights.flatMap(f => [f.departure_airport.latitude_deg, f.arrival_airport.latitude_deg])
|
||||
// Use full arc/loop geometry, not just endpoints, so loops aren't clipped
|
||||
const allPoints = props.flights.flatMap(getArc)
|
||||
const lngs = allPoints.map(p => p[0])
|
||||
const lats = allPoints.map(p => p[1])
|
||||
|
||||
const minLat = Math.min(...lats)
|
||||
const maxLat = Math.max(...lats)
|
||||
@@ -689,7 +715,6 @@ export default defineComponent({
|
||||
}
|
||||
map!.fitBounds([[minLng, minLat], [maxLng, maxLat]], { padding, duration: 0 })
|
||||
}
|
||||
|
||||
// ── Map init ──────────────────────────────────────────────────────────
|
||||
|
||||
const initMap = (): void => {
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, watch, onMounted } from 'vue'
|
||||
import { ref, watch, onMounted, onUnmounted } from 'vue'
|
||||
import axios from "axios";
|
||||
import { Notification } from "@/Types/types";
|
||||
import { Link } from "@inertiajs/vue3";
|
||||
@@ -18,6 +18,7 @@ onMounted(() => {
|
||||
const open = ref(false)
|
||||
const notifications = ref<Notification[]>([])
|
||||
const loading = ref(false)
|
||||
const wrapperRef = ref<HTMLElement | null>(null)
|
||||
|
||||
const markAllRead = async (notifications: Notification[]) => {
|
||||
const unread = notifications.filter(n => !n.read_at)
|
||||
@@ -27,6 +28,20 @@ const markAllRead = async (notifications: Notification[]) => {
|
||||
unread.forEach(n => n.read_at = new Date().toISOString())
|
||||
}
|
||||
|
||||
const handleClickOutside = (event: MouseEvent) => {
|
||||
if (open.value && wrapperRef.value && !wrapperRef.value.contains(event.target as Node)) {
|
||||
open.value = false
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
document.addEventListener('click', handleClickOutside)
|
||||
})
|
||||
|
||||
onUnmounted(() => {
|
||||
document.removeEventListener('click', handleClickOutside)
|
||||
})
|
||||
|
||||
watch(open, async (isOpen) => {
|
||||
if (!isOpen) return
|
||||
|
||||
@@ -43,7 +58,7 @@ watch(open, async (isOpen) => {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="notif-wrapper">
|
||||
<div class="notif-wrapper" ref="wrapperRef">
|
||||
<v-btn icon variant="text" @click="open = !open" aria-label="Notifications">
|
||||
<v-badge :content="store.unreadCount" :model-value="store.unreadCount > 0" color="primary">
|
||||
<v-icon>mdi-bell-outline</v-icon>
|
||||
@@ -106,6 +121,16 @@ watch(open, async (isOpen) => {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.notif-menu {
|
||||
position: fixed;
|
||||
top: 4.5rem; /* adjust to sit just below your navbar height */
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: min(320px, calc(100vw - 1.5rem));
|
||||
}
|
||||
}
|
||||
|
||||
.notif-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
@@ -4,6 +4,7 @@ import FlightMap from "@/Components/FlightsGoneBy/FlightMap.vue";
|
||||
import Panel from "@/Components/FlightsGoneBy/Panels/Panel.vue";
|
||||
import DetailRows from "@/Components/FlightsGoneBy/Panels/DetailRows.vue";
|
||||
import DetailRow from "@/Components/FlightsGoneBy/Panels/DetailRow.vue";
|
||||
import PanelLabel from "@/Components/FlightsGoneBy/Panels/PanelLabel.vue";
|
||||
|
||||
defineProps<{
|
||||
flight: Flight
|
||||
@@ -19,6 +20,10 @@ defineProps<{
|
||||
<DetailRow label="Distance" :value="flight.distance + 'km'" />
|
||||
<DetailRow label="Duration" :value="flight.duration_display" />
|
||||
</DetailRows>
|
||||
<DetailRows>
|
||||
<PanelLabel v-if="flight.note?.length">Notes</PanelLabel>
|
||||
{{flight.note}}
|
||||
</DetailRows>
|
||||
</Panel>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -0,0 +1,53 @@
|
||||
<script setup lang="ts">
|
||||
import GlassTooltip from '@/Components/FlightsGoneBy/GlassTooltip.vue'
|
||||
import type { Anchor } from 'vuetify'
|
||||
|
||||
withDefaults(defineProps<{
|
||||
label?: string
|
||||
location?: Anchor
|
||||
}>(), {
|
||||
label: 'Missing something?',
|
||||
})
|
||||
|
||||
defineSlots<{
|
||||
default(): any
|
||||
}>()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<GlassTooltip :location="location ?? 'top'" :open-delay="150">
|
||||
<template #activator="{ props: activatorProps }">
|
||||
<button
|
||||
v-bind="activatorProps"
|
||||
type="button"
|
||||
class="missing-entity-link"
|
||||
>
|
||||
{{ label }}
|
||||
</button>
|
||||
</template>
|
||||
|
||||
<template #default>
|
||||
<slot />
|
||||
</template>
|
||||
</GlassTooltip>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.missing-entity-link {
|
||||
display: inline-block;
|
||||
margin-top: 4px;
|
||||
padding: 0;
|
||||
background: none;
|
||||
border: none;
|
||||
font-size: 12px;
|
||||
color: rgba(255, 255, 255, 0.55);
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 2px;
|
||||
cursor: pointer;
|
||||
transition: color 0.15s ease;
|
||||
}
|
||||
|
||||
.missing-entity-link:hover {
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
}
|
||||
</style>
|
||||
@@ -6,8 +6,9 @@ import AirlineSearchBox from '@/Components/FlightsGoneBy/AirlineSearchBox.vue'
|
||||
import AircraftSearchBox from '@/Components/FlightsGoneBy/AircraftSearchBox.vue'
|
||||
import AirportSearchBox from '@/Components/FlightsGoneBy/AirportSearchBox.vue'
|
||||
import type {SeatType, FlightReason, FlightClass, CrewType, SharedProps} from '@/Types/types'
|
||||
import { ref, watch, computed } from 'vue'
|
||||
import { ref, watch, computed, onMounted, nextTick } from 'vue'
|
||||
import { VTimePicker, VDatePicker } from 'vuetify/components'
|
||||
import MissingEntityLink from "@/Components/FlightsGoneBy/Tooltips/MissingEntityLink.vue";
|
||||
|
||||
defineOptions({ layout: MainLayout })
|
||||
const page = usePage<SharedProps>().props
|
||||
@@ -49,25 +50,13 @@ const pad = (n: number) => String(n).padStart(2, '0')
|
||||
const flightNumber = ref(props.flight?.flight_number ?? '')
|
||||
const lookupLoading = ref(false)
|
||||
const lookupError = ref<string | null>(null)
|
||||
const lookupComplete = ref(true)
|
||||
|
||||
interface LookupResult {
|
||||
airline_options: { value: number; title: string, logo_url: string }[]
|
||||
from_options: { value: number; title: string; country_code: string }[]
|
||||
to_options: { value: number; title: string; country_code: string }[]
|
||||
aircraft_options: { value: number; title: string }[]
|
||||
scheduled_departure_time: string | null
|
||||
scheduled_arrival_time: string | null
|
||||
}
|
||||
|
||||
const lookupResult = ref<LookupResult | null>(null)
|
||||
const lookupKey = ref(0)
|
||||
|
||||
async function lookupFlight() {
|
||||
if (!flightNumber.value.trim()) return
|
||||
lookupLoading.value = true
|
||||
lookupError.value = null
|
||||
lookupResult.value = null
|
||||
|
||||
try {
|
||||
const response = await fetch(`${route('flights.lookup')}?number=${encodeURIComponent(flightNumber.value.trim())}`, {
|
||||
@@ -78,8 +67,6 @@ async function lookupFlight() {
|
||||
lookupError.value = data.message ?? 'Lookup failed.'
|
||||
return
|
||||
}
|
||||
lookupResult.value = data
|
||||
lookupComplete.value = true
|
||||
if (data.airline_options?.length) {
|
||||
airlineOptionsData.value = data.airline_options
|
||||
if (!form.airline) form.airline = data.airline_options[0]
|
||||
@@ -111,6 +98,12 @@ async function lookupFlight() {
|
||||
}
|
||||
suppressArrivalAutoFill = false
|
||||
|
||||
// NOTE: if the lookup API is ever extended to return a day
|
||||
// difference for the arrival (e.g. `data.arrival_day_offset`),
|
||||
// wire it in here: `arrivalOffset.value = data.arrival_day_offset`
|
||||
// (clamped/mapped to 'custom' if outside -1..2). Left out for now
|
||||
// since the API doesn't provide it yet.
|
||||
|
||||
lookupKey.value++
|
||||
} catch (e) {
|
||||
lookupError.value = String(e)
|
||||
@@ -122,7 +115,6 @@ async function lookupFlight() {
|
||||
// ── Display form (drives the template) ───────────────────────────────────────
|
||||
|
||||
const form = useForm({
|
||||
flight_number: props.flight?.flight_number ?? '',
|
||||
departure_date: props.flight?.departure_date ?? '',
|
||||
arrival_date: props.flight?.arrival_date ?? '',
|
||||
from: props.flight?.from_options[0] ?? null as { value: number; title: string; country_code: string } | null,
|
||||
@@ -163,9 +155,9 @@ const submitForm = useForm({
|
||||
crew_type_id: null as number | null,
|
||||
note: '' as string | null,
|
||||
auto_update: false,
|
||||
add_more: false,
|
||||
})
|
||||
|
||||
|
||||
const departureIsFuture = computed(() => {
|
||||
if (!form.departure_date) return false
|
||||
return new Date(form.departure_date) > new Date()
|
||||
@@ -177,7 +169,7 @@ watch(departureIsFuture, (isFuture) => {
|
||||
}, { immediate: true })
|
||||
|
||||
|
||||
function submit() {
|
||||
function submit(addMore = false) {
|
||||
submitForm.flight_number = flightNumber.value
|
||||
submitForm.departure_date = form.departure_date
|
||||
submitForm.arrival_date = form.arrival_date
|
||||
@@ -193,6 +185,7 @@ function submit() {
|
||||
submitForm.crew_type_id = form.crew_type?.id ?? null
|
||||
submitForm.note = form.note
|
||||
submitForm.auto_update = form.auto_update
|
||||
submitForm.add_more = addMore
|
||||
|
||||
if (isEdit) {
|
||||
submitForm.put(route('flights.update', { flight: props.flight!.id }))
|
||||
@@ -230,9 +223,15 @@ function combineDateTime(date: Date | null, time: string | null): string {
|
||||
return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}T${(hh ?? '00').padStart(2, '0')}:${(mm ?? '00').padStart(2, '0')}`
|
||||
}
|
||||
|
||||
function clearDepartureDate() { departureDatePart.value = null }
|
||||
// Whole-day difference between two Date objects (time-of-day ignored).
|
||||
function diffInDays(from: Date | null, to: Date | null): number | null {
|
||||
if (!from || !to) return null
|
||||
const a = new Date(from.getFullYear(), from.getMonth(), from.getDate())
|
||||
const b = new Date(to.getFullYear(), to.getMonth(), to.getDate())
|
||||
return Math.round((b.getTime() - a.getTime()) / 86_400_000)
|
||||
}
|
||||
|
||||
function clearDepartureTime() { departureTimePart.value = null }
|
||||
function clearArrivalDate() { arrivalDatePart.value = null }
|
||||
function clearArrivalTime() { arrivalTimePart.value = null }
|
||||
|
||||
// Normalizes whatever shape the API sends a scheduled time in ("14:30",
|
||||
@@ -278,19 +277,88 @@ watch([arrivalDatePart, arrivalTimePart], () => {
|
||||
form.arrival_date = combineDateTime(arrivalDatePart.value, arrivalTimePart.value)
|
||||
})
|
||||
|
||||
// Auto-fill arrival (+1hr) the first time a departure TIME is chosen (and a
|
||||
// departure date is already set) and arrival is still empty. Picking the
|
||||
// departure date alone no longer triggers this — only setting the time does.
|
||||
// ── Arrival day offset ───────────────────────────────────────────────────────
|
||||
// Rather than making the user pick an independent arrival date, arrival date
|
||||
// is normally *derived* from departure date + a small relative offset
|
||||
// (-1 / Same day / +1 / +2). "Custom" drops back to a real date picker for
|
||||
// the rare case that falls outside that range. This avoids needing airport
|
||||
// time zones to work out the arrival date, which a duration-based input
|
||||
// would require.
|
||||
|
||||
type ArrivalOffset = -1 | 0 | 1 | 2
|
||||
|
||||
const arrivalOffsetOptions: { value: ArrivalOffset; label: string }[] = [
|
||||
{ value: -1, label: '−1 Day' },
|
||||
{ value: 0, label: 'Same Day' },
|
||||
{ value: 1, label: '+1 Day' },
|
||||
{ value: 2, label: '+2 Days' },
|
||||
]
|
||||
|
||||
const initialDiff = diffInDays(depInit.date, arrInit.date)
|
||||
const initialDiffIsQuickOption = initialDiff !== null && ([-1, 0, 1, 2] as number[]).includes(initialDiff)
|
||||
|
||||
// 'offset' (the default): arrival date is derived from departure date + the
|
||||
// selected quick offset. 'custom': the user has dropped into a real date
|
||||
// picker, e.g. because the actual gap is more than +2 days.
|
||||
const arrivalDateMode = ref<'offset' | 'custom'>(
|
||||
initialDiff !== null && !initialDiffIsQuickOption ? 'custom' : 'offset'
|
||||
)
|
||||
|
||||
const arrivalOffset = ref<ArrivalOffset>(
|
||||
initialDiffIsQuickOption ? (initialDiff as ArrivalOffset) : 0
|
||||
)
|
||||
|
||||
function applyArrivalOffset() {
|
||||
if (suppressArrivalAutoFill) return
|
||||
if (arrivalDateMode.value === 'custom') return
|
||||
if (!departureDatePart.value) {
|
||||
arrivalDatePart.value = null
|
||||
return
|
||||
}
|
||||
const d = new Date(departureDatePart.value)
|
||||
d.setDate(d.getDate() + arrivalOffset.value)
|
||||
arrivalDatePart.value = d
|
||||
}
|
||||
|
||||
// Re-derive arrival date whenever departure date moves, or the offset is
|
||||
// changed by hand.
|
||||
watch(departureDatePart, applyArrivalOffset)
|
||||
watch(arrivalOffset, applyArrivalOffset)
|
||||
|
||||
function useCustomArrivalDate() {
|
||||
arrivalDateMode.value = 'custom'
|
||||
}
|
||||
|
||||
function useQuickArrivalOffset() {
|
||||
arrivalDateMode.value = 'offset'
|
||||
applyArrivalOffset()
|
||||
}
|
||||
|
||||
function formatFullDate(d: Date | null): string {
|
||||
if (!d) return ''
|
||||
return d.toLocaleDateString(undefined, { weekday: 'short', day: 'numeric', month: 'short', year: 'numeric' })
|
||||
}
|
||||
|
||||
// Auto-fill arrival TIME (+1hr) the first time a departure time is chosen
|
||||
// (and a departure date is already set) and arrival time is still empty.
|
||||
// If adding the hour rolls over midnight, bump the offset selector to match
|
||||
// (e.g. departs 23:30 -> offset flips to "+1") so the resolved arrival date
|
||||
// stays correct without the user having to notice and fix it themselves.
|
||||
watch(departureTimePart, (newTime) => {
|
||||
if (suppressArrivalAutoFill) return
|
||||
if (!newTime || !departureDatePart.value || arrivalDatePart.value) return
|
||||
if (arrivalDateMode.value === 'custom') return
|
||||
if (!newTime || !departureDatePart.value || arrivalTimePart.value) return
|
||||
|
||||
const dep = new Date(departureDatePart.value)
|
||||
const [h, m] = newTime.split(':').map(Number)
|
||||
dep.setHours(h, m)
|
||||
const arr = new Date(dep.getTime() + 60 * 60 * 1000)
|
||||
|
||||
const rawDiff = diffInDays(departureDatePart.value, arr) ?? 0
|
||||
const clampedDiff = Math.min(Math.max(rawDiff, -1), 2) as -1 | 0 | 1 | 2
|
||||
|
||||
suppressArrivalAutoFill = true
|
||||
arrivalOffset.value = clampedDiff
|
||||
arrivalDatePart.value = new Date(arr.getFullYear(), arr.getMonth(), arr.getDate())
|
||||
arrivalTimePart.value = `${pad(arr.getHours())}:${pad(arr.getMinutes())}`
|
||||
suppressArrivalAutoFill = false
|
||||
@@ -313,11 +381,31 @@ const arrivalMaxDate = computed(() => arrivalMax.value ? new Date(arrivalMax.val
|
||||
|
||||
// ── Native date inputs ───────────────────────────────────────────────────────
|
||||
// departureDatePart / arrivalDatePart stay the source of truth as Date
|
||||
// objects. These computed get/set pairs are what the native <input type=date>
|
||||
// elements bind to — the browser handles locale display, typing, and
|
||||
// validation itself, so no custom format-aware parsing is needed here.
|
||||
// The Vuetify v-date-picker is still available via a separate calendar icon
|
||||
// for users who prefer to pick from a calendar rather than type.
|
||||
// objects. The <input type="date"> elements below are deliberately left
|
||||
// UNCONTROLLED from Vue's perspective — no v-model, no :model-value, no
|
||||
// reactive :value binding of any kind. That's on purpose: any reactive
|
||||
// binding through Vuetify's v-text-field — even one that only commits on
|
||||
// blur/change, not every keystroke — still runs through v-text-field's own
|
||||
// internal echo of the field, which re-renders the wrapped <input> on every
|
||||
// keystroke regardless of what we bind from outside. For type="date"
|
||||
// specifically, that internal re-render resets the browser's own
|
||||
// per-segment editing state mid-type (day/month/year), which is what was
|
||||
// scrambling what you typed. Using a genuinely uncontrolled native <input>
|
||||
// (not wrapped in v-text-field at all) sidesteps that entirely.
|
||||
//
|
||||
// We grab a direct DOM ref to each native input and manage its .value
|
||||
// imperatively instead:
|
||||
// - once on mount, to show the initial value
|
||||
// - whenever departureDatePart/arrivalDatePart changes from elsewhere
|
||||
// (the calendar picker, a flight lookup, auto-fill) — but only if the
|
||||
// field isn't currently focused, so we never fight with active typing
|
||||
// - the native `change` event (fires once a full date has been entered
|
||||
// and committed, or cleared) is what flows the typed value back into
|
||||
// departureDatePart/arrivalDatePart
|
||||
// This keeps the real native, locale-aware date input and picker UI intact.
|
||||
//
|
||||
// The arrival native date input only exists in the DOM while arrivalOffset
|
||||
// is 'custom' (see template); its value is (re)synced whenever it mounts.
|
||||
|
||||
function toIsoDateString(d: Date | null): string {
|
||||
if (!d) return ''
|
||||
@@ -331,16 +419,42 @@ function fromIsoDateString(value: string): Date | null {
|
||||
return new Date(y, m - 1, d)
|
||||
}
|
||||
|
||||
const departureDateValue = computed({
|
||||
get: () => toIsoDateString(departureDatePart.value),
|
||||
set: (value: string) => { departureDatePart.value = fromIsoDateString(value) },
|
||||
const departureDateEl = ref<HTMLInputElement | null>(null)
|
||||
const arrivalDateEl = ref<HTMLInputElement | null>(null)
|
||||
|
||||
onMounted(() => {
|
||||
if (departureDateEl.value) departureDateEl.value.value = toIsoDateString(departureDatePart.value)
|
||||
if (arrivalDateEl.value) arrivalDateEl.value.value = toIsoDateString(arrivalDatePart.value)
|
||||
})
|
||||
|
||||
const arrivalDateValue = computed({
|
||||
get: () => toIsoDateString(arrivalDatePart.value),
|
||||
set: (value: string) => { arrivalDatePart.value = fromIsoDateString(value) },
|
||||
watch(departureDatePart, (d) => {
|
||||
const el = departureDateEl.value
|
||||
if (el && document.activeElement !== el) el.value = toIsoDateString(d)
|
||||
})
|
||||
|
||||
watch(arrivalDatePart, (d) => {
|
||||
const el = arrivalDateEl.value
|
||||
if (el && document.activeElement !== el) el.value = toIsoDateString(d)
|
||||
})
|
||||
|
||||
// The arrival native input only exists while arrivalDateMode === 'custom',
|
||||
// so re-sync its value whenever it (re)mounts into the DOM.
|
||||
watch(arrivalDateMode, async (mode) => {
|
||||
if (mode !== 'custom') return
|
||||
await nextTick()
|
||||
if (arrivalDateEl.value) arrivalDateEl.value.value = toIsoDateString(arrivalDatePart.value)
|
||||
})
|
||||
|
||||
function commitDepartureDateInput(e: Event) {
|
||||
const value = (e.target as HTMLInputElement).value
|
||||
departureDatePart.value = value ? fromIsoDateString(value) : null
|
||||
}
|
||||
|
||||
function commitArrivalDateInput(e: Event) {
|
||||
const value = (e.target as HTMLInputElement).value
|
||||
arrivalDatePart.value = value ? fromIsoDateString(value) : null
|
||||
}
|
||||
|
||||
// ── Editable, format-aware time text fields ────────────────────────────────
|
||||
// departureTimePart / arrivalTimePart stay the source of truth as internal
|
||||
// "HH:mm" (24hr) strings. These input refs are what the text-fields actually
|
||||
@@ -472,30 +586,33 @@ function commitArrivalTimeInput() {
|
||||
<!-- ── Departure date + time ──────────────────────────────── -->
|
||||
<v-row>
|
||||
<v-col cols="12" sm="6">
|
||||
<v-text-field
|
||||
v-model="departureDateValue"
|
||||
type="date"
|
||||
label="Departure Date"
|
||||
prepend-inner-icon="mdi-calendar"
|
||||
:disabled="!lookupComplete"
|
||||
:error-messages="submitForm.errors.departure_date"
|
||||
>
|
||||
<template #append-inner>
|
||||
<v-menu v-model="depDateMenu" :close-on-content-click="false">
|
||||
<template #activator="{ props: menuProps }">
|
||||
<v-icon
|
||||
v-bind="menuProps"
|
||||
icon="mdi-calendar-month"
|
||||
style="cursor: pointer"
|
||||
/>
|
||||
</template>
|
||||
<v-date-picker
|
||||
v-model="departureDatePart"
|
||||
@update:model-value="depDateMenu = false"
|
||||
<div class="native-date-field">
|
||||
<v-icon icon="mdi-calendar" size="20" class="native-date-field__icon" />
|
||||
<label class="native-date-field__label">Departure Date</label>
|
||||
<input
|
||||
ref="departureDateEl"
|
||||
type="date"
|
||||
class="native-date-field__input"
|
||||
@change="commitDepartureDateInput"
|
||||
>
|
||||
<v-menu v-model="depDateMenu" :close-on-content-click="false">
|
||||
<template #activator="{ props: menuProps }">
|
||||
<v-icon
|
||||
v-bind="menuProps"
|
||||
icon="mdi-calendar-month"
|
||||
size="20"
|
||||
style="cursor: pointer"
|
||||
/>
|
||||
</v-menu>
|
||||
</template>
|
||||
</v-text-field>
|
||||
</template>
|
||||
<v-date-picker
|
||||
v-model="departureDatePart"
|
||||
@update:model-value="depDateMenu = false"
|
||||
/>
|
||||
</v-menu>
|
||||
</div>
|
||||
<div v-if="submitForm.errors.departure_date" class="native-date-field__error text-error">
|
||||
{{ submitForm.errors.departure_date }}
|
||||
</div>
|
||||
</v-col>
|
||||
<v-col cols="12" sm="6">
|
||||
<v-menu v-model="depTimeMenu" :close-on-content-click="false">
|
||||
@@ -507,7 +624,6 @@ function commitArrivalTimeInput() {
|
||||
clearable
|
||||
prepend-inner-icon="mdi-clock-outline"
|
||||
:placeholder="timeFormat === '24hr' ? 'e.g. 1430' : 'e.g. 2:30 PM'"
|
||||
:disabled="!lookupComplete"
|
||||
@click:clear="clearDepartureTime"
|
||||
@blur="commitDepartureTimeInput"
|
||||
@keydown.enter="commitDepartureTimeInput"
|
||||
@@ -528,23 +644,59 @@ function commitArrivalTimeInput() {
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<!-- ── Arrival date + time ─────────────────────────────────── -->
|
||||
<!-- ── Arrival ───────────────────────────────────────────── -->
|
||||
<v-row>
|
||||
<v-col cols="12" sm="6">
|
||||
<v-text-field
|
||||
v-model="arrivalDateValue"
|
||||
type="date"
|
||||
label="Arrival Date"
|
||||
prepend-inner-icon="mdi-calendar"
|
||||
:disabled="!lookupComplete"
|
||||
:error-messages="submitForm.errors.arrival_date"
|
||||
>
|
||||
<template #append-inner>
|
||||
<label class="arrival-offset__label">Arrival Date</label>
|
||||
|
||||
<template v-if="arrivalDateMode === 'offset'">
|
||||
<v-btn-toggle
|
||||
v-model="arrivalOffset"
|
||||
mandatory
|
||||
variant="outlined"
|
||||
color="primary"
|
||||
divided
|
||||
class="arrival-offset__toggle"
|
||||
>
|
||||
<v-btn
|
||||
v-for="opt in arrivalOffsetOptions"
|
||||
:key="opt.value"
|
||||
:value="opt.value"
|
||||
class="arrival-offset__btn"
|
||||
>
|
||||
{{ opt.label }}
|
||||
</v-btn>
|
||||
</v-btn-toggle>
|
||||
|
||||
<div class="arrival-offset__footer">
|
||||
<span v-if="arrivalDatePart" class="arrival-offset__hint">
|
||||
Arrives {{ formatFullDate(arrivalDatePart) }}
|
||||
</span>
|
||||
<button
|
||||
type="button"
|
||||
class="arrival-offset__link"
|
||||
@click="useCustomArrivalDate"
|
||||
>
|
||||
Custom date
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-else>
|
||||
<div class="native-date-field">
|
||||
<v-icon icon="mdi-calendar" size="20" class="native-date-field__icon" />
|
||||
<input
|
||||
ref="arrivalDateEl"
|
||||
type="date"
|
||||
class="native-date-field__input"
|
||||
@change="commitArrivalDateInput"
|
||||
>
|
||||
<v-menu v-model="arrDateMenu" :close-on-content-click="false">
|
||||
<template #activator="{ props: menuProps }">
|
||||
<v-icon
|
||||
v-bind="menuProps"
|
||||
icon="mdi-calendar-month"
|
||||
size="20"
|
||||
style="cursor: pointer"
|
||||
/>
|
||||
</template>
|
||||
@@ -555,8 +707,19 @@ function commitArrivalTimeInput() {
|
||||
@update:model-value="arrDateMenu = false"
|
||||
/>
|
||||
</v-menu>
|
||||
</template>
|
||||
</v-text-field>
|
||||
</div>
|
||||
<button
|
||||
type="button"
|
||||
class="arrival-offset__link mt-1"
|
||||
@click="useQuickArrivalOffset"
|
||||
>
|
||||
Use quick select instead
|
||||
</button>
|
||||
</template>
|
||||
|
||||
<div v-if="submitForm.errors.arrival_date" class="native-date-field__error text-error">
|
||||
{{ submitForm.errors.arrival_date }}
|
||||
</div>
|
||||
</v-col>
|
||||
<v-col cols="12" sm="6">
|
||||
<v-menu v-model="arrTimeMenu" :close-on-content-click="false">
|
||||
@@ -568,7 +731,6 @@ function commitArrivalTimeInput() {
|
||||
clearable
|
||||
prepend-inner-icon="mdi-clock-outline"
|
||||
:placeholder="timeFormat === '24hr' ? 'e.g. 1430' : 'e.g. 2:30 PM'"
|
||||
:disabled="!lookupComplete"
|
||||
@click:clear="clearArrivalTime"
|
||||
@blur="commitArrivalTimeInput"
|
||||
@keydown.enter="commitArrivalTimeInput"
|
||||
@@ -597,8 +759,11 @@ function commitArrivalTimeInput() {
|
||||
label="From"
|
||||
:prefilled-options="fromOptionsData"
|
||||
:error-messages="submitForm.errors.from_id"
|
||||
:disabled="!lookupComplete"
|
||||
/>
|
||||
<MissingEntityLink label="Missing airport?">
|
||||
<p>If you can't find an airport we will be happy to add it, but you'll have to contact support with details of the airport.</p>
|
||||
<p>Unfortunately you won't be able to proceed with adding this flight until the airport has been added.</p>
|
||||
</MissingEntityLink>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
@@ -610,7 +775,6 @@ function commitArrivalTimeInput() {
|
||||
label="To"
|
||||
:prefilled-options="toOptionsData"
|
||||
:error-messages="submitForm.errors.to_id"
|
||||
:disabled="!lookupComplete"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
@@ -623,8 +787,11 @@ function commitArrivalTimeInput() {
|
||||
v-model="form.airline"
|
||||
:prefilled-options="airlineOptionsData"
|
||||
:error-messages="submitForm.errors.airline_id"
|
||||
:disabled="!lookupComplete"
|
||||
/>
|
||||
<MissingEntityLink label="Missing airline? No problem">
|
||||
<p>If you can't find the airline you flew with, just leave it blank but make sure to add a valid flight number. We will be notified of flights with missing airlines and add the airline shortly.</p>
|
||||
<p>If you don't know your flight number or a missing airline hasn't been added within 48 hours, please contact support.</p>
|
||||
</MissingEntityLink>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
@@ -636,7 +803,6 @@ function commitArrivalTimeInput() {
|
||||
v-model="form.aircraft"
|
||||
:prefilled-options="aircraftOptionsData"
|
||||
:error-messages="submitForm.errors.aircraft_id"
|
||||
:disabled="!lookupComplete"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
@@ -648,7 +814,6 @@ function commitArrivalTimeInput() {
|
||||
v-model="form.aircraft_registration"
|
||||
label="Aircraft Registration"
|
||||
placeholder="e.g. VH-OQA"
|
||||
:disabled="!lookupComplete"
|
||||
:error-messages="submitForm.errors.aircraft_registration"
|
||||
/>
|
||||
</v-col>
|
||||
@@ -660,7 +825,6 @@ function commitArrivalTimeInput() {
|
||||
item-title="name"
|
||||
item-value="id"
|
||||
:return-object="true"
|
||||
:disabled="!lookupComplete"
|
||||
:error-messages="submitForm.errors.flight_class_id"
|
||||
/>
|
||||
</v-col>
|
||||
@@ -673,7 +837,6 @@ function commitArrivalTimeInput() {
|
||||
v-model="form.seat_number"
|
||||
label="Seat Number"
|
||||
placeholder="e.g. 12A"
|
||||
:disabled="!lookupComplete"
|
||||
:error-messages="submitForm.errors.seat_number"
|
||||
/>
|
||||
</v-col>
|
||||
@@ -685,7 +848,6 @@ function commitArrivalTimeInput() {
|
||||
item-title="name"
|
||||
item-value="id"
|
||||
:return-object="true"
|
||||
:disabled="!lookupComplete"
|
||||
:error-messages="submitForm.errors.seat_type_id"
|
||||
/>
|
||||
</v-col>
|
||||
@@ -701,7 +863,6 @@ function commitArrivalTimeInput() {
|
||||
item-title="name"
|
||||
item-value="id"
|
||||
:return-object="true"
|
||||
:disabled="!lookupComplete"
|
||||
:error-messages="submitForm.errors.flight_reason_id"
|
||||
/>
|
||||
</v-col>
|
||||
@@ -713,7 +874,6 @@ function commitArrivalTimeInput() {
|
||||
item-title="name"
|
||||
item-value="id"
|
||||
:return-object="true"
|
||||
:disabled="!lookupComplete"
|
||||
:error-messages="submitForm.errors.crew_type_id"
|
||||
/>
|
||||
</v-col>
|
||||
@@ -726,7 +886,6 @@ function commitArrivalTimeInput() {
|
||||
v-model="form.note"
|
||||
label="Note"
|
||||
placeholder="Any additional notes…"
|
||||
:disabled="!lookupComplete"
|
||||
:error-messages="submitForm.errors.note"
|
||||
rows="3"
|
||||
auto-grow
|
||||
@@ -740,7 +899,6 @@ function commitArrivalTimeInput() {
|
||||
<v-checkbox
|
||||
v-model="form.auto_update"
|
||||
label="Automatically update flight details within 24 hours of flight departure"
|
||||
:disabled="!lookupComplete"
|
||||
hide-details
|
||||
density="compact"
|
||||
/>
|
||||
@@ -749,15 +907,27 @@ function commitArrivalTimeInput() {
|
||||
|
||||
<!-- ── Submit ─────────────────────────────────────────────── -->
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<v-col v-if="!isEdit" cols="12" md="6">
|
||||
<v-btn
|
||||
block
|
||||
size="large"
|
||||
:loading="submitForm.processing"
|
||||
:disabled="!lookupComplete || submitForm.processing"
|
||||
@click="submit"
|
||||
variant="outlined"
|
||||
:loading="submitForm.processing && submitForm.add_more"
|
||||
:disabled="submitForm.processing"
|
||||
@click="submit(true)"
|
||||
>
|
||||
{{ isEdit ? 'Save Changes' : 'Add Flight' }}
|
||||
Save Flight and Add Another
|
||||
</v-btn>
|
||||
</v-col>
|
||||
<v-col cols="12" :md="isEdit ? 12 : 6">
|
||||
<v-btn
|
||||
block
|
||||
size="large"
|
||||
:loading="submitForm.processing && !submitForm.add_more"
|
||||
:disabled="submitForm.processing"
|
||||
@click="submit(false)"
|
||||
>
|
||||
{{ isEdit ? 'Save Changes' : 'Save Flight' }}
|
||||
</v-btn>
|
||||
</v-col>
|
||||
</v-row>
|
||||
@@ -768,8 +938,129 @@ function commitArrivalTimeInput() {
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
:deep(input[type="date"]::-webkit-calendar-picker-indicator) {
|
||||
/* Hand-rolled field chrome for the native <input type="date"> fields.
|
||||
These deliberately bypass v-text-field (see the "Native date inputs"
|
||||
comment in the script block for why), so we approximate the surrounding
|
||||
Vuetify outlined-field look here instead of getting it for free. */
|
||||
.native-date-field {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
min-height: 56px;
|
||||
padding: 8px 12px;
|
||||
border: 1px none rgba(255, 255, 255, 0.24);
|
||||
border-bottom-style: solid;
|
||||
background: transparent;
|
||||
transition: border-color 0.15s ease;
|
||||
}
|
||||
|
||||
.native-date-field:focus-within {
|
||||
border-color: rgb(var(--surface));
|
||||
border-width: 2px;
|
||||
padding: 7px 11px;
|
||||
}
|
||||
|
||||
.native-date-field__icon {
|
||||
opacity: 0.7;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.native-date-field__label {
|
||||
position: absolute;
|
||||
top: -8px;
|
||||
left: 38px;
|
||||
padding: 0 4px;
|
||||
font-size: 12px;
|
||||
line-height: 1;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.native-date-field__input {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
background: transparent;
|
||||
border: none;
|
||||
outline: none;
|
||||
color: inherit;
|
||||
font-size: 16px;
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
.native-date-field__input::-webkit-calendar-picker-indicator {
|
||||
display: none;
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
/* Firefox doesn't support ::-webkit-calendar-picker-indicator; this trims
|
||||
its built-in indicator/spinner button area instead. */
|
||||
.native-date-field__input::-moz-calendar-picker-indicator {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.native-date-field__error {
|
||||
margin-top: 4px;
|
||||
padding-left: 12px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
/* Arrival day-offset control */
|
||||
.arrival-offset__label {
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
line-height: 1;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
margin-bottom: 6px;
|
||||
padding-left: 2px;
|
||||
}
|
||||
|
||||
.arrival-offset__toggle {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
width: 100%;
|
||||
height: 48px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.arrival-offset__btn {
|
||||
min-width: 0;
|
||||
flex: none;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 11px;
|
||||
letter-spacing: 0;
|
||||
text-transform: none;
|
||||
padding: 0 4px;
|
||||
}
|
||||
|
||||
.arrival-offset__footer {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
justify-content: space-between;
|
||||
gap: 8px;
|
||||
margin-top: 6px;
|
||||
padding: 0 2px;
|
||||
}
|
||||
|
||||
.arrival-offset__hint {
|
||||
font-size: 13px;
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
}
|
||||
|
||||
.arrival-offset__link {
|
||||
flex-shrink: 0;
|
||||
font-size: 12px;
|
||||
color: rgba(255, 255, 255, 0.75);
|
||||
background: none;
|
||||
border: none;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 2px;
|
||||
}
|
||||
|
||||
.arrival-offset__link:hover {
|
||||
color: rgb(255, 255, 255);
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -19,7 +19,7 @@ defineProps<{
|
||||
Reconcile Missing Liveries
|
||||
<v-chip size="x-small" color="error" class="ml-1">{{ missingLiveryCount }}</v-chip>
|
||||
</Link>
|
||||
<Link :href="route('admin.reconcile-missing-airlines')" class="sidebar-link">
|
||||
<Link v-if="missingAirlineCount" :href="route('admin.reconcile-missing-airlines')" class="sidebar-link">
|
||||
<v-icon icon="mdi-airplane-takeoff" size="18" />
|
||||
Reconcile Missing Airlines
|
||||
<v-chip size="x-small" color="error" class="ml-1">{{ missingAirlineCount }}</v-chip>
|
||||
|
||||
Vendored
+1
@@ -334,6 +334,7 @@ export interface MissingAirline{
|
||||
flights: {
|
||||
flight_number: string;
|
||||
link: string;
|
||||
id: number;
|
||||
}[]
|
||||
}
|
||||
|
||||
|
||||
@@ -42,6 +42,8 @@ use Inertia\Inertia;
|
||||
Route::post('/ignore-missing-livery', [AdminController::class, 'ignoreMissingLivery'])->name('ignore-missing-livery');
|
||||
|
||||
Route::get('/missing-airlines', [AdminController::class, 'reconcileMissingAirlines'])->name('reconcile-missing-airlines')->middleware('permission:reconcile_missing_liveries');
|
||||
Route::post('/ignore-missing-airline', [AdminController::class, 'ignoreMissingAirline'])->name('admin.ignore-missing-airline');
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user