@extends('layouts.admin')

@section('title', 'Import Batch #' . $batch->id)
@section('header_title', 'Import Batch Reconciliation #' . $batch->id)

@section('header_badge')
    <span class="text-xs font-semibold px-2.5 py-1 rounded-full bg-emerald-50 text-emerald-700 border border-emerald-200">
        Status: {{ ucfirst($batch->status) }}
    </span>
@endsection

@section('content')
<div class="space-y-6">

    <!-- Batch Summary Cards -->
    <div class="grid grid-cols-2 sm:grid-cols-5 gap-4">
        <div class="bg-white p-4 rounded-xl border border-slate-200 text-center">
            <span class="text-xs text-slate-500 font-medium">Total Rows</span>
            <p class="text-2xl font-bold text-slate-800 mt-1">{{ $batch->total_rows }}</p>
        </div>
        <div class="bg-white p-4 rounded-xl border border-emerald-200 text-center bg-emerald-50/20">
            <span class="text-xs text-emerald-700 font-medium">Created (New)</span>
            <p class="text-2xl font-bold text-emerald-700 mt-1">{{ $batch->successful_rows }}</p>
        </div>
        <div class="bg-white p-4 rounded-xl border border-blue-200 text-center bg-blue-50/20">
            <span class="text-xs text-blue-700 font-medium">Updated Existing</span>
            <p class="text-2xl font-bold text-blue-700 mt-1">{{ $batch->updated_rows }}</p>
        </div>
        <div class="bg-white p-4 rounded-xl border border-amber-200 text-center bg-amber-50/20">
            <span class="text-xs text-amber-700 font-medium">Skipped Rows</span>
            <p class="text-2xl font-bold text-amber-700 mt-1">{{ $batch->skipped_rows }}</p>
        </div>
        <div class="bg-white p-4 rounded-xl border border-rose-200 text-center bg-rose-50/20">
            <span class="text-xs text-rose-700 font-medium">Failed</span>
            <p class="text-2xl font-bold text-rose-700 mt-1">{{ $batch->failed_rows }}</p>
        </div>
    </div>

    <!-- Details Box -->
    <div class="bg-white p-5 rounded-2xl border border-slate-200/80 shadow-sm flex items-center justify-between text-xs">
        <div>
            <p class="font-bold text-slate-800">Source: {{ $batch->original_filename }}</p>
            <p class="text-slate-500 mt-0.5">Imported by {{ $batch->importedBy?->name ?? 'System' }} on {{ $batch->created_at->format('M d, Y H:i:s') }}</p>
        </div>
        <div class="flex items-center gap-2.5">
            <a href="{{ route('admin.members.index') }}" class="px-4 py-2 rounded-xl text-xs font-semibold bg-teal-600 hover:bg-teal-700 text-white transition shadow-sm">
                View Member Directory →
            </a>
        </div>
    </div>

    <!-- Row Level Audit Table -->
    <div class="bg-white rounded-2xl border border-slate-200/80 shadow-sm overflow-hidden">
        <div class="p-4 border-b border-slate-200 bg-slate-50/50 text-xs font-bold text-slate-700 uppercase tracking-wider">
            Row-Level Ingestion Audit
        </div>

        <div class="overflow-x-auto">
            <table class="w-full text-left border-collapse text-xs">
                <thead>
                    <tr class="bg-slate-50 text-[11px] font-semibold text-slate-500 uppercase tracking-wider border-b border-slate-200">
                        <th class="py-3 px-4">Row #</th>
                        <th class="py-3 px-4">Member Name</th>
                        <th class="py-3 px-4">Generated Member Code</th>
                        <th class="py-3 px-4">Status</th>
                        <th class="py-3 px-4">Message / Notes</th>
                        <th class="py-3 px-4 text-right">Profile</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-slate-100">
                    @forelse($batch->rows as $r)
                        <tr class="hover:bg-slate-50/80">
                            <td class="py-3 px-4 font-mono font-bold text-slate-600">#{{ $r->row_number }}</td>
                            <td class="py-3 px-4 font-bold text-slate-800">{{ $r->raw_data['full_name'] ?? '—' }}</td>
                            <td class="py-3 px-4 font-mono font-semibold text-navy-800">{{ $r->member?->member_code ?? '—' }}</td>
                            <td class="py-3 px-4">
                                @if($r->status === 'success')
                                    <span class="px-2 py-0.5 rounded-full text-[10px] font-semibold bg-emerald-100 text-emerald-800">Success</span>
                                @elseif($r->status === 'warning')
                                    <span class="px-2 py-0.5 rounded-full text-[10px] font-semibold bg-blue-100 text-blue-800">Updated</span>
                                @else
                                    <span class="px-2 py-0.5 rounded-full text-[10px] font-semibold bg-amber-100 text-amber-800">Skipped</span>
                                @endif
                            </td>
                            <td class="py-3 px-4 text-slate-600 max-w-xs">{{ $r->error_message ?? 'Ingested successfully' }}</td>
                            <td class="py-3 px-4 text-right">
                                @if($r->member)
                                    <a href="{{ route('admin.members.show', $r->member) }}" class="text-teal-600 hover:text-teal-800 font-bold">
                                        View →
                                    </a>
                                @else
                                    —
                                @endif
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="6" class="py-6 text-center text-slate-400">No individual row logs available.</td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>

</div>
@endsection