@extends('layouts.app')

@section('title', 'Importação XLSX')

@section('content')
<div class="page-header">
    <div>
        <h1>{{ $dataImport->original_name }}</h1>
        <p class="muted">{{ $dataImport->sheet_name ?: 'Sem folha' }} · cabeçalho na linha {{ $dataImport->header_row }} · identificador {{ $dataImport->identifier_field }}</p>
    </div>
    <div class="actions">
        <a class="btn btn-secondary" href="{{ route('imports.source', $dataImport) }}">Descarregar original</a>
        @if(!in_array($dataImport->status,['queued','validating','processing','retrying','cancel_requested'],true))
            <a class="btn btn-secondary" href="{{ route('imports.mapping', $dataImport) }}">Rever mapeamento</a>
        @endif
        <a class="btn btn-secondary" href="{{ route('imports.index') }}">Voltar</a>
    </div>
</div>

<div class="grid grid-4" style="margin-bottom:18px">
    <div class="card"><div class="metric-label">Estado</div><div style="margin-top:10px"><span id="import-status" class="badge {{ $dataImport->status === 'completed' ? 'badge-success' : (in_array($dataImport->status,['failed','cancelled'],true) ? 'badge-danger' : ($dataImport->status === 'completed_with_errors' ? 'badge-warning' : '')) }}">{{ $dataImport->status }}</span></div></div>
    <div class="card"><div class="metric-label">Processadas</div><div id="processed-metric" class="metric">{{ $dataImport->processed_rows }} / {{ $dataImport->total_rows }}</div></div>
    <div class="card"><div class="metric-label">Criadas / atualizadas</div><div id="success-metric" class="metric">{{ $dataImport->created_rows }} / {{ $dataImport->updated_rows }}</div></div>
    <div class="card"><div class="metric-label">Inválidas / falhadas</div><div id="error-metric" class="metric">{{ $dataImport->invalid_rows }} / {{ $dataImport->failed_rows }}</div></div>
</div>

<div class="card" style="margin-bottom:18px">
    <div class="actions" style="justify-content:space-between">
        <strong>Progresso <span id="progress-label">{{ $dataImport->progressPercent() }}%</span></strong>
        <span class="muted">{{ $dataImport->dry_run ? 'Validação sem gravação' : ucfirst($dataImport->operation) }}</span>
    </div>
    <div class="progress" style="margin-top:12px"><span id="progress-bar" style="width:{{ $dataImport->progressPercent() }}%"></span></div>
    @if($dataImport->error_message)
        <div id="general-error" class="alert alert-error" style="margin-top:15px">{{ $dataImport->error_message }}</div>
    @else
        <div id="general-error" class="alert alert-error" style="display:none;margin-top:15px"></div>
    @endif
    <div class="actions" style="margin-top:16px">
        @if(in_array($dataImport->status,['queued','validating','processing','retrying'],true))
            <form method="post" action="{{ route('imports.cancel', $dataImport) }}">@csrf<button class="btn btn-danger" type="submit">Cancelar</button></form>
        @endif
        @if($dataImport->isFinished())
            <a class="btn btn-primary" href="{{ route('imports.report', $dataImport) }}">Descarregar relatório XLSX</a>
        @endif
        @if(in_array($dataImport->status,['failed','cancelled','completed_with_errors'],true))
            <form method="post" action="{{ route('imports.retry', $dataImport) }}" onsubmit="return confirm('Reprocessar todas as linhas com a configuração atual?')">@csrf<button class="btn btn-secondary" type="submit">Repetir execução</button></form>
        @endif
    </div>
</div>

<div class="card" style="margin-bottom:18px">
    <div class="grid grid-3">
        <div><div class="metric-label">Válidas</div><div class="metric">{{ $dataImport->valid_rows }}</div></div>
        <div><div class="metric-label">Ignoradas</div><div class="metric">{{ $dataImport->skipped_rows }}</div></div>
        <div><div class="metric-label">Template</div><div style="margin-top:10px"><strong>{{ $dataImport->template?->name ?: 'Configuração própria' }}</strong></div></div>
    </div>
</div>

<div class="page-header">
    <div><h2>Resultado por linha</h2><p class="muted">Erros, avisos, ação realizada e registo associado.</p></div>
    <form method="get" class="actions">
        <select name="row_status">
            <option value="">Todos os estados</option>
            @foreach(['valid','created','updated','skipped','invalid','failed'] as $option)<option value="{{ $option }}" @selected($rowStatus === $option)>{{ $option }}</option>@endforeach
        </select>
        <button class="btn btn-secondary btn-sm" type="submit">Filtrar</button>
    </form>
</div>
<div class="table-wrap">
    <table>
        <thead><tr><th>Linha</th><th>Estado</th><th>Identificador</th><th>Registo</th><th>Ocorrências</th><th>Dados mapeados</th></tr></thead>
        <tbody>
        @forelse($rows as $row)
            <tr>
                <td>{{ $row->row_number }}</td>
                <td><span class="badge {{ in_array($row->status,['created','updated','valid'],true) ? 'badge-success' : (in_array($row->status,['invalid','failed'],true) ? 'badge-danger' : 'badge-warning') }}">{{ $row->status }}</span></td>
                <td>{{ $row->row_key ?: '—' }}</td>
                <td>{{ $row->record_id ?: '—' }}</td>
                <td>
                    @foreach($row->errors ?? [] as $error)<div style="color:var(--danger)">• {{ $error }}</div>@endforeach
                    @foreach($row->warnings ?? [] as $warning)<div style="color:var(--warning)">• {{ $warning }}</div>@endforeach
                    @if(empty($row->errors) && empty($row->warnings))<span class="muted">Sem ocorrências</span>@endif
                </td>
                <td><details><summary>Ver campos</summary><pre class="details-json">{{ json_encode($row->mapped_data, JSON_PRETTY_PRINT|JSON_UNESCAPED_UNICODE|JSON_UNESCAPED_SLASHES) }}</pre></details></td>
            </tr>
        @empty
            <tr><td colspan="6" class="muted">Ainda não existem resultados para apresentar.</td></tr>
        @endforelse
        </tbody>
    </table>
</div>
{{ $rows->links() }}

@if($dataImport->isFinished())
<div class="card" style="margin-top:28px">
    <h3>Remover esta execução</h3>
    <p class="muted">Remove o XLSX privado, o mapeamento e o relatório linha a linha. Os dossiês já criados ou atualizados não são revertidos.</p>
    <form method="post" action="{{ route('imports.destroy', $dataImport) }}" onsubmit="return confirm('Eliminar definitivamente esta importação e o ficheiro original?')">
        @csrf @method('delete')
        <button class="btn btn-danger" type="submit">Eliminar importação</button>
    </form>
</div>
@endif
@endsection

@if(!$dataImport->isFinished())
@push('scripts')
<script>
(() => {
    const url = @json(route('imports.status', $dataImport));
    const poll = async () => {
        try {
            const response = await fetch(url, {headers:{'Accept':'application/json'}, cache:'no-store'});
            if (!response.ok) return;
            const data = await response.json();
            document.getElementById('import-status').textContent = data.status;
            document.getElementById('processed-metric').textContent = `${data.processed_rows} / ${data.total_rows}`;
            document.getElementById('success-metric').textContent = `${data.created_rows} / ${data.updated_rows}`;
            document.getElementById('error-metric').textContent = `${data.invalid_rows} / ${data.failed_rows}`;
            document.getElementById('progress-label').textContent = `${data.progress}%`;
            document.getElementById('progress-bar').style.width = `${data.progress}%`;
            if (data.error) {
                const box = document.getElementById('general-error'); box.textContent = data.error; box.style.display = 'block';
            }
            if (data.finished) { window.location.reload(); return; }
        } catch (_) {}
        window.setTimeout(poll, 2500);
    };
    window.setTimeout(poll, 1200);
})();
</script>
@endpush
@endif