mirror of
https://github.com/Spythere/stacjownik.git
synced 2026-05-03 13:28:11 +00:00
Statystyki maszynistów
This commit is contained in:
@@ -14,6 +14,7 @@
|
|||||||
|
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<h3>STATYSTYKI WYSTAWIONYCH ROZKŁADÓW</h3>
|
<h3>STATYSTYKI WYSTAWIONYCH ROZKŁADÓW</h3>
|
||||||
|
|
||||||
<div class="info-stats" v-if="store.dispatcherStatsData._count._all">
|
<div class="info-stats" v-if="store.dispatcherStatsData._count._all">
|
||||||
<span class="stat-badge">
|
<span class="stat-badge">
|
||||||
<span>LICZBA</span>
|
<span>LICZBA</span>
|
||||||
@@ -162,42 +163,11 @@ h3 {
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.info-stats {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
margin-top: 1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.last-timetables {
|
.last-timetables {
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.stat-badge {
|
|
||||||
margin-right: 0.5em;
|
|
||||||
padding-bottom: 1em;
|
|
||||||
|
|
||||||
span {
|
|
||||||
padding: 0.25em 0.3em;
|
|
||||||
}
|
|
||||||
|
|
||||||
span:first-child {
|
|
||||||
background-color: #4d4d4d;
|
|
||||||
}
|
|
||||||
|
|
||||||
span:last-child {
|
|
||||||
background-color: $accentCol;
|
|
||||||
color: black;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@include smallScreen() {
|
|
||||||
.stats_card {
|
|
||||||
text-align: center;
|
|
||||||
left: 50%;
|
|
||||||
transform: translateX(-50%);
|
|
||||||
border-radius: 0 0 1em 1em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,51 +1,40 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="card-dimmer" @click="closeCard"></div>
|
<div class="journal-stats" v-if="store.driverStatsData?._sum.routeDistance != null">
|
||||||
|
<h1>
|
||||||
|
STATYSTYKI MASZYNISTY <span class="text--primary">{{ store.driverStatsName.toUpperCase() }}</span>
|
||||||
|
</h1>
|
||||||
|
|
||||||
<div class="stats-card card">
|
<div class="info-stats">
|
||||||
<div>
|
<span class="stat-badge">
|
||||||
<h2 class="card-title">
|
<span>ROZKŁADY JAZDY</span>
|
||||||
STATYSTYKI MASZYNISTY <span class="text--primary">{{ store.driverStatsName.toUpperCase() }}</span>
|
<span>{{ store.driverStatsData._count.fulfilled }} / {{ store.driverStatsData._count._all }}</span>
|
||||||
</h2>
|
</span>
|
||||||
|
|
||||||
<div class="loading" v-if="!store.driverStatsData">Ładowanie...</div>
|
<span class="stat-badge">
|
||||||
|
<span>NAJDŁUŻSZY RJ</span>
|
||||||
|
<span> {{ store.driverStatsData._max.routeDistance.toFixed(2) }}km </span>
|
||||||
|
</span>
|
||||||
|
|
||||||
<div v-else>
|
<span class="stat-badge">
|
||||||
<div class="info-stats" v-if="store.driverStatsData._sum.routeDistance != null">
|
<span>ŚREDNIA DŁUGOŚĆ RJ</span>
|
||||||
<span class="stat-badge">
|
<span> {{ store.driverStatsData._avg.routeDistance.toFixed(2) }}km </span>
|
||||||
<span>PRZEBYTO</span>
|
</span>
|
||||||
<span>{{ store.driverStatsData._sum.routeDistance.toFixed(2) }}km</span>
|
|
||||||
</span>
|
|
||||||
<span class="stat-badge">
|
|
||||||
<span>PORZUCONO</span>
|
|
||||||
<span>
|
|
||||||
{{ (store.driverStatsData._sum.routeDistance - store.driverStatsData._sum.currentDistance).toFixed(2) }}km
|
|
||||||
</span>
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<span class="stat-badge">
|
<span class="stat-badge">
|
||||||
<span>WYPEŁNIONO</span>
|
<span>DYSTANS</span>
|
||||||
<span>{{ store.driverStatsData._count.fulfilled }} RJ</span>
|
<span>
|
||||||
</span>
|
{{ store.driverStatsData._sum.currentDistance.toFixed(2) }} /
|
||||||
|
{{ store.driverStatsData._sum.routeDistance.toFixed(2) }}km
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
|
||||||
<span class="stat-badge">
|
<span class="stat-badge">
|
||||||
<span>PORZUCONO</span>
|
<span>STACJE</span>
|
||||||
<span>{{ store.driverStatsData._count._all - store.driverStatsData._count.fulfilled }} RJ</span>
|
<span>
|
||||||
</span>
|
{{ store.driverStatsData._sum.confirmedStopsCount }} /
|
||||||
|
{{ store.driverStatsData._sum.allStopsCount }}
|
||||||
<span class="stat-badge">
|
</span>
|
||||||
<span>ZATWIERDZONO</span>
|
</span>
|
||||||
<span>{{ store.driverStatsData._sum.confirmedStopsCount }} stacji</span>
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<span class="stat-badge">
|
|
||||||
<span>PORZUCONO</span>
|
|
||||||
<span>
|
|
||||||
{{ store.driverStatsData._sum.allStopsCount - store.driverStatsData._sum.confirmedStopsCount }}
|
|
||||||
stacji
|
|
||||||
</span>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -78,13 +67,9 @@ export default defineComponent({
|
|||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
activated() {
|
|
||||||
this.fetchDispatcherStats();
|
|
||||||
},
|
|
||||||
|
|
||||||
watch: {
|
watch: {
|
||||||
driverStatsName(value: any) {
|
driverStatsName(value: string) {
|
||||||
console.log(value);
|
this.fetchDispatcherStats();
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -92,57 +77,18 @@ export default defineComponent({
|
|||||||
async fetchDispatcherStats() {
|
async fetchDispatcherStats() {
|
||||||
this.store.driverStatsData = undefined;
|
this.store.driverStatsData = undefined;
|
||||||
|
|
||||||
|
if (!this.store.driverStatsName) return;
|
||||||
|
|
||||||
const statsData: DriverStatsAPIData = await (
|
const statsData: DriverStatsAPIData = await (
|
||||||
await axios.get(`${URLs.stacjownikAPI}/api/getDriverInfo?name=${this.store.driverStatsName}`)
|
await axios.get(`${URLs.stacjownikAPI}/api/getDriverInfo?name=${this.store.driverStatsName}`)
|
||||||
).data;
|
).data;
|
||||||
|
|
||||||
const recentTimetablesData: TimetableHistory[] = await (
|
|
||||||
await axios.get(`${URLs.stacjownikAPI}/api/getTimetables?driverName=${this.store.driverStatsName}`)
|
|
||||||
).data;
|
|
||||||
|
|
||||||
this.store.driverStatsData = statsData;
|
this.store.driverStatsData = statsData;
|
||||||
this.lastTimetables = recentTimetablesData || [];
|
|
||||||
},
|
|
||||||
|
|
||||||
closeCard() {
|
|
||||||
this.$emit('closeCard');
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import '../../styles/responsive.scss';
|
@import '../../styles/JournalStats.scss';
|
||||||
@import '../../styles/card.scss';
|
|
||||||
|
|
||||||
.timetable-row {
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: 4fr 1fr 1fr 2fr 2fr;
|
|
||||||
gap: 0.2em;
|
|
||||||
margin: 0.5em 0;
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
span {
|
|
||||||
min-width: 100px;
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
|
|
||||||
background-color: #4d4d4d;
|
|
||||||
padding: 0.5em 0.2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
@include smallScreen() {
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
span {
|
|
||||||
padding: 0.2em 0.3em;
|
|
||||||
}
|
|
||||||
|
|
||||||
grid-template-columns: 1fr;
|
|
||||||
background-color: #4d4d4d;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,28 +1,22 @@
|
|||||||
<template>
|
<template>
|
||||||
<section class="journal-timetables">
|
<section class="journal-timetables">
|
||||||
<keep-alive>
|
|
||||||
<DriverStats v-if="statsCardOpen" @close-card="statsCardOpen = false" />
|
|
||||||
</keep-alive>
|
|
||||||
|
|
||||||
<div class="journal_wrapper">
|
<div class="journal_wrapper">
|
||||||
<JournalOptions
|
<JournalOptions
|
||||||
@on-search-confirm="searchHistory"
|
@on-search-confirm="searchHistory"
|
||||||
@on-options-reset="resetOptions"
|
@on-options-reset="resetOptions"
|
||||||
:sorter-option-ids="['timetableId', 'beginDate', 'distance', 'total-stops']"
|
:sorter-option-ids="['timetableId', 'beginDate', 'distance', 'total-stops']"
|
||||||
:filters="journalTimetableFilters"
|
:filters="journalTimetableFilters"
|
||||||
:data-status="dataStatus"
|
:data-status="dataStatus"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
<DriverStats />
|
||||||
<!-- <button @click="statsCardOpen = true">Stats</button> -->
|
<!-- <button @click="statsCardOpen = true">Stats</button> -->
|
||||||
|
|
||||||
<div class="list_wrapper" @scroll="handleScroll">
|
<div class="list_wrapper" @scroll="handleScroll">
|
||||||
<!-- <transition name="warning" mode="out-in"> -->
|
<!-- <transition name="warning" mode="out-in"> -->
|
||||||
<!-- <div :key="dataStatus"> -->
|
<!-- <div :key="dataStatus"> -->
|
||||||
<Loading
|
<Loading v-if="dataStatus == DataStatus.Initialized || dataStatus == DataStatus.Loading" />
|
||||||
v-if="
|
|
||||||
dataStatus == DataStatus.Initialized || (dataStatus == DataStatus.Loading )
|
|
||||||
"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<div v-else-if="dataStatus == DataStatus.Error" class="journal_warning error">
|
<div v-else-if="dataStatus == DataStatus.Error" class="journal_warning error">
|
||||||
{{ $t('app.error') }}
|
{{ $t('app.error') }}
|
||||||
@@ -221,7 +215,8 @@ export default defineComponent({
|
|||||||
const timestampTo = timestampFrom ? timestampFrom + 86400000 : undefined;
|
const timestampTo = timestampFrom ? timestampFrom + 86400000 : undefined;
|
||||||
|
|
||||||
if (driverName) queries.push(`driverName=${driverName}`);
|
if (driverName) queries.push(`driverName=${driverName}`);
|
||||||
if (trainNo) queries.push(trainNo.startsWith('#') ? `timetableId=${trainNo.replace('#', '')}` : `trainNo=${trainNo}`);
|
if (trainNo)
|
||||||
|
queries.push(trainNo.startsWith('#') ? `timetableId=${trainNo.replace('#', '')}` : `trainNo=${trainNo}`);
|
||||||
if (authorName) queries.push(`authorName=${authorName}`);
|
if (authorName) queries.push(`authorName=${authorName}`);
|
||||||
if (timestampFrom && timestampTo) queries.push(`timestampFrom=${timestampFrom}`, `timestampTo=${timestampTo}`);
|
if (timestampFrom && timestampTo) queries.push(`timestampFrom=${timestampFrom}`, `timestampTo=${timestampTo}`);
|
||||||
|
|
||||||
|
|||||||
@@ -0,0 +1,42 @@
|
|||||||
|
@import 'variables.scss';
|
||||||
|
@import 'responsive.scss';
|
||||||
|
|
||||||
|
.journal-stats {
|
||||||
|
background-color: #1a1a1a;
|
||||||
|
padding: 1em;
|
||||||
|
margin-bottom: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-stats {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 0.5em;
|
||||||
|
|
||||||
|
margin-top: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-badge {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
span {
|
||||||
|
background-color: $accentCol;
|
||||||
|
color: black;
|
||||||
|
font-weight: bold;
|
||||||
|
padding: 0.2em 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
span:first-child {
|
||||||
|
background-color: #333;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include smallScreen {
|
||||||
|
.journal-stats {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-stats {
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user