Spythere/stacjownik
1
0
Fork 0
mirror of https://github.com/Spythere/stacjownik.git synced 2026-05-03 05:18:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: added scenery timetables history modes

Browse Source
This commit is contained in:
Spythere
2024-06-05 20:03:05 +02:00
parent 45af649505
commit c84fbbcf42
10 changed files with 105 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/JournalView/typings.ts
+3 -1
View File
@@ -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;
src/components/SceneryView/SceneryDispatchersHistory.vue
+1 -1
View File
@@ -37,7 +37,7 @@
{{ historyItem.dispatcherLevel >= 2 ? historyItem.dispatcherLevel : 'L' }}
</b>
<b v-else>?</b>
<b v-else>-</b>
</td>
<td class="text--primary">
<b>{{ historyItem.dispatcherRate }}</b>
src/components/SceneryView/SceneryInfo.vue
-5
View File
@@ -124,11 +124,6 @@ h3.section-header {
align-items: center;
font-size: 1.2em;
img {
width: 1.1em;
margin-left: 0.5em;
}
}
.info-lists {
src/components/SceneryView/SceneryTimetablesHistory.vue
+55 -16
View File
@@ -1,11 +1,19 @@
<template>
<div class="scenery-timetables-history">
<div class="top-filters">
<button class="btn btn--option checked">ROZPOCZYNA BIEG</button>
<button
class="btn btn--option"
v-for="mode in historyModeList"
:key="mode"
:class="{ checked: checkedHistoryMode == mode }"
@click="checkHistoryMode(mode)"
>
{{ $t(`scenery.timetable-${mode}`) }}
</button>
<button class="btn btn--option checked">PRZEZ</button>
<!-- <button class="btn btn--option checked">PRZEZ</button> -->
<button class="btn btn--option checked">KOŃCZY BIEG</button>
<!-- <button class="btn btn--option checked">KOŃCZY BIEG</button> -->
</div>
<div class="history-wrapper">
@@ -18,11 +26,11 @@
<table class="scenery-history-table" v-else>
<thead>
<th>{{ $t('scenery.timetables-history-id') }}</th>
<th>{{ $t('scenery.timetables-history-number') }}</th>
<th>{{ $t('scenery.timetables-history-route') }}</th>
<th style="width: 15%">{{ $t('scenery.timetables-history-number') }}</th>
<th style="width: 25%">{{ $t('scenery.timetables-history-route') }}</th>
<th>{{ $t('scenery.timetables-history-driver') }}</th>
<th>{{ $t('scenery.timetables-history-author') }}</th>
<th>{{ $t('scenery.timetables-history-date') }}</th>
<th style="width: 20%">{{ $t('scenery.timetables-history-date') }}</th>
</thead>
<tbody>
@@ -33,7 +41,7 @@
</router-link>
</td>
<td>
<b class="text--primary">{{ historyItem.trainCategoryCode }}</b> <br />
<b class="text--primary">{{ historyItem.trainCategoryCode }}</b>
{{ historyItem.trainNo }}
</td>
<td>{{ historyItem.route.replace('|', ' -> ') }}</td>
@@ -52,8 +60,14 @@
<i v-else>{{ $t('scenery.timetable-author-unknown') }}</i>
</td>
<td>
<b>{{ localeDay(historyItem.beginDate, $i18n.locale) }}</b>
{{ localeTime(historyItem.beginDate, $i18n.locale) }}
<b>{{
localeDateTime(
historyItem.createdAt > historyItem.beginDate
? historyItem.beginDate
: historyItem.createdAt,
$i18n.locale
)
}}</b>
</td>
</tr>
</tbody>
@@ -77,6 +91,9 @@ import { API } from '../../typings/api';
import { ActiveScenery, Station, Status } from '../../typings/common';
import { useApiStore } from '../../store/apiStore';
const historyModeList = ['issuedFrom', 'terminatingAt', 'via'] as const;
type HistoryMode = (typeof historyModeList)[number];
export default defineComponent({
name: 'SceneryTimetablesHistory',
mixins: [dateMixin],
@@ -92,9 +109,13 @@ export default defineComponent({
data() {
return {
historyList: [] as API.TimetableHistory.Response,
historyModeList,
apiStore: useApiStore(),
dataStatus: Status.Data.Loading,
DataStatus: Status.Data
DataStatus: Status.Data,
checkedHistoryMode: 'issuedFrom' as HistoryMode
};
},
@@ -104,17 +125,22 @@ export default defineComponent({
methods: {
async fetchAPIData() {
if (!this.station && !this.onlineScenery) {
const stationName = this.$route.query['station'];
if (!stationName) {
this.historyList = [];
this.dataStatus = Status.Data.Loaded;
return;
}
const requestFilters: Record<string, any> = {};
requestFilters[this.checkedHistoryMode] = stationName.toString();
requestFilters.countLimit = 30;
try {
const response: API.TimetableHistory.Response = await (
await this.apiStore.client!.get('api/getTimetables', {
params: {
issuedFrom: this.station?.name || this.onlineScenery?.name
}
params: requestFilters
})
).data;
@@ -126,11 +152,17 @@ export default defineComponent({
}
},
checkHistoryMode(mode: HistoryMode) {
this.checkedHistoryMode = mode;
this.dataStatus = Status.Data.Loading;
this.fetchAPIData();
},
navigateToHistory() {
this.$router.push({
path: '/journal/timetables',
query: {
'search-issuedFrom': this.station?.name || this.onlineScenery?.name
[`search-${this.checkedHistoryMode}`]: this.station?.name || this.onlineScenery?.name
}
});
}
@@ -149,7 +181,7 @@ export default defineComponent({
display: grid;
gap: 1em;
grid-template-rows: 40px auto 40px;
grid-template-rows: auto 1fr 40px;
}
.history-wrapper {
@@ -160,7 +192,14 @@ export default defineComponent({
.top-filters {
display: flex;
justify-content: center;
flex-wrap: wrap;
gap: 0.5em;
padding: 0.25em;
button {
padding: 0.35em;
min-width: 120px;
}
}
</style>
src/locales/en.json
+7 -1
View File
@@ -125,7 +125,9 @@
"search-dispatcher": "Dispatcher name",
"search-station": "Scenery name",
"search-author": "Timetable author name",
"search-issuedFrom": "Origin scenery name",
"search-issuedFrom": "Issuing scenery name",
"search-via": "Via scenery name",
"search-terminatingAt": "Terminating scenery name",
"search-timetables-date": "Timetable date (UTC+2 / CEST)",
"search-dispatchers-date": "Service date (UTC+2 / CEST)",
"search-date": "Date (UTC+2 / CEST)",
@@ -493,6 +495,10 @@
"option-timetables-history": "Timetables history PL1",
"option-dispatchers-history": "Dispatchers history PL1",
"timetable-via": "ALL TIMETABLES",
"timetable-issuedFrom": "BEGINS HERE",
"timetable-terminatingAt": "TERMINATES HERE",
"timetable-author-title": "Issued by",
"timetable-author-unknown": "Author unknown",
src/locales/pl.json
+6
View File
@@ -122,6 +122,8 @@
"search-station": "Nazwa scenerii",
"search-author": "Nick autora rozkładu jazdy",
"search-issuedFrom": "Sceneria początkowa",
"search-via": "Przez scenerię",
"search-terminatingAt": "Sceneria końcowa",
"search-timetables-date": "Data rozkładu jazdy (UTC+2 / CEST)",
"search-dispatchers-date": "Data służby (UTC+2 / CEST)",
"search-date": "Data (UTC+2 / CEST)",
@@ -476,6 +478,10 @@
"option-timetables-history": "Historia rozkładów PL1",
"option-dispatchers-history": "Historia dyżurów PL1",
"timetable-via": "WSZYSTKIE RJ",
"timetable-issuedFrom": "ROZPOCZYNA BIEG",
"timetable-terminatingAt": "KOŃCZY BIEG",
"timetable-author-title": "Wydany przez",
"timetable-author-unknown": "Autor nieznany",
src/styles/JournalSection.scss
+1 -1
View File
@@ -4,7 +4,7 @@
.list_wrapper {
overflow-y: auto;
height: 90vh;
min-height: 550px;
min-height: 650px;
margin-top: 0.5em;
position: relative;
src/styles/sceneryViewTables.scss
+1
View File
@@ -1,5 +1,6 @@
table.scenery-history-table {
width: 100%;
min-width: 900px;
border-collapse: collapse;
thead {
src/views/JournalTimetables.vue
+21 -5
View File
@@ -126,6 +126,8 @@ interface TimetablesQueryParams {
dateTo?: string;
issuedFrom?: string;
terminatingAt?: string;
via?: string;
countFrom?: number;
countLimit?: number;
@@ -206,6 +208,8 @@ export default defineComponent({
'search-driver': '',
'search-dispatcher': '',
'search-issuedFrom': '',
'search-via': '',
'search-terminatingAt': '',
'search-date': ''
} as Journal.TimetableSearchType);
@@ -299,11 +303,17 @@ export default defineComponent({
},
setOptions(options: { [key: string]: string }) {
this.searchersValues['search-date'] = options['search-date'] ?? '';
this.searchersValues['search-driver'] = options['search-driver'] ?? '';
this.searchersValues['search-train'] = options['search-train'] ?? '';
this.searchersValues['search-dispatcher'] = options['search-dispatcher'] ?? '';
this.searchersValues['search-issuedFrom'] = options['search-issuedFrom'] ?? '';
Object.keys(this.searchersValues).forEach((v) => {
this.searchersValues[v as Journal.TimetableSearchKey] = options[v] ?? '';
});
// this.searchersValues['search-date'] = options['search-date'] ?? '';
// this.searchersValues['search-driver'] = options['search-driver'] ?? '';
// this.searchersValues['search-train'] = options['search-train'] ?? '';
// this.searchersValues['search-dispatcher'] = options['search-dispatcher'] ?? '';
// this.searchersValues['search-issuedFrom'] = options['search-issuedFrom'] ?? '';
// this.searchersValues['search-via'] = options['search-via'] ?? '';
// this.searchersValues['search-terminatingAt'] = options['search-terminatingAt'] ?? '';
this.sorterActive.id =
(options['sorter-active'] as Journal.TimetableSorterKey) ?? 'timetableId';
@@ -347,6 +357,8 @@ export default defineComponent({
const authorName = this.searchersValues['search-dispatcher'].trim() || undefined;
const dateFrom = this.searchersValues['search-date'].trim() || undefined;
const issuedFrom = this.searchersValues['search-issuedFrom'].trim() || undefined;
const via = this.searchersValues['search-via'].trim() || undefined;
const terminatingAt = this.searchersValues['search-terminatingAt'].trim() || undefined;
let dateTo: string | undefined = undefined;
@@ -418,6 +430,10 @@ export default defineComponent({
queryParams['authorName'] = authorName;
queryParams['dateFrom'] = dateFrom;
queryParams['dateTo'] = dateTo;
queryParams['issuedFrom'] = issuedFrom;
queryParams['terminatingAt'] = terminatingAt;
queryParams['via'] = via;
queryParams['issuedFrom'] = issuedFrom;
queryParams['sortBy'] =
this.sorterActive.id != 'timetableId' ? this.sorterActive.id : undefined;
src/views/SceneryView.vue
+10 -17
View File
@@ -22,8 +22,8 @@
v-for="(viewMode, i) in viewModes"
:key="i"
class="btn btn--option"
:class="{ checked: currentMode == viewMode.component }"
@click="setViewMode(viewMode.component)"
:data-checked="currentMode == viewMode.component"
>
{{ $t(viewMode.id) }}
</button>
@@ -223,26 +223,25 @@ button.back-btn {
}
}
.scenery-left {
.scenery-left,
.scenery-right {
position: relative;
overflow: auto;
background-color: #181818;
padding: 1em 0.5em;
height: calc(100vh - 0.5em);
min-height: 800px;
overflow: auto;
max-height: 2000px;
}
.scenery-left {
display: flex;
flex-direction: column;
}
.scenery-right {
background: #181818;
padding: 1em 0.5em;
height: calc(100vh - 0.5em);
min-height: 800px;
display: grid;
grid-template-rows: auto 1fr;
gap: 1em;
@@ -254,18 +253,12 @@ button.back-btn {
.info-actions {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
justify-content: center;
gap: 0.75em;
.btn {
button {
padding: 0.5em;
box-shadow: 0 0 10px 4px #242424;
&[data-checked='true'] {
color: var(--clr-primary);
}
}
}