Restructure manager navigation
This commit is contained in:
31
app/app.vue
31
app/app.vue
@@ -15,30 +15,29 @@ const managerPageTabs = computed(() => {
|
|||||||
return [];
|
return [];
|
||||||
}
|
}
|
||||||
|
|
||||||
if (route.path === '/clients') {
|
if (
|
||||||
|
route.path === '/client-orders'
|
||||||
|
|| route.path.startsWith('/client-orders/')
|
||||||
|
|| route.path === '/clients'
|
||||||
|
|| route.path.startsWith('/clients/')
|
||||||
|
) {
|
||||||
return [
|
return [
|
||||||
{
|
{
|
||||||
key: 'users',
|
key: 'orders',
|
||||||
label: 'Пользователи',
|
label: 'Заказы',
|
||||||
active: route.query.tab !== 'requests',
|
active: route.path === '/client-orders' || route.path.startsWith('/client-orders/'),
|
||||||
to: {
|
to: {
|
||||||
path: '/clients',
|
path: '/client-orders',
|
||||||
query: {
|
query: route.path === '/client-orders' ? route.query : {},
|
||||||
...route.query,
|
|
||||||
tab: 'users',
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 'requests',
|
key: 'clients',
|
||||||
label: 'Заявки',
|
label: 'Клиенты',
|
||||||
active: route.query.tab === 'requests',
|
active: route.path === '/clients' || route.path.startsWith('/clients/'),
|
||||||
to: {
|
to: {
|
||||||
path: '/clients',
|
path: '/clients',
|
||||||
query: {
|
query: route.path === '/clients' ? route.query : {},
|
||||||
...route.query,
|
|
||||||
tab: 'requests',
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|||||||
@@ -2,23 +2,22 @@
|
|||||||
type DockItem = {
|
type DockItem = {
|
||||||
to: string;
|
to: string;
|
||||||
label: string;
|
label: string;
|
||||||
icon: 'orders' | 'clients' | 'bonus';
|
icon: 'orders' | 'bonus';
|
||||||
};
|
};
|
||||||
|
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
|
|
||||||
const dockItems: DockItem[] = [
|
const dockItems: DockItem[] = [
|
||||||
{ to: '/client-orders', label: 'Заказы', icon: 'orders' },
|
{ to: '/client-orders', label: 'Заказы', icon: 'orders' },
|
||||||
{ to: '/clients', label: 'Клиенты', icon: 'clients' },
|
|
||||||
{ to: '/bonus-system', label: 'Бонусы', icon: 'bonus' },
|
{ to: '/bonus-system', label: 'Бонусы', icon: 'bonus' },
|
||||||
];
|
];
|
||||||
|
|
||||||
function isActive(path: string) {
|
function isActive(path: string) {
|
||||||
if (path === '/client-orders') {
|
if (path === '/client-orders') {
|
||||||
return route.path === '/client-orders' || route.path.startsWith('/client-orders/');
|
return route.path === '/client-orders'
|
||||||
}
|
|| route.path.startsWith('/client-orders/')
|
||||||
if (path === '/clients') {
|
|| route.path === '/clients'
|
||||||
return route.path === '/clients' || route.path.startsWith('/clients/');
|
|| route.path.startsWith('/clients/');
|
||||||
}
|
}
|
||||||
if (path === '/bonus-system') {
|
if (path === '/bonus-system') {
|
||||||
return route.path === '/bonus-system' || route.path.startsWith('/bonus-system/');
|
return route.path === '/bonus-system' || route.path.startsWith('/bonus-system/');
|
||||||
@@ -44,12 +43,6 @@ function isActive(path: string) {
|
|||||||
<path d="M7 17.25H13" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" />
|
<path d="M7 17.25H13" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" />
|
||||||
<rect x="4" y="4" width="16" height="16" rx="4" stroke="currentColor" stroke-width="1.8" />
|
<rect x="4" y="4" width="16" height="16" rx="4" stroke="currentColor" stroke-width="1.8" />
|
||||||
</svg>
|
</svg>
|
||||||
<svg v-else-if="item.icon === 'clients'" viewBox="0 0 24 24" fill="none" class="h-5 w-5">
|
|
||||||
<path d="M8.5 11.25C10.0188 11.25 11.25 10.0188 11.25 8.5C11.25 6.98122 10.0188 5.75 8.5 5.75C6.98122 5.75 5.75 6.98122 5.75 8.5C5.75 10.0188 6.98122 11.25 8.5 11.25Z" stroke="currentColor" stroke-width="1.8" />
|
|
||||||
<path d="M15.75 10.25C16.9926 10.25 18 9.24264 18 8C18 6.75736 16.9926 5.75 15.75 5.75" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" />
|
|
||||||
<path d="M4.75 17.5C5.45774 15.4578 7.39669 14 9.75 14H10.25C12.6033 14 14.5423 15.4578 15.25 17.5" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" />
|
|
||||||
<path d="M15.5 14.5C17.0401 14.7577 18.3497 15.7812 18.95 17.2" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" />
|
|
||||||
</svg>
|
|
||||||
<svg v-else viewBox="0 0 24 24" fill="none" class="h-5 w-5">
|
<svg v-else viewBox="0 0 24 24" fill="none" class="h-5 w-5">
|
||||||
<path d="M12 4.75L14.2401 9.28984L19.25 10.0172L15.625 13.5504L16.4802 18.5398L12 16.1848L7.51983 18.5398L8.375 13.5504L4.75 10.0172L9.75987 9.28984L12 4.75Z" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round" />
|
<path d="M12 4.75L14.2401 9.28984L19.25 10.0172L15.625 13.5504L16.4802 18.5398L12 16.1848L7.51983 18.5398L8.375 13.5504L4.75 10.0172L9.75987 9.28984L12 4.75Z" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round" />
|
||||||
</svg>
|
</svg>
|
||||||
|
|||||||
@@ -98,7 +98,7 @@ function userInitials(fullName: string) {
|
|||||||
<section class="space-y-6">
|
<section class="space-y-6">
|
||||||
<UiSectionSearchHero
|
<UiSectionSearchHero
|
||||||
v-model="search"
|
v-model="search"
|
||||||
title="Пользователи"
|
title="Клиенты"
|
||||||
:search-placeholder="activeTab === 'users' ? 'Имя пользователя' : 'Компания, контакт, email или ИНН'"
|
:search-placeholder="activeTab === 'users' ? 'Имя пользователя' : 'Компания, контакт, email или ИНН'"
|
||||||
>
|
>
|
||||||
<template #controls>
|
<template #controls>
|
||||||
@@ -108,6 +108,23 @@ function userInitials(fullName: string) {
|
|||||||
</template>
|
</template>
|
||||||
</UiSectionSearchHero>
|
</UiSectionSearchHero>
|
||||||
|
|
||||||
|
<div class="flex flex-wrap gap-2">
|
||||||
|
<NuxtLink
|
||||||
|
to="/clients?tab=users"
|
||||||
|
class="inline-flex items-center rounded-full px-4 py-2 text-sm font-semibold transition"
|
||||||
|
:class="activeTab === 'users' ? 'bg-[#123824] text-white' : 'bg-white text-[#355947] hover:bg-[#f4faf6]'"
|
||||||
|
>
|
||||||
|
Клиенты
|
||||||
|
</NuxtLink>
|
||||||
|
<NuxtLink
|
||||||
|
to="/clients?tab=requests"
|
||||||
|
class="inline-flex items-center rounded-full px-4 py-2 text-sm font-semibold transition"
|
||||||
|
:class="activeTab === 'requests' ? 'bg-[#123824] text-white' : 'bg-white text-[#355947] hover:bg-[#f4faf6]'"
|
||||||
|
>
|
||||||
|
Заявки
|
||||||
|
</NuxtLink>
|
||||||
|
</div>
|
||||||
|
|
||||||
<template v-if="activeTab === 'users'">
|
<template v-if="activeTab === 'users'">
|
||||||
<div v-if="usersQuery.loading.value" class="manager-empty-state">
|
<div v-if="usersQuery.loading.value" class="manager-empty-state">
|
||||||
Загружаем пользователей...
|
Загружаем пользователей...
|
||||||
|
|||||||
Reference in New Issue
Block a user