@extends('layouts.master')

@section('styles')
{{--    <link rel="stylesheet" href="{{ mix('css/Profile.css') }}">--}}
@endsection

@section('title')
    @lang('Profile')
@endsection

@section('breadcrumbs')
    @component('components.breadcrumb', [
        'items' => [
            ['url' => route('profile.index', ['#roles']), 'label' => 'Profile'],
        ],
        'title' => __('Create role')
    ])@endcomponent
@endsection

@section('content')

<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-8">
            <div class="card">

                <div class="card-body">

                    <h4 class="card-title pb-2">@lang('Create role')</h4>

                    <form action="{{route('profile.role.store')}}" method="POST">

                        @csrf

                        @component('components.form.input', [ 'name' => 'title', 'label' => __('Role name')])@endcomponent

                        @forelse($permissions as $group => $permission)
                            <h4 class="pt-2 pb-2">@lang($group)</h4>

                            <div class="row">
                                @forelse($permission as $item)
                                    <div class="col-md-4">
                                        <div class="checkbox-group mb-2">
                                            <label for="{{$item->title}}">
                                                <input type="checkbox" class="form-check-input me-2" value="{{$item->uuid}}" id="{{$item->title}}" name="permissions_list[]" />@lang($item->title)
                                                <span class="checkmark"></span>
                                            </label>
                                        </div>

                                    </div>
                                @empty
                                    @lang('No permission available.')
                                @endforelse
                            </div>
                        @empty
                            @lang('No permission available.')
                        @endforelse

                        <button type="submit" class="btn btn-sm btn-primary mobile-btn mt-4">@lang('Save')</button>

                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

@endsection

@section('scripts')
{{--    <script src="{{ mix('js/Profile.js') }}"></script>--}}
@endsection