filtrowanie statusów; poprawki w statystykach

src/App.scss

@@ -43,9 +43,10 @@
 #app {
   color: white;
   font-size: 1rem;
+  overflow-x: hidden;
 
   @include smallScreen() {
-    font-size: calc(0.55rem + 1.1vw);
+    font-size: calc(0.65rem + 0.8vw);
   }
 
   @include screenLandscape() {

src/App.vue

@@ -80,7 +80,7 @@ export default defineComponent({
         connectedSocketCount: 0
       };
 
-      this.store.setOnlineData();
+      this.store.setStatuses();
     });
 
     window.addEventListener('online', () => {

src/components/JournalView/DailyStats.vue

@@ -243,10 +243,6 @@ export default defineComponent({
 }
 
 @include smallScreen {
-  .daily-stats {
-    text-align: justify;
-  }
-
   h3 {
     text-align: center;
   }

src/components/JournalView/JournalOptions.vue

@@ -51,7 +51,11 @@
                 />
 
                 <button class="search-exit" v-if="propName != 'search-date'">
-                  <img src="/images/icon-exit.svg" alt="exit-icon" @click="onInputClear(propName)" />
+                  <img
+                    src="/images/icon-exit.svg"
+                    alt="exit-icon"
+                    @click="onInputClear(propName)"
+                  />
                 </button>
               </div>
             </div>
@@ -180,7 +184,7 @@ export default defineComponent({
   },
 
   watch: {
-    async driverStatsName() {
+    async 'store.driverStatsName'() {
       await this.fetchDriverStats();
 
       // if (value) this.store.currentStatsTab = 'driver';

src/components/JournalView/JournalStats.vue

@@ -86,8 +86,6 @@ watch(
 );
 
 onMounted(() => {
-  console.log(StorageManager.getBooleanValue('dailyStatsOpen'));
-
   if (StorageManager.getBooleanValue('dailyStatsOpen')) {
     areStatsOpen.value = true;
     store.currentStatsTab = 'daily';

src/components/SceneryView/SceneryInfo/SceneryInfoUserList.vue

@@ -3,7 +3,7 @@
     <h3 class="user-header section-header">
       <img src="/images/icon-user.svg" alt="Users icon" />
       &nbsp;{{ $t('scenery.users') }} &nbsp;
-      <span class="text--primary">{{ onlineScenery?.currentUsers || 0 }}</span
+      <span class="text--primary">{{ onlineScenery?.stationTrains?.length || 0 }}</span
       >&nbsp;/&nbsp;<span class="text--primary">{{ onlineScenery?.maxUsers || 0 }}</span>
     </h3>
 
@@ -22,7 +22,7 @@
 
     <div
       class="badge user badge-none"
-      v-if="!onlineScenery?.scheduledTrains || onlineScenery.scheduledTrains.length == 0"
+      v-if="!onlineScenery?.stationTrains?.length"
     >
       {{ $t('scenery.no-users') }}
     </div>

src/components/SceneryView/SceneryTimetable.vue

@@ -6,13 +6,10 @@
         <span>{{ $t('scenery.timetables') }}</span>
 
         <span>
-          <span class="text--primary">{{ onlineScenery?.scheduledTrains?.length || '0' }}</span>
+          <span class="text--primary">{{ onlineScenery?.scheduledTrainCount.all || 0 }}</span>
           <span> / </span>
           <span class="text--grayed">
-            {{
+            {{ onlineScenery?.scheduledTrainCount.confirmed || '0' }}
-              onlineScenery?.scheduledTrains?.filter((train) => train.stopInfo.confirmed).length ||
-              '0'
-            }}
           </span>
         </span>
 
@@ -48,27 +45,34 @@
     </div>
 
     <div class="timetable-list">
-      <div
-        style="padding-bottom: 5em"
-        v-if="store.dataStatuses.trains == 0 && computedScheduledTrains.length == 0"
-      >
-        <Loading />
-      </div>
-
-      <span
-        class="timetable-item empty"
-        v-else-if="computedScheduledTrains.length == 0 && !onlineScenery"
-      >
-        {{ $t('scenery.offline') }}
-      </span>
-
-      <span class="timetable-item empty" v-else-if="computedScheduledTrains.length == 0">
-        {{ $t('scenery.no-timetables') }}
-      </span>
-
       <transition-group name="list-anim">
+        <div
+          style="padding-bottom: 5em"
+          v-if="store.dataStatuses.trains == 0 && computedScheduledTrains.length == 0"
+          key="list-loading"
+        >
+          <Loading />
+        </div>
+
+        <span
+          class="timetable-item empty"
+          v-else-if="computedScheduledTrains.length == 0 && !onlineScenery"
+          key="list-offline"
+        >
+          {{ $t('scenery.offline') }}
+        </span>
+
+        <div
+          class="timetable-item empty"
+          v-else-if="computedScheduledTrains.length == 0"
+          key="list-no-timetables"
+        >
+          {{ $t('scenery.no-timetables') }}
+        </div>
+
         <div
           class="timetable-item"
+          v-else
           v-for="scheduledTrain in computedScheduledTrains"
           :key="scheduledTrain.trainId"
           tabindex="0"

src/components/StationsView/StationTable.vue

@@ -230,11 +230,9 @@
             </td>
 
             <td class="station_users" :class="{ inactive: !station.onlineInfo }">
-              <span>
+              <span>{{ station.onlineInfo?.currentUsers || 0 }}</span>
-                <span class="highlight">{{ station.onlineInfo?.currentUsers || 0 }}</span>
+              /
-                /
+              <span>{{ station.onlineInfo?.maxUsers || 0 }}</span>
-                <span class="highlight">{{ station.onlineInfo?.maxUsers || 0 }}</span>
-              </span>
             </td>
 
             <td class="station_spawns" :class="{ inactive: !station.onlineInfo }">
@@ -246,9 +244,7 @@
               style="width: 30px"
               :class="{ inactive: !station.onlineInfo }"
             >
-              <span class="highlight">
+              {{ station.onlineInfo?.scheduledTrainCount.all }}
-                {{ station.onlineInfo?.scheduledTrains?.length || 0 }}
-              </span>
             </td>
 
             <td
@@ -256,15 +252,7 @@
               style="width: 30px"
               :class="{ inactive: !station.onlineInfo }"
             >
-              <span style="color: #ccc">
+              {{ station.onlineInfo?.scheduledTrainCount.unconfirmed }}
-                {{
-                  new Set([
-                    ...(station.onlineInfo?.scheduledTrains
-                      ?.filter((train) => !train.stopInfo.confirmed)
-                      .map((train) => train.checkpointName) || [])
-                  ]).size || 0
-                }}
-              </span>
             </td>
 
             <td
@@ -272,12 +260,7 @@
               style="width: 30px"
               :class="{ inactive: !station.onlineInfo }"
             >
-              <span style="color: #66ff6c">
+              {{ station.onlineInfo?.scheduledTrainCount.confirmed }}
-                {{
-                  station.onlineInfo?.scheduledTrains?.filter((train) => train.stopInfo.confirmed)
-                    .length || 0
-                }}
-              </span>
             </td>
           </tr>
         </tbody>
@@ -391,10 +374,6 @@ $rowCol: #424242;
   }
 }
 
-.highlight {
-  color: gold;
-}
-
 section.station_table {
   overflow: auto;
   overflow-y: hidden;
@@ -576,6 +555,26 @@ td.station {
   }
 }
 
+.station_users {
+  span {
+    color: gold;
+  }
+}
+
+.station_schedules {
+  &.all {
+    color: gold;
+  }
+
+  &.unconfirmed {
+    color: #ccc;
+  }
+
+  &.confirmed {
+    color: lime;
+  }
+}
+
 .separator {
   border-left: 3px solid #b3b3b3;
 }

src/scripts/enums/DispatcherStatus.ts

@@ -0,0 +1,11 @@
+export enum DispatcherStatusID {
+  Unknown = 'unknown',
+  Outdated = 'outdated',
+  Unauthorized = 'not-signed',
+  OnlineNoLimit = 'no-limit',
+  Afk = 'brb',
+  Ending = 'ending',
+  NoSpace = 'no-space',
+  Unavailable = 'unavailable',
+  OnlineWithHours = 'online'
+}

src/scripts/interfaces/Station.ts

@@ -1,4 +1,4 @@
-import { Availability } from './store/storeTypes';
+import { Availability, OnlineScenery } from './store/storeTypes';
 import { ScheduledTrain } from './ScheduledTrain';
 import StationRoutes from './StationRoutes';
 
@@ -32,33 +32,5 @@ export default interface Station {
     }[];
   };
 
-  onlineInfo?: {
+  onlineInfo?: OnlineScenery;
-    hash: string;
-    name: string;
-    region: string;
-
-    maxUsers: number;
-    currentUsers: number;
-
-    spawns: { spawnName: string; spawnLength: number; isElectrified: boolean }[];
-    dispatcherRate: number;
-    dispatcherName: string;
-    dispatcherExp: number;
-    dispatcherId: number;
-    dispatcherIsSupporter: boolean;
-
-    statusTimestamp: number;
-    // statusTimeString: string;
-    statusID: string;
-
-    stationTrains?: {
-      driverName: string;
-      driverId: number;
-      trainNo: number;
-      trainId: string;
-      stopStatus?: string;
-    }[];
-
-    scheduledTrains?: ScheduledTrain[];
-  };
 }

src/scripts/interfaces/store/storeTypes.ts

@@ -7,6 +7,7 @@ import { DriverStatsAPIData } from '../api/DriverStatsAPIData';
 import { RollingStockGithubData } from '../github_api/StockInfoGithubData';
 import Station from '../Station';
 import { ScheduledTrain } from '../ScheduledTrain';
+import { DispatcherStatusID } from '../../enums/DispatcherStatus';
 
 export type Availability = 'default' | 'unavailable' | 'nonPublic' | 'abandoned' | 'nonDefault';
 
@@ -15,7 +16,7 @@ export interface StoreState {
   apiData: APIData;
   rollingStockData?: RollingStockGithubData;
 
-  lastDispatcherStatuses: { hash: string; statusTimestamp: number; statusID: string }[];
+  lastDispatcherStatuses: { hash: string; statusTimestamp: number; statusID: DispatcherStatusID }[];
 
   sceneryData: any[][];
 
@@ -113,8 +114,16 @@ export interface OnlineScenery {
   dispatcherIsSupporter: boolean;
 
   statusTimestamp: number;
-  statusID: string;
+  statusID: DispatcherStatusID;
+
+  isOnline: boolean;
 
   stationTrains?: StationTrain[];
   scheduledTrains?: ScheduledTrain[];
+
+  scheduledTrainCount: {
+    all: number;
+    confirmed: number;
+    unconfirmed: number;
+  }
 }

src/scripts/utils/filterUtils.ts

@@ -1,4 +1,5 @@
 import { HeadIdsTypes } from '../data/stationHeaderNames';
+import { DispatcherStatusID } from '../enums/DispatcherStatus';
 import Filter from '../interfaces/Filter';
 import Station from '../interfaces/Station';
 
@@ -90,11 +91,15 @@ export const filterStations = (station: Station, filters: Filter) => {
   if (station.onlineInfo) {
     const { statusID, statusTimestamp } = station.onlineInfo;
 
-    const isEnding = statusID == 'ending' && filters['endingStatus'];
+    const isEnding = statusID == DispatcherStatusID.Ending && filters['endingStatus'];
+
     const isNotSigned =
       (statusID == 'not-signed' || statusID == 'unavailable') && filters['unavailableStatus'];
+
     const isAFK = statusID == 'brb' && filters['afkStatus'];
+
     const isNoSpace = statusID == 'no-space' && filters['noSpaceStatus'];
+
     const isOccupied = station.onlineInfo && filters['occupied'];
 
     const isOnlineInBounds =

src/scripts/utils/storeUtils.ts

@@ -1,3 +1,4 @@
+import { DispatcherStatusID } from '../enums/DispatcherStatus';
 import { ScheduledTrain, StopStatus } from '../interfaces/ScheduledTrain';
 import Station from '../interfaces/Station';
 import Train from '../interfaces/Train';
@@ -10,34 +11,39 @@ export const getLocoURL = (locoType: string): string =>
     locoType.includes('EN') ? locoType + 'rb' : locoType
   }.png`;
 
-export const getStatusID = (stationStatus: any): string => {
+export const getStatusID = (
-  if (!stationStatus) return 'unknown';
+  stationStatus: any[] | undefined,
-  if (stationStatus == -1) return 'not-signed';
+  isSWDROnline: boolean
+): DispatcherStatusID => {
+  if (isSWDROnline && !stationStatus) return DispatcherStatusID.Unauthorized;
+  if (!stationStatus) return DispatcherStatusID.Unknown;
+
+  // if (stationStatus == -1) return DispatcherStatusID.Unauthorized;
 
   const statusCode = stationStatus[2];
   const statusTimestamp = stationStatus[3];
 
   switch (statusCode) {
     case 0:
-      if (statusTimestamp - Date.now() > 21000000) return 'no-limit';
+      if (statusTimestamp - Date.now() > 21000000) return DispatcherStatusID.OnlineNoLimit;
 
-      return 'online';
+      return DispatcherStatusID.OnlineWithHours;
 
     case 1:
-      return 'brb';
+      return DispatcherStatusID.Afk;
 
     case 2:
-      if (statusTimestamp == 0) return 'ending';
+      if (statusTimestamp == 0) return DispatcherStatusID.Ending;
       break;
 
     case 3:
-      return 'no-space';
+      return DispatcherStatusID.NoSpace;
 
     default:
       break;
   }
 
-  return 'unavailable';
+  return DispatcherStatusID.Unavailable;
 };
 
 export const getStatusTimestamp = (stationStatus: any): number => {
@@ -219,12 +225,9 @@ export function getDispatcherStatus(state: StoreState, onlineStationData: Statio
     (dispatcher) => dispatcher.hash === onlineStationData.stationHash
   );
 
-  const stationStatus = !dispatchers
+  const stationStatus = dispatchers?.find(
-    ? undefined
+    (status: string[]) => status[0] == onlineStationData.stationHash && status[1] == state.region.id
-    : dispatchers.find(
+  );
-        (status: string[]) =>
-          status[0] == onlineStationData.stationHash && status[1] == state.region.id
-      ) || -1;
 
   const statusTimestamp =
     prevDispatcherStatus && !dispatchers
@@ -234,7 +237,7 @@ export function getDispatcherStatus(state: StoreState, onlineStationData: Statio
   const statusID =
     prevDispatcherStatus && !dispatchers
       ? prevDispatcherStatus.statusID
-      : getStatusID(stationStatus);
+      : getStatusID(stationStatus, onlineStationData.isOnline === 1);
 
   return {
     hash: onlineStationData.stationHash,
@@ -263,8 +266,8 @@ export function getScheduledTrains(
 
       return (
         stationName == stopName ||
-        (!/(po\.|podg\.)/.test(stationName) && stopName.includes(stationName)) ||
+        (!/(po\.|podg\.)/.test(stopName) && stopName.includes(stationName)) ||
-        (!/(po\.|podg\.)/.test(stopName) && stationName.includes(stopName)) ||
+        (!/(po\.|podg\.)/.test(stationName) && stationName.includes(stopName)) ||
         (stopName.split(', podg.')[0] !== undefined &&
           stationName.startsWith(stopName.split(', podg.')[0]))
       );

src/store/store.ts

@@ -21,6 +21,8 @@ import {
 
 import packageInfo from '../../package.json';
 import { RollingStockGithubData } from '../scripts/interfaces/github_api/StockInfoGithubData';
+import { ScheduledTrain } from '../scripts/interfaces/ScheduledTrain';
+import { DispatcherStatusID } from '../scripts/enums/DispatcherStatus';
 
 export const useStore = defineStore('store', {
   state: () =>
@@ -127,110 +129,72 @@ export const useStore = defineStore('store', {
       if (state.isOffline) return [];
       if (!state.apiData?.stations) return [];
 
-      return state.apiData?.stations
+      return (
-        ?.filter((apiStation) => apiStation.region == state.region.id && apiStation.isOnline)
+        state.apiData?.stations
-        .map((apiStation) => {
+          // ?.filter((apiStation) => apiStation.region == state.region.id)
-          const dispatcherStatus = getDispatcherStatus(state as StoreState, apiStation);
+          .reduce((list, apiStation) => {
-          const station = this.stationList.find((s) => s.name === apiStation.stationName);
+            if (apiStation.region != state.region.id) return list;
 
-          const scheduledTrains = getScheduledTrains(
+            const dispatcherStatus = getDispatcherStatus(state as StoreState, apiStation);
-            this.trainList,
-            apiStation,
-            station?.generalInfo
-          );
 
-          const stationTrains = getStationTrains(
+            if (dispatcherStatus.statusID == DispatcherStatusID.Unknown) return list;
-            this.trainList,
-            scheduledTrains,
-            this.region.id,
-            apiStation
-          );
 
-          return {
+            const station = this.stationList.find((s) => s.name === apiStation.stationName);
-            name: apiStation.stationName,
+
-            hash: apiStation.stationHash,
+            const scheduledTrains = getScheduledTrains(
-            region: apiStation.region,
+              this.trainList,
-            maxUsers: apiStation.maxUsers,
+              apiStation,
-            currentUsers: apiStation.currentUsers,
+              station?.generalInfo
-            spawns: parseSpawns(apiStation.spawnString),
+            );
-            dispatcherName: apiStation.dispatcherName,
+
-            dispatcherRate: apiStation.dispatcherRate,
+            const stationTrains = getStationTrains(
-            dispatcherId: apiStation.dispatcherId,
+              this.trainList,
-            dispatcherExp: apiStation.dispatcherExp,
+              scheduledTrains,
-            dispatcherIsSupporter: apiStation.dispatcherIsSupporter,
+              this.region.id,
-            scheduledTrains: scheduledTrains,
+              apiStation
-            stationTrains: stationTrains,
+            );
-            statusTimestamp: dispatcherStatus.statusTimestamp,
+
-            statusID: dispatcherStatus.statusID
+            // Remove checkpoint duplicates
-          };
+            const uniqueScheduledTrains = scheduledTrains.reduce(
-        });
+              (uniqueList, sTrain) =>
+                uniqueList.find((v) => v.trainId === sTrain.trainId)
+                  ? uniqueList
+                  : [...uniqueList, sTrain],
+              [] as ScheduledTrain[]
+            );
+
+            list.push({
+              name: apiStation.stationName,
+              hash: apiStation.stationHash,
+              region: apiStation.region,
+              maxUsers: apiStation.maxUsers,
+              currentUsers: apiStation.currentUsers,
+              spawns: parseSpawns(apiStation.spawnString),
+              dispatcherName: apiStation.dispatcherName,
+              dispatcherRate: apiStation.dispatcherRate,
+              dispatcherId: apiStation.dispatcherId,
+              dispatcherExp: apiStation.dispatcherExp,
+              dispatcherIsSupporter: apiStation.dispatcherIsSupporter,
+              scheduledTrains: scheduledTrains,
+              stationTrains: stationTrains,
+              statusTimestamp: dispatcherStatus.statusTimestamp,
+              statusID: dispatcherStatus.statusID,
+
+              isOnline: apiStation.isOnline == 1,
+
+              scheduledTrainCount: {
+                all: uniqueScheduledTrains.length,
+                confirmed: uniqueScheduledTrains.filter((train) => train.stopInfo.confirmed).length,
+                unconfirmed: uniqueScheduledTrains.filter((train) => !train.stopInfo.confirmed).length
+              }
+            });
+
+            return list;
+          }, [] as OnlineScenery[])
+      );
     }
   },
   actions: {
-    // setStationsOnlineInfo() {
-    //   const onlineStationNames: string[] = [];
-    //   const prevDispatcherStatuses: StoreState['lastDispatcherStatuses'] = [];
-
-    //   if (this.isOffline) {
-    //     this.stationList.forEach((station) => {
-    //       station.onlineInfo = undefined;
-    //     });
-
-    //     return;
-    //   }
-
-    //   this.apiData.stations?.forEach((stationAPIData) => {
-    //     if (stationAPIData.region !== this.region.id || !stationAPIData.isOnline) return;
-
-    //     const station = this.stationList.find((s) => s.name === stationAPIData.stationName);
-
-    //     onlineStationNames.push(stationAPIData.stationName);
-
-    //     const dispatcherStatus = this.getDispatcherStatus(stationAPIData);
-    //     prevDispatcherStatuses.push(dispatcherStatus);
-
-    //     const stationTrains = this.getStationTrains(stationAPIData);
-    //     const scheduledTrains = this.getScheduledTrains(station?.generalInfo, stationAPIData);
-
-    //     const onlineInfo = {
-    //       name: stationAPIData.stationName,
-    //       hash: stationAPIData.stationHash,
-    //       region: stationAPIData.region,
-    //       maxUsers: stationAPIData.maxUsers,
-    //       currentUsers: stationAPIData.currentUsers,
-    //       spawns: parseSpawns(stationAPIData.spawnString),
-    //       dispatcherName: stationAPIData.dispatcherName,
-    //       dispatcherRate: stationAPIData.dispatcherRate,
-    //       dispatcherId: stationAPIData.dispatcherId,
-    //       dispatcherExp: stationAPIData.dispatcherExp,
-    //       dispatcherIsSupporter: stationAPIData.dispatcherIsSupporter,
-    //       stationTrains,
-    //       statusTimestamp: dispatcherStatus.statusTimestamp,
-    //       statusID: dispatcherStatus.statusID,
-    //       scheduledTrains
-    //     };
-
-    //     if (!station) {
-    //       this.stationList.push({
-    //         name: stationAPIData.stationName,
-    //         onlineInfo
-    //       });
-
-    //       return;
-    //     }
-
-    //     station.onlineInfo = { ...onlineInfo };
-    //   });
-
-    //   this.stationList
-    //     .filter((station) => !onlineStationNames.includes(station.name) && station.onlineInfo)
-    //     .forEach((offlineStation) => {
-    //       offlineStation.onlineInfo = undefined;
-    //     });
-
-    //   if (this.apiData.dispatchers != null) this.lastDispatcherStatuses = prevDispatcherStatuses;
-    // },
-
     async fetchStationsGeneralInfo() {
       const sceneryData: StationJSONData[] = await (
         await axios.get(`${URLs.stacjownikAPI}/api/getSceneries`)
@@ -297,7 +261,7 @@ export const useStore = defineStore('store', {
         const mockWebsocketData = await import('../data/mockWebsocketData.json');
         this.dataStatuses.connection = DataStatus.Loaded;
         this.apiData = mockWebsocketData as any;
-        this.setOnlineData();
+        this.setStatuses();
 
         console.warn('Stacjownik działa w trybie mockowania danych z WS');
 
@@ -320,13 +284,13 @@ export const useStore = defineStore('store', {
       socket.on('UPDATE', (data: APIData) => {
         this.apiData = data;
         this.dataStatuses.connection = DataStatus.Loaded;
-        this.setOnlineData();
+        this.setStatuses();
       });
 
       socket.emit('FETCH_DATA', { version: packageInfo.version }, (data: APIData) => {
         this.dataStatuses.connection = DataStatus.Loaded;
         this.apiData = data;
-        this.setOnlineData();
+        this.setStatuses();
       });
 
       this.webSocket = socket;
@@ -354,7 +318,7 @@ export const useStore = defineStore('store', {
       }
     },
 
-    async setOnlineData() {
+    async setStatuses() {
       if (!this.apiData.stations) {
         this.dataStatuses.sceneries = DataStatus.Error;
         this.dataStatuses.trains = DataStatus.Error;
@@ -368,6 +332,8 @@ export const useStore = defineStore('store', {
       this.dataStatuses.dispatchers = !this.apiData.dispatchers
         ? DataStatus.Warning
         : DataStatus.Loaded;
+
+      // if (this.apiData.dispatchers != null) this.lastDispatcherStatuses = prevDispatcherStatuses;
     }
   }
 });