MALIO-DEV/Inventory
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 2 Wiki Activity

fix dropdwon blank space bug

Browse Source
This commit is contained in:
Matthieu
2025-10-16 14:18:33 +02:00
parent 4ccc19505f
commit 761c5f559a
1 changed files with 12 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
app/components/common/SearchSelect.vue
View File

@@ -39,14 +39,14 @@
<div v-else-if="displayedOptions.length === 0" class="px-3 py-2 text-xs text-gray-500"> <div v-else-if="displayedOptions.length === 0" class="px-3 py-2 text-xs text-gray-500">
{{ emptyText }} {{ emptyText }}
</div> </div>
<ul v-else class="menu p-0"> <ul v-else class="flex flex-col">
<li <li
v-for="(option, index) in displayedOptions" v-for="(option, index) in displayedOptions"
:key="resolveValue(option) ?? index" :key="resolveValue(option) ?? index"
> >
<button <button
type="button" type="button"
class="w-full text-left px-3 py-2 hover:bg-base-200 focus:bg-base-200 focus:outline-none" class="flex w-full flex-col items-start gap-1 px-3 py-2 text-left hover:bg-base-200 focus:bg-base-200 focus:outline-none"
:class="{ :class="{
'bg-base-200': isOptionSelected(option), 'bg-base-200': isOptionSelected(option),
'bg-base-300/60': highlightedIndex === index 'bg-base-300/60': highlightedIndex === index
@@ -55,18 +55,16 @@
@mouseleave="highlightedIndex = -1" @mouseleave="highlightedIndex = -1"
@click="selectOption(option)" @click="selectOption(option)"
> >
<div class="flex flex-col"> <span class="font-medium text-sm">
<span class="font-medium text-sm"> <slot name="option-label" :option="option">
<slot name="option-label" :option="option"> {{ resolveLabel(option) }}
{{ resolveLabel(option) }} </slot>
</slot> </span>
</span> <span v-if="resolveDescription(option)" class="text-xs text-gray-500">
<span v-if="resolveDescription(option)" class="text-xs text-gray-500"> <slot name="option-description" :option="option">
<slot name="option-description" :option="option"> {{ resolveDescription(option) }}
{{ resolveDescription(option) }} </slot>
</slot> </span>
</span>
</div>
</button> </button>
</li> </li>
</ul> </ul>