All checks were successful
Build Docker Image / build (push) Successful in 4m3s
- SelectionPanel header: dark glass style instead of white - useCatalogProducts: filter by supplierId or hubId using dedicated queries - catalog/index: connect filters from query params to composable
116 lines
2.7 KiB
TypeScript
116 lines
2.7 KiB
TypeScript
import {
|
|
GetProductsDocument,
|
|
GetProductsBySupplierDocument,
|
|
GetProductsNearHubDocument
|
|
} from '~/composables/graphql/public/geo-generated'
|
|
|
|
// Shared state
|
|
const items = ref<any[]>([])
|
|
const isLoading = ref(false)
|
|
const isLoadingMore = ref(false)
|
|
const isInitialized = ref(false)
|
|
|
|
// Filter state
|
|
const filterSupplierUuid = ref<string | null>(null)
|
|
const filterHubUuid = ref<string | null>(null)
|
|
|
|
export function useCatalogProducts() {
|
|
const { execute } = useGraphQL()
|
|
|
|
// Products don't have server-side pagination yet, so we load all at once
|
|
const canLoadMore = computed(() => false)
|
|
|
|
const fetchProducts = async () => {
|
|
if (isLoading.value) return
|
|
isLoading.value = true
|
|
try {
|
|
let data
|
|
|
|
if (filterSupplierUuid.value) {
|
|
// Products from specific supplier
|
|
data = await execute(
|
|
GetProductsBySupplierDocument,
|
|
{ supplierUuid: filterSupplierUuid.value },
|
|
'public',
|
|
'geo'
|
|
)
|
|
items.value = data?.productsBySupplier || []
|
|
} else if (filterHubUuid.value) {
|
|
// Products near hub
|
|
data = await execute(
|
|
GetProductsNearHubDocument,
|
|
{ hubUuid: filterHubUuid.value },
|
|
'public',
|
|
'geo'
|
|
)
|
|
items.value = data?.productsNearHub || []
|
|
} else {
|
|
// All products
|
|
data = await execute(
|
|
GetProductsDocument,
|
|
{},
|
|
'public',
|
|
'geo'
|
|
)
|
|
items.value = data?.products || []
|
|
}
|
|
|
|
isInitialized.value = true
|
|
} finally {
|
|
isLoading.value = false
|
|
}
|
|
}
|
|
|
|
const loadMore = async () => {
|
|
// No-op: products don't support pagination yet
|
|
}
|
|
|
|
const init = async () => {
|
|
if (!isInitialized.value && items.value.length === 0) {
|
|
await fetchProducts()
|
|
}
|
|
}
|
|
|
|
// Filter setters
|
|
const setSupplierFilter = (uuid: string | null) => {
|
|
if (filterSupplierUuid.value !== uuid) {
|
|
filterSupplierUuid.value = uuid
|
|
filterHubUuid.value = null // clear other filter
|
|
isInitialized.value = false
|
|
fetchProducts()
|
|
}
|
|
}
|
|
|
|
const setHubFilter = (uuid: string | null) => {
|
|
if (filterHubUuid.value !== uuid) {
|
|
filterHubUuid.value = uuid
|
|
filterSupplierUuid.value = null // clear other filter
|
|
isInitialized.value = false
|
|
fetchProducts()
|
|
}
|
|
}
|
|
|
|
const clearFilters = () => {
|
|
if (filterSupplierUuid.value || filterHubUuid.value) {
|
|
filterSupplierUuid.value = null
|
|
filterHubUuid.value = null
|
|
isInitialized.value = false
|
|
fetchProducts()
|
|
}
|
|
}
|
|
|
|
return {
|
|
items,
|
|
isLoading,
|
|
isLoadingMore,
|
|
isInitialized,
|
|
canLoadMore,
|
|
fetchProducts,
|
|
loadMore,
|
|
init,
|
|
setSupplierFilter,
|
|
setHubFilter,
|
|
clearFilters
|
|
}
|
|
}
|