Przekierowanie do dziennika historii scenerii

src/components/JournalView/JournalDispatchers.vue

@@ -100,7 +100,7 @@ import JournalOptions from '@/components/JournalView/JournalOptions.vue';
 
 import { URLs } from '@/scripts/utils/apiURLs';
 
-const PROD_MODE = process.env.VUE_APP_JORUNAL_DISPATCHERS_DEV != "1" || process.env.NODE_ENV === 'production';
+const PROD_MODE = process.env.VUE_APP_JORUNAL_DISPATCHERS_DEV != '1' || process.env.NODE_ENV === 'production';
 
 const DISPATCHERS_API_URL = (PROD_MODE ? `${URLs.stacjownikAPI}/api` : 'http://localhost:3001/api') + '/getDispatchers';
 
@@ -132,6 +132,13 @@ export default defineComponent({
   components: { SearchBox, ActionButton, JournalOptions },
   mixins: [dateMixin],
 
+  props: {
+    searchedSceneryName: {
+      type: String,
+      required: false,
+    },
+  },
+
   data: () => ({
     icons: {
       loading: require('@/assets/icon-loading.svg'),
@@ -153,7 +160,10 @@ export default defineComponent({
 
     const sorterActive = ref({ id: 'timestampFrom', dir: -1 });
     const journalFilterActive = ref({});
-    const searchersValues = reactive([{ id: 'search-dispatcher', value: '' }, { id: 'search-station', value: '' }])
+    const searchersValues = reactive([
+      { id: 'search-dispatcher', value: '' },
+      { id: 'search-station', value: '' },
+    ]);
 
     const countFromIndex = ref(0);
     const countLimit = 15;
@@ -197,10 +207,15 @@ export default defineComponent({
 
   activated() {
     window.addEventListener('scroll', this.handleScroll);
+
+    if (this.searchedSceneryName) {
+      this.searchersValues[1].value = this.searchedSceneryName;
+      this.search();
+    }
   },
 
   deactivated() {
-    window.removeEventListener('scroll', this.handleScroll);    
+    window.removeEventListener('scroll', this.handleScroll);
   },
 
   methods: {
@@ -248,7 +263,7 @@ export default defineComponent({
 
     search() {
       this.fetchHistoryData({
-        searchers: this.searchersValues
+        searchers: this.searchersValues,
       });
 
       this.scrollNoMoreData = false;
@@ -287,7 +302,7 @@ export default defineComponent({
 
       const dispatcher = props.searchers?.find((s) => s.id == 'search-dispatcher')?.value.trim();
       const station = props.searchers?.find((s) => s.id == 'search-station')?.value.trim();
-      
+
       if (dispatcher) queries.push(`dispatcherName=${dispatcher}`);
       if (station) queries.push(`stationName=${station}`);
 
@@ -301,7 +316,9 @@ export default defineComponent({
       this.currentQuery = queries.join('&');
 
       try {
-        const responseData: APIResponse | null = await (await axios.get(`${DISPATCHERS_API_URL}?${this.currentQuery}`)).data;
+        const responseData: APIResponse | null = await (
+          await axios.get(`${DISPATCHERS_API_URL}?${this.currentQuery}`)
+        ).data;
 
         if (!responseData) {
           this.historyDataStatus.status = DataStatus.Error;

src/components/TrainsView/TrainInfo.vue

@@ -43,13 +43,18 @@
         </div>
 
         <div class="timetable_progress" style="margin-top: 0.5em" v-if="train.timetableData">
+          <!-- <span> </span> -->
           <span class="timetable_progress-bar">
+            <!-- {{ confirmedPercentage(train.timetableData.followingStops) }}%&nbsp; -->
             <span class="bar-bg"></span>
-            <span class="bar-fg" :style="{ width: `${Math.floor(confirmedPercentage(train.timetableData.followingStops))}%` }"></span>
+            <span
+              class="bar-fg"
+              :style="{ width: `${Math.floor(confirmedPercentage(train.timetableData.followingStops))}%` }"
+            ></span>
           </span>
 
           <span>
-            &nbsp;{{ currentDistance(train.timetableData.followingStops) }} km /
+            &nbsp; {{ currentDistance(train.timetableData.followingStops) }} km /
             <span class="text--primary"> {{ train.timetableData.routeDistance }} km </span>
             |
             <span v-html="currentDelay(train.timetableData.followingStops)"></span>
@@ -123,24 +128,6 @@ export default defineComponent({
       offline: require('@/assets/icon-offline.svg'),
     },
   }),
-
-  methods: {
-    generateProgressBar(train: Train) {
-      if (!train.timetableData) return '';
-
-      const percentage = Math.floor(Number(this.confirmedPercentage(train.timetableData.followingStops)));
-
-      let progressBarString = `<span style="color: white"> ${percentage}% </span> `;
-
-      for (let i = 0; i < 5; i++) {
-        progressBarString += `<span style="color: ${
-          i < Math.round(percentage / 20) ? 'springgreen' : 'gray'
-        }">▉</span>`;
-      }
-
-      return progressBarString;
-    },
-  },
 });
 </script>
 

src/components/TrainsView/TrainSchedule.vue

@@ -30,7 +30,7 @@ p
             alt="car"
           />
 
-          <div>{{ car.replace(/_/g, ' ').split(":")[0] }}</div>
+          <div>{{ car.replace(/_/g, ' ').split(':')[0] }}</div>
         </li>
       </ul>
     </div>
@@ -203,6 +203,7 @@ ul.stock-list {
     color: #aaa;
     font-size: 0.9em;
   }
+
 }
 
 .schedule-wrapper {

src/views/JournalView.vue

@@ -21,7 +21,7 @@
     <div class="journal-section">
       <keep-alive>
         <JournalTimetables v-if="journalTypeChosen == 'timetables'" />
-        <JournalDispatchers v-else-if="journalTypeChosen == 'dispatchers'" />
+        <JournalDispatchers v-else-if="journalTypeChosen == 'dispatchers'" :searchedSceneryName="$route.query.sceneryName?.toString()" />
       </keep-alive>
     </div>
   </section>
@@ -46,6 +46,13 @@ export default defineComponent({
       this.journalTypeChosen = type;
     },
   },
+
+  activated() {
+    const query = this.$route.query;
+    console.log(this.$route.query);
+    
+    if(query.sceneryName) this.journalTypeChosen = 'dispatchers';
+  }
 });
 </script>
 

src/views/SceneryView.vue

@@ -18,13 +18,18 @@
         <img :src="icons.back" alt="Back to scenery" />
       </button>
 
-      <!-- <button
-        v-if="!timetableOnly && currentRegion.id == 'eu'"
+      <button
+        v-if="!timetableOnly && currentRegion.id == 'eu' && stationInfo"
         class="history-btn btn btn--image"
-        @click="navigateTo('/journal')"
+        @click="
+          navigateTo('/journal', {
+            view: 'dispatchers',
+            sceneryName: stationInfo?.name,
+          })
+        "
       >
         <img :src="viewMode == 'history' ? icons.user : icons.history" alt="icon" />
-      </button> -->
+      </button>
 
       <SceneryHeader :station="stationInfo" />
 
@@ -106,8 +111,11 @@ export default defineComponent({
       this.viewMode = mode;
     },
 
-    navigateTo(path: string) {
-      this.$router.push(path);
+    navigateTo(path: string, query?: {}) {
+      this.$router.push({
+        path,
+        query,
+      });
     },
   },