usite-sas-bic/sirpremiumv2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor navigation layout for improved structure

Browse Source 
Reorganized the navigation sidebar to use a flex column layout and moved the menu and user info into a scrollable container. Improved sticky header behavior, added a logout button at the bottom, and fixed minor styling issues for better usability and maintainability.
This commit is contained in:
Juan Felipe Duarte
2025-09-23 09:48:02 -05:00
parent 9b9ada492a
commit 35b4f51aee
1 changed files with 225 additions and 220 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/layouts/navigation.blade.php
+225 -220
View File
@@ -4,236 +4,241 @@
$bg = $config->color_barra ?? '#0000ff';
@endphp
<aside x-cloak :class="openAside ? 'translate-x-0' : '-translate-x-full'" class="z-20 fixed inset-y-0 left-0 w-64 transform transition-transform duration-300 ease-in-out h-screen overflow-y-auto shadow-lg" style="background: {{ $bg }};">
<div class="flex items-center justify-between px-4 py-3 text-white border-b border-white/20">
<div>
<aside x-cloak :class="openAside ? 'translate-x-0' : '-translate-x-full'" class="z-20 fixed inset-y-0 left-0 w-64 transform transition-transform duration-300 ease-in-out min-h-screen shadow-lg flex flex-col" style="background: {{ $bg }};">
<div class="flex items-center justify-between px-4 py-3 text-white border-b border-white/20 sticky top-0 bg-[{{ $bg }}] z-30">
<div class="w-20">
<x-application-logo />
</div>
<button @click="openAside = !openAside" class="p-2 rounded-md text-white hover:bg-blue-900 focus:outline-none cursor-pointer">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
<button @click="openAside = !openAside"
class="p-2 rounded-md text-white hover:bg-blue-900 focus:outline-none cursor-pointer">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none"
viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12" />
</svg>
</button>
</div>
<div class="text-center py-4 ms:py-6">
<div class="font-medium text-base text-white">{{ Auth::user()->name ?? ''}}</div>
<div class="font-medium text-sm text-gray-500">{{ Auth::user()->email ?? ''}}</div>
<div class="font-semibold text-sm text-gray-500 capitalize">{{ Auth::user()->rol->nombre ?? ''}}</div>
<div class="flex-1 overflow-y-auto select-none">
<div class="text-center py-4 ms:py-6">
<div class="font-medium text-base text-white">{{ Auth::user()->name ?? ''}}</div>
<div class="font-medium text-sm text-gray-500">{{ Auth::user()->email ?? ''}}</div>
<div class="font-semibold text-sm text-gray-500 capitalize">{{ Auth::user()->rol->nombre ?? ''}}</div>
<!-- Items del menú -->
<nav class="px-4 mt-2 space-y-2 pb-4">
<a href="{{ route('dashboard') }}" class="flex items-center justify-start gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('dashboard') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="m2.25 12 8.954-8.955c.44-.439 1.152-.439 1.591 0L21.75 12M4.5 9.75v10.125c0 .621.504 1.125 1.125 1.125H9.75v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21h4.125c.621 0 1.125-.504 1.125-1.125V9.75M8.25 21h8.25" />
</svg>
<span>Inicio</span>
</a>
<a href="{{ route('clientes') }}" class="flex items-center justify-start gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('clientes') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" >
<path stroke-linecap="round" stroke-linejoin="round" d="M17.982 18.725A7.488 7.488 0 0 0 12 15.75a7.488 7.488 0 0 0-5.982 2.975m11.963 0a9 9 0 1 0-11.963 0m11.963 0A8.966 8.966 0 0 1 12 21a8.966 8.966 0 0 1-5.982-2.275M15 9.75a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" />
</svg>
<span>Clientes</span>
</a>
<a href="{{ route('servicios') }}" class="flex items-center justify-start gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('servicios') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M9 17.25v1.007a3 3 0 0 1-.879 2.122L7.5 21h9l-.621-.621A3 3 0 0 1 15 18.257V17.25m6-12V15a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 15V5.25m18 0A2.25 2.25 0 0 0 18.75 3H5.25A2.25 2.25 0 0 0 3 5.25m18 0V12a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 12V5.25" />
</svg>
<span>Servicios</span>
</a>
<a href="{{ route('top') }}" class="flex items-center justify-start gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('top') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M11.48 3.499a.562.562 0 0 1 1.04 0l2.125 5.111a.563.563 0 0 0 .475.345l5.518.442c.499.04.701.663.321.988l-4.204 3.602a.563.563 0 0 0-.182.557l1.285 5.385a.562.562 0 0 1-.84.61l-4.725-2.885a.562.562 0 0 0-.586 0L6.982 20.54a.562.562 0 0 1-.84-.61l1.285-5.386a.562.562 0 0 0-.182-.557l-4.204-3.602a.562.562 0 0 1 .321-.988l5.518-.442a.563.563 0 0 0 .475-.345L11.48 3.5Z" />
</svg>
<span>Top distribuidores</span>
</a>
@if (!empty($config->catalogo))
<a href="{{ asset($config->catalogo) }}" download="{{ basename($config->catalogo) }}" class="flex items-center justify-start gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('top') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5M16.5 12 12 16.5m0 0L7.5 12m4.5 4.5V3" />
</svg>
<span>Descargar Catalogo</span>
</a>
@endif
@if (auth()->user()->rol->nombre != 'editor' && auth()->user()->rol->nombre != 'administrador')
<a href="{{ route('reportes') }}" class="flex items-center justify-start gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('reportes') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M3 13.125C3 12.504 3.504 12 4.125 12h2.25c.621 0 1.125.504 1.125 1.125v6.75C7.5 20.496 6.996 21 6.375 21h-2.25A1.125 1.125 0 0 1 3 19.875v-6.75ZM9.75 8.625c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125v11.25c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 0 1-1.125-1.125V8.625ZM16.5 4.125c0-.621.504-1.125 1.125-1.125h2.25C20.496 3 21 3.504 21 4.125v15.75c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 0 1-1.125-1.125V4.125Z" />
</svg>
<span>Reportes</span>
</a>
@endif
@if ((auth()->user()->subvendedor && $config->subvendedor) || in_array(auth()->user()->rol->nombre, ['super', 'administrador', 'editor']))
<div x-data="{ open: false }" class="space-y-1">
<!-- Botón para admin -->
<button @click="open = !open"
class="flex items-center justify-between w-full py-2 px-3 rounded text-white hover:bg-white/10 focus:outline-none">
<div class="flex items-center gap-2">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6A2.25 2.25 0 0 1 6 3.75h2.25A2.25 2.25 0 0 1 10.5 6v2.25a2.25 2.25 0 0 1-2.25 2.25H6a2.25 2.25 0 0 1-2.25-2.25V6ZM3.75 15.75A2.25 2.25 0 0 1 6 13.5h2.25a2.25 2.25 0 0 1 2.25 2.25V18a2.25 2.25 0 0 1-2.25 2.25H6A2.25 2.25 0 0 1 3.75 18v-2.25ZM13.5 6a2.25 2.25 0 0 1 2.25-2.25H18A2.25 2.25 0 0 1 20.25 6v2.25A2.25 2.25 0 0 1 18 10.5h-2.25a2.25 2.25 0 0 1-2.25-2.25V6ZM13.5 15.75a2.25 2.25 0 0 1 2.25-2.25H18a2.25 2.25 0 0 1 2.25 2.25V18A2.25 2.25 0 0 1 18 20.25h-2.25A2.25 2.25 0 0 1 13.5 18v-2.25Z" />
</svg>
<span>
@if (in_array(auth()->user()->rol->nombre, ['super', 'administrador', 'editor']))
Admin
@else
Subvendedor
@endif
</span>
</div>
<svg :class="open ? 'rotate-180' : ''" class="w-4 h-4 transform transition-transform" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M19 9l-7 7-7-7" />
</svg>
</button>
<!-- Submenú -->
<div x-show="open" x-transition class="ml-6 space-y-1">
@if ($config->subvendedor && auth()->user()->subvendedor)
<a href="{{ route('roles') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('roles') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión Roles</span>
</a>
<a href="{{ route('usuarios') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('usuarios') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión Usuarios</span>
</a>
<a href="{{ route('logs-comisiones') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('logs-comisiones') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Log Comisiones</span>
</a>
@if (auth()->user()->rol->nombre != 'super')
<a href="{{ route('tarifas') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('tarifas') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión Tarifas</span>
</a>
@endif
@endif
@if (in_array(auth()->user()->rol->nombre, ['super', 'administrador', 'editor']))
<a href="{{ route('planes') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('planes') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión Planes</span>
</a>
<a href="{{ route('import') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('import') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Importar cuentas</span>
</a>
<a href="{{ route('usuarios') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('usuarios') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión Usuarios</span>
</a>
@if (in_array(auth()->user()->rol->nombre, ['super', 'administrador']))
<a href="{{ route('pendientes') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('pendientes') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión Pendientes</span>
</a>
<a href="{{ route('logGeneral') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('logGeneral') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Log general</span>
</a>
<a href="{{ route('logs') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('logs') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Log cuentas</span>
</a>
@if (auth()->user()->rol->nombre == 'super')
<a href="{{ route('tarifas') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('tarifas') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión</span>
</a>
<a href="{{ route('logHistorial') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('logHistorial') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Utilidades</span>
</a>
<a href="{{ route('logsRecargas') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('logsRecargas') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Log historial</span>
</a>
<a href="{{ route('promociones') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('promociones') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Log recargas</span>
</a>
<a href="{{ route('servicio') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('servicio') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión Promociones</span>
</a>
<a href="{{ route('categoria') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('categoria') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión Servicios</span>
</a>
<a href="{{ route('utilidades') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('utilidades') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión Categorias</span>
</a>
<a href="{{ route('configuracion') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('configuracion') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Configuración</span>
</a>
@endif
@endif
@endif
</div>
</div>
@endif
<!-- Logout -->
<form method="POST" action="{{ route('logout') }}">
@csrf
<button type="submit" class="w-full text-left py-2 px-3 rounded flex items-center justify-start gap-2 bg-red-600 text-white hover:bg-red-700">
<svg xmlns="http://www.w3.org/2000/svg" fill="none"
viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="w-6">
<path stroke-linecap="round" stroke-linejoin="round"
d="M8.25 9V5.25A2.25 2.25 0 0 1 10.5 3h6a2.25 2.25 0 0 1
2.25 2.25v13.5A2.25 2.25 0 0 1 16.5 21h-6a2.25 2.25
0 0 1-2.25-2.25V15m-3 0-3-3m0 0 3-3m-3 3H15" />
</svg>
<span>Cerrar sesión</span>
</button>
</form>
</nav>
</div>
</div>
<!-- Items del menú -->
<nav class="px-4 mt-2 space-y-2 pb-4">
<a href="{{ route('dashboard') }}" class="flex items-center justify-start gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('dashboard') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="m2.25 12 8.954-8.955c.44-.439 1.152-.439 1.591 0L21.75 12M4.5 9.75v10.125c0 .621.504 1.125 1.125 1.125H9.75v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21h4.125c.621 0 1.125-.504 1.125-1.125V9.75M8.25 21h8.25" />
</svg>
<span>Inicio</span>
</a>
<a href="{{ route('clientes') }}" class="flex items-center justify-start gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('clientes') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" >
<path stroke-linecap="round" stroke-linejoin="round" d="M17.982 18.725A7.488 7.488 0 0 0 12 15.75a7.488 7.488 0 0 0-5.982 2.975m11.963 0a9 9 0 1 0-11.963 0m11.963 0A8.966 8.966 0 0 1 12 21a8.966 8.966 0 0 1-5.982-2.275M15 9.75a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" />
</svg>
<span>Clientes</span>
</a>
<a href="{{ route('servicios') }}" class="flex items-center justify-start gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('servicios') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M9 17.25v1.007a3 3 0 0 1-.879 2.122L7.5 21h9l-.621-.621A3 3 0 0 1 15 18.257V17.25m6-12V15a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 15V5.25m18 0A2.25 2.25 0 0 0 18.75 3H5.25A2.25 2.25 0 0 0 3 5.25m18 0V12a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 12V5.25" />
</svg>
<span>Servicios</span>
</a>
<a href="{{ route('top') }}" class="flex items-center justify-start gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('top') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M11.48 3.499a.562.562 0 0 1 1.04 0l2.125 5.111a.563.563 0 0 0 .475.345l5.518.442c.499.04.701.663.321.988l-4.204 3.602a.563.563 0 0 0-.182.557l1.285 5.385a.562.562 0 0 1-.84.61l-4.725-2.885a.562.562 0 0 0-.586 0L6.982 20.54a.562.562 0 0 1-.84-.61l1.285-5.386a.562.562 0 0 0-.182-.557l-4.204-3.602a.562.562 0 0 1 .321-.988l5.518-.442a.563.563 0 0 0 .475-.345L11.48 3.5Z" />
</svg>
<span>Top distribuidores</span>
</a>
@if (!empty($config->catalogo))
<a href="{{ asset($config->catalogo) }}" download="{{ basename($config->catalogo) }}" class="flex items-center justify-start gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('top') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5M16.5 12 12 16.5m0 0L7.5 12m4.5 4.5V3" />
</svg>
<span>Descargar Catalogo</span>
</a>
@endif
@if (auth()->user()->rol->nombre != 'editor' && auth()->user()->rol->nombre != 'administrador')
<a href="{{ route('reportes') }}" class="flex items-center justify-start gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('reportes') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M3 13.125C3 12.504 3.504 12 4.125 12h2.25c.621 0 1.125.504 1.125 1.125v6.75C7.5 20.496 6.996 21 6.375 21h-2.25A1.125 1.125 0 0 1 3 19.875v-6.75ZM9.75 8.625c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125v11.25c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 0 1-1.125-1.125V8.625ZM16.5 4.125c0-.621.504-1.125 1.125-1.125h2.25C20.496 3 21 3.504 21 4.125v15.75c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 0 1-1.125-1.125V4.125Z" />
</svg>
<span>Reportes</span>
</a>
@endif
@if ((auth()->user()->subvendedor && $config->subvendedor) || in_array(auth()->user()->rol->nombre, ['super', 'administrador', 'editor']))
<div x-data="{ open: false }" class="space-y-1">
<!-- Botón para admin -->
<button @click="open = !open"
class="flex items-center justify-between w-full py-2 px-3 rounded text-white hover:bg-white/10 focus:outline-none">
<div class="flex items-center gap-2">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6A2.25 2.25 0 0 1 6 3.75h2.25A2.25 2.25 0 0 1 10.5 6v2.25a2.25 2.25 0 0 1-2.25 2.25H6a2.25 2.25 0 0 1-2.25-2.25V6ZM3.75 15.75A2.25 2.25 0 0 1 6 13.5h2.25a2.25 2.25 0 0 1 2.25 2.25V18a2.25 2.25 0 0 1-2.25 2.25H6A2.25 2.25 0 0 1 3.75 18v-2.25ZM13.5 6a2.25 2.25 0 0 1 2.25-2.25H18A2.25 2.25 0 0 1 20.25 6v2.25A2.25 2.25 0 0 1 18 10.5h-2.25a2.25 2.25 0 0 1-2.25-2.25V6ZM13.5 15.75a2.25 2.25 0 0 1 2.25-2.25H18a2.25 2.25 0 0 1 2.25 2.25V18A2.25 2.25 0 0 1 18 20.25h-2.25A2.25 2.25 0 0 1 13.5 18v-2.25Z" />
</svg>
<span>
@if (in_array(auth()->user()->rol->nombre, ['super', 'administrador', 'editor']))
Admin
@else
Subvendedor
@endif
</span>
</div>
<svg :class="open ? 'rotate-180' : ''" class="w-4 h-4 transform transition-transform" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M19 9l-7 7-7-7" />
</svg>
</button>
<!-- Submenú -->
<div x-show="open" x-transition class="ml-6 space-y-1">
@if ($config->subvendedor && auth()->user()->subvendedor)
<a href="{{ route('roles') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('roles') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión Roles</span>
</a>
<a href="{{ route('usuarios') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('usuarios') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión Usuarios</span>
</a>
<a href="{{ route('logs-comisiones') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('logs-comisiones') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Log Comisiones</span>
</a>
@if (auth()->user()->rol->nombre != 'super')
<a href="{{ route('tarifas') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('tarifas') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión Tarifas</span>
</a>
@endif
@endif
@if (in_array(auth()->user()->rol->nombre, ['super', 'administrador', 'editor']))
<a href="{{ route('planes') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('planes') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión Planes</span>
</a>
<a href="{{ route('import') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('import') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Importar cuentas</span>
</a>
<a href="{{ route('usuarios') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('usuarios') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión Usuarios</span>
</a>
@if (in_array(auth()->user()->rol->nombre, ['super', 'administrador']))
<a href="{{ route('pendientes') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('pendientes') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión Pendientes</span>
</a>
<a href="{{ route('logGeneral') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('logGeneral') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Log general</span>
</a>
<a href="{{ route('logs') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('logs') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Log cuentas</span>
</a>
@if (auth()->user()->rol->nombre == 'super')
<a href="{{ route('tarifas') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('tarifas') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión</span>
</a>
<a href="{{ route('logHistorial') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('logHistorial') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Utilidades</span>
</a>
<a href="{{ route('logsRecargas') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('logsRecargas') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Log historial</span>
</a>
<a href="{{ route('promociones') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('promociones') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Log recargas</span>
</a>
<a href="{{ route('servicio') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('servicio') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión Promociones</span>
</a>
<a href="{{ route('categoria') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('categoria') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión Servicios</span>
</a>
<a href="{{ route('utilidades') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('utilidades') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Gestión Categorias</span>
</a>
<a href="{{ route('configuracion') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white {{ request()->routeIs('configuracion') ? 'bg-white/20' : 'hover:bg-white/10' }}">
<svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14" />
</svg>
<span>Configuración</span>
</a>
@endif
@endif
@endif
</div>
</div>
@endif
<!-- Logout -->
<form method="POST" action="{{ route('logout') }}">
@csrf
<button type="submit" class="w-full text-left py-2 px-3 rounded flex items-center justify-start gap-2 bg-red-600 text-white hover:bg-red-700">
<svg xmlns="http://www.w3.org/2000/svg" fill="none"
viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="w-6">
<path stroke-linecap="round" stroke-linejoin="round"
d="M8.25 9V5.25A2.25 2.25 0 0 1 10.5 3h6a2.25 2.25 0 0 1
2.25 2.25v13.5A2.25 2.25 0 0 1 16.5 21h-6a2.25 2.25
0 0 1-2.25-2.25V15m-3 0-3-3m0 0 3-3m-3 3H15" />
</svg>
<span>Cerrar sesión</span>
</button>
</form>
</nav>
</aside>