/**
 * public_html/js/simulador.js
 * CORRECCIÓN: Lógica de Slider y Rangos activada.
 */

document.addEventListener('DOMContentLoaded', () => {

    const track = document.getElementById('da-track');
    const form = document.getElementById('simulador-form');
    const areaResultados = document.getElementById('area-resultados-credito');
    
    const lineaSelect = document.getElementById('linea_credito');
    const montoInput = document.getElementById('monto');
    const plazoInput = document.getElementById('plazo');
    const tasaInput = document.getElementById('tasa');

    // REFERENCIAS A LOS RANGOS
    const rangeMonto = document.getElementById('range-monto');
    const rangePlazo = document.getElementById('range-plazo');

    let lineasCreditoData = [];

    // --- COMUNICACIÓN DE ALTURA ---
    const enviarAltura = (delay = 100) => {
        setTimeout(() => {
            const slideActivo = track.style.transform.includes('-50%') ? 1 : 0; // 0 = form, 1 = resultados
            const slides = document.querySelectorAll('.da-slide');
            if(slides[slideActivo]) {
                // Altura del slide activo + padding del contenedor (80px aprox)
                let h = slides[slideActivo].scrollHeight + 100; 
                if (window.parent && window.parent.postMessage) {
                    window.parent.postMessage({ type: 'setHeight', height: h }, '*');
                }
            }
        }, delay);
    };

    // --- CARGAR LÍNEAS ---
    const cargarLineas = async () => {
        try {
            const r = await fetch('index.php?action=obtener_lineas');
            const data = await r.json();
            lineasCreditoData = data;
            
            if (lineaSelect) {
                lineaSelect.innerHTML = '<option value="" selected disabled>Elegir línea...</option>';
                data.forEach(l => {
                    const opt = document.createElement('option');
                    opt.value = l.id_tipo_credito || l.id;
                    opt.textContent = l.nombre_linea;
                    lineaSelect.appendChild(opt);
                });
            }
            enviarAltura(200);
        } catch (e) { console.error('Error cargando líneas:', e); }
    };

    // --- CAMBIO DE LÍNEA (Rellenar Tasa y Rangos) ---
    if (lineaSelect) {
        lineaSelect.addEventListener('change', () => {
            const selectedId = lineaSelect.value;
            const linea = lineasCreditoData.find(l => (l.id_tipo_credito || l.id) == selectedId);
            
            if (linea) {
                // Tasa
                const tRaw = parseFloat(linea.tasa_interes_mensual || 0);
                const tVis = (tRaw < 1 && tRaw > 0) ? (tRaw * 100) : tRaw;
                if(tasaInput) tasaInput.value = tVis.toFixed(2) + ' % Mes';
                
                // Formateador de moneda
                const fmt = new Intl.NumberFormat('es-CO', { style: 'currency', currency: 'COP', maximumFractionDigits: 0 });
                
                // LLENAR RANGOS (Aquí estaba el fallo antes)
                if(rangeMonto) {
                    rangeMonto.innerHTML = `Mín: ${fmt.format(linea.monto_minimo)} <br> Máx: ${fmt.format(linea.monto_maximo)}`;
                    rangeMonto.style.display = 'block';
                }
                if(rangePlazo) {
                    rangePlazo.innerHTML = `Mín: ${linea.plazo_minimo_meses} - Máx: ${linea.plazo_maximo_meses} Meses`;
                    rangePlazo.style.display = 'block';
                }
            }
            enviarAltura(100);
        });
    }

    // --- BOTÓN CALCULAR (Deslizar a la izquierda) ---
    const btnCalcular = document.getElementById('btn-calcular-credito');
    if (btnCalcular) {
        btnCalcular.addEventListener('click', async (e) => {
            e.preventDefault();
            if (btnCalcular.classList.contains('is-processing')) return;

            // Validaciones básicas
            if (!lineaSelect.value || !montoInput.value || !plazoInput.value) {
                alert("Por favor completa todos los campos."); // O usar tu mostrarErrorForm
                return;
            }

            btnCalcular.classList.add('is-processing');
            btnCalcular.innerHTML = '<i class="fas fa-circle-notch fa-spin"></i> Procesando...';
            
            // Animación de carga en el área de resultados
            areaResultados.innerHTML = `<div style="text-align:center; padding:50px;"><i class="fas fa-spinner fa-spin fa-3x" style="color:white;"></i></div>`;
            
            // 1. DESLIZAR (SLIDE EFFECT)
            if (track) track.style.transform = 'translateX(-50%)';
            enviarAltura(300); // Ajustar altura mientras carga

            try {
                const response = await fetch('index.php?action=simular', {
                    method: 'POST',
                    body: new FormData(form),
                    headers: { 'X-Requested-With': 'XMLHttpRequest' }
                });
                const html = await response.text();
                
                // 2. MOSTRAR RESULTADO
                areaResultados.innerHTML = html;
                
                // Recalcular altura una vez cargado el contenido real
                enviarAltura(500);

            } catch (e) { 
                areaResultados.innerHTML = '<p style="color:white;">Error de conexión.</p>'; 
            } finally {
                btnCalcular.classList.remove('is-processing');
                btnCalcular.innerHTML = 'CALCULAR MI CUOTA <i class="fas fa-chevron-right"></i>';
            }
        });
    }

    // --- BOTÓN VOLVER (Deslizar a la derecha) ---
    // Usamos delegación por si el botón se regenera, aunque en este HTML es estático.
    document.addEventListener('click', (e) => {
        if(e.target && (e.target.id === 'btn-volver-simular' || e.target.closest('#btn-volver-simular'))) {
            e.preventDefault();
            if (track) track.style.transform = 'translateX(0%)';
            enviarAltura(500); // Reajustar altura al volver al form
        }
    });

    // Formato moneda input
    if (montoInput) {
        montoInput.addEventListener('input', (e) => {
            let val = e.target.value.replace(/\D/g, '');
            e.target.value = val ? new Intl.NumberFormat('es-CO').format(parseInt(val)) : '';
        });
    }

    // Inicializar
    cargarLineas();
    window.addEventListener('resize', () => enviarAltura(300));
});