From 825128e3492a8c9e458c45bc78db23cc06320303 Mon Sep 17 00:00:00 2001
From: Ruslan Bakiev <572431+veikab@users.noreply.github.com>
Date: Mon, 19 Jan 2026 12:40:24 +0700
Subject: [PATCH] Fix catalog map navigation and hover interactions
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 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
---
 app/pages/catalog/hubs/[id]/[productId].vue                | 4 ++++
 app/pages/catalog/hubs/index.vue                           | 7 +++++++
 app/pages/catalog/offers/[productId]/[hubId].vue           | 4 ++++
 .../catalog/suppliers/[supplierId]/[productId]/[hubId].vue | 3 +++
 app/pages/catalog/suppliers/index.vue                      | 7 +++++++
 5 files changed, 25 insertions(+)

diff --git a/app/pages/catalog/hubs/[id]/[productId].vue b/app/pages/catalog/hubs/[id]/[productId].vue
index 80a420c..6e02f73 100644
--- a/app/pages/catalog/hubs/[id]/[productId].vue
+++ b/app/pages/catalog/hubs/[id]/[productId].vue
@@ -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())
 
diff --git a/app/pages/catalog/hubs/index.vue b/app/pages/catalog/hubs/index.vue
index 2b6bf43..5a6b93d 100644
--- a/app/pages/catalog/hubs/index.vue
+++ b/app/pages/catalog/hubs/index.vue
@@ -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(() => ({
diff --git a/app/pages/catalog/offers/[productId]/[hubId].vue b/app/pages/catalog/offers/[productId]/[hubId].vue
index 79312f7..0554cc5 100644
--- a/app/pages/catalog/offers/[productId]/[hubId].vue
+++ b/app/pages/catalog/offers/[productId]/[hubId].vue
@@ -33,6 +33,8 @@
         map-id="offers-product-hub-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())
 
diff --git a/app/pages/catalog/suppliers/[supplierId]/[productId]/[hubId].vue b/app/pages/catalog/suppliers/[supplierId]/[productId]/[hubId].vue
index c227060..0db3271 100644
--- a/app/pages/catalog/suppliers/[supplierId]/[productId]/[hubId].vue
+++ b/app/pages/catalog/suppliers/[supplierId]/[productId]/[hubId].vue
@@ -5,6 +5,8 @@
     with-map
     map-id="supplier-route-map"
     point-color="#10b981"
+    :hovered-id="hoveredPointUuid"
+    @update:hovered-id="hoveredPointUuid = $event"
   >
     <template #searchBar>
       <CatalogSearchBar
@@ -89,6 +91,7 @@ const product = ref<{ uuid: string; name: string } | null>(null)
 const hub = ref<any>(null)
 const sourceLocation = ref<{ uuid: string; name: string; latitude?: number; longitude?: number } | null>(null)
 const routeData = ref<any>(null)
+const hoveredPointUuid = ref<string>()
 
 const supplierId = computed(() => routeRef.params.supplierId as string)
 const productId = computed(() => routeRef.params.productId as string)
diff --git a/app/pages/catalog/suppliers/index.vue b/app/pages/catalog/suppliers/index.vue
index f6af820..8034296 100644
--- a/app/pages/catalog/suppliers/index.vue
+++ b/app/pages/catalog/suppliers/index.vue
@@ -7,6 +7,7 @@
     map-id="suppliers-map"
     point-color="#3b82f6"
     :total-count="total"
+    @select="onSelectSupplier"
   >
     <template #searchBar="{ displayedCount, totalCount }">
       <CatalogSearchBar
@@ -53,6 +54,7 @@ definePageMeta({
 })
 
 const { t } = useI18n()
+const localePath = useLocalePath()
 
 const {
   items,
@@ -103,6 +105,11 @@ const onSearch = () => {
   // TODO: Implement search
 }
 
+// Handle supplier selection from map
+const onSelectSupplier = (supplier: any) => {
+  navigateTo(localePath(`/catalog/suppliers/${supplier.uuid || supplier.teamUuid}`))
+}
+
 await init()
 
 useHead(() => ({