// Variable para guardar el ID que estamos editando
let ticketsGlobales = [];
let ticketEnEdicion = null;

document.addEventListener('DOMContentLoaded', () => {
    // 1. SEGURIDAD Y SESIÓN
    const rol = localStorage.getItem('rol');
    const nombres = localStorage.getItem('nombres') || 'Administrador';

    
    if (!rol || rol !== 'administrador') {
        window.location.href = 'login.html';
        return;
    }

   
    const txtNombre = document.getElementById('nombreAdmin');
    if (txtNombre) {
        txtNombre.textContent = `Admin: ${nombres}`;
    }


    const btnLogout = document.getElementById('btnCerrarSesion');
    if (btnLogout) {
        btnLogout.addEventListener('click', () => {
            localStorage.clear();
            window.location.href = 'login.html';
        });
    }

    // 2. INICIAR LA CARGA DE DATOS
    cargarPanelAdmin();

    // 3. FILTROS EN TIEMPO REAL
    const inputBusqueda = document.getElementById('busquedaGlobal');
    const selectEstado = document.getElementById('filtroEstadoGlobal');

    if (inputBusqueda) inputBusqueda.addEventListener('input', aplicarFiltrosAdmin);
    if (selectEstado) selectEstado.addEventListener('change', aplicarFiltrosAdmin);
});

async function cargarPanelAdmin() {
    try {
        const response = await fetch('/api/admin/tickets');
        ticketsGlobales = await response.json();

        actualizarKPIs(ticketsGlobales);
        

        aplicarFiltrosAdmin();
    } catch (error) {
        console.error("Error al cargar el panel de admin:", error);
        document.getElementById('adminBody').innerHTML = `<tr><td colspan="7" style="text-align: center; color: red;">Error al conectar con la base de datos.</td></tr>`;
    }
}

function actualizarKPIs(tickets) {
    let abiertos = 0;
    let enProceso = 0;
    let resueltosHoy = 0;

    // Obtener la fecha de hoy en formato local para comparar
    const hoy = new Date().toLocaleDateString('es-PE');

    tickets.forEach(t => {
        if (t.estado === 'Abierto') abiertos++;
        if (t.estado === 'En Proceso') enProceso++;

        if (t.estado === 'Resuelto') {
            const fechaResolucion = new Date(t.fecha_actualizacion).toLocaleDateString('es-PE');
            if (fechaResolucion === hoy) {
                resueltosHoy++;
            }
        }
    });


    document.getElementById('kpiAbiertos').textContent = abiertos;
    document.getElementById('kpiProceso').textContent = enProceso;
    document.getElementById('kpiResueltos').textContent = resueltosHoy;
    document.getElementById('kpiTotal').textContent = tickets.length;
}

function aplicarFiltrosAdmin() {
    const inputBusqueda = document.getElementById('busquedaGlobal');
    const selectEstado = document.getElementById('filtroEstadoGlobal');
    
    const txt = inputBusqueda ? inputBusqueda.value.toLowerCase() : '';
    const estado = selectEstado ? selectEstado.value : 'todos';
    

    const hoy = new Date().toLocaleDateString('es-PE');

    const filtrados = ticketsGlobales.filter(t => {

        const tituloReal = t.titulo ? t.titulo.toLowerCase() : '';
        const nombreReal = t.creador_nombre ? t.creador_nombre.toLowerCase() : '';
        
        const coincideTxt = tituloReal.includes(txt) || nombreReal.includes(txt) || t.id.toString().includes(txt);
        const coincideEst = estado === 'todos' || t.estado === estado;

        // 2. REGLA INBOX ZERO (Bandeja Diaria)
        const fechaCreacion = new Date(t.fecha_creacion).toLocaleDateString('es-PE');
        

        const fechaAct = t.fecha_actualizacion ? new Date(t.fecha_actualizacion).toLocaleDateString('es-PE') : fechaCreacion;
        
        const estaPendiente = t.estado === 'Abierto' || t.estado === 'En Proceso';
        const creadoHoy = fechaCreacion === hoy;
        const resueltoHoy = t.estado === 'Resuelto' && fechaAct === hoy; 

       
        const enBandeja = estaPendiente || creadoHoy || resueltoHoy;

        return coincideTxt && coincideEst && enBandeja;
    });

    renderizarTablaAdmin(filtrados);
}

function renderizarTablaAdmin(tickets) {
    const tbody = document.getElementById('adminBody');

    if (!tickets || tickets.length === 0) {
        tbody.innerHTML = `<tr><td colspan="7" style="text-align: center; padding: 40px; color: #64748b; font-size: 15px;">No hay tickets pendientes o recientes. ¡Bandeja limpia! 🎉</td></tr>`;
        return;
    }

    tbody.innerHTML = tickets.map(t => {
   
        const fechaF = new Date(t.fecha_creacion).toLocaleString('es-PE', {
            day: '2-digit', month: '2-digit', year: 'numeric',
            hour: '2-digit', minute: '2-digit', hour12: true
        });

       
        let badgeEstado = 'bg-abierto';
        if (t.estado === 'En Proceso') badgeEstado = 'bg-proceso';
        if (t.estado === 'Resuelto') badgeEstado = 'bg-resuelto';

        return `
            <tr>
                <td><strong>#TK-${t.id.toString().padStart(3, '0')}</strong></td>
                <td>
                    <div style="font-weight: bold; color: #1e293b;">${t.creador_nombre}</div>
                    <div style="font-size: 11px; color: #64748b;">${t.creador_area}</div>
                </td>
                <td>${t.titulo}</td>
                <td><span class="badge" style="background:#f1f5f9; color:#475569;">${t.prioridad || 'Por Evaluar'}</span></td>
                <td><span class="badge-status ${badgeEstado}">${t.estado}</span></td>
                <td>${fechaF}</td>
                <td style="text-align: center;">
                    <button class="btn-gestionar" onclick="abrirGestion(${t.id})">
                        <i class="bi bi-gear-fill"></i> Gestionar
                    </button>
                </td>
            </tr>
        `;
    }).join('');
}

function abrirGestion(id) {
    ticketEnEdicion = id;
    const t = ticketsGlobales.find(x => x.id === id);
    

    document.getElementById('modalId').textContent = `#TK-${id.toString().padStart(3, '0')}`;
    document.getElementById('modalIdLabel').textContent = `#TK-${id.toString().padStart(3, '0')}`;
    document.getElementById('modalUsuario').textContent = t.creador_nombre;
    document.getElementById('modalArea').textContent = t.creador_area;
    
    
    const optionsDate = { day: '2-digit', month: '2-digit', year: 'numeric', hour: '2-digit', minute: '2-digit', hour12: true };
    const fechaCreacionStr = new Date(t.fecha_creacion).toLocaleString('es-PE', optionsDate);
    const fechaActStr = new Date(t.fecha_actualizacion).toLocaleString('es-PE', optionsDate);
    document.getElementById('modalFecha').textContent = fechaCreacionStr;
    document.getElementById('timeCreado').textContent = fechaCreacionStr;
    document.getElementById('timeActualizado').textContent = fechaActStr;

    
    const bEstado = document.getElementById('badgeEstadoActual');
    bEstado.textContent = (t.estado || 'Abierto').toUpperCase();
    bEstado.className = 'badge-status ' + (t.estado === 'En Proceso' ? 'bg-proceso' : t.estado === 'Resuelto' ? 'bg-resuelto' : 'bg-abierto');

    const bPrio = document.getElementById('badgePrioridadActual');
    const prioVal = t.prioridad || 'Baja';
    bPrio.textContent = prioVal.toUpperCase();
    bPrio.className = 'badge-status ' + (prioVal === 'Alta' || prioVal === 'Crítica' ? 'priority-alta' : prioVal === 'Media' ? 'priority-media' : 'priority-baja');

    // 2. Descripción
    document.getElementById('modalDesc').textContent = t.descripcion;

    // 3. Evidencia
    const imgElement = document.getElementById('modalEvidencia');
    const actionsBox = document.getElementById('evidenceActions');
    const noImgText = document.getElementById('textoSinEvidencia');

    if (t.evidencia && t.evidencia.trim() !== "") {
       
        let rutaImg = t.evidencia;
        
        rutaImg = rutaImg.replace(/\\/g, '/');
        if (!rutaImg.includes('uploads')) {
            rutaImg = `/uploads/evidencias/${rutaImg}`;
        }
        if (!rutaImg.startsWith('/')) rutaImg = '/' + rutaImg;
        rutaImg = rutaImg.replace(/\/\//g, '/');

        imgElement.src = rutaImg;
        document.getElementById('linkVerImg').href = rutaImg;
        document.getElementById('linkDescargarImg').href = rutaImg;
        
        imgElement.style.display = 'block';
        actionsBox.style.display = 'flex';
        noImgText.style.display = 'none';
    } else {
       
        imgElement.src = '../assets/sin-evidencia.png'; 
        imgElement.style.display = 'block';             
        actionsBox.style.display = 'none';              
        noImgText.style.display = 'block';              
    }

    // 4. Gestión 
    document.getElementById('editEstado').value = t.estado;
    document.getElementById('editPrioridad').value = t.prioridad || 'Baja';
    document.getElementById('editObservaciones').value = t.observaciones || '';
    contarCaracteres(document.getElementById('editObservaciones')); 

    // 5. Mostrar modal
    document.getElementById('modalGestion').style.display = 'block';
}

function cerrarModal() {
    document.getElementById('modalGestion').style.display = 'none';
}

function contarCaracteres(obj) {
    const maxLength = 1000;
    const strLength = obj.value.length;
    document.getElementById('charCount').textContent = strLength;
    if (strLength > maxLength) {
        obj.value = obj.value.substring(0, maxLength);
        document.getElementById('charCount').textContent = maxLength;
    }
}

async function guardarCambios() {
    const estado = document.getElementById('editEstado').value;
    const prioridad = document.getElementById('editPrioridad').value;
    const observaciones = document.getElementById('editObservaciones').value;
    const admin_id = localStorage.getItem('usuario_id');

    if (!ticketEnEdicion) return;

    try {
        const btn = document.querySelector('.btn-guardar-pro');
        if (btn) {
            btn.innerHTML = '<i class="bi bi-hourglass-split"></i> Guardando...';
            btn.disabled = true;
        }

        const response = await fetch(`/api/admin/actualizar/${ticketEnEdicion}`, {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({ estado, prioridad, observaciones, admin_id })
        });

        if (response.ok) {
            cerrarModal();
            
            
            await cargarPanelAdmin();
            
            if (btn) {
                btn.innerHTML = '<i class="bi bi-save"></i> Guardar Cambios';
                btn.disabled = false;
            }
        } else {
            alert("Error al actualizar en el servidor");
            if (btn) {
                btn.innerHTML = '<i class="bi bi-save"></i> Guardar Cambios';
                btn.disabled = false;
            }
        }
    } catch (err) {
        console.error("Error:", err);
        alert("Error de conexión al guardar");
    }
}