<x-layouts.app title="Monitor de XML" subtitle="Busca automática dos documentos destinados ao seu CNPJ">
    <x-slot:actions>
        <form method="POST" action="{{ route('painel.monitor.sincronizar') }}">
            @csrf
            <button class="btn-primary btn-sm">Sincronizar agora</button>
        </form>
    </x-slot:actions>

    <div class="grid gap-6 lg:grid-cols-3">
        {{-- Configuração --}}
        <div class="lg:col-span-2">
            <div class="card card-pad">
                <h2 class="text-sm font-semibold text-slate-900">Configuração</h2>

                <form method="POST" action="{{ route('painel.monitor.update') }}" class="mt-5 space-y-6">
                    @csrf @method('PUT')

                    <label class="flex cursor-pointer items-start gap-3">
                        <input type="checkbox" name="monitor_enabled" value="1" @checked($company->monitor_enabled)
                               class="mt-0.5 size-4 cursor-pointer rounded border-slate-300 text-brand-700 focus:ring-brand-500">
                        <span>
                            <span class="block text-sm font-medium text-slate-800">Monitor automático ativo</span>
                            <span class="block text-sm text-slate-500">O sistema consulta a SEFAZ periodicamente e arquiva os documentos novos.</span>
                        </span>
                    </label>

                    <label class="flex cursor-pointer items-start gap-3">
                        <input type="checkbox" name="manifestacao_automatica" value="1" @checked($company->manifestacao_automatica)
                               class="mt-0.5 size-4 cursor-pointer rounded border-slate-300 text-brand-700 focus:ring-brand-500">
                        <span>
                            <span class="block text-sm font-medium text-slate-800">Manifestar ciência automaticamente</span>
                            <span class="block text-sm text-slate-500">
                                Registra "Ciência da Operação" nas notas que vieram só como resumo, liberando o XML completo.
                                É um ato fiscal registrado na SEFAZ — ative apenas se a sua contabilidade concordar.
                            </span>
                        </span>
                    </label>

                    <div class="grid gap-5 sm:grid-cols-2">
                        <div>
                            <label for="monitor_intervalo_min" class="label">Intervalo entre consultas (minutos)</label>
                            <input id="monitor_intervalo_min" name="monitor_intervalo_min" type="number" min="60" max="1440"
                                   value="{{ old('monitor_intervalo_min', $company->monitor_intervalo_min) }}" class="input tabular">
                            <p class="mt-1.5 text-xs text-slate-500">Mínimo de 60 minutos: a SEFAZ bloqueia CNPJ que consulta em excesso.</p>
                        </div>

                        <div>
                            <label for="ambiente" class="label">Ambiente</label>
                            <select id="ambiente" name="ambiente" class="input">
                                <option value="1" @selected($company->ambiente === 1)>Produção</option>
                                <option value="2" @selected($company->ambiente === 2)>Homologação</option>
                            </select>
                        </div>
                    </div>

                    <button class="btn-primary">Salvar configurações</button>
                </form>
            </div>
        </div>

        {{-- Estado atual --}}
        <div class="space-y-6">
            <div class="card card-pad">
                <h2 class="text-sm font-semibold text-slate-900">Estado atual</h2>
                <dl class="mt-4 space-y-3 text-sm">
                    <div class="flex items-center justify-between gap-4">
                        <dt class="text-slate-500">Situação</dt>
                        <dd>
                            @if (! $company->hasCertificate())
                                <span class="badge bg-slate-100 text-slate-600">Sem certificado</span>
                            @elseif ($company->certificateExpired())
                                <span class="badge bg-rose-50 text-rose-700 ring-1 ring-rose-200">Certificado vencido</span>
                            @elseif ($company->monitor_enabled)
                                <span class="badge bg-emerald-50 text-emerald-700 ring-1 ring-emerald-200">Ativo</span>
                            @else
                                <span class="badge bg-slate-100 text-slate-600">Pausado</span>
                            @endif
                        </dd>
                    </div>
                    <div class="flex justify-between gap-4">
                        <dt class="text-slate-500">Última sincronização</dt>
                        <dd class="text-right font-medium text-slate-900">
                            {{ $company->last_sync_at?->format('d/m/Y H:i') ?: 'nunca' }}
                        </dd>
                    </div>
                    <div class="flex justify-between gap-4">
                        <dt class="text-slate-500">Cursor NSU</dt>
                        <dd class="tabular text-right font-medium text-slate-900">
                            {{ $company->ult_nsu }} / {{ $company->max_nsu }}
                        </dd>
                    </div>
                </dl>

                @if ($company->last_sync_message)
                    <p class="mt-4 rounded-lg bg-slate-50 px-3 py-2 text-xs text-slate-600">{{ $company->last_sync_message }}</p>
                @endif

                <form method="POST" action="{{ route('painel.monitor.enfileirar') }}" class="mt-4">
                    @csrf
                    <button class="btn-secondary btn-sm w-full">Enfileirar sincronização em segundo plano</button>
                </form>
            </div>

            <div class="card card-pad">
                <h2 class="text-sm font-semibold text-slate-900">Como o cursor funciona</h2>
                <p class="mt-3 text-sm text-slate-600">
                    A SEFAZ numera cada documento destinado ao seu CNPJ com um NSU sequencial.
                    O monitor guarda o último NSU lido e retoma dali na consulta seguinte, sem repetir downloads.
                    Quando os dois números se igualam, a fila está em dia.
                </p>
            </div>
        </div>
    </div>

    {{-- Documentos não reconhecidos --}}
    @if ($pendentes->isNotEmpty())
        <div class="card mt-6 overflow-hidden border-amber-300">
            <div class="border-b border-amber-200 bg-amber-50 px-5 py-4">
                <h2 class="text-sm font-semibold text-amber-900">
                    {{ $pendentes->count() }} documento(s) recebido(s) que o sistema não interpretou
                </h2>
                <p class="mt-1 text-sm text-amber-800">
                    O arquivo bruto foi arquivado. O cursor NSU não volta atrás, então guardamos tudo
                    que a SEFAZ entregou — normalmente são CT-e de frete ou modelos ainda não tratados aqui.
                    Envie esta lista ao suporte se algum deles for uma nota de compra.
                </p>
            </div>

            <div class="overflow-x-auto">
                <table class="min-w-full divide-y divide-slate-200">
                    <thead class="bg-slate-50">
                        <tr>
                            <th class="th">NSU</th>
                            <th class="th">Tipo do documento</th>
                            <th class="th">Chave detectada</th>
                            <th class="th">Motivo</th>
                            <th class="th">Recebido em</th>
                        </tr>
                    </thead>
                    <tbody class="divide-y divide-slate-100 bg-white">
                        @foreach ($pendentes as $pendente)
                            <tr>
                                <td class="td tabular">{{ $pendente->nsu }}</td>
                                <td class="td">{{ $pendente->raiz ?: $pendente->schema_dfe ?: '—' }}</td>
                                <td class="td tabular text-xs break-all">{{ $pendente->chave ?: '—' }}</td>
                                <td class="td text-slate-500">{{ $pendente->motivo }}</td>
                                <td class="td tabular whitespace-nowrap">{{ $pendente->created_at->format('d/m/Y H:i') }}</td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    @endif

    {{-- Histórico --}}
    <div class="card mt-6 overflow-hidden">
        <div class="border-b border-slate-100 px-5 py-4">
            <h2 class="text-sm font-semibold text-slate-900">Histórico de sincronizações</h2>
        </div>

        <div class="overflow-x-auto">
            <table class="min-w-full divide-y divide-slate-200">
                <thead class="bg-slate-50">
                    <tr>
                        <th class="th">Quando</th>
                        <th class="th">Origem</th>
                        <th class="th">Resultado</th>
                        <th class="th text-right">Notas</th>
                        <th class="th text-right">Eventos</th>
                        <th class="th text-right">NSU</th>
                        <th class="th">Mensagem</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-slate-100 bg-white">
                    @forelse ($logs as $log)
                        <tr>
                            <td class="td tabular whitespace-nowrap">{{ $log->created_at->format('d/m/Y H:i') }}</td>
                            <td class="td capitalize">{{ $log->origem }}</td>
                            <td class="td">
                                <span class="badge {{ match ($log->status) {
                                    'success' => 'bg-emerald-50 text-emerald-700 ring-1 ring-emerald-200',
                                    'error' => 'bg-rose-50 text-rose-700 ring-1 ring-rose-200',
                                    default => 'bg-slate-100 text-slate-600',
                                } }}">{{ $log->statusLabel() }}</span>
                            </td>
                            <td class="td tabular text-right">{{ $log->docs_novos }}</td>
                            <td class="td tabular text-right">{{ $log->eventos_novos }}</td>
                            <td class="td tabular text-right">{{ $log->nsu_final }}</td>
                            <td class="td max-w-sm truncate text-slate-500">{{ $log->mensagem }}</td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="7" class="px-4 py-12 text-center text-sm text-slate-500">
                                O monitor ainda não executou nenhuma sincronização.
                            </td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>

        @if ($logs->hasPages())
            <div class="border-t border-slate-100 px-4 py-3">{{ $logs->links() }}</div>
        @endif
    </div>
</x-layouts.app>
