From 69a4bcb238b347a139bfb1192413b45c8b9d7e36 Mon Sep 17 00:00:00 2001 From: Eugenij Date: Mon, 15 Jul 2019 16:42:27 +0000 Subject: New search --- src/components/search/search.js | 98 +++++++++++++++++++++++++++++++++++++++++ 1 file changed, 98 insertions(+) create mode 100644 src/components/search/search.js (limited to 'src/components/search/search.js') diff --git a/src/components/search/search.js b/src/components/search/search.js new file mode 100644 index 00000000..b434e127 --- /dev/null +++ b/src/components/search/search.js @@ -0,0 +1,98 @@ +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 -- cgit v1.2.3-70-g09d2 From cd14566a34013e65b603a71208d058871e992956 Mon Sep 17 00:00:00 2001 From: taehoon Date: Fri, 9 Aug 2019 23:28:46 -0400 Subject: remove useless index param of onSwitch --- src/components/interactions/interactions.js | 2 +- src/components/search/search.js | 2 +- src/components/tab_switcher/tab_switcher.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) (limited to 'src/components/search/search.js') diff --git a/src/components/interactions/interactions.js b/src/components/interactions/interactions.js index d4e3cc17..90dbd76b 100644 --- a/src/components/interactions/interactions.js +++ b/src/components/interactions/interactions.js @@ -13,7 +13,7 @@ const Interactions = { } }, methods: { - onModeSwitch (index, dataset) { + onModeSwitch (dataset) { this.filterMode = tabModeDict[dataset.filter] } }, diff --git a/src/components/search/search.js b/src/components/search/search.js index b434e127..37940f34 100644 --- a/src/components/search/search.js +++ b/src/components/search/search.js @@ -75,7 +75,7 @@ const Search = { const length = this[tabName].length return length === 0 ? '' : ` (${length})` }, - onResultTabSwitch (_index, dataset) { + onResultTabSwitch (dataset) { this.currenResultTab = dataset.filter }, getActiveTab () { diff --git a/src/components/tab_switcher/tab_switcher.js b/src/components/tab_switcher/tab_switcher.js index a5fe019c..ff99e3e7 100644 --- a/src/components/tab_switcher/tab_switcher.js +++ b/src/components/tab_switcher/tab_switcher.js @@ -20,7 +20,7 @@ export default Vue.component('tab-switcher', { activateTab (index, dataset) { return () => { if (typeof this.onSwitch === 'function') { - this.onSwitch.call(null, index, this.$slots.default[index].elm.dataset) + this.onSwitch.call(null, this.$slots.default[index].elm.dataset) } this.active = index } -- cgit v1.2.3-70-g09d2 From df3e80b7c3fc91cbd62764be467d1dfe28b4b299 Mon Sep 17 00:00:00 2001 From: taehoon Date: Fri, 9 Aug 2019 23:48:08 -0400 Subject: use key prop instead of dataset to identify active tab --- src/components/interactions/interactions.js | 4 ++-- src/components/interactions/interactions.vue | 9 +++------ src/components/search/search.js | 4 ++-- src/components/search/search.vue | 9 +++------ src/components/tab_switcher/tab_switcher.js | 2 +- 5 files changed, 11 insertions(+), 17 deletions(-) (limited to 'src/components/search/search.js') diff --git a/src/components/interactions/interactions.js b/src/components/interactions/interactions.js index 90dbd76b..1f8a9de9 100644 --- a/src/components/interactions/interactions.js +++ b/src/components/interactions/interactions.js @@ -13,8 +13,8 @@ const Interactions = { } }, methods: { - onModeSwitch (dataset) { - this.filterMode = tabModeDict[dataset.filter] + onModeSwitch (key) { + this.filterMode = tabModeDict[key] } }, components: { diff --git a/src/components/interactions/interactions.vue b/src/components/interactions/interactions.vue index d71c99d5..08cee343 100644 --- a/src/components/interactions/interactions.vue +++ b/src/components/interactions/interactions.vue @@ -10,18 +10,15 @@ :on-switch="onModeSwitch" > diff --git a/src/components/search/search.js b/src/components/search/search.js index 37940f34..8e903052 100644 --- a/src/components/search/search.js +++ b/src/components/search/search.js @@ -75,8 +75,8 @@ const Search = { const length = this[tabName].length return length === 0 ? '' : ` (${length})` }, - onResultTabSwitch (dataset) { - this.currenResultTab = dataset.filter + onResultTabSwitch (key) { + this.currenResultTab = key }, getActiveTab () { if (this.visibleStatuses.length > 0) { diff --git a/src/components/search/search.vue b/src/components/search/search.vue index 4350e672..eb20973b 100644 --- a/src/components/search/search.vue +++ b/src/components/search/search.vue @@ -34,18 +34,15 @@ :custom-active="currenResultTab" > diff --git a/src/components/tab_switcher/tab_switcher.js b/src/components/tab_switcher/tab_switcher.js index ff99e3e7..b26040ff 100644 --- a/src/components/tab_switcher/tab_switcher.js +++ b/src/components/tab_switcher/tab_switcher.js @@ -20,7 +20,7 @@ export default Vue.component('tab-switcher', { activateTab (index, dataset) { return () => { if (typeof this.onSwitch === 'function') { - this.onSwitch.call(null, this.$slots.default[index].elm.dataset) + this.onSwitch.call(null, this.$slots.default[index].key) } this.active = index } -- cgit v1.2.3-70-g09d2