From 8190dfa2cb69c85219f65bc6c0c2143516abd51d Mon Sep 17 00:00:00 2001 From: Spythere Date: Mon, 3 Jun 2024 01:31:31 +0200 Subject: [PATCH 01/19] chore: fetching & caching vehicles data information --- src/store/apiStore.ts | 38 ++++++++++++++++++++++++-------------- src/typings/api.ts | 7 ++++++- src/typings/common.ts | 24 ++++++++++++++++++++++++ vite.config.ts | 7 +++++++ 4 files changed, 61 insertions(+), 15 deletions(-) diff --git a/src/store/apiStore.ts b/src/store/apiStore.ts index 990dd53..0b558ad 100644 --- a/src/store/apiStore.ts +++ b/src/store/apiStore.ts @@ -4,20 +4,17 @@ import { Status } from '../typings/common'; import { StationJSONData } from './typings'; import axios, { AxiosInstance } from 'axios'; -export enum APIMode { - PRODUCTION = 0, - DEV = 1, - MOCK = 2 -} - export const useApiStore = defineStore('apiStore', { state: () => ({ dataStatuses: { connection: Status.Data.Loading, - sceneries: Status.Data.Loading + sceneries: Status.Data.Loading, + vehicles: Status.Data.Loading }, activeData: undefined as API.ActiveData.Response | undefined, + vehiclesData: undefined as API.Vehicles.Response | undefined, + donatorsData: [] as API.Donators.Response, sceneryData: [] as StationJSONData[], @@ -54,6 +51,7 @@ export const useApiStore = defineStore('apiStore', { // Static data this.fetchDonatorsData(); this.fetchStationsGeneralInfo(); + this.fetchVehiclesInfo(); }, async fetchActiveData() { @@ -82,17 +80,29 @@ export const useApiStore = defineStore('apiStore', { }, async fetchStationsGeneralInfo() { - const sceneryData: StationJSONData[] = ( - await this.client!.get('api/getSceneries') - ).data; + try { + const sceneryData: StationJSONData[] = ( + await this.client!.get('api/getSceneries') + ).data; - if (!sceneryData) { + this.dataStatuses.sceneries = Status.Data.Loaded; + this.sceneryData = sceneryData; + } catch (error) { this.dataStatuses.sceneries = Status.Data.Error; - return; + console.error('Ups! Wystąpił błąd podczas pobierania informacji o sceneriach:', error); } + }, - this.dataStatuses.sceneries = Status.Data.Loaded; - this.sceneryData = sceneryData; + async fetchVehiclesInfo() { + try { + const response = await this.client!.get('vehicles'); + + this.vehiclesData = response.data; + this.dataStatuses.vehicles = response.data ? Status.Data.Loaded : Status.Data.Warning; + } catch (error) { + this.dataStatuses.vehicles = Status.Data.Error; + console.error('Ups! Wystąpił błąd podczas pobierania informacji o pojazdach:', error); + } } } }); diff --git a/src/typings/api.ts b/src/typings/api.ts index f37635d..2f97f43 100644 --- a/src/typings/api.ts +++ b/src/typings/api.ts @@ -1,4 +1,4 @@ -import { Status } from './common'; +import { Status, VehiclesData } from './common'; export enum APIDataStatus { OK = 'OK', @@ -19,6 +19,7 @@ export namespace API { apiStatuses?: APIStatuses; } } + export namespace DispatcherHistory { export type Response = Data[]; @@ -316,6 +317,10 @@ export namespace API { export namespace Donators { export type Response = string[]; } + + export namespace Vehicles { + export type Response = VehiclesData; + } } export namespace GithubAPI { diff --git a/src/typings/common.ts b/src/typings/common.ts index 0e5393f..e53b9da 100644 --- a/src/typings/common.ts +++ b/src/typings/common.ts @@ -189,3 +189,27 @@ export interface CheckpointTrain { checkpointStop: TrainStop; train: Train; } + +// Vehicles Data +export interface VehiclesData { + simulatorVersion: string; + + vehicleList: any[][]; + + vehicleProps: VehicleProps[]; +} + +export interface VehicleProps { + type: string; + speed: number; + length: number; + weight: number; + cargoTypes?: VehicleCargo[]; + coldStart?: boolean; + doubleManned?: boolean; +} + +export interface VehicleCargo { + id: string; + weight: number; +} diff --git a/vite.config.ts b/vite.config.ts index b629cac..e32fe95 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -33,6 +33,13 @@ export default defineConfig({ } } }, + { + urlPattern: /^https:\/\/stacjownik.spythere.eu\/vehicles/i, + handler: 'StaleWhileRevalidate', + options: { + cacheName: 'spythere-vehicles-cache' + } + }, { urlPattern: /^https:\/\/static.spythere.eu\/.*/i, handler: 'CacheFirst', From 26b1ec246d4bf4f75f15bec0f2669ee1a12b1385 Mon Sep 17 00:00:00 2001 From: Spythere Date: Mon, 3 Jun 2024 18:10:45 +0200 Subject: [PATCH 02/19] chore: added extra data to vehicles tooltip --- src/components/Global/StockList.vue | 6 +-- .../Tooltip/VehiclePreviewTooltip.vue | 42 +++++++++++++++++-- 2 files changed, 42 insertions(+), 6 deletions(-) diff --git a/src/components/Global/StockList.vue b/src/components/Global/StockList.vue index f4ec337..425e2b3 100644 --- a/src/components/Global/StockList.vue +++ b/src/components/Global/StockList.vue @@ -23,15 +23,15 @@

  • - {{ stockName.split(':')[0].split('_').splice(0, 2).join(' ') }} - {{ stockName.split(':')[1] }} + {{ stockName.split(':')[0].split('_').splice(0, 3).join(' ') }} +

    ({{ stockName.split(':')[1] }})

    - {{ tooltipStore.content.replace(/_/g, ' ') }} + {{ vehicleName.replace(/_/g, ' ') }} + ({{ vehicleCargo.id }}) +
    + +
    + {{ vehicleProps.speed }}km/h • {{ vehicleProps.length }}m • + {{ (vehicleProps.weight / 1000).toFixed(1) }}t + (+{{ (vehicleCargo.weight / 1000).toFixed(1) }}t)
    @@ -27,11 +34,13 @@ @@ -85,10 +118,13 @@ img { .vehicle-name { text-align: center; margin-top: 0.5em; - color: #ccc; text-wrap: wrap; } +.vehicle-props { + color: #ccc; +} + .error-placeholder { height: 176px; } From dbd73d448d3f7253434340dc17343b80ee7dbb3f Mon Sep 17 00:00:00 2001 From: Spythere Date: Mon, 3 Jun 2024 20:09:15 +0200 Subject: [PATCH 03/19] chore: added active train's rolling stock vmax --- src/App.vue | 1 + src/components/Tooltip/Tooltip.vue | 7 ++--- src/components/TrainsView/TrainInfo.vue | 34 +++++++++++++++++++++++++ src/styles/global.scss | 16 +++++++++--- 4 files changed, 50 insertions(+), 8 deletions(-) diff --git a/src/App.vue b/src/App.vue index 36cf3e5..63d6a30 100644 --- a/src/App.vue +++ b/src/App.vue @@ -226,6 +226,7 @@ export default defineComponent({ min-height: 100vh; overflow: hidden; + position: relative; } .app_main { diff --git a/src/components/Tooltip/Tooltip.vue b/src/components/Tooltip/Tooltip.vue index 0433a4b..060d312 100644 --- a/src/components/Tooltip/Tooltip.vue +++ b/src/components/Tooltip/Tooltip.vue @@ -1,5 +1,5 @@ @@ -35,10 +35,7 @@ export default defineComponent({ let translateX = '0', translateY = '30px'; - if (clientWidth < 500) { - previewEl.style.left = '50%'; - translateX = '-50%'; - } else if (val[0] <= boxWidth / 2) { + if (val[0] <= boxWidth / 2) { previewEl.style.left = '0'; translateX = '0px'; } else if (val[0] >= clientWidth - boxWidth / 2) { diff --git a/src/components/TrainsView/TrainInfo.vue b/src/components/TrainsView/TrainInfo.vue index 66edfb0..eea0c4e 100644 --- a/src/components/TrainsView/TrainInfo.vue +++ b/src/components/TrainsView/TrainInfo.vue @@ -131,6 +131,18 @@
    speed icon {{ train.speed }} km/h + + + • + + {{ maxSpeed }} km/h + +
    @@ -191,6 +203,28 @@ export default defineComponent({ }; }, + computed: { + maxSpeed() { + return this.train.stockList.reduce((acc, stockName) => { + const stockVehicleInfo = this.apiStore.vehiclesData?.vehicleList.find( + (v) => v[0] == stockName.split(':')[0] + ); + + if (!stockVehicleInfo) return acc; + + const stockVehicleProps = this.apiStore.vehiclesData?.vehicleProps.find( + (v) => v.type == stockVehicleInfo[1] + ); + + if (!stockVehicleProps) return acc; + + if (stockVehicleProps.speed < acc) return stockVehicleProps.speed; + + return acc; + }, Infinity); + } + }, + methods: { navigateToJournal() { this.$router.push({ diff --git a/src/styles/global.scss b/src/styles/global.scss index 12fa47c..9342ec8 100644 --- a/src/styles/global.scss +++ b/src/styles/global.scss @@ -302,14 +302,15 @@ a.a-button { [data-tooltip]:hover::after, [data-tooltip]:focus::after { position: absolute; - transform: translate(10px, -50%); + transform: translate(0, -50%); content: attr(data-tooltip); color: white; - background-color: #171717; + background-color: #333; + box-shadow: 0 0 5px 2px #aaa; border-radius: 0.5em; padding: 0.5em; - margin: 0 0.25em; + margin: 0 0.5em; max-width: 300px; z-index: 100; } @@ -317,3 +318,12 @@ a.a-button { [data-tooltip] { cursor: help; } + +@include smallScreen { + [data-tooltip]:hover::after, + [data-tooltip]:focus::after { + transform: translate(-50%, 2em); + left: 50%; + width: 100%; + } +} From bdc2ca784c55755f13d2d63336ec5f8b3350b235 Mon Sep 17 00:00:00 2001 From: Spythere Date: Mon, 3 Jun 2024 21:37:33 +0200 Subject: [PATCH 04/19] chore: missing translations --- src/components/TrainsView/TrainInfo.vue | 2 +- src/locales/en.json | 2 ++ src/locales/pl.json | 2 ++ 3 files changed, 5 insertions(+), 1 deletion(-) diff --git a/src/components/TrainsView/TrainInfo.vue b/src/components/TrainsView/TrainInfo.vue index eea0c4e..7649429 100644 --- a/src/components/TrainsView/TrainInfo.vue +++ b/src/components/TrainsView/TrainInfo.vue @@ -138,7 +138,7 @@ class="text--grayed" style="text-decoration: underline dotted" tabindex="0" - data-tooltip="Maksymalna prędkość na podstawie pojazdów w składzie - nie bierze pod uwagę masy hamowania" + :data-tooltip="$t('trains.vmax-tooltip')" > {{ maxSpeed }} km/h diff --git a/src/locales/en.json b/src/locales/en.json index 465e467..6b34693 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -329,6 +329,8 @@ "current-signal": "at signal", "current-track": "on track", + "vmax-tooltip": "Maximum train speed based on rolling stock vehicles - braked weight is not included", + "delayed": "Delayed: ", "preponed": "Ahead of schedule: ", "on-time": "On time", diff --git a/src/locales/pl.json b/src/locales/pl.json index 1f233b4..4dcf451 100644 --- a/src/locales/pl.json +++ b/src/locales/pl.json @@ -315,6 +315,8 @@ "current-signal": "przy semaforze", "current-track": "na szlaku", + "vmax-tooltip": "Maksymalna prędkość na podstawie pojazdów w składzie - nie bierze pod uwagę masy hamowania", + "delayed": "Opóźniony: ", "preponed": "Przed czasem: ", "on-time": "Planowo", From 69ff85cfb12bb219ccc2f2847c1d1467ab9c1e69 Mon Sep 17 00:00:00 2001 From: Spythere Date: Mon, 3 Jun 2024 22:26:58 +0200 Subject: [PATCH 05/19] chore: added route electrification indicators in train schedule --- public/images/icon-w4a.png | Bin 0 -> 3325 bytes src/components/TrainsView/TrainSchedule.vue | 87 ++++++++++++++++---- 2 files changed, 69 insertions(+), 18 deletions(-) create mode 100644 public/images/icon-w4a.png diff --git a/public/images/icon-w4a.png b/public/images/icon-w4a.png new file mode 100644 index 0000000000000000000000000000000000000000..f4700913ddda510e6c8615f7cf629a2faea4ed04 GIT binary patch literal 3325 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 Hu0mjf@pdc% literal 0 HcmV?d00001 diff --git a/src/components/TrainsView/TrainSchedule.vue b/src/components/TrainsView/TrainSchedule.vue index ecb4a77..961f5c6 100644 --- a/src/components/TrainsView/TrainSchedule.vue +++ b/src/components/TrainsView/TrainSchedule.vue @@ -56,7 +56,19 @@     -
    {{ stop.departureLine }}
    +
    + {{ stop.departureLine }} | {{ stop.departureLineSpeed }} + + + + ⚡ +
    +
    + + {{ scheduleStops[i + 1].arrivalLine }} | + {{ scheduleStops[i + 1].arrivalLineSpeed }} + + + + + ⚡
    @@ -117,6 +142,12 @@ export interface TrainScheduleStop { arrivalLine: string | null; departureLine: string | null; + arrivalLineSpeed: number; + arrivalLineElectrified: boolean | null; + + departureLineSpeed: number; + departureLineElectrified: boolean | null; + comments: string | null; } @@ -154,6 +185,17 @@ export default defineComponent({ ) currentSceneryIndex++; + const sceneryName = this.train.timetableData!.sceneryNames[currentSceneryIndex]; + const sceneryInfo = this.apiStore.sceneryData.find((st) => st.name == sceneryName); + + const arrivalLineInfo = sceneryInfo?.routesInfo.find( + (r) => r.routeName == stop.arrivalLine + ); + + const departureLineInfo = sceneryInfo?.routesInfo.find( + (r) => r.routeName == stop.departureLine + ); + return { nameHtml: stop.stopName, nameRaw: stop.stopNameRAW, @@ -172,7 +214,12 @@ export default defineComponent({ comments: stop.comments ?? null, arrivalLine: stop.arrivalLine, + arrivalLineSpeed: arrivalLineInfo?.routeSpeed ?? 0, + arrivalLineElectrified: arrivalLineInfo?.isElectric ?? null, + departureLine: stop.departureLine, + departureLineSpeed: departureLineInfo?.routeSpeed ?? 0, + departureLineElectrified: departureLineInfo?.isElectric ?? null, type: stop.stopType, distance: stop.stopDistance, @@ -181,7 +228,7 @@ export default defineComponent({ isSBL: /sbl/gi.test(stop.stopName), position: stop.beginsHere ? 'begin' : stop.terminatesHere ? 'end' : 'en-route', sceneryHash: '', - sceneryName: this.train.timetableData!.sceneryNames[currentSceneryIndex], + sceneryName, status: stop.confirmed ? 'confirmed' : stop.stopped ? 'stopped' : 'unconfirmed' }; }) ?? [] @@ -483,22 +530,26 @@ $blinkAnim: 0.5s ease-in-out alternate infinite blink; } } -.bottom-line-info { - .scenery-change-name { - position: relative; - margin: 0.25em 0; +.scenery-route { + display: flex; + align-items: center; + gap: 5px; +} - &::before { - content: ''; - position: absolute; - height: 2px; - width: 30px; - background-color: #aaa; +.scenery-change-name { + position: relative; + margin: 0.25em 0; - top: 50%; - right: calc(100% + 5px); - transform: translate(0, -50%); - } + &::before { + content: ''; + position: absolute; + height: 2px; + width: 30px; + background-color: #aaa; + + top: 50%; + right: calc(100% + 5px); + transform: translate(0, -50%); } } From 6c1e00d002fd16ce40d653b92ec6b97ca4b34387 Mon Sep 17 00:00:00 2001 From: Spythere Date: Tue, 4 Jun 2024 15:57:17 +0200 Subject: [PATCH 06/19] chore: layout & design fixes --- src/components/StationsView/StationTable.vue | 538 +++++++++---------- src/router/index.ts | 2 +- src/views/SceneryView.vue | 17 +- 3 files changed, 274 insertions(+), 283 deletions(-) diff --git a/src/components/StationsView/StationTable.vue b/src/components/StationsView/StationTable.vue index b06478e..9ee51e3 100644 --- a/src/components/StationsView/StationTable.vue +++ b/src/components/StationsView/StationTable.vue @@ -4,302 +4,299 @@ v-if="apiStore.dataStatuses.connection == Status.Loading && filteredStationList.length == 0" /> -
    - - - - - - - - - - - + + + + +
    -     - - + + - + + - + + + + - + + + + + + - - - {{ station.generalInfo.routes.doubleOtherNames.length }} - - - - - - SUP (RASP-UZK) + - icon-unknown - - - + {{ $t(`controls.abbrevs.${station.generalInfo.controlType}`) }} + - + - + SUP (RASP-UZK) - + dSAT ASDEK - + icon-unknown + - - - -
    - -
    - - sort icon -     -     		- - - - sort icon - -
    - - {{ - station.generalInfo.project - }} - {{ station.name }} - - - - {{ station.generalInfo.reqLevel >= 2 ? station.generalInfo.reqLevel : 'L' }} - - - - non-public - - - - non-public - - - - unavailable - - - - ? - - - - - - - {{ station.onlineInfo.dispatcherName }} - + + + -
    - {{ station.onlineInfo.dispatcherName }} -
    -     - + sort icon + +
    +
    + {{ + station.generalInfo.project + }} + {{ station.name }} + + -1 && + station.generalInfo.availability != 'nonPublic' && + station.generalInfo.availability != 'unavailable' " + :style="calculateExpStyle(station.generalInfo.reqLevel)" > - {{ station.onlineInfo.dispatcherExp < 2 ? 'L' : station.onlineInfo.dispatcherExp }} + {{ station.generalInfo.reqLevel >= 2 ? station.generalInfo.reqLevel : 'L' }} - -
    - - {{ station.generalInfo.routes.singleElectrifiedNames.length }} - + + non-public + - - {{ station.generalInfo.routes.singleOtherNames.length }} - + + non-public + + + + unavailable + + + + ? +
    		+ + + + + + {{ station.onlineInfo.dispatcherName }} + + +
    + {{ station.onlineInfo.dispatcherName }}
    -     		-
    - - {{ station.generalInfo.routes.doubleElectrifiedNames.length }} - +
    		+ + {{ station.onlineInfo.dispatcherExp < 2 ? 'L' : station.onlineInfo.dispatcherExp }} + + + +
    - {{ $t(`controls.abbrevs.${station.generalInfo.controlType}`) }} + {{ station.generalInfo.routes.singleElectrifiedNames.length }} - + + {{ station.generalInfo.routes.singleOtherNames.length }} + +
    +     		+
    + + {{ station.generalInfo.routes.doubleElectrifiedNames.length }} + - dSAT ASDEK + + {{ station.generalInfo.routes.doubleOtherNames.length }} + +
    +     		+ - {{ - station.onlineInfo?.stationTrains?.length ?? '-' - }} - / - {{ station.onlineInfo?.maxUsers ?? '-' }} - - {{ station.onlineInfo?.dispatcherRate ?? '-' }} - - {{ station.onlineInfo?.spawns.length ?? '-' }} - - {{ station.onlineInfo?.scheduledTrainCount.all ?? '-' }} - - {{ station.onlineInfo?.scheduledTrainCount.unconfirmed ?? '-' }} - - {{ station.onlineInfo?.scheduledTrainCount.confirmed ?? '-' }} -
    -
    + + {{ + station.onlineInfo?.stationTrains?.length ?? '-' + }} + / + {{ station.onlineInfo?.maxUsers ?? '-' }} + + + + {{ station.onlineInfo?.dispatcherRate ?? '-' }} + + + + {{ station.onlineInfo?.spawns.length ?? '-' }} + + + + {{ station.onlineInfo?.scheduledTrainCount.all ?? '-' }} + + + + {{ station.onlineInfo?.scheduledTrainCount.unconfirmed ?? '-' }} + + + + {{ station.onlineInfo?.scheduledTrainCount.confirmed ?? '-' }} + + + +
    @@ -415,12 +412,15 @@ export default defineComponent({ @import '../../styles/icons.scss'; $rowCol: #424242; +$tableBgCol: #555555; .station_table { height: 80vh; min-height: 700px; - overflow: auto; + overflow-y: scroll; + overflow-x: auto; font-weight: 500; + background-color: $tableBgCol; } .no-stations { diff --git a/src/router/index.ts b/src/router/index.ts index d6f337f..95d4000 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -58,7 +58,7 @@ const routes: Array = [ const router = createRouter({ scrollBehavior(to, from, savedPosition) { if (to.name == 'SceneryView' && from.name !== to.name && from.query['view'] === undefined) - return { el: `.app_main` }; + return { el: `.app_main`, top: -15 }; if (savedPosition) return savedPosition; }, diff --git a/src/views/SceneryView.vue b/src/views/SceneryView.vue index 11501f0..e75adf2 100644 --- a/src/views/SceneryView.vue +++ b/src/views/SceneryView.vue @@ -121,10 +121,6 @@ export default defineComponent({ Status: Status.Data }), - // activated() { - // this.loadSelectedCheckpoint(); - // }, - setup() { const route = useRoute(); @@ -215,11 +211,10 @@ button.back-btn { position: relative; - width: 100%; max-width: var(--max-container-width); - min-height: 100vh; + width: 100%; - margin: 1rem 0; + padding: 1rem 0; text-align: center; &[data-timetable-only='true'] { @@ -233,9 +228,7 @@ button.back-btn { background-color: #181818; padding: 1em 0.5em; - height: 100vh; - min-height: 750px; - max-height: 1000px; + height: calc(100vh - 0.5em); overflow: auto; display: flex; @@ -246,9 +239,7 @@ button.back-btn { background: #181818; padding: 1em 0.5em; - height: 100vh; - min-height: 750px; - max-height: 1000px; + height: calc(100vh - 0.5em); display: grid; grid-template-rows: auto 1fr auto; From 45af6495053da748eefe3a87fc9f586a482969aa Mon Sep 17 00:00:00 2001 From: Spythere Date: Wed, 5 Jun 2024 16:01:17 +0200 Subject: [PATCH 07/19] chore: changes in scenery view layout --- .../SceneryView/SceneryDispatchersHistory.vue | 144 ++++++++++-------- .../SceneryView/SceneryTimetablesHistory.vue | 136 +++++++++-------- src/styles/global.scss | 38 ++--- src/styles/sceneryViewTables.scss | 8 +- src/views/SceneryView.vue | 4 +- 5 files changed, 178 insertions(+), 152 deletions(-) diff --git a/src/components/SceneryView/SceneryDispatchersHistory.vue b/src/components/SceneryView/SceneryDispatchersHistory.vue index 09531be..24fbb6a 100644 --- a/src/components/SceneryView/SceneryDispatchersHistory.vue +++ b/src/components/SceneryView/SceneryDispatchersHistory.vue @@ -1,71 +1,73 @@ @@ -149,6 +151,20 @@ export default defineComponent({ @import '../../styles/responsive.scss'; @import '../../styles/sceneryViewTables.scss'; +.scenery-dispatchers-history { + height: 100%; + overflow: auto; + + display: grid; + gap: 0.5em; + grid-template-rows: auto 40px; +} + +.history-wrapper { + position: relative; + overflow: auto; +} + .level-badge { margin: 0 auto; } diff --git a/src/components/SceneryView/SceneryTimetablesHistory.vue b/src/components/SceneryView/SceneryTimetablesHistory.vue index 29267d6..d036175 100644 --- a/src/components/SceneryView/SceneryTimetablesHistory.vue +++ b/src/components/SceneryView/SceneryTimetablesHistory.vue @@ -1,69 +1,70 @@ @@ -142,13 +143,24 @@ export default defineComponent({ @import '../../styles/responsive.scss'; @import '../../styles/sceneryViewTables.scss'; +.scenery-timetables-history { + height: 100%; + overflow: auto; + + display: grid; + gap: 1em; + grid-template-rows: 40px auto 40px; +} + +.history-wrapper { + position: relative; + overflow: auto; +} + .top-filters { display: flex; justify-content: center; gap: 0.5em; - - button { - padding: 0.5em; - } + padding: 0.25em; } diff --git a/src/styles/global.scss b/src/styles/global.scss index 9342ec8..47fe70e 100644 --- a/src/styles/global.scss +++ b/src/styles/global.scss @@ -228,6 +228,10 @@ a.a-button { background-color: #3c3c3c; } + + &:hover { + background-color: #555; + } } &.btn--image { @@ -283,22 +287,11 @@ a.a-button { } } -@include smallScreen { - ::-webkit-scrollbar { - width: 0.5em; - height: 0.5em; - - &-track { - background-color: #222; - } - - &-thumb { - background-color: #777; - } - } +// Basic tooltip +[data-tooltip] { + cursor: help; } -// Basic tooltip [data-tooltip]:hover::after, [data-tooltip]:focus::after { position: absolute; @@ -315,11 +308,20 @@ a.a-button { z-index: 100; } -[data-tooltip] { - cursor: help; -} - @include smallScreen { + ::-webkit-scrollbar { + width: 0.5em; + height: 0.5em; + + &-track { + background-color: #222; + } + + &-thumb { + background-color: #777; + } + } + [data-tooltip]:hover::after, [data-tooltip]:focus::after { transform: translate(-50%, 2em); diff --git a/src/styles/sceneryViewTables.scss b/src/styles/sceneryViewTables.scss index 2e3f435..1306edb 100644 --- a/src/styles/sceneryViewTables.scss +++ b/src/styles/sceneryViewTables.scss @@ -1,9 +1,3 @@ -.scenery-table-section { - position: relative; - height: 100%; - overflow-y: scroll; -} - table.scenery-history-table { width: 100%; border-collapse: collapse; @@ -25,7 +19,7 @@ table.scenery-history-table { td { padding: 0.75em; - border-bottom: solid 5px #111; + border-bottom: solid 5px #181818; } } diff --git a/src/views/SceneryView.vue b/src/views/SceneryView.vue index e75adf2..76ed7a6 100644 --- a/src/views/SceneryView.vue +++ b/src/views/SceneryView.vue @@ -229,6 +229,7 @@ button.back-btn { padding: 1em 0.5em; height: calc(100vh - 0.5em); + min-height: 800px; overflow: auto; display: flex; @@ -240,9 +241,10 @@ button.back-btn { padding: 1em 0.5em; height: calc(100vh - 0.5em); + min-height: 800px; display: grid; - grid-template-rows: auto 1fr auto; + grid-template-rows: auto 1fr; gap: 1em; } From c84fbbcf420b8a9aec082cbb5dc2766924c6dac9 Mon Sep 17 00:00:00 2001 From: Spythere Date: Wed, 5 Jun 2024 20:03:05 +0200 Subject: [PATCH 08/19] chore: added scenery timetables history modes --- src/components/JournalView/typings.ts | 4 +- .../SceneryView/SceneryDispatchersHistory.vue | 2 +- src/components/SceneryView/SceneryInfo.vue | 5 -- .../SceneryView/SceneryTimetablesHistory.vue | 71 ++++++++++++++----- src/locales/en.json | 8 ++- src/locales/pl.json | 6 ++ src/styles/JournalSection.scss | 2 +- src/styles/sceneryViewTables.scss | 1 + src/views/JournalTimetables.vue | 26 +++++-- src/views/SceneryView.vue | 27 +++---- 10 files changed, 105 insertions(+), 47 deletions(-) diff --git a/src/components/JournalView/typings.ts b/src/components/JournalView/typings.ts index ae7c02b..447c427 100644 --- a/src/components/JournalView/typings.ts +++ b/src/components/JournalView/typings.ts @@ -6,7 +6,9 @@ export namespace Journal { | 'search-train' | 'search-date' | 'search-dispatcher' - | 'search-issuedFrom'; + | 'search-issuedFrom' + | 'search-terminatingAt' + | 'search-via'; export type TimetableSearchType = { [key in TimetableSearchKey]: string; diff --git a/src/components/SceneryView/SceneryDispatchersHistory.vue b/src/components/SceneryView/SceneryDispatchersHistory.vue index 24fbb6a..3e63a9c 100644 --- a/src/components/SceneryView/SceneryDispatchersHistory.vue +++ b/src/components/SceneryView/SceneryDispatchersHistory.vue @@ -37,7 +37,7 @@ {{ historyItem.dispatcherLevel >= 2 ? historyItem.dispatcherLevel : 'L' }} - ? + - {{ historyItem.dispatcherRate }} diff --git a/src/components/SceneryView/SceneryInfo.vue b/src/components/SceneryView/SceneryInfo.vue index 120daf5..1bec2a2 100644 --- a/src/components/SceneryView/SceneryInfo.vue +++ b/src/components/SceneryView/SceneryInfo.vue @@ -124,11 +124,6 @@ h3.section-header { align-items: center; font-size: 1.2em; - - img { - width: 1.1em; - margin-left: 0.5em; - } } .info-lists { diff --git a/src/components/SceneryView/SceneryTimetablesHistory.vue b/src/components/SceneryView/SceneryTimetablesHistory.vue index d036175..ba04962 100644 --- a/src/components/SceneryView/SceneryTimetablesHistory.vue +++ b/src/components/SceneryView/SceneryTimetablesHistory.vue @@ -1,11 +1,19 @@