@extends('layouts.app')
@section('title', 'My work')

@section('content')
<x-page-header title="My work" subtitle="Work assigned to you. Open one to post progress and photos." />

<div class="chip-row mb-3">
    <a class="chip {{ $state === 'active' ? 'active' : '' }}" href="{{ route('my-work.index') }}">In progress <span class="n">{{ $counts['active'] }}</span></a>
    <a class="chip {{ $state === 'completed' ? 'active' : '' }}" href="{{ route('my-work.index', ['state' => 'completed']) }}">Completed <span class="n">{{ $counts['completed'] }}</span></a>
</div>

<div class="row g-3 stagger">
    @forelse ($assignments as $a)
        @php
            $last = $a->last_update_at ? \Illuminate\Support\Carbon::parse($a->last_update_at) : null;
            $late = $a->due_date && $a->due_date->isPast() && ! $a->isCompleted();
        @endphp
        <div class="col-md-6 col-xl-4">
            <a href="{{ route('my-work.show', $a) }}" class="card card-body card-hover text-decoration-none h-100">
                <div class="d-flex align-items-start gap-2 mb-2">
                    <div class="min-w-0">
                        <div class="fw-semibold" style="color: var(--app-heading)">{{ $a->order->order_no }}</div>
                        <div class="small text-muted">{{ $a->number() }}{{ $a->description ? ' · '.$a->description : '' }}</div>
                    </div>
                    <span class="badge-soft badge-soft-{{ $a->isCompleted() ? 'success' : ($late ? 'danger' : 'warning') }} no-dot ms-auto">{{ $a->isCompleted() ? 'Done' : ($late ? 'Late' : $a->progress.'%') }}</span>
                </div>
                <div class="mini-progress {{ $a->progress >= 100 ? '' : 'is-partial' }} mb-2" style="height:8px" role="progressbar" aria-valuenow="{{ $a->progress }}" aria-valuemin="0" aria-valuemax="100" aria-label="{{ $a->progress }}% done"><span style="width: {{ $a->progress }}%"></span></div>
                <div class="small text-muted d-flex flex-wrap gap-x-3 gap-2">
                    <span><i class="bi bi-calendar-event" aria-hidden="true"></i> {{ $a->due_date ? 'Due '.$a->due_date->format('d M Y') : 'No due date' }}</span>
                    <span><i class="bi bi-camera" aria-hidden="true"></i> {{ $a->photos_count }}</span>
                    <span class="{{ $a->isStale() ? 'text-warning' : '' }}"><i class="bi bi-clock-history" aria-hidden="true"></i> {{ $last ? 'Updated '.$last->diffForHumans() : 'No update yet' }}</span>
                </div>
            </a>
        </div>
    @empty
        <div class="col-12"><div class="card"><div class="card-body"><x-empty icon="hammer" :title="$state === 'active' ? 'Nothing in progress' : 'Nothing completed yet'" text="Work the office assigns to you appears here." /></div></div></div>
    @endforelse
</div>
@endsection