From da5844205c5e2ead4da42f89f1f9586683af693e Mon Sep 17 00:00:00 2001 From: taehoon Date: Tue, 2 Apr 2019 06:12:31 -0400 Subject: add user autosuggest component --- .../user_autosuggest/user_autosuggest.js | 41 ++++++++++++++++++++++ 1 file changed, 41 insertions(+) create mode 100644 src/components/user_autosuggest/user_autosuggest.js (limited to 'src/components/user_autosuggest/user_autosuggest.js') diff --git a/src/components/user_autosuggest/user_autosuggest.js b/src/components/user_autosuggest/user_autosuggest.js new file mode 100644 index 00000000..6612c2f3 --- /dev/null +++ b/src/components/user_autosuggest/user_autosuggest.js @@ -0,0 +1,41 @@ +import { VueAutosuggest } from 'vue-autosuggest' +import BasicUserCard from '../basic_user_card/basic_user_card.vue' +import userSearchApi from '../../services/new_api/user_search.js' + +export default { + components: { + VueAutosuggest, + BasicUserCard + }, + data () { + return { + results: [], + timeout: null, + selected: null, + debounceMilliseconds: 500, + inputProps: { + id: 'autosuggest__input', + onInputChange: this.fetchResults, + placeholder: 'Search...', + class: 'form-control' + }, + suggestions: [] + } + }, + methods: { + fetchResults (query) { + clearTimeout(this.timeout) + this.timeout = setTimeout(() => { + userSearchApi.search({query, store: this.$store}) + .then((data) => { this.suggestions = [{ data }] }) + }, this.debounceMilliseconds) + }, + clickHandler (item) { + return false + }, + clickUserHandler () { + console.log('clickUserHandler') + return false + } + } +} -- cgit v1.2.3-70-g09d2