Updated logo API
This commit is contained in:
+27
-1
@@ -8,7 +8,7 @@ use App\Models\Airline;
|
||||
use Illuminate\Http\Request;
|
||||
use Illuminate\Support\Facades\Storage;
|
||||
|
||||
class LogoController extends ApiController
|
||||
class AirlineApiController extends ApiController
|
||||
{
|
||||
const array CONDOR_LOGOS = ['BEACH', 'ISLAND', 'PASSION', 'SEA', 'SUNSHINE'];
|
||||
|
||||
@@ -47,4 +47,30 @@ class LogoController extends ApiController
|
||||
return $this->getAirlineLogo($airline);
|
||||
}
|
||||
|
||||
function parseAirlineData(Airline $airline){
|
||||
$countryCode = $airline->country->code;
|
||||
|
||||
$result = $airline->toArray();
|
||||
unset($result['id']);
|
||||
unset($result['logo']);
|
||||
unset($result['country_id']);
|
||||
unset($result['country']);
|
||||
$result['slug'] = $result['internal_name'];
|
||||
unset($result['internal_name']);
|
||||
$result['country_code'] = $countryCode;
|
||||
return $result;
|
||||
}
|
||||
|
||||
function getByCode(string $code){
|
||||
$lookupColumn = strlen($code) === 3 ? 'ICAO_code' : 'IATA_code';
|
||||
$airlines = Airline::where($lookupColumn, strtoupper($code))->get()->map(fn($airline) => $this->parseAirlineData($airline));
|
||||
return response()->json($airlines);
|
||||
|
||||
}
|
||||
|
||||
function get(string $internalName){
|
||||
$airline = Airline::where('internal_name', $internalName)->first();
|
||||
return response()->json($this->parseAirlineData($airline));
|
||||
}
|
||||
|
||||
}
|
||||
@@ -0,0 +1,60 @@
|
||||
<?php
|
||||
|
||||
namespace App\Http\Controllers\Api;
|
||||
|
||||
use App\Http\Controllers\ApiController;
|
||||
use App\Models\User;
|
||||
use App\Models\UserFlight;
|
||||
use Carbon\Carbon;
|
||||
use Illuminate\Http\JsonResponse;
|
||||
|
||||
class UserApiController extends ApiController
|
||||
{
|
||||
public function nextFlight(string $username): JsonResponse
|
||||
{
|
||||
$user = User::where('name', 'ilike', $username)->first();
|
||||
|
||||
if (!$user) {
|
||||
return response()->json(['message' => 'User not found'], 404);
|
||||
}
|
||||
|
||||
$flight = UserFlight::with(['departureAirport', 'arrivalAirport', 'airline', 'aircraft'])
|
||||
->where('user_id', $user->id)
|
||||
->where('departure_date', '>', now()->utc())
|
||||
->orderBy('departure_date', 'asc')
|
||||
->first();
|
||||
|
||||
if (!$flight) {
|
||||
return response()->json(['message' => 'No upcoming flights found'], 404);
|
||||
}
|
||||
|
||||
$departure = Carbon::parse($flight->departure_date)->setTimezone($flight->departureAirport->timezone);
|
||||
$arrival = Carbon::parse($flight->arrival_date)->setTimezone($flight->arrivalAirport->timezone);
|
||||
|
||||
return response()->json([
|
||||
'departureAirportCode' => $flight->departureAirport->iata_code,
|
||||
'departureCity' => $flight->departureAirport->municipality,
|
||||
'departureDateReadable' => $departure->format('F j'),
|
||||
'departureTime' => $departure->format('H:i'),
|
||||
'arrivalAirportCode' => $flight->arrivalAirport->iata_code,
|
||||
'arrivalCity' => $flight->arrivalAirport->municipality,
|
||||
'arrivalDateReadable' => $arrival->format('F j'),
|
||||
'arrivalTime' => $arrival->format('H:i'),
|
||||
'flightNumber' => $flight->flight_number,
|
||||
'airlineName' => $flight->airline->name,
|
||||
'aircraftType' => $flight->aircraft->manufacturer_code . ' ' . $flight->aircraft->model_full_name,
|
||||
'logoUrl' => $flight->airline?->logo_url ?? 'undefined',
|
||||
]);
|
||||
}
|
||||
|
||||
public function flights(string $username): JsonResponse
|
||||
{
|
||||
$user = User::where('name', 'ilike', $username)->first();
|
||||
|
||||
if (!$user) {
|
||||
return response()->json(['message' => 'User not found'], 404);
|
||||
}
|
||||
|
||||
return response()->json($user->FlightController()->flights());
|
||||
}
|
||||
}
|
||||
@@ -1,50 +0,0 @@
|
||||
<?php
|
||||
|
||||
namespace App\Http\Controllers\Api;
|
||||
|
||||
use App\Http\Controllers\ApiController;
|
||||
use App\Http\Controllers\Controller;
|
||||
use App\Models\User;
|
||||
use App\Models\UserFlight;
|
||||
use Carbon\Carbon;
|
||||
use DB;
|
||||
use Illuminate\Http\Request;
|
||||
|
||||
class UserController extends ApiController
|
||||
{
|
||||
function nextFlight(string $username): ?array
|
||||
{
|
||||
$user = User::where('name' ,'ilike', $username)->first();
|
||||
if(!$user) return [
|
||||
'message' => 'User not found',
|
||||
];
|
||||
|
||||
$flight = UserFlight::with(['departureAirport', 'arrivalAirport', 'airline', 'aircraft'])
|
||||
->where('user_id', $user->id)
|
||||
->where('departure_date', '>', now()->utc())
|
||||
->orderBy('departure_date', 'asc')
|
||||
->first();
|
||||
|
||||
$departure = Carbon::parse($flight->departure_date)->setTimezone($flight->departureAirport->timezone);
|
||||
$arrival = Carbon::parse($flight->arrival_date)->setTimezone($flight->arrivalAirport->timezone);
|
||||
|
||||
return [
|
||||
'departureAirportCode' => $flight->departureAirport->iata_code,
|
||||
'departureCity' => $flight->departureAirport->municipality,
|
||||
'departureDateReadable' => $departure->format('F j'),
|
||||
'departureTime' => $departure->format('H:i'),
|
||||
'arrivalAirportCode' => $flight->arrivalAirport->iata_code,
|
||||
'arrivalCity' => $flight->arrivalAirport->municipality,
|
||||
'arrivalDateReadable' => $arrival->format('F j'),
|
||||
'arrivalTime' => $arrival->format('H:i'),
|
||||
'flightNumber' => $flight->flight_number,
|
||||
'airlineName' => $flight->airline->name,
|
||||
'aircraftType' => $flight->aircraft->manufacturer_code . ' ' . $flight->aircraft->model_full_name,
|
||||
'logoUrl' => $flight->airline->logo_url,
|
||||
];
|
||||
}
|
||||
|
||||
function flights(string $username){
|
||||
|
||||
}
|
||||
}
|
||||
@@ -2,12 +2,14 @@
|
||||
|
||||
namespace App\Http\Controllers;
|
||||
|
||||
use App\Models\Aircraft;
|
||||
use App\Models\Airline;
|
||||
use App\Models\Airport;
|
||||
use App\Models\CrewType;
|
||||
use App\Models\FlightClass;
|
||||
use App\Models\FlightReason;
|
||||
use App\Models\SeatType;
|
||||
use App\Models\UserAction;
|
||||
use App\Models\UserFlight;
|
||||
use Carbon\Carbon;
|
||||
use Illuminate\Http\Request;
|
||||
@@ -72,6 +74,70 @@ class FlightController extends Controller
|
||||
];
|
||||
}
|
||||
|
||||
private function recordChanges(UserFlight $flight): void
|
||||
{
|
||||
$dirty = $flight->getDirty();
|
||||
|
||||
if (empty($dirty)) {
|
||||
return;
|
||||
}
|
||||
|
||||
$actions = [];
|
||||
foreach ($dirty as $field => $newValue) {
|
||||
$original = $flight->getOriginal($field);
|
||||
$actions[] = [
|
||||
'user_id' => $flight->user_id,
|
||||
'user_flight_id' => $flight->id,
|
||||
'message' => $this->formatChange($field, $original, $newValue),
|
||||
'created_at' => now(),
|
||||
'updated_at' => now(),
|
||||
];
|
||||
}
|
||||
|
||||
UserAction::insert($actions);
|
||||
}
|
||||
|
||||
private array $labelCache = [];
|
||||
|
||||
private function resolveLabel(string $field, mixed $value): string
|
||||
{
|
||||
if (is_null($value)) {
|
||||
return 'none';
|
||||
}
|
||||
|
||||
$cacheKey = "{$field}:{$value}";
|
||||
|
||||
if (isset($this->labelCache[$cacheKey])) {
|
||||
return $this->labelCache[$cacheKey];
|
||||
}
|
||||
|
||||
$label = match($field) {
|
||||
|
||||
'airline_id' => Airline::find($value)?->display_name ?? $value,
|
||||
'departure_airport_id',
|
||||
'arrival_airport_id' => Airport::find($value)?->display_name ?? $value,
|
||||
'aircraft_id' => Aircraft::find($value)?->display_name_short ?? $value,
|
||||
'seat_type_id' => SeatType::find($value)?->name ?? $value,
|
||||
'flight_class_id' => FlightClass::find($value)?->name ?? $value,
|
||||
'flight_reason_id' => FlightReason::find($value)?->name ?? $value,
|
||||
'crew_type_id' => CrewType::find($value)?->name ?? $value,
|
||||
'departure_date',
|
||||
'arrival_date' => Carbon::parse($value)->format('j F Y \a\t H:iA'),
|
||||
default => (string) $value,
|
||||
};
|
||||
|
||||
return $this->labelCache[$cacheKey] = $label;
|
||||
}
|
||||
|
||||
private function formatChange(string $field, mixed $from, mixed $to): string
|
||||
{
|
||||
$label = str($field)->replace('_id', '')->replace('_', ' ')->title();
|
||||
$fromLabel = $this->resolveLabel($field, $from);
|
||||
$toLabel = $this->resolveLabel($field, $to);
|
||||
|
||||
return "{$label} changed from {$fromLabel} to {$toLabel}";
|
||||
}
|
||||
|
||||
private function flightPayload(array $validated): array
|
||||
{
|
||||
[$departureUtc, $arrivalUtc] = $this->convertedDates($validated);
|
||||
@@ -111,7 +177,9 @@ class FlightController extends Controller
|
||||
|
||||
$validated = $request->validate($this->rules());
|
||||
|
||||
$flight->update($this->flightPayload($validated));
|
||||
$flight->fill($this->flightPayload($validated));
|
||||
$this->recordChanges($flight);
|
||||
$flight->save();
|
||||
|
||||
return redirect()->route('profile.departure-board', [Auth::user()->name, $flight->id]);
|
||||
}
|
||||
@@ -147,7 +215,7 @@ class FlightController extends Controller
|
||||
'crew_type' => $flight->crewType?->toArray() ?? [],
|
||||
'flight_reason' => $flight->flightReason->toArray(),
|
||||
'airline_options' => $flight->airline
|
||||
? [['value' => $flight->airline->id, 'title' => $flight->airline->display_name]]
|
||||
? [['value' => $flight->airline->id, 'title' => $flight->airline->display_name, 'logo_url' => $flight->airline->logo_url]]
|
||||
: [],
|
||||
'from_options' => [['value' => $flight->departureAirport->id, 'title' => $flight->departureAirport->display_name, 'country_code' => strtolower($flight->departureAirport->region->country->code)]],
|
||||
'to_options' => [['value' => $flight->arrivalAirport->id, 'title' => $flight->arrivalAirport->display_name, 'country_code' => strtolower($flight->arrivalAirport->region->country->code)]],
|
||||
|
||||
@@ -10,51 +10,35 @@ use Inertia\Inertia;
|
||||
|
||||
class FlightProfileController extends Controller
|
||||
{
|
||||
public function profileData(string $username, string $view, ?int $selectedFlightId = null) : array {
|
||||
$user = User::whereRaw(DB::raw('LOWER(name) = ?'), [strtolower($username)])->firstOrFail();
|
||||
|
||||
$flights = UserFlight::where('user_id', $user->id)
|
||||
->with([
|
||||
'departureAirport.region.country',
|
||||
'departureAirport.region.continent',
|
||||
'arrivalAirport.region.country',
|
||||
'arrivalAirport.region.continent',
|
||||
'airline.country',
|
||||
'aircraft',
|
||||
'seatType',
|
||||
'flightReason',
|
||||
'flightClass',
|
||||
'crewType'
|
||||
])
|
||||
->orderBy('departure_date', 'desc')
|
||||
->get();
|
||||
|
||||
public function profileData(User $user, string $view, ?int $selectedFlightId = null) : array {
|
||||
$flights = $user->FlightController()->flights();
|
||||
return [
|
||||
'user' => $user,
|
||||
'canEdit' => auth()->check() && auth()->id() === $user->id,
|
||||
'flights' => UserFlightResource::collection($flights)->resolve(),
|
||||
'initialView' => $view,
|
||||
'selectedFlightId' => $selectedFlightId,
|
||||
'isFollowing' => auth()->check() && auth()->user()->isFollowing($user),
|
||||
];
|
||||
}
|
||||
|
||||
public function departureBoard(string $username, ?UserFlight $flight = null){
|
||||
$profileData = $this->profileData($username, 'board', $flight?->id);
|
||||
public function departureBoard(User $user, ?UserFlight $flight = null){
|
||||
$profileData = $this->profileData($user, 'board', $flight?->id);
|
||||
return Inertia::render('UserProfile', $profileData);
|
||||
}
|
||||
|
||||
public function map(string $username){
|
||||
$profileData = $this->profileData($username, 'map');
|
||||
public function map(User $user){
|
||||
$profileData = $this->profileData($user, 'map');
|
||||
return Inertia::render('UserProfile', $profileData);
|
||||
}
|
||||
|
||||
public function boardingPasses(string $username){
|
||||
$profileData = $this->profileData($username, 'passes');
|
||||
public function boardingPasses(User $user){
|
||||
$profileData = $this->profileData($user, 'passes');
|
||||
return Inertia::render('UserProfile', $profileData);
|
||||
}
|
||||
|
||||
public function view(string $username)
|
||||
public function view(User $user)
|
||||
{
|
||||
return $this->departureBoard($username);
|
||||
return $this->departureBoard($user);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,31 @@
|
||||
<?php
|
||||
|
||||
namespace App\Http\Controllers;
|
||||
|
||||
use App\Models\Followee;
|
||||
use App\Models\User;
|
||||
use Illuminate\Http\JsonResponse;
|
||||
use Illuminate\Http\RedirectResponse;
|
||||
use Illuminate\Http\Request;
|
||||
|
||||
class UserController extends Controller
|
||||
{
|
||||
public function follow(User $user): JsonResponse
|
||||
{
|
||||
$existing = Followee::where('user_id', auth()->id())
|
||||
->where('followee_id', $user->id)
|
||||
->first();
|
||||
|
||||
if ($existing) {
|
||||
$existing->delete();
|
||||
return response()->json(['following' => false]);
|
||||
}
|
||||
|
||||
Followee::create([
|
||||
'user_id' => auth()->id(),
|
||||
'followee_id' => $user->id,
|
||||
]);
|
||||
|
||||
return response()->json(['following' => true]);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,35 @@
|
||||
<?php
|
||||
|
||||
namespace App\Http\Controllers;
|
||||
|
||||
use App\Models\User;
|
||||
use App\Models\UserFlight;
|
||||
use Illuminate\Http\Request;
|
||||
|
||||
class UserFlightController extends Controller
|
||||
{
|
||||
|
||||
protected User $user;
|
||||
|
||||
function __construct(User $user){
|
||||
$this->user = $user;
|
||||
}
|
||||
|
||||
public function flights(){
|
||||
return UserFlight::where('user_id', $this->user->id)
|
||||
->with([
|
||||
'departureAirport.region.country',
|
||||
'departureAirport.region.continent',
|
||||
'arrivalAirport.region.country',
|
||||
'arrivalAirport.region.continent',
|
||||
'airline.country',
|
||||
'aircraft',
|
||||
'seatType',
|
||||
'flightReason',
|
||||
'flightClass',
|
||||
'crewType'
|
||||
])
|
||||
->orderBy('departure_date', 'desc')
|
||||
->get();
|
||||
}
|
||||
}
|
||||
@@ -45,7 +45,7 @@ class Airline extends Model
|
||||
protected function logoUrl() : Attribute{
|
||||
return Attribute::make(
|
||||
get: function () {
|
||||
return config('app.logo_api_url') . "/airline/$this->internal_name/logo/tail/";
|
||||
return config('app.logo_api_url') . "/airline/$this->internal_name/logo/tail";
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,24 @@
|
||||
<?php
|
||||
|
||||
namespace App\Models;
|
||||
|
||||
use Illuminate\Database\Eloquent\Model;
|
||||
use Illuminate\Database\Eloquent\Relations\BelongsTo;
|
||||
|
||||
class Followee extends Model
|
||||
{
|
||||
protected $fillable = [
|
||||
'user_id',
|
||||
'followee_id',
|
||||
];
|
||||
|
||||
public function user(): BelongsTo
|
||||
{
|
||||
return $this->belongsTo(User::class, 'user_id');
|
||||
}
|
||||
|
||||
public function followee(): BelongsTo
|
||||
{
|
||||
return $this->belongsTo(User::class, 'followee_id');
|
||||
}
|
||||
}
|
||||
@@ -3,6 +3,7 @@
|
||||
namespace App\Models;
|
||||
|
||||
// use Illuminate\Contracts\Auth\MustVerifyEmail;
|
||||
use App\Http\Controllers\UserFlightController;
|
||||
use Database\Factories\UserFactory;
|
||||
use Illuminate\Database\Eloquent\Attributes\Fillable;
|
||||
use Illuminate\Database\Eloquent\Attributes\Hidden;
|
||||
@@ -32,6 +33,16 @@ class User extends Authenticatable
|
||||
];
|
||||
}
|
||||
|
||||
public function resolveRouteBinding($value, $field = null): ?User
|
||||
{
|
||||
return $this->where('name', 'ilike', $value)->firstOrFail();
|
||||
}
|
||||
|
||||
public function FlightController(): UserFlightController
|
||||
{
|
||||
return new UserFlightController($this);
|
||||
}
|
||||
|
||||
public function flights(): HasMany {
|
||||
return $this->hasMany(UserFlight::class);
|
||||
}
|
||||
@@ -40,4 +51,19 @@ class User extends Authenticatable
|
||||
{
|
||||
return $this->hasMany(ImportedFlight::class);
|
||||
}
|
||||
|
||||
public function following(): HasMany
|
||||
{
|
||||
return $this->hasMany(Followee::class, 'user_id');
|
||||
}
|
||||
|
||||
public function followers(): HasMany
|
||||
{
|
||||
return $this->hasMany(Followee::class, 'followee_id');
|
||||
}
|
||||
|
||||
public function isFollowing(User $user): bool
|
||||
{
|
||||
return $this->following()->where('followee_id', $user->id)->exists();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,20 @@
|
||||
<?php
|
||||
|
||||
namespace App\Models;
|
||||
|
||||
use Illuminate\Database\Eloquent\Model;
|
||||
|
||||
class UserAction extends Model
|
||||
{
|
||||
protected $fillable = [
|
||||
'user_id',
|
||||
'user_flight_id',
|
||||
'message',
|
||||
];
|
||||
|
||||
protected $casts = [
|
||||
'user_flight_id' => 'integer',
|
||||
'user_id' => 'integer',
|
||||
'message' => 'string',
|
||||
];
|
||||
}
|
||||
@@ -5,12 +5,14 @@ import {usePage} from "@inertiajs/vue3";
|
||||
import GlassTooltip from "@/Components/FlightsGoneBy/GlassTooltip.vue";
|
||||
import InlineBadge from "@/Components/FlightsGoneBy/InlineBadge.vue";
|
||||
|
||||
const page = usePage<SharedProps>().props;
|
||||
|
||||
const props = defineProps<{
|
||||
airline: Airline | null;
|
||||
size?: number | string;
|
||||
}>();
|
||||
|
||||
const logoUrl = computed(() => `url('${props.airline?.logo_url}')`);
|
||||
const logoUrl = computed(() => `url('${props.airline?.logo_url ?? page.logo_api_url+'/airline/undefined/logo/tail'}')`);
|
||||
const logoStyle = computed(() => ({
|
||||
width: size.value,
|
||||
height: size.value,
|
||||
|
||||
@@ -10,9 +10,9 @@ defineProps<{
|
||||
<template>
|
||||
<GlassTooltip>
|
||||
<template #activator="{ props: tooltipProps }">
|
||||
<div v-bind="tooltipProps" style="cursor:pointer">
|
||||
<span v-bind="tooltipProps" style="cursor:pointer; display:inline-flex">
|
||||
<slot />
|
||||
</div>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<div class="tooltip-rows">
|
||||
|
||||
@@ -18,6 +18,10 @@ const props = defineProps<{
|
||||
flightId?: number | null
|
||||
}>()
|
||||
|
||||
function editRoute(id: number) {
|
||||
return route('flights.edit', { flight: id })
|
||||
}
|
||||
|
||||
const ITEMS_PER_PAGE = 25
|
||||
|
||||
const headers = [
|
||||
@@ -70,6 +74,7 @@ const isSorting = computed(() => sortBy.value.length > 0)
|
||||
|
||||
const upcomingFlights = computed(() =>
|
||||
props.flightStats.upcomingFlights.value
|
||||
.sort((a, b) => new Date(a.departure_date).getTime() - new Date(b.departure_date).getTime())
|
||||
)
|
||||
|
||||
const departedFlights = computed(() =>
|
||||
@@ -259,7 +264,7 @@ watch(
|
||||
<v-list-item
|
||||
prepend-icon="mdi-pencil-outline"
|
||||
title="Edit"
|
||||
:href="route('flights.edit', { flight: (item as Flight).id })"
|
||||
:href="editRoute((item as Flight).id)"
|
||||
/>
|
||||
</v-list>
|
||||
</v-menu>
|
||||
@@ -499,6 +504,7 @@ watch(
|
||||
.class-cell {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
vertical-align: middle;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
|
||||
@@ -282,4 +282,28 @@ const upcomingDurationDisplay = computed(() => {
|
||||
text-transform: uppercase;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
.stats-bar {
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.stat {
|
||||
padding: 14px 16px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.stats-bar {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.stat {
|
||||
padding: 12px 14px;
|
||||
}
|
||||
|
||||
.stat-num {
|
||||
font-size: 22px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,24 +1,68 @@
|
||||
<script setup lang="ts">
|
||||
import { Link } from "@inertiajs/vue3";
|
||||
import { Link, useForm } from "@inertiajs/vue3";
|
||||
import { usePage } from '@inertiajs/vue3'
|
||||
import type { SharedProps } from '@/Types/types'
|
||||
import { ref } from 'vue'
|
||||
import { ref, onMounted, onUnmounted } from 'vue'
|
||||
|
||||
const props = usePage<SharedProps>().props
|
||||
const menuOpen = ref(false)
|
||||
const dropdownOpen = ref(false)
|
||||
const dropdownRef = ref<HTMLElement | null>(null)
|
||||
|
||||
const logoutForm = useForm({})
|
||||
const logout = () => logoutForm.post(route('logout'))
|
||||
|
||||
const handleClickOutside = (e: MouseEvent) => {
|
||||
if (dropdownRef.value && !dropdownRef.value.contains(e.target as Node)) {
|
||||
dropdownOpen.value = false
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => document.addEventListener('click', handleClickOutside))
|
||||
onUnmounted(() => document.removeEventListener('click', handleClickOutside))
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<header class="glass">
|
||||
<Link href="/" class="brand">FlightsGoneBy</Link>
|
||||
|
||||
<!-- Notification icon (always visible) -->
|
||||
<button v-if="props.auth.user" class="notif-btn" aria-label="Notifications">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none"
|
||||
stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path d="M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9" />
|
||||
<path d="M10.3 21a1.94 1.94 0 0 0 3.4 0" />
|
||||
</svg>
|
||||
<span class="notif-dot" />
|
||||
</button>
|
||||
|
||||
<!-- Desktop nav -->
|
||||
<nav class="nav-desktop">
|
||||
<template v-if="!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>
|
||||
</template>
|
||||
<span v-else class="nav-link nav-link--greeting"><Link :href="route('dashboard')">Welcome, {{ props.auth.user.name }}</Link></span>
|
||||
<template v-else>
|
||||
<Link :href="route('flights.add')" class="nav-link">Add Flight</Link>
|
||||
<Link :href="route('profile.view', { user: props.auth.user.name })" class="nav-link">Profile</Link>
|
||||
<Link href="/feed" class="nav-link">Feed</Link>
|
||||
|
||||
<!-- User dropdown -->
|
||||
<div class="dropdown" ref="dropdownRef">
|
||||
<button class="nav-link dropdown-trigger" @click="dropdownOpen = !dropdownOpen">
|
||||
{{ 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">
|
||||
<path d="m6 9 6 6 6-6"/>
|
||||
</svg>
|
||||
</button>
|
||||
<div v-if="dropdownOpen" class="dropdown-menu">
|
||||
<Link :href="route('import.fr24')" class="dropdown-item">Import from FR24</Link>
|
||||
<div class="dropdown-divider" />
|
||||
<button class="dropdown-item dropdown-item--danger" @click="logout">Log Out</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</nav>
|
||||
|
||||
<!-- Hamburger (mobile only) -->
|
||||
@@ -33,7 +77,15 @@ const menuOpen = ref(false)
|
||||
<Link :href="route('login')" class="nav-link">Log In</Link>
|
||||
<Link :href="route('register')" class="nav-link nav-link--highlight">Register</Link>
|
||||
</template>
|
||||
<span v-else class="nav-link nav-link--greeting"><Link :href="route('dashboard')">Welcome, {{ props.auth.user.name }}</Link></span>
|
||||
<template v-else>
|
||||
<span class="nav-greeting">Welcome, {{ props.auth.user.name }}</span>
|
||||
<Link :href="route('flights.add')" class="nav-link">Add Flight</Link>
|
||||
<Link :href="route('profile.view', { username: props.auth.user.name })" class="nav-link">Profile</Link>
|
||||
<Link href="/feed" class="nav-link nav-link--highlight">Feed</Link>
|
||||
<Link :href="route('import.fr24')" class="nav-link">Import from FR24</Link>
|
||||
<div class="dropdown-divider" />
|
||||
<button class="nav-link nav-link--danger" @click="logout">Log Out</button>
|
||||
</template>
|
||||
</nav>
|
||||
</Transition>
|
||||
</header>
|
||||
@@ -48,6 +100,7 @@ header {
|
||||
padding: 0 1.25rem;
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.brand {
|
||||
@@ -59,10 +112,51 @@ header {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.nav-greeting {
|
||||
font-size: 0.85rem;
|
||||
font-weight: 500;
|
||||
opacity: 0.6;
|
||||
padding: 0.3em 0.25rem;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
/* Notification button */
|
||||
.notif-btn {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
background: none;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
color: var(--text);
|
||||
border-radius: 4px;
|
||||
transition: color 0.15s ease, background 0.15s ease;
|
||||
}
|
||||
|
||||
.notif-btn:hover {
|
||||
color: var(--accent);
|
||||
background: rgba(56, 189, 248, 0.07);
|
||||
}
|
||||
|
||||
.notif-dot {
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
right: 6px;
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
background: var(--accent);
|
||||
border-radius: 50%;
|
||||
border: 1.5px solid var(--bg);
|
||||
}
|
||||
|
||||
/* Shared nav link base */
|
||||
.nav-link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.3em;
|
||||
padding: 0.3em 0.75em;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
@@ -70,6 +164,9 @@ header {
|
||||
text-decoration: none;
|
||||
color: var(--text);
|
||||
border-radius: 4px;
|
||||
border: none;
|
||||
background: none;
|
||||
cursor: pointer;
|
||||
transition: color 0.15s ease, background 0.15s ease;
|
||||
}
|
||||
|
||||
@@ -82,7 +179,6 @@ header {
|
||||
background: rgba(56, 189, 248, 0.07);
|
||||
}
|
||||
|
||||
/* Highlighted CTA-style link */
|
||||
.nav-link--highlight {
|
||||
border: 1px solid rgba(56, 189, 248, 0.35);
|
||||
color: var(--accent);
|
||||
@@ -96,10 +192,75 @@ header {
|
||||
background: rgba(56, 189, 248, 0.12);
|
||||
}
|
||||
|
||||
.nav-link--greeting {
|
||||
opacity: 0.7;
|
||||
font-size: 0.85rem;
|
||||
cursor: default;
|
||||
.nav-link--danger {
|
||||
width: 100%;
|
||||
color: #f87171;
|
||||
}
|
||||
|
||||
.nav-link--danger:hover {
|
||||
color: #f87171;
|
||||
background: rgba(248, 113, 113, 0.08);
|
||||
}
|
||||
|
||||
/* Dropdown */
|
||||
.dropdown {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.dropdown-trigger {
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
position: absolute;
|
||||
top: calc(100% + 0.4rem);
|
||||
right: 0;
|
||||
min-width: 180px;
|
||||
background: var(--bg);
|
||||
border: 1px solid rgba(56, 189, 248, 0.12);
|
||||
border-radius: 6px;
|
||||
padding: 0.35rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.1rem;
|
||||
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.dropdown-item {
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: 0.4em 0.75em;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
letter-spacing: 0.03em;
|
||||
text-decoration: none;
|
||||
color: var(--text);
|
||||
border-radius: 4px;
|
||||
border: none;
|
||||
background: none;
|
||||
cursor: pointer;
|
||||
text-align: left;
|
||||
transition: color 0.15s ease, background 0.15s ease;
|
||||
}
|
||||
|
||||
.dropdown-item:hover {
|
||||
color: var(--accent);
|
||||
background: rgba(56, 189, 248, 0.07);
|
||||
}
|
||||
|
||||
.dropdown-item--danger {
|
||||
color: #f87171;
|
||||
}
|
||||
|
||||
.dropdown-item--danger:hover {
|
||||
color: #f87171;
|
||||
background: rgba(248, 113, 113, 0.08);
|
||||
}
|
||||
|
||||
.dropdown-divider {
|
||||
height: 1px;
|
||||
background: rgba(56, 189, 248, 0.1);
|
||||
margin: 0.25rem 0;
|
||||
}
|
||||
|
||||
/* Desktop nav */
|
||||
|
||||
@@ -1,28 +1,74 @@
|
||||
<script setup lang="ts">
|
||||
import {Flight, User} from "@/Types/types";
|
||||
import { usePage } from "@inertiajs/vue3";
|
||||
import { computed, ref } from "vue";
|
||||
import type { Flight, User, SharedProps } from "@/Types/types";
|
||||
|
||||
defineProps<{
|
||||
const props = defineProps<{
|
||||
user: User
|
||||
flights: Flight[]
|
||||
isFollowing?: boolean
|
||||
}>()
|
||||
|
||||
const auth = usePage<SharedProps>().props.auth
|
||||
const isOwnProfile = computed(() => auth.user?.id == props.user.id)
|
||||
const isLoggedIn = computed(() => !!auth.user)
|
||||
|
||||
const following = ref(props.isFollowing ?? false)
|
||||
const processing = ref(false)
|
||||
const snackbar = ref(false)
|
||||
const snackbarMessage = ref('')
|
||||
|
||||
const follow = async () => {
|
||||
processing.value = true
|
||||
const response = await fetch(route('profile.follow', { user: props.user.name }), {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]')?.getAttribute('content') ?? '',
|
||||
},
|
||||
})
|
||||
const data = await response.json()
|
||||
following.value = data.following
|
||||
snackbarMessage.value = data.following ? `You are now following ${props.user.name}` : `You unfollowed ${props.user.name}`
|
||||
snackbar.value = true
|
||||
processing.value = false
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="board-header">
|
||||
<div class="board-title-group">
|
||||
<span class="board-eyebrow">FLIGHT HISTORY</span>
|
||||
<h1 class="board-title">{{ user.name }}</h1>
|
||||
<div class="board-left">
|
||||
<div class="board-title-group">
|
||||
<span class="board-eyebrow">FLIGHT HISTORY</span>
|
||||
<div class="board-title-row">
|
||||
<h1 class="board-title">{{ user.name }}</h1>
|
||||
<button
|
||||
v-if="isLoggedIn && !isOwnProfile"
|
||||
class="follow-btn"
|
||||
:disabled="processing"
|
||||
@click="follow"
|
||||
>
|
||||
{{ following ? 'Following' : '+ Follow' }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="board-count">
|
||||
<span class="count-number">{{ flights.length }}</span>
|
||||
<span class="count-label">FLIGHTS</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<v-snackbar v-model="snackbar" :timeout="5000" color="#ffc107" location="bottom center">
|
||||
{{ snackbarMessage }}
|
||||
<template #actions>
|
||||
<v-btn variant="text" @click="snackbar = false">Close</v-btn>
|
||||
</template>
|
||||
</v-snackbar>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
/* ── Header ── */
|
||||
.board-header {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
@@ -32,6 +78,11 @@ defineProps<{
|
||||
padding-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
.board-left {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.board-eyebrow {
|
||||
display: block;
|
||||
font-family: 'Share Tech Mono', monospace;
|
||||
@@ -41,6 +92,12 @@ defineProps<{
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.board-title-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.board-title {
|
||||
font-family: 'Barlow Condensed', sans-serif;
|
||||
font-size: 2.2rem;
|
||||
@@ -51,6 +108,30 @@ defineProps<{
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.follow-btn {
|
||||
font-family: 'Share Tech Mono', monospace;
|
||||
font-size: 0.75rem;
|
||||
letter-spacing: 0.12em;
|
||||
color: #ffc107;
|
||||
background: none;
|
||||
border: 1px solid rgba(255, 193, 7, 0.35);
|
||||
border-radius: 4px;
|
||||
padding: 0.3em 0.85em;
|
||||
cursor: pointer;
|
||||
transition: background 0.15s ease;
|
||||
white-space: nowrap;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.follow-btn:hover:not(:disabled) {
|
||||
background: rgba(255, 193, 7, 0.1);
|
||||
}
|
||||
|
||||
.follow-btn:disabled {
|
||||
opacity: 0.5;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.board-count {
|
||||
text-align: right;
|
||||
line-height: 1;
|
||||
|
||||
@@ -5,12 +5,13 @@ import ProfileHeader from "@/Components/FlightsGoneBy/ProfileHeader.vue";
|
||||
defineProps<{
|
||||
user: User
|
||||
flights: Flight[]
|
||||
isFollowing: boolean
|
||||
}>()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="board-wrapper">
|
||||
<ProfileHeader :user="user" :flights="flights" />
|
||||
<ProfileHeader :is-following="isFollowing" :user="user" :flights="flights" />
|
||||
<slot />
|
||||
</div>
|
||||
</template>
|
||||
@@ -22,4 +23,10 @@ defineProps<{
|
||||
font-family: 'Barlow', sans-serif;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.board-wrapper {
|
||||
padding: 1em 0.25em;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -25,7 +25,7 @@ const props = defineProps<{
|
||||
flight_class: FlightClass | null
|
||||
flight_reason: FlightReason | null
|
||||
crew_type: CrewType | null
|
||||
airline_options: { value: number; title: string }[]
|
||||
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 }[]
|
||||
@@ -106,7 +106,7 @@ const form = useForm({
|
||||
arrival_date: props.flight?.arrival_date ?? '',
|
||||
from: props.flight?.from_options[0] ?? null as { value: number; title: string; country_code: string } | null,
|
||||
to: props.flight?.to_options[0] ?? null as { value: number; title: string; country_code: string } | null,
|
||||
airline: props.flight?.airline_options[0] ?? null as { value: number; title: string } | null,
|
||||
airline: props.flight?.airline_options[0] ?? null as { value: number; title: string; logo_url: string } | null,
|
||||
aircraft: props.flight?.aircraft_options[0] ?? null as { value: number; title: string } | null,
|
||||
aircraft_registration: props.flight?.aircraft_registration ?? '',
|
||||
seat_number: props.flight?.seat_number ?? '',
|
||||
@@ -170,7 +170,7 @@ function submit() {
|
||||
|
||||
// ── Prefilled options ─────────────────────────────────────────────────────────
|
||||
|
||||
const airlineOptionsData = ref<{ value: number; title: string }[]>(props.flight?.airline_options ?? [])
|
||||
const airlineOptionsData = ref<{ value: number; title: string; logo_url: string}[]>(props.flight?.airline_options ?? [])
|
||||
const fromOptionsData = ref<{ value: number; title: string; country_code: string }[]>(props.flight?.from_options ?? [])
|
||||
const toOptionsData = ref<{ value: number; title: string; country_code: string }[]>(props.flight?.to_options ?? [])
|
||||
const aircraftOptionsData = ref<{ value: number; title: string }[]>(props.flight?.aircraft_options ?? [])
|
||||
|
||||
@@ -1,30 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import MainLayout from "@/Layouts/MainLayout.vue";
|
||||
import { Head } from '@inertiajs/vue3';
|
||||
import {Flight, User} from "@/Types/types";
|
||||
import ProfileViewSwitcher from "@/Components/FlightsGoneBy/ProfileViewSwitcher.vue";
|
||||
import ProfileLayout from "@/Components/FlightsGoneBy/ProfileLayout.vue";
|
||||
import FlightMapAndCharts from "@/Components/FlightsGoneBy/FlightMapAndCharts.vue";
|
||||
|
||||
defineOptions({
|
||||
layout: MainLayout
|
||||
})
|
||||
|
||||
defineProps<{
|
||||
user: User
|
||||
flights: Flight[]
|
||||
canEdit: boolean
|
||||
}>()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Head :title="`${user.name}'s Flights`" />
|
||||
<ProfileLayout :flights="flights" :user="user">
|
||||
<ProfileViewSwitcher active-view="map" :user="user" />
|
||||
<FlightMapAndCharts :flights="flights" :canEdit="canEdit" />
|
||||
</ProfileLayout>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -17,11 +17,12 @@ const props = defineProps<{
|
||||
user: User
|
||||
flights: Flight[]
|
||||
canEdit: boolean
|
||||
selectedFlightId: number | null
|
||||
selectedFlightId?: number | null
|
||||
initialView?: ProfileView
|
||||
isFollowing: boolean
|
||||
}>()
|
||||
|
||||
const localSelectedFlightId = ref(props.selectedFlightId)
|
||||
const localSelectedFlightId = ref(props.selectedFlightId ?? null)
|
||||
|
||||
// ── Filter state ──────────────────────────────────────────────────────────────
|
||||
const selectedYears = ref<number[]>([])
|
||||
@@ -69,9 +70,7 @@ function matchesFilters(f: Flight): boolean {
|
||||
}
|
||||
|
||||
const filteredFlights = computed(() => {
|
||||
console.time('filteredFlights')
|
||||
const result = props.flights.filter(matchesFilters)
|
||||
console.timeEnd('filteredFlights')
|
||||
return result
|
||||
})
|
||||
|
||||
@@ -100,19 +99,23 @@ const routeNames = {
|
||||
} as const
|
||||
|
||||
function switchView(view: ProfileView) {
|
||||
const flightId = view === 'board' ? localSelectedFlightId.value : null
|
||||
localSelectedFlightId.value = null
|
||||
activeView.value = view
|
||||
window.history.replaceState(
|
||||
window.history.state,
|
||||
'',
|
||||
route(routeNames[view], { username: props.user.name })
|
||||
route(routeNames[view], {
|
||||
user: props.user.name,
|
||||
...(flightId ? { flight: flightId } : {})
|
||||
})
|
||||
)
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Head :title="`${user.name}'s Flights`" />
|
||||
<ProfileLayout :flights="flights" :user="user">
|
||||
<ProfileLayout :is-following="isFollowing" :flights="flights" :user="user">
|
||||
<ProfileViewSwitcher :active-view="activeView" @update:active-view="switchView" />
|
||||
<DepartureBoard v-if="activeView === 'board'" :flight-id="localSelectedFlightId" :flight-stats="stats" :canEdit="canEdit" />
|
||||
<BoardingPasses v-if="activeView === 'passes'" :flight-stats="stats" :canEdit="canEdit" />
|
||||
|
||||
+20
-6
@@ -1,11 +1,14 @@
|
||||
<?php
|
||||
|
||||
use App\Http\Controllers\Api\AirlineApiController;
|
||||
use App\Http\Controllers\Api\UserApiController;
|
||||
use App\Http\Controllers\FlightController;
|
||||
use App\Http\Controllers\FlightImportController;
|
||||
use App\Http\Controllers\FlightProfileController;
|
||||
use App\Http\Controllers\LogoController;
|
||||
use App\Http\Controllers\ProfileController;
|
||||
use App\Http\Controllers\SearchController;
|
||||
use App\Http\Controllers\UserController;
|
||||
use App\Models\Airline;
|
||||
use App\Models\FlightClass;
|
||||
use App\Models\FlightReason;
|
||||
@@ -58,6 +61,8 @@ Route::domain(config('app.domain'))->group(
|
||||
Route::get('/flights/lookup', [FlightController::class, 'lookup'])->name('flights.lookup');
|
||||
Route::post('/flights/import', [FlightImportController::class, 'store'])->name('flights.import.store');
|
||||
|
||||
Route::post('/u/{user}/follow', [UserController::class, 'follow'])->name('profile.follow');
|
||||
|
||||
Route::get('/profile', [ProfileController::class, 'edit'])->name('profile.edit');
|
||||
Route::patch('/profile', [ProfileController::class, 'update'])->name('profile.update');
|
||||
Route::delete('/profile', [ProfileController::class, 'destroy'])->name('profile.destroy');
|
||||
@@ -71,11 +76,11 @@ Route::domain(config('app.domain'))->group(
|
||||
Route::get('/search/airports', [SearchController::class, 'airports'])->name('search.airports');
|
||||
|
||||
|
||||
Route::get('/u/{username}', [FlightProfileController::class, 'view'])->name('profile.view');
|
||||
Route::get('/u/{username}/map', [FlightProfileController::class, 'map'])->name('profile.map');
|
||||
Route::get('/u/{username}/departure-board/{flight?}', [FlightProfileController::class, 'departureBoard'])
|
||||
Route::get('/u/{user}', [FlightProfileController::class, 'view'])->name('profile.view');
|
||||
Route::get('/u/{user}/map', [FlightProfileController::class, 'map'])->name('profile.map');
|
||||
Route::get('/u/{user}/departure-board/{flight?}', [FlightProfileController::class, 'departureBoard'])
|
||||
->name('profile.departure-board');
|
||||
Route::get('/u/{username}/boarding-passes', [FlightProfileController::class, 'boardingPasses'])->name('profile.boarding-passes');
|
||||
Route::get('/u/{user}/boarding-passes', [FlightProfileController::class, 'boardingPasses'])->name('profile.boarding-passes');
|
||||
|
||||
require __DIR__.'/auth.php';
|
||||
|
||||
@@ -91,7 +96,16 @@ Route::domain(config('app.api_domain'))->group(function () {
|
||||
return response()->json(['message' => 'Welcome to the FlightsGoneBy API']);
|
||||
});
|
||||
|
||||
Route::get('airline/{internalName}/logo/tail', [App\Http\Controllers\Api\LogoController::class, 'getLogoByInternalName']);
|
||||
Route::get('user/{username}/next-flight', [App\Http\Controllers\Api\UserController::class, 'nextFlight']);
|
||||
Route::prefix('airline')->controller(AirlineApiController::class)->group(function () {
|
||||
Route::get('{internalName}', 'get')->name('airline.show');
|
||||
Route::get('code/{code}', 'getByCode')->name('airline.code.index');
|
||||
Route::get('{internalName}/logo/tail', 'getLogoByInternalName')->name('airline.logo.tail');
|
||||
});
|
||||
|
||||
|
||||
Route::prefix('user')->controller(UserApiController::class)->group(function () {
|
||||
Route::get('{username}/next-flight', 'nextFlight');
|
||||
Route::get('{username}/flights', 'flights');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user