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

Poprawki błędów (1.3.5)

Browse Source
This commit is contained in:
Spythere
2020-12-29 01:48:10 +01:00
parent ff17b791f0
commit 709eacc980
33 changed files with 7037 additions and 7039 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/TrainsView.vue
+166 -166
View File
@@ -1,166 +1,166 @@
<template>
<section class="trains-view">
<div class="body-wrapper">
<div class="options-wrapper">
<TrainSorter :trainList="computedTrains" @changeSorter="changeSorter" />
<TrainSearch
@changeSearchedTrain="changeSearchedTrain"
@changeSearchedDriver="changeSearchedDriver"
:passedSearchedTrain="passedSearchedTrain"
:focusedTrain="focusedTrain"
/>
</div>
<TrainStats :trains="trains" />
<TrainTable
:computedTrains="computedTrains"
@changeFocusedTrain="changeFocusedTrain"
/>
</div>
</section>
</template>
<script lang="ts">
import Vue from "vue";
import { Component, Prop } from "vue-property-decorator";
import { Getter, Action } from "vuex-class";
import Station from "@/scripts/interfaces/Station";
import Train from "@/scripts/interfaces/Train";
import TrainSorter from "@/components/TrainsView/TrainSorter.vue";
import TrainSearch from "@/components/TrainsView/TrainSearch.vue";
import TrainTable from "@/components/TrainsView/TrainTable.vue";
import TrainStats from "@/components/TrainsView/TrainStats.vue";
import axios from "axios";
@Component({
components: {
TrainSorter,
TrainTable,
TrainStats,
TrainSearch,
},
})
export default class TrainsView extends Vue {
@Getter("getTrainList") trains!: Train[];
@Prop() readonly passedSearchedTrain!: string;
sorterActive: { id: string; dir: number } = { id: "timetable", dir: 1 };
searchedTrain: string = "";
searchedDriver: string = "";
focusedTrain: string = "";
changeSearchedTrain(trainNo: string) {
this.searchedTrain = trainNo;
}
changeSearchedDriver(name: string) {
this.searchedDriver = name;
}
changeFocusedTrain(trainNo: string) {
this.focusedTrain = this.focusedTrain === trainNo ? "" : trainNo;
}
changeSorter(sorter: { id: string; dir: number }) {
this.sorterActive = sorter;
}
get computedTrains() {
return this.trains
.filter(
(train) =>
train.timetableData &&
(this.searchedTrain.length > 0
? train.trainNo.toString().includes(this.searchedTrain)
: true) &&
(this.searchedDriver.length > 0
? train.driverName
.toLowerCase()
.includes(this.searchedDriver.toLowerCase())
: true)
)
.sort((a, b) => {
switch (this.sorterActive.id) {
case "mass":
if (a.mass > b.mass) return this.sorterActive.dir;
else return -this.sorterActive.dir;
break;
case "distance":
if (!a.timetableData || !b.timetableData) return 0;
if (a.timetableData.routeDistance > b.timetableData.routeDistance) return this.sorterActive.dir;
else return -this.sorterActive.dir;
break;
case "speed":
if (a.speed > b.speed) return this.sorterActive.dir;
else return -this.sorterActive.dir;
break;
case "timetable":
if (a.trainNo > b.trainNo) return this.sorterActive.dir;
else return -this.sorterActive.dir;
break;
case "length":
if (a.length > b.length) return this.sorterActive.dir;
else return -this.sorterActive.dir;
break;
default:
break;
}
return 0;
});
}
}
</script>
<style lang="scss" scoped>
@import "../styles/responsive.scss";
.trains-view {
min-height: 100%;
position: relative;
}
.body-wrapper {
margin: 1rem auto;
max-width: 1300px;
padding: 0 0.5rem;
font-size: calc(0.4rem + 0.4vw);
}
.options-wrapper {
display: flex;
flex-wrap: wrap;
& > div {
margin-right: 1rem;
}
}
@include bigScreen() {
.body-wrapper {
font-size: 0.9rem;
}
}
@include smallScreen {
.body-wrapper {
font-size: 0.8rem;
}
.options-wrapper {
justify-content: center;
}
}
</style>
<template>
<section class="trains-view">
<div class="body-wrapper">
<div class="options-wrapper">
<TrainSorter :trainList="computedTrains" @changeSorter="changeSorter" />
<TrainSearch
@changeSearchedTrain="changeSearchedTrain"
@changeSearchedDriver="changeSearchedDriver"
:passedSearchedTrain="passedSearchedTrain"
:focusedTrain="focusedTrain"
/>
</div>
<TrainStats :trains="trains" />
<TrainTable
:computedTrains="computedTrains"
@changeFocusedTrain="changeFocusedTrain"
/>
</div>
</section>
</template>
<script lang="ts">
import Vue from "vue";
import { Component, Prop } from "vue-property-decorator";
import { Getter, Action } from "vuex-class";
import Station from "@/scripts/interfaces/Station";
import Train from "@/scripts/interfaces/Train";
import TrainSorter from "@/components/TrainsView/TrainSorter.vue";
import TrainSearch from "@/components/TrainsView/TrainSearch.vue";
import TrainTable from "@/components/TrainsView/TrainTable.vue";
import TrainStats from "@/components/TrainsView/TrainStats.vue";
import axios from "axios";
@Component({
components: {
TrainSorter,
TrainTable,
TrainStats,
TrainSearch,
},
})
export default class TrainsView extends Vue {
@Getter("getTrainList") trains!: Train[];
@Prop() readonly passedSearchedTrain!: string;
sorterActive: { id: string; dir: number } = { id: "timetable", dir: 1 };
searchedTrain: string = "";
searchedDriver: string = "";
focusedTrain: string = "";
changeSearchedTrain(trainNo: string) {
this.searchedTrain = trainNo;
}
changeSearchedDriver(name: string) {
this.searchedDriver = name;
}
changeFocusedTrain(trainNo: string) {
this.focusedTrain = this.focusedTrain === trainNo ? "" : trainNo;
}
changeSorter(sorter: { id: string; dir: number }) {
this.sorterActive = sorter;
}
get computedTrains() {
return this.trains
.filter(
(train) =>
train.timetableData &&
(this.searchedTrain.length > 0
? train.trainNo.toString().includes(this.searchedTrain)
: true) &&
(this.searchedDriver.length > 0
? train.driverName
.toLowerCase()
.includes(this.searchedDriver.toLowerCase())
: true)
)
.sort((a, b) => {
switch (this.sorterActive.id) {
case "mass":
if (a.mass > b.mass) return this.sorterActive.dir;
else return -this.sorterActive.dir;
break;
case "distance":
if (!a.timetableData || !b.timetableData) return 0;
if (a.timetableData.routeDistance > b.timetableData.routeDistance) return this.sorterActive.dir;
else return -this.sorterActive.dir;
break;
case "speed":
if (a.speed > b.speed) return this.sorterActive.dir;
else return -this.sorterActive.dir;
break;
case "timetable":
if (a.trainNo > b.trainNo) return this.sorterActive.dir;
else return -this.sorterActive.dir;
break;
case "length":
if (a.length > b.length) return this.sorterActive.dir;
else return -this.sorterActive.dir;
break;
default:
break;
}
return 0;
});
}
}
</script>
<style lang="scss" scoped>
@import "../styles/responsive.scss";
.trains-view {
min-height: 100%;
position: relative;
}
.body-wrapper {
margin: 1rem auto;
max-width: 1300px;
padding: 0 0.5rem;
font-size: calc(0.4rem + 0.4vw);
}
.options-wrapper {
display: flex;
flex-wrap: wrap;
& > div {
margin-right: 1rem;
}
}
@include bigScreen() {
.body-wrapper {
font-size: 0.9rem;
}
}
@include smallScreen {
.body-wrapper {
font-size: 0.8rem;
}
.options-wrapper {
justify-content: center;
}
}
</style>