@extends('flatlab::layout')

@section('header_title')
    Roles
@endsection

@section('main-content')
<div class="panel">
    <div class="panel-heading">
        <h3><i class="fa fa-id-card-o"></i> Roles</h3>
    </div>
    <div class="panel-body">
        <div class="adv-table">
            <div class="clearfix">
                <div class="btn-group">
                    <a href="{{ route('roles.create') }}" class="btn btn-primary btn-shadow">Nuevo Rol</a>
                </div>              
            </div>
            <table class="display nowrap hover table table-bordered table-responsive" id="roles">
                <thead>
                    <tr>
                        <th>Rol</th>
                        <th>Permiso</th>
                        <th>Acciones</th>
                    </tr>
                </thead>
            </table>
        </div>
    </div>
</div>
@include('flatlab::helpers.modal',['accion'=>'borrar','titulo'=>'Borrar Rol','mensaje'=>'Está seguro que quiere borrar este rol?'])
@endsection
@push('extra_scripts')
   <script type="text/javascript">
    $(document).ready(function() {
        roles = $('#roles').DataTable({
            "ajax": "{{ route('getRoles') }}",
            "columns": [
                {data: 'name', name: 'name'},
                {data: 'permisos', name: 'permisos'},
                {data: 'acciones', name: 'acciones', orderable: false, searchable: false,  className: "nowrap" }
            ]
        }).on('click', '.acciones button', function (e) {
            e.preventDefault();
            var id = $(this).parent().data("id");
            var url = 'roles/'+ id;

            if($(this).data("action") == 'editar'){
                window.location.href = url + '/edit';
            }
            if($(this).data("action") == 'borrar'){
                $('#borrar').modal('show')
                $('.confirma').one('click', function(){
                    axios.delete(url)
                        .then(function (response) {
                            $('#borrar').modal('hide');                 
                            roles.draw(true);    
                            console.log(response);
                            toastr.success(response.data)
                        })
                        .catch(function (response) {
                            $('#borrar').modal('hide');    
                            toastr.error('No puede borrar este rol!')
                        })
                });
            }
        })
    });
    </script> 
@endpush
