Responsividad dashboard importadores

views/partials/sidebar_importador.php

@@ -5,17 +5,24 @@ if (!isset($_SESSION['usuario_id']) || $_SESSION['tipo_usuario'] !== 'importador
     exit;
 }
 ?>
+
+<!-- NAVBAR -->
 <nav class="navbar navbar-dark bg-dark fixed-top">
   <div class="container-fluid">
+    <!-- Botón de menú para móviles -->
+    <button class="btn btn-outline-light d-md-none me-2" type="button" data-bs-toggle="offcanvas" data-bs-target="#sidebarMenu">
+      ☰
+    </button>
     <span class="navbar-brand">SIIH | Importador</span>
-    <div class="d-flex text-white">
-      Bienvenido, <?= htmlspecialchars($_SESSION['usuario_nombre']) ?>&nbsp;&nbsp;
-      <a href="/IMPORTADORES/sistemas/logout" class="btn btn-outline-light btn-sm">Cerrar sesión</a>
+    <div class="d-none d-md-flex text-white">
+      Bienvenido, <?= htmlspecialchars($_SESSION['usuario_nombre']) ?>
+      <a href="/IMPORTADORES/sistemas/logout" class="btn btn-outline-light btn-sm ms-2">Cerrar sesión</a>
     </div>
   </div>
 </nav>
 
-<div class="sidebar bg-dark text-white pt-5">
+<!-- SIDEBAR FIJA (escritorio) -->
+<div class="d-none d-md-block bg-dark text-white position-fixed h-100 pt-5" style="width: 250px;">
   <nav class="nav flex-column">
 
     <!-- INICIO -->
@@ -91,40 +98,24 @@ if (!isset($_SESSION['usuario_id']) || $_SESSION['tipo_usuario'] !== 'importador
         </a>
       </nav>
     </div>
-<!-- Proveedores -->
-<a
-  class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-    <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores') ? 'active' : '' ?>"
-  data-bs-toggle="collapse"
-  href="#submenuProveedores"
-  role="button"
-  aria-expanded="<?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores') ? 'true' : 'false' ?>"
-  aria-controls="submenuProveedores"
->
-  🏭 Proveedores
-  <span class="badge bg-secondary">2</span>
-</a>
-<div
-  class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores') ? 'show' : '' ?>"
-  id="submenuProveedores"
->
-  <nav class="nav flex-column ms-3">
-    <a
-      href="/IMPORTADORES/proveedores"
-      class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/proveedores' ? 'active' : '' ?>"
-    >
-      • Lista de Proveedores
+    
+    <!-- PROVEEDORES -->
+    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores') ? 'active' : '' ?>"
+      data-bs-toggle="collapse" href="#submenuProveedores" role="button" aria-expanded="<?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores') ? 'true' : 'false' ?>"
+      aria-controls="submenuProveedores">
+        🏭 Proveedores
+      <span class="badge bg-secondary">2</span>
     </a>
-    <a
-      href="/IMPORTADORES/proveedores/crear"
-      class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores/crear') ? 'active' : '' ?>"
-    >
-      • Registro de Proveedor
-    </a>
-  </nav>
-</div>
-
-
+    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores') ? 'show' : '' ?>" id="submenuProveedores">
+      <nav class="nav flex-column ms-3">
+        <a href="/IMPORTADORES/proveedores" class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/proveedores' ? 'active' : '' ?>">
+          • Lista de Proveedores
+        </a>
+        <a href="/IMPORTADORES/proveedores/crear" class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores/crear') ? 'active' : '' ?>">
+          • Registro de Proveedor
+        </a>
+      </nav>
+    </div>
 
     <!-- SOLICITUDES DE IMPORTACIÓN -->
     <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
@@ -154,3 +145,130 @@ if (!isset($_SESSION['usuario_id']) || $_SESSION['tipo_usuario'] !== 'importador
 
   </nav>
 </div>
+
+<!-- OFFCANVAS PARA MÓVILES -->
+<div class="offcanvas offcanvas-start d-md-none" tabindex="-1" id="sidebarMenu">
+  <div class="offcanvas-header">
+    <h5 class="offcanvas-title">Menú</h5>
+    <button type="button" class="btn-close" data-bs-dismiss="offcanvas"></button>
+  </div>
+  <div class="offcanvas-body">
+    <!-- INICIO -->
+    <a href="/IMPORTADORES/importadores/dashboard"
+       class="nav-link px-3 py-2 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/importadores/dashboard' ? 'active' : '' ?>">
+      🏠 Inicio
+    </a>
+
+    <!-- TRANSPORTISTAS -->
+    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
+        <?= str_contains($_SERVER['REQUEST_URI'], '/transportistas') ? 'active' : '' ?>"
+       data-bs-toggle="collapse" href="#submenuTransportistas" role="button" aria-expanded="false">
+      👨‍✈️ Transportistas
+      <span class="badge bg-secondary">3</span>
+    </a>
+    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/transportistas') ? 'show' : '' ?>" id="submenuTransportistas">
+      <nav class="nav flex-column ms-3">
+        <a href="/IMPORTADORES/transportistas/lista"
+           class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/transportistas/lista' ? 'active' : '' ?>">
+          • Mis transportistas
+        </a>
+        <a href="/IMPORTADORES/transportistas/alta"
+           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/transportistas/alta') ? 'active' : '' ?>">
+          • Alta de transportista
+        </a>
+        <a href="/IMPORTADORES/transportistas/bulk_upload"
+           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/transportistas/bulk_upload') ? 'active' : '' ?>">
+          • Carga masiva 
+        </a>
+      </nav>
+    </div>
+
+    <!-- TRANSPORTES -->
+    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
+        <?= str_contains($_SERVER['REQUEST_URI'], '/transportes') ? 'active' : '' ?>"
+       data-bs-toggle="collapse" href="#submenuTransportes" role="button" aria-expanded="false">
+      🚚 Transportes
+      <span class="badge bg-secondary">3</span>
+    </a>
+    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/transportes') ? 'show' : '' ?>" id="submenuTransportes">
+      <nav class="nav flex-column ms-3">
+        <a href="/IMPORTADORES/transportes/lista"
+           class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/transportes/lista' ? 'active' : '' ?>">
+          • Mis transportes
+        </a>
+        <a href="/IMPORTADORES/transportes/crear"
+           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/transportes/crear') ? 'active' : '' ?>">
+          • Nuevo transporte
+        </a>
+        <a href="/IMPORTADORES/transportes/masivo"
+           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/transportes/masivo') ? 'active' : '' ?>">
+          • Carga masiva
+        </a>
+      </nav>
+    </div>
+
+    <!-- CHOFERES -->
+    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
+        <?= str_contains($_SERVER['REQUEST_URI'], '/choferes') ? 'active' : '' ?>"
+       data-bs-toggle="collapse" href="#submenuChoferes" role="button" aria-expanded="false">
+      🚛 Choferes
+      <span class="badge bg-secondary">2</span>
+    </a>
+    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/choferes') ? 'show' : '' ?>" id="submenuChoferes">
+      <nav class="nav flex-column ms-3">
+        <a href="/IMPORTADORES/choferes/lista"
+           class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/choferes/lista' ? 'active' : '' ?>">
+          • Mis choferes
+        </a>
+        <a href="/IMPORTADORES/choferes/crear"
+           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/choferes/crear') ? 'active' : '' ?>">
+          • Nuevo chofer
+        </a>
+      </nav>
+    </div>
+    
+    <!-- PROVEEDORES -->
+    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores') ? 'active' : '' ?>"
+      data-bs-toggle="collapse" href="#submenuProveedores" role="button" aria-expanded="<?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores') ? 'true' : 'false' ?>"
+      aria-controls="submenuProveedores">
+        🏭 Proveedores
+      <span class="badge bg-secondary">2</span>
+    </a>
+    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores') ? 'show' : '' ?>" id="submenuProveedores">
+      <nav class="nav flex-column ms-3">
+        <a href="/IMPORTADORES/proveedores" class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/proveedores' ? 'active' : '' ?>">
+          • Lista de Proveedores
+        </a>
+        <a href="/IMPORTADORES/proveedores/crear" class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores/crear') ? 'active' : '' ?>">
+          • Registro de Proveedor
+        </a>
+      </nav>
+    </div>
+
+    <!-- SOLICITUDES DE IMPORTACIÓN -->
+    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
+        <?= str_contains($_SERVER['REQUEST_URI'], '/solicitud_importacion') ? 'active' : '' ?>"
+       data-bs-toggle="collapse" href="#submenuSolicitudes" role="button" aria-expanded="false">
+      📄 Solicitudes Importación
+      <span class="badge bg-secondary">2</span>
+    </a>
+    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/solicitud_importacion') ? 'show' : '' ?>" id="submenuSolicitudes">
+      <nav class="nav flex-column ms-3">
+        <a href="/IMPORTADORES/solicitud_importacion/lista"
+           class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/solicitud_importacion/lista' ? 'active' : '' ?>">
+          • Mis solicitudes
+        </a>
+        <a href="/IMPORTADORES/solicitud_importacion/crear"
+           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/solicitud_importacion/crear') ? 'active' : '' ?>">
+          • Nueva solicitud
+        </a>
+      </nav>
+    </div>
+
+    <!-- CONFIGURACIÓN -->
+    <a href="/IMPORTADORES/configuracion"
+       class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/configuracion') ? 'active' : '' ?>">
+      ⚙️ Configuración
+    </a>
+  </div>
+</div>