@extends('layouts.portal')
@php
  $min = $batch->minAttendance();
  $lockDays = (int) config('infotics.attendance.trainer_edit_days', 7);
  $held = $sessions->whereNotNull('taken_at')->count();
  $withPct = $roster->filter(fn ($r) => $r['percent'] !== null);
  $avg = $withPct->count() ? round($withPct->avg('percent')) : null;
  $low = $roster->filter(fn ($r) => $r['sessions_taken'] >= 3 && $r['percent'] !== null && $r['percent'] < $min);
@endphp
@section('title', $batch->course->title)
@section('subtitle', 'Batch '.$batch->batch_code.' · '.$batch->start_date?->format('d M Y').' – '.$batch->end_date?->format('d M Y').($batch->schedule ? ' · '.$batch->schedule : ''))
@section('actions')
  <a class="btn btn-secondary" href="{{ route('trainer.batches') }}"><x-icon name="arrow-left" :size="17"/> All batches</a>
  <a class="btn btn-secondary" href="{{ route('trainer.materials', ['batch' => $batch->id]) }}"><x-icon name="upload" :size="17"/> Upload material</a>
@endsection

@section('content')
<div class="kpis">
  <div class="card kpi reveal"><span class="ico"><x-icon name="users" :size="22"/></span><span>Active learners</span><b>{{ $roster->count() }}</b><small>{{ $batch->seat_limit ? 'of '.$batch->seat_limit.' seats' : 'No seat limit' }}</small></div>
  <div class="card kpi green reveal d1"><span class="ico"><x-icon name="calendar-check" :size="22"/></span><span>Classes held</span><b>{{ $held }}/{{ $sessions->count() }}</b><small>{{ $sessions->count() - $held }} still to run</small></div>
  <div class="card kpi violet reveal d2"><span class="ico"><x-icon name="user-check" :size="22"/></span><span>Average attendance</span><b>{{ $avg !== null ? $avg.'%' : '—' }}</b><small>Minimum {{ $min }}%</small></div>
  <div class="card kpi {{ $low->isNotEmpty() ? 'red' : 'green' }} reveal d3"><span class="ico"><x-icon name="alert" :size="22"/></span><span>Below minimum</span><b>{{ $low->count() }}</b><small>{{ $low->isNotEmpty() ? 'Follow up with these learners' : 'Everyone is on track' }}</small></div>
</div>

<div data-tabs>
  <div class="tabs" role="tablist">
    <button type="button" data-tab="roster" role="tab">Roster</button>
    <button type="button" data-tab="classes" role="tab">Classes</button>
    <button type="button" data-tab="materials" role="tab">Materials</button>
    <button type="button" data-tab="announce" role="tab">Announcement</button>
  </div>

  <div data-pane="roster" id="roster">
    <div class="table-wrap">
      <table class="table">
        <thead><tr><th>Learner</th><th>Enrollment</th><th style="min-width:180px">Attendance</th><th class="num">Present</th><th class="num">Late</th><th class="num">Absent</th></tr></thead>
        <tbody>
        @forelse($roster as $r)
          @php $u = $r['user']; $en = $enrollments->get($u->id); $p = $r['percent']; $tone = $p === null ? '' : ($p >= $min ? 'green' : ($p >= $min - 10 ? 'amber' : 'red')); @endphp
          <tr>
            <td><div class="person"><span class="avatar avatar-sm">@if($u->avatarUrl())<img src="{{ $u->avatarUrl() }}" alt="">@else{{ $u->initials() }}@endif</span><div style="min-width:0"><b>{{ $u->name }}</b><div class="xs muted">{{ $u->email }}@if($u->phone) · {{ $u->phone }}@endif</div></div></div></td>
            <td>@if($en)<x-pill :status="$en->status"/> <x-pill :status="$en->payment_status"/>@endif</td>
            <td><div class="between row small" style="gap:6px"><b>{{ $p !== null ? $p.'%' : '—' }}</b>@if($p !== null && $p < $min && $r['sessions_taken'] >= 3)<span class="pill pill-red">Low</span>@endif</div><div class="progress {{ $tone }} mt-1"><i style="width:{{ $p ?? 0 }}%"></i></div></td>
            <td class="num">{{ $r['present'] }}</td><td class="num">{{ $r['late'] }}</td><td class="num">{{ $r['absent'] }}</td>
          </tr>
        @empty
          <tr><td colspan="6" class="table-empty">No active learners yet. Learners appear here once their enrollment is activated.</td></tr>
        @endforelse
        </tbody>
      </table>
    </div>
  </div>

  <div data-pane="classes">
    <div class="pt-cols">
      <div class="pt-main">
        <section class="panel">
          @forelse($sessions as $s)
            @php $cancelled = $s->status === 'cancelled'; $locked = $s->taken_at && $s->taken_at->lte(now()->subDays($lockDays)); @endphp
            <div class="pt-session-wrap">
              <div class="pt-session {{ $cancelled ? 'is-cancelled' : '' }}">
                <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->displayTitle() }}@if($s->topic) <span class="muted" style="font-weight:500">· {{ $s->topic }}</span>@endif</b>
                  <div class="pt-meta-light"><span><x-icon name="clock" :size="14"/> {{ $s->starts_at->format('D g:i A') }}@if($s->ends_at) – {{ $s->ends_at->format('g:i A') }}@endif</span>
                    @if($s->taken_at)<span><x-icon name="user-check" :size="14"/> {{ $s->present_count }}/{{ $roster->count() }} attended</span>@endif
                    @if($s->recording_url)<span><x-icon name="play-circle" :size="14"/> Recording added</span>@endif</div>
                </div>
                <div class="pt-session-cta">
                  @if($cancelled)<x-pill status="cancelled"/>
                  @elseif($s->taken_at)
                    <x-pill status="completed"/>
                    @if($locked)<span class="pill pill-gray"><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</a>@endif
                  @else
                    <x-pill :status="$s->starts_at->isPast() ? 'pending' : 'scheduled'"/>
                    <a class="btn {{ $s->starts_at->isPast() || $s->starts_at->isToday() ? 'btn-primary' : 'btn-secondary' }} btn-sm" href="{{ route('trainer.sessions.attendance', $s) }}"><x-icon name="check-circle" :size="15"/> Take attendance</a>
                  @endif
                </div>
              </div>
              <details class="pt-edit">
                <summary>Edit class details</summary>
                <form method="post" action="{{ route('trainer.sessions.update', $s) }}" class="pt-edit-form">
                  @csrf @method('PUT')
                  <div class="form-grid">
                    <div class="field"><label class="label" for="t{{ $s->id }}">Topic</label><input class="input" id="t{{ $s->id }}" name="topic" value="{{ $s->topic }}" maxlength="160"></div>
                    <div class="field"><label class="label" for="st{{ $s->id }}">Status</label><select class="select" id="st{{ $s->id }}" name="status"><option value="scheduled" @selected($s->status === 'scheduled')>Scheduled</option><option value="completed" @selected($s->status === 'completed')>Completed</option><option value="cancelled" @selected($s->status === 'cancelled')>Cancelled</option></select></div>
                    <div class="field"><label class="label" for="m{{ $s->id }}">Meeting link</label><input class="input" type="url" id="m{{ $s->id }}" name="meeting_url" value="{{ $s->meeting_url }}" placeholder="https://"></div>
                    <div class="field"><label class="label" for="r{{ $s->id }}">Recording link</label><input class="input" type="url" id="r{{ $s->id }}" name="recording_url" value="{{ $s->recording_url }}" placeholder="https://"></div>
                    <div class="field full"><label class="label" for="n{{ $s->id }}">Notes for learners</label><textarea class="textarea" id="n{{ $s->id }}" name="notes" rows="2" maxlength="1000" style="min-height:70px">{{ $s->notes }}</textarea></div>
                  </div>
                  <div class="row between"><label class="check"><input type="checkbox" name="notify" value="1"> <span>Email the updated schedule to learners</span></label><button class="btn btn-primary btn-sm" type="submit">Save class</button></div>
                </form>
              </details>
            </div>
          @empty
            <x-empty icon="calendar" title="No classes scheduled" text="Add the first class using the form."/>
          @endforelse
        </section>
      </div>
      <aside class="pt-side">
        <section class="panel" aria-labelledby="addc">
          <div class="panel-head"><h2 id="addc">Add a class</h2></div>
          <form class="panel-body" method="post" action="{{ route('trainer.sessions.store', $batch) }}">
            @csrf
            <div class="form-grid">
              <div class="field"><label class="label" for="ac-date">Date <span class="req">*</span></label><input class="input" type="date" id="ac-date" name="date" required min="{{ now()->toDateString() }}"></div>
              <div class="field"><label class="label" for="ac-time">Time <span class="req">*</span></label><input class="input" type="time" id="ac-time" name="time" required value="20:00"></div>
              <div class="field"><label class="label" for="ac-min">Minutes</label><input class="input" type="number" id="ac-min" name="minutes" min="15" max="480" value="{{ $batch->session_minutes ?: 120 }}"></div>
              <div class="field"><label class="label" for="ac-topic">Topic</label><input class="input" id="ac-topic" name="topic" maxlength="160"></div>
              <div class="field full"><label class="label" for="ac-url">Meeting link</label><input class="input" type="url" id="ac-url" name="meeting_url" value="{{ $batch->meeting_url }}" placeholder="https://"></div>
            </div>
            <label class="check mb-2"><input type="checkbox" name="notify" value="1" checked> <span>Email the schedule and calendar file to learners</span></label>
            <button class="btn btn-primary btn-block" type="submit"><x-icon name="plus" :size="16"/> Add class</button>
          </form>
        </section>
      </aside>
    </div>
  </div>

  <div data-pane="materials">
    <section class="panel">
      <div class="panel-head"><h2>Materials for this course</h2><a class="btn btn-primary btn-sm" href="{{ route('trainer.materials', ['batch' => $batch->id]) }}"><x-icon name="upload" :size="15"/> Upload to this batch</a></div>
      @forelse($resources as $rs)
        <div class="list-row"><span class="res-ico {{ $rs->kind === 'pdf' ? 'pdf' : ($rs->kind === 'video' ? 'video' : '') }}"><x-icon :name="$rs->kind === 'video' ? 'video' : ($rs->kind === 'link' ? 'link' : 'file-text')" :size="20"/></span><div class="grow" style="min-width:0"><b class="pt-ellipsis">{{ $rs->title }}</b><div class="xs muted">{{ strtoupper($rs->kind) }}@if($rs->humanSize()) · {{ $rs->humanSize() }}@endif · {{ $rs->batch_id ? 'This batch only' : 'All learners of the course' }} · {{ $rs->created_at->format('d M Y') }}</div></div></div>
      @empty
        <x-empty icon="video" title="No materials yet" text="Upload lecture videos, PDFs and lab guides for your learners."><a class="btn btn-primary mt-2" href="{{ route('trainer.materials', ['batch' => $batch->id]) }}">Upload the first one</a></x-empty>
      @endforelse
    </section>
  </div>

  <div data-pane="announce">
    <section class="panel" style="max-width:720px">
      <div class="panel-head"><h2>Email this batch</h2><span class="pill pill-blue">{{ $roster->count() }} recipient{{ $roster->count() === 1 ? '' : 's' }}</span></div>
      <form class="panel-body" method="post" action="{{ route('trainer.batches.announce', $batch) }}">
        @csrf
        <x-field name="subject" label="Subject" required placeholder="e.g. Lab 3 moved to Friday"/>
        <x-field name="body" type="textarea" label="Message" rows="6" required help="Sent to every learner in the batch from the INFOTICS mailer. Keep it short and clear."/>
        <button class="btn btn-primary" type="submit" data-confirm="Send this announcement to {{ $roster->count() }} learner(s)?"><x-icon name="send" :size="16"/> Send announcement</button>
      </form>
    </section>
  </div>
</div>
@endsection