document.addEventListener("DOMContentLoaded", () => {
    const formulario = document.getElementById("formulario");
    const mensajeDiv = document.getElementById("mensaje");
    let capacidadTotal = 0;

    function siguientePaso(paso) {
        document.querySelectorAll("[id^='paso']").forEach(p => p.classList.add("d-none"));
        document.getElementById(`paso${paso}`).classList.remove("d-none");

        if (paso === 3) {
            capacidadTotal = parseInt(document.getElementById("capacidad_total").value) || 0;
            const capacidadDisponible = document.getElementById("capacidad_disponible");
            if (capacidadDisponible) {
                capacidadDisponible.textContent = capacidadTotal;
            }
        }
    }

    function actualizarCapacidad() {
        let asignado = 0;
        ["capacidad_general", "capacidad_plata", "capacidad_oro", "capacidad_vip"].forEach(id => {
            const input = document.getElementById(id);
            if (input) {
                asignado += parseInt(input.value) || 0;
            }
        });

        const restante = capacidadTotal - asignado;
        const capacidadDisponible = document.getElementById("capacidad_disponible");
        if (capacidadDisponible) {
            capacidadDisponible.textContent = restante < 0 ? "Excede la capacidad total" : restante;
        }
    }

    formulario.addEventListener("submit", async (event) => {
        event.preventDefault();

        const capacidadDisponible = document.getElementById("capacidad_disponible");
        if (capacidadDisponible && parseInt(capacidadDisponible.textContent) < 0) {
            mensajeDiv.innerHTML = '<div class="alert alert-danger">Error: La suma de capacidades de zonas no puede exceder la capacidad total.</div>';
            return;
        }

        // 🔹 Construir objeto JSON con todas las zonas
        const datosConcierto = {
            nombre_concierto: document.getElementById("nombre_concierto").value.trim(),
            artista: document.getElementById("artista").value.trim(),
            fecha: document.getElementById("fecha").value,
            calle: document.getElementById("calle").value.trim(),
            colonia: document.getElementById("colonia").value.trim(),
            numero_direccion: document.getElementById("numero_direccion").value.trim(),
            codigo_postal: document.getElementById("codigo_postal").value.trim(),
            estado: document.getElementById("estado").value.trim(),
            capacidad_total: capacidadTotal,
            zonas: [
                {
                    nombre_zona: "General",
                    capacidad: parseInt(document.getElementById("capacidad_general").value) || 0,
                    precio: parseFloat(document.getElementById("precio_general").value) || 0
                },
                {
                    nombre_zona: "Plata",
                    capacidad: parseInt(document.getElementById("capacidad_plata").value) || 0,
                    precio: parseFloat(document.getElementById("precio_plata").value) || 0
                },
                {
                    nombre_zona: "Oro",
                    capacidad: parseInt(document.getElementById("capacidad_oro").value) || 0,
                    precio: parseFloat(document.getElementById("precio_oro").value) || 0
                },
                {
                    nombre_zona: "VIP",
                    capacidad: parseInt(document.getElementById("capacidad_vip").value) || 0,
                    precio: parseFloat(document.getElementById("precio_vip").value) || 0
                }
            ]
        };

        console.log("Enviando datos:", JSON.stringify(datosConcierto)); // Depuración

        try {
            const respuesta = await fetch("controladores/insertar_concierto.php", {
                method: "POST",
                headers: {
                    "Content-Type": "application/json"
                },
                body: JSON.stringify(datosConcierto)
            });

            const resultado = await respuesta.json();
            console.log("Respuesta del servidor:", resultado); // Depuración

            if (!resultado.insercionCorrecta) {
                throw new Error(resultado.error || "Error al guardar el concierto");
            }

            mensajeDiv.innerHTML = '<div class="alert alert-success">Concierto registrado correctamente.</div>';

            setTimeout(() => {
                window.location.href = "ventanaConciertos.html";
            }, 2000);

        } catch (error) {
            console.error("Error:", error);
            mensajeDiv.innerHTML = `<div class="alert alert-danger">Error: ${error.message}</div>`;
        }
    });

    window.siguientePaso = siguientePaso;
    window.actualizarCapacidad = actualizarCapacidad;
});