Merge pull request #71 from Spythere/development

Wersja 1.19.3

package.json

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

src/App.vue

@@ -39,12 +39,13 @@ import Clock from './components/App/Clock.vue';
 import packageInfo from '.././package.json';
 import { regions } from './data/options.json';
 
-import { useStore } from './store/mainStore';
+import { useMainStore } from './store/mainStore';
 import StatusIndicator from './components/App/StatusIndicator.vue';
 import TrainModal from './components/Global/TrainModal.vue';
 import AppHeader from './components/App/AppHeader.vue';
 import axios from 'axios';
 import StorageManager from './managers/storageManager';
+import { useApiStore } from './store/apiStore';
 
 export default defineComponent({
   components: {
@@ -56,7 +57,8 @@ export default defineComponent({
 
   data: () => ({
     VERSION: packageInfo.version,
-    store: useStore(),
+    store: useMainStore(),
+    apiStore: useApiStore(),
 
     currentLang: 'pl',
     releaseURL: '',
@@ -65,17 +67,15 @@ export default defineComponent({
 
   created() {
     this.loadLang();
-    this.store.setupAPI();
+    this.apiStore.setupAPI();
 
     this.store.isOffline = !window.navigator.onLine;
 
     window.addEventListener('offline', () => {
       this.store.isOffline = true;
+      this.apiStore.activeData = undefined;
 
-      this.store.activeData.activeSceneries = [];
+      this.apiStore.setDataStatuses();
-      this.store.activeData.trains = [];
-
-      this.store.setStatuses();
     });
 
     window.addEventListener('online', () => {

src/components/App/AppHeader.vue

@@ -68,7 +68,7 @@
 </template>
 <script lang="ts">
 import { defineComponent } from 'vue';
-import { useStore } from '../../store/mainStore';
+import { useMainStore } from '../../store/mainStore';
 import StatusIndicator from './StatusIndicator.vue';
 import Clock from './Clock.vue';
 import RegionDropdown from '../Global/RegionDropdown.vue';
@@ -84,7 +84,7 @@ export default defineComponent({
 
   setup() {
     return {
-      store: useStore()
+      store: useMainStore()
     };
   },
 

src/components/App/StatusIndicator.vue

@@ -194,9 +194,9 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-import { StoreState } from '../../store/typings';
+import { useMainStore } from '../../store/mainStore';
-import { useStore } from '../../store/mainStore';
 import { Status } from '../../typings/common';
+import { useApiStore } from '../../store/apiStore';
 
 export default defineComponent({
   data() {
@@ -221,10 +221,11 @@ export default defineComponent({
   },
 
   setup() {
-    const store = useStore();
+    const store = useMainStore();
+    const apiStore = useApiStore();
 
     return {
-      dataStatus: store.dataStatuses,
+      dataStatus: apiStore.dataStatuses,
       store
     };
   },
@@ -233,7 +234,7 @@ export default defineComponent({
     dataStatus: {
       deep: true,
 
-      handler(statuses: StoreState['dataStatuses']) {
+      handler(statuses: any) {
         const connectionStatus = statuses.connection;
         const sceneryDataStatus = statuses.sceneries;
         const trainsDataStatus = statuses.trains;

src/components/Global/AnimatedModal.vue

@@ -12,7 +12,7 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-import { useStore } from '../../store/mainStore';
+import { useMainStore } from '../../store/mainStore';
 
 export default defineComponent({
   emits: ['toggleModal'],
@@ -23,7 +23,7 @@ export default defineComponent({
 
   data() {
     return {
-      store: useStore()
+      store: useMainStore()
     };
   },
 

src/components/Global/RegionDropdown.vue

@@ -30,7 +30,7 @@
 <script lang="ts">
 import { defineComponent, Ref, ref } from 'vue';
 import { regions as regionsJSON } from '../../data/options.json';
-import { useStore } from '../../store/mainStore';
+import { useMainStore } from '../../store/mainStore';
 
 interface Item {
   id: string;
@@ -41,7 +41,7 @@ interface Item {
 export default defineComponent({
   data() {
     return {
-      store: useStore(),
+      store: useMainStore(),
       selectedItemIndex: 0,
       listOpen: false
     };

src/components/Global/StockList.vue

@@ -50,8 +50,8 @@
 
 <script lang="ts">
 import { PropType, defineComponent } from 'vue';
-import { useStore } from '../../store/mainStore';
 import { API } from '../../typings/api';
+import { useApiStore } from '../../store/apiStore';
 
 export default defineComponent({
   props: {
@@ -63,15 +63,15 @@ export default defineComponent({
 
   data() {
     return {
-      store: useStore()
+      apiStore: useApiStore()
     };
   },
 
   methods: {
     onImageError(event: Event, stockName: string) {
       const fallbackName =
-        Object.keys(this.store.rollingStockData!.info).find((type) => {
+        Object.keys(this.apiStore.rollingStockData!.info).find((type) => {
-          return this.store.rollingStockData!.info[type as keyof API.RollingStock.Info].find(
+          return this.apiStore.rollingStockData!.info[type as keyof API.RollingStock.Info].find(
             (v) => v[0] === stockName.split(':')[0]
           );
         }) || 'vehicle-unknown';

src/components/Global/TrainThumbnail.vue

@@ -16,8 +16,8 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-import { useStore } from '../../store/mainStore';
 import { API } from '../../typings/api';
+import { useApiStore } from '../../store/apiStore';
 
 export default defineComponent({
   props: {
@@ -34,7 +34,7 @@ export default defineComponent({
 
   data() {
     return {
-      store: useStore(),
+      apiStore: useApiStore(),
       isNotFound: false,
       isLoaded: false
     };
@@ -50,11 +50,11 @@ export default defineComponent({
     },
 
     stockType() {
-      if (!this.store.rollingStockData) return 'vehicle-unknown';
+      if (!this.apiStore.rollingStockData) return 'vehicle-unknown';
 
       return (
-        Object.keys(this.store.rollingStockData.info).find((type) => {
+        Object.keys(this.apiStore.rollingStockData.info).find((type) => {
-          return this.store.rollingStockData?.info[type as keyof API.RollingStock.Info].find(
+          return this.apiStore.rollingStockData?.info[type as keyof API.RollingStock.Info].find(
             (v) => v[0] === this.name.split(':')[0]
           );
         }) || 'vehicle-unknown'

src/components/JournalView/DispatcherStats.vue

@@ -53,7 +53,7 @@
 import axios from 'axios';
 import { defineComponent } from 'vue';
 import { URLs } from '../../scripts/utils/apiURLs';
-import { useStore } from '../../store/mainStore';
+import { useMainStore } from '../../store/mainStore';
 import Loading from '../Global/Loading.vue';
 import { API } from '../../typings/api';
 
@@ -61,7 +61,7 @@ export default defineComponent({
   components: { Loading },
 
   setup() {
-    const store = useStore();
+    const store = useMainStore();
 
     return {
       store

src/components/JournalView/JournalDailyStats.vue

@@ -5,15 +5,12 @@
         {{ $t('app.loading') }}
       </b>
 
-      <b v-else-if="stats.distanceSum == null">
-        {{ $t('journal.daily-stats-info') }}
-      </b>
-
       <span class="stats-list" v-else>
         <h3>
           {{ $t('journal.daily-stats-title') }}
           <b class="text--primary">{{ new Date().toLocaleDateString($i18n.locale) }}</b>
         </h3>
+
         <hr style="margin-bottom: 0.5em" />
 
         <div v-if="stats.totalTimetables">
@@ -142,8 +139,10 @@ import { API } from '../../typings/api';
 import { Status } from '../../typings/common';
 
 export default defineComponent({
+  name: 'journal-daily-stats',
+
   mixins: [dateMixin],
-  emits: ['toggleStatsOpen'],
+  // emits: ['toggleStatsOpen'],
 
   data() {
     return {
@@ -157,7 +156,7 @@ export default defineComponent({
 
   activated() {
     this.startFetchingDailyStats();
-    this.$emit('toggleStatsOpen', true);
+    // this.$emit('toggleStatsOpen', true);
   },
 
   deactivated() {
@@ -177,23 +176,9 @@ export default defineComponent({
     async fetchDailyTimetableStats() {
       try {
         const res: API.DailyStats.Response = await (
-          await axios.get(`${URLs.stacjownikAPI}/api/getDailyTimetableStats`)
+          await axios.get(`${URLs.stacjownikAPI}/api/getDailyStats`)
         ).data;
 
-        // this.stats = {
-        //   totalTimetables: res.totalTimetables,
-        //   distanceSum: res.distanceSum,
-        //   distanceAvg: res.distanceAvg,
-        //   // timetableAuthor: res.maxTimetable?.authorName || '',
-        //   // timetableDriver: res.maxTimetable?.driverName || '',
-        //   // timetableId: res.maxTimetable?.id || 0,
-        //   // timetableRouteDistance: res.maxTimetable?.routeDistance || 0,
-
-        //   mostActiveDispatchers: res.mostActiveDispatchers,
-        //   mostActiveDrivers: res.mostActiveDrivers,
-        //   longestDuties: res.longestDuties
-        // };
-
         this.stats = res;
 
         this.statsStatus = Status.Data.Loaded;
@@ -208,7 +193,7 @@ export default defineComponent({
 
       if (this.intervalId != -1) return;
 
-      this.intervalId = setInterval(this.fetchDailyTimetableStats, 60000);
+      this.intervalId = window.setInterval(this.fetchDailyTimetableStats, 60000);
     },
 
     stopFetchingDailyStats() {

src/components/JournalView/JournalDispatchersList.vue

@@ -125,7 +125,7 @@
 import { defineComponent, PropType } from 'vue';
 import dateMixin from '../../mixins/dateMixin';
 import styleMixin from '../../mixins/styleMixin';
-import { useStore } from '../../store/mainStore';
+import { useMainStore } from '../../store/mainStore';
 import Loading from '../Global/Loading.vue';
 import { regions } from '../../data/options.json';
 import AddDataButton from '../Global/AddDataButton.vue';
@@ -160,7 +160,7 @@ export default defineComponent({
   data() {
     return {
       Status,
-      store: useStore(),
+      store: useMainStore(),
       regions
     };
   },

src/components/JournalView/JournalDriverStats.vue

@@ -55,13 +55,15 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-import { useStore } from '../../store/mainStore';
+import { useMainStore } from '../../store/mainStore';
 import { Status } from '../../typings/common';
 
 export default defineComponent({
+  name: 'journal-driver-stats',
+
   data() {
     return {
-      store: useStore(),
+      store: useMainStore(),
       Status: Status
     };
   }

src/components/JournalView/JournalOptions.vue

@@ -114,7 +114,7 @@ import axios from 'axios';
 import { defineComponent, inject, PropType } from 'vue';
 import keyMixin from '../../mixins/keyMixin';
 import { URLs } from '../../scripts/utils/apiURLs';
-import { useStore } from '../../store/mainStore';
+import { useMainStore } from '../../store/mainStore';
 import { Journal } from './typings';
 import { API } from '../../typings/api';
 import { Status } from '../../typings/common';
@@ -158,7 +158,7 @@ export default defineComponent({
       dispatcherSuggestions: [] as string[],
 
       searchTimeout: 0,
-      store: useStore(),
+      store: useMainStore(),
 
       JournalFilterSection: Journal.FilterSection
     };
@@ -184,8 +184,6 @@ export default defineComponent({
   watch: {
     async 'store.driverStatsName'() {
       await this.fetchDriverStats();
-
-      // if (value) this.store.currentStatsTab = 'driver';
     },
 
     async 'searchersValues.search-driver'(value: string | undefined) {
@@ -240,7 +238,7 @@ export default defineComponent({
 
       window.clearTimeout(this.searchTimeout);
 
-      this.searchTimeout = setTimeout(async () => {
+      this.searchTimeout = window.setTimeout(async () => {
         try {
           const suggestions: string[] = await (
             await axios.get(`${URLs.stacjownikAPI}/api/get${type}Suggestions?name=${value}`)

src/components/JournalView/JournalStats.vue

@@ -1,27 +1,26 @@
 <template>
   <div class="journal-stats" v-if="!store.isOffline">
-    <div class="tabs">
+    <div class="stats-buttons">
       <button
-        v-for="tab in data.tabs"
+        v-for="button in data.statsButtons"
-        :key="tab.name"
+        :key="button.name"
-        class="btn--filled"
+        class="btn--filled btn--image"
-        :data-selected="tab.name == store.currentStatsTab && areStatsOpen"
+        :data-selected="button.name == currentStatsTab"
-        :data-inactive="tab.inactive"
+        @click="onTabButtonClick(button.name)"
-        :data-disabled="tab.inactive"
-        :disabled="tab.inactive"
-        @click="onTabButtonClick(tab.name)"
       >
-        {{ $t(tab.titlePath) }}
+        <img
+          v-if="button.iconName"
+          :src="`/images/icon-${button.iconName}.svg`"
+          :alt="button.iconName"
+        />
+        {{ $t(button.localeKey) }}
       </button>
     </div>
 
-    <div class="stats-tab" v-show="areStatsOpen">
+    <div class="stats-tab" v-show="currentStatsTab !== null">
       <keep-alive>
-        <JournalDailyStats
+        <JournalDailyStats v-if="currentStatsTab == 'journal-daily-stats'" />
-          v-if="store.currentStatsTab == 'daily'"
+        <JournalDriverStats v-else-if="currentStatsTab == 'journal-driver-stats'" />
-          @toggleStatsOpen="toggleStatsOpen"
-        />
-        <JournalDriverStats v-else-if="store.currentStatsTab == 'driver'" />
       </keep-alive>
     </div>
   </div>
@@ -29,68 +28,50 @@
 
 <script setup lang="ts">
 import { computed, onMounted, reactive, Ref, ref, watch } from 'vue';
-import { useStore } from '../../store/mainStore';
+import { useMainStore } from '../../store/mainStore';
-import JournalDailyStats from './DailyStats.vue';
+import JournalDailyStats from './JournalDailyStats.vue';
 import JournalDriverStats from './JournalDriverStats.vue';
 import StorageManager from '../../managers/storageManager';
 
-// Types
+export type JournalStatsTab = 'journal-driver-stats' | 'journal-daily-stats';
-type TStatTab = 'daily' | 'driver';
 
-// Variables
+const store = useMainStore();
-const store = useStore();
+const currentStatsTab: Ref<JournalStatsTab | null> = ref(null);
-
-const lastDailyStatsOpen = ref(false);
-const areStatsOpen = ref(false);
-const lastClickedTab: Ref<'daily' | 'driver' | null> = ref(null);
 
 let data = reactive({
-  tabs: [
+  statsButtons: [
     {
-      name: 'daily',
+      name: 'journal-daily-stats',
-      titlePath: 'journal.daily-stats-title'
+      localeKey: 'journal.daily-stats-title',
+      iconName: 'stats'
     },
     {
-      name: 'driver',
+      name: 'journal-driver-stats',
-      titlePath: 'journal.driver-stats-title'
+      localeKey: 'journal.driver-stats-title',
-      // inactive: true,
+      iconName: 'user'
     }
-  ] as { name: TStatTab; titlePath: string; inactive?: boolean }[]
+  ] as { name: JournalStatsTab; localeKey: string; iconName?: string }[]
 });
 
-// Methods
+function onTabButtonClick(tab: JournalStatsTab) {
-function onTabButtonClick(tab: TStatTab) {
+  currentStatsTab.value = tab == currentStatsTab.value ? null : tab;
-  if (lastClickedTab.value == tab || !lastClickedTab.value || !areStatsOpen.value)
+  StorageManager.setStringValue('journalStatsTab', currentStatsTab.value ?? '');
-    areStatsOpen.value = !areStatsOpen.value;
-
-  if (tab == 'daily') {
-    StorageManager.setBooleanValue('dailyStatsOpen', areStatsOpen.value);
-    lastDailyStatsOpen.value = areStatsOpen.value;
-  }
-
-  store.currentStatsTab = tab;
-  lastClickedTab.value = tab;
-
-  if (areStatsOpen.value == false) store.currentStatsTab = null;
-}
-
-function toggleStatsOpen(open: boolean) {
-  areStatsOpen.value = open;
 }
 
 watch(
   computed(() => store.driverStatsData),
-  (statsData) => {
+  (newData, prevData) => {
-    store.currentStatsTab = statsData ? 'driver' : lastClickedTab.value;
+    currentStatsTab.value =
-    areStatsOpen.value = statsData ? true : lastClickedTab.value !== null;
+      JSON.stringify(prevData) !== JSON.stringify(newData) && newData !== undefined
+        ? 'journal-driver-stats'
+        : currentStatsTab.value;
   }
 );
 
 onMounted(() => {
-  if (StorageManager.getBooleanValue('dailyStatsOpen')) {
+  const storedTab = StorageManager.getStringValue('journalStatsTab');
-    areStatsOpen.value = true;
+
-    store.currentStatsTab = 'daily';
+  if (storedTab && storedTab !== '') currentStatsTab.value = storedTab as JournalStatsTab;
-  }
 });
 </script>
 
@@ -98,7 +79,7 @@ onMounted(() => {
 @import '../../styles/JournalStats.scss';
 @import '../../styles/variables.scss';
 
-.tabs {
+.stats-buttons {
   position: relative;
 
   display: flex;

src/components/JournalView/JournalTimetables/JournalTimetablesList.vue

@@ -42,7 +42,7 @@ import { defineComponent, PropType } from 'vue';
 import Loading from '../../Global/Loading.vue';
 import AddDataButton from '../../Global/AddDataButton.vue';
 import TimetableHistoryList from './TimetableHistoryList.vue';
-import { useStore } from '../../../store/mainStore';
+import { useMainStore } from '../../../store/mainStore';
 import { Status } from '../../../typings/common';
 import { API } from '../../../typings/api';
 
@@ -71,7 +71,7 @@ export default defineComponent({
   data() {
     return {
       Status,
-      store: useStore()
+      store: useMainStore()
     };
   }
 });

src/components/JournalView/JournalTimetables/TimetableGeneral.vue

@@ -111,16 +111,17 @@ export default defineComponent({
 
   gap: 0.5em;
   margin-bottom: 0.5em;
-
-  @include smallScreen() {
-    justify-content: center;
-  }
 }
 
 .info-date {
   margin-right: 0.5em;
 }
 
+.badges {
+  display: flex;
+  gap: 0.25em;
+}
+
 .info-badge {
   padding: 0.05em 0.35em;
   color: black;
@@ -142,7 +143,14 @@ export default defineComponent({
   cursor: pointer;
   display: flex;
   flex-wrap: wrap;
+  justify-content: center;
   align-items: center;
   gap: 0.25em;
 }
+
+@include smallScreen {
+  .item-general {
+    justify-content: center;
+  }
+}
 </style>

src/components/SceneryView/SceneryTimetable.vue

@@ -48,7 +48,7 @@
       <transition-group name="list-anim">
         <div
           style="padding-bottom: 5em"
-          v-if="store.dataStatuses.trains == 0 && computedScheduledTrains.length == 0"
+          v-if="apiStore.dataStatuses.trains == 0 && computedScheduledTrains.length == 0"
           key="list-loading"
         >
           <Loading />
@@ -187,10 +187,11 @@ import Loading from '../Global/Loading.vue';
 import dateMixin from '../../mixins/dateMixin';
 import routerMixin from '../../mixins/routerMixin';
 import Station from '../../scripts/interfaces/Station';
-import { useStore } from '../../store/mainStore';
+import { useMainStore } from '../../store/mainStore';
 import modalTrainMixin from '../../mixins/modalTrainMixin';
 import ScheduledTrainStatus from './ScheduledTrainStatus.vue';
 import { OnlineScenery } from '../../store/typings';
+import { useApiStore } from '../../store/apiStore';
 
 export default defineComponent({
   name: 'SceneryTimetable',
@@ -224,7 +225,8 @@ export default defineComponent({
     const route = useRoute();
     const currentURL = computed(() => `${location.origin}${route.fullPath}`);
 
-    const store = useStore();
+    const apiStore = useApiStore();
+    const mainStore = useMainStore();
 
     const chosenCheckpoint = ref(
       props.station?.generalInfo?.checkpoints?.length == 0
@@ -235,7 +237,8 @@ export default defineComponent({
     return {
       currentURL,
       chosenCheckpoint,
-      store
+      apiStore,
+      mainStore
     };
   },
 
@@ -256,7 +259,7 @@ export default defineComponent({
             (train) =>
               train.checkpointName.toLocaleLowerCase() ==
                 (this.chosenCheckpoint || this.station!.name).toLocaleLowerCase() &&
-              train.region == this.store.region.id
+              train.region == this.mainStore.region.id
           )
           .sort((a, b) => {
             if (a.stopStatusID > b.stopStatusID) return 1;

src/components/StationsView/StationFilterCard.vue

@@ -139,7 +139,7 @@ import { defineComponent, inject } from 'vue';
 import keyMixin from '../../mixins/keyMixin';
 import routerMixin from '../../mixins/routerMixin';
 import { useStationFiltersStore } from '../../store/stationFiltersStore';
-import { useStore } from '../../store/mainStore';
+import { useMainStore } from '../../store/mainStore';
 
 import FilterOption from './FilterOption.vue';
 import StorageManager from '../../managers/storageManager';
@@ -163,7 +163,7 @@ export default defineComponent({
 
   setup() {
     const isVisible = inject('isFilterCardVisible');
-    const store = useStore();
+    const store = useMainStore();
     const filterStore = useStationFiltersStore();
 
     return {

src/components/StationsView/StationTable.vue

@@ -116,7 +116,7 @@
             <td class="station_dispatcher-name">
               <span v-if="station.onlineInfo?.dispatcherName">
                 <b
-                  v-if="store.donatorsData.includes(station.onlineInfo.dispatcherName)"
+                  v-if="apiStore.donatorsData.includes(station.onlineInfo.dispatcherName)"
                   :title="$t('donations.dispatcher-message')"
                   @click.stop="openDonationModal"
                 >
@@ -294,11 +294,12 @@ import stationInfoMixin from '../../mixins/stationInfoMixin';
 import styleMixin from '../../mixins/styleMixin';
 import Station from '../../scripts/interfaces/Station';
 import { useStationFiltersStore } from '../../store/stationFiltersStore';
-import { useStore } from '../../store/mainStore';
+import { useMainStore } from '../../store/mainStore';
 import Loading from '../Global/Loading.vue';
 import { HeadIdsTypes, headIconsIds, headIds } from '../../scripts/data/stationHeaderNames';
 import StationStatusBadge from '../Global/StationStatusBadge.vue';
 import { Status } from '../../typings/common';
+import { useApiStore } from '../../store/apiStore';
 
 export default defineComponent({
   props: {
@@ -325,17 +326,19 @@ export default defineComponent({
   },
 
   setup() {
-    const store = useStore();
+    const mainStore = useMainStore();
+    const apiStore = useApiStore();
     const stationFiltersStore = useStationFiltersStore();
 
     const isDataLoaded = computed(() => {
-      return store.dataStatuses.sceneries != Status.Data.Loading;
+      return apiStore.dataStatuses.sceneries != Status.Data.Loading;
     });
 
     return {
       isDataLoaded,
       stationFiltersStore,
-      store
+      mainStore,
+      apiStore
     };
   },
 
@@ -357,7 +360,7 @@ export default defineComponent({
 
     openDonationModal(e: Event) {
       this.$emit('toggleDonationModal', true);
-      this.store.modalLastClickedTarget = e.target;
+      this.mainStore.modalLastClickedTarget = e.target;
     },
 
     openForumSite(e: Event, url: string | undefined) {

src/components/TrainsView/TrainInfo.vue

@@ -35,7 +35,7 @@
 
         <div class="train-driver">
           <b
-            v-if="store.donatorsData.includes(train.driverName)"
+            v-if="apiStore.donatorsData.includes(train.driverName)"
             :title="$t('donations.driver-message')"
           >
             {{ train.driverName }}
@@ -126,7 +126,8 @@ import trainInfoMixin from '../../mixins/trainInfoMixin';
 import Train from '../../scripts/interfaces/Train';
 import ProgressBar from '../Global/ProgressBar.vue';
 import TrainThumbnail from '../Global/TrainThumbnail.vue';
-import { useStore } from '../../store/mainStore';
+import { useMainStore } from '../../store/mainStore';
+import { useApiStore } from '../../store/apiStore';
 
 export default defineComponent({
   mixins: [trainInfoMixin, styleMixin],
@@ -145,7 +146,8 @@ export default defineComponent({
 
   data() {
     return {
-      store: useStore()
+      store: useMainStore(),
+      apiStore: useApiStore()
     };
   }
 });

src/components/TrainsView/TrainSchedule.vue

@@ -72,7 +72,7 @@
 import { computed, defineComponent, PropType } from 'vue';
 import dateMixin from '../../mixins/dateMixin';
 import Train from '../../scripts/interfaces/Train';
-import { useStore } from '../../store/mainStore';
+import { useMainStore } from '../../store/mainStore';
 import StopDate from '../Global/StopDate.vue';
 import StockList from '../Global/StockList.vue';
 import { TrainStop } from '../../store/typings';
@@ -92,7 +92,7 @@ export default defineComponent({
 
   setup(props) {
     return {
-      store: useStore(),
+      store: useMainStore(),
 
       lastConfirmed: computed(() => {
         return props.train.timetableData!.followingStops.findIndex(

src/components/TrainsView/TrainStats.vue

@@ -16,7 +16,7 @@
 
         <hr style="margin: 0.5em 0" />
 
-        <div v-if="store.dataStatuses.trains == Status.Loaded && regionTrains.length > 0">
+        <div v-if="apiStore.dataStatuses.trains == Status.Loaded && regionTrains.length > 0">
           <div class="top-list general">
             <transition-group tag="ul" name="stats-anim">
               <li class="badge" key="timetable-count">
@@ -88,7 +88,7 @@
           </div>
         </div>
 
-        <div v-else-if="store.dataStatuses.trains != Status.Loaded">
+        <div v-else-if="apiStore.dataStatuses.trains != Status.Loaded">
           {{ $t('train-stats.stats-loading') }}
         </div>
 
@@ -102,8 +102,9 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-import { useStore } from '../../store/mainStore';
+import { useMainStore } from '../../store/mainStore';
 import { Status } from '../../typings/common';
+import { useApiStore } from '../../store/apiStore';
 
 interface ITop {
   name: string;
@@ -127,7 +128,8 @@ export default defineComponent({
   data() {
     return {
       showOptions: false,
-      store: useStore(),
+      store: useMainStore(),
+      apiStore: useApiStore(),
       Status: Status.Data
     };
   },

src/components/TrainsView/TrainTable.vue

@@ -1,16 +1,16 @@
 <template>
   <transition name="status-anim" mode="out-in" tag="div" class="train-table">
-    <div :key="store.dataStatuses.trains">
+    <div :key="apiStore.dataStatuses.trains">
       <div class="table-info" key="offline" v-if="store.isOffline">
         {{ $t('app.offline') }}
       </div>
 
-      <Loading v-else-if="trains.length == 0 && store.dataStatuses.trains == 0" key="loading" />
+      <Loading v-else-if="trains.length == 0 && apiStore.dataStatuses.trains == 0" key="loading" />
 
       <div
         class="table-info"
         key="no-trains"
-        v-else-if="trains.length == 0 && store.dataStatuses.trains != 0"
+        v-else-if="trains.length == 0 && apiStore.dataStatuses.trains != 0"
       >
         {{ $t('trains.no-trains') }}
       </div>
@@ -35,10 +35,11 @@
 import { defineComponent, inject, PropType, Ref } from 'vue';
 import modalTrainMixin from '../../mixins/modalTrainMixin';
 import Train from '../../scripts/interfaces/Train';
-import { useStore } from '../../store/mainStore';
+import { useMainStore } from '../../store/mainStore';
 import Loading from '../Global/Loading.vue';
 import TrainInfo from './TrainInfo.vue';
 import { Status } from '../../typings/common';
+import { useApiStore } from '../../store/apiStore';
 
 export default defineComponent({
   components: { Loading, TrainInfo },
@@ -53,7 +54,8 @@ export default defineComponent({
   mixins: [modalTrainMixin],
 
   setup() {
-    const store = useStore();
+    const store = useMainStore();
+    const apiStore = useApiStore();
     const searchedTrain = inject('searchedTrain') as Ref<string>;
     const searchedDriver = inject('searchedDriver') as Ref<string>;
 
@@ -61,6 +63,7 @@ export default defineComponent({
       searchedTrain,
       searchedDriver,
       store,
+      apiStore,
       sorterActive: inject('sorterActive') as {
         id: string | number;
         dir: number;
@@ -72,7 +75,7 @@ export default defineComponent({
     dataStatus() {
       if (this.store.isOffline) return Status.Data.Offline;
 
-      if (this.trains.length == 0 && this.store.dataStatuses.trains == Status.Data.Loading)
+      if (this.trains.length == 0 && this.apiStore.dataStatuses.trains == Status.Data.Loading)
         return Status.Data.Loading;
 
       return Status.Data.Loaded;

src/http.ts

@@ -0,0 +1,10 @@
+import axios from 'axios';
+
+const http = axios.create({
+  baseURL:
+    import.meta.env.VITE_API_MODE === 'development'
+      ? 'http://localhost:3001'
+      : 'https://stacjownik.spythere.eu'
+});
+
+export default http;

src/mixins/donatorMixin.ts

@@ -1,16 +1,16 @@
 import { defineComponent } from 'vue';
-import { useStore } from '../store/mainStore';
+import { useApiStore } from '../store/apiStore';
 
 export default defineComponent({
   data() {
     return {
-      store: useStore()
+      apiStore: useApiStore()
     };
   },
 
   methods: {
     isDonator(name: string) {
-      return this.store.donatorsData.includes(name);
+      return this.apiStore.donatorsData.includes(name);
     }
   }
 });

src/mixins/modalTrainMixin.ts

@@ -1,10 +1,10 @@
 import { defineComponent } from 'vue';
-import { useStore } from '../store/mainStore';
+import { useMainStore } from '../store/mainStore';
 
 export default defineComponent({
   data() {
     return {
-      store: useStore()
+      store: useMainStore()
     };
   },
 

src/router/index.ts

@@ -61,12 +61,10 @@ const routes: Array<RouteRecordRaw> = [
 
 const router = createRouter({
   scrollBehavior(to, from, savedPosition) {
-    if (to.name == 'SceneryView' && from.name && from.query['view'] === undefined)
+    if (to.name == 'SceneryView' && from.name !== to.name && from.query['view'] === undefined)
       return { el: `.app_main` };
 
     if (savedPosition) return savedPosition;
-
-    // if (from.name == 'SceneryView' && to.name == 'StationsView') return { el: `.last-selected`, top: 20 };
   },
   history: createWebHistory(),
   routes

src/store/apiStore.ts

@@ -0,0 +1,114 @@
+import { defineStore } from 'pinia';
+import http from '../http';
+import { API } from '../typings/api';
+import axios from 'axios';
+import { Status } from '../typings/common';
+import { StationJSONData } from './typings';
+
+export const useApiStore = defineStore('apiStore', {
+  state: () => ({
+    dataStatuses: {
+      connection: Status.Data.Loading,
+      sceneries: Status.Data.Loading,
+      timetables: Status.Data.Loading,
+      dispatchers: Status.Data.Loading,
+      trains: Status.Data.Loading
+    },
+
+    activeData: undefined as API.ActiveData.Response | undefined,
+    rollingStockData: undefined as API.RollingStock.Response | undefined,
+    donatorsData: [] as API.Donators.Response,
+    sceneryData: [] as StationJSONData[]
+  }),
+
+  actions: {
+    async setupAPI() {
+      // Static data
+      this.fetchStockInfoData();
+      this.fetchDonatorsData();
+      this.fetchStationsGeneralInfo();
+
+      this.scheduleFetchActiveData();
+    },
+
+    async setDataStatuses() {
+      if (!this.activeData?.activeSceneries) {
+        this.dataStatuses.sceneries = Status.Data.Error;
+        this.dataStatuses.trains = Status.Data.Error;
+        this.dataStatuses.dispatchers = Status.Data.Error;
+
+        return;
+      }
+
+      this.dataStatuses.sceneries = Status.Data.Loaded;
+      this.dataStatuses.trains = !this.activeData.trains ? Status.Data.Warning : Status.Data.Loaded;
+      this.dataStatuses.dispatchers = Status.Data.Loaded;
+    },
+
+    async fetchDonatorsData() {
+      try {
+        const response = await http.get<API.Donators.Response>('api/getDonators');
+
+        this.donatorsData = response.data;
+      } catch (error) {
+        console.error('Ups! Wystąpił błąd podczas pobierania informacji o donatorach:', error);
+      }
+    },
+
+    async fetchStockInfoData() {
+      try {
+        this.rollingStockData = (
+          await axios.get<API.RollingStock.Response>(
+            'https://raw.githubusercontent.com/Spythere/api/main/td2/data/stockInfo.json'
+          )
+        ).data;
+      } catch (error) {
+        console.error('Ups! Wystąpił błąd podczas pobierania informacji o taborze z API:', error);
+      }
+    },
+
+    async scheduleFetchActiveData() {
+      if (import.meta.env.VITE_API_MODE === 'mock') {
+        const mockActiveData = await import('../data/mockActiveData.json');
+        this.dataStatuses.connection = Status.Data.Loaded;
+        this.activeData = mockActiveData;
+        this.setDataStatuses();
+
+        console.warn('Stacjownik działa w trybie mockowania danych z WS');
+
+        return;
+      }
+
+      try {
+        const data = (await http.get<API.ActiveData.Response>('api/getActiveData')).data;
+
+        this.activeData = data;
+        this.dataStatuses.connection = Status.Data.Loaded;
+
+        this.setDataStatuses();
+      } catch (error) {
+        this.dataStatuses.connection = Status.Data.Error;
+        console.error('Wystąpił błąd podczas pobierania danych online z API!');
+      } finally {
+        setTimeout(
+          () => {
+            this.scheduleFetchActiveData();
+          },
+          ~~(1000 * (Math.random() * (25 - 20) + 25))
+        );
+      }
+    },
+
+    async fetchStationsGeneralInfo() {
+      const sceneryData: StationJSONData[] = (await http.get<StationJSONData[]>('api/getSceneries'))
+        .data;
+
+      if (!sceneryData) {
+        this.dataStatuses.sceneries = Status.Data.Error;
+        return;
+      }
+
+      this.sceneryData = sceneryData;
+    }
+  }
+});

src/store/mainStore.ts

@@ -1,37 +1,20 @@
-import axios from 'axios';
 import { defineStore } from 'pinia';
 import StationRoutes from '../scripts/interfaces/StationRoutes';
 import Train from '../scripts/interfaces/Train';
-import { URLs } from '../scripts/utils/apiURLs';
 import { parseSpawns, getScheduledTrains, getStationTrains } from './utils';
 
-import { OnlineScenery, ScheduledTrain, StationJSONData, StoreState } from './typings';
+import { OnlineScenery, ScheduledTrain, StoreState } from './typings';
 
-import { API } from '../typings/api';
 import { Status } from '../typings/common';
+import Station from '../scripts/interfaces/Station';
+import { useApiStore } from './apiStore';
+import { API } from '../typings/api';
 
-const API_INTERVAL_MS = 30000;
+export const useMainStore = defineStore('store', {
-
-export const useStore = defineStore('store', {
   state: () =>
     ({
-      activeData: {} as unknown,
-      rollingStockData: undefined,
-      donatorsData: [],
-
-      stationList: [],
-      regionOnlineCounters: [],
-
-      routesList: [],
-
-      sceneryData: [],
-      lastDispatcherStatuses: [],
-
       region: { id: 'eu', value: 'PL1' },
 
-      trainCount: 0,
-      stationCount: 0,
-
       isOffline: false,
 
       dispatcherStatsName: '',
@@ -43,31 +26,15 @@ export const useStore = defineStore('store', {
 
       chosenModalTrainId: undefined,
 
-      dataStatuses: {
-        connection: Status.Data.Loading,
-        sceneries: Status.Data.Loading,
-        timetables: Status.Data.Loading,
-        dispatchers: Status.Data.Loading,
-        trains: Status.Data.Loading
-      },
-
-      currentStatsTab: null,
-
       blockScroll: false,
-      listenerLaunched: false,
+      modalLastClickedTarget: null
-      modalLastClickedTarget: null,
-
-      tooltip: {
-        content: '',
-        visible: false,
-        x: 0,
-        y: 0
-      }
     }) as StoreState,
 
   getters: {
     trainList(): Train[] {
-      return (this.activeData?.trains ?? [])
+      const apiStore = useApiStore();
+
+      return (apiStore.activeData?.trains ?? [])
         .filter((train) => train.timetable || train.online)
         .map((train) => {
           const stock = train.stockString.split(';');
@@ -118,10 +85,12 @@ export const useStore = defineStore('store', {
     },
 
     onlineSceneryList(state): OnlineScenery[] {
-      if (state.isOffline) return [];
+      const apiStore = useApiStore();
-      if (!state.activeData?.activeSceneries) return [];
 
-      return state.activeData?.activeSceneries.reduce((list, scenery) => {
+      if (state.isOffline) return [];
+      if (!apiStore.activeData?.activeSceneries) return [];
+
+      return apiStore.activeData?.activeSceneries.reduce((list, scenery) => {
         if (scenery.isOnline !== 1 && Date.now() - scenery.lastSeen > 1000 * 60 * 2) return list;
         if (scenery.dispatcherStatus == Status.ActiveDispatcher.UNKNOWN) return list;
 
@@ -180,13 +149,67 @@ export const useStore = defineStore('store', {
 
         return list;
       }, [] as OnlineScenery[]);
+    },
+
+    stationList(): Station[] {
+      const apiStore = useApiStore();
+
+      return apiStore.sceneryData.map((scenery) => {
+        return {
+          name: scenery.name,
+
+          generalInfo: {
+            ...scenery,
+            authors: scenery.authors?.split(',').map((a) => a.trim()),
+            routes:
+              scenery.routesInfo.reduce(
+                (acc, route) => {
+                  const propName: keyof StationRoutes = `${
+                    route.routeTracks == 2 ? 'twoWay' : 'oneWay'
+                  }${route.isElectric ? '' : 'No'}CatenaryRouteNames`;
+
+                  acc[route.routeTracks == 2 ? 'twoWay' : 'oneWay'].push({
+                    name: route.routeName,
+                    SBL: route.isRouteSBL,
+                    TWB: false,
+                    catenary: route.isElectric,
+                    isInternal: route.isInternal,
+                    tracks: route.routeTracks,
+                    length: route.routeLength,
+                    speed: route.routeSpeed
+                  });
+
+                  if (!route.isInternal) acc[propName].push(route.routeName);
+
+                  if (route.isRouteSBL) acc['sblRouteNames'].push(route.routeName);
+
+                  return acc;
+                },
+                {
+                  oneWay: [],
+                  twoWay: [],
+                  sblRouteNames: [],
+                  oneWayCatenaryRouteNames: [],
+                  oneWayNoCatenaryRouteNames: [],
+                  twoWayCatenaryRouteNames: [],
+                  twoWayNoCatenaryRouteNames: []
+                } as StationRoutes
+              ) || {},
+            checkpoints: scenery.checkpoints
+              ? scenery.checkpoints
+                  .split(';')
+                  .map((sub) => ({ checkpointName: sub, scheduledTrains: [] }))
+              : []
+          }
+        };
+      });
     }
   },
   actions: {
-    async processStationsOnlineInfo() {
+    async processStationsOnlineInfo(activeData: API.ActiveData.Response) {
-      if (!this.activeData.activeSceneries) return;
+      if (!activeData.activeSceneries) return;
 
-      const onlineSceneries = this.activeData.activeSceneries.reduce((acc, scenery) => {
+      const onlineSceneries = activeData.activeSceneries.reduce((acc, scenery) => {
         const savedStation = this.stationList.find((st) => scenery.stationName === st.name);
 
         if (scenery.isOnline !== 1 && Date.now() - scenery.lastSeen > 1000 * 60 * 2) return acc;
@@ -268,146 +291,9 @@ export const useStore = defineStore('store', {
         )
         .forEach((station) => (station.onlineInfo = undefined));
     },
-    async fetchStationsGeneralInfo() {
-      const sceneryData: StationJSONData[] = await (
-        await axios.get(`${URLs.stacjownikAPI}/api/getSceneries`)
-      ).data;
-
-      if (!sceneryData) {
-        this.dataStatuses.sceneries = Status.Data.Error;
-        return;
-      }
-
-      this.stationList = sceneryData.map((scenery) => {
-        return {
-          name: scenery.name,
-
-          generalInfo: {
-            ...scenery,
-            authors: scenery.authors?.split(',').map((a) => a.trim()),
-            routes:
-              scenery.routesInfo.reduce(
-                (acc, route) => {
-                  const propName: keyof StationRoutes = `${
-                    route.routeTracks == 2 ? 'twoWay' : 'oneWay'
-                  }${route.isElectric ? '' : 'No'}CatenaryRouteNames`;
-
-                  acc[route.routeTracks == 2 ? 'twoWay' : 'oneWay'].push({
-                    name: route.routeName,
-                    SBL: route.isRouteSBL,
-                    TWB: false,
-                    catenary: route.isElectric,
-                    isInternal: route.isInternal,
-                    tracks: route.routeTracks,
-                    length: route.routeLength,
-                    speed: route.routeSpeed
-                  });
-
-                  if (!route.isInternal) acc[propName].push(route.routeName);
-
-                  if (route.isRouteSBL) acc['sblRouteNames'].push(route.routeName);
-
-                  return acc;
-                },
-                {
-                  oneWay: [],
-                  twoWay: [],
-                  sblRouteNames: [],
-                  oneWayCatenaryRouteNames: [],
-                  oneWayNoCatenaryRouteNames: [],
-                  twoWayCatenaryRouteNames: [],
-                  twoWayNoCatenaryRouteNames: []
-                } as StationRoutes
-              ) || {},
-            checkpoints: scenery.checkpoints
-              ? scenery.checkpoints
-                  .split(';')
-                  .map((sub) => ({ checkpointName: sub, scheduledTrains: [] }))
-              : []
-          }
-        };
-      });
-    },
-
-    async fetchActiveData() {
-      if (import.meta.env.VITE_APP_API_MODE === 'mock') {
-        const mockActiveData = await import('../data/mockActiveData.json');
-        this.dataStatuses.connection = Status.Data.Loaded;
-        this.activeData = mockActiveData;
-        this.setStatuses();
-
-        console.warn('Stacjownik działa w trybie mockowania danych z WS');
-
-        return;
-      }
-
-      try {
-        const data = (
-          await axios.get<API.ActiveData.Response>(`${URLs.stacjownikAPI}/api/getActiveData`)
-        ).data;
-
-        this.activeData = data;
-        this.dataStatuses.connection = Status.Data.Loaded;
-
-        this.setStatuses();
-      } catch (error) {
-        this.dataStatuses.connection = Status.Data.Error;
-        console.error('Wystąpił błąd podczas pobierania danych online z API!');
-      }
-    },
-
-    async setupAPI() {
-      this.fetchActiveData();
-
-      setInterval(() => {
-        this.fetchActiveData();
-      }, API_INTERVAL_MS);
-
-      this.fetchStockInfoData();
-      this.fetchDonatorsData();
-      this.fetchStationsGeneralInfo();
-    },
 
     async changeRegion(region: StoreState['region']) {
       this.region = region;
-    },
-
-    async fetchStockInfoData() {
-      try {
-        this.rollingStockData = (
-          await axios.get<API.RollingStock.Response>(
-            'https://raw.githubusercontent.com/Spythere/api/main/td2/data/stockInfo.json'
-          )
-        ).data;
-      } catch (error) {
-        console.error('Ups! Wystąpił błąd podczas pobierania informacji o taborze z API:', error);
-      }
-    },
-
-    async fetchDonatorsData() {
-      try {
-        const response = await axios.get<API.Donators.Response>(
-          `${URLs.stacjownikAPI}/api/getDonators`
-        );
-
-        if (response.data) this.donatorsData = response.data;
-      } catch (error) {
-        console.error('Ups! Wystąpił błąd podczas pobierania informacji o donatorach:', error);
-      }
-    },
-
-    async setStatuses() {
-      if (!this.activeData.activeSceneries) {
-        this.dataStatuses.sceneries = Status.Data.Error;
-        this.dataStatuses.trains = Status.Data.Error;
-        this.dataStatuses.dispatchers = Status.Data.Error;
-
-        return;
-      }
-
-      this.dataStatuses.sceneries = Status.Data.Loaded;
-      this.dataStatuses.trains = !this.activeData.trains ? Status.Data.Warning : Status.Data.Loaded;
-      this.dataStatuses.dispatchers = Status.Data.Loaded;
     }
   }
 });

src/store/stationFiltersStore.ts

@@ -1,6 +1,6 @@
 import { defineStore } from 'pinia';
 import inputData from '../data/options.json';
-import { useStore } from './mainStore';
+import { useMainStore } from './mainStore';
 import { filterStations, sortStations } from '../scripts/utils/filterUtils';
 import { HeadIdsTypes } from '../scripts/data/stationHeaderNames';
 import StorageManager from '../managers/storageManager';
@@ -70,7 +70,7 @@ export const useStationFiltersStore = defineStore('stationFiltersStore', {
     },
 
     filteredStationList: (state) => {
-      const store = useStore();
+      const store = useMainStore();
       const savedStationNames = store.stationList.map((s) => s.name);
 
       const onlineUnsavedStations = store.onlineSceneryList

src/store/typings.ts

@@ -11,24 +11,7 @@ export interface RegionCounters {
 }
 
 export interface StoreState {
-  stationList: Station[];
-  activeData: API.ActiveData.Response;
-  rollingStockData?: API.RollingStock.Response;
-  donatorsData: API.Donators.Response;
-
-  regionOnlineCounters: RegionCounters[];
-
-  lastDispatcherStatuses: {
-    hash: string;
-    statusTimestamp: number;
-    statusID: Status.ActiveDispatcher;
-  }[];
-
-  sceneryData: any[][];
-
   region: { id: string; value: string };
-  trainCount: number;
-  stationCount: number;
 
   isOffline: boolean;
 
@@ -41,26 +24,8 @@ export interface StoreState {
 
   chosenModalTrainId?: string;
 
-  currentStatsTab: 'daily' | 'driver' | null;
-
-  dataStatuses: {
-    connection: Status.Data;
-    sceneries: Status.Data;
-    timetables: Status.Data;
-    dispatchers: Status.Data;
-    trains: Status.Data;
-  };
-
-  listenerLaunched: boolean;
   blockScroll: boolean;
   modalLastClickedTarget: EventTarget | null;
-
-  tooltip: {
-    visible: boolean;
-    x: number;
-    y: number;
-    content: string;
-  };
 }
 
 export interface StationRoutesInfo {

src/views/JournalDispatchers.vue

@@ -36,7 +36,7 @@ import axios from 'axios';
 
 import JournalOptions from '../components/JournalView/JournalOptions.vue';
 import { URLs } from '../scripts/utils/apiURLs';
-import { useStore } from '../store/mainStore';
+import { useMainStore } from '../store/mainStore';
 import JournalDispatchersList from '../components/JournalView/JournalDispatchersList.vue';
 
 import JournalHeader from '../components/JournalView/JournalHeader.vue';
@@ -105,7 +105,7 @@ export default defineComponent({
     const scrollElement: Ref<HTMLElement | null> = ref(null);
 
     return {
-      store: useStore(),
+      store: useMainStore(),
 
       sorterActive,
       searchersValues,

src/views/JournalTimetables.vue

@@ -46,7 +46,7 @@ import JournalStats from '../components/JournalView/JournalStats.vue';
 import JournalHeader from '../components/JournalView/JournalHeader.vue';
 
 import { URLs } from '../scripts/utils/apiURLs';
-import { useStore } from '../store/mainStore';
+import { useMainStore } from '../store/mainStore';
 
 import { LocationQuery } from 'vue-router';
 
@@ -194,7 +194,7 @@ export default defineComponent({
 
       scrollElement,
 
-      store: useStore()
+      store: useMainStore()
     };
   },
 

src/views/SceneryView.vue

@@ -40,7 +40,14 @@
           </button>
         </div>
 
-        <keep-alive>
+        <div
+          v-if="
+            apiStore.dataStatuses.sceneries == Status.Loading ||
+            apiStore.dataStatuses.trains == Status.Loading
+          "
+        ></div>
+
+        <keep-alive v-else>
           <component
             :is="currentMode"
             :onlineScenery="onlineSceneryInfo"
@@ -57,7 +64,7 @@
 import { computed, defineComponent } from 'vue';
 import { useRoute } from 'vue-router';
 import routerMixin from '../mixins/routerMixin';
-import { useStore } from '../store/mainStore';
+import { useMainStore } from '../store/mainStore';
 
 import SceneryInfo from '../components/SceneryView/SceneryInfo.vue';
 import SceneryHeader from '../components/SceneryView/SceneryHeader.vue';
@@ -65,6 +72,8 @@ import SceneryTimetable from '../components/SceneryView/SceneryTimetable.vue';
 import SceneryTimetablesHistory from '../components/SceneryView/SceneryTimetablesHistory.vue';
 import SceneryDispatchersHistory from '../components/SceneryView/SceneryDispatchersHistory.vue';
 import ActionButton from '../components/Global/ActionButton.vue';
+import { Status } from '../typings/common';
+import { useApiStore } from '../store/apiStore';
 
 enum SceneryViewMode {
   'TIMETABLES_ACTIVE',
@@ -99,7 +108,9 @@ export default defineComponent({
   mixins: [routerMixin],
 
   data: () => ({
-    store: useStore(),
+    store: useMainStore(),
+    apiStore: useApiStore(),
+
     viewModes: [
       {
         id: 'scenery.option-active-timetables',
@@ -117,7 +128,8 @@ export default defineComponent({
     sceneryViewMode: SceneryViewMode,
     selectedCheckpoint: '',
     currentViewCompontent: 'SceneryTimetable',
-    onlineFrom: -1
+    onlineFrom: -1,
+    Status: Status.Data
   }),
 
   // activated() {
@@ -192,8 +204,6 @@ button.back-btn {
   &-view {
     display: flex;
     justify-content: center;
-
-    min-height: 100vh;
   }
 
   &-offline {
@@ -222,6 +232,7 @@ button.back-btn {
 
   width: 100%;
   max-width: 1700px;
+  min-height: 100vh;
 
   margin: 1rem 0;
   text-align: center;

src/views/StationsView.vue

@@ -21,7 +21,7 @@ import { defineComponent } from 'vue';
 import StationTable from '../components/StationsView/StationTable.vue';
 import StationFilterCard from '../components/StationsView/StationFilterCard.vue';
 import { useStationFiltersStore } from '../store/stationFiltersStore';
-import { useStore } from '../store/mainStore';
+import { useMainStore } from '../store/mainStore';
 import Donation from '../components/Global/Donation.vue';
 
 export default defineComponent({
@@ -37,7 +37,7 @@ export default defineComponent({
     STORAGE_KEY: 'options_saved',
     focusedStationName: '',
     filterStore: useStationFiltersStore(),
-    store: useStore(),
+    store: useMainStore(),
 
     isDonationModalOpen: false
   }),

src/views/TrainsView.vue

@@ -21,7 +21,7 @@ import TrainOptions from '../components/TrainsView/TrainOptions.vue';
 import TrainTable from '../components/TrainsView/TrainTable.vue';
 import modalTrainMixin from '../mixins/modalTrainMixin';
 import Train from '../scripts/interfaces/Train';
-import { useStore } from '../store/mainStore';
+import { useMainStore } from '../store/mainStore';
 import { TrainFilter, trainFilters } from '../components/TrainsView/typings';
 import { filteredTrainList } from '../managers/trainFilterManager';
 import TrainStats from '../components/TrainsView/TrainStats.vue';
@@ -58,7 +58,7 @@ export default defineComponent({
   }),
 
   setup() {
-    const store = useStore();
+    const store = useMainStore();
     const initTrainFilters = [...trainFilters.map((f) => ({ ...f }))];
 
     const sorterActive = reactive({ id: 'routeDistance', dir: -1 });

yarn.lock

@@ -42,7 +42,7 @@
   resolved "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.20.10.tgz"
   integrity sha512-sEnuDPpOJR/fcafHMjpcpGN5M2jbUGUHwmuWKM/YdPzeEDJg8bgmbcWQFUfE32MQjti1koACvoPVsDe8Uq+idg==
 
-"@babel/core@^7.0.0", "@babel/core@^7.0.0-0", "@babel/core@^7.11.1", "@babel/core@^7.12.0", "@babel/core@^7.13.0", "@babel/core@^7.4.0-0":
+"@babel/core@^7.11.1":
   version "7.20.7"
   resolved "https://registry.npmjs.org/@babel/core/-/core-7.20.7.tgz"
   integrity sha512-t1ZjCluspe5DW24bn2Rr1CDb2v9rn/hROtg9a2tmd0+QYf4bsloYfLQzjG4qHPNMhWtKdGC33R5AxGR2Af2cBw==
@@ -929,11 +929,116 @@
   resolved "https://registry.npmjs.org/@canvas/image-data/-/image-data-1.0.0.tgz"
   integrity sha512-BxOqI5LgsIQP1odU5KMwV9yoijleOPzHL18/YvNqF9KFSGF2K/DLlYAbDQsWqd/1nbaFuSkYD/191dpMtNh4vw==
 
+"@esbuild/android-arm64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.18.20.tgz#984b4f9c8d0377443cc2dfcef266d02244593622"
+  integrity sha512-Nz4rJcchGDtENV0eMKUNa6L12zz2zBDXuhj/Vjh18zGqB44Bi7MBMSXjgunJgjRhCmKOjnPuZp4Mb6OKqtMHLQ==
+
+"@esbuild/android-arm@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.18.20.tgz#fedb265bc3a589c84cc11f810804f234947c3682"
+  integrity sha512-fyi7TDI/ijKKNZTUJAQqiG5T7YjJXgnzkURqmGj13C6dCqckZBLdl4h7bkhHt/t0WP+zO9/zwroDvANaOqO5Sw==
+
+"@esbuild/android-x64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.18.20.tgz#35cf419c4cfc8babe8893d296cd990e9e9f756f2"
+  integrity sha512-8GDdlePJA8D6zlZYJV/jnrRAi6rOiNaCC/JclcXpB+KIuvfBN4owLtgzY2bsxnx666XjJx2kDPUmnTtR8qKQUg==
+
+"@esbuild/darwin-arm64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/darwin-arm64/-/darwin-arm64-0.18.20.tgz#08172cbeccf95fbc383399a7f39cfbddaeb0d7c1"
+  integrity sha512-bxRHW5kHU38zS2lPTPOyuyTm+S+eobPUnTNkdJEfAddYgEcll4xkT8DB9d2008DtTbl7uJag2HuE5NZAZgnNEA==
+
+"@esbuild/darwin-x64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.18.20.tgz#d70d5790d8bf475556b67d0f8b7c5bdff053d85d"
+  integrity sha512-pc5gxlMDxzm513qPGbCbDukOdsGtKhfxD1zJKXjCCcU7ju50O7MeAZ8c4krSJcOIJGFR+qx21yMMVYwiQvyTyQ==
+
+"@esbuild/freebsd-arm64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.18.20.tgz#98755cd12707f93f210e2494d6a4b51b96977f54"
+  integrity sha512-yqDQHy4QHevpMAaxhhIwYPMv1NECwOvIpGCZkECn8w2WFHXjEwrBn3CeNIYsibZ/iZEUemj++M26W3cNR5h+Tw==
+
+"@esbuild/freebsd-x64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.18.20.tgz#c1eb2bff03915f87c29cece4c1a7fa1f423b066e"
+  integrity sha512-tgWRPPuQsd3RmBZwarGVHZQvtzfEBOreNuxEMKFcd5DaDn2PbBxfwLcj4+aenoh7ctXcbXmOQIn8HI6mCSw5MQ==
+
+"@esbuild/linux-arm64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.18.20.tgz#bad4238bd8f4fc25b5a021280c770ab5fc3a02a0"
+  integrity sha512-2YbscF+UL7SQAVIpnWvYwM+3LskyDmPhe31pE7/aoTMFKKzIc9lLbyGUpmmb8a8AixOL61sQ/mFh3jEjHYFvdA==
+
+"@esbuild/linux-arm@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.18.20.tgz#3e617c61f33508a27150ee417543c8ab5acc73b0"
+  integrity sha512-/5bHkMWnq1EgKr1V+Ybz3s1hWXok7mDFUMQ4cG10AfW3wL02PSZi5kFpYKrptDsgb2WAJIvRcDm+qIvXf/apvg==
+
+"@esbuild/linux-ia32@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.18.20.tgz#699391cccba9aee6019b7f9892eb99219f1570a7"
+  integrity sha512-P4etWwq6IsReT0E1KHU40bOnzMHoH73aXp96Fs8TIT6z9Hu8G6+0SHSw9i2isWrD2nbx2qo5yUqACgdfVGx7TA==
+
+"@esbuild/linux-loong64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.18.20.tgz#e6fccb7aac178dd2ffb9860465ac89d7f23b977d"
+  integrity sha512-nXW8nqBTrOpDLPgPY9uV+/1DjxoQ7DoB2N8eocyq8I9XuqJ7BiAMDMf9n1xZM9TgW0J8zrquIb/A7s3BJv7rjg==
+
+"@esbuild/linux-mips64el@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.18.20.tgz#eeff3a937de9c2310de30622a957ad1bd9183231"
+  integrity sha512-d5NeaXZcHp8PzYy5VnXV3VSd2D328Zb+9dEq5HE6bw6+N86JVPExrA6O68OPwobntbNJ0pzCpUFZTo3w0GyetQ==
+
+"@esbuild/linux-ppc64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.18.20.tgz#2f7156bde20b01527993e6881435ad79ba9599fb"
+  integrity sha512-WHPyeScRNcmANnLQkq6AfyXRFr5D6N2sKgkFo2FqguP44Nw2eyDlbTdZwd9GYk98DZG9QItIiTlFLHJHjxP3FA==
+
+"@esbuild/linux-riscv64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.18.20.tgz#6628389f210123d8b4743045af8caa7d4ddfc7a6"
+  integrity sha512-WSxo6h5ecI5XH34KC7w5veNnKkju3zBRLEQNY7mv5mtBmrP/MjNBCAlsM2u5hDBlS3NGcTQpoBvRzqBcRtpq1A==
+
+"@esbuild/linux-s390x@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.18.20.tgz#255e81fb289b101026131858ab99fba63dcf0071"
+  integrity sha512-+8231GMs3mAEth6Ja1iK0a1sQ3ohfcpzpRLH8uuc5/KVDFneH6jtAJLFGafpzpMRO6DzJ6AvXKze9LfFMrIHVQ==
+
 "@esbuild/linux-x64@0.18.20":
   version "0.18.20"
   resolved "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.18.20.tgz"
   integrity sha512-UYqiqemphJcNsFEskc73jQ7B9jgwjWrSayxawS6UVFZGWrAAtkzjxSqnoclCXxWtfwLdzU+vTpcNYhpn43uP1w==
 
+"@esbuild/netbsd-x64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.18.20.tgz#30e8cd8a3dded63975e2df2438ca109601ebe0d1"
+  integrity sha512-iO1c++VP6xUBUmltHZoMtCUdPlnPGdBom6IrO4gyKPFFVBKioIImVooR5I83nTew5UOYrk3gIJhbZh8X44y06A==
+
+"@esbuild/openbsd-x64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.18.20.tgz#7812af31b205055874c8082ea9cf9ab0da6217ae"
+  integrity sha512-e5e4YSsuQfX4cxcygw/UCPIEP6wbIL+se3sxPdCiMbFLBWu0eiZOJ7WoD+ptCLrmjZBK1Wk7I6D/I3NglUGOxg==
+
+"@esbuild/sunos-x64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.18.20.tgz#d5c275c3b4e73c9b0ecd38d1ca62c020f887ab9d"
+  integrity sha512-kDbFRFp0YpTQVVrqUd5FTYmWo45zGaXe0X8E1G/LKFC0v8x0vWrhOWSLITcCn63lmZIxfOMXtCfti/RxN/0wnQ==
+
+"@esbuild/win32-arm64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.18.20.tgz#73bc7f5a9f8a77805f357fab97f290d0e4820ac9"
+  integrity sha512-ddYFR6ItYgoaq4v4JmQQaAI5s7npztfV4Ag6NrhiaW0RrnOXqBkgwZLofVTlq1daVTQNhtI5oieTvkRPfZrePg==
+
+"@esbuild/win32-ia32@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.18.20.tgz#ec93cbf0ef1085cc12e71e0d661d20569ff42102"
+  integrity sha512-Wv7QBi3ID/rROT08SABTS7eV4hX26sVduqDOTe1MvGMjNd3EjOz4b7zeexIR62GTIEKrfJXKL9LFxTYgkyeu7g==
+
+"@esbuild/win32-x64@0.18.20":
+  version "0.18.20"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.18.20.tgz#786c5f41f043b07afb1af37683d7c33668858f6d"
+  integrity sha512-kTdfRcSiDfQca/y9QIkng02avJ+NCaQvrMejlsB3RRv5sE9rRoeBPISaZpKxHELzRxZyLvNts1P27W3wV+8geQ==
+
 "@eslint-community/eslint-utils@^4.2.0", "@eslint-community/eslint-utils@^4.4.0":
   version "4.4.0"
   resolved "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz"
@@ -1025,7 +1130,7 @@
     "@firebase/util" "1.9.3"
     tslib "^2.1.0"
 
-"@firebase/app-compat@0.2.19", "@firebase/app-compat@0.x":
+"@firebase/app-compat@0.2.19":
   version "0.2.19"
   resolved "https://registry.npmjs.org/@firebase/app-compat/-/app-compat-0.2.19.tgz"
   integrity sha512-QkJDqYqjhvs4fTMcRVXQkP9hbo5yfoJXDWkhU4VA5Vzs8Qsp76VPzYbqx5SD5OmBy+bz/Ot1UV8qySPGI4aKuw==
@@ -1036,12 +1141,12 @@
     "@firebase/util" "1.9.3"
     tslib "^2.1.0"
 
-"@firebase/app-types@0.9.0", "@firebase/app-types@0.x":
+"@firebase/app-types@0.9.0":
   version "0.9.0"
   resolved "https://registry.npmjs.org/@firebase/app-types/-/app-types-0.9.0.tgz"
   integrity sha512-AeweANOIo0Mb8GiYm3xhTEBVCmPwTYAu9Hcd2qSkLuga/6+j9b1Jskl5bpiSQWy9eJ/j5pavxj6eYogmnuzm+Q==
 
-"@firebase/app@0.9.19", "@firebase/app@0.x":
+"@firebase/app@0.9.19":
   version "0.9.19"
   resolved "https://registry.npmjs.org/@firebase/app/-/app-0.9.19.tgz"
   integrity sha512-t/SHyZ3xWkR77ZU9VMoobDNFLdDKQ5xqoCAn4o16gTsA1C8sJ6ZOMZ02neMOPxNHuQXVE4tA8ukilnDbnK7uJA==
@@ -1326,7 +1431,7 @@
     node-fetch "2.6.7"
     tslib "^2.1.0"
 
-"@firebase/util@1.9.3", "@firebase/util@1.x":
+"@firebase/util@1.9.3":
   version "1.9.3"
   resolved "https://registry.npmjs.org/@firebase/util/-/util-1.9.3.tgz"
   integrity sha512-DY02CRhOZwpzO36fHpuVysz6JZrscPiBXD0fXp6qSrL9oNOx5KWICKdR95C0lSITzxp0TZosVyHqzatE8JbcjA==
@@ -1431,7 +1536,7 @@
     "@jridgewell/gen-mapping" "^0.3.0"
     "@jridgewell/trace-mapping" "^0.3.9"
 
-"@jridgewell/sourcemap-codec@^1.4.10", "@jridgewell/sourcemap-codec@1.4.14":
+"@jridgewell/sourcemap-codec@1.4.14", "@jridgewell/sourcemap-codec@^1.4.10":
   version "1.4.14"
   resolved "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz"
   integrity sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw==
@@ -1457,7 +1562,7 @@
     "@nodelib/fs.stat" "2.0.5"
     run-parallel "^1.1.9"
 
-"@nodelib/fs.stat@^2.0.2", "@nodelib/fs.stat@2.0.5":
+"@nodelib/fs.stat@2.0.5", "@nodelib/fs.stat@^2.0.2":
   version "2.0.5"
   resolved "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz"
   integrity sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==
@@ -1597,26 +1702,16 @@
   resolved "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.14.tgz"
   integrity sha512-U3PUjAudAdJBeC2pgN8uTIKgxrb4nlDF3SF0++EldXQvQBGkpFZMSnwQiIoDU77tv45VgNkl/L4ouD+rEomujw==
 
-"@types/node@*":
+"@types/node@*", "@types/node@>=12.12.47", "@types/node@>=13.7.0":
   version "18.11.18"
   resolved "https://registry.npmjs.org/@types/node/-/node-18.11.18.tgz"
   integrity sha512-DHQpWGjyQKSHj3ebjFI/wRKcqQcdR+MoFBygntYOZytCqNfkd2ZC4ARDJ2DQqhjH5p85Nnd3jhUJIXrszFX/JA==
 
-"@types/node@^20.6.2", "@types/node@>= 14":
+"@types/node@^20.6.2":
   version "20.6.2"
   resolved "https://registry.npmjs.org/@types/node/-/node-20.6.2.tgz"
   integrity sha512-Y+/1vGBHV/cYk6OI1Na/LHzwnlNCAfU3ZNGrc1LdRe/LAIbdDPTTv/HU3M7yXN448aTVDq3eKRm2cg7iKLb8gw==
 
-"@types/node@>=12.12.47":
-  version "18.11.18"
-  resolved "https://registry.npmjs.org/@types/node/-/node-18.11.18.tgz"
-  integrity sha512-DHQpWGjyQKSHj3ebjFI/wRKcqQcdR+MoFBygntYOZytCqNfkd2ZC4ARDJ2DQqhjH5p85Nnd3jhUJIXrszFX/JA==
-
-"@types/node@>=13.7.0":
-  version "18.11.18"
-  resolved "https://registry.npmjs.org/@types/node/-/node-18.11.18.tgz"
-  integrity sha512-DHQpWGjyQKSHj3ebjFI/wRKcqQcdR+MoFBygntYOZytCqNfkd2ZC4ARDJ2DQqhjH5p85Nnd3jhUJIXrszFX/JA==
-
 "@types/resolve@1.17.1":
   version "1.17.1"
   resolved "https://registry.npmjs.org/@types/resolve/-/resolve-1.17.1.tgz"
@@ -1651,7 +1746,7 @@
     semver "^7.5.4"
     ts-api-utils "^1.0.1"
 
-"@typescript-eslint/parser@^6.0.0 || ^6.0.0-alpha", "@typescript-eslint/parser@^6.7.0":
+"@typescript-eslint/parser@^6.7.0":
   version "6.9.1"
   resolved "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-6.9.1.tgz"
   integrity sha512-C7AK2wn43GSaCUZ9do6Ksgi2g3mwFkMO3Cis96kzmgudoVaKyt62yNzJOktP0HDLb/iO2O0n2lBOzJgr6Q/cyg==
@@ -1741,14 +1836,14 @@
   resolved "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-4.3.4.tgz"
   integrity sha512-ciXNIHKPriERBisHFBvnTbfKa6r9SAesOYXeGDzgegcvy9Q4xdScSHAmKbNT0M3O0S9LKhIf5/G+UYG4NnnzYw==
 
-"@volar/language-core@~1.10.0", "@volar/language-core@1.10.1":
+"@volar/language-core@1.10.1", "@volar/language-core@~1.10.0":
   version "1.10.1"
   resolved "https://registry.npmjs.org/@volar/language-core/-/language-core-1.10.1.tgz"
   integrity sha512-JnsM1mIPdfGPxmoOcK1c7HYAsL6YOv0TCJ4aW3AXPZN/Jb4R77epDyMZIVudSGjWMbvv/JfUa+rQ+dGKTmgwBA==
   dependencies:
     "@volar/source-map" "1.10.1"
 
-"@volar/source-map@~1.10.0", "@volar/source-map@1.10.1":
+"@volar/source-map@1.10.1", "@volar/source-map@~1.10.0":
   version "1.10.1"
   resolved "https://registry.npmjs.org/@volar/source-map/-/source-map-1.10.1.tgz"
   integrity sha512-3/S6KQbqa7pGC8CxPrg69qHLpOvkiPHGJtWPkI/1AXCsktkJ6gIk/5z4hyuMp8Anvs6eS/Kvp/GZa3ut3votKA==
@@ -1772,7 +1867,7 @@
     estree-walker "^2.0.2"
     source-map-js "^1.0.2"
 
-"@vue/compiler-dom@^3.3.0", "@vue/compiler-dom@3.3.4":
+"@vue/compiler-dom@3.3.4", "@vue/compiler-dom@^3.3.0":
   version "3.3.4"
   resolved "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.3.4.tgz"
   integrity sha512-wyM+OjOVpuUukIq6p5+nwHYtj9cFroz9cwkfmP9O1nzH68BenTTv0u7/ndggT8cIQlnBeOo6sUT/gvHcIkLA5w==
@@ -1851,7 +1946,7 @@
     estree-walker "^2.0.2"
     magic-string "^0.30.0"
 
-"@vue/reactivity@^3.3.0", "@vue/reactivity@3.3.4":
+"@vue/reactivity@3.3.4", "@vue/reactivity@^3.3.0":
   version "3.3.4"
   resolved "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.3.4.tgz"
   integrity sha512-kLTDLwd0B1jG08NBF3R5rqULtv/f8x3rOFByTDz4J53ttIQEDmALqKqXY0J+XQeN0aV2FBxY8nJDf88yvOPAqQ==
@@ -1883,7 +1978,7 @@
     "@vue/compiler-ssr" "3.3.4"
     "@vue/shared" "3.3.4"
 
-"@vue/shared@^3.3.0", "@vue/shared@3.3.4":
+"@vue/shared@3.3.4", "@vue/shared@^3.3.0":
   version "3.3.4"
   resolved "https://registry.npmjs.org/@vue/shared/-/shared-3.3.4.tgz"
   integrity sha512-7OjdcV8vQ74eiz1TZLzZP4JwqM5fA94K6yntPS5Z25r9HDuGNzaGdgvwKYq6S+MxwF0TFRwe50fIR/MYnakdkQ==
@@ -1906,7 +2001,7 @@ acorn-jsx@^5.3.2:
   resolved "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz"
   integrity sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==
 
-"acorn@^6.0.0 || ^7.0.0 || ^8.0.0", acorn@^8.10.0, acorn@^8.5.0, acorn@^8.9.0:
+acorn@^8.10.0, acorn@^8.5.0, acorn@^8.9.0:
   version "8.10.0"
   resolved "https://registry.npmjs.org/acorn/-/acorn-8.10.0.tgz"
   integrity sha512-F0SAmZ8iUtS//m8DmCTA0jlh6TDKkHQyK6xc6V4KDTyZKA9dnvX9/3sRTVQrWm79glUAZbnmmNcdYwUIHWVybw==
@@ -1921,7 +2016,7 @@ ajv@^6.12.4:
     json-schema-traverse "^0.4.1"
     uri-js "^4.2.2"
 
-ajv@^8.6.0, ajv@>=8:
+ajv@^8.6.0:
   version "8.11.2"
   resolved "https://registry.npmjs.org/ajv/-/ajv-8.11.2.tgz"
   integrity sha512-E4bfmKAhGiSTvMfL1Myyycaub+cUEU2/IvpylXkUu7CHBkBj1f/ikdzbD7YQ6FKUbixDxeYvB/xY4fvyroDlQg==
@@ -2084,7 +2179,7 @@ braces@^3.0.2, braces@~3.0.2:
   dependencies:
     fill-range "^7.0.1"
 
-browserslist@^4.21.3, browserslist@^4.21.4, "browserslist@>= 4.21.0":
+browserslist@^4.21.3, browserslist@^4.21.4:
   version "4.21.4"
   resolved "https://registry.npmjs.org/browserslist/-/browserslist-4.21.4.tgz"
   integrity sha512-CBHJJdDmgjl3daYjN5Cp5kbTf1mUhZoS+beLklHIvkOWscs83YAhLlF3Wsh/lciQYAcbBJgTOD44VtG31ZM4Hw==
@@ -2151,15 +2246,7 @@ chalk@^2.4.2:
     escape-string-regexp "^1.0.5"
     supports-color "^5.3.0"
 
-chalk@^4.0.0:
+chalk@^4.0.0, chalk@^4.0.2:
-  version "4.1.2"
-  resolved "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz"
-  integrity sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==
-  dependencies:
-    ansi-styles "^4.1.0"
-    supports-color "^7.1.0"
-
-chalk@^4.0.2:
   version "4.1.2"
   resolved "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz"
   integrity sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==
@@ -2210,16 +2297,16 @@ color-convert@^2.0.1:
   dependencies:
     color-name "~1.1.4"
 
-color-name@^1.0.0, color-name@~1.1.4:
-  version "1.1.4"
-  resolved "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz"
-  integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==
-
 color-name@1.1.3:
   version "1.1.3"
   resolved "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz"
   integrity sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==
 
+color-name@^1.0.0, color-name@~1.1.4:
+  version "1.1.4"
+  resolved "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz"
+  integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==
+
 color-string@^1.9.0:
   version "1.9.1"
   resolved "https://registry.npmjs.org/color-string/-/color-string-1.9.1.tgz"
@@ -2545,7 +2632,7 @@ eslint-plugin-prettier@^5.0.0:
     prettier-linter-helpers "^1.0.0"
     synckit "^0.8.5"
 
-eslint-plugin-vue@^9.0.0, eslint-plugin-vue@^9.17.0:
+eslint-plugin-vue@^9.17.0:
   version "9.18.1"
   resolved "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-9.18.1.tgz"
   integrity sha512-7hZFlrEgg9NIzuVik2I9xSnJA5RsmOfueYgsUGUokEDLJ1LHtxO0Pl4duje1BriZ/jDWb+44tcIlC3yi0tdlZg==
@@ -2571,7 +2658,7 @@ eslint-visitor-keys@^3.3.0, eslint-visitor-keys@^3.4.1, eslint-visitor-keys@^3.4
   resolved "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz"
   integrity sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==
 
-"eslint@^6.0.0 || ^7.0.0 || >=8.0.0", "eslint@^6.2.0 || ^7.0.0 || ^8.0.0", "eslint@^7.0.0 || ^8.0.0", eslint@^8.49.0, "eslint@>= 8.0.0", eslint@>=6.0.0, eslint@>=7.0.0, eslint@>=8.0.0:
+eslint@^8.49.0:
   version "8.52.0"
   resolved "https://registry.npmjs.org/eslint/-/eslint-8.52.0.tgz"
   integrity sha512-zh/JHnaixqHZsolRB/w9/02akBk9EPrOs9JwcTP2ek7yL5bVvXuRariiaAjjoJ5DvuwQ1WAE/HsMz+w17YgBCg==
@@ -2852,6 +2939,11 @@ fs.realpath@^1.0.0:
   resolved "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz"
   integrity sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==
 
+fsevents@~2.3.2:
+  version "2.3.3"
+  resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.3.tgz#cac6407785d03675a2a5e1a5305c697b347d90d6"
+  integrity sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==
+
 function-bind@^1.1.1:
   version "1.1.1"
   resolved "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz"
@@ -3052,7 +3144,7 @@ ico-endec@*:
   resolved "https://registry.npmjs.org/ico-endec/-/ico-endec-0.1.6.tgz"
   integrity sha512-ZdLU38ZoED3g1j3iEyzcQj+wAkY2xfWNkymszfJPoxucIUhK7NayQ+/C4Kv0nDFMIsbtbEHldv3V8PU494/ueQ==
 
-idb@^7.0.1, idb@7.0.1:
+idb@7.0.1, idb@^7.0.1:
   version "7.0.1"
   resolved "https://registry.npmjs.org/idb/-/idb-7.0.1.tgz"
   integrity sha512-UUxlE7vGWK5RfB/fDwEGgRf84DY/ieqNha6msMV99UsEMQhJ1RwbCd8AYBj3QMgnE3VZnfQvm4oKVCJTYlqIgg==
@@ -3098,7 +3190,7 @@ inflight@^1.0.4:
     once "^1.3.0"
     wrappy "1"
 
-inherits@^2.0.3, inherits@^2.0.4, inherits@2:
+inherits@2, inherits@^2.0.3, inherits@^2.0.4:
   version "2.0.4"
   resolved "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz"
   integrity sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
@@ -3826,7 +3918,7 @@ prettier-linter-helpers@^1.0.0:
   dependencies:
     fast-diff "^1.1.2"
 
-prettier@^3.0.3, "prettier@>= 3.0.0", prettier@>=3.0.0:
+prettier@^3.0.3:
   version "3.0.3"
   resolved "https://registry.npmjs.org/prettier/-/prettier-3.0.3.tgz"
   integrity sha512-L/4pUDMxcNa8R/EthV08Zt42WBO4h1rarVtK0K+QJG0X187OLo7l699jWw0GKuwzkPQ//jMFA/8Xm6Fh3J/DAg==
@@ -4023,7 +4115,7 @@ rollup-plugin-terser@^7.0.0:
     serialize-javascript "^4.0.0"
     terser "^5.0.0"
 
-"rollup@^1.20.0 || ^2.0.0", rollup@^1.20.0||^2.0.0, rollup@^2.0.0, rollup@^2.43.1:
+rollup@^2.43.1:
   version "2.79.1"
   resolved "https://registry.npmjs.org/rollup/-/rollup-2.79.1.tgz"
   integrity sha512-uKxbd0IhMZOhjAiD5oAFp7BqvkA4Dv47qpOCtaNvng4HBwdbWtdOh8f5nZNuk2rp51PMGk3bzfWu5oayNEuYnw==
@@ -4051,7 +4143,7 @@ run-parallel@^1.1.9:
   dependencies:
     queue-microtask "^1.2.2"
 
-safe-buffer@^5.0.1, safe-buffer@>=5.1.0, safe-buffer@~5.2.0:
+safe-buffer@>=5.1.0, safe-buffer@^5.0.1, safe-buffer@~5.2.0:
   version "5.2.1"
   resolved "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz"
   integrity sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==
@@ -4070,7 +4162,7 @@ safe-regex-test@^1.0.0:
     get-intrinsic "^1.1.3"
     is-regex "^1.1.4"
 
-sass@*, sass@^1.67.0:
+sass@^1.67.0:
   version "1.67.0"
   resolved "https://registry.npmjs.org/sass/-/sass-1.67.0.tgz"
   integrity sha512-SVrO9ZeX/QQyEGtuZYCVxoeAL5vGlYjJ9p4i4HFuekWl8y/LtJ7tJc10Z+ck1c8xOuoBm2MYzcLfTAffD0pl/A==
@@ -4084,28 +4176,7 @@ semver@^6.1.1, semver@^6.1.2, semver@^6.3.0:
   resolved "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz"
   integrity sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==
 
-semver@^7.3.5:
+semver@^7.3.5, semver@^7.3.6, semver@^7.3.8, semver@^7.5.4:
-  version "7.5.4"
-  resolved "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz"
-  integrity sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==
-  dependencies:
-    lru-cache "^6.0.0"
-
-semver@^7.3.6:
-  version "7.5.4"
-  resolved "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz"
-  integrity sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==
-  dependencies:
-    lru-cache "^6.0.0"
-
-semver@^7.3.8:
-  version "7.5.4"
-  resolved "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz"
-  integrity sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==
-  dependencies:
-    lru-cache "^6.0.0"
-
-semver@^7.5.4:
   version "7.5.4"
   resolved "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz"
   integrity sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==
@@ -4194,7 +4265,7 @@ slash@^3.0.0:
   resolved "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz"
   integrity sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==
 
-source-map-js@^1.0.2, "source-map-js@>=0.6.2 <2.0.0":
+"source-map-js@>=0.6.2 <2.0.0", source-map-js@^1.0.2:
   version "1.0.2"
   resolved "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz"
   integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==
@@ -4232,13 +4303,6 @@ streamx@^2.15.0:
     fast-fifo "^1.1.0"
     queue-tick "^1.0.1"
 
-string_decoder@^1.1.1:
-  version "1.3.0"
-  resolved "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz"
-  integrity sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==
-  dependencies:
-    safe-buffer "~5.2.0"
-
 string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3:
   version "4.2.3"
   resolved "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz"
@@ -4280,6 +4344,13 @@ string.prototype.trimstart@^1.0.6:
     define-properties "^1.1.4"
     es-abstract "^1.20.4"
 
+string_decoder@^1.1.1:
+  version "1.3.0"
+  resolved "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz"
+  integrity sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==
+  dependencies:
+    safe-buffer "~5.2.0"
+
 stringify-object@^3.3.0:
   version "3.3.0"
   resolved "https://registry.npmjs.org/stringify-object/-/stringify-object-3.3.0.tgz"
@@ -4402,7 +4473,7 @@ tempy@^0.6.0:
     type-fest "^0.16.0"
     unique-string "^2.0.0"
 
-terser@^5.0.0, terser@^5.4.0:
+terser@^5.0.0:
   version "5.16.1"
   resolved "https://registry.npmjs.org/terser/-/terser-5.16.1.tgz"
   integrity sha512-xvQfyfA1ayT0qdK47zskQgRZeWLoOQ8JQ6mIgRGVNwZKdQMU+5FkCBjmv4QjcrTzyZquRw2FVtlJSRUmMKQslw==
@@ -4485,7 +4556,7 @@ type-fest@^0.20.2:
   resolved "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz"
   integrity sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==
 
-typescript@*, typescript@^5.2.2, typescript@>=4.2.0, typescript@>=4.4.4:
+typescript@^5.2.2:
   version "5.2.2"
   resolved "https://registry.npmjs.org/typescript/-/typescript-5.2.2.tgz"
   integrity sha512-mI4WrpHsbCIcwT9cF4FZvr80QUeKvsUsUvKDoR+X/7XHQH98xYD8YHZg7ANtz2GtZt/CBq2QJ0thkGJMHfqc1w==
@@ -4591,7 +4662,7 @@ vite-plugin-pwa@^0.16.5:
     workbox-build "^7.0.0"
     workbox-window "^7.0.0"
 
-"vite@^3.1.0 || ^4.0.0", vite@^4.0.0, vite@^4.4.9:
+vite@^4.4.9:
   version "4.4.9"
   resolved "https://registry.npmjs.org/vite/-/vite-4.4.9.tgz"
   integrity sha512-2mbUn2LlUmNASWwSCNSJ/EG2HuSRTnVNaydp6vMCm5VIqJsjMfbIWtbH2kDuwUVW5mMUKKZvGPX/rqeqVvv1XA==
@@ -4653,7 +4724,7 @@ vue-tsc@^1.8.11:
     "@vue/typescript" "1.8.11"
     semver "^7.3.8"
 
-"vue@^2.6.14 || ^3.3.0", vue@^3.0.0, "vue@^3.0.0-0 || ^2.6.0", vue@^3.2.0, vue@^3.2.25, vue@^3.3.4, vue@3.3.4:
+vue@^3.3.4:
   version "3.3.4"
   resolved "https://registry.npmjs.org/vue/-/vue-3.3.4.tgz"
   integrity sha512-VTyEYn3yvIeY1Py0WaYGZsXnz3y5UnGi62GjVEqvEGPl6nxbOrCXbVOTQWBEJUqAyTUk2uJ5JLVnYJ6ZzGbrSw==
@@ -4873,7 +4944,7 @@ workbox-sw@7.0.0:
   resolved "https://registry.npmjs.org/workbox-sw/-/workbox-sw-7.0.0.tgz"
   integrity sha512-SWfEouQfjRiZ7GNABzHUKUyj8pCoe+RwjfOIajcx6J5mtgKkN+t8UToHnpaJL5UVVOf5YhJh+OHhbVNIHe+LVA==
 
-workbox-window@^7.0.0, workbox-window@7.0.0:
+workbox-window@7.0.0, workbox-window@^7.0.0:
   version "7.0.0"
   resolved "https://registry.npmjs.org/workbox-window/-/workbox-window-7.0.0.tgz"
   integrity sha512-j7P/bsAWE/a7sxqTzXo3P2ALb1reTfZdvVp6OJ/uLr/C2kZAMvjeWGm8V4htQhor7DOvYg0sSbFN2+flT5U0qA==