@extends("layouts.master", ["title" => "Permission"])

@push('css')
    <link rel="stylesheet" type="text/css" href="{{ asset('frest/app-assets/vendors/css/forms/select/select2.min.css') }}">
@endpush
@section('content')
    <div class="card">
        <div class="card-header d-flex justify-content-between align-items-center">
            <div class="title">Разрешения</div>
            <div class="d-flex justify-content-between align-items-center">
                <p>Отметить все</p>
                <input type="checkbox" id="check-all" class="ml-2 mb-1">
            </div>
            <a href="{{ route('roles.index') }}" class="btn btn-sm btn-primary add-role-btn">Назад</a>
        </div>
        <div class="card-body">
            <div class="table-responsive">
                <form class="form-group" action="{{ route('permission.store') }}" method="post">
                    @csrf
                    <input type="hidden" name="id" value="{{ $id }}">
                    <table class="table table-sm table-bordered table-striped text-center">
                        <thead>
                        <tr class="bg-gray">
                            <th width="50">#</th>
                            <th style="width: 40%;">Название</th>
                            <th>Просмотр</th>
                            <th>Добавить</th>
                            <th>Изменить</th>
                            <th>Удалить</th>
                        </tr>
                        <tr class="bg-gray">
                            <th colspan="2">Отметить все по категориям</th>
                            <th>
                                <input type="checkbox" id="check-view-all" class="ml-2 mt-1 mb-1">
                            </th>
                            <th>
                                <input type="checkbox" id="check-create-all" class="ml-2 mt-1 mb-1">
                            </th>
                            <th>
                                <input type="checkbox" id="check-edit-all" class="ml-2 mt-1 mb-1">
                            </th>
                            <th>
                                <input type="checkbox" id="check-delete-all" class="ml-2 mt-1 mb-1">
                            </th>
                        </tr>
                        </thead>
                        <tbody>
                        @foreach($permissions as $k => $permission)
                            <tr>
                                <td>{{ $k + 1 }}</td>
                                <td>{{ $permission['name'] }}</td>
                                @foreach($permission['actions'] as $action)
                                    <td>
                                        @if($action != '')
                                            <div class="form-group">
                                                <input type="checkbox" class="{{ substr($action, 0, 4) == 'view' ? 'check-view':
                                                    (substr($action, 0, 4) == 'crea' ? 'check-create':
                                                    (substr($action, 0, 4) == 'edit' ? 'check-edit':'check-delete')) }}"
                                                       name="permissions[]" {{ $role->hasPermissionTo($action) ? 'checked':'' }} value="{{ $action }}">
                                            </div>
                                        @endif
                                    </td>
                                @endforeach
                            </tr>
                        @endforeach
                        </tbody>
                    </table>
                    <button type="submit" class="btn btn-primary ml-1 mt-2 mb-3 bx-pull-right">
                        <i class="bx bx-check d-block d-sm-none"></i>
                        <span class="d-none d-sm-block">Сохранить</span>
                    </button>
                </form>
            </div>
        </div>
    </div>
@endsection
@push('js')
    <script>
        $('#check-all').click(function() {
            $('input[type=checkbox]').prop('checked', this.checked);
        });
        $('#check-view-all').click(function() {
            $('input[class=check-view]').prop('checked', this.checked);
        });
        $('#check-create-all').click(function() {
            $('input[class=check-create]').prop('checked', this.checked);
        });
        $('#check-edit-all').click(function() {
            $('input[class=check-edit]').prop('checked', this.checked);
        });
        $('#check-delete-all').click(function() {
            $('input[class=check-delete]').prop('checked', this.checked);
        });
    </script>
@endpush