From e13090bb3bf4eca3aae47618d9bbc620407c69da Mon Sep 17 00:00:00 2001 From: Jon Date: Fri, 25 Oct 2024 07:01:58 +0200 Subject: [PATCH 01/30] feat: refs #8038 added new functionality in VnSelect and refactor styles --- src/components/VnTable/VnTable.vue | 2 +- src/components/common/VnSelect.vue | 23 +++++++++++++++++++++++ src/css/app.scss | 2 +- 3 files changed, 25 insertions(+), 2 deletions(-) diff --git a/src/components/VnTable/VnTable.vue b/src/components/VnTable/VnTable.vue index b9c6edf50..7a7c341a6 100644 --- a/src/components/VnTable/VnTable.vue +++ b/src/components/VnTable/VnTable.vue @@ -379,7 +379,7 @@ function handleScroll() { :name="col.orderBy ?? col.name" :data-key="$attrs['data-key']" :search-url="searchUrl" - :vertical="true" + :vertical="false" /> ($props.useLike ? { like: `%${val}%` } : val); defineExpose({ opts: myOptions }); + +function handleKeyDown(event) { + if (event.key === 'Tab') { + event.preventDefault(); + + const inputValue = vnSelectRef.value?.inputValue; + + if (inputValue) { + const matchingOption = myOptions.value.find( + (option) => + option[optionLabel.value].toLowerCase() === inputValue.toLowerCase() + ); + + if (matchingOption) { + emit('update:modelValue', matchingOption[optionValue.value]); + } else { + emit('update:modelValue', inputValue); + } + vnSelectRef.value?.hidePopup(); + } + } +}