@extends('layouts.app')
@section('title', 'Archived Records')
@section('content')

<div class="mb-4 flex items-start justify-between">
    <div>
        <h1 class="text-lg font-bold text-gray-900">Archived Records</h1>
        <p class="text-xs text-gray-400">
            Recover or permanently delete archived ANC registrations, maternity admissions, and cancelled ANC visits.
            Permanent deletion requires your password and is logged.
        </p>
    </div>
    <a href="{{ route('admin.audit') }}" class="btn-secondary text-xs">View Audit Log →</a>
</div>

{{-- Flash messages --}}
@if(session('success'))
<div class="mb-3 bg-green-50 border border-green-200 text-green-700 rounded-lg px-4 py-2 text-xs">{{ session('success') }}</div>
@endif
@if(session('error'))
<div class="mb-3 bg-red-50 border border-red-200 text-red-700 rounded-lg px-4 py-2 text-xs">{{ session('error') }}</div>
@endif
@if(session('warning'))
<div class="mb-3 bg-amber-50 border border-amber-200 text-amber-700 rounded-lg px-4 py-2 text-xs">{{ session('warning') }}</div>
@endif

{{-- Filters --}}
<div class="bg-white rounded-xl border shadow-sm mb-4">
    <div class="px-5 py-3 border-b bg-gray-50/50">
        <form method="GET" class="flex flex-wrap gap-2 items-end">
            <div>
                <label class="block text-[11px] text-gray-500 mb-1">Type</label>
                <select name="type" class="form-input text-xs w-44">
                    <option value="all"       {{ $type === 'all' ? 'selected' : '' }}>All archived ({{ $totals['anc'] + $totals['maternity'] + $totals['visit'] }})</option>
                    <option value="anc"       {{ $type === 'anc' ? 'selected' : '' }}>ANC Registrations ({{ $totals['anc'] }})</option>
                    <option value="maternity" {{ $type === 'maternity' ? 'selected' : '' }}>Maternity Admissions ({{ $totals['maternity'] }})</option>
                    <option value="visit"     {{ $type === 'visit' ? 'selected' : '' }}>Cancelled ANC Visits ({{ $totals['visit'] }})</option>
                </select>
            </div>
            <div>
                <label class="block text-[11px] text-gray-500 mb-1">Search</label>
                <input type="text" name="search" value="{{ $search }}" placeholder="MRN, name, ANC#…" class="form-input text-xs w-56">
            </div>
            <button class="btn-primary text-xs">Filter</button>
            @if(request()->hasAny(['type','search']) && (request('type') !== 'all' || $search !== ''))
                <a href="{{ route('admin.archived.index') }}" class="btn-secondary text-xs">Clear</a>
            @endif
        </form>
    </div>
</div>

{{-- ── Archived ANC Registrations ─────────────────────────────────── --}}
@if($archivedAnc->count() > 0)
<div class="bg-white rounded-xl border shadow-sm mb-6">
    <div class="px-5 py-3 border-b bg-gray-50/50 flex items-center justify-between">
        <h2 class="text-sm font-semibold text-gray-900">Archived ANC Registrations ({{ $archivedAnc->count() }})</h2>
        <span class="text-[11px] text-gray-400">Soft-deleted — recoverable</span>
    </div>
    <div class="overflow-x-auto">
        <table class="w-full">
            <thead><tr class="bg-gray-50">
                <th class="table-header">ANC #</th>
                <th class="table-header">Patient</th>
                <th class="table-header">EDD</th>
                <th class="table-header">Status</th>
                <th class="table-header">Archived</th>
                <th class="table-header text-right">Actions</th>
            </tr></thead>
            <tbody>
                @foreach($archivedAnc as $r)
                <tr class="border-b border-gray-50">
                    <td class="table-cell text-xs font-mono">{{ $r->anc_number }}</td>
                    <td class="table-cell text-xs">
                        @if($r->patient)
                            <div class="font-medium">{{ $r->patient->full_name }}</div>
                            <div class="text-gray-400">MRN {{ $r->patient->mrn }}</div>
                        @else
                            <span class="text-gray-400">— patient missing —</span>
                        @endif
                    </td>
                    <td class="table-cell text-xs">{{ optional($r->edd)->format('d M Y') ?? '—' }}</td>
                    <td class="table-cell text-xs"><span class="badge badge-warning">{{ $r->status ?? 'archived' }}</span></td>
                    <td class="table-cell text-xs text-gray-400">{{ optional($r->deleted_at)->format('d M Y H:i') }}</td>
                    <td class="table-cell text-xs text-right whitespace-nowrap">
                        <form method="POST" action="{{ route('admin.archived.anc.restore', $r->id) }}" class="inline">
                            @csrf
                            <button class="text-xs px-3 py-1 rounded-md bg-emerald-50 text-emerald-700 border border-emerald-200 hover:bg-emerald-100">Restore</button>
                        </form>
                        <button onclick="openPurgeAnc({{ $r->id }}, '{{ addslashes($r->anc_number) }}', '{{ addslashes(optional($r->patient)->full_name ?? 'unknown') }}')"
                                class="text-xs px-3 py-1 rounded-md bg-red-50 text-red-700 border border-red-200 hover:bg-red-100 ml-1">
                            Permanently delete
                        </button>
                    </td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>
@endif

{{-- ── Archived Maternity Admissions ────────────────────────────── --}}
@if($archivedMaternity->count() > 0)
<div class="bg-white rounded-xl border shadow-sm mb-6">
    <div class="px-5 py-3 border-b bg-gray-50/50 flex items-center justify-between">
        <h2 class="text-sm font-semibold text-gray-900">Archived Maternity Admissions ({{ $archivedMaternity->count() }})</h2>
        <span class="text-[11px] text-gray-400">Soft-deleted — recoverable</span>
    </div>
    <div class="overflow-x-auto">
        <table class="w-full">
            <thead><tr class="bg-gray-50">
                <th class="table-header">Patient</th>
                <th class="table-header">Admitted</th>
                <th class="table-header">Reason</th>
                <th class="table-header">Status</th>
                <th class="table-header">Provider</th>
                <th class="table-header">Archived</th>
                <th class="table-header text-right">Actions</th>
            </tr></thead>
            <tbody>
                @foreach($archivedMaternity as $a)
                <tr class="border-b border-gray-50">
                    <td class="table-cell text-xs">
                        @if($a->patient)
                            <div class="font-medium">{{ $a->patient->full_name }}</div>
                            <div class="text-gray-400">MRN {{ $a->patient->mrn }}</div>
                        @else
                            <span class="text-gray-400">— patient missing —</span>
                        @endif
                    </td>
                    <td class="table-cell text-xs">{{ optional($a->admission_date)->format('d M Y H:i') }}</td>
                    <td class="table-cell text-xs text-gray-500">{{ \Illuminate\Support\Str::limit($a->reason_for_admission, 40) }}</td>
                    <td class="table-cell text-xs"><span class="badge badge-warning">{{ $a->status }}</span></td>
                    <td class="table-cell text-xs">{{ optional($a->attendingProvider)->name ?? '—' }}</td>
                    <td class="table-cell text-xs text-gray-400">{{ optional($a->deleted_at)->format('d M Y H:i') }}</td>
                    <td class="table-cell text-xs text-right whitespace-nowrap">
                        <form method="POST" action="{{ route('admin.archived.maternity.restore', $a->id) }}" class="inline">
                            @csrf
                            <button class="text-xs px-3 py-1 rounded-md bg-emerald-50 text-emerald-700 border border-emerald-200 hover:bg-emerald-100">Restore</button>
                        </form>
                        <button onclick="openPurgeMat({{ $a->id }}, '{{ addslashes(optional($a->patient)->full_name ?? 'unknown') }}', '{{ addslashes(optional($a->admission_date)->format('d M Y') ?? '') }}')"
                                class="text-xs px-3 py-1 rounded-md bg-red-50 text-red-700 border border-red-200 hover:bg-red-100 ml-1">
                            Permanently delete
                        </button>
                    </td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>
@endif

{{-- ── Archived ANC Visits ───────────────────────────────────────── --}}
@if($archivedVisits->count() > 0)
<div class="bg-white rounded-xl border shadow-sm mb-6">
    <div class="px-5 py-3 border-b bg-gray-50/50 flex items-center justify-between">
        <h2 class="text-sm font-semibold text-gray-900">Cancelled ANC Visits ({{ $archivedVisits->count() }})</h2>
        <span class="text-[11px] text-gray-400">Soft-deleted — recoverable</span>
    </div>
    <div class="overflow-x-auto">
        <table class="w-full">
            <thead><tr class="bg-gray-50">
                <th class="table-header">Visit #</th>
                <th class="table-header">Patient</th>
                <th class="table-header">Check-in</th>
                <th class="table-header">Status</th>
                <th class="table-header">Archived</th>
                <th class="table-header text-right">Actions</th>
            </tr></thead>
            <tbody>
                @foreach($archivedVisits as $v)
                <tr class="border-b border-gray-50">
                    <td class="table-cell text-xs font-mono">{{ $v->visit_number }}</td>
                    <td class="table-cell text-xs">
                        @if($v->patient)
                            <div class="font-medium">{{ $v->patient->full_name }}</div>
                            <div class="text-gray-400">MRN {{ $v->patient->mrn }}</div>
                        @else
                            <span class="text-gray-400">— patient missing —</span>
                        @endif
                    </td>
                    <td class="table-cell text-xs">{{ optional($v->check_in_at)->format('d M Y H:i') }}</td>
                    <td class="table-cell text-xs"><span class="badge badge-warning">{{ $v->status }}</span></td>
                    <td class="table-cell text-xs text-gray-400">{{ optional($v->deleted_at)->format('d M Y H:i') }}</td>
                    <td class="table-cell text-xs text-right whitespace-nowrap">
                        <form method="POST" action="{{ route('admin.archived.visit.restore', $v->id) }}" class="inline">
                            @csrf
                            <button class="text-xs px-3 py-1 rounded-md bg-emerald-50 text-emerald-700 border border-emerald-200 hover:bg-emerald-100">Restore</button>
                        </form>
                        <button onclick="openPurgeVisit({{ $v->id }}, '{{ addslashes($v->visit_number) }}', '{{ addslashes(optional($v->patient)->full_name ?? 'unknown') }}')"
                                class="text-xs px-3 py-1 rounded-md bg-red-50 text-red-700 border border-red-200 hover:bg-red-100 ml-1">
                            Permanently delete
                        </button>
                    </td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>
@endif

{{-- Empty state --}}
@if($archivedAnc->count() === 0 && $archivedMaternity->count() === 0 && $archivedVisits->count() === 0)
<div class="bg-white rounded-xl border shadow-sm py-12 text-center">
    <div class="text-4xl mb-2">🗂️</div>
    <p class="text-sm font-medium text-gray-700">No archived records</p>
    <p class="text-xs text-gray-400 mt-1">When admins archive ANC clients, maternity admissions, or cancel ANC visits, they'll appear here.</p>
</div>
@endif

{{-- ─── Permanent-delete confirmation modal ────────────────────────── --}}
<div id="purgeModal" class="hidden fixed inset-0 z-50 bg-black/40 flex items-center justify-center p-4">
    <div class="bg-white rounded-xl shadow-2xl max-w-md w-full overflow-hidden">
        <div class="bg-red-600 text-white px-5 py-3 flex items-center justify-between">
            <h3 class="text-sm font-semibold">⚠ Permanently delete record</h3>
            <button onclick="closePurge()" class="text-white hover:text-red-100 text-xl leading-none">&times;</button>
        </div>
        <form method="POST" id="purgeForm">
            @csrf
            <div class="p-5">
                <p class="text-xs text-gray-700 mb-2">
                    You are about to <span class="font-semibold text-red-700">permanently delete</span>:
                </p>
                <div class="bg-red-50 border border-red-200 rounded-lg px-3 py-2 mb-3">
                    <div id="purgeTarget" class="text-sm font-medium text-red-900"></div>
                </div>
                <p class="text-[11px] text-gray-500 mb-3">
                    This action <span class="font-semibold">cannot be undone</span>. The record will be removed from
                    the database. A snapshot of what was deleted will be kept in the audit log permanently.
                </p>

                <label class="block text-[11px] font-medium text-gray-700 mb-1">Reason (required)</label>
                <input type="text" name="reason" required maxlength="500"
                       class="form-input text-xs w-full mb-3"
                       placeholder="e.g. Test record from training session">

                <label class="block text-[11px] font-medium text-gray-700 mb-1">Type DELETE to confirm</label>
                <input type="text" id="confirmText" oninput="checkConfirm()" required
                       class="form-input text-xs w-full mb-3"
                       placeholder="DELETE" autocomplete="off">

                <label class="block text-[11px] font-medium text-gray-700 mb-1">Your password</label>
                <input type="password" name="admin_password" required
                       class="form-input text-xs w-full"
                       placeholder="Re-enter your password" autocomplete="current-password">
            </div>
            <div class="px-5 py-3 bg-gray-50 border-t flex justify-end gap-2">
                <button type="button" onclick="closePurge()" class="btn-secondary text-xs">Cancel</button>
                <button type="submit" id="purgeSubmit" disabled
                        class="text-xs px-4 py-2 rounded-md bg-red-600 text-white font-semibold hover:bg-red-700 disabled:opacity-50 disabled:cursor-not-allowed">
                    Permanently delete
                </button>
            </div>
        </form>
    </div>
</div>

<script>
(function() {
    var routes = {
        anc:       "{{ url('admin/archived/anc') }}/__ID__/purge",
        maternity: "{{ url('admin/archived/maternity') }}/__ID__/purge",
        visit:     "{{ url('admin/archived/visit') }}/__ID__/purge",
    };

    window.openPurgeAnc = function(id, ancNum, name) {
        document.getElementById('purgeTarget').textContent =
            'ANC ' + ancNum + ' — ' + name;
        document.getElementById('purgeForm').action = routes.anc.replace('__ID__', id);
        showModal();
    };
    window.openPurgeMat = function(id, name, dateStr) {
        document.getElementById('purgeTarget').textContent =
            'Maternity admission of ' + name + (dateStr ? ' (' + dateStr + ')' : '');
        document.getElementById('purgeForm').action = routes.maternity.replace('__ID__', id);
        showModal();
    };
    window.openPurgeVisit = function(id, visitNum, name) {
        document.getElementById('purgeTarget').textContent =
            'Visit ' + visitNum + ' — ' + name;
        document.getElementById('purgeForm').action = routes.visit.replace('__ID__', id);
        showModal();
    };
    window.closePurge = function() {
        document.getElementById('purgeModal').classList.add('hidden');
        document.getElementById('purgeForm').reset();
        document.getElementById('purgeSubmit').disabled = true;
    };
    window.checkConfirm = function() {
        var v = document.getElementById('confirmText').value;
        document.getElementById('purgeSubmit').disabled = (v !== 'DELETE');
    };
    function showModal() {
        document.getElementById('purgeModal').classList.remove('hidden');
        document.getElementById('purgeSubmit').disabled = true;
    }
})();
</script>

@endsection