@extends('layouts.tenant.master')
@section('title', 'User Menu')

@section('css')
<link rel="stylesheet" type="text/css" href="{{ dynamic_url('assets/main/css/datatables.css') }}">
<link rel="stylesheet" type="text/css" href="{{ dynamic_url('assets/main/css/datatable-extension.css') }}">
@endsection

@section('style')
@endsection

@section('breadcrumb-title')
    <h2>User <span>Management </span></h2>
@endsection

@section('breadcrumb-items')
    <li class="breadcrumb-item">Users</li>
    <li class="breadcrumb-item active">List</li>
@endsection

@section('content')

    <table class="table table-bordered">
        <tr>
            <th width="100px">No</th>
            <th>Name</th>
            <th width="280px">Action</th>
        </tr>
        @foreach ($roles as $key => $role)
            <tr>
                <td>{{ ++$i }}</td>
                <td>{{ $role->name }}</td>
                <td>
                    <a class="btn btn-info btn-sm" href="{{ route('roles.show', $role->id) }}"><i
                            class="fa-solid fa-list"></i> Show</a>
                    @can('role-edit')
                        <a class="btn btn-primary btn-sm" href="{{ route('roles.edit', $role->id) }}"><i
                                class="fa-solid fa-pen-to-square"></i> Edit</a>
                    @endcan

                    @can('role-delete')
                        <form method="POST" action="{{ route('roles.destroy', $role->id) }}" style="display:inline">
                            @csrf
                            @method('DELETE')

                            <button type="submit" class="btn btn-danger btn-sm"><i class="fa-solid fa-trash"></i>
                                Delete</button>
                        </form>
                    @endcan
                </td>
            </tr>
        @endforeach
    </table>

    {!! $roles->links('pagination::bootstrap-5') !!}
@endsection

@section('script')
<script src="{{ dynamic_url('assets/main/js/datatable/datatables/jquery.dataTables.min.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/dataTables.buttons.min.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/jszip.min.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/buttons.colVis.min.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/pdfmake.min.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/vfs_fonts.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/dataTables.autoFill.min.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/dataTables.select.min.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/buttons.bootstrap4.min.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/buttons.html5.min.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/buttons.print.min.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/dataTables.bootstrap4.min.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/dataTables.responsive.min.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/responsive.bootstrap4.min.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/dataTables.keyTable.min.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/dataTables.colReorder.min.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/dataTables.fixedHeader.min.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/dataTables.rowReorder.min.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/dataTables.scroller.min.js') }}"></script>
<script src="{{ dynamic_url('assets/main/js/datatable/datatable-extension/custom.js') }}"></script>
@endsection