Responsividad de tablas

This commit is contained in:
2025-05-13 08:06:54 -06:00
parent 3a9b7fa520
commit 01929847c0
7 changed files with 208 additions and 168 deletions

View File

@@ -10,6 +10,9 @@
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
<link href="https://cdn.datatables.net/1.13.4/css/jquery.dataTables.min.css" rel="stylesheet"> <link href="https://cdn.datatables.net/1.13.4/css/jquery.dataTables.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script> <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
<script src="https://cdn.datatables.net/1.13.4/js/jquery.dataTables.min.js"></script>
<style> <style>
table.dataTable thead th { background: #343a40; color: #fff; } table.dataTable thead th { background: #343a40; color: #fff; }
@@ -86,45 +89,47 @@
<div class="content"> <div class="content">
<h4>🚛 Mis Choferes</h4> <h4>🚛 Mis Choferes</h4>
<a href="/IMPORTADORES/choferes/crear" class="btn btn-success mb-3"> Nuevo Chofer</a> <a href="/IMPORTADORES/choferes/crear" class="btn btn-success mb-3"> Nuevo Chofer</a>
<table class="table table-striped" id="tabla-choferes"> <div class="table-responsive">
<thead> <table class="table table-striped" id="tabla-choferes">
<tr> <thead>
<th>#</th>
<th>Nombre Completo</th>
<th>Licencia</th>
<th>Teléfono</th>
<th>Email</th>
<th>Ingreso</th>
<th>Transportista</th>
<th>Acciones</th>
</tr>
</thead>
<tbody>
<?php foreach($choferes as $c): ?>
<tr> <tr>
<td><?= $c['id_chofer'] ?></td> <th>#</th>
<td><?= htmlspecialchars($c['nombre_completo']) ?></td> <th>Nombre Completo</th>
<td><?= htmlspecialchars($c['numero_licencia']) ?></td> <th>Licencia</th>
<td><?= htmlspecialchars($c['telefono']) ?></td> <th>Teléfono</th>
<td><?= htmlspecialchars($c['email']) ?></td> <th>Email</th>
<td> <th>Ingreso</th>
<?php <th>Transportista</th>
if ($c['created_at'] instanceof DateTime) { <th>Acciones</th>
echo $c['created_at']->format('Y-m-d');
} else {
echo htmlspecialchars($c['created_at']);
}
?>
</td>
<td><?= htmlspecialchars($c['transportista']) ?></td>
<td>
<a href="/IMPORTADORES/choferes/editar?id=<?= $c['id_chofer'] ?>" class="btn btn-sm btn-primary">✏️</a>
<button class="btn btn-sm btn-danger" onclick="confirmDeleteChofer(<?= $c['id_chofer'] ?>)">🗑️</button>
</td>
</tr> </tr>
<?php endforeach; ?> </thead>
</tbody> <tbody>
</table> <?php foreach($choferes as $c): ?>
<tr>
<td><?= $c['id_chofer'] ?></td>
<td><?= htmlspecialchars($c['nombre_completo']) ?></td>
<td><?= htmlspecialchars($c['numero_licencia']) ?></td>
<td><?= htmlspecialchars($c['telefono']) ?></td>
<td><?= htmlspecialchars($c['email']) ?></td>
<td>
<?php
if ($c['created_at'] instanceof DateTime) {
echo $c['created_at']->format('Y-m-d');
} else {
echo htmlspecialchars($c['created_at']);
}
?>
</td>
<td><?= htmlspecialchars($c['transportista']) ?></td>
<td>
<a href="/IMPORTADORES/choferes/editar?id=<?= $c['id_chofer'] ?>" class="btn btn-sm btn-primary">✏️</a>
<button class="btn btn-sm btn-danger" onclick="confirmDeleteChofer(<?= $c['id_chofer'] ?>)">🗑️</button>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</div>
</div> </div>
<script> <script>
@@ -143,6 +148,15 @@
} }
}); });
} }
$(document).ready(function () {
$('#tabla-choferes').DataTable({
language: {
url: '//cdn.datatables.net/plug-ins/1.13.4/i18n/es-ES.json'
}
});
});
<?php if(isset($_GET['deleted'])): ?> <?php if(isset($_GET['deleted'])): ?>
Swal.fire('¡Hecho!','Chofer eliminado.','success'); Swal.fire('¡Hecho!','Chofer eliminado.','success');
<?php endif; ?> <?php endif; ?>

View File

@@ -7,8 +7,7 @@ header("X-Frame-Options: DENY");
header("X-Content-Type-Options: nosniff"); header("X-Content-Type-Options: nosniff");
header("X-XSS-Protection: 1; mode=block"); header("X-XSS-Protection: 1; mode=block");
header("Referrer-Policy: no-referrer"); header("Referrer-Policy: no-referrer");
header("Content-Security-Policy: default-src 'self'; style-src 'self' 'unsafe-inline' https://cdn.jsdelivr.net https://cdnjs.cloudflare.com; script-src 'self' https://cdn.jsdelivr.net https://cdnjs.cloudflare.com; img-src 'self' data:;"); header("Content-Security-Policy: default-src 'self'; style-src 'self' 'unsafe-inline' https://cdn.jsdelivr.net https://cdnjs.cloudflare.com https://fonts.googleapis.com; script-src 'self' https://cdn.jsdelivr.net https://cdnjs.cloudflare.com; img-src 'self' data:; font-src 'self' https://fonts.gstatic.com https://cdnjs.cloudflare.com;");
$sql = "SELECT TOP 1 * FROM configuracion_sistema"; $sql = "SELECT TOP 1 * FROM configuracion_sistema";
$stmt = sqlsrv_prepare($conn, $sql); $stmt = sqlsrv_prepare($conn, $sql);
if (!$stmt || !sqlsrv_execute($stmt)) { if (!$stmt || !sqlsrv_execute($stmt)) {

View File

@@ -116,11 +116,11 @@ $mensajeMantenimiento = $config['mensaje_mantenimiento'] ?? 'El sistema se encue
<form action="/IMPORTADORES/login/validar" method="POST"> <form action="/IMPORTADORES/login/validar" method="POST">
<div class="mb-3"> <div class="mb-3">
<label class="form-label">Correo electrónico</label> <label class="form-label">Correo electrónico</label>
<input type="email" name="email" class="form-control" required> <input type="email" name="email" class="form-control" required autocomplete="username" value="">
</div> </div>
<div class="mb-3"> <div class="mb-3">
<label class="form-label">Contraseña</label> <label class="form-label">Contraseña</label>
<input type="password" name="password" class="form-control" required> <input type="password" name="password" class="form-control" required autocomplete="current-password" value="">
</div> </div>
<div class="d-grid"> <div class="d-grid">
<button type="submit" class="btn btn-primary">Iniciar sesión</button> <button type="submit" class="btn btn-primary">Iniciar sesión</button>

View File

@@ -8,6 +8,9 @@
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
<link href="https://cdn.datatables.net/1.13.4/css/jquery.dataTables.min.css" rel="stylesheet"> <link href="https://cdn.datatables.net/1.13.4/css/jquery.dataTables.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script> <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
<script src="https://cdn.datatables.net/1.13.4/js/jquery.dataTables.min.js"></script>
<style> <style>
table.dataTable thead th { background: #343a40; color: #fff; } table.dataTable thead th { background: #343a40; color: #fff; }
body { font-family: 'Segoe UI', sans-serif; background-color: #f4f6f9; } body { font-family: 'Segoe UI', sans-serif; background-color: #f4f6f9; }
@@ -79,60 +82,62 @@
<div class="content"> <div class="content">
<h4>📄 Solicitudes de Importación</h4> <h4>📄 Solicitudes de Importación</h4>
<a href="/IMPORTADORES/solicitud_importacion/crear" class="btn btn-success mb-3"> Nueva Solicitud</a> <a href="/IMPORTADORES/solicitud_importacion/crear" class="btn btn-success mb-3"> Nueva Solicitud</a>
<table class="table table-striped" id="tabla-solicitudes"> <div class="table-responsive">
<thead> <table class="table table-striped" id="tabla-solicitudes">
<tr> <thead>
<th>#</th> <tr>
<th>Factura</th> <th>#</th>
<th>Fecha</th> <th>Factura</th>
<th>Pedimento</th> <th>Fecha</th>
<th>Incoterm</th> <th>Pedimento</th>
<th>País Proveedor</th> <th>Incoterm</th>
<th>Moneda</th> <th>País Proveedor</th>
<th>Valor</th> <th>Moneda</th>
<th>Vinculación</th> <th>Valor</th>
<th>Transportista</th> <th>Vinculación</th>
<th>PDF</th> <th>Transportista</th>
<th>Acciones</th> <th>PDF</th>
</tr> <th>Acciones</th>
</thead> </tr>
<tbody> </thead>
<?php foreach($facturas as $f): ?> <tbody>
<tr> <?php foreach($facturas as $f): ?>
<td><?= $f['id_solicitud'] ?></td> <tr>
<td><?= htmlspecialchars($f['numero_factura']) ?></td> <td><?= $f['id_solicitud'] ?></td>
<td><?= htmlspecialchars($f['fecha_factura']) ?></td> <td><?= htmlspecialchars($f['numero_factura']) ?></td>
<td><?= htmlspecialchars($f['numero_pedimento']) ?></td> <td><?= htmlspecialchars($f['fecha_factura']) ?></td>
<td><?= htmlspecialchars($f['incoterm']) ?></td> <td><?= htmlspecialchars($f['numero_pedimento']) ?></td>
<td><?= htmlspecialchars($f['pais_proveedor']) ?></td> <td><?= htmlspecialchars($f['incoterm']) ?></td>
<td><?= htmlspecialchars($f['tipo_moneda']) ?></td> <td><?= htmlspecialchars($f['pais_proveedor']) ?></td>
<td><?= number_format($f['valor_factura'],2) ?></td> <td><?= htmlspecialchars($f['tipo_moneda']) ?></td>
<td> <td><?= number_format($f['valor_factura'],2) ?></td>
<?php <td>
switch($f['vinculacion']) { <?php
case 1: echo 'Existe, no afecta'; break; switch($f['vinculacion']) {
case 2: echo 'Existe y afecta'; break; case 1: echo 'Existe, no afecta'; break;
default: echo 'No existe'; case 2: echo 'Existe y afecta'; break;
} default: echo 'No existe';
?> }
</td> ?>
<td><?= htmlspecialchars($f['transportista']) ?></td> </td>
<td> <td><?= htmlspecialchars($f['transportista']) ?></td>
<a href="/IMPORTADORES/solicitud_importacion/pdf?id=<?= $f['id_solicitud'] ?>" <td>
class="btn btn-sm btn-outline-secondary" target="_blank"> <a href="/IMPORTADORES/solicitud_importacion/pdf?id=<?= $f['id_solicitud'] ?>"
📄 PDF class="btn btn-sm btn-outline-secondary" target="_blank">
</a> 📄 PDF
</td> </a>
<td> </td>
<a href="/IMPORTADORES/solicitud_importacion/editar?id=<?= $f['id_solicitud'] ?>" <td>
class="btn btn-sm btn-primary">✏️</a> <a href="/IMPORTADORES/solicitud_importacion/editar?id=<?= $f['id_solicitud'] ?>"
<button class="btn btn-sm btn-danger" class="btn btn-sm btn-primary">✏️</a>
onclick="confirmDelete(<?= $f['id_solicitud'] ?>)">🗑️</button> <button class="btn btn-sm btn-danger"
</td> onclick="confirmDelete(<?= $f['id_solicitud'] ?>)">🗑️</button>
</tr> </td>
<?php endforeach; ?> </tr>
</tbody> <?php endforeach; ?>
</table> </tbody>
</table>
</div>
</div> </div>
<script> <script>
@@ -151,6 +156,15 @@
} }
}); });
} }
$(document).ready(function () {
$('#tabla-solicitudes').DataTable({
language: {
url: '//cdn.datatables.net/plug-ins/1.13.4/i18n/es-ES.json'
}
});
});
<?php if(isset($_GET['deleted'])): ?> <?php if(isset($_GET['deleted'])): ?>
Swal.fire('¡Hecho!','Solicitud eliminada.','success'); Swal.fire('¡Hecho!','Solicitud eliminada.','success');
<?php endif; ?> <?php endif; ?>

View File

@@ -9,6 +9,8 @@
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
<link href="https://cdn.datatables.net/1.13.4/css/jquery.dataTables.min.css" rel="stylesheet"> <link href="https://cdn.datatables.net/1.13.4/css/jquery.dataTables.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script> <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
<script src="https://cdn.datatables.net/1.13.4/js/jquery.dataTables.min.js"></script>
<style> <style>
table.dataTable thead th { background:#343a40; color:#fff; } table.dataTable thead th { background:#343a40; color:#fff; }
@@ -86,39 +88,41 @@
<div class="content"> <div class="content">
<h4>🚚 Mis Transportes</h4> <h4>🚚 Mis Transportes</h4>
<a href="/IMPORTADORES/transportes/crear" class="btn btn-success mb-3"> Nuevo Transporte</a> <a href="/IMPORTADORES/transportes/crear" class="btn btn-success mb-3"> Nuevo Transporte</a>
<table class="table table-striped"> <div class="table-responsive">
<thead> <table class="table table-striped" id="tabla-transportes">
<tr> <thead>
<th>#</th><th>Vehículo</th><th>Ident. Fiscal</th> <tr>
<th>Foto</th><th>Transportista</th> <th>#</th><th>Vehículo</th><th>Ident. Fiscal</th>
<th>Alta</th><th>Acciones</th> <th>Foto</th><th>Transportista</th>
</tr> <th>Alta</th><th>Acciones</th>
</thead> </tr>
<tbody> </thead>
<?php foreach($transportes as $t): ?> <tbody>
<tr> <?php foreach($transportes as $t): ?>
<td><?= $t['id_transporte'] ?></td> <tr>
<td><?= htmlspecialchars($t['vehiculo']) ?></td> <td><?= $t['id_transporte'] ?></td>
<td><?= htmlspecialchars($t['identificador_fiscal']) ?></td> <td><?= htmlspecialchars($t['vehiculo']) ?></td>
<td> <td><?= htmlspecialchars($t['identificador_fiscal']) ?></td>
<?php if($t['foto_url']): ?> <td>
<img src="<?= $t['foto_url'] ?>" width="50"> <?php if($t['foto_url']): ?>
<?php endif; ?> <img src="<?= $t['foto_url'] ?>" width="50">
</td> <?php endif; ?>
<td><?= htmlspecialchars($t['transportista']) ?></td> </td>
<td><?= $t['creado_en']->format('Y-m-d') ?></td> <td><?= htmlspecialchars($t['transportista']) ?></td>
<td> <td><?= $t['creado_en']->format('Y-m-d') ?></td>
<a href="/IMPORTADORES/transportes/editar?id=<?= $t['id_transporte'] ?>" <td>
class="btn btn-sm btn-primary">✏️</a> <a href="/IMPORTADORES/transportes/editar?id=<?= $t['id_transporte'] ?>"
<button class="btn btn-sm btn-danger" class="btn btn-sm btn-primary">✏️</a>
onclick="confirmDelete(<?= $t['id_transporte'] ?>)"> <button class="btn btn-sm btn-danger"
🗑️ onclick="confirmDelete(<?= $t['id_transporte'] ?>)">
</button> 🗑️
</td> </button>
</tr> </td>
<?php endforeach; ?> </tr>
</tbody> <?php endforeach; ?>
</table> </tbody>
</table>
</div>
</div> </div>
<script> <script>
@@ -137,6 +141,15 @@
} }
}); });
} }
$(document).ready(function () {
$('#tabla-transportes').DataTable({
language: {
url: '//cdn.datatables.net/plug-ins/1.13.4/i18n/es-ES.json'
}
});
});
<?php if(isset($_GET['deleted'])): ?> <?php if(isset($_GET['deleted'])): ?>
Swal.fire('¡Hecho!','Transporte eliminado.','success'); Swal.fire('¡Hecho!','Transporte eliminado.','success');
<?php endif; ?> <?php endif; ?>

View File

@@ -2,10 +2,11 @@
<?php <?php
// Al principio de la vista, inicia sesión para leer los errores // Al principio de la vista, inicia sesión para leer los errores
session_start(); if (session_status() === PHP_SESSION_NONE) {
session_start();
}
$errors = $_SESSION['import_errors'] ?? []; $errors = $_SESSION['import_errors'] ?? [];
$success = $_SESSION['import_success'] ?? false; $success = $_SESSION['import_success'] ?? false;
// Limpiar para que no se repitan
unset($_SESSION['import_errors'], $_SESSION['import_success']); unset($_SESSION['import_errors'], $_SESSION['import_success']);
?> ?>

View File

@@ -92,19 +92,21 @@
<br> <br>
<h4 class="mb-4">🚚 Mis Transportistas</h4> <h4 class="mb-4">🚚 Mis Transportistas</h4>
<div class="card p-3 shadow-sm"> <div class="card p-3 shadow-sm">
<table id="transportistas-table" class="display nowrap" style="width:100%"> <div class="table-responsive">
<thead> <table id="transportistas-table" class="display nowrap" style="width:100%">
<tr> <thead>
<th>#</th> <tr>
<th>Clave</th> <th>#</th>
<th>Nombre</th> <th>Clave</th>
<th>RFC</th> <th>Nombre</th>
<th>Ciudad</th> <th>RFC</th>
<th>Fecha Alta</th> <th>Ciudad</th>
<th>Acciones</th> <th>Fecha Alta</th>
</tr> <th>Acciones</th>
</thead> </tr>
</table> </thead>
</table>
</div>
</div> </div>
</div> </div>
@@ -153,34 +155,31 @@
}); });
}); });
function confirmDelete(id) { function confirmDelete(id) {
Swal.fire({ Swal.fire({
title: '¿Eliminar transportista?', title: '¿Eliminar transportista?',
text: 'Esto sólo lo desactivará; no se podrá volver a usar.', text: 'Esto sólo lo desactivará; no se podrá volver a usar.',
icon: 'warning', icon: 'warning',
showCancelButton: true, showCancelButton: true,
confirmButtonText: 'Sí, eliminar', confirmButtonText: 'Sí, eliminar',
cancelButtonText: 'Cancelar', cancelButtonText: 'Cancelar',
confirmButtonColor: '#d33' confirmButtonColor: '#d33'
}).then(result => { }).then(result => {
if (result.isConfirmed) { if (result.isConfirmed) {
window.location = `/IMPORTADORES/transportistas/eliminar?id=${id}`; window.location = `/IMPORTADORES/transportistas/eliminar?id=${id}`;
}
});
} }
});
}
// Mostrar alert de “borrado” al volver de la acción
<?php if (isset($_GET['deleted']) && $_GET['deleted']==='ok'): ?>
Swal.fire({
icon: 'success',
title: 'Transportista eliminado',
text: 'Ya no aparecerá en tu lista.',
confirmButtonColor: '#198754'
});
<?php endif; ?>
// Mostrar alert de “borrado” al volver de la acción
<?php if (isset($_GET['deleted']) && $_GET['deleted']==='ok'): ?>
Swal.fire({
icon: 'success',
title: 'Transportista eliminado',
text: 'Ya no aparecerá en tu lista.',
confirmButtonColor: '#198754'
});
<?php endif; ?>
</script> </script>