fix(search) : disable client-side filtering when server-search is active
SearchSelect was filtering results client-side on label only, hiding server results matched by reference. Add serverSearch prop to bypass client filter when the API already handles search. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -23,6 +23,7 @@
|
|||||||
:empty-text="componentOptions.length ? 'Aucun résultat' : 'Aucun composant disponible'"
|
:empty-text="componentOptions.length ? 'Aucun résultat' : 'Aucun composant disponible'"
|
||||||
:option-label="componentOptionLabel"
|
:option-label="componentOptionLabel"
|
||||||
:option-description="componentOptionDescription"
|
:option-description="componentOptionDescription"
|
||||||
|
server-search
|
||||||
@search="fetchComponentOptions"
|
@search="fetchComponentOptions"
|
||||||
@update:modelValue="(value) => { assignment.selectedComponentId = normalizeSelectionValue(value); }"
|
@update:modelValue="(value) => { assignment.selectedComponentId = normalizeSelectionValue(value); }"
|
||||||
/>
|
/>
|
||||||
@@ -62,6 +63,7 @@
|
|||||||
:empty-text="getPieceOptions(pieceAssignment).length ? 'Aucun résultat' : 'Aucune pièce disponible'"
|
:empty-text="getPieceOptions(pieceAssignment).length ? 'Aucun résultat' : 'Aucune pièce disponible'"
|
||||||
:option-label="pieceOptionLabel"
|
:option-label="pieceOptionLabel"
|
||||||
:option-description="pieceOptionDescription"
|
:option-description="pieceOptionDescription"
|
||||||
|
server-search
|
||||||
@search="(term) => fetchPieceOptions(pieceAssignment, term)"
|
@search="(term) => fetchPieceOptions(pieceAssignment, term)"
|
||||||
@update:modelValue="(value) => { pieceAssignment.selectedPieceId = normalizeSelectionValue(value); }"
|
@update:modelValue="(value) => { pieceAssignment.selectedPieceId = normalizeSelectionValue(value); }"
|
||||||
/>
|
/>
|
||||||
@@ -101,6 +103,7 @@
|
|||||||
:empty-text="getProductOptions(productAssignment).length ? 'Aucun résultat' : 'Aucun produit disponible'"
|
:empty-text="getProductOptions(productAssignment).length ? 'Aucun résultat' : 'Aucun produit disponible'"
|
||||||
:option-label="productOptionLabel"
|
:option-label="productOptionLabel"
|
||||||
:option-description="productOptionDescription"
|
:option-description="productOptionDescription"
|
||||||
|
server-search
|
||||||
@search="(term) => fetchProductOptions(productAssignment, term)"
|
@search="(term) => fetchProductOptions(productAssignment, term)"
|
||||||
@update:modelValue="(value) => { productAssignment.selectedProductId = normalizeSelectionValue(value); }"
|
@update:modelValue="(value) => { productAssignment.selectedProductId = normalizeSelectionValue(value); }"
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -10,6 +10,7 @@
|
|||||||
option-value="id"
|
option-value="id"
|
||||||
option-label="name"
|
option-label="name"
|
||||||
:disabled="disabled"
|
:disabled="disabled"
|
||||||
|
server-search
|
||||||
@update:modelValue="updateValue"
|
@update:modelValue="updateValue"
|
||||||
@search="handleSearch"
|
@search="handleSearch"
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -10,6 +10,7 @@
|
|||||||
option-value="id"
|
option-value="id"
|
||||||
option-label="name"
|
option-label="name"
|
||||||
:disabled="disabled"
|
:disabled="disabled"
|
||||||
|
server-search
|
||||||
@update:modelValue="updateValue"
|
@update:modelValue="updateValue"
|
||||||
@search="handleSearch"
|
@search="handleSearch"
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -10,6 +10,7 @@
|
|||||||
option-value="id"
|
option-value="id"
|
||||||
option-label="name"
|
option-label="name"
|
||||||
:disabled="disabled"
|
:disabled="disabled"
|
||||||
|
server-search
|
||||||
@update:modelValue="updateValue"
|
@update:modelValue="updateValue"
|
||||||
@search="handleSearch"
|
@search="handleSearch"
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -133,6 +133,10 @@ const props = defineProps({
|
|||||||
maxVisible: {
|
maxVisible: {
|
||||||
type: Number,
|
type: Number,
|
||||||
default: 50
|
default: 50
|
||||||
|
},
|
||||||
|
serverSearch: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
@@ -150,11 +154,11 @@ const selectedOption = computed(() => {
|
|||||||
})
|
})
|
||||||
|
|
||||||
const displayedOptions = computed(() => {
|
const displayedOptions = computed(() => {
|
||||||
const term = searchTerm.value.trim().toLowerCase()
|
|
||||||
const items = baseOptions.value.slice()
|
const items = baseOptions.value.slice()
|
||||||
|
|
||||||
const filtered = term
|
const filtered = (!props.serverSearch && searchTerm.value.trim())
|
||||||
? items.filter((option) => {
|
? items.filter((option) => {
|
||||||
|
const term = searchTerm.value.trim().toLowerCase()
|
||||||
const label = resolveLabel(option).toLowerCase()
|
const label = resolveLabel(option).toLowerCase()
|
||||||
const description = resolveDescription(option)?.toLowerCase() || ''
|
const description = resolveDescription(option)?.toLowerCase() || ''
|
||||||
return label.includes(term) || description.includes(term)
|
return label.includes(term) || description.includes(term)
|
||||||
|
|||||||
@@ -44,6 +44,7 @@
|
|||||||
:empty-text="`Aucun ${entityLabelLower} disponible dans cette catégorie`"
|
:empty-text="`Aucun ${entityLabelLower} disponible dans cette catégorie`"
|
||||||
:option-label="entityOptionLabel"
|
:option-label="entityOptionLabel"
|
||||||
:option-description="entityOptionDescription"
|
:option-description="entityOptionDescription"
|
||||||
|
server-search
|
||||||
@search="handleEntitySearch"
|
@search="handleEntitySearch"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user