IT4Change/Ocelot-Social
3
0
Fork 0
mirror of https://github.com/IT4Change/Ocelot-Social.git synced 2025-12-13 07:45:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

Show a loading spinner for better UX

Browse Source
This commit is contained in:
Robert Schäfer 2019-06-07 00:30:40 +02:00
parent de0bcd949a
commit d3a70321b8
1 changed files with 14 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
webapp/pages/profile/_id/_slug.vue
View File

@ -187,6 +187,7 @@
primary primary
/> />
</ds-flex-item> </ds-flex-item>
<template v-if="activePosts.length"> <template v-if="activePosts.length">
<hc-post-card <hc-post-card
v-for="(post, index) in activePosts" v-for="(post, index) in activePosts"
@ -196,13 +197,24 @@
@deletePost="Post.splice(index, 1)" @deletePost="Post.splice(index, 1)"
/> />
</template> </template>
<template v-else-if="$apollo.loading">
<ds-flex-item>
<ds-section centered>
<ds-spinner size="base"></ds-spinner>
</ds-section>
</ds-flex-item>
</template>
<template v-else> <template v-else>
<ds-flex-item :width="{ base: '100%' }"> <ds-flex-item :width="{ base: '100%' }">
<hc-empty margin="xx-large" icon="file" /> <hc-empty margin="xx-large" icon="file" />
</ds-flex-item> </ds-flex-item>
</template> </template>
</ds-flex> </ds-flex>
<hc-load-more v-if="hasMore" :loading="$apollo.loading" @click="showMoreContributions" /> <hc-load-more
v-if="Post && hasMore"
:loading="$apollo.loading"
@click="showMoreContributions"
/>
</ds-flex-item> </ds-flex-item>
</ds-flex> </ds-flex>
</div> </div>
@ -315,6 +327,7 @@ export default {
methods: { methods: {
handleTab(tab) { handleTab(tab) {
this.tabActive = tab this.tabActive = tab
this.Post = null
this.filter = tabToFilterMapping({ tab, id: this.$route.params.id }) this.filter = tabToFilterMapping({ tab, id: this.$route.params.id })
}, },
uniq(items, field = 'id') { uniq(items, field = 'id') {