Move smart search bar in a dedicated component mixin
This commit is contained in:
parent
47209ee5ae
commit
b1194e50de
|
@ -0,0 +1,55 @@
|
||||||
|
<script>
|
||||||
|
|
||||||
|
import {normalizeQuery, parseTokens, compileTokens} from '@/search'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
defaultQuery: {type: String, default: '', required: false},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getTokenValue (key, fallback) {
|
||||||
|
let matching = this.search.tokens.filter(t => {
|
||||||
|
return t.field === key
|
||||||
|
})
|
||||||
|
if (matching.length > 0) {
|
||||||
|
return matching[0].value
|
||||||
|
}
|
||||||
|
return fallback
|
||||||
|
},
|
||||||
|
addSearchToken (key, value) {
|
||||||
|
if (!value) {
|
||||||
|
// we remove existing matching tokens, if any
|
||||||
|
this.search.tokens = this.search.tokens.filter(t => {
|
||||||
|
return t.field != key
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
let existing = this.search.tokens.filter(t => {
|
||||||
|
return t.field === key
|
||||||
|
})
|
||||||
|
if (existing.length > 0) {
|
||||||
|
// we replace the value in existing tokens, if any
|
||||||
|
existing.forEach(t => {
|
||||||
|
t.value = value
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
// we add a new token
|
||||||
|
this.search.tokens.push({field: key, value})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
'search.query' (newValue) {
|
||||||
|
this.search.tokens = parseTokens(normalizeQuery(newValue))
|
||||||
|
},
|
||||||
|
'search.tokens': {
|
||||||
|
handler (newValue) {
|
||||||
|
this.search.query = compileTokens(newValue)
|
||||||
|
this.page = 1
|
||||||
|
this.fetchData()
|
||||||
|
},
|
||||||
|
deep: true
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
|
@ -125,19 +125,19 @@
|
||||||
import axios from 'axios'
|
import axios from 'axios'
|
||||||
import _ from '@/lodash'
|
import _ from '@/lodash'
|
||||||
import time from '@/utils/time'
|
import time from '@/utils/time'
|
||||||
import {normalizeQuery, parseTokens, compileTokens} from '@/search'
|
import {normalizeQuery, parseTokens} from '@/search'
|
||||||
|
|
||||||
import Pagination from '@/components/Pagination'
|
import Pagination from '@/components/Pagination'
|
||||||
import ActionTable from '@/components/common/ActionTable'
|
import ActionTable from '@/components/common/ActionTable'
|
||||||
import OrderingMixin from '@/components/mixins/Ordering'
|
import OrderingMixin from '@/components/mixins/Ordering'
|
||||||
import TranslationsMixin from '@/components/mixins/Translations'
|
import TranslationsMixin from '@/components/mixins/Translations'
|
||||||
|
import SmartSearchMixin from '@/components/mixins/SmartSearch'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
mixins: [OrderingMixin, TranslationsMixin],
|
mixins: [OrderingMixin, TranslationsMixin, SmartSearchMixin],
|
||||||
props: {
|
props: {
|
||||||
filters: {type: Object, required: false},
|
filters: {type: Object, required: false},
|
||||||
needsRefresh: {type: Boolean, required: false, default: false},
|
needsRefresh: {type: Boolean, required: false, default: false},
|
||||||
defaultQuery: {type: String, default: ''},
|
|
||||||
customObjects: {type: Array, required: false, default: () => { return [] }}
|
customObjects: {type: Array, required: false, default: () => { return [] }}
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
|
@ -172,36 +172,6 @@ export default {
|
||||||
this.fetchData()
|
this.fetchData()
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
getTokenValue (key, fallback) {
|
|
||||||
let matching = this.search.tokens.filter(t => {
|
|
||||||
return t.field === key
|
|
||||||
})
|
|
||||||
if (matching.length > 0) {
|
|
||||||
return matching[0].value
|
|
||||||
}
|
|
||||||
return fallback
|
|
||||||
},
|
|
||||||
addSearchToken (key, value) {
|
|
||||||
if (!value) {
|
|
||||||
// we remove existing matching tokens, if any
|
|
||||||
this.search.tokens = this.search.tokens.filter(t => {
|
|
||||||
return t.field != key
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
let existing = this.search.tokens.filter(t => {
|
|
||||||
return t.field === key
|
|
||||||
})
|
|
||||||
if (existing.length > 0) {
|
|
||||||
// we replace the value in existing tokens, if any
|
|
||||||
existing.forEach(t => {
|
|
||||||
t.value = value
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
// we add a new token
|
|
||||||
this.search.tokens.push({field: key, value})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
fetchData () {
|
fetchData () {
|
||||||
this.$emit('fetch-start')
|
this.$emit('fetch-start')
|
||||||
let params = _.merge({
|
let params = _.merge({
|
||||||
|
@ -282,17 +252,6 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
'search.query' (newValue) {
|
|
||||||
this.search.tokens = parseTokens(normalizeQuery(newValue))
|
|
||||||
},
|
|
||||||
'search.tokens': {
|
|
||||||
handler (newValue) {
|
|
||||||
this.search.query = compileTokens(newValue)
|
|
||||||
this.page = 1
|
|
||||||
this.fetchData()
|
|
||||||
},
|
|
||||||
deep: true
|
|
||||||
},
|
|
||||||
orderingDirection: function () {
|
orderingDirection: function () {
|
||||||
this.page = 1
|
this.page = 1
|
||||||
this.fetchData()
|
this.fetchData()
|
||||||
|
|
Loading…
Reference in New Issue