@extends("layouts.app")

@section("content")
<div id="content-page" class="content-page">
  <div class="container-fluid">
    <div class="row row-eq-height">
      <div class="col-sm-12">
        <div class="iq-card">
          <div class="iq-card-header d-flex justify-content-between">
            <div class="iq-header-title">
              <a href="{{url('/sistema/roles/crear')}}" class="btn btn-outline-success mt-3 mb-3"><i class="ion-ios-plus"></i> Agregar</a>
            </div>
          </div>
          <div class="iq-card-body">
            <table class="table">
              <thead>
                <tr>
                  <th scope="col"></th>
                  <th scope="col">#</th>
                  <th scope="col">Nombre</th>
                  <th scope="col">Permisos</th>
                </tr>
              </thead>
              <tbody>
                @if(count($permisos)>0)
                  @foreach($permisos as $p)
                    <tr>
                      <td>
                        <div class="btn-group" role="group">
                          <button id="btnGroupDrop1" type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            Acciones
                          </button>
                          <div class="dropdown-menu" aria-labelledby="btnGroupDrop1" style="">
                            <a class="dropdown-item" href="{{url('/sistema/roles/editar/'.$p->id)}}">
                              Editar
                            </a>
                          </div>
                        </div>
                      </td>
                      <td>{{$p->id}}</td>
                      <td>{{$p->name}}</td>
                      <td>{{$p->permissions}}</td>
                    </tr>
                  @endforeach
                @else
                  <tr>
                    <td colspan="10">
                      Sin productos
                    </td>
                  </tr>
                @endif
              </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
@endsection