Role switcher: dropdown menu with chevron icon
All checks were successful
Build Docker Image / build (push) Successful in 3m59s

This commit is contained in:
Ruslan Bakiev
2026-01-29 16:07:41 +07:00
parent bc037e85a4
commit 6ee8c12e6f

View File

@@ -32,7 +32,7 @@
>
{{ $t('catalog.modes.quote') }}
</button>
<!-- Role switcher: Я клиент 🔄 -->
<!-- Role switcher: Я клиент + dropdown -->
<div v-if="loggedIn" class="flex items-center">
<NuxtLink
:to="localePath(currentRole === 'SELLER' ? '/clientarea/offers' : '/clientarea/orders')"
@@ -44,15 +44,34 @@
{{ currentRole === 'SELLER' ? $t('cabinetNav.roles.seller') : $t('cabinetNav.roles.client') }}
</NuxtLink>
<!-- Иконка swap (если есть обе роли) -->
<button
v-if="hasMultipleRoles"
class="p-1 ml-0.5 transition-colors"
:class="useWhiteText ? 'text-white/50 hover:text-white' : 'text-base-content/50 hover:text-base-content'"
@click="$emit('switch-role', currentRole === 'BUYER' ? 'SELLER' : 'BUYER')"
>
<Icon name="lucide:arrow-left-right" size="14" />
</button>
<!-- Dropdown для переключения роли (если есть обе роли) -->
<div v-if="hasMultipleRoles" class="dropdown dropdown-end">
<button
tabindex="0"
class="p-1 ml-0.5 transition-colors"
:class="useWhiteText ? 'text-white/50 hover:text-white' : 'text-base-content/50 hover:text-base-content'"
>
<Icon name="lucide:chevron-down" size="14" />
</button>
<ul tabindex="0" class="dropdown-content menu bg-base-100 rounded-box z-50 w-48 p-2 shadow-lg border border-base-300">
<li>
<a
:class="{ active: currentRole === 'BUYER' }"
@click="$emit('switch-role', 'BUYER')"
>
{{ $t('cabinetNav.roles.client') }}
</a>
</li>
<li>
<a
:class="{ active: currentRole === 'SELLER' }"
@click="$emit('switch-role', 'SELLER')"
>
{{ $t('cabinetNav.roles.seller') }}
</a>
</li>
</ul>
</div>
</div>
</nav>
</div>