{{-- Extends layout --}}
@extends(getThemeBasePath())
<link href="{{asset('backend/plugins/custom/multiselect/css/multi-select.css')}}" media="screen" rel="stylesheet" type="text/css">
<style>
    .header-menu {
        display: none !important;
    }

    .ms-container {
        width: 100%;
    }
</style>
{{-- Content --}}
@section('content')
<!--begin::Card-->
<form class="form" method="post" action="{{$action}}" id="manage_form">
    @if(!empty($data['id']))
    @method('PUT')
    @endif
    @csrf
    <div class="card shadow-sm">
        <!--begin::Card header-->
        <div class="card-header card-header-tabs-line nav-tabs-line-3x">
            <!--begin::Toolbar-->
            <div class="card-toolbar">
                <ul class="nav nav-tabs nav-line-tabs nav-stretch fs-6 border-0">
                    <!--begin::Item-->
                    <li class="nav-item me-3">
                        <a class="nav-link active" data-bs-toggle="tab" href="#kt_user_edit_tab_1">
                            <span class="nav-icon">
                                <i class="fa fa-user"></i>
                            </span>
                            <span class="nav-text font-size-lg">Details</span>
                        </a>
                    </li>
                </ul>
            </div>
            <!--end::Toolbar-->
        </div>
        <!--end::Card header-->
        <!--begin::Card body-->
        <div class="card-body">

            <div class="tab-content">
                <!--begin::Tab-->
                <div class="tab-pane show active px-7" id="kt_user_edit_tab_1" role="tabpanel">
                    <!--begin::Row-->
                    <div class="row">
                        @include("backend.errors")
                        <div class="col-xl-12">
                            <!--begin::Group-->
                            <div class="form-group fv-row mb-7">
                                <label class="col-form-label col-2 text-lg-right text-left">User Group <span class="text-danger">*</span></label>
                                <div class="col-9">
                                    <input class="form-control form-control-lg form-control-solid required" type="text" name="name" @if(!empty($data['id'])) readonly @endif value="{{$data['name']??''}}" />
                                </div>
                            </div>
                            <!--end::Group-->

                            <!--begin::Group-->
                            <div class="form-group fv-row mb-7">
                                <label class="col-form-label col-2 text-lg-right text-left">Permissions <span class="text-danger">*</span></label>
                                <div class="col-9"></div>
                            </div>
                            <!--end::Group-->
                            <div class="form-group fv-row mb-7">
                                <div class="col-12">
                                    <table class="table table-bordered">
                                        <thead>
                                            <th>Menu</th>
                                            <th class="text-center">View</th>
                                            <th class="text-center">Add</th>
                                            <th class="text-center">Edit</th>
                                            <th class="text-center">Delete</th>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td class="text-center">Select All</td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_view_all" name="permission_view_all" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_add_all" name="permission_add_all" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_edit_all" name="permission_edit_all" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_delete_all" name="permission_delete_all" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                            </tr>
                                            @if(isset($data['orgName']) && $data['orgName'] == "staff")
                                            <tr>
                                                <td colspan="5" class="text-center text-bold"><b>Staff Panel</b></td>
                                            </tr>
                                            @foreach($menus['staff'] as $menu)
                                            @php
                                            $perm = Str::slug(strtolower($menu['page']), '_');
                                            @endphp
                                            <tr>
                                                <td>{{$menu['title']}}</td>
                                                @if(empty($menu['submenu']))
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_view" {{in_array('staff.'.$perm.'.view',$permissionData)?'checked':''}} name="permission[staff][{{$perm}}][view]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_add" {{in_array('staff.'.$perm.'.add',$permissionData)?'checked':''}} name="permission[staff][{{$perm}}][add]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_edit" {{in_array('staff.'.$perm.'.edit',$permissionData)?'checked':''}} name="permission[staff][{{$perm}}][edit]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_delete" {{in_array('staff.'.$perm.'.delete',$permissionData)?'checked':''}} name="permission[staff][{{$perm}}][delete]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                @endif
                                            </tr>
                                            @if(isset($menu['submenu']) && !empty($menu['submenu']))
                                            @foreach($menu['submenu'] as $submenu)
                                            @php
                                            $subperm = Str::slug(strtolower($submenu['page']), '_');
                                            @endphp
                                            <tr>
                                                <td> - {{$submenu['title']}}</td>
                                                @if(empty($submenu['submenu']))
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_view" {{in_array('staff.'.$subperm.'.view',$permissionData)?'checked':''}} name="permission[staff][{{$subperm}}][view]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_add" {{in_array('staff.'.$subperm.'.add',$permissionData)?'checked':''}} name="permission[staff][{{$subperm}}][add]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_edit" {{in_array('staff.'.$subperm.'.edit',$permissionData)?'checked':''}} name="permission[staff][{{$subperm}}][edit]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_delete" {{in_array('staff.'.$subperm.'.delete',$permissionData)?'checked':''}} name="permission[staff][{{$subperm}}][delete]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                @endif
                                            </tr>
                                            @if(isset($submenu['submenu']) && !empty($submenu['submenu']))
                                            @foreach($submenu['submenu'] as $submenu2)
                                            @php
                                            $subperm2 = Str::slug(strtolower($submenu2['page']), '_');
                                            @endphp
                                            <tr>
                                                <td> -- {{$submenu2['title']}}</td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_view" {{in_array('staff.'.$subperm2.'.view',$permissionData)?'checked':''}} name="permission[staff][{{$subperm2}}][view]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_add" {{in_array('staff.'.$subperm2.'.add',$permissionData)?'checked':''}} name="permission[staff][{{$subperm2}}][add]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_edit" {{in_array('staff.'.$subperm2.'.edit',$permissionData)?'checked':''}} name="permission[staff][{{$subperm2}}][edit]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_delete" {{in_array('staff.'.$subperm2.'.delete',$permissionData)?'checked':''}} name="permission[staff][{{$subperm2}}][delete]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                            </tr>
                                            @endforeach
                                            @endif
                                            @endforeach
                                            @endif
                                            @endforeach

                                            @endif

                                            @if(!isset($data['orgName']) || $data['orgName'] != "staff")
                                            <tr>
                                                <td colspan="5" class="text-center text-bold"><b>Admin Panel</b></td>
                                            </tr>
                                            @foreach($menus['admin'] as $menu)
                                            @php
                                            $perm = Str::slug(strtolower($menu['page']), '_');
                                            @endphp
                                            
                                            <tr>
                                                <td>{{$menu['title']}}</td>
                                                @if(empty($menu['submenu']))
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_view" {{in_array('admin.'.$perm.'.view',$permissionData)?'checked':''}} name="permission[admin][{{$perm}}][view]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_add" {{in_array('admin.'.$perm.'.add',$permissionData)?'checked':''}} name="permission[admin][{{$perm}}][add]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_edit" {{in_array('admin.'.$perm.'.edit',$permissionData)?'checked':''}} name="permission[admin][{{$perm}}][edit]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_delete" {{in_array('admin.'.$perm.'.delete',$permissionData)?'checked':''}} name="permission[admin][{{$perm}}][delete]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                @endif
                                            </tr>
                                            
                                            @if(isset($menu['submenu']) && !empty($menu['submenu']))
                                            @foreach($menu['submenu'] as $submenu)
                                            @php
                                            $subperm = Str::slug(strtolower($submenu['page']), '_');
                                            @endphp
                                            <tr>
                                                <td> - {{$submenu['title']}}</td>
                                                @if(empty($submenu['submenu']))
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_view" {{in_array('admin.'.$subperm.'.view',$permissionData)?'checked':''}} name="permission[admin][{{$subperm}}][view]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_add" {{in_array('admin.'.$subperm.'.add',$permissionData)?'checked':''}} name="permission[admin][{{$subperm}}][add]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_edit" {{in_array('admin.'.$subperm.'.edit',$permissionData)?'checked':''}} name="permission[admin][{{$subperm}}][edit]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_delete" {{in_array('admin.'.$subperm.'.delete',$permissionData)?'checked':''}} name="permission[admin][{{$subperm}}][delete]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                @endif
                                            </tr>
                                            @if(isset($submenu['submenu']) && !empty($submenu['submenu']))

                                            @foreach($submenu['submenu'] as $submenu2)
                                            @php
                                            $subperm2 = Str::slug(strtolower($submenu2['page']), '_');
                                            @endphp
                                            <tr>
                                                <td> -- {{$submenu2['title']}}</td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_view" {{in_array('admin.'.$subperm2.'.view',$permissionData)?'checked':''}} name="permission[admin][{{$subperm2}}][view]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_add" {{in_array('admin.'.$subperm2.'.add',$permissionData)?'checked':''}} name="permission[admin][{{$subperm2}}][add]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_edit" {{in_array('admin.'.$subperm2.'.edit',$permissionData)?'checked':''}} name="permission[admin][{{$subperm2}}][edit]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                                <td class="text-center">
                                                    <div class="checkbox-inline" style="margin-left: 40%;">
                                                        <label class="checkbox checkbox-primary">
                                                            <input type="checkbox" class="permission_delete" {{in_array('admin.'.$subperm2.'.delete',$permissionData)?'checked':''}} name="permission[admin][{{$subperm2}}][delete]" value="1">
                                                            <span></span></label>
                                                    </div>
                                                </td>
                                            </tr>
                                            @endforeach

                                            @endif

                                            @endforeach
                                            @endif
                                            @endforeach

                                            @endif
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--end::Row-->
                </div>
                <!--end::Tab-->
            </div>
        </div>
        <!--begin::Card body-->
        <div class="card-footer text-right">
            <button type="submit" class="btn btn-primary me-2 btn-hover-rise" onclick="$('#manage_form').submit();">Save</button>
            <a href="{{route('user-groups.index')}}"><button type="button" class="btn btn-secondary btn-hover-rise">Cancel</button></a>
        </div>
    </div>
    <!--end::Card-->
</form>
@endsection

{{-- Scripts Section --}}
@section('scripts')
<script src="{{asset('backend/plugins/custom/multiselect/js/jquery.multi-select.js')}}" type="text/javascript"></script>
<script src="{{asset('backend/plugins/custom/multiselect/js/jquery.quicksearch.js')}}" type="text/javascript"></script>

<script type="text/javascript">
    $(document).ready(function() {
        $('.permission_view_all,.permission_edit_all,.permission_delete_all,.permission_add_all').on('change',function(){
            if($(this).hasClass('permission_view_all')){
              $('.permission_view').attr('checked',$(this).prop('checked'))
            }
            if($(this).hasClass('permission_edit_all')){
              $('.permission_edit').attr('checked',$(this).prop('checked'))
            }
            if($(this).hasClass('permission_delete_all')){
              $('.permission_delete').attr('checked',$(this).prop('checked'))
            }
            if($(this).hasClass('permission_add_all')){
              $('.permission_add').attr('checked',$(this).prop('checked'))
            }
        });
        $('#manage_form').validate();
        $('#optgroup').multiSelect({
            selectableOptgroup: true,
            selectableHeader: "<input type='text' class='search-input form-control form-control-lg' autocomplete='off' placeholder='Search'>",
            selectionHeader: "<input type='text' class='search-input form-control form-control-lg' autocomplete='off' placeholder='Search'>",
            afterInit: function(ms) {
                var that = this,
                    $selectableSearch = that.$selectableUl.prev(),
                    $selectionSearch = that.$selectionUl.prev(),
                    selectableSearchString = '#' + that.$container.attr('id') + ' .ms-elem-selectable:not(.ms-selected)',
                    selectionSearchString = '#' + that.$container.attr('id') + ' .ms-elem-selection.ms-selected';

                that.qs1 = $selectableSearch.quicksearch(selectableSearchString)
                    .on('keydown', function(e) {
                        if (e.which === 40) {
                            that.$selectableUl.focus();
                            return false;
                        }
                    });

                that.qs2 = $selectionSearch.quicksearch(selectionSearchString)
                    .on('keydown', function(e) {
                        if (e.which == 40) {
                            that.$selectionUl.focus();
                            return false;
                        }
                    });
            },
            afterSelect: function() {
                this.qs1.cache();
                this.qs2.cache();
            },
            afterDeselect: function() {
                this.qs1.cache();
                this.qs2.cache();
            }
        });
    });
</script>
@endsection