@extends('layouts.master')
@section('title') @lang('translation.form-layouts') @endsection
@section('content')
    @component('components.breadcrumb')
        @slot('li_1') Forms @endslot
        @slot('title') Update Role @endslot
    @endcomponent

    <div class="row">
        <div class="col-xxl-6">
            <div class="card">
                <div class="card-header align-items-center d-flex">
                    <h4 class="card-title mb-0 flex-grow-1">Update Role</h4>
                </div><!-- end card header -->
                <div class="card-body">
                   <div class="live-preview">
                        <form action="{{ route('roles.update', $role->id) }}" method="POST">
                             @csrf
                             @method('PUT')

                            <!-- RoleName -->
                            <div class="row mb-3">
                                <div class="col-lg-3">
                                    <label for="name" class="form-label">Role Name</label>
                                </div>
                                <div class="col-lg-9">
                                    <input id="name" name="name" type="text" 
                                    class="form-control"  
                                    value="{{ old('name', $role->name) }}" 
                                    required autofocus>
                                    @error('name')
                                        <span class="invalid-feedback" role="alert"></span>
                                            <strong>{{ $message }}</strong>
                                    @enderror
                                </div>
                            </div>

                             <!-- Permission -->
                            <div class="row mb-3">
                                <div class="col-lg-3">
                                    <label for="permissions" class="form-label">Assign Permissions</label>
                                </div>
                                <div class="col-lg-9">
                                    @foreach ($permissions as $permission)
                                        <input class="form-check-input" type="checkbox" name="permissions[]"
                                                value="{{ $permission->name }}" id="perm_{{ $permission->id }}"
                                                {{ $role->permissions->contains('name', $permission->name) ? 'checked' : '' }}>
                                        <label class="form-check-label" for="perm_{{ $permission->id }}">
                                            {{ ucfirst(str_replace('_', ' ', $permission->name)) }}
                                        </label>
                                    @endforeach
                                </div>
                            </div>
                           
                            
                            <div class="text-end">
                                <a href="{{ route('roles.index') }}" class="btn btn-danger">Cancel</a>
                                <button type="submit" class="btn btn-primary">Update Role</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div><!--end row-->
@endsection