@php
    use App\Enums\RoleEnum;
    use Illuminate\Support\Str;
    use Illuminate\Support\Number;
@endphp

<x-page :title="__('options')">
    <x-slot:headerActions>
        {{ $this->createAction }}
    </x-slot:headerActions>

    <div class="mx-auto flex flex-col w-full items-stretch gap-4">
        <div class="flex items-center justify-end">

        </div>

        <x-table class="w-full">
            <x-table.head class="bg-gray-50">
                <x-table.row>
                    <th scope="col" class="pl-4 sm:w-12 lg:pl-6">
                        <div class="flex h-6 items-center">
                            <label>
                                <input type="checkbox" wire:model.live="selectAll"
                                       class="h-4 w-4 rounded border-gray-300 shadow text-primary-600 focus:ring-primary-600">
                            </label>
                        </div>
                    </th>
                    <x-table.head-cell>{{ __('label') }}</x-table.head-cell>
                    <x-table.head-cell>{{ __('values') }}</x-table.head-cell>
                    <x-table.head-cell>{{ __('column_type') }}</x-table.head-cell>
                    <x-table.head-cell-action class="float-right"/>
                </x-table.row>
            </x-table.head>
            <x-table.body>
                @forelse($this->options as $option)
                    <x-table.row @class([
                            'bg-primary-50/80' => collect($this->selectedOptions)->contains($option['uuid'])])
                    >
                        <x-table.columns.text class="relative pl-4 lg:pl-6">
                            @if(collect($this->selectedOptions)->contains($option['uuid']))
                                <div class="absolute inset-y-0 left-0 w-0.5 bg-primary-600"></div>
                            @endif
                            <div class="flex h-6 items-center">
                                <label for="option-{{ $option['uuid'] }}" class="sr-only"></label>
                                <input id="option-{{ $option['uuid'] }}"
                                       type="checkbox"
                                       value="{{ $option['uuid'] }}"
                                       wire:model.live="selectedOptions"
                                       class="h-4 w-4 rounded border-gray-300 shadow text-primary-600 focus:ring-primary-600">
                            </div>
                        </x-table.columns.text>
                        <x-table.columns.text class="truncate">
                            {{ $option['libelle'] }}
                        </x-table.columns.text>
                        <x-table.columns.text>
                            @foreach($option['valeur'] as $value)
                                @if(!blank($value))
                                    <x-filament::badge>
                                        {{ $value }}
                                    </x-filament::badge>
                                @endif
                            @endforeach
                        </x-table.columns.text>
                        <x-table.columns.text>
                            {{ \App\Enums\TypeColonneEnum::tryFrom($option['type'])?->label }}
                        </x-table.columns.text>
                        <x-slot:actions wire:key="{{ $option['uuid'] }}">
                            {{ ($this->editAction)(['optionId' => $option['uuid']]) }}
                            {{--                            {{ ($this->deleteAction)(['optionId' => $option['uuid']]) }}--}}
                        </x-slot:actions>
                    </x-table.row>
                @empty
                @endforelse
            </x-table.body>
        </x-table>
    </div>
    <x-filament-actions::modals/>
</x-page>