@extends('layouts.app')

@section('titre', 'Planning des effectifs')

@section('contenu')
    @php
        $couleurs = [
            'marque' => 'bg-marque-100 text-marque-900',
            'accent' => 'bg-accent-100 text-accent-900',
            'ambre' => 'bg-amber-100 text-amber-900',
            'violet' => 'bg-violet-100 text-violet-900',
            'rouge' => 'bg-red-100 text-red-900',
            'slate' => 'bg-slate-100 text-slate-600',
        ];
    @endphp

    <div class="mb-4 flex flex-wrap items-start justify-between gap-3">
        <div>
            <h1 class="text-xl font-semibold">Planning des effectifs</h1>
            <p class="text-sm text-slate-500">
                {{ $vue === 'semaine'
                    ? 'Semaine du '.$debut->translatedFormat('j F').' au '.$fin->translatedFormat('j F Y')
                    : ucfirst($debut->translatedFormat('F Y')) }}
            </p>
        </div>
        <div class="flex flex-wrap gap-2">
            <a href="{{ route('planning-travail', ['vue' => $vue, 'onglet' => $onglet, 'depuis' => $precedent]) }}"
               class="bouton-secondaire">Précédent</a>
            <a href="{{ route('planning-travail', ['vue' => $vue, 'onglet' => $onglet, 'depuis' => now()->toDateString()]) }}"
               class="bouton-secondaire">Aujourd'hui</a>
            <a href="{{ route('planning-travail', ['vue' => $vue, 'onglet' => $onglet, 'depuis' => $suivant]) }}"
               class="bouton-secondaire">Suivant</a>
        </div>
    </div>

    <div class="mb-4 flex flex-wrap gap-2">
        @if ($moi)
            <div class="flex gap-1 rounded-lg bg-slate-100 p-1 text-sm">
                @foreach (['equipe' => "L'équipe", 'moi' => 'Mon planning'] as $valeur => $libelle)
                    <a href="{{ route('planning-travail', ['vue' => $vue, 'onglet' => $valeur, 'depuis' => $debut->toDateString()]) }}"
                       @class([
                           'rounded-md px-3 py-1.5 font-medium',
                           'bg-white text-marque-700 shadow-sm' => $onglet === $valeur,
                           'text-slate-600' => $onglet !== $valeur,
                       ])>{{ $libelle }}</a>
                @endforeach
            </div>
        @endif

        <div class="flex gap-1 rounded-lg bg-slate-100 p-1 text-sm">
            @foreach (['mois' => 'Mois', 'semaine' => 'Semaine'] as $valeur => $libelle)
                <a href="{{ route('planning-travail', ['vue' => $valeur, 'onglet' => $onglet, 'depuis' => $debut->toDateString()]) }}"
                   @class([
                       'rounded-md px-3 py-1.5 font-medium',
                       'bg-white text-marque-700 shadow-sm' => $vue === $valeur,
                       'text-slate-600' => $vue !== $valeur,
                   ])>{{ $libelle }}</a>
            @endforeach
        </div>
    </div>

    <form method="POST" action="{{ route('planning-travail.enregistrer') }}">
        @csrf

        <div class="overflow-x-auto rounded-xl border border-slate-200 bg-white">
            <table class="w-full text-sm">
                <thead>
                    <tr class="border-b border-slate-200">
                        <th class="sticky left-0 z-10 bg-white px-3 py-2 text-left font-medium text-slate-500">
                            Salarié
                        </th>
                        @foreach ($jours as $jour)
                            <th @class([
                                'px-1 py-2 text-center font-medium',
                                'bg-marque-50 text-marque-800' => $jour->isToday(),
                                'text-slate-400' => $jour->isWeekend() && ! $jour->isToday(),
                                'text-slate-500' => ! $jour->isWeekend() && ! $jour->isToday(),
                            ])>
                                <span class="block text-xs">{{ mb_substr($jour->translatedFormat('D'), 0, 3) }}</span>
                                <span class="block tabular-nums">{{ $jour->format('j') }}</span>
                            </th>
                        @endforeach
                    </tr>
                </thead>
                <tbody>
                    @php $poleCourant = false; @endphp
                    @forelse ($equipiers as $equipier)
                        @php
                            $motifsVisibles = $peutVoirLesMotifs($equipier);
                            // Chaque salarié ne se voit proposer que les journées de son pôle.
                            $choixPossibles = $types->filter(fn ($t) => $t->convientAuPole($equipier->pole_id));
                        @endphp

                        {{-- Un manager de plusieurs pôles voit ses équipes séparées. --}}
                        @if ($equipier->pole_id !== $poleCourant && $onglet === 'equipe')
                            @php $poleCourant = $equipier->pole_id; @endphp
                            <tr class="bg-slate-50">
                                <td colspan="{{ count($jours) + 1 }}"
                                    class="sticky left-0 px-3 py-1.5 text-xs font-semibold tracking-wide text-slate-500 uppercase">
                                    {{ $equipier->pole?->nom ?? 'Sans pôle' }}
                                </td>
                            </tr>
                        @endif

                        <tr class="border-b border-slate-100 last:border-0">
                            <td class="sticky left-0 z-10 bg-white px-3 py-2 font-medium whitespace-nowrap">
                                {{ $equipier->nomComplet() }}
                                @if ($moi && $equipier->id === $moi->id)
                                    <span class="text-xs font-normal text-marque-700">vous</span>
                                @endif
                            </td>
                            @foreach ($jours as $jour)
                                @php
                                    $journee = $journees[$equipier->id][$jour->toDateString()][0] ?? null;
                                    $type = $journee?->type;
                                    $teinte = $couleurs[$type?->couleur ?? 'slate'] ?? $couleurs['slate'];
                                @endphp
                                <td class="px-0.5 py-1 text-center align-middle">
                                    @if ($estManager)
                                        <select name="journees[{{ $equipier->id }}][{{ $jour->toDateString() }}]"
                                                class="w-full min-w-20 rounded-md border-0 px-1 py-1.5 text-xs {{ $teinte }}">
                                            <option value=""></option>
                                            @foreach ($choixPossibles as $choix)
                                                <option value="{{ $choix->code }}"
                                                        @selected($type?->code === $choix->code)>
                                                    {{ $choix->abrege }}
                                                </option>
                                            @endforeach
                                        </select>
                                    @elseif ($type)
                                        <span class="block rounded-md px-1 py-1.5 text-xs {{ $teinte }}"
                                              title="{{ $type->libellePour($motifsVisibles) }}">
                                            {{ $type->abregePour($motifsVisibles) }}
                                        </span>
                                    @else
                                        <span class="block py-1.5 text-xs text-slate-300">&mdash;</span>
                                    @endif
                                </td>
                            @endforeach
                        </tr>
                    @empty
                        <tr>
                            <td colspan="{{ count($jours) + 1 }}" class="px-3 py-4 text-slate-500">
                                Aucun salarié dans vos pôles. Ils s'ajoutent depuis la liste des salariés.
                            </td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>

        @if ($estManager)
            <div class="sticky bottom-0 mt-3 border-t border-slate-200 bg-slate-50 py-3">
                <button type="submit" class="bouton-principal">Enregistrer le planning</button>
                <span class="ml-3 text-sm text-slate-500">
                    L'équipe voit le changement immédiatement, sans rien réimprimer.
                </span>
            </div>
        @endif
    </form>

    <div class="carte mt-4">
        <h2 class="mb-2 font-semibold">Les journées</h2>
        <div class="flex flex-wrap gap-3 text-sm">
            @foreach ($types as $type)
                <span class="flex items-center gap-2">
                    <span class="rounded px-2 py-0.5 text-xs {{ $couleurs[$type->couleur] ?? $couleurs['slate'] }}">
                        {{ $type->abrege }}
                    </span>
                    <span class="text-slate-700">
                        {{ $type->libelle }}
                        @if ($type->horaires())
                            <span class="text-slate-500">&middot; {{ $type->horaires() }}</span>
                        @endif
                    </span>
                </span>
            @endforeach
        </div>
        @unless ($estManager)
            <p class="mt-3 text-sm text-slate-500">
                Le motif d'une absence n'est visible que de la personne concernée et des managers.
            </p>
        @endunless
    </div>
@endsection