format & lint

src/components/JournalView/JournalTimetables/JournalTimetablesList.vue

@@ -1,82 +1,83 @@
-<template>
-  <div>
-    <transition name="status-anim" mode="out-in">
-      <div :key="dataStatus">
-        <div class="journal_warning" v-if="store.isOffline">
-          {{ $t('app.offline') }}
-        </div>
-
-        <Loading v-else-if="dataStatus == DataStatus.Loading" />
-
-        <div v-else-if="dataStatus == DataStatus.Error" class="journal_warning error">
-          {{ $t('app.error') }}
-        </div>
-
-        <div v-else-if="timetableHistory.length == 0" class="journal_warning">
-          {{ $t('app.no-result') }}
-        </div>
-
-        <div v-else>
-          <TimetableHistoryList :timetableHistory="timetableHistory" />
-
-          <AddDataButton
-            :list="timetableHistory"
-            :scrollDataLoaded="scrollDataLoaded"
-            :scrollNoMoreData="scrollNoMoreData"
-            @addHistoryData="addHistoryData"
-          />
-        </div>
-      </div>
-    </transition>
-
-    <div class="journal_warning" v-if="scrollNoMoreData">{{ $t('journal.no-further-data') }}</div>
-    <div class="journal_warning" v-else-if="!scrollDataLoaded">{{ $t('journal.loading-further-data') }}</div>
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent, PropType } from 'vue';
-import { DataStatus } from '../../../scripts/enums/DataStatus';
-import { TimetableHistory } from '../../../scripts/interfaces/api/TimetablesAPIData';
-import { useStore } from '../../../store/store';
-
-import Loading from '../../Global/Loading.vue';
-import ProgressBar from '../../Global/ProgressBar.vue';
-import AddDataButton from '../../Global/AddDataButton.vue';
-import TimetableHistoryList from './TimetableHistoryList.vue';
-
-export default defineComponent({
-  components: { ProgressBar, Loading, AddDataButton, TimetableHistoryList },
-
-  props: {
-    timetableHistory: {
-      type: Array as PropType<TimetableHistory[]>,
-      required: true,
-    },
-    scrollNoMoreData: {
-      type: Boolean,
-    },
-    scrollDataLoaded: {
-      type: Boolean,
-    },
-    addHistoryData: {
-      type: Function as PropType<() => void>,
-    },
-    dataStatus: {
-      type: Number as PropType<DataStatus>,
-    },
-  },
-
-  data() {
-    return {
-      DataStatus,
-      store: useStore(),
-    };
-  },
-});
-</script>
-
-<style lang="scss" scoped>
-@import '../../../styles/JournalSection.scss';
-@import '../../../styles/animations.scss';
-</style>
+<template>
+  <div>
+    <transition name="status-anim" mode="out-in">
+      <div :key="dataStatus">
+        <div class="journal_warning" v-if="store.isOffline">
+          {{ $t('app.offline') }}
+        </div>
+
+        <Loading v-else-if="dataStatus == DataStatus.Loading" />
+
+        <div v-else-if="dataStatus == DataStatus.Error" class="journal_warning error">
+          {{ $t('app.error') }}
+        </div>
+
+        <div v-else-if="timetableHistory.length == 0" class="journal_warning">
+          {{ $t('app.no-result') }}
+        </div>
+
+        <div v-else>
+          <TimetableHistoryList :timetableHistory="timetableHistory" />
+
+          <AddDataButton
+            :list="timetableHistory"
+            :scrollDataLoaded="scrollDataLoaded"
+            :scrollNoMoreData="scrollNoMoreData"
+            @addHistoryData="addHistoryData"
+          />
+        </div>
+      </div>
+    </transition>
+
+    <div class="journal_warning" v-if="scrollNoMoreData">{{ $t('journal.no-further-data') }}</div>
+    <div class="journal_warning" v-else-if="!scrollDataLoaded">
+      {{ $t('journal.loading-further-data') }}
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+import { defineComponent, PropType } from 'vue';
+import { DataStatus } from '../../../scripts/enums/DataStatus';
+import { TimetableHistory } from '../../../scripts/interfaces/api/TimetablesAPIData';
+import { useStore } from '../../../store/store';
+
+import Loading from '../../Global/Loading.vue';
+import AddDataButton from '../../Global/AddDataButton.vue';
+import TimetableHistoryList from './TimetableHistoryList.vue';
+
+export default defineComponent({
+  components: { Loading, AddDataButton, TimetableHistoryList },
+
+  props: {
+    timetableHistory: {
+      type: Array as PropType<TimetableHistory[]>,
+      required: true
+    },
+    scrollNoMoreData: {
+      type: Boolean
+    },
+    scrollDataLoaded: {
+      type: Boolean
+    },
+    addHistoryData: {
+      type: Function as PropType<() => void>
+    },
+    dataStatus: {
+      type: Number as PropType<DataStatus>
+    }
+  },
+
+  data() {
+    return {
+      DataStatus,
+      store: useStore()
+    };
+  }
+});
+</script>
+
+<style lang="scss" scoped>
+@import '../../../styles/JournalSection.scss';
+@import '../../../styles/animations.scss';
+</style>

src/components/JournalView/JournalTimetables/TimetableExtra.vue

@@ -18,7 +18,11 @@
       <span class="badge">
         <span>{{ $t('journal.stock-length') }}</span>
         <span>
-          {{ currentHistoryIndex == 0 ? timetable.stockLength : stockHistory[currentHistoryIndex].stockLength || timetable.stockLength }}m
+          {{
+            currentHistoryIndex == 0
+              ? timetable.stockLength
+              : stockHistory[currentHistoryIndex].stockLength || timetable.stockLength
+          }}m
         </span>
       </span>
 
@@ -26,7 +30,11 @@
         <span>{{ $t('journal.stock-mass') }}</span>
         <span>
           {{
-            Math.floor((currentHistoryIndex == 0 ? timetable.stockMass! : stockHistory[currentHistoryIndex].stockMass || timetable.stockMass) / 1000)
+            Math.floor(
+              (currentHistoryIndex == 0
+                ? timetable.stockMass!
+                : stockHistory[currentHistoryIndex].stockMass || timetable.stockMass) / 1000
+            )
           }}t
         </span>
       </span>
@@ -34,13 +42,26 @@
 
     <!-- Historia zmian w składzie -->
     <div class="stock-history" v-if="stockHistory.length > 1">
-      <button class="btn--action" v-for="(sh, i) in stockHistory" :data-checked="i == currentHistoryIndex" @click.stop="currentHistoryIndex = i">
+      <button
+        v-for="(sh, i) in stockHistory"
+        :key="i"
+        class="btn--action"
+        :data-checked="i == currentHistoryIndex"
+        @click.stop="currentHistoryIndex = i"
+      >
         {{ sh.updatedAt }}
       </button>
     </div>
 
     <!-- <StockList :trainStockList="currentHistoryIndex == 0 ? timetable.stockString : stockHistory[currentHistoryIndex].stockString).split(';')" /> -->
-    <StockList :trainStockList="(currentHistoryIndex == 0 ? timetable.stockString : stockHistory[currentHistoryIndex].stockString).split(';') " />
+    <StockList
+      :trainStockList="
+        (currentHistoryIndex == 0
+          ? timetable.stockString
+          : stockHistory[currentHistoryIndex].stockString
+        ).split(';')
+      "
+    />
 
     <!-- <ul class="stock-list">
       <li
@@ -58,24 +79,24 @@
 import { PropType, defineComponent } from 'vue';
 import { TimetableHistory } from '../../../scripts/interfaces/api/TimetablesAPIData';
 import imageMixin from '../../../mixins/imageMixin';
-import TrainThumbnail from '../../Global/TrainThumbnail.vue';
 import StockList from '../../Global/StockList.vue';
 
 export default defineComponent({
   mixins: [imageMixin],
+  components: { StockList },
   props: {
     showExtraInfo: {
       type: Boolean,
-      required: true,
+      required: true
     },
     timetable: {
       type: Object as PropType<TimetableHistory>,
-      required: true,
-    },
+      required: true
+    }
   },
   data() {
     return {
-      currentHistoryIndex: 0,
+      currentHistoryIndex: 0
     };
   },
   computed: {
@@ -88,22 +109,21 @@ export default defineComponent({
           return {
             updatedAt: new Date(Number(historyData[0])).toLocaleTimeString(this.$i18n.locale, {
               hour: '2-digit',
-              minute: '2-digit',
+              minute: '2-digit'
             }),
             stockString: historyData[1],
             stockMass: Number(historyData[2]) || undefined,
-            stockLength: Number(historyData[3]) || undefined,
+            stockLength: Number(historyData[3]) || undefined
           };
         });
-    },
+    }
   },
   methods: {
     onImageError(e: Event) {
       const imageEl = e.target as HTMLImageElement;
       imageEl.src = this.getImage('unknown.png');
-    },
-  },
-  components: { TrainThumbnail, StockList },
+    }
+  }
 });
 </script>
 

src/components/JournalView/JournalTimetables/TimetableGeneral.vue

@@ -45,7 +45,7 @@
         :class="{
           fulfilled: timetable.fulfilled,
           terminated: timetable.terminated && !timetable.fulfilled,
-          active: !timetable.terminated,
+          active: !timetable.terminated
         }"
       >
         {{
@@ -74,8 +74,8 @@ export default defineComponent({
   props: {
     timetable: {
       type: Object as PropType<TimetableHistory>,
-      required: true,
-    },
+      required: true
+    }
   },
 
   methods: {
@@ -83,8 +83,8 @@ export default defineComponent({
       if (timetable?.terminated) return;
 
       this.selectModalTrain(timetable.driverName + timetable.trainNo.toString(), target);
-    },
-  },
+    }
+  }
 });
 </script>
 

src/components/JournalView/JournalTimetables/TimetableHistoryList.vue

@@ -48,19 +48,19 @@ export default defineComponent({
   props: {
     timetableHistory: {
       type: Array as PropType<TimetableHistory[]>,
-      required: true,
-    },
+      required: true
+    }
   },
   computed: {
     computedTimetableHistory() {
       return this.timetableHistory.map((timetable) => ({
         timetable,
-        showExtraInfo: ref(false),
+        showExtraInfo: ref(false)
       }));
-    },
+    }
   },
   methods: {},
-  components: { TimetableGeneral, TimetableStops, TimetableStatus, TimetableExtra },
+  components: { TimetableGeneral, TimetableStops, TimetableStatus, TimetableExtra }
 });
 </script>
 

src/components/JournalView/JournalTimetables/TimetableStatus.vue

@@ -6,13 +6,19 @@
     />
 
     <span>
-      <span :style="{ color: timetable.fulfilled ? 'lightgreen' : timetable.terminated ? 'salmon' : '' }">
+      <span
+        :style="{
+          color: timetable.fulfilled ? 'lightgreen' : timetable.terminated ? 'salmon' : ''
+        }"
+      >
         {{ timetable.currentDistance + ' km' }}
       </span>
       <span> / </span>
       <span class="text--primary">{{ timetable.routeDistance }} km</span>
       |
-      <span class="text--grayed">{{ timetable.confirmedStopsCount }}/{{ timetable.allStopsCount }}</span>
+      <span class="text--grayed"
+        >{{ timetable.confirmedStopsCount }}/{{ timetable.allStopsCount }}</span
+      >
     </span>
 
     <span class="text--grayed" v-if="timetable.currentSceneryName">
@@ -46,9 +52,9 @@ export default defineComponent({
   props: {
     timetable: {
       type: Object as PropType<TimetableHistory>,
-      required: true,
-    },
-  },
+      required: true
+    }
+  }
 });
 </script>
 

src/components/JournalView/JournalTimetables/TimetableStops.vue

@@ -38,8 +38,8 @@ export default defineComponent({
 
     timetable: {
       type: Object as PropType<TimetableHistory>,
-      required: true,
-    },
+      required: true
+    }
   },
 
   computed: {
@@ -65,12 +65,18 @@ export default defineComponent({
         if (i == 0) return { stopName, html: beginDateHTML, confirmed };
         if (i == stopNames.length - 1) return { stopName, html: endDateHTML, confirmed };
 
-        const departureDateScheduled = this.stringToDate(timetable.checkpointDeparturesScheduled?.at(i));
+        const departureDateScheduled = this.stringToDate(
+          timetable.checkpointDeparturesScheduled?.at(i)
+        );
         const departureDateReal = this.stringToDate(timetable.checkpointDepartures?.at(i));
-        const arrivalDateScheduled = this.stringToDate(timetable.checkpointArrivalsScheduled?.at(i));
+        const arrivalDateScheduled = this.stringToDate(
+          timetable.checkpointArrivalsScheduled?.at(i)
+        );
         const arrivalDateReal = this.stringToDate(timetable.checkpointArrivals?.at(i));
         const arrivalHTML =
-          (arrivalDateReal && arrivalDateScheduled && arrivalDateReal?.getTime() != arrivalDateScheduled?.getTime()
+          (arrivalDateReal &&
+          arrivalDateScheduled &&
+          arrivalDateReal?.getTime() != arrivalDateScheduled?.getTime()
             ? `<s class="text--grayed">${this.parseDateToTimeString(arrivalDateScheduled)}</s> `
             : '') + this.parseDateToTimeString(arrivalDateReal || arrivalDateScheduled);
         const departureHTML =
@@ -83,8 +89,8 @@ export default defineComponent({
         if (html) html = ` (${html})`;
         return { stopName, html, confirmed };
       });
-    },
-  },
+    }
+  }
 });
 </script>