Poprawki statusów danych

src/components/App/StatusIndicator.vue

@@ -242,6 +242,13 @@ export default defineComponent({
         return;
       }
 
+      if (timetableDataStatus == DataStatus.Loading) {
+        this.setSignalStatus(timetableDataStatus);
+        this.indicator.status = timetableDataStatus;
+        this.indicator.message = 'Ładowanie rozkładów jazdy...';
+        return;
+      }
+
       this.setSignalStatus(DataStatus.Loaded);
 
       this.indicator.status = DataStatus.Loaded;

src/components/TrainsView/TrainTable.vue

@@ -1,16 +1,16 @@
 <template>
   <div class="train-table" @keydown.esc="closeTimetableCard">
     <transition name="anim" mode="out-in">
-      <div :key="timetableLoaded">
+      <div :key="trainsDataStatus">
         <div class="traffic-warning" v-if="distanceLimitExceeded">
           {{ $t('trains.distance-exceeded') }}
         </div>
 
-        <div class="table-info no-trains" v-if="trains.length == 0 && timetableLoaded">
+        <div class="table-info no-trains" v-if="trains.length == 0 && trainsDataStatus == 2">
           {{ $t('trains.no-trains') }}
         </div>
 
-        <div class="table-info loading" v-if="trains.length == 0 && !timetableLoaded">
+        <div class="table-info loading" v-if="trains.length == 0 && trainsDataStatus == 0">
           {{ $t('trains.loading') }}
         </div>
 
@@ -81,6 +81,7 @@ export default defineComponent({
     const store = useStore();
 
     const timetableDataStatus: ComputedRef<DataStatus> = computed(() => store.getters[GETTERS.timetableDataStatus]);
+    const trainsDataStatus: ComputedRef<DataStatus> = computed(() => store.getters[GETTERS.trainsDataStatus]);
 
     const searchedTrain = inject('searchedTrain') as Ref<string>;
     const searchedDriver = inject('searchedDriver') as Ref<string>;
@@ -106,7 +107,9 @@ export default defineComponent({
       currentTrains,
 
       sorterActive: inject('sorterActive') as { id: string | number; dir: number },
+      trainsDataStatus: computed(() => trainsDataStatus.value),
       timetableLoaded: computed(() => timetableDataStatus.value === DataStatus.Loaded),
+      timetableWarning: computed(() => timetableDataStatus.value === DataStatus.Warning),
       timetableError: computed(() => timetableDataStatus.value === DataStatus.Error),
       distanceLimitExceeded: computed(
         () => props.trains.findIndex(({ timetableData }) => timetableData && timetableData.routeDistance > 200) != -1

src/constants/storeConstants.ts

@@ -27,7 +27,7 @@ export const GETTERS = {
     timetableDataStatus: "timetableDataStatus",
     sceneryDataStatus: "sceneryDataStatus",
     dispatcherDataStatus: "dispatcherDataStatus",
-    trainsDataStatus: "trainDataStatus",
+    trainsDataStatus: "trainsDataStatus",
 
     dataStatus: "dataStatus",
     currentRegion: "currentRegion"

src/locales/en.json

@@ -47,7 +47,8 @@
     "no-limit": "NO LIMIT",
     "unavailable": "UNAVAILABLE",
     "brb": "AFK",
-    "no-space": "NO SPACE"
+    "no-space": "NO SPACE",
+    "unknown": "UNKNOWN"
   },
   "options": {
     "filters": "FILTERS",

src/locales/pl.json

@@ -47,7 +47,8 @@
     "no-limit": "BEZ LIMITU",
     "unavailable": "NIEDOSTĘPNY",
     "brb": "Z/W",
-    "no-space": "BRAK MIEJSCA"
+    "no-space": "BRAK MIEJSCA",
+    "unknown": "NIEZNANY"
   },
   "options": {
     "filters": "FILTRY",

src/scripts/utils/storeUtils.ts

@@ -5,6 +5,7 @@ export const getLocoURL = (locoType: string): string => (`https://rj.td2.info.pl
 
 export const getStatusID = (stationStatus: any): string => {
   if (!stationStatus) return "not-signed";
+  if (stationStatus == -1) return "unknown";
 
   const statusCode = stationStatus[2];
   const statusTimestamp = stationStatus[3];
@@ -33,7 +34,7 @@ export const getStatusID = (stationStatus: any): string => {
 };
 
 export const getStatusTimestamp = (stationStatus: any): number => {
-  if (!stationStatus) return -2;
+  if (!stationStatus || stationStatus == -1) return -2;
 
   const statusCode = stationStatus[2];
   const statusTimestamp = stationStatus[3];

src/store/index.ts

@@ -5,8 +5,6 @@ import { createStore, useStore as baseUseStore, Store } from 'vuex'
 
 import axios from "axios";
 
-// import JSONStationData from "@/data/stationData.json";
-
 import Station from "@/scripts/interfaces/Station";
 import Train from "@/scripts/interfaces/Train";
 import TrainStop from "@/scripts/interfaces/TrainStop";
@@ -90,6 +88,7 @@ export const store = createStore<State>({
     }),
     timetableDataStatus: (state): DataStatus => state.timetableDataStatus,
     sceneryDataStatus: (state): DataStatus => state.sceneryDataStatus,
+    trainsDataStatus: (state): DataStatus => state.trainsDataStatus,
     dataStatus: (state): DataStatus => state.dataConnectionStatus,
     currentRegion: (state): { id: string; value: string } => state.region
   },
@@ -131,7 +130,7 @@ export const store = createStore<State>({
           const updatedStationList: Station['onlineInfo'][] = onlineStationsData.message.reduce((acc, station) => {
             if (station.region !== this.state.region.id || !station.isOnline) return acc;
 
-            const stationStatus = onlineDispatchersData.success ? onlineDispatchersData.message.find((status: string[]) => status[0] == station.stationHash && status[1] == this.state.region.id) : undefined;            
+            const stationStatus = onlineDispatchersData.success ? onlineDispatchersData.message.find((status: string[]) => status[0] == station.stationHash && status[1] == this.state.region.id) : -1;            
 
             const statusTimestamp = getStatusTimestamp(stationStatus);
             const statusID = getStatusID(stationStatus);
@@ -193,6 +192,7 @@ export const store = createStore<State>({
           // Statuses
           commit(MUTATIONS.SET_DATA_CONNECTION_STATUS, DataStatus.Loaded);
           
+          // commit(MUTATIONS.SET_TIMETABLE_DATA_STATUS, DataStatus.Loading);
           dispatch(ACTIONS.fetchTimetableData);
         })
         .catch(() => {

src/styles/scenery_status.scss

@@ -5,6 +5,7 @@ $unav: #ff3d5d;
 $brb: #e6a100;
 $no-space: #222;
 $taken: #09a116;
+$unknown: rgb(185, 60, 60);
 
 .status-badge {
   border-radius: 1rem;
@@ -47,4 +48,9 @@ $taken: #09a116;
     color: white;
     font-size: 0.85em;
   }
+
+  &.unknown {
+    background-color: $unknown;
+    font-size: 0.95em;
+  }
 }

src/views/TrainsView.vue

@@ -129,8 +129,6 @@ export default defineComponent({
     provide('sorterActive', sorterActive);
 
     const computedTrains: ComputedRef<Train[]> = computed(() => {
-      if (timetableDataStatus.value != DataStatus.Loaded) return [];
-
       return filteredTrainList(trainList.value, searchedTrain.value, searchedDriver.value, sorterActive.value);
     });