Show map by default on /catalog, add offersCount to products
All checks were successful
Build Docker Image / build (push) Successful in 3m27s

- Change displayMode from 'hero' to 'map-default' for /catalog
- Always show map on catalog page (fullWidthMap when no selectMode)
- Add offersCount to GetProducts, GetProductsBySupplier, GetProductsNearHub
- Remove CatalogHero from catalog page (hero content stays on /)
This commit is contained in:
Ruslan Bakiev
2026-01-22 17:22:22 +07:00
parent 39f8364edb
commit 062fcd2a50
5 changed files with 17 additions and 14 deletions

View File

@@ -2,7 +2,7 @@ import type { LocationQuery } from 'vue-router'
export type SelectMode = 'product' | 'supplier' | 'hub' | null export type SelectMode = 'product' | 'supplier' | 'hub' | null
export type DisplayMode = export type DisplayMode =
| 'hero' | 'map-default'
| 'grid-products' | 'grid-products'
| 'grid-suppliers' | 'grid-suppliers'
| 'grid-hubs' | 'grid-hubs'
@@ -148,8 +148,8 @@ export function useCatalogSearch() {
if (supplierId.value) return 'grid-products-from-supplier' if (supplierId.value) return 'grid-products-from-supplier'
if (hubId.value) return 'grid-products-in-hub' if (hubId.value) return 'grid-products-in-hub'
// Empty state // Default: show map with all offers
return 'hero' return 'map-default'
}) })
// Check if we're on the main page (not /catalog) // Check if we're on the main page (not /catalog)

View File

@@ -57,9 +57,7 @@
</template> </template>
<template #empty> <template #empty>
<!-- Hero for empty state --> <Text v-if="displayMode !== 'map-default'" tone="muted">{{ t('catalog.empty.noResults') }}</Text>
<CatalogHero v-if="displayMode === 'hero'" @start-select="startSelect" />
<Text v-else tone="muted">{{ t('catalog.empty.noResults') }}</Text>
</template> </template>
</CatalogPage> </CatalogPage>
</template> </template>
@@ -125,23 +123,25 @@ const cardType = computed(() => {
} }
}) })
const showMap = computed(() => displayMode.value !== 'hero') // Always show map on /catalog
const showMap = computed(() => true)
// Full width map when not in select mode (after filter is selected) // Full width map when not in select mode (after filter is selected or default map view)
// selectMode is active = grid + map, after selection = only map // selectMode is active = grid + map, after selection or default = only map
const fullWidthMap = computed(() => !selectMode.value && displayMode.value !== 'hero') const fullWidthMap = computed(() => !selectMode.value)
// Use server clustering for grids that need it // Use server clustering for grids that need it
const useServerClustering = computed(() => { const useServerClustering = computed(() => {
// Products grid - show offers clusters // Products grid - show offers clusters
// Hubs grid - show hubs clusters // Hubs grid - show hubs clusters
// Offers grid - show offer clusters // Offers grid - show offer clusters
return ['grid-products', 'grid-hubs', 'grid-offers', 'grid-products-from-supplier', 'grid-products-in-hub'].includes(displayMode.value) // Default map - show all offers clusters
return ['map-default', 'grid-products', 'grid-hubs', 'grid-offers', 'grid-products-from-supplier', 'grid-products-in-hub'].includes(displayMode.value)
}) })
const clusterNodeType = computed(() => { const clusterNodeType = computed(() => {
// For products/offers show offer locations // For products/offers/default map show offer locations
if (['grid-products', 'grid-offers', 'grid-products-from-supplier', 'grid-products-in-hub'].includes(displayMode.value)) { if (['map-default', 'grid-products', 'grid-offers', 'grid-products-from-supplier', 'grid-products-in-hub'].includes(displayMode.value)) {
return 'offer' return 'offer'
} }
// For hubs show logistics nodes // For hubs show logistics nodes
@@ -219,7 +219,7 @@ const currentItems = computed(() => {
case 'grid-offers': case 'grid-offers':
items = offers.value items = offers.value
break break
case 'hero': case 'map-default':
default: default:
items = [] items = []
} }

View File

@@ -2,5 +2,6 @@ query GetProducts {
products { products {
uuid uuid
name name
offersCount
} }
} }

View File

@@ -2,5 +2,6 @@ query GetProductsBySupplier($supplierUuid: String!) {
productsBySupplier(supplierUuid: $supplierUuid) { productsBySupplier(supplierUuid: $supplierUuid) {
uuid uuid
name name
offersCount
} }
} }

View File

@@ -2,5 +2,6 @@ query GetProductsNearHub($hubUuid: String!, $radiusKm: Float) {
productsNearHub(hubUuid: $hubUuid, radiusKm: $radiusKm) { productsNearHub(hubUuid: $hubUuid, radiusKm: $radiusKm) {
uuid uuid
name name
offersCount
} }
} }