mirror of
https://github.com/Spythere/stacjownik.git
synced 2026-05-03 05:18:11 +00:00
chore(profile): improved history list design
This commit is contained in:
@@ -33,44 +33,52 @@
|
|||||||
|
|
||||||
<img v-else src="/images/icon-timetable.svg" width="25" alt="timetable icon" />
|
<img v-else src="/images/icon-timetable.svg" width="25" alt="timetable icon" />
|
||||||
|
|
||||||
<b class="text--grayed">
|
<b
|
||||||
|
class="timestamp-indicator"
|
||||||
|
:data-online="
|
||||||
|
'isOnline' in entry.value
|
||||||
|
? entry.value.isOnline
|
||||||
|
: !entry.value.terminated && entry.type != 'IssuedTimetable'
|
||||||
|
"
|
||||||
|
>
|
||||||
{{ entry.date.toLocaleString('pl-PL', { dateStyle: 'long', timeStyle: 'short' }) }}
|
{{ entry.date.toLocaleString('pl-PL', { dateStyle: 'long', timeStyle: 'short' }) }}
|
||||||
</b>
|
<span v-if="'timestampTo' in entry.value && entry.value.timestampTo" u>
|
||||||
|
-
|
||||||
<b v-if="'timestampTo' in entry.value && entry.value.timestampTo" class="text--grayed">
|
{{
|
||||||
-
|
new Date(entry.value.timestampTo).toLocaleString('pl-PL', {
|
||||||
{{
|
dateStyle:
|
||||||
new Date(entry.value.timestampTo).toLocaleString('pl-PL', {
|
new Date(entry.value.timestampTo).getDay() == entry.date.getDay()
|
||||||
dateStyle:
|
? undefined
|
||||||
new Date(entry.value.timestampTo).getDay() == entry.date.getDay()
|
: 'long',
|
||||||
? undefined
|
timeStyle: 'short'
|
||||||
: 'long',
|
})
|
||||||
timeStyle: 'short'
|
}}
|
||||||
})
|
</span>
|
||||||
}}
|
|
||||||
</b>
|
</b>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Timetables -->
|
<!-- Timetables -->
|
||||||
<div v-if="'trainNo' in entry.value">
|
<div v-if="'trainNo' in entry.value">
|
||||||
<b class="text--primary">
|
<b class="text--primary">
|
||||||
{{ entry.value.trainCategoryCode }} {{ entry.value.trainNo }}
|
{{ entry.value.trainCategoryCode }}
|
||||||
</b>
|
</b>
|
||||||
|
{{ ' ' }}
|
||||||
|
<b>{{ entry.value.trainNo }}</b>
|
||||||
<b class="text--grayed" v-if="entry.type == 'IssuedTimetable'">
|
<b class="text--grayed" v-if="entry.type == 'IssuedTimetable'">
|
||||||
{{ ' ' }} {{ t('profile.list.for') }}: {{ entry.value.driverName }}
|
{{ ' ' }} {{ t('profile.list.for') }}: {{ entry.value.driverName }}
|
||||||
</b>
|
</b>
|
||||||
{{ ' ' }}
|
{{ ' ' }}
|
||||||
<b>{{ entry.value.route.replace('|', ' > ') }}</b>
|
<b>{{ entry.value.route.replace('|', ' > ') }}</b>
|
||||||
{{ ' ' }}
|
{{ ' ' }}
|
||||||
<b>({{ entry.value.currentDistance }} / {{ entry.value.routeDistance }}km) </b>
|
<b>({{ entry.value.currentDistance }} km / {{ entry.value.routeDistance }} km) </b>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Dispatchers -->
|
<!-- Dispatchers -->
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<b class="text--primary">{{ entry.value.stationName }}</b>
|
<b class="text--primary">{{ entry.value.stationName }}</b>
|
||||||
{{ ' - ' }}
|
{{ ' - ' }}
|
||||||
<b>
|
<b class="timestamp-indicator" :data-online="entry.value.isOnline">
|
||||||
<span v-if="entry.value.isOnline">{{ t('profile.list.since') }}: </span>
|
<span v-if="entry.value.isOnline">{{ t('profile.list.online-since') }}: </span>
|
||||||
<span>{{
|
<span>{{
|
||||||
humanizeDuration(
|
humanizeDuration(
|
||||||
(entry.value.timestampTo || Date.now()) - entry.value.timestampFrom
|
(entry.value.timestampTo || Date.now()) - entry.value.timestampFrom
|
||||||
@@ -229,6 +237,14 @@ function toggleFilter(filterType: JournalEntryType) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.timestamp-indicator {
|
||||||
|
color: #ccc;
|
||||||
|
|
||||||
|
&[data-online='true'] {
|
||||||
|
color: var(--clr-success);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@include responsive.midScreen {
|
@include responsive.midScreen {
|
||||||
.history-list-box {
|
.history-list-box {
|
||||||
max-height: 100vh;
|
max-height: 100vh;
|
||||||
|
|||||||
+2
-2
@@ -638,7 +638,7 @@
|
|||||||
"created-timetables-count": "wystawione RJ jako dyżurny ruchu",
|
"created-timetables-count": "wystawione RJ jako dyżurny ruchu",
|
||||||
"longest-created-timetable": "najdłuższy wystawiony RJ",
|
"longest-created-timetable": "najdłuższy wystawiony RJ",
|
||||||
"created-timetables-length-sum": "suma długości wystawionych RJ",
|
"created-timetables-length-sum": "suma długości wystawionych RJ",
|
||||||
"no-dispatcher-stats": "Ten dyżurny nie wystawił jeszcze żadnego rozkładu jazdy"
|
"no-dispatcher-stats": "Brak zapisanych wystawionych RJ"
|
||||||
},
|
},
|
||||||
|
|
||||||
"recent-stats": {
|
"recent-stats": {
|
||||||
@@ -651,7 +651,7 @@
|
|||||||
|
|
||||||
"list": {
|
"list": {
|
||||||
"for": "dla",
|
"for": "dla",
|
||||||
"since": "od"
|
"online-since": "online od"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user