99 lines
2.3 KiB
JavaScript
99 lines
2.3 KiB
JavaScript
|
import FollowCard from '../follow_card/follow_card.vue'
|
||
|
|
import Conversation from '../conversation/conversation.vue'
|
||
|
|
import Status from '../status/status.vue'
|
||
|
|
import map from 'lodash/map'
|
||
|
|
|
||
|
|
const Search = {
|
||
|
|
components: {
|
||
|
|
FollowCard,
|
||
|
|
Conversation,
|
||
|
|
Status
|
||
|
|
},
|
||
|
|
props: [
|
||
|
|
'query'
|
||
|
|
],
|
||
|
|
data () {
|
||
|
|
return {
|
||
|
|
loaded: false,
|
||
|
|
loading: false,
|
||
|
|
searchTerm: this.query || '',
|
||
|
|
userIds: [],
|
||
|
|
statuses: [],
|
||
|
|
hashtags: [],
|
||
|
|
currenResultTab: 'statuses'
|
||
|
|
}
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
users () {
|
||
|
|
return this.userIds.map(userId => this.$store.getters.findUser(userId))
|
||
|
|
},
|
||
|
|
visibleStatuses () {
|
||
|
|
const allStatusesObject = this.$store.state.statuses.allStatusesObject
|
||
|
|
|
||
|
|
return this.statuses.filter(status =>
|
||
|
|
allStatusesObject[status.id] && !allStatusesObject[status.id].deleted
|
||
|
|
)
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted () {
|
||
|
|
this.search(this.query)
|
||
|
|
},
|
||
|
|
watch: {
|
||
|
|
query (newValue) {
|
||
|
|
this.searchTerm = newValue
|
||
|
|
this.search(newValue)
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
newQuery (query) {
|
||
|
|
this.$router.push({ name: 'search', query: { query } })
|
||
|
|
this.$refs.searchInput.focus()
|
||
|
|
},
|
||
|
|
search (query) {
|
||
|
|
if (!query) {
|
||
|
|
this.loading = false
|
||
|
|
return
|
||
|
|
}
|
||
|
|
|
||
|
|
this.loading = true
|
||
|
|
this.userIds = []
|
||
|
|
this.statuses = []
|
||
|
|
this.hashtags = []
|
||
|
|
this.$refs.searchInput.blur()
|
||
|
|
|
||
|
|
this.$store.dispatch('search', { q: query, resolve: true })
|
||
|
|
.then(data => {
|
||
|
|
this.loading = false
|
||
|
|
this.userIds = map(data.accounts, 'id')
|
||
|
|
this.statuses = data.statuses
|
||
|
|
this.hashtags = data.hashtags
|
||
|
|
this.currenResultTab = this.getActiveTab()
|
||
|
|
this.loaded = true
|
||
|
|
})
|
||
|
|
},
|
||
|
|
resultCount (tabName) {
|
||
|
|
const length = this[tabName].length
|
||
|
|
return length === 0 ? '' : ` (${length})`
|
||
|
|
},
|
||
|
|
onResultTabSwitch (_index, dataset) {
|
||
|
|
this.currenResultTab = dataset.filter
|
||
|
|
},
|
||
|
|
getActiveTab () {
|
||
|
|
if (this.visibleStatuses.length > 0) {
|
||
|
|
return 'statuses'
|
||
|
|
} else if (this.users.length > 0) {
|
||
|
|
return 'people'
|
||
|
|
} else if (this.hashtags.length > 0) {
|
||
|
|
return 'hashtags'
|
||
|
|
}
|
||
|
|
|
||
|
|
return 'statuses'
|
||
|
|
},
|
||
|
|
lastHistoryRecord (hashtag) {
|
||
|
|
return hashtag.history && hashtag.history[0]
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
export default Search
|