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>
<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://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>
table.dataTable thead th { background: #343a40; color: #fff; }
@@ -86,45 +89,47 @@
<div class="content">
<h4>🚛 Mis Choferes</h4>
<a href="/IMPORTADORES/choferes/crear" class="btn btn-success mb-3"> Nuevo Chofer</a>
<table class="table table-striped" id="tabla-choferes">
<thead>
<tr>
<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): ?>
<div class="table-responsive">
<table class="table table-striped" id="tabla-choferes">
<thead>
<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>
<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>
<?php endforeach; ?>
</tbody>
</table>
</thead>
<tbody>
<?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>
<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'])): ?>
Swal.fire('¡Hecho!','Chofer eliminado.','success');
<?php endif; ?>