@extends('layouts.master')

@section('page_title', 'Role Details')
@section('title', 'Role Edit')
@section('main_item', 'Role')
@section('sub_item', 'Role Edit')

@section('content')
<div class="col-12">
    <div class="card">
        <div class="card-header">
            Edit Role
        </div>

        <div class="card-body">
            <form method="POST" action="{{ route('roles.update', [$role->id]) }}" enctype="multipart/form-data">
                @method('PUT')
                @csrf
                <div class="row">
                    <div class="col-md-4">
                        <div class="form-group">
                            <label class="required" for="role_name">Title</label>
                            <input class="form-control {{ $errors->has('role_name') ? 'is-invalid' : '' }}" type="text"
                            name="role_name" id="role_name" value="{{ old('role_name', $role->role_name) }}" required>

                        </div>
                    </div>
                </div>
                <br>
                <div class="col-md-12">
                    <div class="form-group">
                        <label class="required" for="permissions">Permissions</label>
                        @if(count($permissionlabels) > 0)
                        @foreach($permissionlabels as $permissionlabel)
                        <div class="row check_group">
                            <div class="col-md-3">
                                <h4>{{ $permissionlabel->label }}</h4>
                            </div>
                            <div class="col-md-2">
                                <div class="select_all">
                                    <label>
                                        <input type="checkbox" class="check_all permission">
                                        Select All
                                    </label>
                                </div>
                            </div>
                            <div class="col-md-6">
                            	@if(count($permissions[$permissionlabel->id]) > 0)
                        		@foreach($permissions[$permissionlabel->id] as $permission)
                                <div class="col-md-12">
                                    <div class="select_all">
                                        <label>
                                            <input type="checkbox" name="permissions[]" class="permission" value="{{ $permission->id }}" {{ in_array($permission->id, $rolepermissions) ? 'checked' : '' }} />
                                            {{ $permission->label }}
                                        </label>
                                    </div>
                                </div>
                                @endforeach
                                @else
                                <div class="col-md-12"><p>permissions for {{ $permissionlabel->label }} not added yet!</p></div>
                                @endif
                            </div>
                        </div>
                        <hr>
                        @endforeach
                        @else
                        <div class="row check_group">
                        	<div class="col-md-3">
                            	<p>No permissions added yet!</p>
                            </div>
                        </div>
                        @endif
                	</div>
                </div>
                <div class="form-group">
                    <button class="btn btn-danger" type="submit">
                        Update
                    </button>
                </div>
            </form>
        </div>
    </div>
    </div>



@endsection
@section('scripts')
    <script>
        $(document).on('click', '.check_all', function() {

            $(this)
                .closest('.check_group')
                .find('.permission')
                .each(function() {

                    $(this).attr('checked', true);

                });
            $(this).removeClass('check_all').addClass('uncheck_all');
        });


        $(document).on('click', '.uncheck_all', function() {
            $(this)
                .closest('.check_group')
                .find('.permission')
                .each(function() {
                    $(this).attr('checked', false);
                });
            $(this).removeClass('uncheck_all').addClass('check_all');
        });

    </script>
@endsection