diff --git a/src/App.vue b/src/App.vue
index d0aca88..bb7649e 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -61,13 +61,6 @@ export default class App extends Vue {
private VERSION = "1.3.4";
- get dataStatusClass() {
- if (this.data.dataConnectionStatus == 0) return "loading";
- if (this.data.dataConnectionStatus == 1) return "error";
-
- return "";
- }
-
mounted() {
this.synchronizeData();
}
diff --git a/src/components/StationsView/StationTable.vue b/src/components/StationsView/StationTable.vue
index d204fda..22fcfed 100644
--- a/src/components/StationsView/StationTable.vue
+++ b/src/components/StationsView/StationTable.vue
@@ -33,7 +33,7 @@
class="station"
v-for="(station, i) in stations"
:key="i + station.stationHash"
- @click="setScenery(station.stationHash)"
+ @click="() => setScenery(station.stationName)"
>
|
-
+ |
{{ station.currentUsers }}
/
@@ -139,11 +139,11 @@
|
-
+ |
{{ station.spawns.length }}
|
-
+ |
{{station.scheduledTrains.length}}
/
station.stationHash === sceneryHash
+ (station) => station.stationName === name
);
if (!station) return;
if (!station.online) {
- location.href = station.stationURL;
+ window.location.href = station.stationURL;
return;
}
- this.$router.push({ name: "SceneryView", query: { hash: sceneryHash } });
+ this.$router.push({
+ name: "SceneryView",
+ query: { hash: station.stationHash },
+ });
}
}
@@ -263,13 +266,15 @@ table {
white-space: nowrap;
border-collapse: collapse;
+ min-width: 1000px;
+
thead th {
position: sticky;
top: 0;
min-width: 85px;
- padding: 0.3rem;
+ padding: 0.5em;
background-color: $primaryCol;
cursor: pointer;
@@ -359,6 +364,14 @@ td.station {
padding: 0.5em;
}
}
+
+ &_users,
+ &_spawns,
+ &_schedules {
+ &.inactive {
+ opacity: 0.2;
+ }
+ }
}
.separator {
diff --git a/src/views/StationsView.vue b/src/views/StationsView.vue
index 3b4ad75..3e6f529 100644
--- a/src/views/StationsView.vue
+++ b/src/views/StationsView.vue
@@ -16,13 +16,21 @@
-
+
-
+
@@ -115,6 +123,20 @@ export default class StationsView extends Vue {
@Getter("getStationList") stationList!: Station[];
@Getter("getAllData") data;
+ get dataStatusClass() {
+ if (this.data.dataConnectionStatus == 0) return "loading";
+ if (this.data.dataConnectionStatus == 1) return "error";
+
+ return "success";
+ }
+
+ get timetableDataStatusClass() {
+ if (this.data.timetableDataStatus == 0) return "loading";
+ if (this.data.timetableDataStatus == 1) return "error";
+
+ return "success";
+ }
+
mounted() {
const storage = window.localStorage;
@@ -368,7 +390,7 @@ export default class StationsView extends Vue {
display: flex;
align-items: flex-end;
- & > span {
+ > span {
display: flex;
justify-content: center;
align-items: center;
@@ -378,9 +400,21 @@ export default class StationsView extends Vue {
margin-left: 0.5em;
- background-color: #e68e00;
+ // background-color: #e68e00;
border-radius: 0.5em 0.5em 0 0;
+ &.loading {
+ background-color: $accentCol;
+ }
+
+ &.error {
+ background-color: $errorCol;
+ }
+
+ &.success {
+ background-color: $secondaryCol;
+ }
+
& > img {
width: 0.9em;
animation: blinkAnim 2s ease-in-out infinite forwards;
|