{{-- Extends layout --}}
@extends('layout.default')

{{-- Content --}}
@section('content')

<style>    
    label.error{
        color:red;
    } 
    .form-control.error {
        border-color: #fd397a;
        padding-right: calc(1.5em + 1.3rem);
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fd397a' viewBox='-2 -2 7 7'%3e%3cpath stroke='%23fd397a' d='M0 0l3 3m0-3L0 3'/%3e%3ccircle r='.5'/%3e%3ccircle cx='3' r='.5'/%3e%3ccircle cy='3' r='.5'/%3e%3ccircle cx='3' cy='3' r='.5'/%3e%3c/svg%3E");
        background-repeat: no-repeat;
        background-position: center right calc(0.375em + 0.325rem);
        background-size: calc(0.75em + 0.65rem) calc(0.75em + 0.65rem);
    }
</style>

<!--begin::Card-->
<div class="card card-custom gutter-b">
    <div class="card-header flex-wrap pt-6 pb-0 ">
        <div class="card-title">
            <h3 class="card-label">Add/Edit Role
                <!-- <span class="d-block text-muted pt-2 font-size-sm">row selection and group actions</span> --></h3>
            </div>

        </div>
        @if(isset($roles)) 
        <form class="kt-form" id="frmroleadd" enctype="multipart/form-data"  method='post' action="/roles/{{$roles->id}}" >
            <input type='hidden' id='role_id' name='role_id' value='{{$roles->id}}' />
            @method('put')
            @else 
            <form name='frmroleadd' id='frmroleadd' method="post" action="{{ route('roles.store') }}" >   
                @endif  

                @csrf 
                <div class="card-body">
                    <!--begin: Search Form-->
                    <!--begin::Search Form-->
                    <div class="row">
                        <div class="col-xl-6">
                            <div class="form-group">
                                <label>Role Name</label>
                                <input type="text" class="form-control" name="role_name" id="role_name" placeholder="Role Name" value="@if(isset($roles)){{$roles->name}}@endif">
                            </div>
                        </div>
                    </div>
                    <div class="row ">
                        <div class="col-xl-6">
                            <div class="form-group">
                                <h3 style="margin: 0;padding: 0;font-size: 1.2rem;font-weight: 500;color: #48465b;">Permissions</h3>
                            </div>
                        </div>
                    </div>

                    <!--begin::Accordion-->
                    <div class="accordion accordion-solid accordion-toggle-plus" id="accordionExample4">
                        @foreach ($navigations as $navi)
                        <div class="card" id="menu_{{ $navi->id }}">
                            <div class="card-header" >
                                <div class="card-title" data-toggle="collapse" data-target="#collapse{{ $navi->id }}" aria-expanded="true" aria-controls="collapse{{ $navi->id }}">
                                    <i class="{{ $navi->menu_icon_class  }}"></i> {{ $navi->menu_title  }} 
                                    <div class="col px-md-10 float-right">
                                        @if($navi->menu_keyword == 'menu dashboard')
                                        <input name="modules_id[]" class='mainmenu' data-switch="true" @if(isset($permissions)) @if(in_array($navi->menu_keyword, $permissions))  checked="checked" @endif @endif name="modules_id[]" data-id = "menu_{{ $navi->id }}" value="{{ $navi->menu_keyword }}"  type="checkbox" id="switch_{{ $navi->id }}" checked="checked" disabled>
                                        @else 
                                        <input name="modules_id[]" class='mainmenu' data-switch="true" @if(isset($permissions)) @if(in_array($navi->menu_keyword, $permissions))  checked="checked" @endif @endif name="modules_id[]" data-id = "menu_{{ $navi->id }}" value="{{ $navi->menu_keyword }}"  type="checkbox" id="switch_{{ $navi->id }}">
                                        @endif
                                    </div>
                                </div>

                            </div>


                            <div id="collapse{{ $navi->id }}" class="collapse show" aria-labelledby="menu_{{ $navi->id }}" data-parent="#accordionExample4">
                                <div class="card-body" id='card_{{ $navi->id }}'>
                                    @foreach ($navi->children as $submenu)
                                    <div class="form-group row " >
                                        <div class="col-lg-6 col-xl-6">
                                            <div class="checkbox-list submenu"  id='submenu_{{ $submenu->id }}'>
                                                <label class="checkbox">
                                                    @if($submenu->menu_keyword == 'list dashboard')
                                                    <input type="checkbox"  data-id = "actions_{{ $submenu->id }}" data-parentid = "switch_{{ $navi->id }}" name="modules_id[]" @if(isset($permissions)) @if(in_array($submenu->menu_keyword, $permissions)) checked @endif  @endif value="{{ $submenu->menu_keyword }}" checked="checked" disabled> 
                                                    @else
                                                    <input type="checkbox"  data-id = "actions_{{ $submenu->id }}" data-parentid = "switch_{{ $navi->id }}" name="modules_id[]" @if(isset($permissions)) @if(in_array($submenu->menu_keyword, $permissions)) checked @endif  @endif value="{{ $submenu->menu_keyword }}"> 
                                                    @endif
                                                    <span></span>{{ $submenu->menu_title }}
                                                </label>
                                            </div> 
                                        </div>  
                                        <div class="col-lg-6 col-xl-6">

                                            <div class="checkbox-list action" id='actions_{{ $submenu->id }}'>
                                                @foreach ($submenu->navaction as $actions)

                                                <label class="checkbox">
                                                    <!-- <i class="{{ $actions->action_icon}} kt-font-brand"></i> -->
                                                    <input type="checkbox"  data-parentid = "switch_{{ $navi->id }}" data-id = "submenu_{{ $submenu->id }}" name="modules_id[]" @if(isset($permissions)) @if(in_array($actions->module_keyword, $permissions)) checked @endif @endif  value="{{ $actions->module_keyword }}"> 
                                                    <span></span>{{$actions->module_title}}
                                                </label>

                                                @endforeach
                                            </div>

                                        </div>
                                    </div>
                                    @endforeach 

                                </div>
                            </div>
                        </div>
                        @endforeach
                    </div>

                </div>
                <div class="card-footer">
                    <button class="btn btn-primary mr-2" id="submit_role">Submit</button>
                    <button type="reset" class="btn btn-secondary">Cancel</button>
                </div>

            </form>
        </div>
        <!--end::Card-->


        @endsection

        {{-- Styles Section --}}
        @section('styles')

        @endsection

        {{-- Scripts Section --}}
        @section('scripts')

        <script src="{{ asset('/js/roles/roles_add.js') }}" type="text/javascript"></script>

        @endsection