document.addEventListener("DOMContentLoaded", async () => {
try {
const respuesta = await fetch("controladores/obtener_boleto.php");
if (!respuesta.ok) throw new Error("Error al obtener los boletos.");
const boletos = await respuesta.json();
const tablaBody = document.querySelector("#tabla-boletos");
if (boletos.length === 0) {
tablaBody.innerHTML = `<tr><td colspan="7" class="text-center p-4">No hay boletos vendidos aún.</td></tr>`;
return;
}
boletos.forEach(boleto => {
const fila = document.createElement("tr");
fila.classList.add("border-b", "border-gray-700", "hover:bg-gray-700");
fila.innerHTML = `
<td class="p-3 border border-gray-600">${boleto.nombre_comprador}</td>
<td class="p-3 border border-gray-600">${boleto.nombre_concierto}</td>
<td class="p-3 border border-gray-600">${boleto.artista}</td>
<td class="p-3 border border-gray-600">${boleto.fecha_concierto}</td>
<td class="p-3 border border-gray-600">${boleto.nombre_zona}</td>
<td class="p-3 border border-gray-600">${boleto.id_asiento}</td>
<td class="p-3 border border-gray-600 text-center">
<button class="bg-yellow-400 text-black px-3 py-1 rounded-lg hover:bg-yellow-500"
onclick="imprimirBoleto('${boleto.nombre_comprador}', '${boleto.nombre_concierto}', '${boleto.artista}', '${boleto.fecha_concierto}', '${boleto.nombre_zona}', '${boleto.id_asiento}')">
🖨 Imprimir
</button>
</td>
`;
tablaBody.appendChild(fila);
});
} catch (error) {
console.error("Error al cargar los boletos:", error);
}
});
// Función para imprimir un boleto específico
function imprimirBoleto(comprador, concierto, artista, fecha, zona, asiento) {
const ventanaImpresion = window.open("", "_blank");
ventanaImpresion.document.write(`
<html>
<head>
<title>Boleto de Concierto</title>
<style>
body { font-family: Arial, sans-serif; text-align: center; padding: 20px; }
.boleto { border: 2px dashed #333; padding: 20px; width: 300px; margin: auto; }
h1 { color: #5CB85C; }
p { font-size: 16px; margin: 5px 0; }
</style>
</head>
<body>
<div class="boleto">
<h1>🎟 TicketFei</h1>
<p><strong>Comprador:</strong> ${comprador}</p>
<p><strong>Concierto:</strong> ${concierto}</p>
<p><strong>Artista:</strong> ${artista}</p>
<p><strong>Fecha:</strong> ${fecha}</p>
<p><strong>Zona:</strong> ${zona}</p>
<p><strong>Asiento:</strong> ${asiento}</p>
</div>
<script>
window.print();
setTimeout(() => window.close(), 500);
</script>
</body>
</html>
`);
}