chore: added router links to timetable train statuses in scenery view

src/components/SceneryView/SceneryTimetable.vue

@@ -523,6 +523,7 @@ export default defineComponent({
 
 .info-route {
   width: 100%;
+  margin-top: 0.25em;
 }
 
 .stop-comments-icon > img {

src/components/SceneryView/ScheduledTrainStatus.vue

@@ -1,11 +1,11 @@
 <template>
   <div class="general-status">
-    <span
+    <router-link
+      :to="`/scenery?station=${computedScheduledTrain.stationNameHref}`"
       :class="computedScheduledTrain.status"
-      @click.prevent="() => {}"
       v-html="computedScheduledTrain.stopStatusIndicator"
     >
-    </span>
+    </router-link>
   </div>
 </template>
 
@@ -27,6 +27,7 @@ export default defineComponent({
       const { status, prevElement, currentElement, nextElement } = this.sceneryTimetableRow;
 
       let stopStatusIndicator = '';
+      let stationNameHref = '';
 
       switch (status) {
         case StopStatus.ARRIVING:
@@ -35,6 +36,8 @@ export default defineComponent({
               prevStationName: prevElement?.stationName ?? '',
               prevDepartureLine: prevElement?.departureRouteExt ?? ''
             });
+
+            stationNameHref = prevElement?.stationName ?? '';
           } else {
             stopStatusIndicator = this.$t('timetables.desc-beginning');
           }
@@ -48,6 +51,9 @@ export default defineComponent({
                 nextArrivalLine: nextElement?.arrivalRouteExt
               })
             : this.$t(`timetables.desc-end`);
+
+          stationNameHref = nextElement?.stationName ?? '';
+
           break;
 
         case StopStatus.DEPARTED:
@@ -55,11 +61,15 @@ export default defineComponent({
             stopStatusIndicator = this.$t('timetables.desc-departed-ends', {
               nextStationName: currentElement.stationName
             });
+
+            stationNameHref = nextElement?.stationName ?? '';
           } else {
             stopStatusIndicator = this.$t('timetables.desc-departed', {
               nextStationName: nextElement?.stationName ?? currentElement.stationName,
               nextArrivalLine: nextElement?.arrivalRouteExt
             });
+
+            stationNameHref = nextElement?.stationName ?? '';
           }
 
           break;
@@ -69,6 +79,8 @@ export default defineComponent({
             nextStationName: nextElement?.stationName,
             nextArrivalLine: nextElement?.arrivalRouteExt
           });
+
+          stationNameHref = nextElement?.stationName ?? '';
           break;
 
         case StopStatus.TERMINATED:
@@ -80,9 +92,18 @@ export default defineComponent({
       }
       return {
         ...this.sceneryTimetableRow,
+        stationNameHref,
         stopStatusIndicator
       };
     }
+  },
+
+  methods: {
+    navigateToScenery(sceneryName?: string) {
+      if (!sceneryName) return;
+
+      this.$router.push(`/scenery?station=${sceneryName}`);
+    }
   }
 });
 </script>
@@ -91,11 +112,11 @@ export default defineComponent({
 .general-status {
   margin-top: 0.5em;
 
-  span.arriving {
+  & > .arriving {
     color: #ccc;
   }
 
-  span.departed {
+  & > .departed {
     color: lime;
 
     &-away {
@@ -103,15 +124,15 @@ export default defineComponent({
     }
   }
 
-  span.stopped {
+  & > .stopped {
     color: #ffa600;
   }
 
-  span.online {
+  & > .online {
     color: gold;
   }
 
-  span.terminated {
+  & > .terminated {
     color: salmon;
   }
 }

src/locales/en.json

@@ -592,13 +592,13 @@
     "from": "Arrives from",
     "to": "Departs to",
     "desc-beginning": "The train begins here",
-    "desc-arriving": "<i>Arrives from: <b>{prevStationName} ({prevDepartureLine})</b></i>",
+    "desc-arriving": "Arrives from: <b><u>{prevStationName} ({prevDepartureLine})</u></b>",
-    "desc-online": "On scenery / <i>direction: <b>{nextStationName} ({nextArrivalLine})</b></i>",
+    "desc-online": "On scenery / direction: <b><u>{nextStationName} ({nextArrivalLine})</u></b>",
-    "desc-stopped": "On scenery - stopped / <i>direction: <b>{nextStationName} ({nextArrivalLine})</b></i>",
+    "desc-stopped": "On scenery - stopped / direction: <b><u>{nextStationName} ({nextArrivalLine})</u></b>",
-    "desc-next-arrival": "On scenery / <i>direction: <b>{nextStationName} ({nextArrivalLine})</b></i>",
+    "desc-next-arrival": "On scenery / direction: <b><u>{nextStationName} ({nextArrivalLine})</u></b>",
-    "desc-departed": "On scenery / <i>departed to: <b>{nextStationName} ({nextArrivalLine})</b></i>",
+    "desc-departed": "On scenery / departed to: <b><u>{nextStationName} ({nextArrivalLine})</u></b>",
-    "desc-departed-ends": "On scenery / <i>departed to: <b>{nextStationName}</b></i>",
+    "desc-departed-ends": "On scenery / departed to: <b><u>{nextStationName}</u></b>",
-    "desc-departed-away": "<i>Departed to: <b>{nextStationName} ({nextArrivalLine})</b></i>",
+    "desc-departed-away": "Departed to: <b><u>{nextStationName} ({nextArrivalLine})</u></b>",
     "desc-end": "The train terminates here",
     "desc-terminated": "The train has been terminated"
   },

src/locales/pl.json

@@ -578,13 +578,13 @@
     "from": "Przyjedzie z",
     "to": "Odjeżdża do",
     "desc-beginning": "Pociąg rozpoczyna bieg",
-    "desc-arriving": "<i>Przyjedzie z: <b>{prevStationName} ({prevDepartureLine})</b></i>",
+    "desc-arriving": "Przyjedzie z: <b><u>{prevStationName} ({prevDepartureLine})</u></b>",
-    "desc-online": "Na scenerii / <i>kierunek: <b>{nextStationName} ({nextArrivalLine})</b></i>",
+    "desc-online": "Na scenerii / kierunek: <b><u>{nextStationName} ({nextArrivalLine})</u></b>",
-    "desc-stopped": "Na scenerii - postój / <i>kierunek: <b>{nextStationName} ({nextArrivalLine})</b></i>",
+    "desc-stopped": "Na scenerii - postój / kierunek: <b><u>{nextStationName} ({nextArrivalLine})</u></b>",
-    "desc-next-arrival": "Na scenerii / <i>kierunek: <b>{nextStationName} ({nextArrivalLine})</b></i>",
+    "desc-next-arrival": "Na scenerii / kierunek: <b><u>{nextStationName} ({nextArrivalLine})</u></b>",
-    "desc-departed": "Na scenerii / <i>odprawiony do: <b>{nextStationName} ({nextArrivalLine})</b></i>",
+    "desc-departed": "Na scenerii / odprawiony do: <b><u>{nextStationName} ({nextArrivalLine})</u></b>",
-    "desc-departed-ends": "Na scenerii / <i>odprawiony do: <b>{nextStationName}</b></i>",
+    "desc-departed-ends": "Na scenerii / odprawiony do: <b><u>{nextStationName}</u></b>",
-    "desc-departed-away": "<i>Odprawiony do: <b>{nextStationName} ({nextArrivalLine})</b></i>",
+    "desc-departed-away": "Odprawiony do: <b><u>{nextStationName} ({nextArrivalLine})</u></b>",
     "desc-end": "Pociąg kończy bieg",
     "desc-terminated": "Pociąg zakończył bieg"
   },