Merge do wersji 1.15.1

Wersja 1.15.1

package.json

@@ -1,6 +1,6 @@
 {
   "name": "stacjownik",
-  "version": "1.14.1",
+  "version": "1.15.1",
   "private": true,
   "scripts": {
     "dev": "vite",

src/assets/icon-timetableAll.svg

@@ -0,0 +1,3 @@
+<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M23.75 3.75H22.5V1.25H20V3.75H10V1.25H7.5V3.75H6.25C4.875 3.75 3.75 4.875 3.75 6.25V23.75C3.75 25.125 4.875 26.25 6.25 26.25H23.75C25.125 26.25 26.25 25.125 26.25 23.75V6.25C26.25 4.875 25.125 3.75 23.75 3.75ZM23.75 23.75H6.25V11.25H23.75V23.75ZM6.25 8.75V6.25H23.75V8.75H6.25ZM8.75 13.75H21.25V16.25H8.75V13.75ZM8.75 18.75H17.5V21.25H8.75V18.75Z" fill="#F2E147"/>
+</svg>

src/assets/icon-timetableConfirmed.svg

@@ -0,0 +1,3 @@
+<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M23.75 3.75H22.5V1.25H20V3.75H10V1.25H7.5V3.75H6.25C4.875 3.75 3.75 4.875 3.75 6.25V23.75C3.75 25.125 4.875 26.25 6.25 26.25H23.75C25.125 26.25 26.25 25.125 26.25 23.75V6.25C26.25 4.875 25.125 3.75 23.75 3.75ZM23.75 23.75H6.25V11.25H23.75V23.75ZM6.25 8.75V6.25H23.75V8.75H6.25ZM8.75 13.75H21.25V16.25H8.75V13.75ZM8.75 18.75H17.5V21.25H8.75V18.75Z" fill="#66FF6C"/>
+</svg>

src/assets/icon-timetableUnconfirmed.svg

@@ -0,0 +1,3 @@
+<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M23.75 3.75H22.5V1.25H20V3.75H10V1.25H7.5V3.75H6.25C4.875 3.75 3.75 4.875 3.75 6.25V23.75C3.75 25.125 4.875 26.25 6.25 26.25H23.75C25.125 26.25 26.25 25.125 26.25 23.75V6.25C26.25 4.875 25.125 3.75 23.75 3.75ZM23.75 23.75H6.25V11.25H23.75V23.75ZM6.25 8.75V6.25H23.75V8.75H6.25ZM8.75 13.75H21.25V16.25H8.75V13.75ZM8.75 18.75H17.5V21.25H8.75V18.75Z" fill="#898989"/>
+</svg>

src/components/JournalView/JournalTimetablesList.vue

@@ -16,6 +16,12 @@
             style="cursor: pointer"
           >
             <span class="text--grayed">#{{ timetable.id }}</span>
+
+            <span class="badges" v-if="timetable.skr || timetable.twr">
+              <span class="train-badge twr" v-if="timetable.twr" :title="$t('general.TWR')">TWR</span>
+              <span class="train-badge skr" v-if="timetable.skr" :title="$t('general.SKR')">SKR</span>
+            </span>
+
             <span>
               <strong class="text--primary">
                 {{ timetable.trainCategoryCode }}
@@ -342,6 +348,7 @@ hr {
 
 .general-train {
   display: flex;
+  flex-wrap: wrap;
   align-items: center;
   gap: 0.25em;
 }
@@ -381,6 +388,13 @@ ul.stock-list {
   }
 }
 
+.badges {
+  display: flex;
+  gap: 0.25em;
+
+  // badge.scss
+}
+
 .stock-history {
   display: flex;
   flex-wrap: wrap;
@@ -418,6 +432,10 @@ ul.stock-list {
     text-align: center;
   }
 
+  .general-train {
+    justify-content: center;
+  }
+
   .info-route {
     display: flex;
     justify-content: center;

src/components/SceneryView/SceneryTimetablesHistory.vue

@@ -4,16 +4,16 @@
 
     <table v-else-if="sceneryHistoryList.length">
       <thead>
-        <th>{{ $t('scenery.timetables-history-id')  }}</th>
+        <th>{{ $t('scenery.timetables-history-id') }}</th>
-        <th>{{ $t('scenery.timetables-history-number')}}</th>
+        <th>{{ $t('scenery.timetables-history-number') }}</th>
-        <th>{{ $t('scenery.timetables-history-route')}}</th>
+        <th>{{ $t('scenery.timetables-history-route') }}</th>
-        <th>{{ $t('scenery.timetables-history-driver')}}</th>
+        <th>{{ $t('scenery.timetables-history-driver') }}</th>
-        <th>{{ $t('scenery.timetables-history-author')}}</th>
+        <th>{{ $t('scenery.timetables-history-author') }}</th>
-        <th>{{ $t('scenery.timetables-history-date')}}</th>
+        <th>{{ $t('scenery.timetables-history-date') }}</th>
       </thead>
 
       <tbody>
-        <tr v-for="historyItem in sceneryHistoryList" @click="test">
+        <tr v-for="historyItem in sceneryHistoryList">
           <td>
             <router-link :to="`/journal/timetables?timetableId=${historyItem.id}`">#{{ historyItem.id }}</router-link>
           </td>
@@ -40,31 +40,6 @@
     </table>
 
     <div class="list-warning" v-else>{{ $t('scenery.history-list-empty') }}</div>
-
-    <!-- <ul class="history-list" v-else>
-      <li class="list-item" v-for="historyItem in sceneryHistoryList">
-        <div>
-          <b>{{ localeDay(historyItem.beginDate, $i18n.locale) }}</b>
-          {{ localeTime(historyItem.beginDate, $i18n.locale) }}
-        </div>
-
-        <div>
-          <router-link :to="`/journal/timetables?timetableId=${historyItem.id}`">
-            <span class="text--grayed"> #{{ historyItem.id }} </span>
-            <b class="text--primary">&nbsp;{{ historyItem.trainCategoryCode }} {{ historyItem.trainNo }}</b>
-            <div>{{ historyItem.driverName }}</div>
-          </router-link>
-        </div>
-
-        <div>{{ historyItem.route.replace('|', ' -> ') }}</div>
-        <div>
-          {{ $t('scenery.timetable-author-title') }}:
-          <b v-if="historyItem.authorName">{{ historyItem.authorName }}</b>
-          <i v-else>{{ $t('scenery.timetable-author-unknown') }}</i>
-        </div>
-
-      </li>
-    </ul> -->
   </section>
 </template>
 
@@ -99,19 +74,15 @@ export default defineComponent({
   methods: {
     async fetchAPIData(countFrom = 0, countLimit = 15) {
       try {
-        const requestString = `${URLs.stacjownikAPI}/api/getSceneryTimetables?name=${this.station.name}&countFrom=${countFrom}&countLimit=${countLimit}`;
+        const requestString = `${URLs.stacjownikAPI}/api/getIssuedTimetables?name=${this.station.name}&countFrom=${countFrom}&countLimit=${countLimit}`;
         const historyAPIData: SceneryTimetableHistory = await (await axios.get(requestString)).data;
 
-        this.sceneryHistoryList = historyAPIData.sceneryTimetables;
+        this.sceneryHistoryList = historyAPIData.timetables;
         this.dataStatus = DataStatus.Loaded;
       } catch (error) {
         console.error(error);
       }
     },
-
-    test() {
-      console.log('test');
-    },
   },
   components: { Loading },
 });

src/components/StationsView/StationTable.vue

@@ -8,7 +8,12 @@
       <table>
         <thead>
           <tr>
-            <th v-for="(headerName, i) in headIds" :key="headerName" @click="changeSorter(headerName)">
+            <th
+              v-for="(headerName, i) in headIds"
+              :key="headerName"
+              @click="changeSorter(headerName)"
+              class="header-text"
+            >
               <span class="header_wrapper">
                 <div v-html="$t(`sceneries.${headerName}`)"></div>
 
@@ -21,9 +26,14 @@
               </span>
             </th>
 
-            <th v-for="(headerName, i) in headIconsIds" :key="headerName" @click="changeSorter(headerName)">
+            <th
+              v-for="(headerName, i) in headIconsIds"
+              :key="headerName"
+              @click="changeSorter(headerName)"
+              class="header-image"
+            >
               <span class="header_wrapper">
-                <img :src="getIcon(headerName)" :alt="headerName" :title="$t(`sceneries.${headerName}s`)" />
+                <img :src="getIcon(headerName)" :alt="headerName" :title="$t(`sceneries.${headerName}`)" />
 
                 <img
                   class="sort-icon"
@@ -190,25 +200,31 @@
 
             <td class="station_users" :class="{ inactive: !station.onlineInfo }">
               <span>
-                <span class="highlight">{{ 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 }">
-              <span class="highlight">{{ station.onlineInfo?.spawns.length || '0' }}</span>
+              <span>{{ station.onlineInfo?.spawns.length || 0 }}</span>
             </td>
 
-            <td class="station_schedules" :class="{ inactive: !station.onlineInfo }">
+            <td class="station_schedules" style="width: 30px" :class="{ inactive: !station.onlineInfo }">
-              <span>
+              <span class="highlight">
-                <span class="highlight">
+                {{ station.onlineInfo?.scheduledTrains?.length || 0 }}
-                  {{ station.onlineInfo?.scheduledTrains?.length || '0' }}
+              </span>
-                </span>
+            </td>
-                /
+
-                <span style="color: #bbb">
+            <td class="station_schedules" style="width: 30px" :class="{ inactive: !station.onlineInfo }">
-                  {{ station.onlineInfo?.scheduledTrains?.filter((train) => train.stopInfo.confirmed).length || '0' }}
+              <span style="color: #ccc">
-                </span>
+                {{ station.onlineInfo?.scheduledTrains?.filter((train) => !train.stopInfo.confirmed).length || 0 }}
+              </span>
+            </td>
+
+            <td class="station_schedules" style="width: 30px" :class="{ inactive: !station.onlineInfo }">
+              <span style="color: #66ff6c">
+                {{ station.onlineInfo?.scheduledTrains?.filter((train) => train.stopInfo.confirmed).length || 0 }}
               </span>
             </td>
           </tr>
@@ -352,9 +368,15 @@ table {
     position: sticky;
     top: 0;
 
-    min-width: 80px;
+    &.header-text {
+      min-width: 140px;
+    }
 
-    padding: 0.5em;
+    &.header-image {
+      min-width: 60px;
+    }
+
+    padding: 0.5em 0.25em;
     background-color: $bgCol;
     white-space: pre-wrap;
 

src/components/TrainsView/TrainInfo.vue

@@ -6,8 +6,8 @@
         <span class="timetable-id" v-if="train.timetableData">#{{ train.timetableData.timetableId }}</span>
 
         <span class="timetable_warnings" v-if="train.timetableData?.TWR || train.timetableData?.SKR">
-          <span class="train-badge twr" v-if="train.timetableData?.TWR">TWR</span>
+          <span class="train-badge twr" v-if="train.timetableData?.TWR" :title="$t('general.TWR')">TWR</span>
-          <span class="train-badge skr" v-if="train.timetableData?.SKR">SKR</span>
+          <span class="train-badge skr" v-if="train.timetableData?.SKR" :title="$t('general.SKR')">SKR</span>
         </span>
 
         <strong>
@@ -118,7 +118,6 @@ export default defineComponent({
 @import '../../styles/responsive.scss';
 @import '../../styles/badge.scss';
 
-
 .image-warning {
   height: 1em;
 
@@ -182,26 +181,6 @@ export default defineComponent({
   gap: 0.25em;
 }
 
-.train-badge {
-  padding: 0.1em 0.2em;
-  border-radius: 0.2em;
-  font-weight: bold;
-
-  font-size: 0.9em;
-
-  &.twr {
-    background-color: var(--clr-twr);
-  }
-
-  &.skr {
-    background-color: var(--clr-skr);
-  }
-
-  &.offline {
-    background-color: #9c362b;
-  }
-}
-
 .train-driver {
   &.supporter {
     color: orange;
@@ -218,9 +197,7 @@ export default defineComponent({
 
 .timetable_warnings {
   display: flex;
-  gap: 0.2em;
+  gap: 0.25em;
-
-  color: black;
 }
 
 .timetable_progress {

src/locales/en.json

@@ -1,7 +1,9 @@
 {
   "general": {
     "and": " and ",
-    "refresh": "REFRESH"
+    "refresh": "REFRESH",
+    "TWR": "High risk freight train",
+    "SKR": "Train with exceeded gauge"
   },
   "app": {
     "sceneries": "SCENERIES",
@@ -211,9 +213,11 @@
     "dispatcher-lvl": "Dispatcher\nlevel",
     "routes": "Routes\ndouble / single",
     "general": "General info",
-    "users": "Drivers online",
+    "user": "Drivers online",
-    "spawns": "Spawns online",
+    "spawn": "Spawns online",
-    "timetables": "Active timetables",
+    "timetableAll": "Active timetables",
+    "timetableConfirmed": "Confirmed timetables",
+    "timetableUnconfirmed": "Unconfirmed timetables",
     "no-stations": "No stations to show here!",
     "scenery-search": "Search for scenery..."
   },

src/locales/pl.json

@@ -1,7 +1,9 @@
 {
   "general": {
     "and": " oraz ",
-    "refresh": "ODŚWIEŻ"
+    "refresh": "ODŚWIEŻ",
+    "TWR": "Towar niebezpieczny wysokiego ryzyka",
+    "SKR": "Przekroczona skrajnia"
   },
   "app": {
     "sceneries": "SCENERIE",
@@ -215,9 +217,11 @@
     "dispatcher-lvl": "Poziom\ndyżurnego",
     "routes": "Szlaki\n2tor / 1tor",
     "general": "Informacje\nogólne",
-    "users": "Maszyniści online",
+    "user": "Maszyniści online",
-    "spawns": "Otwarte spawny",
+    "spawn": "Otwarte spawny",
-    "timetables": "Aktywne rozkłady jazdy",
+    "timetableAll": "Aktywne rozkłady jazdy",
+    "timetableConfirmed": "Zatwierdzone rozkłady jazdy",
+    "timetableUnconfirmed": "Niezatwierdzone rozkłady jazdy",
     "no-stations": "Brak stacji do wyświetlenia!",
     "scenery-search": "Wyszukaj scenerię..."
   },

src/main.ts

@@ -7,7 +7,6 @@ import plLang from './locales/pl.json';
 
 import { createI18n } from 'vue-i18n';
 import { createPinia } from 'pinia';
-import { registerSW } from 'virtual:pwa-register';
 
 const i18n = createI18n({
   locale: 'pl',
@@ -21,15 +20,6 @@ const i18n = createI18n({
   enableLegacy: false,
 });
 
-registerSW({
-  onRegistered(r) {
-    r &&
-      setInterval(() => {
-        r.update();
-      }, 60 * 60 * 1000);
-  },
-});
-
 const clickOutsideDirective: Directive = {
   mounted(el, binding) {
     el.clickOutsideEvent = (event: Event) => {

src/scripts/data/stationHeaderNames.ts

@@ -1,13 +1,5 @@
-export const headIds = [
+export const headIds = ['station', 'min-lvl', 'status', 'dispatcher', 'dispatcher-lvl', 'routes', 'general'] as const;
-  'station',
-  'min-lvl',
-  'status',
-  'dispatcher',
-  'dispatcher-lvl',
-  'routes',
-  'general',
-] as const;
 
-export const headIconsIds = ['user', 'spawn', 'timetable'] as const;
+export const headIconsIds = ['user', 'spawn', 'timetableAll', 'timetableUnconfirmed', 'timetableConfirmed'] as const;
 
 export type HeadIdsTypes = typeof headIds[number] | typeof headIconsIds[number];

src/scripts/interfaces/api/TimetablesAPIData.ts

@@ -47,10 +47,12 @@ export interface TimetableHistory {
   hashesString?: string;
   currentSceneryName?: string;
   currentSceneryHash?: string;
+
+  routeSceneries?: string;
 }
 
 export interface SceneryTimetableHistory {
-  sceneryTimetables: TimetableHistory[];
+  timetables: TimetableHistory[];
-  totalCount: number;
+  // totalCount: number;
-  sceneryName: string;
+  // sceneryName: string;
 }

src/scripts/interfaces/store/storeTypes.ts

@@ -55,6 +55,16 @@ export interface APIData {
   connectedSocketCount: number;
 }
 
+export interface StationRoutesInfo {
+  routeName: string;
+  isElectric: boolean;
+  isInternal: boolean;
+  isRouteSBL: boolean;
+  routeLength: number;
+  routeSpeed: number;
+  routeTracks: number;
+}
+
 export interface StationJSONData {
   name: string;
   abbr: string;
@@ -70,7 +80,8 @@ export interface StationJSONData {
 
   SUP: boolean;
 
-  routes: string;
+  // routes: string;
+  routesInfo: StationRoutesInfo[];
 
   checkpoints: string | null;
   authors?: string;

src/store/store.ts

@@ -3,7 +3,7 @@ import { defineStore } from 'pinia';
 import { io } from 'socket.io-client';
 import { DataStatus } from '../scripts/enums/DataStatus';
 import StationAPIData from '../scripts/interfaces/api/StationAPIData';
-import {ScheduledTrain} from '../scripts/interfaces/ScheduledTrain';
+import { ScheduledTrain } from '../scripts/interfaces/ScheduledTrain';
 import Station from '../scripts/interfaces/Station';
 import StationRoutes from '../scripts/interfaces/StationRoutes';
 import Train from '../scripts/interfaces/Train';
@@ -303,57 +303,39 @@ export const useStore = defineStore('store', {
             ...scenery,
             authors: scenery.authors?.split(',').map((a) => a.trim()),
             routes:
-              scenery.routes
+              scenery.routesInfo.reduce(
-                ?.split(';')
+                (acc, route) => {
-                .filter((routeString) => routeString)
+                  const propName: keyof StationRoutes = `${route.routeTracks == 2 ? 'twoWay' : 'oneWay'}${
-                .reduce(
+                    route.isElectric ? '' : 'No'
-                  (acc, routeString) => {
+                  }CatenaryRouteNames`;
-                    const specs1 = routeString.split('_')[0];
-                    const isInternal = specs1.startsWith('!');
-                    const name = isInternal ? specs1.replace('!', '') : specs1;
 
-                    const specs2 = routeString.split('_')[1].split('');
+                  acc[route.routeTracks == 2 ? 'twoWay' : 'oneWay'].push({
-                    const twoWay = specs2[0] == '2';
+                    name: route.routeName,
-                    const catenary = specs2[1] == 'E';
+                    SBL: route.isRouteSBL,
-                    const SBL = specs2[2] == 'S';
+                    TWB: false,
-                    const TWB = specs2[3] ? true : false;
+                    catenary: route.isElectric,
-                    const speed = Number(routeString.split(':')[1]) || 0;
+                    isInternal: route.isInternal,
-                    const length = Number(routeString.split(':')[2]) || 0;
+                    tracks: route.routeTracks,
+                    length: route.routeLength,
+                    speed: route.routeSpeed,
+                  });
 
-                    const propName = twoWay
+                  if (!route.isInternal) acc[propName].push(route.routeName);
-                      ? catenary
-                        ? 'twoWayCatenaryRouteNames'
-                        : 'twoWayNoCatenaryRouteNames'
-                      : catenary
-                      ? 'oneWayCatenaryRouteNames'
-                      : 'oneWayNoCatenaryRouteNames';
 
-                    acc[twoWay ? 'twoWay' : 'oneWay'].push({
+                  if (route.isRouteSBL) acc['sblRouteNames'].push(route.routeName);
-                      name,
-                      SBL,
-                      TWB,
-                      catenary,
-                      isInternal,
-                      tracks: twoWay ? 2 : 1,
-                      length,
-                      speed,
-                    });
-                    if (!isInternal) acc[propName].push(name);
 
-                    if (SBL) acc['sblRouteNames'].push(name);
+                  return acc;
-
+                },
-                    return acc;
+                {
-                  },
+                  oneWay: [],
-                  {
+                  twoWay: [],
-                    oneWay: [],
+                  sblRouteNames: [],
-                    twoWay: [],
+                  oneWayCatenaryRouteNames: [],
-                    sblRouteNames: [],
+                  oneWayNoCatenaryRouteNames: [],
-                    oneWayCatenaryRouteNames: [],
+                  twoWayCatenaryRouteNames: [],
-                    oneWayNoCatenaryRouteNames: [],
+                  twoWayNoCatenaryRouteNames: [],
-                    twoWayCatenaryRouteNames: [],
+                } as StationRoutes
-                    twoWayNoCatenaryRouteNames: [],
+              ) || {},
-                  } as StationRoutes
-                ) || {},
             checkpoints: scenery.checkpoints
               ? scenery.checkpoints.split(';').map((sub) => ({ checkpointName: sub, scheduledTrains: [] }))
               : [],

src/store/utils/filterUtils.ts

@@ -3,18 +3,18 @@ import Filter from '../../scripts/interfaces/Filter';
 import Station from '../../scripts/interfaces/Station';
 
 export const sortStations = (a: Station, b: Station, sorter: { headerName: HeadIdsTypes; dir: number }) => {
+  let diff = 0;
+
   switch (sorter.headerName) {
     case 'station':
       return sorter.dir == 1 ? a.name.localeCompare(b.name) : b.name.localeCompare(a.name);
 
     case 'min-lvl':
-      if ((a.generalInfo?.reqLevel || 0) > (b.generalInfo?.reqLevel || 0)) return sorter.dir;
+      diff = (a.generalInfo?.reqLevel || 0) - (b.generalInfo?.reqLevel || 0);
-      if ((a.generalInfo?.reqLevel || 0) < (b.generalInfo?.reqLevel || 0)) return -sorter.dir;
       break;
 
     case 'status':
-      if ((a.onlineInfo?.statusTimestamp || 0) > (b.onlineInfo?.statusTimestamp || 0)) return sorter.dir;
+      diff = (a.onlineInfo?.statusTimestamp || 0) - (b.onlineInfo?.statusTimestamp || 0);
-      if ((a.onlineInfo?.statusTimestamp || 0) < (b.onlineInfo?.statusTimestamp || 0)) return -sorter.dir;
       break;
 
     case 'dispatcher':
@@ -25,34 +25,48 @@ export const sortStations = (a: Station, b: Station, sorter: { headerName: HeadI
       break;
 
     case 'dispatcher-lvl':
-      if ((a.onlineInfo?.dispatcherExp || 0) > (b.onlineInfo?.dispatcherExp || 0)) return sorter.dir;
+      diff = (a.onlineInfo?.dispatcherExp || 0) - (b.onlineInfo?.dispatcherExp || 0);
-      if ((a.onlineInfo?.dispatcherExp || 0) < (b.onlineInfo?.dispatcherExp || 0)) return -sorter.dir;
       break;
 
     case 'user':
-      if ((a.onlineInfo?.currentUsers || 0) > (b.onlineInfo?.currentUsers || 0)) return sorter.dir;
+      diff = (b.onlineInfo ? b.onlineInfo.currentUsers : -1) - (a.onlineInfo ? a.onlineInfo.currentUsers : -1);
-      if ((a.onlineInfo?.currentUsers || 0) < (b.onlineInfo?.currentUsers || 0)) return -sorter.dir;
-
-      if ((a.onlineInfo?.maxUsers || 0) > (b.onlineInfo?.maxUsers || 0)) return sorter.dir;
-      if ((a.onlineInfo?.maxUsers || 0) < (b.onlineInfo?.maxUsers || 0)) return -sorter.dir;
       break;
 
     case 'spawn':
-      if ((a.onlineInfo?.spawns.length || 0) > (b.onlineInfo?.spawns.length || 0)) return sorter.dir;
+      diff = (a.onlineInfo ? a.onlineInfo.spawns.length : -1) - (b.onlineInfo ? b.onlineInfo.spawns.length : -1);
-      if ((a.onlineInfo?.spawns.length || 0) < (b.onlineInfo?.spawns.length || 0)) return -sorter.dir;
-
       break;
 
-    case 'timetable':
+    case 'timetableConfirmed':
-      if ((a.onlineInfo?.scheduledTrains?.length || 0) > (b.onlineInfo?.scheduledTrains?.length || 0))
+      diff =
-        return sorter.dir;
+        (a.onlineInfo?.scheduledTrains
-      if ((a.onlineInfo?.scheduledTrains?.length || 0) < (b.onlineInfo?.scheduledTrains?.length || 0))
+          ? a.onlineInfo.scheduledTrains.filter((train) => train.stopInfo.confirmed).length
-        return -sorter.dir;
+          : -1) -
+        (b.onlineInfo?.scheduledTrains
+          ? b.onlineInfo.scheduledTrains.filter((train) => train.stopInfo.confirmed).length
+          : -1);
+      break;
+
+    case 'timetableUnconfirmed':
+      diff =
+        (a.onlineInfo?.scheduledTrains
+          ? a.onlineInfo.scheduledTrains.filter((train) => !train.stopInfo.confirmed).length
+          : -1) -
+        (b.onlineInfo?.scheduledTrains
+          ? b.onlineInfo.scheduledTrains.filter((train) => !train.stopInfo.confirmed).length
+          : -1);
+      break;
+
+    case 'timetableAll':
+      diff =
+        (a.onlineInfo?.scheduledTrains ? a.onlineInfo.scheduledTrains.length : -1) -
+        (b.onlineInfo?.scheduledTrains ? b.onlineInfo.scheduledTrains.length : -1);
+      break;
 
     default:
       break;
   }
 
+  if (diff != 0) return Math.sign(diff) * sorter.dir;
   return a.name.localeCompare(b.name);
 };
 

src/styles/badge.scss

@@ -55,3 +55,26 @@
     background-color: forestgreen;
   }
 }
+
+.train-badge {
+  padding: 0.1em 0.2em;
+  border-radius: 0.2em;
+  font-weight: bold;
+
+  font-size: 0.9em;
+
+  &.twr {
+    background-color: var(--clr-twr);
+    box-shadow: 0 0 5px 1px var(--clr-twr);
+    color: black;
+  }
+
+  &.skr {
+    background-color: var(--clr-skr);
+    box-shadow: 0 0 5px 1px var(--clr-skr);
+  }
+
+  &.offline {
+    background-color: #be3728;
+  }
+}

vite.config.ts

@@ -1,55 +1,55 @@
-import { defineConfig } from 'vite';
+import { defineConfig } from 'vite';
-import vue from '@vitejs/plugin-vue';
+import vue from '@vitejs/plugin-vue';
-import { VitePWA } from 'vite-plugin-pwa';
+import { VitePWA } from 'vite-plugin-pwa';
-
+
-export default defineConfig({
+export default defineConfig({
-  server: {
+  server: {
-    port: 5001,
+    port: 5001,
-  },
+  },
-  plugins: [
+  plugins: [
-    vue(),
+    vue(),
-    VitePWA({
+    VitePWA({
-      registerType: 'prompt',
+      registerType: 'autoUpdate',
-
+
-      workbox: {
+      workbox: {
-        globPatterns: ['**/*.{js,css,html,png,svg,jpg}'],
+        globPatterns: ['**/*.{js,css,html,png,svg,jpg}'],
-        runtimeCaching: [
+        runtimeCaching: [
-          {
+          {
-            urlPattern: new RegExp('^https://spythere.pl/api/getSceneries', 'i'),
+            urlPattern: new RegExp('^https://spythere.pl/api/getSceneries', 'i'),
-            handler: 'NetworkFirst',
+            handler: 'NetworkFirst',
-            options: {
+            options: {
-              cacheName: 'sceneries-cache',
+              cacheName: 'sceneries-cache',
-              expiration: {
+              expiration: {
-                maxEntries: 1,
+                maxEntries: 1,
-                maxAgeSeconds: 60 * 60 * 24 * 7, // <== 7 days
+                maxAgeSeconds: 60 * 60 * 24 * 7, // <== 7 days
-              },
+              },
-              cacheableResponse: {
+              cacheableResponse: {
-                statuses: [0, 200],
+                statuses: [0, 200],
-              },
+              },
-            },
+            },
-          },
+          },
-          {
+          {
-            urlPattern: /^https:\/\/rj.td2.info.pl\/dist\/img\/thumbnails\/.*/i,
+            urlPattern: /^https:\/\/rj.td2.info.pl\/dist\/img\/thumbnails\/.*/i,
-            handler: 'CacheFirst',
+            handler: 'CacheFirst',
-            options: {
+            options: {
-              cacheName: 'images-cache',
+              cacheName: 'images-cache',
-              expiration: {
+              expiration: {
-                maxEntries: 100,
+                maxEntries: 100,
-                maxAgeSeconds: 60 * 60 * 24 * 60,
+                maxAgeSeconds: 60 * 60 * 24 * 60,
-              },
+              },
-              cacheableResponse: {
+              cacheableResponse: {
-                statuses: [0, 200, 404],
+                statuses: [0, 200, 404],
-              },
+              },
-            },
+            },
-          },
+          },
-        ],
+        ],
-      },
+      },
-      devOptions: {
+      devOptions: {
-        enabled: true,
+        enabled: true,
-      },
+      },
-    }),
+    }),
-  ],
+  ],
-});
+});
-
+
-
+
-
+