refactor: journal dispatcher filters

src/components/JournalView/JournalDispatchers/JournalDispatchersList.vue

@@ -1,43 +1,45 @@
 <template>
-  <div class="journal_warning" v-if="store.isOffline">
-    {{ $t('app.offline') }}
-  </div>
+  <div>
+    <div class="journal_warning" v-if="store.isOffline">
+      {{ $t('app.offline') }}
+    </div>
 
-  <Loading v-else-if="dataStatus == Status.Data.Loading" />
+    <Loading v-else-if="dataStatus == Status.Data.Loading" />
 
-  <div v-else-if="dataStatus == Status.Data.Error" class="journal_warning error">
-    {{ $t('app.error') }}
-  </div>
+    <div v-else-if="dataStatus == Status.Data.Error" class="journal_warning error">
+      {{ $t('app.error') }}
+    </div>
 
-  <div class="journal_warning" v-else-if="dispatcherHistory.length == 0">
-    {{ $t('app.no-result') }}
-  </div>
+    <div class="journal_warning" v-else-if="dispatcherHistory.length == 0">
+      {{ $t('app.no-result') }}
+    </div>
 
-  <div v-else>
-    <transition-group name="list-anim" class="journal-list" tag="ul">
-      <JournalDispatcherEntry
-        v-for="entry in dispatcherHistory"
-        :key="entry.id"
-        :entry="entry"
-        :onToggleShowExtraInfo="toggleExtraInfo"
-        :showExtraInfo="extraInfoIndexes.includes(entry.id)"
+    <div v-else>
+      <transition-group name="list-anim" class="journal-list" tag="ul">
+        <JournalDispatcherEntry
+          v-for="entry in dispatcherHistory"
+          :key="entry.id"
+          :entry="entry"
+          :onToggleShowExtraInfo="toggleExtraInfo"
+          :showExtraInfo="extraInfoIndexes.includes(entry.id)"
+        />
+      </transition-group>
+
+      <AddDataButton
+        :list="dispatcherHistory"
+        :scrollDataLoaded="scrollDataLoaded"
+        :scrollNoMoreData="scrollNoMoreData"
+        @addHistoryData="addHistoryData"
       />
-    </transition-group>
+    </div>
 
-    <AddDataButton
-      :list="dispatcherHistory"
-      :scrollDataLoaded="scrollDataLoaded"
-      :scrollNoMoreData="scrollNoMoreData"
-      @addHistoryData="addHistoryData"
-    />
-  </div>
+    <div class="journal_warning" v-if="scrollNoMoreData">
+      {{ $t('journal.no-further-data') }}
+    </div>
 
-  <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 class="journal_warning" v-else-if="!scrollDataLoaded">
+      {{ $t('journal.loading-further-data') }}
+    </div>
   </div>
 </template>
 
@@ -81,6 +83,15 @@ export default defineComponent({
     };
   },
 
+  watch: {
+    '$route.query': {
+      deep: true,
+      handler() {
+        this.extraInfoIndexes.length = 0;
+      }
+    }
+  },
+
   methods: {
     toggleExtraInfo(id: number) {
       const existingIdx = this.extraInfoIndexes.indexOf(id);

src/components/JournalView/JournalTimetables/JournalTimetablesList.vue

@@ -94,6 +94,7 @@ export default defineComponent({
       }
     }
   },
+  
   methods: {
     toggleExtraInfo(id: number) {
       const existingIdx = this.extraInfoIndexes.indexOf(id);

src/components/JournalView/typings.ts

@@ -19,7 +19,7 @@ export namespace Journal {
   };
 
   export type TimetableSorterKey = 'timetableId' | 'beginDate' | 'distance' | 'total-stops';
-  export type DispatcherSorterKey = 'timestampFrom' | 'duration';
+  export type DispatcherSorterKey = 'timestampFrom' | 'currentDuration';
 
   export interface DispatcherSorter {
     id: DispatcherSorterKey;