feat: select a value when there is one exact match in multiselect

Related to #2107
This commit is contained in:
kolaente 2022-07-11 19:55:03 +02:00
parent cc079336a8
commit 6973d76e17
No known key found for this signature in database
GPG key ID: F40E70337AB24C9B

View file

@ -89,6 +89,15 @@ import {closeWhenClickedOutside} from '@/helpers/closeWhenClickedOutside'
import BaseButton from '@/components/base/BaseButton.vue'
function elementInResults(elem: string | any, label: string, query: string): boolean {
// Don't make create available if we have an exact match in our search results.
if (label !== '') {
return elem[label] === query
}
return elem === query
}
export default defineComponent({
name: 'multiselect',
components: {
@ -222,14 +231,12 @@ export default defineComponent({
)
},
creatableAvailable() {
return this.creatable && this.query !== '' && !this.filteredSearchResults.some(elem => {
// Don't make create available if we have an exact match in our search results.
if (this.label !== '') {
return elem[this.label] === this.query
}
const hasResult = this.filteredSearchResults.some(elem => elementInResults(elem, this.label, this.query))
const hasQueryAlreadyAdded = Array.isArray(this.internalValue) && this.internalValue.some(elem => elementInResults(elem, this.label, this.query))
return elem === this.query
})
return this.creatable
&& this.query !== ''
&& !(hasResult || hasQueryAlreadyAdded)
},
filteredSearchResults() {
if (this.multiple && this.internalValue !== null && Array.isArray(this.internalValue)) {
@ -352,6 +359,12 @@ export default defineComponent({
}
if (!this.creatableAvailable) {
// Check if there's an exact match for our search term
const exactMatch = this.filteredSearchResults.find(elem => elementInResults(elem, this.label, this.query))
if(exactMatch) {
this.select(exactMatch)
}
return
}