Added engine count/type filters

resources/js/Components/FlightsGoneBy/FlightFilter.vue

@@ -23,6 +23,8 @@ const emit = defineEmits<{
         seatTypes: number[]
         manufacturers: string[]
         aircraftModels: number[]
+        engineTypes: string[]
+        engineCounts: number[]
         airportRegions: number[]
         otherUsers: string[]
     }]
@@ -62,6 +64,8 @@ function buildOptions(flights: Flight[]) {
     const regionRanges   = new Set<RegionRange>()
     const manufacturers  = new Map<string, { name: string }>()
     const aircraftModels = new Map<number, { id: number; name: string }>()
+    const engineTypes    = new Map<string, { name: string }>()
+    const engineCounts   = new Map<number, { count: number }>()
     const airportRegions = new Map<number, { id: number; name: string; countryCodes: Set<string> }>()
     const otherUsers = new Set<string>()
 
@@ -120,6 +124,12 @@ function buildOptions(flights: Flight[]) {
         if (f.aircraft?.id != null && f.aircraft?.display_name_short)
             aircraftModels.set(f.aircraft.id, { id: f.aircraft.id, name: f.aircraft.display_name_short })
 
+        if (f.aircraft?.engine_type)
+            engineTypes.set(f.aircraft.engine_type, { name: f.aircraft.engine_type })
+
+        if (f.aircraft?.engine_count != null)
+            engineCounts.set(f.aircraft.engine_count, { count: f.aircraft.engine_count })
+
         flightScopes.add(f.scope)
         flightRanges.add(f.range)
         regionRanges.add(f.region_range)
@@ -144,6 +154,8 @@ function buildOptions(flights: Flight[]) {
         regionRanges:   regionRangeOrder.filter(r => regionRanges.has(r)).map(r => ({ value: r, label: REGION_RANGE_LABELS[r] })),
         manufacturers:  [...manufacturers.values()].sort((a, b) => a.name.localeCompare(b.name)),
         aircraftModels: [...aircraftModels.values()].sort((a, b) => a.name.localeCompare(b.name)),
+        engineTypes:    [...engineTypes.values()].sort((a, b) => a.name.localeCompare(b.name)),
+        engineCounts:   [...engineCounts.values()].sort((a, b) => a.count - b.count),
         airportRegions: [...airportRegions.values()].sort((a, b) => a.name.localeCompare(b.name)),
         otherUsers: [...otherUsers].sort((a, b) => a.localeCompare(b)),
     }
@@ -167,6 +179,8 @@ const selectedFlightReasons  = ref<number[]>([])
 const selectedSeatTypes      = ref<number[]>([])
 const selectedManufacturers  = ref<string[]>([])
 const selectedAircraftModels = ref<number[]>([])
+const selectedEngineTypes    = ref<string[]>([])
+const selectedEngineCounts   = ref<number[]>([])
 const selectedAirportRegions = ref<number[]>([])
 const selectedOtherUsers = ref<string[]>([])
 
@@ -197,6 +211,8 @@ function emitFilters() {
         seatTypes:      selectedSeatTypes.value,
         manufacturers:  selectedManufacturers.value,
         aircraftModels: selectedAircraftModels.value,
+        engineTypes:    selectedEngineTypes.value,
+        engineCounts:   selectedEngineCounts.value,
         airportRegions: selectedAirportRegions.value,
         otherUsers: selectedOtherUsers.value,
     })
@@ -496,6 +512,42 @@ const countryFlagClass = (code: string) =>
             </template>
         </v-select>
 
+        <v-select
+            v-if="availableOptions.engineTypes.length > 0"
+            v-model="selectedEngineTypes"
+            :items="availableOptions.engineTypes"
+            item-title="name" item-value="name"
+            label="Engine Type"
+            multiple clearable hide-details
+            density="compact" variant="outlined"
+            @update:model-value="emitFilters"
+        >
+            <template #selection="{ item, index }">
+                <span v-if="index < 2" class="v-select__selection-text">
+                    {{ (item as any).name }}<span v-if="index < Math.min(selectedEngineTypes.length, 2) - 1">,&nbsp;</span>
+                </span>
+                <span v-if="index === 2" class="text-caption text-medium-emphasis">+{{ selectedEngineTypes.length - 2 }}</span>
+            </template>
+        </v-select>
+
+        <v-select
+            v-if="availableOptions.engineCounts.length > 0"
+            v-model="selectedEngineCounts"
+            :items="availableOptions.engineCounts"
+            item-title="count" item-value="count"
+            label="Engine Count"
+            multiple clearable hide-details
+            density="compact" variant="outlined"
+            @update:model-value="emitFilters"
+        >
+            <template #selection="{ item, index }">
+                <span v-if="index < 2" class="v-select__selection-text">
+                    {{ (item as any).count }}<span v-if="index < Math.min(selectedEngineCounts.length, 2) - 1">,&nbsp;</span>
+                </span>
+                <span v-if="index === 2" class="text-caption text-medium-emphasis">+{{ selectedEngineCounts.length - 2 }}</span>
+            </template>
+        </v-select>
+
         <v-select
             v-if="availableOptions.crewTypes.length > 0"
             v-model="selectedCrewTypes"

resources/js/Pages/UserProfile.vue

@@ -56,6 +56,8 @@ const selectedFlightReasons  = ref<number[]>([])
 const selectedSeatTypes      = ref<number[]>([])
 const selectedManufacturers  = ref<string[]>([])
 const selectedAircraftModels = ref<number[]>([])
+const selectedEngineTypes    = ref<string[]>([])
+const selectedEngineCounts   = ref<number[]>([])
 const selectedAirportRegions = ref<number[]>([])
 const selectedOtherUsers = ref<string[]>([])
 
@@ -74,6 +76,8 @@ const activeFilterCount = computed(() =>
     selectedSeatTypes.value.length +
     selectedManufacturers.value.length +
     selectedAircraftModels.value.length +
+    selectedEngineTypes.value.length +
+    selectedEngineCounts.value.length +
     selectedAirportRegions.value.length +
     selectedOtherUsers.value.length
 )
@@ -93,6 +97,8 @@ function onFiltersChange(filters: {
     seatTypes: number[]
     manufacturers: string[]
     aircraftModels: number[]
+    engineTypes: string[]
+    engineCounts: number[]
     airportRegions: number[]
     otherUsers: string[]
 }) {
@@ -111,6 +117,8 @@ function onFiltersChange(filters: {
     selectedSeatTypes.value      = filters.seatTypes
     selectedManufacturers.value  = filters.manufacturers
     selectedAircraftModels.value = filters.aircraftModels
+    selectedEngineTypes.value    = filters.engineTypes
+    selectedEngineCounts.value   = filters.engineCounts
     selectedAirportRegions.value = filters.airportRegions
     selectedOtherUsers.value     = filters.otherUsers
 }
@@ -141,6 +149,8 @@ function matchesFilters(f: Flight): boolean {
     if (selectedSeatTypes.value.length && !selectedSeatTypes.value.includes(f.seat_type?.id ?? -1)) return false
     if (selectedManufacturers.value.length && !selectedManufacturers.value.includes(f.aircraft?.manufacturer_code ?? '')) return false
     if (selectedAircraftModels.value.length && !selectedAircraftModels.value.includes(f.aircraft?.id ?? -1)) return false
+    if (selectedEngineTypes.value.length && !selectedEngineTypes.value.includes(f.aircraft?.engine_type ?? '')) return false
+    if (selectedEngineCounts.value.length && !selectedEngineCounts.value.includes(f.aircraft?.engine_count ?? -1)) return false
     if (selectedAirportRegions.value.length) {
         const depRegion = f.departure_airport.region?.id
         const arrRegion = f.arrival_airport.region?.id