/* ============================
   BIND BOTÓN CONSULTAR (único control)
   ============================ */
var datos;    
$(document).ready(function () {
    datos = initform();
    if (datos) {
        RecordVentasVendedor(datos.inicio, datos.inicio, datos.ipEnc);
        RecordVentasVendedor_mesAnterior(datos.inicio, datos.inicio, datos.ipEnc);
        RecordVentasVendedor_PromediomesAnterior(datos.inicio, datos.inicio, datos.ipEnc);
        RecordVentasVendedor_idPrecio(datos.inicio, datos.inicio, datos.ipEnc);
    }

    if (!$("#btnConsultar").length) return;

    $("#btnConsultar").on("click", function (e) {
        e.preventDefault();
        
        if (!datos) return;
        datos = initform(); 
        RecordVentasVendedor(datos.inicio, datos.inicio, datos.ipEnc);
        RecordVentasVendedor_mesAnterior(datos.inicio, datos.inicio, datos.ipEnc);
        RecordVentasVendedor_PromediomesAnterior(datos.inicio, datos.inicio, datos.ipEnc);
        RecordVentasVendedor_idPrecio(datos.inicio, datos.inicio, datos.ipEnc);
    });
});


$(document).on('change', '#vendedor', function () {
    
    // 🔥 SIEMPRE destruir primero (clave)
    limpiarGraficoVentasHoy();
    
    const vendedorId = $(this).val();
    const nombreVendedor = $("#vendedor option:selected").text() || "-";
    $("#tarjeta_vendedor").text(nombreVendedor);

    // 👉 Si hay vendedor → recién pintar
    if (vendedorId) {
        actualizarCardMesAnterior();
    } else {
        actualizarCardMesAnterior(); // mantiene lógica de totales
    }
});


$(document).on('change', "select[name='tienda_ip']", function () {

    // 👉 Obtener datos del formulario
    datos = initform();
    if (!datos) return;
    
    // 👉 Ejecutar función para llenar vendedores
    RecordVentasVendedor(datos.inicio, datos.inicio, datos.ipEnc);
    RecordVentasVendedor_mesAnterior(datos.inicio, datos.inicio, datos.ipEnc);
    RecordVentasVendedor_PromediomesAnterior(datos.inicio, datos.inicio, datos.ipEnc);
    RecordVentasVendedor_idPrecio(datos.inicio, datos.inicio, datos.ipEnc);
    // 👉 (Opcional pero recomendado) limpiar selección y UI
    $("#vendedor").html('<option value="">Selecciona un vendedor</option>');
    $("#tarjeta_vendedor").text("-");
    limpiarGraficoVentasHoy();

});

 

 
function ajaxVentas(data, callback) {

    Utils.mostrarLoader();

    $.ajax({
        url: "../controllers/VentaController.php",
        type: "POST",
        dataType: "json",
        data: data,
        success: callback,
        complete: Utils.ocultarLoader,
        error: function(err){
            console.error("Error en AJAX", err);
        }
    });
}

let dataMesActual = [];
function RecordVentasVendedor(inicio, fin, ipEnc) {
    ajaxVentas({
        obtenerRecordVentasVendedor: true,
        inicio: inicio,
        fin: fin,
        ipEnc: ipEnc
    }, function(response){
        if (!Array.isArray(response)) return;

        dataMesActual = response;
        let options = '<option value="">Selecciona un vendedor</option>';
        response.forEach(item => {

            if(item.Vendedor){
              options += `<option value="${item.IdVendedor}">
                                ${item.Vendedor}
                            </option>`;
               /* options += `<option value="${item.Vendedor}">
                                ${item.Vendedor} (S/ ${Utils.formatearNumero(item.TotalVentas)})
                            </option>`;*/
            }
        });
        $("#vendedor").html(options);

    });
}





let dataMesAnterior = [];
function RecordVentasVendedor_mesAnterior(inicio, fin, ipEnc) {
    ajaxVentas({
        obtenerVentasVendedor_mesAnterior: true,
        inicio: inicio,
        fin: fin,
        ipEnc: ipEnc
    }, function(response){

        if (!Array.isArray(response)) return;

        // 👉 Guardamos data global
        dataMesAnterior = response;

        // 👉 Mostrar total general por defecto
        actualizarCardMesAnterior();
    });
}

let dataPromedioMesAnterior = [];
function RecordVentasVendedor_PromediomesAnterior(inicio, fin, ipEnc) {
    ajaxVentas({
        obtenerVentasVendedor_PromediomesAnterior: true,
        inicio: inicio,
        fin: fin,
        ipEnc: ipEnc
    }, function(response){

        if (!Array.isArray(response)) return;

        // 👉 Guardamos data global
        dataPromedioMesAnterior = response;

        // 👉 Mostrar total general por defecto
        actualizarCardMesAnterior();
    });
}



function actualizarCardMesAnterior() {

    const vendedorId = $("#vendedor").val();
    let totalHoy = 0;
    let totalMes = 0;
    let totalMesPromedio = 0;
 

    if (vendedorId) {
        datos = initform(); 
        //RecordVentasVendedor(datos.inicio, datos.fin, datos.ipEnc);
        RecordVentasVendedor_idPrecio(datos.inicio, datos.fin, datos.ipEnc);

        // 👉 Buscar solo el vendedor seleccionado vendedor mes actual
        const vendedor_hoy = dataMesActual.find(v => v.IdVendedor == vendedorId);
        if (vendedor_hoy && vendedor_hoy.TotalVentas) {
            totalHoy = parseFloat(vendedor_hoy.TotalVentas);
        }

        // 👉 Buscar solo el vendedor seleccionado vendedor mes anterior
        const vendedor_ = dataMesAnterior.find(v => v.IdVendedor == vendedorId);
        if (vendedor_ && vendedor_.TotalVentas) {
            totalMes = parseFloat(vendedor_.TotalVentas);
        }

        // 👉 Buscar solo el vendedor seleccionado vendedor mes anterior promedio
        const vendedor_Promedio = dataPromedioMesAnterior.find(v => v.IdVendedor == vendedorId);
        if (vendedor_Promedio && vendedor_Promedio.PromedioDiario) {
            totalMesPromedio = parseFloat(vendedor_Promedio.PromedioDiario);
        }

    } else {

        $("#tarjeta_vendedor").text("-");
        // 👉 Si no selecciona, suma todo vendedor mes actual
        dataMesActual.forEach(item => {
            totalHoy += parseFloat(item.TotalVentas) || 0;
        });

        // 👉 Si no selecciona, suma todo vendedor mes anterior
        dataMesAnterior.forEach(item => {
            totalMes += parseFloat(item.TotalVentas) || 0;
        });

        // 👉 Si no selecciona, suma todo vendedor mes anterior promedio
        dataPromedioMesAnterior.forEach(item => {
            totalMesPromedio += parseFloat(item.PromedioDiario) || 0;
        });

        // 👉 LIMPIAR GRÁFICO AQUÍ
        limpiarGraficoVentasHoy(); // 👈 importante
    }
             
 
    $("#venta_total")
        .hide()
        .text("S/ " + Utils.formatearNumero(totalHoy))
        .fadeIn(300);
        
    $("#total_mes_anterior")
        .hide()
        .text("S/ " + Utils.formatearNumero(totalMes))
        .fadeIn(300);

    $("#promedio_mes_anterior")
        .hide()
        .text("S/ " + Utils.formatearNumero(totalMesPromedio))
        .fadeIn(300);

     diferencia_ventasVSpromedio();   

}

function diferencia_ventasVSpromedio() {
    // Obtener valores de los cards y limpiar texto
    const ventaHoyText = $("#venta_total").text().replace(/[S\/,\s]/g, '');
    const promedioText = $("#promedio_mes_anterior").text().replace(/[S\/,\s]/g, '');

    const ventaHoy = parseFloat(ventaHoyText) || 0;
    const promedio = parseFloat(promedioText) || 0;

    const diferencia = ventaHoy - promedio;

    const diferenciaElem = $("#diferencia_valor");
    const mensajeElem = $("#diferencia_mensaje");
    const cardDiferencia = $("#card_diferencia");

    // Determinar mensaje y color
    let mensaje = "";
    let iconClass = "";
    let bgColor = "";

    if (diferencia >= 0) {
        mensaje = "¡Excelente trabajo, sigue así!";
        iconClass = "fas fa-smile card-icon";
        bgColor = "#cdf9df"; // verde
    } else {
        mensaje = "No te desanimes, ¡mañana será mejor!";
        iconClass = "fas fa-frown card-icon";
        bgColor = "#f7e7b1"; // rojo
    }

    // Mostrar diferencia formateada con Utils.formatearNumero y fadeIn
    diferenciaElem
        .hide()
        .text("S/ " + Utils.formatearNumero(Math.abs(diferencia)))
        .fadeIn(300);

    mensajeElem
        .hide()
        .text(mensaje)
        .fadeIn(300);

    cardDiferencia
        .css("background", bgColor)
        .find("i")
        .attr("class", iconClass);
}

function limpiarGraficoVentasHoy() {
    if (chartVentasHoy) {
        chartVentasHoy.destroy();
        chartVentasHoy = null;
    }
}

// ===============================
// FORMATEO DE NÚMEROS (PERÚ)
// ===============================
function formatearNumero(num) {
    return new Intl.NumberFormat('es-PE', {
        minimumFractionDigits: 2,
        maximumFractionDigits: 2
    }).format(num);
}

// ===============================
// FORMATEAR NÚMEROS (PERÚ)
// ===============================
function formatearNumero(num) {
    return new Intl.NumberFormat('es-PE', {
        minimumFractionDigits: 2,
        maximumFractionDigits: 2
    }).format(num);
}

// ===============================
// VARIABLE GLOBAL
// ===============================
let chartVentasHoy = null;

// ===============================
// LIMPIAR GRÁFICO
// ===============================
function limpiarGraficoVentasHoy() {
    if (chartVentasHoy) {
        chartVentasHoy.destroy();
        chartVentasHoy = null;
    }

    const canvas = document.getElementById("graficoVentasHoy");
    if (canvas) {
        const ctx = canvas.getContext("2d");
        ctx.clearRect(0, 0, canvas.width, canvas.height);

        // Mensaje opcional
        ctx.font = "14px sans-serif";
        ctx.fillStyle = "#999";
        ctx.textAlign = "center";
        ctx.fillText("Seleccione un vendedor", canvas.width / 2, canvas.height / 2);
    }
}

// ===============================
// GRÁFICO DOUGHNUT
// ===============================
function RecordVentasVendedor_idPrecio(inicio, fin, ipEnc) {

    const vendedorId = $("#vendedor").val();

    // 🔥 Si no hay selección → limpiar
    if (!vendedorId) {
        limpiarGraficoVentasHoy();
        return;
    }

    ajaxVentas({
        obtenerRecordVentasVendedor_idPrecio: true,
        inicio: inicio,
        fin: fin,
        ipEnc: ipEnc
    }, function(response){

        // 🔥 Evitar gráfico fantasma
        const vendedorIdActual = $("#vendedor").val();
        if (!vendedorIdActual) {
            limpiarGraficoVentasHoy();
            return;
        }

        if (!Array.isArray(response)) return;

        const vendedorData = response.filter(item => item.IdVendedor === vendedorIdActual);

        const etiquetas = [];
        const valores = [];

        vendedorData.forEach(item => {
            etiquetas.push(item.FCD_IdPrecio);
            valores.push(parseFloat(item.TotalComprobante) || 0);
        });

        const ctx = document.getElementById("graficoVentasHoy").getContext("2d");

        // 🔥 destruir gráfico anterior
        if (chartVentasHoy) chartVentasHoy.destroy();

        chartVentasHoy = new Chart(ctx, {
            type: 'doughnut',
            data: {
                labels: etiquetas,
                datasets: [{
                    data: valores,
                    backgroundColor: [
                        '#1f77b4','#2ca02c','#ff7f0e',
                        '#d62728','#9467bd','#17becf'
                    ],
                    borderWidth: 2,
                    borderColor: '#fff'
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false, // 🔥 clave para tamaño
                cutout: '50%', // 🔥 dona más gruesa
                layout: {
                    padding: 5
                },
                plugins: {

                    // ===============================
                    // LEYENDA ABAJO
                    // ===============================
                    legend: {
                        position: 'bottom',
                        labels: {
                            usePointStyle: true,
                            padding: 20,
                            font: {
                                size: 13
                            },
                            generateLabels: function(chart) {

                                const data = chart.data;
                                const valores = data.datasets[0].data;
                                const total = valores.reduce((a, b) => a + b, 0);

                                return data.labels.map((label, i) => {

                                    const valor = valores[i];
                                    const porcentaje = total > 0
                                        ? ((valor / total) * 100).toFixed(1)
                                        : 0;

                                    return {
                                        //text: `[${label}] S/ ${formatearNumero(valor)} (${porcentaje}%)`,
                                        text: `[${label}] S/ ${formatearNumero(valor)} `,
                                        fillStyle: data.datasets[0].backgroundColor[i],
                                        strokeStyle: '#fff',
                                        lineWidth: 1,
                                        hidden: false,
                                        index: i
                                    };
                                });
                            }
                        }
                    },

                    // ===============================
                    // TOOLTIP
                    // ===============================
                    tooltip: {
                        callbacks: {
                            label: function(context) {

                                const value = context.raw;
                                const total = context.dataset.data.reduce((a, b) => a + b, 0);
                                const porcentaje = total > 0
                                    ? ((value / total) * 100).toFixed(2)
                                    : 0;
                                return `S/ ${formatearNumero(value)} (${porcentaje}%)`;    
                                //return `${context.label}: S/ ${formatearNumero(value)} (${porcentaje}%)`;
                            }
                        }
                    },

                    // ===============================
                    // % DENTRO DEL GRÁFICO
                    // ===============================
                    datalabels: {
                        color: '#000',
                        font: {
                            weight: 'bold',
                            size: 12
                        },
                        formatter: (value, context) => {
                            const total = context.dataset.data.reduce((a, b) => a + b, 0);
                            const porcentaje = total > 0
                                ? ((value / total) * 100).toFixed(1)
                                : 0;

                            return porcentaje + "%";
                        }
                    }
                }
            },

            // 🔥 ACTIVAR PLUGIN
            plugins: [ChartDataLabels]
        });
    });
}