single API requests before recieving the data

This commit is contained in:
2023-04-28 16:18:52 +02:00
parent 0be6adb7d2
commit dd075d2982
5 changed files with 80 additions and 63 deletions
+2 -2
View File
@@ -179,8 +179,8 @@ export default defineComponent({
}
},
players (): { [key: string]: Player } {
const data = this.store.getPlayerList(this.filters || {})?.data
if (!data) return {}
const data = this.store.getPlayerList(this.filters || {})?.value.data
if (!data) return this.store.fetchPlayers(this.filters || {}).value.data
const cut = Object.entries(data).sort((a, b) => {
if (a[1].kills < b[1].kills) {
return 1
+3 -1
View File
@@ -46,7 +46,9 @@ export default defineComponent({
computed: {
players (): { [key: string]: Player } {
const { player: _, ...withoutPlayer } = this.filters
return this.store.getPlayerList(withoutPlayer)?.data || {}
const data = this.store.getPlayerList(withoutPlayer)?.value.data
if (!data) return this.store.fetchPlayers(withoutPlayer).value.data
return data
}
},
watch: {
+2 -5
View File
@@ -137,11 +137,8 @@ export default defineComponent({
},
weapons (): { [key: string]: Weapon } {
const { weapon: _, ...withoutWeapon } = this.filters || {}
const data = this.store.getWeaponList(withoutWeapon)?.data
if (!data) {
this.store.fetchWeapons(withoutWeapon)
return {}
}
const data = this.store.getWeaponList(withoutWeapon)?.value.data
if (!data) return this.store.fetchWeapons(withoutWeapon).value.data
return data
},
sortedWeaponList (): string[] {
+64 -40
View File
@@ -1,10 +1,22 @@
import { defineStore } from 'pinia'
import * as assert from 'assert'
import { Ref, ref } from 'vue'
function removeNullEntries (a:any) {
return Object.fromEntries(Object.entries(a).filter(e => e[1] !== undefined && e[1] !== null))
export interface Filters {
server?: string;
player?: string;
weapon?: string;
host?: string;
map?: string;
gamemode?: string;
}
function objectEqual (a:any, b:any) {
function removeNullEntries (a: Filters) {
return Object.fromEntries(
Object.entries(a).filter((e) => e[1] !== undefined && e[1] !== null)
)
}
function objectEqual (a: Filters, b: Filters) {
try {
a = removeNullEntries(a)
b = removeNullEntries(b)
@@ -14,14 +26,6 @@ function objectEqual (a:any, b:any) {
return false
}
}
export interface Filters {
server?: string;
player?: string;
weapon?: string;
host?: string;
map?: string;
gamemode?: string;
}
export interface Kill {
deaths: number;
@@ -53,11 +57,11 @@ export interface Server extends Kill {
// define your typings for the store state
export interface State {
servers: KillData<Server>[];
players: KillData<Player>[];
weapons: KillData<Weapon>[];
maps: KillData<Kill>[];
gamemodes: KillData<Kill>[];
servers: Ref<KillData<Server>>[];
players: Ref<KillData<Player>>[];
weapons: Ref<KillData<Weapon>>[];
maps: Ref<KillData<Kill>>[];
gamemodes: Ref<KillData<Kill>>[];
hosts: { [key: number]: string };
}
@@ -71,43 +75,63 @@ export const useKillStore = defineStore('kill', {
hosts: {}
}),
getters: {
getPlayerList: (state) => (filters: Filters) => state.players.find((e) => objectEqual(e.filter, filters)),
getWeaponList: (state) => (filters: Filters) => state.weapons.find((e) => objectEqual(e.filter, filters)),
getServerList: (state) => (filters: Filters) => state.servers.find((e) => objectEqual(e.filter, filters))
getPlayerList: (state) => (filters: Filters) => {
return state.players.find((e) => objectEqual(e.value.filter, filters))
},
getWeaponList: (state) => (filters: Filters) =>
state.weapons.find((e) => objectEqual(e.value.filter, filters)),
getServerList: (state) => (filters: Filters) =>
state.servers.find((e) => objectEqual(e.value.filter, filters))
},
actions: {
async fetchPlayers (filter: Filters) {
fetchPlayers (filter: Filters) {
filter = removeNullEntries(filter)
const response = await fetch(
let entry = this.players.find((e) => objectEqual(e.value.filter, filter))
if (entry === undefined) {
entry = ref({ filter, data: {} })
this.players.push(entry)
}
fetch(
'https://tone.sleepycat.date/v2/client/players?' +
new URLSearchParams(filter as Record<keyof Filters, string>)
)
const data = await response.json()
const entry = this.players.find((e) => objectEqual(e.filter, filter))
if (!entry) return this.players.push({ filter, data })
entry.data = data
).then(async response => {
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
entry!.value.data = await response.json()
})
return entry
},
async fetchWeapons (filter: Filters) {
fetchWeapons (filter: Filters) {
filter = removeNullEntries(filter)
const response = await fetch(
let entry = this.weapons.find((e) => objectEqual(e.value.filter, filter))
if (!entry) {
entry = ref({ filter, data: {} })
this.weapons.push(entry)
}
fetch(
'https://tone.sleepycat.date/v2/client/weapons?' +
new URLSearchParams(filter as Record<keyof Filters, string>)
)
const data = await response.json()
const entry = this.weapons.find((e) => objectEqual(e.filter, filter))
if (!entry) return this.weapons.push({ filter, data })
entry.data = data
).then(async response => {
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
entry!.value.data = await response.json()
})
return entry
},
async fetchServers (filter: Filters) {
fetchServers (filter: Filters) {
filter = removeNullEntries(filter)
const response = await fetch(
let entry = this.servers.find((e) => objectEqual(e.value.filter, filter))
if (!entry) {
entry = ref({ filter, data: {} })
this.servers.push(entry)
}
fetch(
'https://tone.sleepycat.date/v2/client/servers?' +
new URLSearchParams(filter as Record<keyof Filters, string>)
)
const data = await response.json()
const entry = this.servers.find((e) => objectEqual(e.filter, filter))
if (!entry) return this.servers.push({ filter, data })
entry.data = data
).then(async response => {
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
entry!.value.data = await response.json()
})
return entry
}
}
})
+9 -15
View File
@@ -58,12 +58,10 @@ export default defineComponent({
},
computed: {
servers (): { [key: string]: Server } {
// eslint-disable-next-line @typescript-eslint/no-unused-vars
const { server: _, player: _1, ...withoutServer } = this.filters
const data = this.store.getServerList(withoutServer)?.data
if (!data) {
this.store.fetchServers(withoutServer)
return {}
}
const data = this.store.getServerList(withoutServer)?.value.data
if (!data) return this.store.fetchServers(withoutServer).value.data
return data
},
groupedServers () {
@@ -75,21 +73,17 @@ export default defineComponent({
return hosts
},
weapons (): { [key: string]: Weapon } {
// eslint-disable-next-line @typescript-eslint/no-unused-vars
const { weapon: _, player: _1, ...withoutWeapons } = this.filters
const data = this.store.getWeaponList(withoutWeapons)?.data
if (!data) {
this.store.fetchWeapons(withoutWeapons)
return {}
}
const data = this.store.getWeaponList(withoutWeapons)?.value.data
if (!data) return this.store.fetchWeapons(withoutWeapons).value.data
return data
},
players (): { [key: string]: Player } {
// eslint-disable-next-line @typescript-eslint/no-unused-vars
const { player: _, ...withoutPlayers } = this.filters
const data = this.store.getPlayerList(withoutPlayers)?.data
if (!data) {
this.store.fetchPlayers(withoutPlayers)
return {}
}
const data = this.store.getPlayerList(withoutPlayers)?.value.data
if (!data) return this.store.fetchPlayers(withoutPlayers).value.data
return data
},
sortedWeaponList (): string[] {