fix(slots) : filter slot select options server-side instead of client-side
PieceSelect, ProductSelect and ComposantSelect were loading up to 200 items then filtering client-side by typeId. If the matching items were not in the first 200, the dropdown appeared empty. Now each select component uses API Platform filters (typePiece, typeProduct, typeComposant) to fetch only relevant items server-side, with local state to avoid overwriting the global catalog cache. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -42,6 +42,7 @@ interface LoadComposantsOptions {
|
||||
orderBy?: string
|
||||
orderDir?: 'asc' | 'desc'
|
||||
typeName?: string
|
||||
typeComposantId?: string
|
||||
force?: boolean
|
||||
}
|
||||
|
||||
@@ -109,17 +110,18 @@ export function useComposants() {
|
||||
orderBy = 'name',
|
||||
orderDir = 'asc',
|
||||
typeName,
|
||||
typeComposantId,
|
||||
force = false,
|
||||
} = options
|
||||
|
||||
if (!force && loaded.value && !search && !typeName && page === 1) {
|
||||
if (!force && loaded.value && !search && !typeName && !typeComposantId && page === 1) {
|
||||
return {
|
||||
success: true,
|
||||
data: { items: composants.value, total: total.value, page, itemsPerPage },
|
||||
}
|
||||
}
|
||||
|
||||
if (loading.value) {
|
||||
if (!typeComposantId && loading.value) {
|
||||
return {
|
||||
success: true,
|
||||
data: { items: composants.value, total: total.value, page, itemsPerPage },
|
||||
@@ -128,7 +130,6 @@ export function useComposants() {
|
||||
|
||||
loading.value = true
|
||||
try {
|
||||
|
||||
const params = new URLSearchParams()
|
||||
params.set('itemsPerPage', String(itemsPerPage))
|
||||
params.set('page', String(page))
|
||||
@@ -141,20 +142,29 @@ export function useComposants() {
|
||||
params.set('typeComposant.name', typeName.trim())
|
||||
}
|
||||
|
||||
if (typeComposantId) {
|
||||
params.set('typeComposant', typeComposantId)
|
||||
}
|
||||
|
||||
params.set(`order[${orderBy}]`, orderDir)
|
||||
|
||||
const result = await get(`/composants?${params.toString()}`)
|
||||
if (result.success) {
|
||||
const items = extractCollection(result.data)
|
||||
const enrichedItems = await Promise.all(items.map((item) => withResolvedConstructeurs(item)))
|
||||
composants.value = enrichedItems
|
||||
total.value = extractTotal(result.data, items.length)
|
||||
loaded.value = true
|
||||
const resultTotal = extractTotal(result.data, items.length)
|
||||
|
||||
if (!typeComposantId) {
|
||||
composants.value = enrichedItems
|
||||
total.value = resultTotal
|
||||
loaded.value = true
|
||||
}
|
||||
|
||||
return {
|
||||
success: true,
|
||||
data: {
|
||||
items: enrichedItems,
|
||||
total: total.value,
|
||||
total: resultTotal,
|
||||
page,
|
||||
itemsPerPage,
|
||||
},
|
||||
|
||||
@@ -43,6 +43,7 @@ interface LoadPiecesOptions {
|
||||
orderBy?: string
|
||||
orderDir?: 'asc' | 'desc'
|
||||
typeName?: string
|
||||
typePieceId?: string
|
||||
force?: boolean
|
||||
}
|
||||
|
||||
@@ -119,17 +120,20 @@ export function usePieces() {
|
||||
orderBy = 'name',
|
||||
orderDir = 'asc',
|
||||
typeName,
|
||||
typePieceId,
|
||||
force = false,
|
||||
} = options
|
||||
|
||||
if (!force && loaded.value && !search && !typeName && page === 1) {
|
||||
// Only use cache for unfiltered full-catalog loads
|
||||
if (!force && loaded.value && !search && !typeName && !typePieceId && page === 1) {
|
||||
return {
|
||||
success: true,
|
||||
data: { items: pieces.value, total: total.value, page, itemsPerPage },
|
||||
}
|
||||
}
|
||||
|
||||
if (loading.value) {
|
||||
// For filtered queries, don't block on global loading state
|
||||
if (!typePieceId && loading.value) {
|
||||
return {
|
||||
success: true,
|
||||
data: { items: pieces.value, total: total.value, page, itemsPerPage },
|
||||
@@ -138,7 +142,6 @@ export function usePieces() {
|
||||
|
||||
loading.value = true
|
||||
try {
|
||||
|
||||
const params = new URLSearchParams()
|
||||
params.set('itemsPerPage', String(itemsPerPage))
|
||||
params.set('page', String(page))
|
||||
@@ -151,20 +154,30 @@ export function usePieces() {
|
||||
params.set('typePiece.name', typeName.trim())
|
||||
}
|
||||
|
||||
if (typePieceId) {
|
||||
params.set('typePiece', typePieceId)
|
||||
}
|
||||
|
||||
params.set(`order[${orderBy}]`, orderDir)
|
||||
|
||||
const result = await get(`/pieces?${params.toString()}`)
|
||||
if (result.success) {
|
||||
const items = extractCollection(result.data)
|
||||
const enrichedItems = await Promise.all(items.map((item) => withResolvedConstructeurs(item)))
|
||||
pieces.value = enrichedItems
|
||||
total.value = extractTotal(result.data, items.length)
|
||||
loaded.value = true
|
||||
const resultTotal = extractTotal(result.data, items.length)
|
||||
|
||||
// Only update global cache for unfiltered queries
|
||||
if (!typePieceId) {
|
||||
pieces.value = enrichedItems
|
||||
total.value = resultTotal
|
||||
loaded.value = true
|
||||
}
|
||||
|
||||
return {
|
||||
success: true,
|
||||
data: {
|
||||
items: enrichedItems,
|
||||
total: total.value,
|
||||
total: resultTotal,
|
||||
page,
|
||||
itemsPerPage,
|
||||
},
|
||||
|
||||
@@ -41,6 +41,7 @@ interface LoadProductsOptions {
|
||||
orderBy?: string
|
||||
orderDir?: 'asc' | 'desc'
|
||||
typeName?: string
|
||||
typeProductId?: string
|
||||
force?: boolean
|
||||
}
|
||||
|
||||
@@ -118,17 +119,18 @@ export function useProducts() {
|
||||
orderBy = 'name',
|
||||
orderDir = 'asc',
|
||||
typeName,
|
||||
typeProductId,
|
||||
force = false,
|
||||
} = options
|
||||
|
||||
if (!force && loaded.value && !search && !typeName && page === 1) {
|
||||
if (!force && loaded.value && !search && !typeName && !typeProductId && page === 1) {
|
||||
return {
|
||||
success: true,
|
||||
data: { items: products.value, total: total.value, page, itemsPerPage },
|
||||
}
|
||||
}
|
||||
|
||||
if (loading.value) {
|
||||
if (!typeProductId && loading.value) {
|
||||
return {
|
||||
success: true,
|
||||
data: { items: products.value, total: total.value, page, itemsPerPage },
|
||||
@@ -150,20 +152,29 @@ export function useProducts() {
|
||||
params.set('typeProduct.name', typeName.trim())
|
||||
}
|
||||
|
||||
if (typeProductId) {
|
||||
params.set('typeProduct', typeProductId)
|
||||
}
|
||||
|
||||
params.set(`order[${orderBy}]`, orderDir)
|
||||
|
||||
const result = await get(`/products?${params.toString()}`)
|
||||
if (result.success) {
|
||||
const items = extractCollection(result.data)
|
||||
const enrichedItems = await Promise.all(items.map((item) => withResolvedConstructeurs(item)))
|
||||
products.value = enrichedItems
|
||||
total.value = extractTotal(result.data, items.length)
|
||||
loaded.value = true
|
||||
const resultTotal = extractTotal(result.data, items.length)
|
||||
|
||||
if (!typeProductId) {
|
||||
products.value = enrichedItems
|
||||
total.value = resultTotal
|
||||
loaded.value = true
|
||||
}
|
||||
|
||||
return {
|
||||
success: true,
|
||||
data: {
|
||||
items: enrichedItems,
|
||||
total: total.value,
|
||||
total: resultTotal,
|
||||
page,
|
||||
itemsPerPage,
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user