dan/Nertivia-Client
1
0
Fork 0
mirror of https://github.com/danbulant/Nertivia-Client synced 2026-07-05 02:50:46 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

added spinner and filter params event

Browse source
This commit is contained in:
supertiger1234 2019-09-06 17:44:10 +01:00
parent e0adb5af4e
commit 87835c41eb
1 changed files with 17 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
src/components/app/Tabs/Explore/servers.vue
View file

@ -1,12 +1,11 @@
<template> <template>
<div class="servers-tab"> <div class="servers-tab">
<search-header name="servers" /> <search-header name="servers" @params="filterParamsEvent"/>
<div class="items-main-container"> <div class="items-main-container">
<div class="items-container"> <div class="items-container">
<spinner class="spinner" v-if="!publicServers" :size="80"/>
<div class="items"> <div class="items">
<server-template v-for="server in publicServers" :key="server.id" :server="server"/> <server-template v-for="server in publicServers" :key="server.id" :server="server"/>
</div> </div>
</div> </div>
</div> </div>
@ -17,21 +16,29 @@
import searchHeader from "./searchHeader"; import searchHeader from "./searchHeader";
import serverTemplate from './serverTemplate'; import serverTemplate from './serverTemplate';
import exploreService from '@/services/exploreService'; import exploreService from '@/services/exploreService';
import Spinner from "@/components/Spinner";
export default { export default {
components: { searchHeader, serverTemplate }, components: { searchHeader, serverTemplate, Spinner },
data() { data() {
return { return {
publicServers: null, publicServers: null,
params: '?verified=true'
} }
}, },
methods: { methods: {
async getServersList() { async getServersList() {
const {ok, result, error} = await exploreService.getServersList(); this.publicServers = null;
const {ok, result, error} = await exploreService.getServersList(this.params);
if (ok) { if (ok) {
this.publicServers = result.data; this.publicServers = result.data;
} }
},
filterParamsEvent(params) {
if (this.params != params) {
this.params = params || ''
this.getServersList();
}
} }
}, },
mounted() { mounted() {
@ -73,4 +80,7 @@ export default {
user-select: none; user-select: none;
} }
} }
.spinner {
align-self: center;
}
</style> </style>