diff --git a/package.json b/package.json index 623712d..dcd6aba 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "stacjownik", - "version": "1.30.3", + "version": "1.30.4", "private": true, "type": "module", "scripts": { diff --git a/src/components/SceneryView/SceneryInfo/SceneryInfoUserList.vue b/src/components/SceneryView/SceneryInfo/SceneryInfoUserList.vue index 51ba012..9de9c07 100644 --- a/src/components/SceneryView/SceneryInfo/SceneryInfoUserList.vue +++ b/src/components/SceneryView/SceneryInfo/SceneryInfoUserList.vue @@ -18,7 +18,11 @@ :key="train.id" :data-status="status" > - + {{ train.trainNo }} {{ train.driverName }} diff --git a/src/components/SceneryView/SceneryTimetable.vue b/src/components/SceneryView/SceneryTimetable.vue index 4c5a648..faf76ec 100644 --- a/src/components/SceneryView/SceneryTimetable.vue +++ b/src/components/SceneryView/SceneryTimetable.vue @@ -122,28 +122,30 @@ - - + + {{ row.train.timetableData!.category }}  {{ row.train.trainNo }} + • + {{ row.train.driverName }} + + - - {{ row.train.driverName }} - - {{ row.train.stockList[0] }} @@ -243,7 +245,7 @@ import { useMainStore } from '../../store/mainStore'; import { useApiStore } from '../../store/apiStore'; import ScheduledTrainStatus from './ScheduledTrainStatus.vue'; import { SceneryTimetableRow } from './typings'; -import { ActiveScenery, Station } from '../../typings/common'; +import { ActiveScenery, Station, TooltipTrainInfo, Train } from '../../typings/common'; import { getTrainStopStatus, stopStatusPriority } from './utils'; export default defineComponent({ @@ -527,11 +529,12 @@ export default defineComponent({ .info-route { width: 100%; + margin-top: 0.25em; } .stop-comments-icon > img { - width: 1.2em; - vertical-align: middle; + width: 1.3em; + vertical-align: top; } .schedule { diff --git a/src/components/SceneryView/ScheduledTrainStatus.vue b/src/components/SceneryView/ScheduledTrainStatus.vue index 2d642a9..4fe0dc8 100644 --- a/src/components/SceneryView/ScheduledTrainStatus.vue +++ b/src/components/SceneryView/ScheduledTrainStatus.vue @@ -1,11 +1,18 @@ @@ -27,6 +34,7 @@ export default defineComponent({ const { status, prevElement, currentElement, nextElement } = this.sceneryTimetableRow; let stopStatusIndicator = ''; + let stationNameHref = ''; switch (status) { case StopStatus.ARRIVING: @@ -35,6 +43,8 @@ export default defineComponent({ prevStationName: prevElement?.stationName ?? '', prevDepartureLine: prevElement?.departureRouteExt ?? '' }); + + stationNameHref = prevElement?.stationName ?? ''; } else { stopStatusIndicator = this.$t('timetables.desc-beginning'); } @@ -48,6 +58,9 @@ export default defineComponent({ nextArrivalLine: nextElement?.arrivalRouteExt }) : this.$t(`timetables.desc-end`); + + stationNameHref = nextElement?.stationName ?? ''; + break; case StopStatus.DEPARTED: @@ -55,11 +68,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 +86,8 @@ export default defineComponent({ nextStationName: nextElement?.stationName, nextArrivalLine: nextElement?.arrivalRouteExt }); + + stationNameHref = nextElement?.stationName ?? ''; break; case StopStatus.TERMINATED: @@ -80,9 +99,18 @@ export default defineComponent({ } return { ...this.sceneryTimetableRow, + stationNameHref, stopStatusIndicator }; } + }, + + methods: { + navigateToScenery(sceneryName?: string) { + if (!sceneryName) return; + + this.$router.push(`/scenery?station=${sceneryName}`); + } } }); @@ -91,11 +119,11 @@ export default defineComponent({ .general-status { margin-top: 0.5em; - span.arriving { + & > .arriving { color: #ccc; } - span.departed { + & > .departed { color: lime; &-away { @@ -103,15 +131,15 @@ export default defineComponent({ } } - span.stopped { + & > .stopped { color: #ffa600; } - span.online { + & > .online { color: gold; } - span.terminated { + & > .terminated { color: salmon; } } diff --git a/src/components/StationsView/StationTable.vue b/src/components/StationsView/StationTable.vue index 3390b4b..58e414a 100644 --- a/src/components/StationsView/StationTable.vue +++ b/src/components/StationsView/StationTable.vue @@ -33,12 +33,12 @@ class="header-image" :class="headerName" > - - + + {{ station.generalInfo.reqLevel >= 2 ? station.generalInfo.reqLevel : 'L' }} - - non-public + + non-public - - non-public + + non-public - - unavailable + + unavailable - ? + + ? + @@ -153,7 +165,8 @@ @@ -163,7 +176,8 @@ @@ -177,7 +191,8 @@ @@ -187,7 +202,8 @@ @@ -201,7 +217,8 @@ v-if="station.generalInfo?.signalType" class="scenery-icon icon-info" :class="station.generalInfo?.controlType.replace('+', '-')" - :title=" + data-tooltip-type="BaseTooltip" + :data-tooltip-content=" $t('sceneries.info.control-type') + $t(`controls.${station.generalInfo?.controlType}`) " @@ -214,7 +231,8 @@ class="icon-info" :src="`/images/icon-${station.generalInfo.signalType}.svg`" :alt="station.generalInfo.signalType" - :title=" + data-tooltip-type="BaseTooltip" + :data-tooltip-content=" $t('sceneries.info.signals-type') + $t(`signals.${station.generalInfo.signalType}`) " /> @@ -224,7 +242,8 @@ class="icon-info" src="/images/icon-SUP.svg" alt="SUP (RASP-UZK)" - :title="$t('sceneries.info.SUP')" + data-tooltip-type="BaseTooltip" + :data-tooltip-content="$t('sceneries.info.SUP')" /> dSAT ASDEK icon-unknown @@ -248,7 +269,7 @@ class="station-users" :class="{ inactive: !station.onlineInfo }" data-tooltip-type="UsersTooltip" - :data-tooltip-content="JSON.stringify(station.onlineInfo?.stationTrains ?? [])" + :data-tooltip-content="getUsersTooltipContent(station.onlineInfo?.stationTrains ?? [])" > {{ station.onlineInfo?.stationTrains?.length ?? '-' @@ -318,7 +339,7 @@ import dateMixin from '../../mixins/dateMixin'; import styleMixin from '../../mixins/styleMixin'; import { useApiStore } from '../../store/apiStore'; import { useMainStore } from '../../store/mainStore'; -import { Station, Status } from '../../typings/common'; +import { Station, Status, TooltipUserTrain, Train } from '../../typings/common'; import { useTooltipStore } from '../../store/tooltipStore'; import { getChangedFilters } from '../../managers/stationFilterManager'; import { ActiveSorter, HeadIdsType, headIconsIds, headIds } from './typings'; @@ -394,6 +415,15 @@ export default defineComponent({ else this.activeSorter.dir = 1; this.activeSorter.headerName = headerName; + }, + + getUsersTooltipContent(stationTrains: Train[]): string { + const usersTrains: TooltipUserTrain[] = stationTrains.map((train) => ({ + driverName: train.driverName, + trainNo: train.trainNo + })); + + return JSON.stringify(usersTrains); } } }); diff --git a/src/components/Tooltip/Tooltip.vue b/src/components/Tooltip/Tooltip.vue index 300e4fe..743a114 100644 --- a/src/components/Tooltip/Tooltip.vue +++ b/src/components/Tooltip/Tooltip.vue @@ -13,6 +13,7 @@ import BaseTooltip from './BaseTooltip.vue'; import SpawnsTooltip from './SpawnsTooltip.vue'; import UsersTooltip from './UsersTooltip.vue'; import HtmlTooltip from './HtmlTooltip.vue'; +import TrainInfoTooltip from "./TrainInfoTooltip.vue"; const BOX_PADDING_PX = 20; @@ -23,7 +24,8 @@ export default defineComponent({ BaseTooltip, SpawnsTooltip, UsersTooltip, - HtmlTooltip + HtmlTooltip, + TrainInfoTooltip }, data() { diff --git a/src/components/Tooltip/TrainInfoTooltip.vue b/src/components/Tooltip/TrainInfoTooltip.vue new file mode 100644 index 0000000..ea40ed3 --- /dev/null +++ b/src/components/Tooltip/TrainInfoTooltip.vue @@ -0,0 +1,69 @@ + + + + + diff --git a/src/components/Tooltip/UsersTooltip.vue b/src/components/Tooltip/UsersTooltip.vue index e49d52f..0ca9d68 100644 --- a/src/components/Tooltip/UsersTooltip.vue +++ b/src/components/Tooltip/UsersTooltip.vue @@ -10,7 +10,7 @@