@extends('layouts.app')
@section('title', 'Appointments')

@section('content')
<div class="card mb-3">
    <div class="card-body">
        <form method="GET" class="row g-2 align-items-end">
            <div class="col-12 col-md-4 col-xl-3">
                <label class="form-label small mb-1">Search</label>
                <input type="search" name="q" value="{{ $filters['q'] ?? '' }}" class="form-control" placeholder="Ref, visitor, phone, company, host">
            </div>
            <div class="col-6 col-md-2">
                <label class="form-label small mb-1">Status</label>
                <select name="status" class="form-select">
                    <option value="">All</option>
                    @foreach (\App\Models\Appointment::STATUSES as $key => [$label])
                        <option value="{{ $key }}" @selected(($filters['status'] ?? '') === $key)>{{ $label }}</option>
                    @endforeach
                </select>
            </div>
            <div class="col-6 col-md-2 col-xl-1">
                <label class="form-label small mb-1">Type</label>
                <select name="type" class="form-select">
                    <option value="">All</option>
                    @foreach (\App\Models\Appointment::TYPES as $key => $label)
                        <option value="{{ $key }}" @selected(($filters['type'] ?? '') === $key)>{{ $label }}</option>
                    @endforeach
                </select>
            </div>
            @if ($hosts->isNotEmpty())
                <div class="col-6 col-md-2">
                    <label class="form-label small mb-1">Host</label>
                    <select name="host_id" class="form-select">
                        <option value="">All</option>
                        @foreach ($hosts as $h)
                            <option value="{{ $h->id }}" @selected(($filters['host_id'] ?? '') == $h->id)>{{ $h->name }}</option>
                        @endforeach
                    </select>
                </div>
            @endif
            <div class="col-6 col-md-2 col-xl-1">
                <label class="form-label small mb-1">From</label>
                <input type="date" name="from" value="{{ $filters['from'] ?? '' }}" class="form-control">
            </div>
            <div class="col-6 col-md-2 col-xl-1">
                <label class="form-label small mb-1">To</label>
                <input type="date" name="to" value="{{ $filters['to'] ?? '' }}" class="form-control">
            </div>
            <div class="col-6 col-md-auto d-flex gap-2">
                <button class="btn btn-primary"><i class="bi bi-funnel"></i> Filter</button>
                <a href="{{ route('appointments.index') }}" class="btn btn-light">Reset</a>
            </div>
        </form>
    </div>
</div>

<div class="card">
    <div class="card-header bg-white d-flex justify-content-between align-items-center">
        <span class="fw-semibold">{{ $appointments->total() }} appointment(s)</span>
        <div class="d-flex gap-2">
            @if (auth()->user()->hasRole('admin', 'staff'))
                <a href="{{ route('appointments.create') }}" class="btn btn-primary btn-sm"><i class="bi bi-plus-lg"></i> New Appointment</a>
            @endif
            @if (auth()->user()->hasRole('admin', 'security'))
                <a href="{{ route('walkins.create') }}" class="btn btn-outline-primary btn-sm"><i class="bi bi-person-plus"></i> Walk-in</a>
            @endif
            @if (auth()->user()->isAdmin())
                <a href="{{ route('reports.export', array_filter($filters)) }}" class="btn btn-outline-success btn-sm"><i class="bi bi-filetype-csv"></i> CSV</a>
            @endif
        </div>
    </div>
    @include('appointments._table')
    @if ($appointments->hasPages())
        <div class="card-footer bg-white">{{ $appointments->links() }}</div>
    @endif
</div>
@endsection