refactor(journal): removed seperate driver & dispatcher stats dropdowns; added button leading to player profile view

src/views/JournalDispatchers.vue

@@ -14,7 +14,7 @@
           optionsType="dispatchers"
         />
 
-        <JournalStats :statsButtons="statsButtons" />
+        <JournalStats :chosen-player-id="chosenPlayerId" />
       </div>
 
       <div class="journal_refreshed-date">
@@ -50,15 +50,6 @@ import JournalHeader from '../components/JournalView/JournalHeader.vue';
 import JournalStats from '../components/JournalView/JournalStats.vue';
 import { useApiStore } from '../store/apiStore';
 
-const statsButtons: Journal.StatsButton[] = [
-  {
-    tab: Journal.StatsTab.DISPATCHER_STATS,
-    localeKey: 'journal.dispatcher-stats.button',
-    iconName: 'user',
-    disabled: true
-  }
-];
-
 interface DispatchersQueryParams {
   dispatcherName?: string;
   stationName?: string;
@@ -105,18 +96,15 @@ export default defineComponent({
   },
 
   data: () => ({
-    statsButtons,
-
     dataRefreshedAt: null as Date | null,
     currentQueryParams: {} as DispatchersQueryParams,
 
     scrollDataLoaded: true,
     scrollNoMoreData: false,
 
-    showReturnButton: false,
-    statsCardOpen: false,
-    currentOptionsActive: false,
+    chosenPlayerId: -1,
 
+    currentOptionsActive: false,
     dataStatus: Status.Data.Loading,
 
     historyList: [] as API.DispatcherHistory.Response
@@ -158,15 +146,6 @@ export default defineComponent({
           queryParams[k as keyof DispatchersQueryParams] !=
           defaultQueryParams[k as keyof DispatchersQueryParams]
       );
-    },
-
-    'mainStore.dispatcherStatsData'(stats) {
-      this.statsButtons.find((sb) => sb.tab == Journal.StatsTab.DISPATCHER_STATS)!.disabled =
-        stats === undefined;
-    },
-
-    async 'mainStore.dispatcherStatsName'() {
-      this.fetchDispatcherStats();
     }
   },
 
@@ -215,29 +194,6 @@ export default defineComponent({
       this.setOptions(query as any);
     },
 
-    async fetchDispatcherStats() {
-      if (!this.mainStore.dispatcherStatsName) {
-        this.mainStore.dispatcherStatsData = undefined;
-        return;
-      }
-
-      try {
-        const statsData: API.DispatcherStats.Response = await (
-          await this.apiStore.client!.get('api/getDispatcherStats', {
-            params: {
-              name: this.mainStore.dispatcherStatsName
-            }
-          })
-        ).data;
-
-        this.mainStore.dispatcherStatsData = statsData;
-      } catch (error) {
-        this.mainStore.dispatcherStatsData = undefined;
-
-        console.error('Ups! Wystąpił błąd przy próbie pobrania statystyk dyżurnego! :/');
-      }
-    },
-
     setOptions(options: { [key: string]: string }) {
       this.searchersValues['search-date-from'] = options['search-date-from'] ?? '';
       this.searchersValues['search-date-to'] = options['search-date-to'] ?? '';
@@ -320,24 +276,24 @@ export default defineComponent({
 
         if (!responseData) {
           this.dataStatus = Status.Data.Error;
+          this.chosenPlayerId = -1;
+
           return;
         }
 
-        if (!responseData) return;
-
         // Response data exists
         this.historyList = responseData;
 
-        // Stats display
-        this.mainStore.dispatcherStatsName =
-          this.historyList.length > 0 && this.searchersValues['search-dispatcher'].trim()
-            ? this.historyList[0].dispatcherName
-            : '';
+        this.chosenPlayerId =
+          this.historyList.length > 0 && this.searchersValues['search-dispatcher'].trim() != ''
+            ? this.historyList[0].dispatcherId
+            : -1;
 
         this.dataRefreshedAt = new Date();
         this.dataStatus = Status.Data.Loaded;
       } catch (error) {
         this.dataStatus = Status.Data.Error;
+        this.chosenPlayerId = -1;
       }
 
       this.scrollNoMoreData = false;

src/views/JournalTimetables.vue

@@ -14,7 +14,7 @@
           optionsType="timetables"
         />
 
-        <JournalStats :statsButtons="statsButtons" />
+        <JournalStats :chosen-player-id="chosenPlayerId" />
       </div>
 
       <div class="journal_refreshed-date">
@@ -170,35 +170,19 @@ export default defineComponent({
     mainStore: useMainStore(),
     apiStore: useApiStore(),
 
-    statsButtons: [
-      {
-        tab: Journal.StatsTab.DAILY_STATS,
-        localeKey: 'journal.daily-stats.button',
-        iconName: 'stats',
-        disabled: false
-      },
-      {
-        tab: Journal.StatsTab.DRIVER_STATS,
-        localeKey: 'journal.driver-stats.button',
-        iconName: 'train',
-        disabled: true
-      }
-    ],
-
     currentQueryParams: {} as TimetablesQueryParams,
     dataRefreshedAt: null as Date | null,
 
     scrollDataLoaded: true,
     scrollNoMoreData: false,
 
-    showReturnButton: false,
-    statsCardOpen: false,
+    chosenPlayerId: -1,
+
     currentOptionsActive: false,
 
     timetableHistory: [] as API.TimetableHistory.Response,
 
-    dataStatus: Status.Data.Loading,
-    dataErrorMessage: ''
+    dataStatus: Status.Data.Loading
   }),
 
   setup() {
@@ -248,15 +232,6 @@ export default defineComponent({
   watch: {
     currentQueryParams(q: TimetablesQueryParams) {
       this.currentOptionsActive = Object.values(q).some((v) => v !== undefined);
-    },
-
-    'mainStore.driverStatsData'(driverStats) {
-      this.statsButtons.find((sb) => sb.tab == Journal.StatsTab.DRIVER_STATS)!.disabled =
-        driverStats === undefined;
-    },
-
-    async 'mainStore.driverStatsName'() {
-      this.fetchDriverStats();
     }
   },
 
@@ -287,31 +262,6 @@ export default defineComponent({
       this.setOptions(query as any);
     },
 
-    async fetchDriverStats() {
-      if (!this.mainStore.driverStatsName) {
-        this.mainStore.driverStatsData = undefined;
-        this.mainStore.driverStatsStatus = Status.Data.Initialized;
-        return;
-      }
-
-      try {
-        this.mainStore.driverStatsStatus = Status.Data.Loading;
-
-        const statsData: API.DriverStats.Response = await (
-          await this.apiStore.client!.get(
-            `api/getDriverInfo?name=${this.mainStore.driverStatsName}`
-          )
-        ).data;
-
-        this.mainStore.driverStatsData = statsData;
-        this.mainStore.driverStatsStatus = Status.Data.Loaded;
-      } catch (error) {
-        this.mainStore.driverStatsData = undefined;
-        this.mainStore.driverStatsStatus = Status.Data.Error;
-        console.error('Ups! Wystąpił błąd przy próbie pobrania statystyk maszynisty! :/');
-      }
-    },
-
     setOptions(options: { [key: string]: string }) {
       Object.keys(this.searchersValues).forEach((v) => {
         this.searchersValues[v as Journal.TimetableSearchKey] = options[v] ?? '';
@@ -464,26 +414,23 @@ export default defineComponent({
 
         if (!responseData) {
           this.dataStatus = Status.Data.Error;
-          this.dataErrorMessage = 'Brak danych!';
+          this.chosenPlayerId = -1;
           return;
         }
 
-        if (!responseData) return;
-
         // Response data exists
         this.timetableHistory = responseData;
 
-        // Stats display
-        this.mainStore.driverStatsName =
-          this.timetableHistory.length > 0 && this.searchersValues['search-driver'].trim()
-            ? this.timetableHistory[0].driverName
-            : '';
+        this.chosenPlayerId =
+          this.timetableHistory.length > 0 && this.searchersValues['search-driver'].trim() != ''
+            ? this.timetableHistory[0].driverId
+            : -1;
 
         this.dataStatus = Status.Data.Loaded;
         this.dataRefreshedAt = new Date();
       } catch (error) {
         this.dataStatus = Status.Data.Error;
-        this.dataErrorMessage = 'Ups! Coś poszło nie tak!';
+        this.chosenPlayerId = -1;
       }
 
       this.scrollNoMoreData = false;