@extends('layouts.master')
@section('main-body')
<div class="container-fluid">
    <div class="page-header">
        <div class="row">
            <div class="col-sm-8">
                <h3>Edit Role</h3>
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="/">Dashboard</a></li>
                    <li class="breadcrumb-item"><a href="/roles">Role</a></li>
                    <li class="breadcrumb-item active">Edit</li>
                </ol>
                <span class="pull-right">
                    <a href="{{url()->previous()}}">
                        <button class="btn btn-secondary">Cancel</button>
                    </a>
                    @if($loggedUser->can('update-roles'))
                    <button class="btn btn-primary action-btn" onclick="confirmation('role')" id="action-btn" value="role">Save</button>
                    @endif
                </span>
            </div>
        </div>
    </div>
</div>
<div class="container-fluid" value="">
    {!! Form::open(['route' => ['roles.update', $role->id], 'method' => 'PUT', 'id' => 'role-form']) !!}
    {!! Form::hidden('reference_id', $role->id, ['id' => 'referenceId']) !!}
    <div class="row">
        <div class="col-lg-8">
            <div class="card">
                <div class="card-header">
                    <h5>Form</h5>
                </div>
                <div class="card-body">
                    <div class="col-lg-12">
                        <div class="form-group">
                            {!! Form::label('role_name', 'Role Name') !!}
                            {!! Form::text('role_name', $role->role, ['class' => 'form-control', 'required' => 'required', 'maxlength' => '255', 'id' => 'roleId', 'onchange' => 'checkValidation(this)']) !!}
                            <p class="help-block" style="color:red;" id="rolenameValidation" class="field-validation"></p>
                        </div>
                        <div class="form-group">
                            {!! Form::label('description', 'Description') !!}
                            {!! Form::textarea('description', $role->description, ['class' => 'form-control', 'maxlength' => '1000', 'id' => 'descriptionId']) !!}
                            <p class="help-block" style="color:red;" id="descriptionValidation" class="field-validation"></p>
                        </div>
                        @if($loggedUser->can('update-permissions'))
                            <div class="form-group">
                                <input class="form-check-input" type="checkbox" id="chck-all" onchange="checkAll('module')" >
                                {!! Form::label('permission', 'Permissions') !!}
                                @foreach($modules as $module)
                                <div class="accordion-item">
                                    <h2 class="accordion-header">
                                        <input style="z-index: 5" class="form-check-input module position-absolute m-20 fs-6 chck-{!! $module->name !!}" type="checkbox" onchange="checkModule('{!! $module->name !!}')">
                                        <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#create-module-{{$module->id}}" aria-expanded="false" aria-controls="collapseTwo">
                                            <p class="px-4">{!! $module->name !!}</p>
                                        </button>
                                    </h2>
                                    <div id="create-module-{{$module->id}}" class="accordion-collapse collapse" aria-labelledby="create-heading{{$module->id}}">
                                        <div class="accordion-body">
                                            <div class="row">
                                                @foreach($module->permissions as $permission)
                                                <div class="col-sm-6">
                                                    <div class="card">
                                                        <div class="card-body bg-primary">
                                                            <div class="form-check form-check-inline">
                                                                @if(in_array($permission->id, $role->access))
                                                                <input class="form-check-input {!! $module->name !!} permissions" type="checkbox" onchange="isChecked('permissions','{!! $module->name !!}')" name="permission[]" value="{{$permission->id}}" checked>
                                                                @else
                                                                <input class="form-check-input {!! $module->name !!} permissions" type="checkbox" onchange="isChecked('permissions','{!! $module->name !!}')" name="permission[]" value="{{$permission->id}}">
                                                                @endif
                                                                <label class="form-check-label">
                                                                    <h6>{!! $permission->permission !!}</h6>
                                                                </label>
                                                            </div>
                                                            <p class="mb-3">{!! $permission->description !!}</p>
                                                        </div>
                                                    </div>
                                                </div>
                                                @endforeach
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                @endforeach
                            </div>
                        @endif
                    </div>
                </div>
            </div>
        </div>
    </div>
    {!! Form::close() !!}
</div>
@include('modals.confirmation')
@endsection

@section('import-scripts')
<script src="/assets/js/field-validations.js"></script>
<script src="/assets/js/checkbox.js"></script>

@endsection


@section('page-script')
window.onload = (event) => {
    let all = $('.permissions')
    let checkedAll = $('.permissions:checked')

    if(checkedAll.length == all.length) {
        $('#chck-all').prop('checked', true)
    }

    @foreach ($modules as $module)
        let {{ $module->name }} = $('.'+'{{ $module->name }}').length
        let checked{{ $module->name }} = $('.'+'{{ $module->name }}'+':checked').length

        if(checked{{ $module->name }} == {{ $module->name }}) 
        $('.chck-'+'{{ $module->name }}').prop('checked', true)
    @endforeach
};
    
function confirmation(module) {
    $('#confirmation-title').html("Save changes to " + module + "?" );
    $('#confirmation-body').html("Any changes made will affect all users who have this " + module + "." );
    $('#submit-btn').val(module);
    $('#confirmationModal').modal('show');
}

function submitForm(elem) {
    $('#'+elem.value+'-form').submit();
}

@include('notifications.index')

@endsection