@extends('layouts.admin')

@section('title', 'Donors')
@section('heading', 'Donors')

@section('content')
<header class="rhead">
    <div class="rhead__id">
        <span class="rhead__ico" aria-hidden="true"><svg class="i i--lg"><use href="#i-users"/></svg></span>
        <div>
            <h2>Donors</h2>
            <p>People with a donor account. They are added automatically after their first paid donation.</p>
        </div>
    </div>
    <div class="rhead__act">
        <form class="rsearch" action="{{ route('admin.donors.index') }}" method="get" role="search">
            <label class="sr-only" for="q">Search donors</label>
            <svg class="i" aria-hidden="true"><use href="#i-search"/></svg>
            <input id="q" type="search" name="q" value="{{ $search }}" placeholder="Search name or email...">
            @if ($search)<a class="rsearch__clear" href="{{ route('admin.donors.index') }}" aria-label="Clear search"><svg class="i" aria-hidden="true"><use href="#i-close"/></svg></a>@endif
            <button class="sr-only" type="submit">Search</button>
        </form>
    </div>
</header>

<ul class="dsum dsum--wide">
    <li class="dsum__card dsum__card--green">
        <span class="dsum__ico" aria-hidden="true"><svg class="i i--lg"><use href="#i-users"/></svg></span>
        <div><span class="dsum__label">Donor accounts</span><strong class="dsum__num">{{ $summary['donors'] }}</strong></div>
    </li>
    <li class="dsum__card dsum__card--blue">
        <span class="dsum__ico" aria-hidden="true"><svg class="i i--lg"><use href="#i-heart"/></svg></span>
        <div><span class="dsum__label">Given by donors</span><strong class="dsum__num">{{ \App\Support\Fmt::rupees($summary['given']) }}</strong></div>
    </li>
    <li class="dsum__card dsum__card--amber">
        <span class="dsum__ico" aria-hidden="true"><svg class="i i--lg"><use href="#i-chart"/></svg></span>
        <div><span class="dsum__label">Giving monthly</span><strong class="dsum__num">{{ $summary['monthly'] }}</strong></div>
    </li>
</ul>

@error('donor')<div class="alert alert--err" role="alert"><svg class="i" aria-hidden="true"><use href="#i-info"/></svg><p>{{ $message }}</p></div>@enderror

@if ($donors->isEmpty())
    <div class="empty"><svg class="i i--lg" aria-hidden="true"><use href="#i-{{ $search ? 'search' : 'users' }}"/></svg>
        <p>@if ($search) No donor matched &ldquo;{{ $search }}&rdquo;. @else No donor accounts yet. @endif</p>
    </div>
@else
    <div class="tablewrap">
        <table class="table table--compact">
            <thead><tr><th scope="col">Donor</th><th scope="col">Donations</th><th scope="col">Total given</th><th scope="col">Monthly</th><th scope="col">Last gift</th><th scope="col">Joined</th><th scope="col" class="is-actions"><span class="sr-only">Actions</span></th></tr></thead>
            <tbody>
                @foreach ($donors as $donor)
                    <tr>
                        <td data-label="Donor"><div class="donor"><span class="donor__av" aria-hidden="true">{{ mb_strtoupper(mb_substr($donor->name, 0, 1)) }}</span><div><a class="cell-link" href="{{ route('admin.donations.index', ['q' => $donor->email]) }}">{{ $donor->name }}</a>@unless ($donor->is_active) <span class="pill pill--off">Off</span>@endunless<br><small class="muted">{{ $donor->email }}</small></div></div></td>
                        <td data-label="Donations">{{ $donor->paid_count }}</td>
                        <td data-label="Total given"><strong class="amt">{{ \App\Support\Fmt::rupees((int) $donor->paid_total) }}</strong></td>
                        <td data-label="Monthly">@if ($donor->active_monthly)<span class="pill pill--on">Active</span>@else<span class="muted">—</span>@endif</td>
                        <td class="nowrap" data-label="Last gift">{{ $donor->last_paid_at ? $donor->last_paid_at->format('j M Y') : '—' }}</td>
                        <td class="nowrap" data-label="Joined">{{ $donor->created_at->format('j M Y') }}</td>
                        <td class="is-actions">
                            <div class="rowact">
                                <a class="iconbtn" href="{{ route('admin.donations.index', ['q' => $donor->email]) }}" aria-label="See {{ $donor->name }}'s donations" title="See donations"><svg class="i" aria-hidden="true"><use href="#i-eye"/></svg></a>
                                @if ($donor->is_active)
                                    <form action="{{ route('admin.donors.impersonate', $donor) }}" method="post"
                                          data-confirm="Open {{ $donor->name }}'s donor account? You will see exactly what they see. Use &quot;Back to admin&quot; on their page to return.">
                                        @csrf
                                        <button class="btn btn--ghost btn--sm" type="submit" title="Log in as {{ $donor->name }}"><svg class="i" aria-hidden="true"><use href="#i-user"/></svg>Log in<span class="sr-only"> as {{ $donor->name }}</span></button>
                                    </form>
                                @endif
                            </div>
                        </td>
                    </tr>
                @endforeach
            </tbody>
        </table>
    </div>
    {{ $donors->links() }}
@endif
@endsection