{{ $t('app.no-result') }}
-
- - +
- +
++- {{ item.trainCategoryCode }} - {{ item.trainNo }} - | {{ item.driverName }} | - #{{ item.timetableId }} + {{ timetable.trainCategoryCode }} + {{ timetable.trainNo }} + | {{ timetable.driverName }} | + #{{ timetable.timetableId }} -- +- {{ item.route.replace('|', ' - ') }} -- -
- -- + {{ localeDay(timetable.beginDate, $i18n.locale) }} + - {{ i > 0 ? ' > ' : '' }} {{ scenery.name }} - -- -- - {{ item.route.split('|')[0] }}: --- {{ localeTime(item.beginDate, $i18n.locale) }} -- {{ localeTime(item.scheduledBeginDate, $i18n.locale) }} • - - - - {{ item.route.split('|').slice(-1)[0] }}: + {{ + !timetable.terminated + ? $t('journal.timetable-active') + : timetable.fulfilled || timetable.currentDistance >= timetable.routeDistance * 0.9 + ? $t('journal.timetable-fulfilled') + : `${$t('journal.timetable-abandoned')} ${localeTime(timetable.endDate, $i18n.locale)}` + }} - {{ $t('journal.timetable-abandoned') }} + +- {{ localeTime(item.fulfilled ? item.endDate : item.scheduledEndDate, $i18n.locale) }} -- {{ localeTime(item.fulfilled ? item.scheduledEndDate : item.endDate, $i18n.locale) }} - -+ {{ timetable.route.replace('|', ' - ') }} +- - {{ - !item.terminated - ? $t('journal.timetable-active') - : item.fulfilled || item.currentDistance >= item.routeDistance * 0.9 - ? $t('journal.timetable-fulfilled') - : $t('journal.timetable-abandoned') - }} - -
--- {{ $t('journal.timetable-day') }} {{ localeDay(item.beginDate, $i18n.locale) }} ++ + > + {{ scenery.name }} + + + + + + + ++ + ++ + {{ $t('journal.route-length') }} + {{ !timetable.fulfilled ? timetable.currentDistance + ' /' : '' }} + {{ timetable.routeDistance }} km + + • + + {{ $t('journal.station-count') }} + {{ timetable.confirmedStopsCount }} / + {{ timetable.allStopsCount }} +-+- -{{ $t('journal.dispatcher-name') }}-{{ item.authorName }} --- {{ $t('journal.route-length') }} - {{ !item.fulfilled ? item.currentDistance + ' /' : '' }} - {{ item.routeDistance }} km + {{ timetable.authorName }} +-- {{ $t('journal.station-count') }} - {{ item.confirmedStopsCount }} / - {{ item.allStopsCount }} + + +@@ -161,16 +169,15 @@ import { TimetableHistory } from '../../scripts/interfaces/api/TimetablesAPIData import { URLs } from '../../scripts/utils/apiURLs'; import { useStore } from '../../store/store'; import JournalOptions from './JournalOptions.vue'; +import { JournalTimetableSearcher } from '../../types/JournalTimetablesTypes'; +import modalTrainMixin from '../../mixins/modalTrainMixin'; +import imageMixin from '../../mixins/imageMixin'; const TIMETABLES_API_URL = `${URLs.stacjownikAPI}/api/getTimetables`; -type JournalTimetableSearcher = { - [key in 'search-driver' | 'search-train']: string; -}; - export default defineComponent({ components: { DriverStats, Loading, JournalOptions }, - mixins: [dateMixin, routerMixin], + mixins: [dateMixin, routerMixin, modalTrainMixin, imageMixin], name: 'JournalTimetables', @@ -188,6 +195,8 @@ export default defineComponent({ showReturnButton: false, statsCardOpen: false, + timetableHistory: [] as TimetableHistory[], + journalTimetableFilters, }), @@ -215,7 +224,6 @@ export default defineComponent({ const scrollElement: Ref+-
+
-
+
+ +
{{ car.replace(/_/g, ' ').split(':')[0] }}+
+
= ref(null); return { - historyList: ref([]) as Ref ${this.localeTime(timetable.beginDate, this.$i18n.locale)}` + : '') + + `${this.localeTime(timetable.scheduledBeginDate, this.$i18n.locale)})`; + + const endDateHTML = + ' (p. ' + + (timetable.endDate != timetable.scheduledEndDate && timetable.fulfilled + ? `${this.localeTime( + timetable.fulfilled ? timetable.endDate : timetable.scheduledEndDate, + this.$i18n.locale + )}` + : '') + + `${this.localeTime( + timetable.fulfilled || (timetable.terminated && !timetable.fulfilled) + ? timetable.scheduledEndDate + : timetable.endDate, + this.$i18n.locale + )})`; + + const abandonedDateHTML = ` (porz. ${this.localeTime( + timetable.fulfilled ? timetable.scheduledEndDate : timetable.endDate, + this.$i18n.locale + )})`; + + return { name, confirmed: i < timetable.confirmedStopsCount, beginDateHTML, endDateHTML, abandonedDateHTML }; + }); + }, + + onImageError(e: Event) { + const imageEl = e.target as HTMLImageElement; + imageEl.src = this.getImage('unknown.png'); }, handleScroll() { @@ -303,7 +354,7 @@ export default defineComponent({ async addHistoryData() { this.scrollDataLoaded = false; - const countFrom = this.historyList.length; + const countFrom = this.timetableHistory.length; const responseData: TimetableHistory[] = await ( await axios.get(`${TIMETABLES_API_URL}?${this.currentQuery}&countFrom=${countFrom}`) @@ -316,7 +367,7 @@ export default defineComponent({ return; } - this.historyList.push(...responseData); + this.timetableHistory.push(...responseData); this.scrollDataLoaded = true; }, @@ -377,12 +428,12 @@ export default defineComponent({ if (!responseData) return; // Response data exists - this.historyList = responseData; + this.timetableHistory = responseData; // Stats display this.store.driverStatsName = - this.historyList.length > 0 && this.searchersValues['search-driver'].trim() - ? this.historyList[0].driverName + this.timetableHistory.length > 0 && this.searchersValues['search-driver'].trim() + ? this.timetableHistory[0].driverName : ''; this.historyDataStatus.status = DataStatus.Loaded; @@ -399,41 +450,83 @@ export default defineComponent({ diff --git a/src/components/SceneryView/SceneryTimetablesHistory.vue b/src/components/SceneryView/SceneryTimetablesHistory.vue index b37282b..07f828b 100644 --- a/src/components/SceneryView/SceneryTimetablesHistory.vue +++ b/src/components/SceneryView/SceneryTimetablesHistory.vue @@ -1,118 +1,118 @@ - - - - - - - - + + + + + + + + diff --git a/src/components/TrainsView/TrainInfo.vue b/src/components/TrainsView/TrainInfo.vue index 9b7a9b7..4c8ae49 100644 --- a/src/components/TrainsView/TrainInfo.vue +++ b/src/components/TrainsView/TrainInfo.vue @@ -253,10 +253,6 @@ export default defineComponent({ .train-stats { font-size: 1.1em; - - img { - display: none; - } } .train_general { diff --git a/src/scripts/interfaces/api/TimetablesAPIData.ts b/src/scripts/interfaces/api/TimetablesAPIData.ts index 48710a4..7100024 100644 --- a/src/scripts/interfaces/api/TimetablesAPIData.ts +++ b/src/scripts/interfaces/api/TimetablesAPIData.ts @@ -1,35 +1,44 @@ -export interface TimetableHistory { - timetableId: number; - trainNo: number; - trainCategoryCode: string; - driverId: number; - driverName: string; - route: string; - twr: number; - skr: number; - sceneriesString: string; - - routeDistance: number; - currentDistance: number; - - confirmedStopsCount: number; - allStopsCount: number; - - beginDate: string; - endDate: string; - - scheduledBeginDate: string; - scheduledEndDate: string; - - terminated: boolean; - fulfilled: boolean; - - authorName?: string; - authorId?: number; -} - -export interface SceneryTimetableHistory { - sceneryTimetables: TimetableHistory[]; - totalCount: number; - sceneryName: string; -} +export interface TimetableHistory { + timetableId: number; + trainNo: number; + trainCategoryCode: string; + driverId: number; + driverName: string; + route: string; + twr: number; + skr: number; + sceneriesString: string; + + routeDistance: number; + currentDistance: number; + + confirmedStopsCount: number; + allStopsCount: number; + + beginDate: string; + endDate: string; + + scheduledBeginDate: string; + scheduledEndDate: string; + + terminated: boolean; + fulfilled: boolean; + + authorName?: string; + authorId?: number; + + stockString?: string; + stockMass?: number; + stockLength?: number; + maxSpeed?: number; + + hashesString?: string; + currentSceneryName?: string; + currentSceneryHash?: string; +} + +export interface SceneryTimetableHistory { + sceneryTimetables: TimetableHistory[]; + totalCount: number; + sceneryName: string; +} diff --git a/src/styles/JournalSection.scss b/src/styles/JournalSection.scss index 6aa6e43..8dce167 100644 --- a/src/styles/JournalSection.scss +++ b/src/styles/JournalSection.scss @@ -1,65 +1,67 @@ -@import 'responsive.scss'; - -// Animations -.warning { - &-enter-from, - &-leave-to { - opacity: 0; - } - - &-enter-active { - transition: all 150ms ease-out; - } - - &-leave-active { - transition: all 150ms ease-out; - } -} - -//Styles - -.journal-wrapper { - width: 1350px; - padding: 1em 0; -} - -.journal_warning { - text-align: center; - font-size: 1.3em; - - &.error { - background-color: var(--clr-error); - } -} - -.schedule-dates > * { - margin-right: 0.25em; -} - -.journal_item, -.journal_warning { - background: #202020; - padding: 1em; - margin: 1em 0; -} - -.journal_top-bar { - display: flex; - justify-content: space-between; - align-items: center; -} - -button.btn { - padding: 0.5em 0.7em; -} - -@include smallScreen() { - .journal-wrapper { - font-size: 1.25em; - } - - .journal_top-bar { - justify-content: center; - flex-wrap: wrap; - } -} +@import 'responsive.scss'; + +// Animations +.warning { + &-enter-from, + &-leave-to { + opacity: 0; + } + + &-enter-active { + transition: all 150ms ease-out; + } + + &-leave-active { + transition: all 150ms ease-out; + } +} + +//Styles + +.journal-wrapper { + max-width: 1350px; + width: 100%; + + padding: 1em 0; +} + +.journal_warning { + text-align: center; + font-size: 1.3em; + + &.error { + background-color: var(--clr-error); + } +} + +.schedule-dates > * { + margin-right: 0.25em; +} + +.journal_item, +.journal_warning { + background: #202020; + padding: 1em; + margin: 1em 0; +} + +.journal_top-bar { + display: flex; + justify-content: space-between; + align-items: center; +} + +button.btn { + padding: 0.5em 0.7em; +} + +@include smallScreen() { + .journal-wrapper { + font-size: 1.25em; + } + + .journal_top-bar { + justify-content: center; + flex-wrap: wrap; + } +} diff --git a/src/styles/global.scss b/src/styles/global.scss index c46e3c9..68dd4a2 100644 --- a/src/styles/global.scss +++ b/src/styles/global.scss @@ -282,3 +282,18 @@ ul { transform: translateX(-50%); } } + +@include smallScreen { + ::-webkit-scrollbar { + width: 0.5em; + height: 0.5em; + + &-track { + background-color: #222; + } + + &-thumb { + background-color: #777; + } + } +} diff --git a/src/types/JournalTimetablesTypes.ts b/src/types/JournalTimetablesTypes.ts new file mode 100644 index 0000000..0805257 --- /dev/null +++ b/src/types/JournalTimetablesTypes.ts @@ -0,0 +1,3 @@ +export type JournalTimetableSearcher = { + [key in 'search-driver' | 'search-train']: string; +}; - +