@extends(getTemplate('admin'))
@section('content')

    @push('custom-css')

    @endpush
	<div class="gadmin-pagesidebar-width-1">
		<div class="panel panel-default gadmin-pagesidebar-width-1-panel ">
			<!-- begin panel-heading -->
			<div class="panel-heading gadmin-pagesidebar-width-1-heading">
				<h4 class="panel-title">{{__('admin.members_management')}}</h4>
			</div>
			<!-- end panel-heading -->
			<div class="gadmin-pagesidebar-body">
				<div class="gadmin-pagesidebar-main">
					<ul class="nav gadmin-pagesidebar-ul">
						<li>
							<a href="{{url('admin/users/roles/create')}}" class=" gadmin-pagesidebar-options-success"><i class="fa fa-plus"></i> {{__('core.add_new_group')}}</a>
						</li>
						<li>
						<form id="deleteForm" class="gadmin-pagesidebar-options-danger-button" action="{{asset('admin/main/bulk_delete/Role')}}" method="POST">
							<button type="submit" id="deleteChecked" name="bulkDelete" class="gadmin-pagesidebar-options-danger"  style="display:none"><i class="fa fa-trash"></i> {{__('core.bulk_delete')}}</button>
						</form>
						</li>
					</ul>
					<ul class="nav gadmin-pagesidebar-ul gadmin-mhide">
						<li><hr></li>
						<li><a href="{{url('admin/users')}}" class="">{{ __('core.view_user_accounts') }}</a></li>
						<li><a class=" active">{{__('core.view_groups')}}</a></li>
					</ul>
				</div>
			</div>
		</div>
	</div>

    <div class="gadmin-pagesidebar-width-2">
    <!-- begin panel -->
    <div class="panel panel-default " data-sortable-id="ui-widget-6">
        <!-- begin panel-heading -->
        <div class="panel-heading">
            <div class="panel-heading-btn">
                <a href="javascript:;" class="btn btn-xs btn-icon btn-circle btn-default" data-click="panel-expand"><i class="fa fa-expand"></i></a>
            </div>
            <h4 class="panel-title">{{__('core.roles')}}</h4>
        </div>
        <!-- end panel-heading -->
		<div id="info-alert" class="alert" style="display:none">
			<span class="close"  onclick="$('#info-alert').fadeOut()">×</span>
			<div class="alert-container"></div>
		</div>
        <div class="panel-body">
            <form id="deleteForm" action="{{asset('admin/main/bulk_delete/Role')}}" method="POST">
                <table
                    class="table table-responsive table-striped table-bordered table-hover"
                    width="100%"
                    id="beDataTable"
                    data-href="{{url('admin/ajax/getRolesDataTable/Role')}}"
                    data-object="Role"
                    data-cols="id,name,id"
                >
                    <thead>
                        <tr>
                            <th width="1%" data-orderable="false" data-bulk="true" data-name="id"><input id="select_all" name="select_all" value="1" type="checkbox"></th>
                            <th class="text-nowrap" data-searchable="true" data-label="label-usergroups" data-name="name">{{__('core.name')}}</th>
                            <th class="text-nowrap" data-object="Role" data-action="true" data-name="id" data-edit="admin/users/roles/{id}/edit" data-delete="true" data-name="id">{{__('core.action')}}</th>
                        </tr>
                    </thead>
                </table>
            </form>
        </div>
    </div>
</div>
    <script>
        $(document).ready(function() {
            beDataTable('#beDataTable');
        })
    </script>
    <!-- end panel -->
    @push('custom-js')

    @endpush
@endsection