{{-- Admin: Open & Outstanding Tasks Report --}}
@extends('layouts.app')

@section('title', 'Open & Outstanding Tasks')

@push('styles')
<style>
    .stat-card { background:#1a2035; border-radius:10px; padding:1.25rem 1.5rem; }
    .stat-label { font-size:.72rem; color:#6b7280; text-transform:uppercase; letter-spacing:.08em; }
    .stat-value { font-size:2rem; font-weight:700; color:#f3f4f6; line-height:1.1; margin:.2rem 0; }
    .stat-value.danger  { color:#f87171; }
    .stat-value.warning { color:#fbbf24; }
    .stat-sub { font-size:.75rem; color:#6b7280; }
    .assignee-block { background:#1a2035; border-radius:10px; padding:1rem 1.25rem; margin-bottom:1rem; }
    .avatar { width:30px; height:30px; border-radius:50%; background:#3b82f6; color:#fff;
        display:inline-flex; align-items:center; justify-content:center; font-size:.65rem; font-weight:700; }
    .badge-priority { display:inline-block; font-size:.65rem; font-weight:700; padding:2px 8px;
        border-radius:4px; text-transform:uppercase; }
    .badge-high   { background:rgba(239,68,68,.2); color:#f87171; }
    .badge-medium { background:rgba(234,179,8,.2);  color:#fbbf24; }
    .badge-low    { background:rgba(34,197,94,.2);  color:#4ade80; }
    .report-table th { font-size:.72rem; letter-spacing:.08em; text-transform:uppercase;
        color:#6b7280; border-bottom:1px solid rgba(255,255,255,.08); }
    .report-table td { font-size:.82rem; color:#d1d5db; border-bottom:1px solid rgba(255,255,255,.04); }
    .overdue-cell { color:#f87171; font-weight:600; }
    .filter-btn { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1);
        color:#9ca3af; font-size:.78rem; padding:4px 14px; border-radius:999px;
        cursor:pointer; text-decoration:none; transition:.15s; }
    .filter-btn.active { background:#3b82f6; color:#fff; border-color:#3b82f6; }
    .filter-select { background:#1a2035; border:1px solid rgba(255,255,255,.1); color:#d1d5db;
        font-size:.78rem; padding:4px 10px; border-radius:6px; }
</style>
@endpush

@section('content')
<div class="container-fluid px-4 py-4">

    <div class="d-flex align-items-center justify-content-between mb-3">
        <div>
            <h2 class="text-white mb-0">Open &amp; Outstanding Tasks</h2>
            <p class="text-muted small mb-0">Admin report &middot; all incomplete tasks across the business</p>
        </div>
        <div style="display:flex;gap:.5rem;">
            <a href="{{ route('tasks.report', array_merge(request()->all(), ['export'=>'csv'])) }}"
               style="background:rgba(255,255,255,.08);color:#d1d5db;border:1px solid rgba(255,255,255,.1);
                      padding:7px 14px;border-radius:7px;font-size:.78rem;text-decoration:none;">↓ CSV</a>
        </div>
    </div>

    {{-- Stats Row --}}
    <div class="row g-3 mb-4">
        <div class="col-6 col-md-3">
            <div class="stat-card">
                <div class="stat-label">Open Tasks</div>
                <div class="stat-value">{{ $openCount }}</div>
                <div class="stat-sub">To Do + In Progress</div>
            </div>
        </div>
        <div class="col-6 col-md-3">
            <div class="stat-card">
                <div class="stat-label">Outstanding (overdue)</div>
                <div class="stat-value danger">{{ $outstandingCount }}</div>
                <div class="stat-sub">
                    @if($openCount > 0 && $outstandingCount === $openCount)
                        all open tasks are past due
                    @else
                        past their due date
                    @endif
                </div>
            </div>
        </div>
        <div class="col-6 col-md-3">
            <div class="stat-card">
                <div class="stat-label">Oldest Overdue</div>
                @if($oldestOverdue)
                <div class="stat-value warning">{{ $oldestOverdue->daysOverdue() }}d</div>
                <div class="stat-sub">{{ Str::limit($oldestOverdue->title, 28) }}
                    @if($oldestOverdue->job) &middot; {{ $oldestOverdue->job->job_number ?? '' }} @endif
                </div>
                @else
                <div class="stat-value">—</div>
                @endif
            </div>
        </div>
        <div class="col-6 col-md-3">
            <div class="stat-card">
                <div class="stat-label">Most Loaded</div>
                @if($mostLoaded)
                <div class="stat-value" style="font-size:1.4rem;">{{ $mostLoaded->assignee->name }}</div>
                <div class="stat-sub">{{ $mostLoaded->cnt }} outstanding</div>
                @else
                <div class="stat-value">—</div>
                @endif
            </div>
        </div>
    </div>

    {{-- Filters --}}
    <form method="GET" style="display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.25rem;align-items:center;">
        <a href="{{ route('tasks.report', ['outstanding'=>1]) }}"
           class="filter-btn {{ $outstandingOnly ? 'active' : '' }}">Outstanding only ●</a>
        <a href="{{ route('tasks.report', ['outstanding'=>0]) }}"
           class="filter-btn {{ !$outstandingOnly ? 'active' : '' }}">All open</a>
        <input type="hidden" name="outstanding" value="{{ $outstandingOnly ? 1 : 0 }}">
        <select name="assigned_to" class="filter-select" onchange="this.form.submit()">
            <option value="">All assignees</option>
            @foreach($users as $u)
            <option value="{{ $u->id }}" {{ request('assigned_to') == $u->id ? 'selected' : '' }}>{{ $u->name }}</option>
            @endforeach
        </select>
        <select name="priority" class="filter-select" onchange="this.form.submit()">
            <option value="">All priorities</option>
            <option value="high"   {{ request('priority')==='high'   ? 'selected':'' }}>High</option>
            <option value="medium" {{ request('priority')==='medium' ? 'selected':'' }}>Medium</option>
            <option value="low"    {{ request('priority')==='low'    ? 'selected':'' }}>Low</option>
        </select>
    </form>

    {{-- Grouped by Assignee --}}
    @forelse($grouped as $assigneeId => $assigneeTasks)
    @php $assignee = $assigneeTasks->first()->assignee; @endphp
    <div class="assignee-block">
        <div style="display:flex;align-items:center;gap:.6rem;margin-bottom:.75rem;">
            <span class="avatar">{{ strtoupper(substr($assignee->name,0,1)) }}{{ strtoupper(substr(explode(' ',$assignee->name)[1]??'',0,1)) }}</span>
            <span style="font-weight:600;color:#f3f4f6;">{{ $assignee->name }}</span>
            <span style="background:rgba(239,68,68,.15);color:#f87171;font-size:.7rem;padding:1px 8px;
                         border-radius:999px;">{{ $assigneeTasks->count() }} outstanding</span>
        </div>
        <table class="table report-table mb-0">
            <thead>
                <tr>
                    <th>Task</th>
                    <th>Linked Job</th>
                    <th>Priority</th>
                    <th>Due</th>
                </tr>
            </thead>
            <tbody>
                @foreach($assigneeTasks as $task)
                <tr style="cursor:pointer;" onclick="window.location='{{ route('tasks.show', $task) }}'">
                    <td style="color:#f3f4f6;">{{ $task->title }}</td>
                    <td>
                        @if($task->job)
                        <a href="{{ route('jobs.show', $task->job) }}" onclick="event.stopPropagation()"
                           style="color:#3b82f6;text-decoration:none;">
                            {{ $task->job->job_number ?? 'J-'.$task->job->id }} &middot; {{ $task->job->client_name ?? '' }}
                        </a>
                        @else <span class="text-muted">—</span> @endif
                    </td>
                    <td><span class="badge-priority badge-{{ $task->priority }}">{{ $task->priorityLabel() }}</span></td>
                    <td class="{{ $task->isOverdue() ? 'overdue-cell' : '' }}">
                        @if($task->due_date)
                            {{ $task->due_date->format('d M Y') }}
                            @if($task->isOverdue()) &middot; <small>{{ $task->daysOverdue() }}d late</small> @endif
                        @else — @endif
                    </td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
    @empty
    <div class="text-center text-muted py-5">
        <p class="mb-0">No outstanding tasks. Great work!</p>
    </div>
    @endforelse
</div>
@endsection