@extends('layouts.app')

@section('pageTitle', 'Home')

@section('content')
<div class="page-content">
  <div class="page-subheading page-subheading-md">
    <ol class="breadcrumb">
        <li><a href="javascript:;">Dashboard</a></li>       
        <li class="active"><a href="javascript:;">Roles</a></li>
    </ol>
   </div>
<div class="page-heading page-heading-md">
    <h2>Roles</h2>
</div>
<div class="container-fluid-md">
    <div class="panel panel-default">
        <div class="panel-heading">
    <h1>Edit Role: {{ $role->name }}</h1>

    <form action="{{ route('roles.update', $role->id) }}" method="POST">
        @csrf
        @method('PUT')

        <div class="form-group">
            <label for="name">Role Name</label>
            <input type="text" name="name" id="name" class="form-control" value="{{ $role->name }}" required>
        </div>

        <div class="form-group">
            <label>Permissions</label>
            @foreach($permissions as $permission)
                <div class="form-check">
                    <input type="checkbox" name="permissions[]" value="{{ $permission->name }}"
                           class="form-check-input"
                           id="permission_{{ $permission->id }}"
                           @if($role->permissions->contains($permission->id)) checked @endif>
                    <label for="permission_{{ $permission->id }}" class="form-check-label">{{ $permission->name }}</label>
                </div>
            @endforeach
        </div>

        <button type="submit" class="btn btn-primary">Update Role</button>
    </form>
</div>
</div>
</div>
</div>
@endsection