@extends('layouts.team')
@section('title', 'Today')
@section('content')
<div class="row between" style="gap:16px;align-items:flex-end">
    <div class="stack" style="gap:6px"><span class="eyebrow">{{ now()->format('l, j F') }}</span><h1 class="d2">Good {{ now()->hour < 12 ? 'morning' : (now()->hour < 17 ? 'afternoon' : 'evening') }}, {{ explode(' ', $me->name)[0] }}.</h1></div>
    <div class="row" style="gap:8px"><a href="{{ route('team.timesheet') }}" class="btn btn-sm btn-ghost">Log time</a><a href="{{ route('team.leave') }}" class="btn btn-sm btn-ghost">Apply for leave</a></div>
</div>

<div class="grid g3">
    <section class="panel panel-b stack" style="gap:14px;border-color:var(--ink)">
        <div class="row between"><h2 class="ht">Attendance</h2>
            @if(! $today?->check_in)<span class="badge b-grey">Not checked in</span>
            @elseif($today->check_out)<span class="badge b-grey">Checked out</span>
            @elseif($today->break_started_at)<span class="badge b-warn">On break</span>
            @else<span class="badge b-good">{{ $today->status === 'wfh' ? 'Working from home' : 'Checked in' }}</span>@endif
        </div>
        <div class="row" style="gap:24px">
            <div class="stack"><span class="xs muted">In</span><span class="kpi-v" style="font-size:28px">{{ $today?->check_in?->format('H:i') ?? '—' }}</span></div>
            <div class="stack"><span class="xs muted">Out</span><span class="kpi-v" style="font-size:28px">{{ $today?->check_out?->format('H:i') ?? '—' }}</span></div>
            <div class="stack"><span class="xs muted">Worked</span><span class="kpi-v" style="font-size:28px">{{ $today?->check_in ? $today->workedLabel() : '—' }}</span></div>
        </div>
        <span class="xs muted">Now <span data-clock>{{ now()->format('H:i') }}</span> · breaks {{ $today?->break_minutes ?? 0 }} min</span>
        <div class="row" style="gap:8px">
            @if(! $today?->check_in)
                <form method="post" action="{{ route('team.checkin') }}">@csrf<button class="btn btn-sm">Check in</button></form>
            @elseif(! $today->check_out)
                <form method="post" action="{{ route('team.checkout') }}" data-confirm="Check out for the day?">@csrf<button class="btn btn-sm">Check out</button></form>
                <form method="post" action="{{ route('team.break') }}">@csrf<button class="btn btn-sm btn-ghost">{{ $today->break_started_at ? 'End break' : 'Start break' }}</button></form>
            @endif
        </div>
    </section>
    <section class="panel panel-b stack" style="gap:12px">
        <h2 class="ht">This week</h2>
        <div class="row between small"><span class="muted">Hours logged</span><span class="b tnum">{{ $weekHours + 0 }} of {{ $me->weekly_hours }}</span></div>
        <div class="bar"><span style="width:{{ min(100, round($weekHours / max(1, $me->weekly_hours) * 100)) }}%"></span></div>
        <div class="small"><span class="muted">Leave left</span><br><span class="b">{{ collect($balances)->filter(fn ($b) => $b['total'] > 0)->map(fn ($b) => ($b['left'] + 0).' '.strtolower(explode(' ', $b['type']->name)[0]))->implode(' · ') }}</span></div>
        <a href="{{ route('team.timesheet') }}" class="link small" style="align-self:flex-start">Log today’s time</a>
    </section>
    <section class="panel panel-b stack" style="gap:10px">
        <h2 class="ht">Announcements</h2>
        <div class="stack small" style="gap:8px">
            @foreach($announcements as $a)<span><span class="b">{{ $a->title }}</span>@if($a->body) · <span class="muted">{{ $a->body }}</span>@endif</span>@endforeach
            @if($holiday)<span><span class="b">Next holiday</span> · {{ $holiday->name }}, {{ $holiday->date->format('D j M') }}</span>@endif
            @foreach($birthdays as $b)<span>🎂 <span class="b">{{ $b->name }}</span> · birthday {{ $b->date_of_birth->format('j M') }}</span>@endforeach
        </div>
    </section>
</div>

<div class="cols-main">
    <section class="panel" style="min-width:0">
        <div class="panel-h"><h2 class="ht">My tasks <span class="muted">{{ $tasks->where('status', '!=', 'done')->count() }} open</span></h2><span class="xs muted">Only tasks assigned to you</span></div>
        <div class="list">
            @forelse($tasks as $t)
                <div class="li" style="align-items:center">
                    <form method="post" action="{{ route('team.tasks.update', $t) }}">@csrf @method('PATCH')<input type="hidden" name="status" value="{{ $t->status === 'done' ? 'todo' : 'done' }}">
                        <button class="tick" aria-label="Mark {{ $t->title }} {{ $t->status === 'done' ? 'not done' : 'done' }}" style="cursor:pointer;{{ $t->status === 'done' ? 'background:var(--ink);border-color:var(--ink)' : 'background:var(--white)' }}">{{ $t->status === 'done' ? '✓' : '' }}</button></form>
                    <a href="{{ route('team.projects.show', $t->project_id) }}" class="stack" style="gap:2px;flex:1;min-width:0;text-decoration:none"><span class="b" style="{{ $t->status === 'done' ? 'text-decoration:line-through;color:var(--muted)' : '' }}">{{ $t->title }}</span><span class="xs muted">{{ $t->project->name }} · {{ $t->project->client->company }}</span></a>
                    @if($t->status !== 'done')
                    <form method="post" action="{{ route('team.tasks.update', $t) }}">@csrf @method('PATCH')<select name="status" class="input input-sm" style="width:auto;min-height:32px" data-autosubmit aria-label="Status">@foreach(\App\Models\Task::STATUSES as $k => $v)<option value="{{ $k }}" @selected($t->status === $k)>{{ $v }}</option>@endforeach</select></form>
                    @endif
                    @if($t->status === 'done')<span class="badge b-good">Done</span>@elseif($t->due_date)<span @class(['badge', 'b-bad' => $t->due_date->isPast(), 'b-warn' => $t->due_date->isToday()])>{{ $t->due_date->isToday() ? 'Today' : $t->due_date->format('j M') }}</span>@endif
                </div>
            @empty<x-empty>No tasks assigned. Enjoy the calm.</x-empty>@endforelse
        </div>
    </section>
    <aside class="stack" style="gap:16px;min-width:0">
        <section class="panel"><div class="panel-h"><h2 class="ht">My projects</h2></div>
            <div class="list small">@forelse($projects as $p)<a href="{{ route('team.projects.show', $p) }}" class="li" style="text-decoration:none;align-items:center"><span class="stack" style="flex:1;gap:4px"><span class="b">{{ $p->name }}</span><span class="bar"><span style="width:{{ $p->progress }}%"></span></span></span><span class="xs muted">{{ $p->due_date?->format('j M') }}</span></a>@empty<x-empty>Not on any active project.</x-empty>@endforelse</div>
        </section>
        <section class="panel"><div class="panel-h"><h2 class="ht">Client feedback</h2></div>
            <div class="list small">@forelse($feedback as $a)<a href="{{ route('team.projects.show', $a->project_id) }}#approvals" class="li" style="text-decoration:none"><span class="stack" style="gap:2px;flex:1"><span class="b">{{ $a->title }} · round {{ $a->round }}</span><span class="xs muted">{{ $a->project->client->company }}@if($a->client_comment) · “{{ \Illuminate\Support\Str::limit($a->client_comment, 50) }}”@endif</span></span><x-badge :status="$a->status" /></a>@empty<x-empty>Nothing yet.</x-empty>@endforelse</div>
        </section>
        <section class="panel"><div class="panel-h"><h2 class="ht">Latest payslip</h2><a href="{{ route('team.payslips') }}" class="small b" style="text-decoration:none">All →</a></div>
            <div class="panel-b row between">@if($payslip)<span class="small">{{ $payslip->run->label() }}</span><span class="b tnum">{{ inr($payslip->net) }}</span>@else<span class="small muted">No payslips yet.</span>@endif</div>
        </section>
    </aside>
</div>
@endsection