@extends('layouts.admin.master')
@section('title')
    Roles
@endsection
@section('content')
    <div class="container-fluid">
        <div class="row">
            <div class="col">
                <div class="card dashboard-custom-card">
                    <div class="card-body">
                        <div class="custom-card-header d-flex justify-content-between">
                            <h4>Roles List</h4>
                            <a href="{{ route('admin.roles.create') }}" class="btn btn-primary"><i class="fa fa-plus-circle"></i>
                                Add New</a>
                        </div>
                        <div class="table-responsive">
                            <table class="table datatable custom-table dt-responsive nowrap">
                            </table>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
    @include('utils.delete-confirm-modal')
@endsection

@push('js')
    <script>
        var table;
        $(function() {
            table = $('.datatable').DataTable({
                processing: true,
                serverSide: true,
                ajax: "{{ route('admin.roles.index') }}",
                columns: [{
                        title: "SL#",
                        data: null,
                        render: function(data, type, row, meta) {
                            return meta.row + 1;
                        },
                        searchable: false,
                        orderable: false
                    },
                    {
                        title: "Name",
                        data: "name"
                    },
                    {
                        title: "Guard Name",
                        data: "guard_name"
                    },
                    {
                        title: "Action",
                        data: "action",
                        orderable: false,
                        searchable: false
                    }
                ]
            });

            $(document, 'td').on('click', '.delete', function(e) {
                $('#delete_form')[0].action = $(this).data('action');
                $('#delete_modal').modal('show');
            });
        });
    </script>
@endpush