Files
FlightsAPI/resources/js/Pages/ReconcileFlight.vue
T
2026-04-03 23:59:40 +10:00

166 lines
6.5 KiB
Vue

<script setup lang="ts">
import MainLayout from "@/Layouts/MainLayout.vue";
import GlassBox from "@/Components/FlightsGoneBy/GlassBox.vue";
import {Head, useForm} from "@inertiajs/vue3";
import AirlineSearchBox from "@/Components/FlightsGoneBy/AirlineSearchBox.vue";
defineOptions({ layout: MainLayout });
const props = defineProps<{
flight: {
flight_reasons: { value: number, title: string }[]
flight_classes:{ value: number, title: string }[]
seat_types: { value: number, title: string }[]
seat_type: number,
'flight_class': number,
'flight_reason': number,
flight_number: string
date: string
registration: string
seat_number: string
note: string
dep_time: string
arr_time: string
duration: string
airline_options: { value: number, title: string }[]
}
}>()
const flight = props.flight;
const form = useForm({
date: flight.date,
flight_number: flight.flight_number,
from: '',
to: '',
dep_time: flight.dep_time,
arr_time: flight.arr_time,
duration: flight.duration,
airline_id: flight.airline_options[0] ?? null,
aircraft: '',
registration: flight.registration,
seat_number: flight.seat_number,
seat_type: flight.seat_types[flight.seat_type],
flight_class: flight.flight_classes[flight.flight_class],
flight_reason: flight.flight_reasons[flight.flight_reason],
note: flight.note,
});
function submit() {
form.post(route('reconcile.store'));
}
</script>
<template>
<Head title="Reconcile"></Head>
<GlassBox>
<h2>Reconcile {{flight.flight_number.length > 1 ? 'Flight ' + flight.flight_number: 'This Flight'}}</h2>
<p>Review and correct your imported flight details before they're saved.</p>
<v-form style="width: 100%">
<v-container>
<!-- Date / Flight Number / Registration -->
<v-row>
<v-col cols="12" md="4">
<v-text-field type="date" v-model="form.date" label="Date" placeholder="03-18-11" :error-messages="form.errors.date" />
</v-col>
<v-col cols="12" md="4">
<v-text-field v-model="form.flight_number" label="Flight Number" placeholder="UL227" :error-messages="form.errors.flight_number" />
</v-col>
<v-col cols="12" md="4">
<v-text-field v-model="form.registration" label="Registration" placeholder="4R-ALX" :error-messages="form.errors.registration" />
</v-col>
</v-row>
<!-- From / To -->
<v-row>
<v-col cols="12" md="6">
<v-autocomplete label="From" :items="[]" placeholder="Dubai International (DXB)" :error-messages="form.errors.from" hide-no-data clearable />
</v-col>
<v-col cols="12" md="6">
<v-autocomplete label="To" :items="[]" placeholder="Kuwait (KWI)" :error-messages="form.errors.to" hide-no-data clearable />
</v-col>
</v-row>
<!-- Dep time / Arr time / Duration -->
<v-row>
<v-col cols="12" md="4">
<v-text-field v-model="form.dep_time" type="time" label="Departure Time" placeholder="09:30" :error-messages="form.errors.dep_time" />
</v-col>
<v-col cols="12" md="4">
<v-text-field v-model="form.arr_time" type="time" label="Arrival Time" placeholder="11:45" :error-messages="form.errors.arr_time" />
</v-col>
<v-col cols="12" md="4">
<v-text-field v-model="form.duration" label="Duration" placeholder="1:23" :error-messages="form.errors.duration" />
</v-col>
</v-row>
<!-- Airline / Aircraft -->
<v-row>
<v-col cols="12" md="6">
<AirlineSearchBox
v-model="form.airline_id"
:prefilled-options="flight.airline_options"
:error-messages="form.errors.airline_id"
/>
</v-col>
<v-col cols="12" md="6">
<v-autocomplete label="Aircraft" :items="[]" placeholder="Airbus A330" :error-messages="form.errors.aircraft" hide-no-data clearable />
</v-col>
</v-row>
<!-- Seat Number / Seat Type / Flight Class / Flight Reason -->
<v-row>
<v-col cols="12" md="3">
<v-text-field v-model="form.seat_number" label="Seat Number" placeholder="22A" :error-messages="form.errors.seat_number" />
</v-col>
<v-col cols="12" md="3">
<v-select v-model="form.seat_type" label="Seat Type" :items="flight.seat_types" :error-messages="form.errors.seat_type" clearable />
</v-col>
<v-col cols="12" md="3">
<v-select v-model="form.flight_class" label="Class" :items="flight.flight_classes" :error-messages="form.errors.flight_class" clearable />
</v-col>
<v-col cols="12" md="3">
<v-select v-model="form.flight_reason" label="Reason" :items="flight.flight_reasons" :error-messages="form.errors.flight_reason" clearable />
</v-col>
</v-row>
<!-- Note -->
<v-row>
<v-col cols="12">
<v-textarea v-model="form.note" label="Note" placeholder="Any additional notes…" :error-messages="form.errors.note" rows="3" auto-grow />
</v-col>
</v-row>
<!-- Submit -->
<v-row>
<v-col cols="12" class="d-flex justify-end">
<v-btn size="large" :loading="form.processing" :disabled="form.processing" @click="submit">
Save Flight
</v-btn>
</v-col>
</v-row>
</v-container>
</v-form>
</GlassBox>
</template>
<style scoped>
h2 {
font-size: 2rem;
text-align: center;
}
p {
text-align: center;
width: 100%;
opacity: 0.7;
margin-bottom: 1rem;
}
</style>