Poprawiono sortowanie stacji

This commit is contained in:
2022-08-27 13:44:04 +02:00
parent 7857377cab
commit bc3a603ba2
2 changed files with 28 additions and 14 deletions
+4 -1
View File
@@ -4,6 +4,9 @@ import StorageManager from './storageManager';
const sortStations = (a: Station, b: Station, sorter: { index: number; dir: number }) => { const sortStations = (a: Station, b: Station, sorter: { index: number; dir: number }) => {
switch (sorter.index) { switch (sorter.index) {
case 0:
return sorter.dir == 1 ? a.name.localeCompare(b.name) : b.name.localeCompare(a.name);
case 1: case 1:
if ((a.generalInfo?.reqLevel || 0) > (b.generalInfo?.reqLevel || 0)) return sorter.dir; if ((a.generalInfo?.reqLevel || 0) > (b.generalInfo?.reqLevel || 0)) return sorter.dir;
if ((a.generalInfo?.reqLevel || 0) < (b.generalInfo?.reqLevel || 0)) return -sorter.dir; if ((a.generalInfo?.reqLevel || 0) < (b.generalInfo?.reqLevel || 0)) return -sorter.dir;
@@ -50,7 +53,7 @@ const sortStations = (a: Station, b: Station, sorter: { index: number; dir: numb
break; break;
} }
return sorter.dir == 1 ? a.name.localeCompare(b.name) : b.name.localeCompare(a.name); return a.name.localeCompare(b.name);
}; };
const filterStations = (station: Station, filters: Filter) => { const filterStations = (station: Station, filters: Filter) => {
+23 -12
View File
@@ -14,7 +14,7 @@
</div> </div>
<StationTable <StationTable
:stations="computedStations" :stations="computedStationList"
:sorterActive="filterManager.getSorter()" :sorterActive="filterManager.getSorter()"
:setFocusedStation="setFocusedStation" :setFocusedStation="setFocusedStation"
:changeSorter="changeSorter" :changeSorter="changeSorter"
@@ -25,13 +25,11 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import inputData from '../data/options.json'; import inputData from '../data/options.json';
import { computed, ComputedRef, defineComponent, reactive } from 'vue'; import { defineComponent, reactive } from 'vue';
import { useStore } from '../store/store'; import { useStore } from '../store/store';
import StationFilterManager from '../scripts/managers/stationFilterManager'; import StationFilterManager from '../scripts/managers/stationFilterManager';
import Station from '../scripts/interfaces/Station';
import StorageManager from '../scripts/managers/storageManager'; import StorageManager from '../scripts/managers/storageManager';
import StationTable from '../components/StationsView/StationTable.vue'; import StationTable from '../components/StationsView/StationTable.vue';
import StationFilterCard from '../components/StationsView/StationFilterCard.vue'; import StationFilterCard from '../components/StationsView/StationFilterCard.vue';
@@ -43,29 +41,35 @@ export default defineComponent({
StationFilterCard, StationFilterCard,
SelectBox, SelectBox,
}, },
data: () => ({ data: () => ({
filterCardOpen: false, filterCardOpen: false,
modalHidden: true, modalHidden: true,
STORAGE_KEY: 'options_saved', STORAGE_KEY: 'options_saved',
inputs: inputData, inputs: inputData,
focusedStationName: '',
}), }),
setup() { setup() {
const store = useStore(); const store = useStore();
const filterManager = reactive(new StationFilterManager()); const filterManager = reactive(new StationFilterManager());
const focusedStationName = '';
const computedStations: ComputedRef<Station[]> = computed(
() => filterManager.getFilteredStationList(store.stationList, store.region.id)
// .filter((station) => !station.onlineInfo || station.onlineInfo.region == store.region.id)
);
return { return {
computedStations,
filterManager, filterManager,
focusedStationName, store,
}; };
}, },
computed: {
computedStationList() {
const list = this.filterManager.getFilteredStationList(this.store.stationList, this.store.region.id);
console.log(list.map((station) => `${station.name} ${station.onlineInfo?.statusTimestamp}`));
return list;
},
},
mounted() { mounted() {
if (!StorageManager.isRegistered(this.STORAGE_KEY)) return; if (!StorageManager.isRegistered(this.STORAGE_KEY)) return;
@@ -83,27 +87,34 @@ export default defineComponent({
slider.value = value; slider.value = value;
}); });
}, },
methods: { methods: {
toggleCardsState(name: string): void { toggleCardsState(name: string): void {
if (name == 'filter') { if (name == 'filter') {
this.filterCardOpen = !this.filterCardOpen; this.filterCardOpen = !this.filterCardOpen;
} }
}, },
changeSorter(index: number) { changeSorter(index: number) {
this.filterManager.changeSorter(index); this.filterManager.changeSorter(index);
}, },
changeFilterValue(filter: { name: string; value: number }) { changeFilterValue(filter: { name: string; value: number }) {
this.filterManager.changeFilterValue(filter); this.filterManager.changeFilterValue(filter);
}, },
resetFilters() { resetFilters() {
this.filterManager.resetFilters(); this.filterManager.resetFilters();
}, },
invertFilters() { invertFilters() {
this.filterManager.invertFilters(); this.filterManager.invertFilters();
}, },
closeCard() { closeCard() {
this.filterCardOpen = false; this.filterCardOpen = false;
}, },
setFocusedStation(name: string) { setFocusedStation(name: string) {
this.focusedStationName = this.focusedStationName == name ? '' : name; this.focusedStationName = this.focusedStationName == name ? '' : name;
}, },