Cleanup c.d.

This commit is contained in:
2022-08-27 14:05:35 +02:00
parent aae51d4139
commit 6dd8cb2dad
3 changed files with 138 additions and 148 deletions
@@ -1,116 +1,112 @@
<template> <template>
<section class="scenery-dispatchers-history scenery-section"> <section class="scenery-dispatchers-history scenery-section">
<Loading v-if="dataStatus != 2" /> <Loading v-if="dataStatus != 2" />
<div class="list-warning" v-else-if="dispatcherHistoryList.length == 0">{{ $t('scenery.history-list-empty') }}</div> <div class="list-warning" v-else-if="dispatcherHistoryList.length == 0">{{ $t('scenery.history-list-empty') }}</div>
<ul class="history-list" v-else> <ul class="history-list" v-else>
<li class="list-item" v-for="historyItem in dispatcherHistoryList"> <li class="list-item" v-for="historyItem in dispatcherHistoryList">
<div> <div>
<router-link :to="`/journal/dispatchers?dispatcherName=${historyItem.dispatcherName}`"> <router-link :to="`/journal/dispatchers?dispatcherName=${historyItem.dispatcherName}`">
<span class="text--grayed">#{{ historyItem.stationHash }}&nbsp;</span> <span class="text--grayed">#{{ historyItem.stationHash }}&nbsp;</span>
<b>{{ historyItem.dispatcherName }}</b> <b>{{ historyItem.dispatcherName }}</b>
</router-link> </router-link>
</div> </div>
<div v-if="historyItem.timestampTo"> <div v-if="historyItem.timestampTo">
<b>{{ $d(historyItem.timestampFrom) }}</b> <b>{{ $d(historyItem.timestampFrom) }}</b>
{{ timestampToString(historyItem.timestampFrom) }} {{ timestampToString(historyItem.timestampFrom) }}
- {{ timestampToString(historyItem.timestampTo) }} ({{ calculateDuration(historyItem.currentDuration) }}) - {{ timestampToString(historyItem.timestampTo) }} ({{ calculateDuration(historyItem.currentDuration) }})
</div> </div>
<div class="dispatcher-online" v-else> <div class="dispatcher-online" v-else>
{{ $t('journal.online-since') }} {{ $t('journal.online-since') }}
<b>{{ timestampToString(historyItem.timestampFrom) }}</b> <b>{{ timestampToString(historyItem.timestampFrom) }}</b>
({{ calculateDuration(historyItem.currentDuration) }}) ({{ calculateDuration(historyItem.currentDuration) }})
</div> </div>
</li> </li>
</ul> </ul>
</section> </section>
</template> </template>
<script lang="ts"> <script lang="ts">
import axios from 'axios';
import axios from 'axios'; import { defineComponent, PropType } from 'vue';
import { defineComponent, PropType } from 'vue'; import dateMixin from '../../mixins/dateMixin';
import dateMixin from '../../mixins/dateMixin'; import { DataStatus } from '../../scripts/enums/DataStatus';
import { DataStatus } from '../../scripts/enums/DataStatus'; import { DispatcherHistory } from '../../scripts/interfaces/api/DispatchersAPIData';
import { DispatcherHistory } from '../../scripts/interfaces/api/DispatchersAPIData'; import Station from '../../scripts/interfaces/Station';
import Station from '../../scripts/interfaces/Station'; import { URLs } from '../../scripts/utils/apiURLs';
import { URLs } from '../../scripts/utils/apiURLs'; import Loading from '../Global/Loading.vue';
import Loading from '../Global/Loading.vue';
export default defineComponent({
export default defineComponent({ name: 'SceneryDispatchersHistory',
name: 'SceneryDispatchersHistory', mixins: [dateMixin],
mixins: [dateMixin], props: {
props: { station: {
station: { type: Object as PropType<Station>,
type: Object as PropType<Station>, required: true,
required: true, },
}, },
}, data() {
data() { return {
return { dispatcherHistoryList: [] as DispatcherHistory[],
dispatcherHistoryList: [] as DispatcherHistory[], dataStatus: DataStatus.Loading,
dataStatus: DataStatus.Loading, };
}; },
}, mounted() {
mounted() { this.fetchAPIData();
this.fetchAPIData(); },
}, methods: {
methods: { async fetchAPIData(countFrom = 0, countLimit = 30) {
async fetchAPIData(countFrom = 0, countLimit = 30) { try {
try { const requestString = `${URLs.stacjownikAPI}/api/getDispatchers?stationName=${this.station.name}&countFrom=${countFrom}&countLimit=${countLimit}`;
const requestString = `${URLs.stacjownikAPI}/api/getDispatchers?stationName=${this.station.name}&countFrom=${countFrom}&countLimit=${countLimit}`; const historyAPIData: DispatcherHistory[] = await (await axios.get(requestString)).data;
const historyAPIData: DispatcherHistory[] = await (await axios.get(requestString)).data;
this.dispatcherHistoryList = historyAPIData;
this.dispatcherHistoryList = historyAPIData; this.dataStatus = DataStatus.Loaded;
this.dataStatus = DataStatus.Loaded; } catch (error) {
console.error(error);
console.log(this.dispatcherHistoryList); }
} catch (error) { },
console.error(error); },
} components: { Loading },
}, });
}, </script>
components: { Loading },
}); <style lang="scss" scoped>
</script> @import '../../styles/responsive.scss';
@import '../../styles/SceneryView/styles.scss';
<style lang="scss" scoped>
@import '../../styles/responsive.scss'; .history-list {
@import '../../styles/SceneryView/styles.scss'; padding: 0 0.5em;
}
.history-list {
padding: 0 0.5em; .list-item {
} display: flex;
flex-wrap: wrap;
.list-item { justify-content: space-between;
display: flex;
flex-wrap: wrap; text-align: left;
justify-content: space-between; background-color: #353535;
padding: 0.5em;
text-align: left; margin: 0.5em 0;
background-color: #353535;
padding: 0.5em; line-height: 1.5em;
margin: 0.5em 0; }
line-height: 1.5em; .dispatcher-online {
} color: springgreen;
}
.dispatcher-online {
color: springgreen; @include smallScreen {
} .history-list {
font-size: 1.2em;
@include smallScreen { }
.history-list { .list-item {
font-size: 1.2em; align-items: center;
} flex-direction: column;
.list-item { }
align-items: center; }
flex-direction: column; </style>
}
}
</style>
+26 -30
View File
@@ -1,30 +1,26 @@
import { defineComponent } from 'vue'; import { defineComponent } from 'vue';
import { useStore } from '../store/store'; import { useStore } from '../store/store';
export default defineComponent({ export default defineComponent({
setup() { setup() {
return { return {
store: useStore(), store: useStore(),
}; };
}, },
mounted() { computed: {
console.log('Mixin mounted'); chosenTrain() {
}, return this.store.trainList.find((train) => train.trainId == this.store.chosenModalTrainId);
},
computed: { },
chosenTrain() {
return this.store.trainList.find((train) => train.trainId == this.store.chosenModalTrainId); methods: {
}, selectModalTrain(trainId: string) {
}, this.store.chosenModalTrainId = trainId;
},
methods: {
selectModalTrain(trainId: string) { closeModal() {
this.store.chosenModalTrainId = trainId; this.store.chosenModalTrainId = undefined;
}, },
},
closeModal() { });
this.store.chosenModalTrainId = undefined;
},
},
});
-2
View File
@@ -64,8 +64,6 @@ export default defineComponent({
computedStationList() { computedStationList() {
const list = this.filterManager.getFilteredStationList(this.store.stationList, this.store.region.id); const list = this.filterManager.getFilteredStationList(this.store.stationList, this.store.region.id);
console.log(list.map((station) => `${station.name} ${station.onlineInfo?.statusTimestamp}`));
return list; return list;
}, },
}, },