Page MenuHomePhorge
Files F85629914

No OneTemporary
Actions

Size
2 KB
Referenced Files
None
Subscribers
None

View Options

diff --git a/src/components/user_search/user_search.js b/src/components/user_search/user_search.js
index 9c02627652..be6c3bd776 100644
--- a/src/components/user_search/user_search.js
+++ b/src/components/user_search/user_search.js
@@ -1,41 +1,44 @@
import UserCard from '../user_card/user_card.vue'
import userSearchApi from '../../services/new_api/user_search.js'
const userSearch = {
components: {
UserCard
},
props: [
'query'
],
data () {
return {
username: '',
- users: []
+ users: [],
+ loading: false
}
},
mounted () {
this.search(this.query)
},
watch: {
query (newV) {
this.search(newV)
}
},
methods: {
newQuery (query) {
this.$router.push({ name: 'user-search', query: { query } })
},
search (query) {
if (!query) {
this.users = []
return
}
+ this.loading = true
userSearchApi.search({query, store: this.$store})
.then((res) => {
+ this.loading = false
this.users = res
})
}
}
}
export default userSearch
diff --git a/src/components/user_search/user_search.vue b/src/components/user_search/user_search.vue
index 3c2bd3fb3b..0b03d98afb 100644
--- a/src/components/user_search/user_search.vue
+++ b/src/components/user_search/user_search.vue
@@ -1,30 +1,37 @@
<template>
<div class="user-search panel panel-default">
<div class="panel-heading">
{{$t('nav.user_search')}}
</div>
<div class="user-search-input-container">
<input class="user-finder-input" @keyup.enter="newQuery(username)" v-model="username" :placeholder="$t('finder.find_user')"/>
<button class="btn search-button" @click="newQuery(username)">
<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>
</template>
<script src="./user_search.js"></script>
<style lang="scss">
.user-search-input-container {
margin: 0.5em;
display: flex;
justify-content: center;
.search-button {
margin-left: 0.5em;
}
}
+
+.loading-icon {
+ padding: 1em;
+}
</style>

File Metadata

Mime Type
text/x-diff
Expires
Sun, Aug 9, 7:04 AM (1 d, 16 h)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
1724315
Default Alt Text
(2 KB)

Event Timeline