{% extends "base.html" %}
{% block title %}Configuración{% endblock %}
{% block header %}Configuración{% endblock %}
{% block content %}
<div class="max-w-3xl">
    <div class="bg-white rounded-xl shadow-sm border border-gray-200">
        <div class="px-6 py-4 border-b border-gray-200">
            <h3 class="font-semibold text-gray-800"><i class="fas fa-database mr-2 text-blue-500"></i>Conexión Firebird</h3>
        </div>
        <div class="p-6">
            <form method="POST" action="/config/save" class="space-y-6">
                <div class="grid grid-cols-2 gap-4">
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Host</label>
                        <input type="text" name="config_firebird_host"
                            value="{{ configs|selectattr('key', 'equalto', 'firebird_host')|map(attribute='value')|first }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 text-sm">
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Puerto</label>
                        <input type="text" name="config_firebird_port"
                            value="{{ configs|selectattr('key', 'equalto', 'firebird_port')|map(attribute='value')|first }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 text-sm">
                    </div>
                </div>
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">Base de Datos (ruta)</label>
                    <input type="text" name="config_firebird_database"
                        value="{{ configs|selectattr('key', 'equalto', 'firebird_database')|map(attribute='value')|first }}"
                        class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 text-sm">
                </div>
                <div class="grid grid-cols-2 gap-4">
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Usuario</label>
                        <input type="text" name="config_firebird_user"
                            value="{{ configs|selectattr('key', 'equalto', 'firebird_user')|map(attribute='value')|first }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 text-sm">
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Contraseña</label>
                        <input type="password" name="config_firebird_password"
                            value="{{ configs|selectattr('key', 'equalto', 'firebird_password')|map(attribute='value')|first }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 text-sm">
                    </div>
                </div>
                <div class="flex items-center space-x-3">
                    <button type="button" onclick="testFirebird()"
                        class="px-4 py-2 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200 text-sm font-medium">
                        <i class="fas fa-plug mr-1"></i> Probar Conexión
                    </button>
                    <span id="fb-status" class="text-sm"></span>
                </div>

                <hr class="border-gray-200">

                <h4 class="font-medium text-gray-800"><i class="fas fa-key mr-2 text-orange-500"></i>Credenciales TNS</h4>
                <p class="text-xs text-gray-500 -mt-2">Acceso a <strong>api.tns.co</strong> — portal de envío RIPS</p>
                <div class="grid grid-cols-2 gap-4">
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Código Empresa</label>
                        <input type="text" name="config_tns_empresa"
                            value="{{ configs|selectattr('key', 'equalto', 'tns_empresa')|map(attribute='value')|first }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 text-sm"
                            placeholder="Ej: 9002787299">
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Código Sucursal</label>
                        <input type="text" name="config_api_sucursal"
                            value="{{ configs|selectattr('key', 'equalto', 'api_sucursal')|map(attribute='value')|first }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 text-sm"
                            placeholder="Ej: 81080">
                    </div>
                </div>
                <div class="grid grid-cols-2 gap-4">
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Usuario TNS</label>
                        <input type="text" name="config_tns_usuario"
                            value="{{ configs|selectattr('key', 'equalto', 'tns_usuario')|map(attribute='value')|first }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 text-sm"
                            placeholder="Ej: DOCUXER">
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Contraseña TNS</label>
                        <input type="password" name="config_tns_password"
                            value="{{ configs|selectattr('key', 'equalto', 'tns_password')|map(attribute='value')|first }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 text-sm">
                    </div>
                </div>
                <div>
                    <button type="button" onclick="testTNS()"
                        class="px-4 py-2 bg-orange-50 text-orange-700 border border-orange-200 rounded-lg hover:bg-orange-100 text-sm font-medium">
                        <i class="fas fa-satellite-dish mr-1"></i> Probar conexión TNS
                    </button>
                    <span id="tns-status" class="text-sm ml-3"></span>
                </div>

                <hr class="border-gray-200">

                <h4 class="font-medium text-gray-800"><i class="fas fa-clock mr-2 text-blue-500"></i>API General</h4>
                <div class="grid grid-cols-2 gap-4">
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Timeout (seg)</label>
                        <input type="number" name="config_api_timeout"
                            value="{{ configs|selectattr('key', 'equalto', 'api_timeout')|map(attribute='value')|first }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 text-sm">
                    </div>
                </div>

                <hr class="border-gray-200">

                <h4 class="font-medium text-gray-800"><i class="fas fa-building mr-2 text-blue-500"></i>Datos del Prestador</h4>
                <div class="grid grid-cols-2 gap-4">
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">NIT / Documento Obligado</label>
                        <input type="text" name="config_num_documento_obligado"
                            value="{{ configs|selectattr('key', 'equalto', 'num_documento_obligado')|map(attribute='value')|first }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 text-sm">
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Código Prestador</label>
                        <input type="text" name="config_cod_prestador"
                            value="{{ configs|selectattr('key', 'equalto', 'cod_prestador')|map(attribute='value')|first }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 text-sm">
                    </div>
                </div>

                <h4 class="font-medium text-gray-800"><i class="fas fa-user-md mr-2 text-green-500"></i>Valores por Defecto RDA</h4>
                <div class="grid grid-cols-2 gap-4">
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Profesional Default <span class="text-gray-400 font-normal">(código TNS, ej: XIMENA)</span></label>
                        <input type="text" name="config_profesional_default"
                            value="{{ configs|selectattr('key', 'equalto', 'profesional_default')|map(attribute='value')|first|default('') }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 text-sm">
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Especialidad Default <span class="text-gray-400 font-normal">(código TNS, ej: 02)</span></label>
                        <input type="text" name="config_especialidad_default"
                            value="{{ configs|selectattr('key', 'equalto', 'especialidad_default')|map(attribute='value')|first|default('') }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 text-sm">
                    </div>
                </div>
                <div class="grid grid-cols-2 gap-4">
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Remisionante Default <span class="text-gray-400 font-normal">(cédula médico si no hay en Firebird)</span></label>
                        <input type="text" name="config_remisionante_default"
                            value="{{ configs|selectattr('key', 'equalto', 'remisionante_default')|map(attribute='value')|first|default('00') }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 text-sm">
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Prefijo TNS Default <span class="text-gray-400 font-normal">(prefijo de facturación TNS, ej: 00)</span></label>
                        <input type="text" name="config_prefijo_tns_default"
                            value="{{ configs|selectattr('key', 'equalto', 'prefijo_tns_default')|map(attribute='value')|first|default('00') }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 text-sm">
                    </div>
                </div>

                <hr class="border-gray-200">

                <h4 class="font-medium text-gray-800">
                    <i class="fab fa-whatsapp mr-2 text-green-500"></i>WhatsApp Lab — Ingesta de Pacientes
                </h4>
                <p class="text-xs text-gray-500 -mt-2">
                    URL base del sistema WhatsApp Lab. Los pacientes de RIPS se sincronizarán a
                    <code class="bg-gray-100 px-1 rounded">/api/lab/ingest_paciente.php</code>.
                </p>
                <div class="grid grid-cols-2 gap-4">
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">URL WhatsApp Lab</label>
                        <input type="text" name="config_whatsapp_url"
                            value="{{ configs|selectattr('key', 'equalto', 'whatsapp_url')|map(attribute='value')|first|default('') }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 text-sm"
                            placeholder="Ej: https://lab.ximena.com.co">
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">API Key (X-Lab-Key)</label>
                        <input type="text" name="config_whatsapp_api_key"
                            value="{{ configs|selectattr('key', 'equalto', 'whatsapp_api_key')|map(attribute='value')|first|default('rips-lab-sync-2026') }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 text-sm"
                            placeholder="rips-lab-sync-2026">
                    </div>
                </div>
                <div>
                    <button type="button" onclick="testWhatsapp()"
                        class="px-4 py-2 bg-green-50 text-green-700 border border-green-200 rounded-lg hover:bg-green-100 text-sm font-medium">
                        <i class="fab fa-whatsapp mr-1"></i> Probar conexión
                    </button>
                    <span id="wa-status" class="text-sm ml-3"></span>
                </div>

                <button type="submit"
                    class="px-6 py-2.5 bg-blue-600 hover:bg-blue-700 text-white font-medium rounded-lg transition-colors">
                    <i class="fas fa-save mr-2"></i> Guardar Configuración
                </button>
            </form>
        </div>
    </div>
</div>

<script>
async function testTNS() {
    const form = document.querySelector('form');
    const status = document.getElementById('tns-status');
    status.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Probando...';

    const data = new FormData();
    data.append('empresa', form.querySelector('[name="config_tns_empresa"]').value);
    data.append('usuario', form.querySelector('[name="config_tns_usuario"]').value);
    data.append('password', form.querySelector('[name="config_tns_password"]').value);

    const resp = await fetch('/config/test-tns', { method: 'POST', body: data });
    const result = await resp.json();
    status.innerHTML = result.success
        ? '<span class="text-green-600"><i class="fas fa-check-circle"></i> ' + (result.message || 'Conexión exitosa') + '</span>'
        : '<span class="text-red-600"><i class="fas fa-times-circle"></i> ' + result.message + '</span>';
}

async function testFirebird() {
    const btn = event.target;
    const status = document.getElementById('fb-status');
    btn.disabled = true;
    status.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Probando...';

    const form = btn.closest('form');
    const data = new FormData();
    data.append('host', form.querySelector('[name="config_firebird_host"]').value);
    data.append('port', form.querySelector('[name="config_firebird_port"]').value);
    data.append('database', form.querySelector('[name="config_firebird_database"]').value);
    data.append('fb_user', form.querySelector('[name="config_firebird_user"]').value);
    data.append('fb_password', form.querySelector('[name="config_firebird_password"]').value);

    const resp = await fetch('/terceros/test-connection', {method:'POST', body: data});
    const result = await resp.json();
    btn.disabled = false;
    status.innerHTML = result.success
        ? '<span class="text-green-600"><i class="fas fa-check-circle"></i> Conexión exitosa</span>'
        : '<span class="text-red-600"><i class="fas fa-times-circle"></i> ' + result.message + '</span>';
}

async function testWhatsapp() {
    const form   = document.querySelector('form');
    const status = document.getElementById('wa-status');
    status.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Probando…';

    const url    = form.querySelector('[name="config_whatsapp_url"]').value.trim().replace(/\/$/, '');
    const apiKey = form.querySelector('[name="config_whatsapp_api_key"]').value.trim();

    if (!url) {
        status.innerHTML = '<span class="text-red-600">Ingresa la URL primero</span>';
        return;
    }

    try {
        const resp = await fetch(`${url}/api/lab/ingest_paciente.php`, {
            method: 'POST',
            headers: { 'Content-Type': 'application/json', 'X-Lab-Key': apiKey },
            body: JSON.stringify({}),
        });
        // 422 = llegó al endpoint pero sin datos = conexión OK
        status.innerHTML = (resp.status === 200 || resp.status === 422 || resp.status === 400)
            ? '<span class="text-green-600"><i class="fas fa-check-circle"></i> Endpoint alcanzable</span>'
            : `<span class="text-red-600"><i class="fas fa-times-circle"></i> HTTP ${resp.status}</span>`;
    } catch (e) {
        status.innerHTML = `<span class="text-red-600"><i class="fas fa-times-circle"></i> ${e.message}</span>`;
    }
}
</script>
{% endblock %}