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

Dodano możliwość podglądu uwag eksploatacyjnych rozkładu jazdy

Browse Source
This commit is contained in:
Spythere
2022-01-06 21:15:16 +01:00
parent 11c6f25988
commit 6e28263b01
4 changed files with 64 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/icon-warning.svg
+4
View File
@@ -0,0 +1,4 @@
<svg width="160" height="145" viewBox="0 0 160 145" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M80 0L160 145H80H0L80 0Z" fill="#F2E147"/>
<path d="M86.08 54.4465V84.3335C86.08 87.5033 85.9233 90.6209 85.6098 93.6862C85.2963 96.7167 84.8783 99.9388 84.3558 103.352H75.63C75.1075 99.9388 74.6895 96.7167 74.376 93.6862C74.0625 90.6209 73.9058 87.5033 73.9058 84.3335V54.4465H86.08ZM71.9203 122.894C71.9203 121.814 72.1118 120.787 72.495 119.811C72.913 118.836 73.4703 118 74.167 117.303C74.8985 116.607 75.7519 116.049 76.7273 115.631C77.7026 115.213 78.7476 115.004 79.8623 115.004C80.9421 115.004 81.9697 115.213 82.945 115.631C83.9203 116.049 84.7563 116.607 85.453 117.303C86.1497 118 86.707 118.836 87.125 119.811C87.543 120.787 87.752 121.814 87.752 122.894C87.752 124.009 87.543 125.054 87.125 126.029C86.707 126.969 86.1497 127.788 85.453 128.485C84.7563 129.181 83.9203 129.721 82.945 130.105C81.9697 130.523 80.9421 130.732 79.8623 130.732C78.7476 130.732 77.7026 130.523 76.7273 130.105C75.7519 129.721 74.8985 129.181 74.167 128.485C73.4703 127.788 72.913 126.969 72.495 126.029C72.1118 125.054 71.9203 124.009 71.9203 122.894Z" fill="black"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

src/components/TrainsView/TrainSchedule.vue
+17 -2
View File
@@ -14,7 +14,10 @@
{{ Math.floor(stop.stopDistance) }}
</span>
<span class="stop-name" v-html="stop.stopName"></span>
<span class="stop-name">
<span v-html="stop.stopName"></span>
<img v-if="stop.comments" :src="icons.warning" :title="`Uwagi eksploatacyjne: ${stop.comments}`">
</span>
<span class="stop-date">
<span
class="date arrival"
@@ -59,6 +62,7 @@
</span>
</span>
<div class="stop_line" v-if="i < followingStops.length - 1">
<div class="progress-bar"></div>
@@ -88,8 +92,15 @@ export default defineComponent({
required: true,
},
},
emits: ['click'],
data: () => ({
icons: {
warning: require("@/assets/icon-warning.svg")
}
}),
setup(props) {
return {
lastConfirmed: computed(() => {
@@ -177,7 +188,6 @@ $stopNameClr: #22a8d1;
top: -1px;
left: -17px;
height: 100%;
width: 3px;
@@ -335,6 +345,11 @@ ul.stop_list > li.stop {
display: flex;
align-items: center;
img {
width: 1em;
margin-left: 0.5em;
}
}
.stop-date {
src/components/TrainsView/TrainTable.vue
+41 -18
View File
@@ -19,10 +19,9 @@
:key="i"
tabindex="0"
@keydown.enter="changeScheduleShowState(train.timetableData?.timetableId)"
:ref="el => registerReference(el, train.timetableData?.timetableId)"
:ref="(el) => registerReference(el, train.timetableData?.timetableId)"
>
<div class="wrapper" @click="changeScheduleShowState(train.timetableData?.timetableId)">
<div class="row-wrapper" @click="changeScheduleShowState(train.timetableData?.timetableId)">
<span class="info">
<div class="info_timetable" v-if="!train.timetableData">
<div class="timetable_general">
@@ -58,7 +57,10 @@
<span class="activator">
SRJP
<img :src="showedSchedule == train.timetableData.timetableId ? ascSVG : descSVG" alt="arrow-icon" />
<img
:src="showedSchedule == train.timetableData.timetableId ? icons.arrowAsc : icons.arrowDesc"
alt="arrow-icon"
/>
</span>
<span class="content"> {{ $t('trains.detailed-timetable') }} {{ train.trainNo }} </span>
@@ -77,6 +79,10 @@
</span>
</div>
</div>
<div class="info_comments" v-if="hasTimetableComments(train.timetableData)">
<img :src="icons.warning" title="Pociąg z uwagami eksplatacyjnymi" />
</div>
</span>
<span class="driver">
@@ -168,8 +174,11 @@ export default defineComponent({
showedSchedule: 0,
defaultLocoImage: require('@/assets/unknown.png'),
ascSVG: require('@/assets/icon-arrow-asc.svg'),
descSVG: require('@/assets/icon-arrow-desc.svg'),
icons: {
warning: require('@/assets/icon-warning.svg'),
arrowAsc: require('@/assets/icon-arrow-asc.svg'),
arrowDesc: require('@/assets/icon-arrow-desc.svg'),
},
stats: {
main: [
@@ -261,7 +270,7 @@ export default defineComponent({
},
registerReference(el: HTMLElement, timetableId: number | undefined) {
if(timetableId) this.elList[timetableId] = el;
if (timetableId) this.elList[timetableId] = el;
},
focusOnTrain(trainNoStr: string) {
@@ -321,6 +330,10 @@ export default defineComponent({
return '';
},
hasTimetableComments(timetableData: Train['timetableData']) {
return timetableData?.followingStops.some((stop) => stop.comments) || false;
},
},
activated() {
@@ -374,6 +387,16 @@ img.train-image {
background-color: var(--clr-secondary);
cursor: pointer;
.row-wrapper {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(20em, 1fr));
grid-template-rows: 1fr;
@include smallScreen() {
font-size: 1.2em;
}
}
}
&_cars {
@@ -384,18 +407,12 @@ img.train-image {
}
}
.wrapper {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(20em, 1fr));
grid-template-rows: 1fr;
@include smallScreen() {
font-size: 1.2em;
}
}
.info {
.timetable {
display: flex;
flex-direction: column;
justify-content: space-between;
& .timetable {
&_hero {
display: flex;
}
@@ -450,6 +467,12 @@ img.train-image {
}
}
}
&_comments {
img {
width: 2em;
}
}
}
.driver {
src/store/index.ts
+2
View File
@@ -219,6 +219,8 @@ export const store = createStore<State>({
stopType: point.pointStopType,
stopDistance: point.pointDistance,
comments: point.comments,
mainStop: point.pointName.includes("strong"),
arrivalLine,