Merge branch 'issue-389-search-loading-icon' into 'develop'

#389: add loading icon in search panel

Closes #389

See merge request pleroma/pleroma-fe!610
This commit is contained in:
Shpuld Shpludson 2019-02-24 16:24:53 +00:00
commit 1dd7120e16
2 changed files with 12 additions and 2 deletions

View file

@ -10,7 +10,8 @@ const userSearch = {
data () {
return {
username: '',
users: []
users: [],
loading: false
}
},
mounted () {
@ -30,8 +31,10 @@ const userSearch = {
this.users = []
return
}
this.loading = true
userSearchApi.search({query, store: this.$store})
.then((res) => {
this.loading = false
this.users = res
})
}

View file

@ -9,7 +9,10 @@
<i class="icon-search"/>
</button>
</div>
<div class="panel-body">
<div v-if="loading" class="text-center loading-icon">
<i class="icon-spin3 animate-spin"/>
</div>
<div v-else class="panel-body">
<user-card v-for="user in users" :key="user.id" :user="user" :showFollows="true"></user-card>
</div>
</div>
@ -27,4 +30,8 @@
margin-left: 0.5em;
}
}
.loading-icon {
padding: 1em;
}
</style>