Files
webapp/app/composables/useCatalogHubs.ts
Ruslan Bakiev cc52aa6179
All checks were successful
Build Docker Image / build (push) Successful in 3m22s
Fix supplier info and catalog filtering bugs
1. Add latitude/longitude to GetSupplierProfile query
   - Without coordinates, supplier merge overwrites geo node data
   - Causes "Supplier has no coordinates" warning and no offers loading
   - Affects: useCatalogInfo.ts loadSupplierInfo() and useCatalogProducts.ts fetchProducts()

2. Add bounds validation in catalog composables
   - Validate bounds coordinates before passing to GraphQL or using in filters
   - Prevents 400 errors when bounds contain NaN/undefined/Infinity
   - Fixed in: useCatalogHubs.ts and useCatalogSuppliers.ts

Fixes:
- https://optovia.ru/catalog?info=supplier:c7f2e3f1-b16a-423d-a947-359e30858d94
- https://optovia.ru/catalog?select=hub 400 error

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-01-25 21:01:23 +07:00

185 lines
5.4 KiB
TypeScript

import { GetNodesDocument, GetHubCountriesDocument, NearestHubsDocument } from '~/composables/graphql/public/geo-generated'
const PAGE_SIZE = 24
// Shared state across list and map views
const items = ref<any[]>([])
const total = ref(0)
const selectedFilter = ref('all')
const selectedCountry = ref('all')
const countries = ref<string[]>([])
const isLoading = ref(false)
const isLoadingMore = ref(false)
const isInitialized = ref(false)
const filterProductUuid = ref<string | null>(null)
const filterBounds = ref<{ west: number; south: number; east: number; north: number } | null>(null)
export function useCatalogHubs() {
const { t } = useI18n()
const { execute } = useGraphQL()
const filters = computed(() => [
{ id: 'all', label: t('catalogHubsSection.filters.all') },
{ id: 'auto', label: t('catalogHubsSection.filters.auto') },
{ id: 'rail', label: t('catalogHubsSection.filters.rail') },
{ id: 'sea', label: t('catalogHubsSection.filters.sea') },
{ id: 'air', label: t('catalogHubsSection.filters.air') }
])
const countryFilters = computed(() => [
{ id: 'all', label: t('catalogHubsSection.filters.all_countries') },
...countries.value.map(c => ({ id: c, label: c }))
])
const itemsWithCoords = computed(() =>
items.value.filter(h => h.latitude && h.longitude)
)
const itemsByCountry = computed(() => {
const grouped = new Map<string, any[]>()
items.value.forEach(hub => {
const country = hub.country || t('catalogMap.labels.country_unknown')
if (!grouped.has(country)) grouped.set(country, [])
grouped.get(country)!.push(hub)
})
return Array.from(grouped.entries())
.map(([name, hubsList]) => ({ name, hubs: hubsList }))
.sort((a, b) => a.name.localeCompare(b.name))
})
const canLoadMore = computed(() => items.value.length < total.value)
const fetchPage = async (offset: number, replace = false) => {
if (replace) isLoading.value = true
try {
// If filtering by product, use nearestHubs with global search
// (center point 0,0 with very large radius to cover entire globe)
if (filterProductUuid.value) {
const data = await execute(
NearestHubsDocument,
{
lat: 0,
lon: 0,
radius: 20000, // 20000 km radius covers entire Earth
productUuid: filterProductUuid.value,
limit: 500 // Increased limit for global search
},
'public',
'geo'
)
const next = data?.nearestHubs || []
items.value = next
total.value = next.length
isInitialized.value = true
return
}
// Default: fetch all hubs with filters
const transportType = selectedFilter.value === 'all' ? null : selectedFilter.value
const country = selectedCountry.value === 'all' ? null : selectedCountry.value
const bounds = filterBounds.value
// Validate bounds coordinates
const validBounds = bounds &&
typeof bounds.west === 'number' && isFinite(bounds.west) &&
typeof bounds.south === 'number' && isFinite(bounds.south) &&
typeof bounds.east === 'number' && isFinite(bounds.east) &&
typeof bounds.north === 'number' && isFinite(bounds.north)
const data = await execute(
GetNodesDocument,
{
limit: PAGE_SIZE,
offset,
transportType,
country,
...(validBounds ? {
west: bounds.west,
south: bounds.south,
east: bounds.east,
north: bounds.north
} : {})
},
'public',
'geo'
)
const next = data?.nodes || []
items.value = replace ? next : items.value.concat(next)
total.value = data?.nodesCount ?? total.value
isInitialized.value = true
} finally {
isLoading.value = false
}
}
const loadCountries = async () => {
try {
const data = await execute(GetHubCountriesDocument, {}, 'public', 'geo')
countries.value = data?.hubCountries || []
} catch (e) {
console.error('Failed to load hub countries', e)
}
}
const loadMore = async () => {
if (isLoadingMore.value) return
isLoadingMore.value = true
try {
await fetchPage(items.value.length)
} finally {
isLoadingMore.value = false
}
}
// При смене фильтра - перезагрузка
watch([selectedFilter, selectedCountry], () => {
if (isInitialized.value) {
fetchPage(0, true)
}
})
const setProductFilter = (uuid: string | null) => {
if (filterProductUuid.value === uuid) return // Early return if unchanged
filterProductUuid.value = uuid
if (isInitialized.value) {
fetchPage(0, true)
}
}
const setBoundsFilter = (bounds: { west: number; south: number; east: number; north: number } | null) => {
filterBounds.value = bounds
if (isInitialized.value) {
fetchPage(0, true)
}
}
// Initialize data if not already loaded
const init = async () => {
if (!isInitialized.value && items.value.length === 0) {
await Promise.all([
fetchPage(0, true),
loadCountries()
])
}
}
return {
items,
total,
selectedFilter,
selectedCountry,
filters,
countryFilters,
isLoading,
isLoadingMore,
itemsWithCoords,
itemsByCountry,
canLoadMore,
fetchPage,
loadMore,
init,
setProductFilter,
setBoundsFilter
}
}