Dodano listę brakujących ikon pojazdów trakcyjnych

src/components/TrainsView/TrainTable.vue

@@ -4,19 +4,19 @@
       {{ $t('trains.distance-exceeded') }}
     </div>
 
-    <div class="no-trains" v-if="computedTrains.length == 0 && timetableLoaded">
+    <div class="table-info no-trains" v-if="computedTrains.length == 0 && timetableLoaded">
       {{ $t('trains.no-trains') }}
     </div>
 
-    <div class="no-trains" v-if="computedTrains.length == 0 && !timetableLoaded">
+    <div class="table-info loading" v-if="computedTrains.length == 0 && !timetableLoaded">
       {{ $t('trains.loading') }}
     </div>
 
     <ul class="train-list">
       <li
         class="train-row"
-        v-for="(train, i) in computedTrains"
+        v-for="(train) in computedTrains.filter((_, i) => i < 10)"
-        :key="i"
+        :key="train.trainNo + train.driverId"
         tabindex="0"
         @keydown.enter="changeScheduleShowState(train.timetableData?.timetableId)"
         :ref="(el) => registerReference(el, train.timetableData?.timetableId)"
@@ -107,8 +107,10 @@
 
                 <span v-else>{{ displayLocoInfo(train.locoType) }}</span>
               </div>
+              
+              <img v-if="defaultVehicleIcons.includes(train.locoType)" class="train-image" :src="defaultLocoImage" alt="default vehicle">
+              <img v-else class="train-image" :src="train.locoURL" :alt="train.locoType" @error="onImageError" />
 
-              <img class="train-image" :src="train.locoURL" @error="onImageError" />
             </span>
           </span>
 
@@ -139,18 +141,25 @@
           />
         </transition>
       </li>
+
+      <div class="table-info limit" v-if="timetableLoaded && computedTrains.length > 10">
+        {{ $t('trains.table-limit') }}
+      </div>
     </ul>
   </div>
 </template>
 
 <script lang="ts">
-import Train from '@/scripts/interfaces/Train';
-import TrainStop from '@/scripts/interfaces/TrainStop';
-
-import TrainSchedule from '@/components/TrainsView/TrainSchedule.vue';
-import { DataStatus } from '@/scripts/enums/DataStatus';
 import { computed, ComputedRef, defineComponent, Ref, ref } from '@vue/runtime-core';
 import { useStore } from '@/store';
+
+import defaultVehicleIconsJSON from "@/data/defaultVehicleIcons.json";
+
+import Train from '@/scripts/interfaces/Train';
+import TrainStop from '@/scripts/interfaces/TrainStop';
+import TrainSchedule from '@/components/TrainsView/TrainSchedule.vue';
+
+import { DataStatus } from '@/scripts/enums/DataStatus';
 import { GETTERS } from '@/constants/storeConstants';
 
 export default defineComponent({
@@ -180,6 +189,8 @@ export default defineComponent({
       arrowDesc: require('@/assets/icon-arrow-desc.svg'),
     },
 
+    defaultVehicleIcons: defaultVehicleIconsJSON,
+
     stats: {
       main: [
         {
@@ -240,7 +251,7 @@ export default defineComponent({
         () =>
           props.computedTrains.findIndex(({ timetableData }) => timetableData && timetableData.routeDistance > 200) !=
           -1
-      ),
+      )
     };
   },
 
@@ -353,7 +364,7 @@ export default defineComponent({
   }
 }
 
-.no-trains {
+.table-info {
   text-align: center;
 
   padding: 1em;

src/data/defaultVehicleIcons.json

@@ -0,0 +1 @@
+["EP07-356","EP07-356","EP07-356","ET41-074","2EN57-694+716rb","EU07E-083","EN57-716rb","EN57-716rb","EN57-716rb","EN57-038rb","EN57-038rb","SM42-329_PLREG","2EN57-038+1715rb","EN57-1953rb","EN57-1953rb","SM42-1121","SM42-091","SM42-404","SM42-404","EN57-1914rb","EN57-961rb"]

src/locales/en.json

@@ -135,7 +135,8 @@
     "loco-electric": "Electric locomotive",
     "loco-diesel": "Diesel locomotive",
     "timetable-comments": "Exploitation comments available for this train",
-    "comment": "Exploitation comment"
+    "comment": "Exploitation comment",
+    "table-limit": "For performance reasons there's a limit of 10 trains shown at the same time." 
   },
   "journal": {
     "title": "SCENERY ACTIVITY JOURNAL",

src/locales/pl.json

@@ -135,7 +135,8 @@
     "loco-electric": "Elektrowóz",
     "loco-diesel": "Spalinowóz",
     "timetable-comments": "Pociąg z uwagami eksploatacyjnymi",
-    "comment": "Uwaga eksploatacyjna"
+    "comment": "Uwaga eksploatacyjna",
+    "table-limit": "Dla płynności działania strony pokazanych jest tylko 10 pociągów zgodnie z wybranymi filtrami." 
   },
   "journal": {
     "title": "DZIENNIK AKTYWNOŚCI SCENERII",

src/views/TrainsView.vue

@@ -39,7 +39,6 @@ const filteredTrainList = (
   return trainList
     .filter(
       (train) =>
-        train.online &&
         (searchedTrain.length > 0
           ? train.trainNo.toString().includes(searchedTrain)
           : true) &&
@@ -81,7 +80,7 @@ const filteredTrainList = (
       }
 
       return 0;
-    });
+    })
 };
 
 export default defineComponent({