From a5d7bfd037a58e3a18654ea238ee295856cbf41f Mon Sep 17 00:00:00 2001 From: Spythere Date: Tue, 10 Mar 2026 23:35:00 +0100 Subject: [PATCH] refactor: scenery view code organization in separate components with minor fixes --- .../SceneryView/SceneryTimetable.vue | 519 +----------------- .../SceneryTimetableHeader.vue | 114 ++++ .../SceneryTimetable/SceneryTimetableList.vue | 439 +++++++++++++++ .../ScheduledTrainStatus.vue | 4 +- src/components/SceneryView/utils.ts | 2 +- src/composables/time.ts | 7 + src/styles/_animations.scss | 2 +- 7 files changed, 582 insertions(+), 505 deletions(-) create mode 100644 src/components/SceneryView/SceneryTimetable/SceneryTimetableHeader.vue create mode 100644 src/components/SceneryView/SceneryTimetable/SceneryTimetableList.vue rename src/components/SceneryView/{ => SceneryTimetable}/ScheduledTrainStatus.vue (97%) diff --git a/src/components/SceneryView/SceneryTimetable.vue b/src/components/SceneryView/SceneryTimetable.vue index 5e7833d..adea654 100644 --- a/src/components/SceneryView/SceneryTimetable.vue +++ b/src/components/SceneryView/SceneryTimetable.vue @@ -1,247 +1,16 @@ @@ -249,21 +18,20 @@ import { computed, defineComponent, PropType, ref } from 'vue'; import { useRoute } from 'vue-router'; -import Loading from '../Global/Loading.vue'; +import SceneryTimetableHeader from './SceneryTimetable/SceneryTimetableHeader.vue'; + import dateMixin from '../../mixins/dateMixin'; import routerMixin from '../../mixins/routerMixin'; import trainCategoryMixin from '../../mixins/trainCategoryMixin'; import { useMainStore } from '../../store/mainStore'; import { useApiStore } from '../../store/apiStore'; -import ScheduledTrainStatus from './ScheduledTrainStatus.vue'; -import { SceneryTimetableRow } from './typings'; -import { ActiveScenery, Station, TooltipTrainInfo, Train } from '../../typings/common'; -import { getTrainStopStatus, stopStatusPriority } from './utils'; +import { ActiveScenery, Station } from '../../typings/common'; +import SceneryTimetableList from './SceneryTimetable/SceneryTimetableList.vue'; export default defineComponent({ name: 'SceneryTimetable', - components: { Loading, ScheduledTrainStatus }, + components: { SceneryTimetableHeader, SceneryTimetableList }, mixins: [dateMixin, routerMixin, trainCategoryMixin], @@ -313,69 +81,6 @@ export default defineComponent({ }; }, - computed: { - tabliceZbiorczeHref() { - let url = `https://tablice-td2.web.app/?station=${this.station!.name}`; - if (this.chosenCheckpoint) url += `&checkpoint=${this.chosenCheckpoint}`; - - return url; - }, - - pragotronHref() { - let url = `https://pragotron-td2.web.app/board?name=${this.station!.name}®ion=${this.mainStore.region.id}`; - if (this.chosenCheckpoint) url += `&checkpoint=${this.chosenCheckpoint}`; - - return url; - }, - - generatorHref() { - return `https://generator-td2.web.app/?sceneryId=${this.onlineScenery!.name}|${this.onlineScenery!.region}`; - }, - - sceneryTimetables(): SceneryTimetableRow[] { - if (!this.onlineScenery) return []; - - const sceneryName = this.$route.query['station']?.toString().replace(/_/g, ' ') ?? ''; - - return this.onlineScenery.scheduledTrains - .filter( - (ct) => - // ct.timetablePathElement.stationName == sceneryName && - ct.train.region == this.mainStore.region.id && - this.chosenCheckpoint && - ct.checkpointStop.stopNameRAW.toLowerCase() == this.chosenCheckpoint.toLowerCase() - ) - .map((ct) => { - const trainStopStatus = getTrainStopStatus( - ct.checkpointStop, - ct.train.currentStationName, - sceneryName - ); - - return { - checkpointStop: ct.checkpointStop, - train: ct.train, - prevElement: ct.previousSceneryElement, - nextElement: ct.nextSceneryElement, - currentElement: ct.timetablePathElement, - status: trainStopStatus - }; - }) - .sort((a, b) => { - if (stopStatusPriority.indexOf(a.status) - stopStatusPriority.indexOf(b.status) < 0) - return -1; - - if (stopStatusPriority.indexOf(a.status) - stopStatusPriority.indexOf(b.status) > 0) - return 1; - - if (a.checkpointStop.arrivalTimestamp > b.checkpointStop.arrivalTimestamp) return 1; - if (a.checkpointStop.arrivalTimestamp < b.checkpointStop.arrivalTimestamp) return -1; - - return a.checkpointStop.departureTimestamp > b.checkpointStop.departureTimestamp ? 1 : -1; - }); - } - }, - methods: { loadSelectedOption() { const queryCheckpoint = this.$route.query['checkpoint']?.toString(); @@ -402,205 +107,17 @@ export default defineComponent({ checkpointsListRef[0] ?? sceneryName; } - }, - - setCheckpoint(cp: string) { - this.chosenCheckpoint = cp; } } }); diff --git a/src/components/SceneryView/SceneryTimetable/SceneryTimetableHeader.vue b/src/components/SceneryView/SceneryTimetable/SceneryTimetableHeader.vue new file mode 100644 index 0000000..6a535f0 --- /dev/null +++ b/src/components/SceneryView/SceneryTimetable/SceneryTimetableHeader.vue @@ -0,0 +1,114 @@ + + + + + diff --git a/src/components/SceneryView/SceneryTimetable/SceneryTimetableList.vue b/src/components/SceneryView/SceneryTimetable/SceneryTimetableList.vue new file mode 100644 index 0000000..9c8ef9a --- /dev/null +++ b/src/components/SceneryView/SceneryTimetable/SceneryTimetableList.vue @@ -0,0 +1,439 @@ + + + + + diff --git a/src/components/SceneryView/ScheduledTrainStatus.vue b/src/components/SceneryView/SceneryTimetable/ScheduledTrainStatus.vue similarity index 97% rename from src/components/SceneryView/ScheduledTrainStatus.vue rename to src/components/SceneryView/SceneryTimetable/ScheduledTrainStatus.vue index 4fe0dc8..c935bf9 100644 --- a/src/components/SceneryView/ScheduledTrainStatus.vue +++ b/src/components/SceneryView/SceneryTimetable/ScheduledTrainStatus.vue @@ -18,8 +18,8 @@