You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
109 lines
5.1 KiB
109 lines
5.1 KiB
8 months ago
|
<!DOCTYPE html>
|
||
|
|
<html lang="es">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
<title>Dashboard - PrestamosTecmm</title>
|
||
|
|
<!-- Tailwind CSS desde CDN -->
|
||
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
||
|
|
<!-- Alpine.js -->
|
||
|
|
<script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>
|
||
|
|
<!-- Font Awesome -->
|
||
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
|
||
|
|
</head>
|
||
|
|
<body class="bg-gray-100">
|
||
|
|
<div class="min-h-screen flex">
|
||
|
|
<!-- Sidebar -->
|
||
|
|
<aside class="bg-[#1E40AF] text-white w-64 min-h-screen px-4 py-6 hidden md:block">
|
||
|
|
<div class="flex items-center justify-center mb-8">
|
||
|
|
<span class="text-2xl font-bold">PrestamosTecmm</span>
|
||
|
|
</div>
|
||
|
|
<nav>
|
||
|
|
<ul class="space-y-2">
|
||
|
|
<li>
|
||
|
|
<a href="/dashboard" class="flex items-center space-x-2 px-4 py-2 rounded hover:bg-blue-700">
|
||
|
|
<i class="fas fa-home"></i>
|
||
|
|
<span>Inicio</span>
|
||
|
|
</a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="/prestamos" class="flex items-center space-x-2 px-4 py-2 rounded hover:bg-blue-700">
|
||
|
|
<i class="fas fa-book"></i>
|
||
|
|
<span>Préstamos</span>
|
||
|
|
</a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="/usuarios" class="flex items-center space-x-2 px-4 py-2 rounded hover:bg-blue-700">
|
||
|
|
<i class="fas fa-users"></i>
|
||
|
|
<span>Usuarios</span>
|
||
|
|
</a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="/configuracion" class="flex items-center space-x-2 px-4 py-2 rounded hover:bg-blue-700">
|
||
|
|
<i class="fas fa-cog"></i>
|
||
|
|
<span>Configuración</span>
|
||
|
|
</a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</nav>
|
||
|
|
</aside>
|
||
|
|
|
||
|
|
<div class="flex-1 flex flex-col">
|
||
|
|
<!-- Navbar -->
|
||
|
|
<header class="bg-white shadow">
|
||
|
|
<div class="flex items-center justify-between px-6 py-4">
|
||
|
|
<button class="md:hidden text-gray-500 hover:text-gray-700">
|
||
|
|
<i class="fas fa-bars text-xl"></i>
|
||
|
|
</button>
|
||
|
|
<div class="flex items-center space-x-4">
|
||
|
|
<div class="relative" x-data="{ open: false }">
|
||
|
|
<button @click="open = !open" class="flex items-center space-x-2 text-gray-700 hover:text-gray-900">
|
||
|
|
<img src="https://ui-avatars.com/api/?name={{ Auth::user()->name }}" alt="Profile" class="w-8 h-8 rounded-full">
|
||
|
|
<span>{{ Auth::user()->name }}</span>
|
||
|
|
<i class="fas fa-chevron-down"></i>
|
||
|
|
</button>
|
||
|
|
<!-- Menú desplegable -->
|
||
|
|
<div x-show="open"
|
||
|
|
@click.away="open = false"
|
||
|
|
class="absolute right-0 mt-2 w-48 bg-white rounded-md shadow-lg py-1">
|
||
|
|
<form method="POST" action="{{ route('logout') }}">
|
||
|
|
@csrf
|
||
|
|
<button type="submit" class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">
|
||
|
|
<i class="fas fa-sign-out-alt mr-2"></i> Cerrar Sesión
|
||
|
|
</button>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</header>
|
||
|
|
|
||
|
|
<!-- Main Content -->
|
||
|
|
<main class="flex-1 p-6">
|
||
|
|
@yield('content')
|
||
|
|
</main>
|
||
|
|
|
||
|
|
<!-- Footer -->
|
||
|
|
<footer class="bg-white shadow mt-auto">
|
||
|
|
<div class="max-w-7xl mx-auto py-4 px-6">
|
||
|
|
<div class="flex justify-between items-center">
|
||
|
|
<p class="text-gray-600">© 2024 PrestamosTecmm. Todos los derechos reservados.</p>
|
||
|
|
<div class="flex space-x-4">
|
||
|
|
<a href="#" class="text-gray-600 hover:text-gray-900">
|
||
|
|
<i class="fab fa-facebook"></i>
|
||
|
|
</a>
|
||
|
|
<a href="#" class="text-gray-600 hover:text-gray-900">
|
||
|
|
<i class="fab fa-twitter"></i>
|
||
|
|
</a>
|
||
|
|
<a href="#" class="text-gray-600 hover:text-gray-900">
|
||
|
|
<i class="fab fa-instagram"></i>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</footer>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</body>
|
||
|
|
</html>
|