properly diferentiate between clearbale search and text hints

This commit is contained in:
Ulf Gebhardt 2023-04-25 04:07:26 +02:00
parent 6102ce2fff
commit efff3625a9
Signed by: ulfgebhardt
GPG Key ID: DA6B843E748679C9

View File

@ -84,13 +84,16 @@ export default {
}, },
computed: { computed: {
emptyText() { emptyText() {
return this.isActive && !this.loading ? this.$t('search.failed') : this.$t('search.hint') return !this.loading && this.isSearchable() ? this.$t('search.failed') : this.$t('search.hint')
}, },
isActive() { isActive() {
return !isEmpty(this.value) return !isEmpty(this.value)
}, },
}, },
methods: { methods: {
isSearchable(){
return !isEmpty(this.value) && typeof this.value === 'string' && this.value.replace(/\s+/g, '').length >= 3
},
isFirstOfType(option) { isFirstOfType(option) {
return ( return (
this.options.findIndex((o) => o === option) === this.options.findIndex((o) => o === option) ===
@ -103,8 +106,8 @@ export default {
onInput(event) { onInput(event) {
clearTimeout(this.searchProcess) clearTimeout(this.searchProcess)
this.value = event.target ? event.target.value.replace(/\s+/g, ' ').trim() : '' this.value = event.target ? event.target.value.replace(/\s+/g, ' ').trim() : ''
if (isEmpty(this.value) || this.value.replace(/\s+/g, '').length < 3) { if (!this.isSearchable()) {
this.clear() this.$emit('clearSearch')
return return
} }
this.searchProcess = setTimeout(() => { this.searchProcess = setTimeout(() => {
@ -120,7 +123,6 @@ export default {
}, },
clear() { clear() {
this.value = '' this.value = ''
this.valueBackup = ''
this.$emit('clearSearch') this.$emit('clearSearch')
clearTimeout(this.searchProcess) clearTimeout(this.searchProcess)
}, },