@extends('layouts.admin')
@section('scripts')
<script type="text/javascript">
    async function borrarCategoria(id){
        swal({
            title: '¿Deseas eliminar esta categoria?',
            text: "Una vez eliminada no puede recuperarse",
            icon: 'warning',
            buttons: [true, "Sí"]
        }).then((result)=>{
            if(result){
                url= "categorias/"+id;
                $.ajax({
                headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
                type: "post",
                url: url,
                data: {
                    id: id,
                    _method: 'DELETE'
                }, success: function () {
                    swal({
                          title: 'Categoria Eliminada',
                          text: 'Se eliminó la categoria',
                          icon: 'success'
                        });
                        setInterval(function() {
                    window.location.reload();
                }, 1000);
                }
                });
                } 
        });
    }
</script>
@endsection

@section('content')
<h1 class="text-center">Administración de categorias</h1>
<div class="text-center table-responsive-md ">
    <table class="table">
        <thead class="bg-dark text-light" >
            <tr>
                <th scole="col">Nombre</th>
                <th></th>
            </tr>
            <tbody>  
                @foreach($categorias as $categoria)
                        
                <tr>
                 <td>{{$categoria->nombre}}</td>
                 <td> 
                    <a href="{{route('categorias.edit', ['id'=>$categoria->id])}}" class="btn btn-dark  mb-2 d-block">Editar</a>
                    <a onClick="borrarCategoria({{$categoria->id}})" class="btn btn-danger  mb-2 d-block">Eliminar <i class="fas fa-user-edit"></i></a>
                </td>
                 </tr>
                <!-- Fin del for each -->
                @endforeach       
                             
                    <tr>
                     <a href="{{route('categorias.create')}}" class="btn btn-primary d-block">Agregar nueva categoria</a>
                    </tr>
            </tbody>
        </thead>
    </table>
    {{$categorias->links('pagination::bootstrap-4')}}
    @if(session('exito'))
    <script type="application/javascript">
         swal({
            title: '{{session('exito')}}',
            text: '¡Operación exitosa!',
            icon: 'success'
            });
    </script>
 @endif

</div>
    
@endsection