@extends('layouts.app')
@section('title', 'New Visits')
@section('content')
@include('partials._queue-routing-helper')

{{-- Stats Bar --}}
<div class="grid grid-cols-3 md:grid-cols-6 gap-3 mb-4">
    <div class="stat-card text-center"><p class="text-xs text-gray-400 uppercase">Today</p><p class="text-xl font-bold">{{ $stats['total'] }}</p></div>
    <div class="stat-card text-center" style="border-left:3px solid #f59e0b"><p class="text-xs text-gray-400 uppercase">Waiting Triage</p><p class="text-xl font-bold text-amber-600">{{ $stats['waiting_triage'] }}</p></div>
    <div class="stat-card text-center" style="border-left:3px solid #3b82f6"><p class="text-xs text-gray-400 uppercase">In Triage</p><p class="text-xl font-bold text-blue-600">{{ $stats['in_triage'] }}</p></div>
    <div class="stat-card text-center" style="border-left:3px solid #8b5cf6"><p class="text-xs text-gray-400 uppercase">Waiting Consult</p><p class="text-xl font-bold text-purple-600">{{ $stats['waiting_consult'] }}</p></div>
    <div class="stat-card text-center" style="border-left:3px solid #6366f1"><p class="text-xs text-gray-400 uppercase">In Consultation</p><p class="text-xl font-bold text-indigo-600">{{ $stats['in_consultation'] }}</p></div>
    <div class="stat-card text-center" style="border-left:3px solid #22c55e"><p class="text-xs text-gray-400 uppercase">Completed</p><p class="text-xl font-bold text-green-600">{{ $stats['completed'] }}</p></div>
</div>

{{-- ═══ Create New Visit Form ═══ --}}
<div class="bg-white rounded-xl border border-gray-200 p-5 mb-4">
    <h3 class="text-sm font-bold text-gray-800 uppercase tracking-wide mb-4 flex items-center gap-2">
        <svg class="w-4 h-4 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/></svg>
        Create New Visit
    </h3>
    @php $preselect = request('visit_type') ?? request('pathway') ?? 'outpatient'; @endphp
    <form method="POST" action="{{ route('visits.store') }}">
        @csrf
        <div class="grid grid-cols-1 md:grid-cols-6 gap-3 items-end">
            {{-- Patient Search --}}
            <div class="md:col-span-2 relative">
                <label class="form-label">Patient <span class="text-red-500">*</span></label>
                <input type="text" class="form-input patient-search" data-target="patient_id" placeholder="Search name, MRN, phone..." autocomplete="off">
                <input type="hidden" name="patient_id" id="patient_id" required>
            </div>
            {{-- Department --}}
            <div>
                <label class="form-label">Department</label>
                <select name="department_id" id="dept_select" required class="form-input">
                    @include('partials._department-options', ['matchCode' => 'OPD'])
                </select>
            </div>
            {{-- Payer --}}
            <div>
                <label class="form-label">Payer Type</label>
                <select name="payer_type" required class="form-input" onchange="document.getElementById('ins_extra').style.display=this.value==='insurance'?'flex':'none'">
                    <option value="cash">Cash</option>
                    <option value="mpesa">M-Pesa</option>
                    <option value="insurance">Insurance</option>
                    <option value="corporate">Corporate</option>
                </select>
            </div>
            {{-- Visit Type --}}
            <div>
                <label class="form-label">Visit Type</label>
                <select name="visit_type" id="visit_pathway" class="form-input" onchange="onVisitTypeChange(this.value)">
                    <optgroup label="Outpatient">
                        <option value="outpatient" {{ $preselect === 'outpatient' ? 'selected' : '' }}>General Consultation</option>
                        <option value="revisit" {{ $preselect === 'revisit' ? 'selected' : '' }}>Revisit / Follow-up</option>
                        <option value="emergency" {{ $preselect === 'emergency' ? 'selected' : '' }}>Emergency</option>
                    </optgroup>
                    <optgroup label="Specialist">
                        <option value="procedure" {{ $preselect === 'procedure' ? 'selected' : '' }}>Procedure</option>
                    </optgroup>
                    <optgroup label="Direct Services">
                        <option value="direct_lab" {{ $preselect === 'direct_lab' ? 'selected' : '' }}>Direct Lab</option>
                        <option value="direct_radiology" {{ $preselect === 'direct_radiology' ? 'selected' : '' }}>Direct Radiology</option>
                    </optgroup>
                </select>
            </div>
            {{-- Submit --}}
            <div class="flex gap-2">
                <label class="flex items-center gap-1 text-xs cursor-pointer"><input type="checkbox" name="urgent" value="1" class="rounded border-gray-300 text-red-500"> <span class="text-red-600 font-semibold">Urgent</span></label>
                <button type="submit" class="btn-success flex items-center gap-1 flex-1"><svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/></svg> Check In</button>
            </div>
        </div>
        {{-- Insurance fields (hidden) --}}
        <div id="ins_extra" class="flex gap-3 mt-3" style="display:none">
            <div class="flex-1"><label class="form-label">Insurance</label><select name="insurance_company_id" class="form-input text-xs"><option value="">Select...</option>@foreach($insurers as $i)<option value="{{ $i->id }}">{{ $i->name }}</option>@endforeach</select></div>
            <div class="flex-1"><label class="form-label">Auth Code</label><input type="text" name="authorization_code" class="form-input text-xs" placeholder="Pre-auth code"></div>
        </div>
    </form>
</div>

{{-- ═══ Filter Bar ═══ --}}
<div class="flex flex-wrap gap-2 mb-4 items-center">
    <form method="GET" class="flex flex-wrap gap-2 items-center flex-1">
        <input type="text" name="search" value="{{ request('search') }}" placeholder="Search patient..." class="form-input w-44 text-xs">
        <select name="status" class="form-input w-40 text-xs" onchange="this.form.submit()">
            <option value="">All Statuses</option>
            <option value="waiting" {{ request('status')==='waiting'?'selected':'' }}>Waiting for Triage</option>
            <option value="urgent" {{ request('status')==='urgent'?'selected':'' }}>Urgent</option>
            <option value="in_triage" {{ request('status')==='in_triage'?'selected':'' }}>In Triage</option>
            <option value="triaged" {{ request('status')==='triaged'?'selected':'' }}>Triaged, Waiting Consult</option>
            <option value="in_consultation" {{ request('status')==='in_consultation'?'selected':'' }}>In Consultation</option>
            <option value="at_lab" {{ request('status')==='at_lab'?'selected':'' }}>At Lab (Direct)</option>
            <option value="at_radiology" {{ request('status')==='at_radiology'?'selected':'' }}>At Radiology (Direct)</option>
        </select>
        <select name="department" class="form-input w-36 text-xs" onchange="this.form.submit()">
            <option value="">All Depts</option>
            @include('partials._department-options', ['selected' => request('department')])
        </select>
        <button class="btn-primary text-xs">Filter</button>
        @if(request()->hasAny(['search','status','department']))<a href="{{ route('visits.new') }}" class="text-xs text-cr-600">Clear</a>@endif
    </form>
    <span class="text-xs text-gray-400">{{ $visits->total() }} visits</span>
</div>

{{-- ═══ Visit List Table ═══ --}}
<div class="bg-white rounded-xl border border-gray-200 overflow-hidden">
    <div class="overflow-x-auto">
        <table class="w-full">
            <thead class="bg-gray-50 border-b"><tr>
                <th class="table-header">Visit #</th>
                <th class="table-header">Patient Name</th>
                <th class="table-header">MRN</th>
                <th class="table-header">Age/Sex</th>
                <th class="table-header">Visit Time</th>
                <th class="table-header">Payer</th>
                <th class="table-header">Department</th>
                <th class="table-header">Status</th>
                <th class="table-header">Triage</th>
                <th class="table-header">Clinician</th>
                <th class="table-header">Actions</th>
            </tr></thead>
            <tbody class="divide-y divide-gray-50">
                @forelse($visits as $v)
                @php
                    $isUrgent = $v->status === 'urgent';
                    $statusMap = [
                        'waiting' => ['Waiting Triage', 'badge-warning'],
                        'urgent' => ['URGENT', 'badge-danger'],
                        'in_triage' => ['In Triage', 'badge-info'],
                        'triaged' => ['Waiting Consult', 'badge-info'],
                        'in_consultation' => ['In Consultation', 'badge-info'],
                        'at_pharmacy' => ['At Pharmacy', 'badge-gray'],
                        'at_lab' => ['At Lab', 'badge-info'],
                        'at_radiology' => ['At Radiology', 'badge-info'],
                        'at_dentist' => ['At Dentist', 'badge-info'],
                    ];
                    $st = $statusMap[$v->status] ?? [ucfirst(str_replace('_',' ',$v->status)), 'badge-gray'];
                @endphp
                <tr class="hover:bg-blue-50/30 {{ $isUrgent ? 'bg-red-50/40' : '' }}">
                    <td class="table-cell">
                        <a href="{{ queueOpenUrl($v) }}" class="font-mono text-xs font-semibold text-cr-700 hover:underline">{{ $v->visit_number }}</a>
                    </td>
                    <td class="table-cell">
                        <a href="{{ route('patients.show', $v->patient_id) }}" class="text-sm font-medium text-gray-900 hover:text-cr-600">{{ $v->patient->full_name ?? '' }}</a>
                    </td>
                    <td class="table-cell"><span class="font-mono text-xs text-gray-500">{{ $v->patient->mrn ?? '' }}</span></td>
                    <td class="table-cell text-xs">{{ $v->patient->age ? $v->patient->age : '-' }}/{{ strtoupper(substr($v->patient->gender ?? '', 0, 1)) }}</td>
                    <td class="table-cell text-xs">{{ $v->check_in_at ? $v->check_in_at->format('H:i') : '-' }}
                        <span class="text-gray-400 block text-xs">{{ $v->check_in_at ? $v->check_in_at->diffForHumans(null, true) . ' ago' : '' }}</span>
                    </td>
                    <td class="table-cell text-xs">{{ $v->payer_label }}</td>
                    <td class="table-cell text-xs">{{ $v->department->name ?? '-' }}</td>
                    <td class="table-cell"><span class="badge {{ $st[1] }}">{{ $st[0] }}</span></td>
                    <td class="table-cell">
                        @if($v->triage)
                            <span class="badge {{ $v->triage->priority==='emergency'?'badge-danger':($v->triage->priority==='urgent'?'badge-warning':'badge-success') }}">{{ ucfirst($v->triage->priority) }}</span>
                        @else
                            <span class="text-xs text-gray-400">Pending</span>
                        @endif
                    </td>
                    <td class="table-cell text-xs">{{ $v->clinician->name ?? '–' }}</td>
                    <td class="table-cell">
                        <div class="flex flex-wrap gap-1">
                            {{-- Send to Triage --}}
                            @if(in_array($v->status, ['waiting', 'urgent']))
                            <a href="{{ route('triage.create', $v) }}" class="text-xs font-medium text-blue-600 bg-blue-50 px-2 py-1 rounded hover:bg-blue-100">Triage</a>
                            @endif

                            {{-- Send to Consultation (skip triage) --}}
                            @if(in_array($v->status, ['waiting', 'urgent', 'in_triage', 'triaged']))
                            <form method="POST" action="{{ route('visits.send-consultation', $v) }}" class="inline">@csrf
                                <button class="text-xs font-medium text-indigo-600 bg-indigo-50 px-2 py-1 rounded hover:bg-indigo-100">Consult</button>
                            </form>
                            @endif

                            {{-- Send to Lab (direct lab pathway) --}}
                            @if(in_array($v->status, ['waiting', 'urgent']) && in_array($v->visit_type, ['direct_lab']))
                            <form method="POST" action="{{ route('visits.update-status', $v) }}" class="inline">@csrf
                                <input type="hidden" name="status" value="at_lab">
                                <button class="text-xs font-medium text-teal-600 bg-teal-50 px-2 py-1 rounded hover:bg-teal-100">Send to Lab</button>
                            </form>
                            @endif

                            {{-- Send to Radiology (direct radiology pathway) --}}
                            @if(in_array($v->status, ['waiting', 'urgent']) && in_array($v->visit_type, ['direct_radiology']))
                            <form method="POST" action="{{ route('visits.update-status', $v) }}" class="inline">@csrf
                                <input type="hidden" name="status" value="at_radiology">
                                <button class="text-xs font-medium text-purple-600 bg-purple-50 px-2 py-1 rounded hover:bg-purple-100">Send to Imaging</button>
                            </form>
                            @endif

                            {{-- Mark Urgent --}}
                            @if($v->status !== 'urgent' && !in_array($v->status, ['in_consultation','completed']))
                            <form method="POST" action="{{ route('visits.mark-urgent', $v) }}" class="inline">@csrf
                                <button class="text-xs font-medium text-red-600 bg-red-50 px-2 py-1 rounded hover:bg-red-100">Urgent</button>
                            </form>
                            @endif

                            {{-- Open Visit --}}
                            <a href="{{ queueOpenUrl($v) }}" class="text-xs font-medium text-gray-600 bg-gray-100 px-2 py-1 rounded hover:bg-gray-200">Open</a>

                            {{-- Patient Profile --}}
                            <a href="{{ route('patients.show', $v->patient_id) }}" class="text-xs font-medium text-gray-500 bg-gray-50 px-2 py-1 rounded hover:bg-gray-100" title="Patient Details">Profile</a>

                            {{-- History --}}
                            <a href="{{ route('patients.history', $v->patient_id) }}" class="text-xs font-medium text-gray-500 bg-gray-50 px-2 py-1 rounded hover:bg-gray-100" title="Prior Visits">History</a>

                            {{-- Cancel --}}
                            @if(in_array($v->status, ['waiting', 'urgent']))
                            <form method="POST" action="{{ route('visits.cancel', $v) }}" class="inline" onsubmit="return confirm('Cancel this visit?')">@csrf
                                <button class="text-xs text-gray-400 hover:text-red-600 px-1 py-1" title="Cancel Visit">✕</button>
                            </form>
                            @endif
                        </div>
                    </td>
                </tr>
                @empty
                <tr><td colspan="11" class="table-cell text-center text-gray-400 py-10">
                    No active visits. Create a new visit above.
                </td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
    @if($visits->hasPages())<div class="px-4 py-3 border-t bg-gray-50">{{ $visits->links() }}</div>@endif
</div>
@endsection

@push('scripts')
<script>
// ── Visit type → department auto-select ──
// Note: ANC visits are created exclusively through the Maternity module
// (Maternity → Register ANC / Open ANC), so ANC is intentionally absent
// from this dropdown and from the department auto-select map.
function onVisitTypeChange(type) {
    const deptSelect = document.getElementById('dept_select');

    // Auto-select department
    const deptMap = { direct_lab: 'LAB', direct_radiology: 'RAD' };
    const targetCode = deptMap[type];
    if (targetCode && deptSelect) {
        for (let opt of deptSelect.options) {
            if (opt.dataset.code === targetCode) { deptSelect.value = opt.value; break; }
        }
    } else if (deptSelect) {
        for (let opt of deptSelect.options) {
            if (opt.dataset.code === 'OPD') { deptSelect.value = opt.value; break; }
        }
    }

    // Legacy toggle
    if (typeof togglePathwayUI === 'function') togglePathwayUI(type);
}
</script>
@endpush