@extends('admin.main')
@section('content')
<div class="row">
   <div class="col-md-12">
      <div class="card">
         <div class="card-header">
            <h4 class="card-title">Roles
            @can('create.role')
               <a href="{{ route('roles.create') }}" class="btn btn-primary float-right">Add Role</a>
            @endcan
          </h4>
        </div>
         <div class="card-body sales_new_table">
            @include('admin.msg')
            <div class="table-responsive">
               <table class="display table-striped table table-bordered" id="zero_configuration_table1">
                  <thead>
                     <tr>
                        <th>Id</th>
                        <th>Name</th>
                        <th width="40%">Action</th>
                     </tr>
                  </thead>
                  <tbody>
                     @foreach ($roles as $role)
                     <tr>
                        <td>{{ $role->id }}</td>
                        <td>{{ ucfirst($role->name) }}</td>
                        <td>
                           <a href="{{ route('add-role-permissions', $role->id) }}" class="btn btn-primary btn-sm">
                            Permission
                           </a>
                           @can('update.role')
                             <a href="{{ route('roles.edit', $role->id) }}" class="btn btn-primary btn-sm text-white ml-1" data-toggle="tooltip" title="Edit"> <i class="i-Pen-2"></i></a>
                           @endcan
                           @can('delete.role')
                            <form action="{{ route('roles.destroy', $role->id) }}" method="POST" class="d-inline">
                               @csrf
                               @method('DELETE')
                               <button type="submit" class="btn btn-danger mx-2 btn-sm" data-toggle="tooltip" title="Delete">
                                   <img src="{{ asset('/img/del.png') }}" width="15" alt="Delete">
                               </button>
                           </form>
                           @endcan
                        </td>
                     </tr>
                     @endforeach
                  </tbody>
               </table>
            </div>
         </div>
      </div>
   </div>
</div>
@endsection