@extends('layouts.portal')
@section('title', 'Attendance')
@section('subtitle', 'Mark registers quickly, then review or amend recent ones.')
@section('actions')
<form method="get" action="{{ route('trainer.attendance') }}" class="filters" style="margin:0">
  <label class="xs muted" for="batchf">Batch</label>
  <select class="select" id="batchf" name="batch" data-autosubmit><option value="">All my batches</option>@foreach($batches as $b)<option value="{{ $b->id }}" @selected($selected === $b->id)>{{ $b->batch_code }} · {{ \Illuminate\Support\Str::limit($b->course->title, 30) }}</option>@endforeach</select>
  <noscript><button class="btn btn-secondary btn-sm" type="submit">Filter</button></noscript>
</form>
@endsection

@section('content')
@php $lockDays = (int) config('infotics.attendance.trainer_edit_days', 7); @endphp
<div data-tabs>
  <div class="tabs" role="tablist">
    <button type="button" data-tab="todo" role="tab">Needs attendance <span class="pill {{ $pending->isNotEmpty() ? 'pill-red' : 'pill-gray' }}">{{ $pending->count() }}</span></button>
    <button type="button" data-tab="done" role="tab">Recorded <span class="pill pill-gray">{{ $taken->count() }}</span></button>
  </div>

  <div data-pane="todo">
    @if($pending->isEmpty())
      <div class="panel"><x-empty icon="check-circle" title="All registers are up to date" text="Classes that have started, or are about to, and still need a register will show here."/></div>
    @else
    <div class="callout warn mb-2"><x-icon name="alert" :size="20"/><div class="small"><b>{{ $pending->count() }} register{{ $pending->count() === 1 ? '' : 's' }} to complete.</b> Open a class, tap <em>Present</em> for everyone and change only the exceptions. It takes about 20 seconds.</div></div>
    <section class="panel">
      @foreach($pending as $s)
        <div class="pt-session">
          <div class="pt-date {{ $s->starts_at->isToday() ? 'today' : '' }}"><b>{{ $s->starts_at->format('d') }}</b><span>{{ $s->starts_at->format('M') }}</span></div>
          <div class="pt-session-body"><b>{{ $s->batch->course->title }}</b><div class="small muted">{{ $s->displayTitle() }}@if($s->topic) · {{ $s->topic }}@endif</div><div class="pt-meta-light"><span><x-icon name="clock" :size="14"/> {{ $s->starts_at->format('D g:i A') }}</span><span><x-icon name="users" :size="14"/> {{ $s->batch->batch_code }}</span><span>{{ $s->starts_at->isFuture() ? 'Starts '.$s->starts_at->diffForHumans() : 'Held '.$s->starts_at->diffForHumans() }}</span></div></div>
          <div class="pt-session-cta"><a class="btn btn-primary btn-sm" href="{{ route('trainer.sessions.attendance', $s) }}"><x-icon name="check-circle" :size="15"/> Take attendance</a></div>
        </div>
      @endforeach
    </section>
    @endif
  </div>

  <div data-pane="done">
    @if($taken->isEmpty())
      <div class="panel"><x-empty icon="clipboard-check" title="No registers recorded yet"/></div>
    @else
    <div class="table-wrap">
      <table class="table">
        <thead><tr><th>Class</th><th>Batch</th><th>Attended</th><th>Taken</th><th></th></tr></thead>
        <tbody>
        @foreach($taken as $s)
          @php $locked = $s->taken_at->lte(now()->subDays($lockDays)); @endphp
          <tr>
            <td class="nowrap"><b>{{ $s->starts_at->format('D, d M Y') }}</b><div class="xs muted">{{ $s->displayTitle() }} · {{ $s->starts_at->format('g:i A') }}</div></td>
            <td>{{ $s->batch->course->title }}<div class="xs muted mono">{{ $s->batch->batch_code }}</div></td>
            <td><b>{{ $s->present_count }}</b> / {{ $s->total_count }}<div class="progress mt-1" style="width:90px"><i style="width:{{ $s->total_count ? round($s->present_count / $s->total_count * 100) : 0 }}%"></i></div></td>
            <td class="small muted nowrap">{{ $s->taken_at->diffForHumans() }}</td>
            <td class="actions">@if($locked)<span class="pill pill-gray" title="Edit window of {{ $lockDays }} days has passed"><x-icon name="lock" :size="12"/> Locked</span> <a class="btn btn-secondary btn-sm" href="{{ route('trainer.sessions.attendance', $s) }}">View</a>@else<a class="btn btn-secondary btn-sm" href="{{ route('trainer.sessions.attendance', $s) }}"><x-icon name="edit" :size="15"/> Edit register</a>@endif</td>
          </tr>
        @endforeach
        </tbody>
      </table>
    </div>
    <p class="xs muted mt-1">Registers can be edited for {{ $lockDays }} days after they are taken. After that only an administrator can amend them.</p>
    @endif
  </div>
</div>
@endsection