@push('styles')
@endpush

<div class="row">
    <div class="col-lg-12 order-lg-1">
        <div class="card shadow mb-4">
            <div class="card-header py-3">
                <h6 class="m-0 font-weight-bold text-primary">Role Info</h6>
            </div>
            <div class="card-body">
                <form method="POST" action="{{ $route }}">
                    @csrf
                    @if ($type == 'EDIT')
                        @method('PUT')
                    @endif

                    <div class="row">
                        <x-ui.input
                            class="input"
                            name="name"
                            label="Role Name"
                            type="text"
                            placeholder="Name"
                            :value="(isset($role) && $role->name)? $role->name : old('name')"
                            col="col-md-6"
                            required
                            :disabled="false"
                            prepend='<i class="fa-solid fa-pen"></i>'
                        />
                        <x-ui.input
                            class="input"
                            name="description"
                            label="Description"
                            type="text"
                            placeholder="Description"
                            :value="(isset($role) && $role->description)? $role->description : old('description')"
                            col="col-md-6"
                            required
                            :disabled="false"
                            prepend='<i class="fa-solid fa-user"></i>'
                        />
                    </div>
                    <div class="mb-3 form-group">
                        <label class="form-label form-control-label">Assign Permissions</label>
                        <div class="table-responsive">
                            <table class="table table-bordered table-sm">
                                <thead>
                                    <tr>
                                        <th>Name</th>
                                        <th>Description</th>
                                        @foreach ($actions as $action => $val)
                                            <th class="text-center">{{ ucfirst($action) }}</th>
                                        @endforeach
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach ($permissions as $permission)
                                        <tr>
                                            <td>{{ $permission->name }}</td>
                                            <td>{{ $permission->description }}</td>
                                            @foreach ($actions as $action => $val)
                                                <td class="text-center">
                                                    <input
                                                        type="checkbox"
                                                        name="permissions[{{ $permission->id }}][{{ $action }}]"
                                                        value="1"
                                                        @isset($accessMatrix)
                                                            {{ ($accessMatrix[$permission->id][$action] ?? false) ? 'checked' : '' }}
                                                        @endisset
                                                    >
                                                </td>
                                            @endforeach
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>

                    <div class="d-grid gap-2 d-md-flex justify-content-md-end">
                        <button type="submit" class="btn btn-primary">Simpan</button>
                        <a href="{{ route('role.index') }}" class="btn btn-secondary">Batal</a>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

@push('scripts')
@endpush