@extends('layouts.internal')

@section('content')
@section('breadcrumb')
<div class="c-subheader justify-content-between px-3">
<ol class="breadcrumb border-0 m-0 px-0 px-md-3">
<li class="breadcrumb-item"><a href="/"><i class="fa fa-home"></i></a></li>
@if(url()->previous() != url()->current())
<li class="breadcrumb-item"><a href="{{url()->previous()}}">&leftarrow; Previous Page</a></li>
@endif						
<li class="breadcrumb-item"><a href="{{route('newsletter.index')}}">Role Management</a></li>

</ol>
</div>
@endsection
<style>
/* fallback */
@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/materialicons/v50/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format('woff2');
}

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}
  


    table.table th i {
        font-size: 13px;
        margin: 0 5px;
        cursor: pointer;
    }
    table.table td:last-child {
        width: 130px;
    }
    table.table td a {
        color: #a0a5b1;
        display: inline-block;
        margin: 0 5px;
    }
	table.table td a.view {
        color: #03A9F4;
    }
    table.table td a.edit {
        color: #FFC107;
    }
    table.table td a.delete {
        color: #E34724;
    }
    table.table td i {
        font-size: 19px;
    }    
 
</style>
<div class="card ">
          <div class="card-body">
    <!-- end header -->
    @if ($message = Session::get('success'))
        <div class="alert alert-success">
            <p>{{ $message }}</p>
        </div>
    @endif

    <div class="table-responsive">
            <table id="datatables" width="100%" class="table table-bordered">
            @can('role-create')
            <a class="btn btn-success" href="{{ route('roles.create') }}">Create New</a>
            @endcan
                <thead>
                    <tr>
                        <th>No</th>
                        <th>Name</th>
                        <th width="280px">Action</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($roles as $role)
                    <tr>
                        <td>{{ ++$i }}</td>
                        <td>{{ $role->name }}</td>
                        <td>
                                <a href="{{ route('roles.show',$role->id) }}" class="view" title="Show" data-toggle="tooltip"><i class="material-icons">&#xE417;</i></a>
                                <a href="{{ route('roles.edit',$role->id) }}" class="edit" title="Edit" data-toggle="tooltip"><i class="material-icons">&#xE254;</i></a>
                                {!! Form::open(['method' => 'DELETE','route' => ['roles.destroy', $role->id],'style'=>'display:inline']) !!}
                                    <a onclick="$(this).closest('form').submit()" class="delete" title="Delete" data-toggle="tooltip"><i class="material-icons">&#xE872;</i></a>
                                {!! Form::close() !!}
                        </td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
</div>

<script>
$(document).ready(function() {
    $('#datatables').dataTable({
    "bLengthChange": false});
    $('#datatables').attr('style', 'border-collapse: collapse !important');
} );
</script>
@endsection