@props(['assignment'])

<x-table.actions>
    @can('view', $assignment->corporateNumber)
        <a href="{{ route('inventory.corporate-numbers.show', $assignment->corporateNumber) }}"
           class="text-gray-700 hover:underline"
           title="Número corporativo">
            <i class="fa-solid fa-sim-card"></i>
        </a>
    @endcan

    @if($assignment->isOpen())
        @can('update', $assignment)
            <button type="button"
                    class="text-green-600 hover:text-green-800"
                    title="Dar baixa"
                    x-on:click.prevent="$dispatch('open-modal', 'number-return-{{ $assignment->id }}')">
                <i class="fa-solid fa-rotate-left"></i>
            </button>

            <x-modal name="number-return-{{ $assignment->id }}" :show="false" maxWidth="md">
                <form method="POST" action="{{ route('inventory.corporate-number-assignments.return', $assignment) }}" class="p-6 space-y-4">
                    @csrf
                    @method('PATCH')
                    <h2 class="text-lg font-medium text-gray-900">Dar baixa na alocação</h2>
                    <p class="text-sm text-gray-600">Informe uma justificativa para finalizar esta alocação.</p>

                    <div>
                        <x-form.label for="return_reason_number_{{ $assignment->id }}" value="Justificativa da baixa" />
                        <x-form.textarea id="return_reason_number_{{ $assignment->id }}" name="return_reason" rows="3" required :value="old('return_reason')" />
                        <x-form.error name="return_reason" />
                    </div>

                    <div class="flex justify-end gap-2 pt-2">
                        <button type="button" class="px-4 py-2 text-sm text-gray-600 hover:text-gray-900"
                                x-on:click="$dispatch('close-modal', 'number-return-{{ $assignment->id }}')">
                            Cancelar
                        </button>
                        <x-ui.button type="submit">Confirmar baixa</x-ui.button>
                    </div>
                </form>
            </x-modal>
        @endcan
    @endif
</x-table.actions>