@extends('layouts/contentLayoutMaster')

@section('title', 'الصلاحيات')

@section('vendor-style')
    <!-- vendor css files -->
    <link rel="stylesheet" href="{{ asset('vendors/css/forms/select/select2.min.css') }}">
@endsection

@section('content')
<section id="contextual-colors" class="card">
        <div class="card-content">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title" style="color:#ffb800">تعديل صلاحية      </h4>
                </div>
                <div class="card-content">
                    <div class="card-body">
                        <form class="form" id="edit" action="{{route('roles.update',$model->id)}}" method="post"  enctype="multipart/form-data">
                            @csrf
                            @method('put')
                            <div class="row mt-2">

                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label>الاسم <span class="text-danger">*</span></label>
                                        <input type="text" name="name" class="form-control" placeholder="الاسم"
                                            value="{{ old('name',$model->name) }}">
                                        @error('name')
                                            <div class="text-danger">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>

                            </div> {{-- end of row --}}

                                <div class="form-group">
                                    <div class="col-md-12" style="display: flex">
                                        <h6> تحديد كل الصلاحيات  </h6>
                                        <input type="checkbox" class="form-check-input" id="selectAll" >
                                    </div>
                                    

                                    @error('permission')
                                        <div class="text-danger">{{ $message }}</div>
                                    @enderror

                                    @if (count($records) > 0)
                                    <div class="row" style="text-align: -webkit-center">
                                        @foreach ($records as $record)
                                            <div class="col-md-6">
                                                <div class="card" style="width: 60%;">
                                                    <div class="card-header d-flex justify-content-between" style="background:#eaeaea ; font-weight: bold">
                                                        <div>  {{ $record['group'] }}</div>
                                                        <div> <input type="checkbox" class="form-check-input selectSameGroup" style="top: 11px;" id="{{ str_replace(' ', '_', __($record['group'])) }}"></div>
                                                    </div>
                                                    @if (count($record['items']) > 0)
                                                        <ul class="list-group list-group-flush">
                                                            @foreach ($record['items'] as $item)
                                                                @if ( $item['id'] != '1')
                                                                <li class="list-group-item d-flex justify-content-between">
                                                                    <div>  <label>{{ $item['name'] }}<span class="text-danger"></span></label></div>
                                                                    <div> <input type="checkbox" {{ in_array( $item['id']  , $selectedIds) ? 'checked'  : '' }} name="permission[]" class="form-check-input {{ str_replace(' ', '_', __($record['group'])) }}" value="{{ $item['id'] }}"></div>
                                                                </li>
                                                                @endif

                                                            @endforeach
                                                        </ul>
                                                    @endif
                                                    </ul>
                                                </div>
                                            </div>
                                        @endforeach
                                    </div>
                                    @endif
                                </div>

                                <div class="col-12">
                                    <button type="submit" class="btn btn-primary mr-1 mb-1">اضافة</button>
                                </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
</section>
  {{-- Data list view end --}}
@endsection

@section('vendor-script')
        <!-- vendor files -->
        <script src="{{ asset('vendors/js/forms/select/select2.full.min.js') }}"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                $("#selectAll").click(function () {
                    $("input[type=checkbox]").prop('checked', $(this).prop('checked'));
                });

                $(".selectSameGroup").click(function () {
                    let group = $(this).attr('id');
                    $('.'+group).prop('checked', $(this).prop('checked'));
                });
            });
        </script>
@endsection