Replace breadcrumbs with key-value badges in search bar
All checks were successful
Build Docker Image / build (push) Successful in 4m0s

- Add key property to FilterOption interface in CatalogSearchBar
- Display badges in "Key: Value" format (e.g., "Поставщик: Name")
- Remove SuppliersBreadcrumbs from supplier catalog pages
- Add navigationFilters computed with supplier/product/hub badges
- Add handleRemoveFilter to navigate back when badge is clicked
This commit is contained in:
Ruslan Bakiev
2026-01-19 11:09:58 +07:00
parent bfbab9cef4
commit 0a79b90d1c
4 changed files with 116 additions and 22 deletions

View File

@@ -15,7 +15,13 @@
class="badge badge-sm badge-primary gap-1 cursor-pointer hover:badge-error transition-colors"
@click="$emit('remove-filter', filter.id)"
>
{{ filter.label }}
<template v-if="filter.key">
<span class="opacity-70">{{ filter.key }}:</span>
<span>{{ filter.label }}</span>
</template>
<template v-else>
{{ filter.label }}
</template>
<svg xmlns="http://www.w3.org/2000/svg" class="h-3 w-3" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd" />
</svg>
@@ -96,6 +102,7 @@
interface FilterOption {
id: string
label: string
key?: string // Optional key for "Key: Value" format badges
}
interface SortOption {