@php use App\Models\Client;use Carbon\Carbon; @endphp
@extends('adminlte::page')

@section('title', 'IPRS | Roles')

@section('content_header')
    <div class="col-9 mx-auto">
        <div class="row mb-2">
            <div class="col-sm-6">
                <ol class="breadcrumb float-sm-left">
                    <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">Dashboard</a></li>
                    <li class="breadcrumb-item"><a href="{{ route('role.index') }}">All Roles</a></li>
                    <li class="breadcrumb-item active">{{ ucfirst($role->name) }}'s Permissions</li>
                </ol>
            </div>
        </div>
        <div class="row mb-2">
            <div class="col-sm-12">
                <h1 class="m-0">{{ ucfirst($role->name) }}'s Permissions</h1>
            </div>
        </div>
    </div>
@stop

@section('plugins.Datatables', true)

@section('content')
    <div class="col-9 mx-auto">
        <form action="{{ route('add_permission_to_role', ['role_id' => $role->id ] ) }}" method="POST" >
            @csrf
            @method('PUT')
            <!-- <x-adminlte-card class="col-3">
                <p>Role: <strong>{{ ucfirst($role->name) }}</strong></p>
                <p>Date Created: <strong>{{ $role->created_at }}</strong></p>
            </x-adminlte-card> -->
            <fieldset>
                <legend>Role Information</legend>
                <div class="row">
                    <div class="col text-center border-right">
                        <span><strong><u>Role Name:</strong></u></span>
                        <br />
                        {{ ucfirst($role->name) ?? '-' }}
                    </div>
                    <div class="col text-center">
                        <span><strong><u>Date Created:</strong></u></span>
                        <br />
                        {{ Carbon::parse($role->created_at)->format("d-m-Y H:i") ?? '-' }}
                    </div>
                </div>
            </fieldset>

            <fieldset>
                <legend>{{ ucfirst($role->name) }}'s Permissions</legend>
                <ul class="list-group list-group-flush">
                    @foreach($permissions as $permission)
                            <li class="list-group-item">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" value="{{ $permission->name }}"
                                        name="perm[]" id="role{{ $role->name }}{{ $permission->id}}"
                                            {{ $role->hasPermissionTo($permission) ? 'checked' : '' }}>
                                    <label class="form-check-label" for="role{{ $role->name }}{{ $permission->id}}">
                                        {{ $permission->name }}
                                    </label>
                                    <br>
                                    <small>{{ $permission->description }}</small>
                                </div>
                            </li>
                    @endforeach
                </ul>
            </fieldset>

            <!-- <x-adminlte-card class="col-12">

                    <ul class="list-group list-group-flush">
                        <li class="list-group-item list-group-item-secondary">Permissions</li>

                    @foreach($permissions as $permission)
                            <li class="list-group-item">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" value="{{ $permission->name }}"
                                        name="perm[]" id="role{{ $role->name }}{{ $permission->id}}"
                                            {{ $role->hasPermissionTo($permission) ? 'checked' : '' }}>
                                    <label class="form-check-label" for="role{{ $role->name }}{{ $permission->id}}">
                                        {{ $permission->name }}
                                    </label>
                                    <br>
                                    <small>{{ $permission->description }}</small>
                                </div>
                            </li>
                    @endforeach

                    </ul>

            </x-adminlte-card> -->
            <!-- <x-adminlte-button label="Save changes" theme="success" icon="fas fa-save" type="submit" style="margin-bottom: 25px;" /> -->
            <button type="submit" class="btn btn-success">
                <span class="fas fa-save"></span>
                Save Changes 
            </button>

        </form>
    </div>
@stop

@section('css')
    <style>
        fieldset {
            background-color: white;
            padding-block-start: 0.35em;
            padding-inline-start: 1.25em;
            padding-inline-end: 1.25em;
            padding-block-end: 0.625em;
            margin: 0 0 1em 0;
            border: 1px groove rgb(192, 192, 192);
            border-radius: 5px;
        }

        legend {
            background-color: #356eac;
            color: white;
            width: auto;
            font-size: medium;
            padding: 5px 10px;
            border-radius: 5px;
        }

        .access{
            margin-left: 10px;
        }

        h3{
            margin-top: 1.5rem !important;
        }

        .row{
            margin-bottom: 20px;
        }

        .btn-success{
            margin-bottom: 25px;
        }


    </style>
@stop 