document.addEventListener("DOMContentLoaded", function() {
    fetch("../php/conciertos.php")
    .then(response => response.json())
    .then(data => {
        let div = document.getElementById("conciertos");
        div.innerHTML = ""; // Limpiar contenido previo

        if (data.length === 0) {
            div.innerHTML = "<p>No hay conciertos disponibles.</p>";
            return;
        }

        data.forEach(concierto => {
            let evento = document.createElement("div");
            evento.classList.add("concierto");
            evento.innerHTML = `
                <img src="../img/${concierto.imagen}" alt="${concierto.nombre}" onerror="this.src='../img/default.jpg';">
                <h2>${concierto.nombre}</h2>
                <p><strong>Artista:</strong> ${concierto.artista}</p>
                <p><strong>Ubicación:</strong> ${concierto.direccion}</p>
                <p><strong>Fecha:</strong> ${concierto.fecha} - ${concierto.hora}</p>
                <button onclick="comprarBoletos(${concierto.id})">COMPRAR</button>
            `;
            div.appendChild(evento);
        });
    })
    .catch(error => console.error("Error cargando conciertos:", error));
});

// Función para redirigir a la compra de boletos
function comprarBoletos(conciertoId) {
    window.location.href = `venta_boletos.html?concierto_id=${conciertoId}`;
}