@extends('layouts.app')

@section('content')
    <div class="container-fluid">
        @if(session('success'))
            <div class="alert alert-success alert-dismissible fade show" role="alert">
                {{ session('success') }}
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            </div>
        @endif

        <div class="d-flex justify-content-between align-items-center mb-4">
            <h1>Lista de Categorias</h1>
            <a href="{{ route('admin.categorias.create') }}" class="btn btn-primary">Adicionar Nova Categoria</a>
        </div>

        <div class="card">
            <div class="card-body">
                <table class="table table-hover">
                    <thead>
                        <tr>
                            <th>ID</th>
                            <th>Nome</th>
                            <th class="text-end">Ações</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse ($categorias as $cat)
                            <tr>
                                <td>{{ $cat->id }}</td>
                                <td>{{ $cat->nome }}</td>
			    
{{-- Célula da Tabela com os Botões de Ação --}}
<td class="text-end">
    <a href="{{ route('admin.categorias.edit', $cat->id) }}" class="btn btn-sm btn-secondary">Editar</a>

    {{-- Formulário de Exclusão --}}
    <form action="{{ route('admin.categorias.destroy', $cat->id) }}" method="POST" class="d-inline">
        @csrf
        @method('DELETE')
        <button type="submit" class="btn btn-sm btn-danger"
                onclick="return confirm('Tem certeza que deseja excluir esta categoria? Esta ação não pode ser desfeita.')">
            Excluir
        </button>
    </form>
</td>
</tr>
                        @empty
                            <tr>
                                <td colspan="3" class="text-center">Nenhuma categoria cadastrada.</td>
                            </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </div>
@endsection