let ticketsGlobales = [];
let ticketsParaExportar = [];
let listaTiemposDetalle = [];

let graficosActivos = {
    categoria: null,
    area: null,
    estado: null,
    prioridad: null
};

document.addEventListener('DOMContentLoaded', () => {
    const rol = localStorage.getItem('rol');
    if (!rol || rol !== 'administrador') {
        window.location.href = 'login.html';
        return;
    }

    document.getElementById('nombreAdmin').textContent = `Admin: ${localStorage.getItem('nombres') || 'Administrador'}`;
    document.getElementById('btnCerrarSesion').addEventListener('click', () => {
        localStorage.clear();
        window.location.href = 'login.html';
    });

    cargarEstadisticas();
});

async function cargarEstadisticas() {
    try {
        const response = await fetch('/api/admin/tickets');
        ticketsGlobales = await response.json();
        manejarCambioFiltro(); // Inicia mostrando todo el histórico
    } catch (error) {
        console.error("Error al cargar datos:", error);
    }
}

// ==========================================
// NUEVO: SISTEMA DE FILTROS AVANZADO
// ==========================================

function manejarCambioFiltro() {
    const filtro = document.getElementById('filtroTiempo').value;
    const contenedorRango = document.getElementById('contenedorRango');
    
    if (filtro === 'rango') {
        // Muestra los calendarios y pausa el filtrado hasta que le den al botón "Aplicar"
        contenedorRango.style.display = 'flex';
    } else {
        // Oculta calendarios y aplica el filtro rápido
        contenedorRango.style.display = 'none';
        aplicarFiltroPredefinido(filtro);
    }
}

function aplicarFiltroPredefinido(filtro) {
    const ahora = new Date();
    const hoyInicio = new Date(ahora.getFullYear(), ahora.getMonth(), ahora.getDate());

    const filtrados = ticketsGlobales.filter(t => {
        const fechaTicket = new Date(t.fecha_creacion);
        
        if (filtro === 'hoy') return fechaTicket >= hoyInicio;
        if (filtro === 'semana') {
            const sieteDiasAtras = new Date(hoyInicio);
            sieteDiasAtras.setDate(sieteDiasAtras.getDate() - 7);
            return fechaTicket >= sieteDiasAtras;
        }
        if (filtro === 'mes') return fechaTicket.getMonth() === ahora.getMonth() && fechaTicket.getFullYear() === ahora.getFullYear();
        if (filtro === 'anio') return fechaTicket.getFullYear() === ahora.getFullYear();
        
        return true; // Si es 'todos'
    });

    actualizarDashboard(filtrados);
}

function aplicarFiltroRango() {
    const fInicioStr = document.getElementById('fechaInicio').value;
    const fFinStr = document.getElementById('fechaFin').value;

    if (!fInicioStr || !fFinStr) {
        alert("Por favor, selecciona una fecha de inicio y una de fin.");
        return;
    }

    // Le agregamos horas para asegurarnos que tome todo el último día
    const fechaInicio = new Date(fInicioStr + "T00:00:00");
    const fechaFin = new Date(fFinStr + "T23:59:59"); 

    if (fechaInicio > fechaFin) {
        alert("La fecha de inicio no puede ser mayor a la fecha de fin.");
        return;
    }

    const filtrados = ticketsGlobales.filter(t => {
        const fechaTicket = new Date(t.fecha_creacion);
        return fechaTicket >= fechaInicio && fechaTicket <= fechaFin;
    });

    actualizarDashboard(filtrados);
}

function actualizarDashboard(ticketsFiltrados) {
    ticketsParaExportar = ticketsFiltrados;
    calcularKPIs(ticketsFiltrados);
    redibujarGraficos(ticketsFiltrados);
}

// Genera un nombre de archivo inteligente según el filtro
function obtenerNombreReporte() {
    const select = document.getElementById('filtroTiempo');
    if (select.value === 'rango') {
        const f1 = document.getElementById('fechaInicio').value || 'Inicio';
        const f2 = document.getElementById('fechaFin').value || 'Fin';
        return `Rango_${f1}_al_${f2}`;
    }
    return select.options[select.selectedIndex].text.replace(/ /g, '_');
}

// ==========================================
// EXPORTACIÓN EXCEL Y PDF
// ==========================================

function exportarExcel() {
    if (ticketsParaExportar.length === 0) {
        alert("No hay datos en esta fecha para exportar.");
        return;
    }

    const datosFormateados = ticketsParaExportar.map(t => ({
        "ID Ticket": `TK-${t.id.toString().padStart(3, '0')}`,
        "Asunto": t.titulo,
        "Usuario Solicitante": t.creador_nombre || 'Desconocido',
        "Área": t.creador_area || 'Desconocida',
        "Categoría": t.categoria || 'Otro',
        "Prioridad": t.prioridad || 'Por Evaluar',
        "Estado": t.estado,
        "Fecha Creación": new Date(t.fecha_creacion).toLocaleString('es-PE'),
        "Última Actualización": new Date(t.fecha_actualizacion).toLocaleString('es-PE')
    }));

    const worksheet = XLSX.utils.json_to_sheet(datosFormateados);
    const workbook = XLSX.utils.book_new();
    XLSX.utils.book_append_sheet(workbook, worksheet, "Reporte");
    
    XLSX.writeFile(workbook, `Reporte_Tickets_MM_${obtenerNombreReporte()}.xlsx`);
}

async function exportarPDF() {
    const barra = document.getElementById('barraExportar');
    if (barra) barra.style.display = 'none';

    try {
        const areaDashboard = document.getElementById('dashboardCaptura');
        const canvas = await html2canvas(areaDashboard, { scale: 2 });
        const imgData = canvas.toDataURL('image/png');
        
        const { jsPDF } = window.jspdf;
        const pdf = new jsPDF('p', 'mm', 'a4');
        
        const pdfWidth = 190; 
        const pdfHeight = (canvas.height * pdfWidth) / canvas.width;
        
        pdf.text(`Reporte Estadístico M&M - ${obtenerNombreReporte().replace(/_/g, ' ')}`, 10, 10);
        pdf.addImage(imgData, 'PNG', 10, 15, pdfWidth, pdfHeight);
        
        pdf.save(`Dashboard_MM_${obtenerNombreReporte()}.pdf`);
    } catch (error) {
        console.error("Error generando PDF:", error);
        alert("Ocurrió un error al generar el PDF.");
    } finally {
        if (barra) barra.style.display = 'flex';
    }
}

// ==========================================
// CÁLCULOS Y GRÁFICOS (Resto del código)
// ==========================================

function redibujarGraficos(tickets) {
    if (graficosActivos.categoria) graficosActivos.categoria.destroy();
    if (graficosActivos.area) graficosActivos.area.destroy();
    if (graficosActivos.estado) graficosActivos.estado.destroy();
    if (graficosActivos.prioridad) graficosActivos.prioridad.destroy();

    graficosActivos.categoria = generarGraficoCategorias(tickets);
    graficosActivos.area = generarGraficoAreas(tickets);
    graficosActivos.estado = generarGraficoEstados(tickets);
    graficosActivos.prioridad = generarGraficoPrioridades(tickets);
}

function formatearTiempoMs(ms) {
    const horas = Math.floor(ms / (1000 * 60 * 60));
    const minutos = Math.floor((ms % (1000 * 60 * 60)) / (1000 * 60));
    if (horas >= 24) return `${Math.floor(horas / 24)}d ${horas % 24}h`;
    if (horas > 0) return `${horas}h ${minutos}m`;
    if (minutos > 0) return `${minutos}m`;
    return `< 1m`;
}

function calcularKPIs(tickets) {
    const total = tickets.length;
    let resueltosCount = 0, pendientesCount = 0, tiempoTotalMs = 0;
    listaTiemposDetalle = [];

    tickets.forEach(t => {
        if (t.estado === 'Resuelto' || t.estado === 'Cerrado') {
            resueltosCount++;
            const creacion = new Date(t.fecha_creacion);
            const resolucion = new Date(t.fecha_actualizacion);
            if (resolucion > creacion) {
                const diffMs = resolucion - creacion;
                tiempoTotalMs += diffMs;
                listaTiemposDetalle.push({ id: t.id, titulo: t.titulo, usuario: t.creador_nombre || 'Desconocido', tiempo: formatearTiempoMs(diffMs) });
            }
        } else {
            pendientesCount++;
        }
    });

    const tasa = total === 0 ? 0 : Math.round((resueltosCount / total) * 100);
    const textoPromedio = (resueltosCount > 0 && tiempoTotalMs > 0) ? formatearTiempoMs(tiempoTotalMs / resueltosCount) : "0h";

    document.getElementById('statTotal').textContent = total;
    document.getElementById('statResueltos').textContent = `${tasa}%`;
    document.getElementById('statPendientes').textContent = pendientesCount;
    document.getElementById('statTiempo').textContent = textoPromedio;
}

function abrirModalTiempos() {
    const tbody = document.getElementById('tablaTiemposBody');
    if (listaTiemposDetalle.length === 0) {
        tbody.innerHTML = `<tr><td colspan="4" style="text-align: center; padding: 20px; color: #64748b;">No hay tickets resueltos en este periodo.</td></tr>`;
    } else {
        listaTiemposDetalle.sort((a, b) => b.id - a.id);
        tbody.innerHTML = listaTiemposDetalle.map(t => `
            <tr style="border-bottom: 1px solid #f1f5f9;">
                <td style="padding: 12px 15px;"><strong>#TK-${t.id.toString().padStart(3, '0')}</strong></td>
                <td style="padding: 12px 15px; color: #334155;">${t.titulo}</td>
                <td style="padding: 12px 15px; color: #64748b;">${t.usuario}</td>
                <td style="padding: 12px 15px; text-align: right; font-weight: bold; color: #ef4444;">${t.tiempo}</td>
            </tr>
        `).join('');
    }
    document.getElementById('modalTiempos').style.display = 'block';
}

function cerrarModalTiempos() { document.getElementById('modalTiempos').style.display = 'none'; }


const paletaColores = ['#0284c7', '#a855f7', '#10b981', '#f59e0b', '#ef4444', '#64748b'];

function generarGraficoCategorias(tickets) {
    const conteo = {};
    tickets.forEach(t => { conteo[t.categoria || 'Otro'] = (conteo[t.categoria || 'Otro'] || 0) + 1; });
    return new Chart(document.getElementById('chartCategoria').getContext('2d'), { type: 'doughnut', data: { labels: Object.keys(conteo), datasets: [{ data: Object.values(conteo), backgroundColor: paletaColores, borderWidth: 2 }] }, options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { position: 'bottom' } } } });
}

function generarGraficoAreas(tickets) {
    const conteo = {};
    tickets.forEach(t => { conteo[t.creador_area ? t.creador_area.toUpperCase() : 'DESCONOCIDA'] = (conteo[t.creador_area ? t.creador_area.toUpperCase() : 'DESCONOCIDA'] || 0) + 1; });
    const areas = Object.keys(conteo).sort((a, b) => conteo[b] - conteo[a]);
    return new Chart(document.getElementById('chartArea').getContext('2d'), { type: 'bar', data: { labels: areas, datasets: [{ label: 'Tickets', data: areas.map(a => conteo[a]), backgroundColor: '#a855f7', borderRadius: 4 }] }, options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { display: false } }, scales: { y: { beginAtZero: true, ticks: { precision: 0 } } } } });
}

function generarGraficoEstados(tickets) {
    const conteo = { 'Abierto': 0, 'En Proceso': 0, 'Resuelto': 0 };
    tickets.forEach(t => { if(conteo[t.estado] !== undefined) conteo[t.estado]++; });
    return new Chart(document.getElementById('chartEstado').getContext('2d'), { type: 'bar', data: { labels: ['Abiertos', 'En Proceso', 'Resueltos'], datasets: [{ label: 'Volumen', data: [conteo['Abierto'], conteo['En Proceso'], conteo['Resuelto']], backgroundColor: ['#ef4444', '#f59e0b', '#10b981'], borderRadius: 4 }] }, options: { indexAxis: 'y', responsive: true, maintainAspectRatio: false, plugins: { legend: { display: false } }, scales: { x: { beginAtZero: true, ticks: { precision: 0 } } } } });
}

function generarGraficoPrioridades(tickets) {
    const conteo = { 'Por Evaluar': 0, 'Baja': 0, 'Media': 0, 'Alta': 0, 'Crítica': 0 };
    tickets.forEach(t => { if(conteo[t.prioridad || 'Por Evaluar'] !== undefined) conteo[t.prioridad || 'Por Evaluar']++; });
    const mapaColores = { 'Por Evaluar': '#94a3b8', 'Baja': '#10b981', 'Media': '#f59e0b', 'Alta': '#ef4444', 'Crítica': '#7f1d1d' };
    const etiquetas = [], datos = [], colores = [];
    for (const [nivel, valor] of Object.entries(conteo)) { if (valor > 0) { etiquetas.push(nivel); datos.push(valor); colores.push(mapaColores[nivel]); } }
    return new Chart(document.getElementById('chartPrioridad').getContext('2d'), { type: 'pie', data: { labels: etiquetas, datasets: [{ data: datos, backgroundColor: colores, borderWidth: 2 }] }, options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { position: 'right' } } } });
}