@extends('layouts.backoffice')

@section('content')
<div class="row">
    <div class="col-md-12">
        <div class="card shadow-none position-relative overflow-hidden mb-4">
            <div class="card-body d-flex align-items-center justify-content-between p-4">
                <h4 class="card-title mb-0">Add Role</h4>
                <nav aria-label="breadcrumb">
                <ol class="breadcrumb mb-0">
                    <li class="breadcrumb-item">
                        <a class="text-muted text-decoration-none" href="{{ route('backoffice.index') }}">Home</a>
                    </li>
                    <li class="breadcrumb-item" aria-current="page">
                        Add Role
                    </li>
                </ol>
            </nav>
        </div>
    </div>
    <form class="" action="{{route('backoffice.users.store-role')}}" method="post">
        @csrf
        <div class="card">
            <div class="card-body">
                <div class="form-group">
                    <label class="form-label" for="name">Role Name:</label>
                    <input class="form-control" type="text" name="name" value="" required>
                </div>
                {{-- @includeWhen($errors->has('name'), 'layouts.alert', ['type' => 'danger', 'message' => $errors->get('name')])--}}
                <h5 class="mt-3 mb-3"><b>Assign Permissions</b></h5>
                <div class="form-check">
                    <input class="form-check-input primary check-outline outline-primary" id="all_permissions" type="checkbox" name="all" onclick="toggle_permissions()">
                    <label class="form-check-label" for="ALL">ALL</label>
                </div>
                <div id="permissions_checkbox" class="container_chechbox form-control mb-3 mt-3">
                    @foreach ($permissions as $permission)
                    <div class="form-check ">
                        <input id="permissions" class="form-check-input primary check-outline outline-primary" type="checkbox" name="permissions[]" value="{{$permission->name}}">
                        <label class="form-check-label" for="{{$permission->name}}">{{$permission->name}}</label><br>
                    </div>
                    @endforeach
                </div>
                {{-- @includeWhen($errors->has('permissions'), 'layouts.alert', ['type' => 'danger', 'message' => $errors->get('permissions')])--}}
                <button type="submit" class="btn btn-primary">Add</button>
            </div>
        </div>
    </form>
</div>
@endsection
@section('scripts')
<script>
    function toggle_permissions() {
        if ($("#all_permissions").is(':checked')) {
            $("input:checkbox").attr('checked', true);
            $("#logs:input").prop('checked', false);
        } else {
            $("input:checkbox").removeAttr('checked');
        }
    }
</script>
@endsection