@extends('layouts.admin')

@section('title', 'Services')

@php
    $breadcrumbs = [['label' => 'Services']];
    $bulkFormId = 'bulk-services-form';
@endphp

@section('content')

    <div class="mb-5 flex flex-col gap-1">
        <h1 class="text-xl font-bold text-brand-ink">Services</h1>
        <p class="text-sm text-brand-muted">{{ count($services) }} service(s) en base.</p>
    </div>

    <form id="{{ $bulkFormId }}" method="POST" action="{{ route('admin.services.bulk') }}" class="hidden">@csrf</form>

    <div class="admin-card overflow-hidden" data-bulk-scope>
        <x-admin.list-toolbar add-label="Ajouter un service" :add-href="route('admin.services.create')">
            <select class="admin-field-input sm:w-40" aria-label="Filtrer par statut">
                <option>Tous les statuts</option>
                <option>Publie</option>
                <option>Brouillon</option>
            </select>
        </x-admin.list-toolbar>

        @if (count($services) > 0)
            <div class="overflow-x-auto">
                <table class="admin-table">
                    <thead>
                        <tr>
                            <th class="w-10"><input type="checkbox" data-select-all aria-label="Tout selectionner"></th>
                            <th>Service</th>
                            <th>Slug</th>
                            <th>Statut</th>
                            <th>Ordre</th>
                            <th>Modifie</th>
                            <th class="text-right">Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($services as $service)
                            <tr>
                                <td><input type="checkbox" data-row-select form="{{ $bulkFormId }}" name="ids[]" value="{{ $service['id'] }}" aria-label="Selectionner {{ $service['title'] }}"></td>
                                <td>
                                    <div class="flex items-center gap-3">
                                        <span class="flex h-9 w-9 shrink-0 items-center justify-center rounded-lg bg-brand-primary/10 text-brand-primary">
                                            <x-icon name="briefcase" class="h-4.5 w-4.5" />
                                        </span>
                                        <span class="font-medium text-brand-ink">{{ $service['title'] }}</span>
                                    </div>
                                </td>
                                <td class="font-mono text-xs text-brand-muted">{{ $service['slug'] }}</td>
                                <td><x-admin.status-badge :status="$service['status']" /></td>
                                <td>{{ $service['sort_order'] }}</td>
                                <td class="text-xs text-brand-muted">{{ $service['updated_at_demo'] }}</td>
                                <td>
                                    <div class="flex justify-end gap-1">
                                        <a href="{{ route('admin.services.edit', $service) }}" class="btn btn-ghost btn-sm" title="Modifier"><x-icon name="settings" class="h-4 w-4" /></a>
                                        <a href="{{ route('services') }}#{{ $service['slug'] }}" target="_blank" rel="noopener" class="btn btn-ghost btn-sm" title="Previsualiser"><x-icon name="eye" class="h-4 w-4" /></a>
                                        <form method="POST" action="{{ route('admin.services.duplicate', $service) }}">@csrf<button type="submit" class="btn btn-ghost btn-sm" title="Dupliquer"><x-icon name="duplicate" class="h-4 w-4" /></button></form>
                                        <form method="POST" action="{{ route('admin.services.toggle', $service) }}">@csrf @method('PATCH')<button type="submit" class="btn btn-ghost btn-sm" title="Activer/Desactiver"><x-icon name="eye" class="h-4 w-4" /></button></form>
                                        <form method="POST" action="{{ route('admin.services.archive', $service) }}">@csrf<button type="submit" data-confirm-action="archive" data-confirm-label="{{ $service['title'] }}" class="btn btn-ghost btn-sm" title="Archiver"><x-icon name="archive" class="h-4 w-4" /></button></form>
                                        <form method="POST" action="{{ route('admin.services.destroy', $service) }}">@csrf @method('DELETE')<button type="submit" data-confirm-action="delete" data-confirm-label="{{ $service['title'] }}" class="btn btn-ghost btn-sm text-admin-danger" title="Supprimer"><x-icon name="trash" class="h-4 w-4" /></button></form>
                                    </div>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
            <x-admin.pagination :current-page="1" :total-pages="1" :total-items="count($services)" />
        @else
            <x-admin.empty-state
                icon="briefcase"
                title="Aucun service pour le moment"
                description="Ajoutez votre premier service pour qu'il apparaisse sur le site public."
                action-label="Ajouter un service"
                :action-href="route('admin.services.create')"
            />
        @endif
    </div>

    <x-admin.bulk-actions-bar :actions="['toggle-status' => 'Activer/Desactiver', 'publish' => 'Publier', 'archive' => 'Archiver']" :form-id="$bulkFormId" />

@endsection
