@extends('layouts.admin')

@section('page_kicker', 'Roster')
@section('page_title', 'Independent doctors')

@section('content')
    <div class="admin-content-card mb-8">
        <h2 class="admin-card-title text-base">Create independent doctor</h2>
        <p class="admin-card-desc">Role <span class="font-medium text-slate-700">doctor</span>, type <span class="font-medium text-slate-700">independent</span>, no hospital link.</p>
        <form method="POST" action="{{ route('aim4wellness.admin.doctors.store') }}" class="mt-6 grid gap-5 md:grid-cols-2">
            @csrf
            <div>
                <label class="admin-form-label" for="name">Name</label>
                <input id="name" name="name" required class="admin-input" value="{{ old('name') }}">
            </div>
            <div>
                <label class="admin-form-label" for="email">Email</label>
                <input id="email" type="email" name="email" required class="admin-input" value="{{ old('email') }}">
            </div>
            <div>
                <label class="admin-form-label" for="password">Password</label>
                <input id="password" type="password" name="password" required class="admin-input" autocomplete="new-password">
            </div>
            <div>
                <label class="admin-form-label" for="password_confirmation">Confirm password</label>
                <input id="password_confirmation" type="password" name="password_confirmation" required class="admin-input" autocomplete="new-password">
            </div>
            <div>
                <label class="admin-form-label" for="specialization">Specialization</label>
                <input id="specialization" name="specialization" class="admin-input" value="{{ old('specialization', 'General / Telehealth') }}">
            </div>
            <div>
                <label class="admin-form-label" for="phone">Phone (optional)</label>
                <input id="phone" name="phone" class="admin-input" value="{{ old('phone') }}">
            </div>
            <div class="flex items-end md:col-span-2">
                <button type="submit" class="admin-btn-primary">Create doctor</button>
            </div>
        </form>
    </div>
    <div class="admin-content-card">
        <h3 class="admin-card-title">Directory</h3>
        <p class="admin-card-desc">Verification and session counts</p>
        <div class="mt-6 space-y-4">
            @foreach($doctors as $doctor)
                <div class="rounded-2xl border border-slate-100 bg-slate-50/50 p-5 transition hover:border-slate-200 hover:bg-white">
                    <p class="font-semibold text-slate-900">{{ $doctor->user->name ?? 'N/A' }} <span class="font-normal text-slate-500">·</span> {{ $doctor->specialization }}</p>
                    <p class="mt-1 text-xs text-slate-500">{{ $doctor->user->email ?? '' }} · {{ optional($doctor->user)->verified_at ? 'verified' : 'not verified' }} · {{ optional($doctor->user)->is_active ? 'active' : 'inactive' }}</p>
                    <p class="mt-2 text-xs text-slate-500">Sessions: {{ \App\Models\Modules\Aim4Wellness\Models\Consultation::where('doctor_id', $doctor->user_id)->count() }} · Ratings: N/A</p>
                    @if($doctor->user)
                        <form method="POST" action="{{ route('aim4wellness.admin.doctors.status', $doctor->user) }}" class="mt-4 flex flex-wrap items-center gap-3">
                            @csrf
                            @method('PATCH')
                            <select name="action" class="admin-input max-w-[11rem] py-2 text-xs">
                                @foreach(['approve', 'reject', 'verify', 'suspend', 'activate'] as $action)
                                    <option value="{{ $action }}">{{ $action }}</option>
                                @endforeach
                            </select>
                            <button type="submit" class="admin-btn-dark px-4 py-2 text-xs">Apply</button>
                        </form>
                    @endif
                </div>
            @endforeach
        </div>
        <div class="mt-8">{{ $doctors->links() }}</div>
    </div>
@endsection