fix(catalog): restore hover pin actions
All checks were successful
Build Docker Image / build (push) Successful in 4m56s

This commit is contained in:
Ruslan Bakiev
2026-02-07 09:55:22 +07:00
parent 1fa4a707ad
commit 589a74d75e
3 changed files with 59 additions and 0 deletions

View File

@@ -122,6 +122,13 @@
selectable
@select="onProductSelect(product)"
/>
<button
class="absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity rounded-full bg-white/10 hover:bg-white/20 p-1"
@click.stop="emit('pin', 'product', product)"
aria-label="Pin product"
>
<Icon name="lucide:pin" size="14" class="text-white/80" />
</button>
</div>
</div>
</section>
@@ -189,6 +196,13 @@
selectable
@select="onSupplierSelect(supplier)"
/>
<button
class="absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity rounded-full bg-white/10 hover:bg-white/20 p-1"
@click.stop="emit('pin', 'supplier', supplier)"
aria-label="Pin supplier"
>
<Icon name="lucide:pin" size="14" class="text-white/80" />
</button>
</div>
</div>
</section>
@@ -227,6 +241,13 @@
selectable
@select="onHubSelect(hub)"
/>
<button
class="absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity rounded-full bg-white/10 hover:bg-white/20 p-1"
@click.stop="emit('pin', 'hub', hub)"
aria-label="Pin hub"
>
<Icon name="lucide:pin" size="14" class="text-white/80" />
</button>
</div>
</div>
</template>
@@ -252,6 +273,13 @@
selectable
@select="onHubSelect(hub)"
/>
<button
class="absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity rounded-full bg-white/10 hover:bg-white/20 p-1"
@click.stop="emit('pin', 'hub', hub)"
aria-label="Pin hub"
>
<Icon name="lucide:pin" size="14" class="text-white/80" />
</button>
</div>
</div>
</template>
@@ -298,6 +326,7 @@ const emit = defineEmits<{
'select-offer': [offer: { uuid: string; productUuid?: string | null }]
'update:current-tab': [tab: string]
'open-kyc': [uuid: string | undefined]
'pin': [type: 'product' | 'hub' | 'supplier', item: { uuid?: string | null; name?: string | null }]
}>()
const { t } = useI18n()

View File

@@ -37,6 +37,13 @@
compact
@select="onSelect(item)"
/>
<button
class="absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity rounded-full bg-white/10 hover:bg-white/20 p-1"
@click.stop="emit('pin', 'product', item)"
aria-label="Pin product"
>
<Icon name="lucide:pin" size="14" class="text-white/80" />
</button>
</div>
</template>
@@ -54,6 +61,13 @@
selectable
@select="onSelect(item)"
/>
<button
class="absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity rounded-full bg-white/10 hover:bg-white/20 p-1"
@click.stop="emit('pin', 'hub', item)"
aria-label="Pin hub"
>
<Icon name="lucide:pin" size="14" class="text-white/80" />
</button>
</div>
</template>
@@ -71,6 +85,13 @@
selectable
@select="onSelect(item)"
/>
<button
class="absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity rounded-full bg-white/10 hover:bg-white/20 p-1"
@click.stop="emit('pin', 'supplier', item)"
aria-label="Pin supplier"
>
<Icon name="lucide:pin" size="14" class="text-white/80" />
</button>
</div>
</template>
@@ -111,6 +132,7 @@ const emit = defineEmits<{
'close': []
'load-more': []
'hover': [uuid: string | null]
'pin': [type: 'product' | 'hub' | 'supplier', item: Item]
}>()
const { t } = useI18n()

View File

@@ -40,6 +40,7 @@
:loading-more="selectionLoadingMore"
:has-more="selectionHasMore && !filterByBounds"
@select="onSelectItem"
@pin="onPinItem"
@close="onClosePanel"
@load-more="onLoadMore"
@hover="onHoverItem"
@@ -66,6 +67,7 @@
@select-product="onInfoSelectProduct"
@select-offer="onSelectOffer"
@open-kyc="onOpenKyc"
@pin="onPinItem"
/>
<!-- Quote results: show offers after search -->
@@ -585,6 +587,12 @@ const onSelectItem = (type: string, item: { uuid?: string | null; name?: string
}
}
const onPinItem = (type: 'product' | 'hub' | 'supplier', item: { uuid?: string | null; name?: string | null }) => {
if (!item.uuid) return
const label = item.name || item.uuid.slice(0, 8) + '...'
selectItem(type, item.uuid, label)
}
// Close panel (cancel select mode)
const onClosePanel = () => {
cancelSelect()