fix(filters) : repair broken filters on catalog and document pages
- modelTypes.ts: use API Platform OrderFilter format (order[field]=dir) and proper page param - product-catalog: load all products (itemsPerPage: 200) instead of default 30 - documents: load all documents (itemsPerPage: 200) instead of default 30 - useDocuments: support itemsPerPage option in loadDocuments/loadFromEndpoint - pieces-catalog + component-catalog: add force:true to bypass stale cache on sort/filter Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -49,11 +49,12 @@ export function useDocuments() {
|
||||
|
||||
const loadFromEndpoint = async (
|
||||
endpoint: string,
|
||||
{ updateStore = false }: { updateStore?: boolean } = {},
|
||||
{ updateStore = false, itemsPerPage }: { updateStore?: boolean; itemsPerPage?: number } = {},
|
||||
): Promise<DocumentResult> => {
|
||||
loading.value = true
|
||||
try {
|
||||
const result = await get(endpoint)
|
||||
const url = itemsPerPage ? `${endpoint}${endpoint.includes('?') ? '&' : '?'}itemsPerPage=${itemsPerPage}` : endpoint
|
||||
const result = await get(url)
|
||||
if (result.success) {
|
||||
const data = extractCollection(result.data)
|
||||
if (updateStore) {
|
||||
@@ -76,9 +77,9 @@ export function useDocuments() {
|
||||
}
|
||||
|
||||
const loadDocuments = async (
|
||||
options: { updateStore?: boolean } = {},
|
||||
options: { updateStore?: boolean; itemsPerPage?: number } = {},
|
||||
): Promise<DocumentResult> => {
|
||||
return loadFromEndpoint('/documents', { updateStore: options.updateStore ?? true })
|
||||
return loadFromEndpoint('/documents', { updateStore: options.updateStore ?? true, itemsPerPage: options.itemsPerPage })
|
||||
}
|
||||
|
||||
const loadDocumentsBySite = async (
|
||||
|
||||
@@ -234,7 +234,8 @@ const fetchComposants = async () => {
|
||||
page: currentPage.value,
|
||||
itemsPerPage: itemsPerPage.value,
|
||||
orderBy: sortField.value,
|
||||
orderDir: sortDirection.value
|
||||
orderDir: sortDirection.value,
|
||||
force: true
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
@@ -146,7 +146,7 @@ const previewDocument = ref(null)
|
||||
const previewVisible = ref(false)
|
||||
|
||||
onMounted(() => {
|
||||
loadDocuments()
|
||||
loadDocuments({ itemsPerPage: 200 })
|
||||
})
|
||||
|
||||
const filteredDocuments = computed(() => {
|
||||
|
||||
@@ -256,7 +256,8 @@ const fetchPieces = async () => {
|
||||
page: currentPage.value,
|
||||
itemsPerPage: itemsPerPage.value,
|
||||
orderBy: sortField.value,
|
||||
orderDir: sortDirection.value
|
||||
orderDir: sortDirection.value,
|
||||
force: true
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
@@ -388,7 +388,7 @@ const resolvePreviewAlt = (product: Record<string, any>) => {
|
||||
}
|
||||
|
||||
const reload = async () => {
|
||||
await loadProducts({ force: true })
|
||||
await loadProducts({ itemsPerPage: 200, force: true })
|
||||
}
|
||||
|
||||
const { confirm } = useConfirm()
|
||||
@@ -409,7 +409,7 @@ const confirmDelete = async (product: Record<string, any>) => {
|
||||
|
||||
onMounted(async () => {
|
||||
await Promise.all([
|
||||
loadProducts(),
|
||||
loadProducts({ itemsPerPage: 200, force: true }),
|
||||
loadProductTypes()
|
||||
])
|
||||
})
|
||||
|
||||
@@ -132,28 +132,19 @@ export async function listModelTypes(params: ModelTypeListParams = {}, opts: { s
|
||||
if (params.category) {
|
||||
query.category = params.category;
|
||||
}
|
||||
if (params.sort) {
|
||||
query.sort = params.sort;
|
||||
}
|
||||
if (params.dir) {
|
||||
query.dir = params.dir;
|
||||
}
|
||||
const hasCategoryFilter = Boolean(params.category);
|
||||
const effectiveLimit = typeof params.limit === 'number' ? params.limit : undefined;
|
||||
const effectiveOffset = typeof params.offset === 'number' ? params.offset : 0;
|
||||
|
||||
if (hasCategoryFilter) {
|
||||
// Fetch enough items to allow client-side category filtering + pagination.
|
||||
query.itemsPerPage = Math.max(effectiveLimit ?? 200, 200);
|
||||
query.offset = 0;
|
||||
} else {
|
||||
if (typeof params.limit === 'number') {
|
||||
query.itemsPerPage = params.limit;
|
||||
}
|
||||
if (typeof params.offset === 'number') {
|
||||
query.offset = params.offset;
|
||||
}
|
||||
}
|
||||
// Sort: API Platform OrderFilter uses order[field]=direction
|
||||
const sortField = params.sort || 'name';
|
||||
const sortDir = params.dir || 'asc';
|
||||
query[`order[${sortField}]`] = sortDir;
|
||||
|
||||
// Pagination: API Platform uses page + itemsPerPage
|
||||
const effectiveLimit = typeof params.limit === 'number' ? params.limit : 20;
|
||||
const effectiveOffset = typeof params.offset === 'number' ? params.offset : 0;
|
||||
const page = Math.floor(effectiveOffset / effectiveLimit) + 1;
|
||||
|
||||
query.itemsPerPage = effectiveLimit;
|
||||
query.page = page;
|
||||
|
||||
const payload = await requestFetch<Record<string, any>>(ENDPOINT, createOptions({
|
||||
method: 'GET',
|
||||
@@ -168,25 +159,20 @@ export async function listModelTypes(params: ModelTypeListParams = {}, opts: { s
|
||||
: Array.isArray(payload?.items)
|
||||
? payload.items
|
||||
: [];
|
||||
const filteredItems = params.category
|
||||
? rawItems.filter((item: any) => item?.category === params.category)
|
||||
: rawItems;
|
||||
const total = params.category
|
||||
? filteredItems.length
|
||||
: typeof payload?.totalItems === 'number'
|
||||
? payload.totalItems
|
||||
: Array.isArray(payload?.items)
|
||||
? payload.items.length
|
||||
: rawItems.length;
|
||||
const items = (params.category && typeof effectiveLimit === 'number'
|
||||
? filteredItems.slice(effectiveOffset, effectiveOffset + effectiveLimit)
|
||||
: filteredItems).map(normalizeModelType);
|
||||
|
||||
const total = typeof payload?.totalItems === 'number'
|
||||
? payload.totalItems
|
||||
: typeof payload?.['hydra:totalItems'] === 'number'
|
||||
? payload['hydra:totalItems']
|
||||
: rawItems.length;
|
||||
|
||||
const items = rawItems.map(normalizeModelType);
|
||||
|
||||
return {
|
||||
items,
|
||||
total,
|
||||
offset: effectiveOffset,
|
||||
limit: typeof effectiveLimit === 'number' ? effectiveLimit : items.length,
|
||||
limit: effectiveLimit,
|
||||
} satisfies ModelTypeListResponse;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user