<?php defined('BASEPATH') OR exit('No direct script access allowed'); ?>
<style>
.diag-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}
.diag-kpi{background:#fff;border:1px solid #e2e6ea;border-radius:10px;padding:16px;text-align:center;border-top:4px solid #1e3a5f}
.diag-kpi.g{border-top-color:#2e7d32}.diag-kpi.r{border-top-color:#c0392b}.diag-kpi.o{border-top-color:#d35400}
.diag-kpi .num{font-size:28px;font-weight:700;color:#1e3a5f}
.diag-kpi.g .num{color:#2e7d32}.diag-kpi.r .num{color:#c0392b}
.diag-kpi .lbl{font-size:11px;color:#888;text-transform:uppercase;letter-spacing:.5px;margin-top:4px}

.api-status-card{background:#fff;border:1px solid #e2e6ea;border-radius:10px;padding:14px 16px;margin-bottom:10px;display:flex;align-items:center;gap:14px;transition:all .2s}
.api-status-card.status-ok{border-left:4px solid #2e7d32}
.api-status-card.status-fail{border-left:4px solid #c0392b;background:#fffaf9}
.api-status-card.status-pending{border-left:4px solid #ddd;opacity:.6}

.status-icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
.status-icon.ok{background:#e8f5e9;color:#2e7d32}
.status-icon.fail{background:#ffebee;color:#c0392b}
.status-icon.pending{background:#f5f5f5;color:#aaa}

.api-status-info{flex:1;min-width:0}
.api-status-info h4{font-size:13.5px;font-weight:700;color:#222;margin:0 0 2px;display:flex;align-items:center;gap:8px}
.api-status-info .sub{font-size:12px;color:#888}
.api-status-info .motivo{font-size:12px;color:#c0392b;margin-top:3px}
.api-status-info .amostra{font-size:12px;color:#2e7d32;margin-top:3px}

.cat-tag{font-size:9.5px;font-weight:700;padding:2px 7px;border-radius:4px;text-transform:uppercase}
.cat-cnpj{background:#e3f2fd;color:#1565c0}
.cat-judicial{background:#fce4ec;color:#880e4f}
.cat-apoio{background:#f3e5f5;color:#6a1b9a}
.cat-token{background:#fff3e0;color:#e65100}

.tempo-badge{font-size:11px;font-weight:700;padding:3px 10px;border-radius:20px;flex-shrink:0}
.tempo-rapido{background:#e8f5e9;color:#2e7d32}
.tempo-medio{background:#fff3e0;color:#e65100}
.tempo-lento{background:#ffebee;color:#c0392b}

#btn-testar-todas{position:relative}
.spinner-inline{display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;margin-right:6px}
@keyframes spin{to{transform:rotate(360deg)}}
</style>

<section class="content-header">
    <h1><i class="fa fa-heartbeat"></i> Diagnóstico de Saúde das APIs</h1>
    <ol class="breadcrumb">
        <li><a href="<?php echo site_url('admin') ?>"><i class="fa fa-dashboard"></i> Dashboard</a></li>
        <li><a href="<?php echo site_url('admin/patrimonio') ?>">Busca Patrimonial</a></li>
        <li class="active">Diagnóstico de APIs</li>
    </ol>
</section>

<section class="content">

<div class="box box-default" style="margin-bottom:14px">
    <div class="box-body" style="padding:14px;display:flex;align-items:center;gap:12px;flex-wrap:wrap">
        <button id="btn-testar-todas" class="btn btn-primary">
            <i class="fa fa-play"></i> Testar Todas as APIs Agora
        </button>
        <a href="<?php echo site_url('admin/patrimonio/diagnostico_historico') ?>" class="btn btn-default">
            <i class="fa fa-history"></i> Ver Histórico
        </a>
        <span id="ultimo-teste" style="font-size:12px;color:#888;margin-left:auto"></span>
    </div>
</div>

<!-- Resumo -->
<div class="diag-summary" id="diag-summary" style="display:none">
    <div class="diag-kpi g"><div class="num" id="kpi-ok">0</div><div class="lbl">APIs Funcionando</div></div>
    <div class="diag-kpi r"><div class="num" id="kpi-falha">0</div><div class="lbl">APIs com Falha</div></div>
    <div class="diag-kpi"><div class="num" id="kpi-tempo">0ms</div><div class="lbl">Tempo Médio de Resposta</div></div>
    <div class="diag-kpi o"><div class="num" id="kpi-pct">0%</div><div class="lbl">Saúde Geral do Arsenal</div></div>
</div>

<!-- Loading -->
<div id="diag-loading" style="display:none;text-align:center;padding:30px">
    <i class="fa fa-spin fa-spinner" style="font-size:32px;color:#1e3a5f"></i>
    <p style="margin-top:12px;color:#888">Testando cada API com uma consulta real (CNPJ Banco do Brasil, CEP estável, etc.)...</p>
</div>

<!-- Lista de status -->
<div id="diag-lista"></div>

<div class="box box-default" style="margin-top:16px">
    <div class="box-body" style="padding:14px;font-size:12px;color:#888">
        <i class="fa fa-info-circle"></i> <strong>Como funciona este diagnóstico:</strong> cada API é testada com uma consulta real
        (não apenas "ping"). Por exemplo, o teste do CNPJá consulta o CNPJ do Banco do Brasil (00.000.000/0001-91),
        um CNPJ público e estável, e verifica se a razão social retornada é válida — não só se o servidor respondeu HTTP 200.
        Isso detecta problemas reais como: API fora do ar, formato de resposta mudou, limite de requisições atingido,
        ou token/chave expirado.
    </div>
</div>

</section>

<script>
var CATEGORIAS = {
    cnpj: {label: 'CNPJ', cls: 'cat-cnpj'},
    judicial: {label: 'Judicial', cls: 'cat-judicial'},
    apoio: {label: 'Apoio', cls: 'cat-apoio'},
    token: {label: 'Token', cls: 'cat-token'}
};

function testarTodas() {
    var btn = document.getElementById('btn-testar-todas');
    btn.disabled = true;
    btn.innerHTML = '<span class="spinner-inline"></span> Testando...';
    document.getElementById('diag-loading').style.display = 'block';
    document.getElementById('diag-summary').style.display = 'none';
    document.getElementById('diag-lista').innerHTML = '';

    fetch('<?php echo site_url("admin/patrimonio/api_diagnostico") ?>', {
        method: 'POST',
        headers: {'X-Requested-With': 'XMLHttpRequest'}
    })
    .then(function(r){ return r.json(); })
    .then(function(data){
        document.getElementById('diag-loading').style.display = 'none';
        btn.disabled = false;
        btn.innerHTML = '<i class="fa fa-play"></i> Testar Todas as APIs Agora';
        renderResultados(data.resultados, data.resumo);
        document.getElementById('ultimo-teste').textContent = 'Último teste: ' + new Date().toLocaleString('pt-BR');
    })
    .catch(function(err){
        document.getElementById('diag-loading').style.display = 'none';
        btn.disabled = false;
        btn.innerHTML = '<i class="fa fa-play"></i> Testar Todas as APIs Agora';
        alert('Erro ao executar diagnóstico: ' + err);
    });
}

function renderResultados(resultados, resumo) {
    document.getElementById('diag-summary').style.display = 'grid';
    document.getElementById('kpi-ok').textContent = resumo.ok;
    document.getElementById('kpi-falha').textContent = resumo.falha;

    var tempoMedio = Math.round(resultados.reduce(function(s,r){return s+r.tempo_ms;},0) / resultados.length);
    document.getElementById('kpi-tempo').textContent = tempoMedio + 'ms';

    var pct = Math.round((resumo.ok / resumo.total) * 100);
    document.getElementById('kpi-pct').textContent = pct + '%';
    document.getElementById('kpi-pct').style.color = pct >= 80 ? '#2e7d32' : pct >= 50 ? '#d35400' : '#c0392b';

    var html = '';
    resultados.forEach(function(r){
        var cat = CATEGORIAS[r.categoria] || {label: r.categoria, cls: ''};
        var tempoClass = r.tempo_ms < 800 ? 'tempo-rapido' : r.tempo_ms < 2500 ? 'tempo-medio' : 'tempo-lento';

        html += '<div class="api-status-card status-' + (r.ok ? 'ok' : 'fail') + '">';
        html += '<div class="status-icon ' + (r.ok ? 'ok' : 'fail') + '">' + (r.ok ? '✓' : '✕') + '</div>';
        html += '<div class="api-status-info">';
        html += '<h4>' + r.nome + ' <span class="cat-tag ' + cat.cls + '">' + cat.label + '</span></h4>';
        if (r.ok) {
            html += '<div class="amostra"><i class="fa fa-check-circle"></i> ' + (r.amostra || 'Funcionando corretamente') + '</div>';
        } else {
            html += '<div class="motivo"><i class="fa fa-exclamation-triangle"></i> ' + (r.motivo || 'Falha desconhecida') + '</div>';
        }
        html += '</div>';
        html += '<span class="tempo-badge ' + tempoClass + '">' + r.tempo_ms + 'ms</span>';
        html += '</div>';
    });
    document.getElementById('diag-lista').innerHTML = html;
}

document.getElementById('btn-testar-todas').addEventListener('click', testarTodas);

// Executa automaticamente ao abrir a tela
testarTodas();
</script>
