// comprobante.js - Maneja la comunicación entre el PHP y el HTML

// Cuando el documento esté listo, cargar los datos del comprobante
document.addEventListener('DOMContentLoaded', cargarComprobante);

// Función para cargar los datos del comprobante desde el servidor
function cargarComprobante() {
    fetch('../controlador/comprobante.php')
        .then(response => {
            if (!response.ok) {
                throw new Error('Error al obtener los datos del comprobante');
            }
            return response.json();
        })
        .then(comprobante => {
            // Llenar los datos básicos del comprobante
            document.getElementById('id-venta').textContent = comprobante.id_venta;
            document.getElementById('fecha-venta').textContent = comprobante.fecha;
            document.getElementById('cliente-venta').textContent = comprobante.cliente;
            document.getElementById('total-venta').textContent = formatearNumero(comprobante.total);
            
            // Generar las filas de la tabla de boletos
            const tablaBoletos = document.getElementById('detalle-boletos');
            let contenidoTabla = '';
            
            comprobante.boletos.forEach((boleto, index) => {
                contenidoTabla += `
                    <tr>
                        <td>${index + 1}</td>
                        <td>Fila ${boleto.fila}, Asiento ${boleto.numero}</td>
                        <td>$${formatearNumero(boleto.precio)}</td>
                    </tr>
                `;
            });
            
            tablaBoletos.innerHTML = contenidoTabla;
            
            // Generar código QR con el ID de la venta
            generarQR(comprobante.id_venta);
        })
        .catch(error => {
            console.error('Error:', error);
            alert('No se pudo cargar el comprobante. Por favor, inténtelo de nuevo.');
            window.location.href = 'index.html';
        });
}

// Función para generar el código QR
function generarQR(idVenta) {
    // Verificar si existe el elemento donde se mostrará el QR
    const qrContainer = document.getElementById('qr-code');
    if (!qrContainer) {
        console.error('No se encontró el elemento para mostrar el código QR');
        return;
    }
    
    // Limpiar el contenedor por si ya tiene contenido
    qrContainer.innerHTML = '';
    
    // Crear una nueva instancia de QRCode
    new QRCode(qrContainer, {
        text: idVenta.toString(),
        width: 128,
        height: 128,
        colorDark: "#000000",
        colorLight: "#ffffff",
        correctLevel: QRCode.CorrectLevel.H // Alta corrección de errores
    });
}

// Función para imprimir el comprobante
function imprimirComprobante() {
    const contenido = document.getElementById('comprobante-imprimible').innerHTML;
    const ventanaImpresion = window.open('', '_blank');
    
    ventanaImpresion.document.write(`
        <html>
        <head>
            <title>Comprobante de Venta</title>
            <style>
                body { font-family: Arial, sans-serif; }
                .header { border-bottom: 2px solid #333; padding-bottom: 10px; margin-bottom: 20px; }
                .info-venta { display: flex; justify-content: space-between; margin-bottom: 20px; }
                .info-item { margin-bottom: 10px; }
                .info-label { font-weight: bold; }
                table { width: 100%; border-collapse: collapse; margin-bottom: 20px; }
                th, td { border: 1px solid #ddd; padding: 8px; text-align: left; }
                th { background-color: #f8f9fa; }
                .total { font-size: 18px; font-weight: bold; text-align: right; margin-top: 20px; padding-top: 10px; border-top: 1px solid #ddd; }
                .qr-container { text-align: center; margin: 20px 0; border-top: 1px dashed #ccc; padding-top: 20px;}
                #qr-code { display: inline-block; margin: 0 auto; }
                .qr-info { font-size: 14px; margin-top: 10px; }
                .mensaje { margin-top: 40px; font-size: 14px; text-align: center;}
            </style>
        </head>
        <body>
            ${contenido}
        </body>
        </html>
    `);
    
    ventanaImpresion.document.close();
    ventanaImpresion.focus();
    ventanaImpresion.print();
}

// Función auxiliar para formatear números con dos decimales
function formatearNumero(numero) {
    return Number(numero).toFixed(2);
}