@extends('layouts.app')

@section('title', 'Consulta NSU - ERP-PLUS')
@section('page_title', 'Consulta por NSU')
@section('page_subtitle', 'Sincronize documentos fiscais e mantenha o cursor NSU controlado por empresa.')
@section('page_actions')
    <a class="button" href="{{ route('home') }}">Voltar</a>
@endsection

@push('styles')
<style>
    .filter-bar { display: flex; flex-wrap: wrap; gap: 10px; padding: 14px 16px; background: var(--surface-2); border-bottom: 1px solid var(--border); align-items: flex-end; }
    .filter-field { display: grid; gap: 4px; }
    .filter-field label { font-size: 11px; font-weight: 700; text-transform: uppercase; color: var(--muted); }
    .filter-field input, .filter-field select { min-height: 34px; font-size: 13px; border: 1px solid var(--border); border-radius: 6px; padding: 6px 10px; background: #fff; color: var(--text); font-family: inherit; }
    .filter-field input { min-width: 200px; }
    .filter-field select { min-width: 140px; }
    .filter-field input[type="date"] { min-width: 140px; }
    .filter-actions { display: flex; gap: 8px; align-items: flex-end; margin-left: auto; }
    .key-cell { font-family: monospace; font-size: 12px; letter-spacing: .3px; white-space: nowrap; }
    .pagination-bar { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-top: 1px solid var(--border); }
    .pagination-bar .pages { font-size: 13px; color: var(--muted); margin: 0 auto; }
    .pill.warn { background: #fef3c7; color: var(--warn); }
    @media (max-width: 840px) {
        .filter-bar { gap: 8px; }
        .filter-field input { min-width: 140px; }
        .filter-actions { margin-left: 0; width: 100%; }
    }
</style>
@endpush

@section('content')
    {{-- Sync form: visivel para todos os operadores vinculados à empresa --}}
    @can('sync-documents')
    <div class="panel">
        <div class="panel-header">
            <div>
                <h2>Sincronizar empresa</h2>
                <span>A consulta usa o certificado A1 ativo da empresa selecionada.</span>
            </div>
        </div>

        @if ($companies->isEmpty())
            <div class="empty" style="padding:24px">
                Nenhuma empresa vinculada ao seu usuario.
                @can('manage-companies')
                    <a href="{{ route('companies.create') }}">Cadastrar empresa</a>
                @endcan
            </div>
        @else
            <form method="POST" action="{{ route('sync.run') }}">
                @csrf
                <div class="form-grid">
                    <div class="form-field full">
                        <label for="company_id">Empresa</label>
                        <select id="company_id" name="company_id" required>
                            <option value="">Selecione...</option>
                            @foreach ($companies as $company)
                                @php $cert = $company->certificates->firstWhere('is_active', true); @endphp
                                <option value="{{ $company->id }}" @selected(old('company_id') == $company->id)>
                                    {{ $company->name }} — {{ $company->cnpj }}
                                    @if ($company->nsuCursor)| ultNSU {{ $company->nsuCursor->ult_nsu }}@endif
                                    | cert. {{ $cert ? 'ativo' : 'pendente' }}
                                </option>
                            @endforeach
                        </select>
                        @error('company_id') <div class="error">{{ $message }}</div> @enderror
                    </div>
                </div>
                <div class="form-actions">
                    @can('manage-companies')
                        <a class="button" href="{{ route('companies.create') }}">Cadastrar empresa</a>
                    @endcan
                    <button class="button primary" type="submit">Sincronizar agora</button>
                </div>
            </form>
        @endif
    </div>
    @endcan

    {{-- Link to company NSU control --}}
    <div class="panel">
        <div class="panel-body" style="padding:16px;font-size:13px;color:var(--muted)">
            O cursor NSU de cada empresa e atualizado automaticamente apos cada consulta a SEFAZ.
            Acompanhe o status em <a href="{{ route('companies.index') }}">Empresas &rarr;</a>
        </div>
    </div>

    {{-- Documents grid --}}
    <div class="panel">
        <div class="panel-header">
            <div>
                <h2>Notas encontradas</h2>
                <span>
                    {{ $recentDocuments->total() }} nota(s)
                    @if ($hasFilters) com filtros aplicados @endif
                </span>
            </div>
            <div style="display:flex; gap:8px; font-size:13px; color:var(--muted); align-items:center;">
                <span>XML completo: <strong>{{ $fullDocumentsCount }}</strong></span>
                <span>Resumo: <strong>{{ $summaryDocumentsCount }}</strong></span>
            </div>
        </div>

        {{-- Filter bar --}}
        <form class="filter-bar" method="GET" action="{{ route('sync.index') }}">
            <div class="filter-field">
                <label>Empresa</label>
                <select name="company_id">
                    <option value="">Todas</option>
                    @foreach ($companies as $company)
                        <option value="{{ $company->id }}" @selected($companyFilter == $company->id)>{{ $company->name }}</option>
                    @endforeach
                </select>
            </div>

            <div class="filter-field">
                <label>Busca</label>
                <input type="search" name="q" value="{{ $search }}" placeholder="Chave, CNPJ ou fornecedor">
            </div>

            <div class="filter-field">
                <label>Emissao de</label>
                <input type="date" name="date_from" value="{{ $dateFrom }}">
            </div>

            <div class="filter-field">
                <label>ate</label>
                <input type="date" name="date_to" value="{{ $dateTo }}">
            </div>

            <div class="filter-field">
                <label>XML</label>
                <select name="xml">
                    <option value="all"     @selected($xmlFilter === 'all')>Todos</option>
                    <option value="full"    @selected($xmlFilter === 'full')>Completo</option>
                    <option value="summary" @selected($xmlFilter === 'summary')>Resumo</option>
                </select>
            </div>

            <div class="filter-field">
                <label>Ciencia</label>
                <select name="manifest">
                    <option value="all"          @selected($manifestFilter === 'all')>Todas</option>
                    <option value="pending"       @selected($manifestFilter === 'pending')>Pendente</option>
                    <option value="acknowledged"  @selected($manifestFilter === 'acknowledged')>Com ciencia</option>
                </select>
            </div>

            <div class="filter-actions">
                <button class="button primary" type="submit">Filtrar</button>
                @if ($hasFilters)
                    <a class="button" href="{{ route('sync.index') }}">Limpar</a>
                @endif
            </div>
        </form>

        <div class="table-wrap">
            <table>
                <thead>
                    <tr>
                        <th>Chave de acesso</th>
                        <th>Emissao</th>
                        <th>Fornecedor</th>
                        <th>Destinatario</th>
                        <th>Valor</th>
                        <th>XML</th>
                        <th>Ciencia</th>
                        <th>Acoes</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse ($recentDocuments as $document)
                        @php
                            $hasCiencia = $document->manifestations
                                ->where('event_code', \App\Models\NfeManifestation::EVENT_CIENCIA_OPERACAO)
                                ->whereIn('response_status_code', ['135', '136', '573'])
                                ->isNotEmpty();
                            $key = $document->access_key;
                            $keyShort = strlen($key) === 44
                                ? substr($key, 0, 10).'...'.substr($key, -10)
                                : $key;
                        @endphp
                        <tr>
                            <td>
                                <span class="key-cell" title="{{ $key }}">{{ $keyShort }}</span>
                                <div class="row-text">{{ $document->company->name }} &middot; NSU {{ $document->nsu ?? '-' }}</div>
                            </td>
                            <td style="white-space:nowrap">{{ $document->issued_at?->format('d/m/Y') ?? '-' }}</td>
                            <td>
                                <div>{{ Str::limit($document->issuer_name ?? '-', 30) }}</div>
                                @if ($document->issuer_cnpj)
                                    <div class="row-text">{{ $document->issuer_cnpj }}</div>
                                @endif
                            </td>
                            <td style="font-size:12px; color:var(--muted)">{{ $document->recipient_cnpj ?? '-' }}</td>
                            <td style="white-space:nowrap">
                                {{ $document->total_amount ? 'R$ '.number_format((float) $document->total_amount, 2, ',', '.') : '-' }}
                            </td>
                            <td>
                                @if ($document->xml_content)
                                    <span class="pill ok">Completo</span>
                                @elseif ($document->raw_summary_xml)
                                    <span class="pill warn">Resumo</span>
                                @else
                                    <span class="pill neutral">Sem XML</span>
                                @endif
                            </td>
                            <td>
                                @if ($hasCiencia)
                                    <span class="pill ok">Ciencia</span>
                                @else
                                    <span class="pill">Pendente</span>
                                @endif
                            </td>
                            <td>
                                <div class="inline-actions">
                                    @can('manifest-documents')
                                        @if (! $hasCiencia)
                                            <form class="inline-form" method="POST" action="{{ route('sync.documents.acknowledge', $document) }}">
                                                @csrf
                                                <button class="button primary" type="submit" style="min-height:32px;font-size:12px;padding:6px 10px">Dar ciencia</button>
                                            </form>
                                        @endif
                                    @endcan

                                    @if ($document->xml_content)
                                        <a class="button" style="min-height:32px;font-size:12px;padding:6px 10px" href="{{ route('sync.documents.xml.full', $document) }}">XML</a>
                                    @elseif ($hasCiencia)
                                        @can('sync-documents')
                                            <form class="inline-form" method="POST" action="{{ route('sync.documents.fetch_xml', $document) }}">
                                                @csrf
                                                <button class="button" style="min-height:32px;font-size:12px;padding:6px 10px" type="submit">Buscar XML</button>
                                            </form>
                                        @endcan
                                    @endif

                                    @if ($document->raw_summary_xml)
                                        <a class="button" style="min-height:32px;font-size:12px;padding:6px 10px" href="{{ route('sync.documents.xml.summary', $document) }}">Resumo</a>
                                    @endif
                                </div>
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="8">
                                <div class="empty">
                                    @if ($hasFilters)
                                        Nenhum documento encontrado com os filtros aplicados.
                                        <a href="{{ route('sync.index') }}">Limpar filtros</a>
                                    @else
                                        Nenhum documento sincronizado ainda.
                                    @endif
                                </div>
                            </td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>

        @if ($recentDocuments->hasPages())
            <div class="pagination-bar">
                @if ($recentDocuments->onFirstPage())
                    <span class="button" style="opacity:.4;cursor:default;min-height:32px;font-size:13px;padding:6px 12px">Anterior</span>
                @else
                    <a class="button" style="min-height:32px;font-size:13px;padding:6px 12px" href="{{ $recentDocuments->previousPageUrl() }}">Anterior</a>
                @endif

                <span class="pages">
                    Pagina {{ $recentDocuments->currentPage() }} de {{ $recentDocuments->lastPage() }}
                    &mdash; {{ $recentDocuments->total() }} registro(s)
                </span>

                @if ($recentDocuments->hasMorePages())
                    <a class="button" style="min-height:32px;font-size:13px;padding:6px 12px" href="{{ $recentDocuments->nextPageUrl() }}">Proxima</a>
                @else
                    <span class="button" style="opacity:.4;cursor:default;min-height:32px;font-size:13px;padding:6px 12px">Proxima</span>
                @endif
            </div>
        @endif
    </div>
@endsection