Fix catalog map navigation and hover interactions
All checks were successful
Build Docker Image / build (push) Successful in 3m44s

- Add @select handler to hubs/index.vue and suppliers/index.vue
  for map click navigation
- Add hoveredId props to final pages for point highlighting
  on card hover
- Add "Выберите источник" hint on final pages with sources
This commit is contained in:
Ruslan Bakiev
2026-01-19 12:40:24 +07:00
parent 2abbfd8895
commit 825128e349
5 changed files with 25 additions and 0 deletions

View File

@@ -33,6 +33,8 @@
map-id="hub-product-sources-map"
point-color="#10b981"
v-model:selected-id="selectedSourceUuid"
:hovered-id="hoveredSourceUuid"
@update:hovered-id="hoveredSourceUuid = $event"
>
<template #searchBar>
<CatalogSearchBar
@@ -45,6 +47,7 @@
<template #header>
<Text v-if="sources.length === 0 && !isLoadingRoutes" tone="muted">Нет доступных источников</Text>
<Stack v-else gap="4">
<Text v-if="sources.length > 0" tone="muted">Выберите источник</Text>
<Card padding="md">
<div class="h-48">
<ClientOnly>
@@ -102,6 +105,7 @@ const isLoadingRoutes = ref(false)
const hub = ref<any>(null)
const product = ref<{ uuid: string; name: string } | null>(null)
const selectedSourceUuid = ref('')
const hoveredSourceUuid = ref<string>()
const rawSources = ref<any[]>([])
const offersData = ref<Map<string, any>>(new Map())

View File

@@ -8,6 +8,7 @@
map-id="hubs-map"
point-color="#10b981"
:total-count="total"
@select="onSelectHub"
>
<template #searchBar="{ displayedCount, totalCount }">
<CatalogSearchBar
@@ -85,6 +86,7 @@ definePageMeta({
})
const { t } = useI18n()
const localePath = useLocalePath()
const {
items,
@@ -163,6 +165,11 @@ const onSearch = () => {
// TODO: Implement search by hub name
}
// Handle hub selection from map
const onSelectHub = (hub: any) => {
navigateTo(localePath(`/catalog/hubs/${hub.uuid}`))
}
await init()
useHead(() => ({