@extends('layouts.master')

@section('content')
    <div class="container-fluid">

        <div class="row">
            <div class="col-sm-12">
                <div class="page-title-box">
                    <h4 class="page-title">Roles</h4>
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><a href="javascript:void(0);">Dashboard</a></li>
                        <li class="breadcrumb-item"><a href="javascript:void(0);">Departments</a></li>
                        <li class="breadcrumb-item "><a href="javascript:void(0);">Add</a></li>
                    </ol>
                    <div class="state-information d-none d-sm-block">
                        <div class="text-center" >
                           <a class="btn btn-primary " href="{{ url('/roles') }}"> View Roles List</a>
                        </div>
                    </div>

                </div>
            </div>
        </div>
        <!-- end row -->

        <div class="row">
            <div class="container-fluid col-12">
                <div class="card m-b-20">
                    <div class="card-body">
                        <form name="roles" action={{ url('/roles') }} method="post">
                            @csrf

                            <div class="form-group row">
                                <label class="col-sm-2 col-form-label">Department_id</label>
                                <div class="col-sm-10">
                                    <select value="0" class="form-control" name="department_id">
                                        <option value="" selected> ---Select Department --- </option>
                                        @foreach ($departments as $key)
                                            <option value="{{ $key->id }}">{{ $key->name }}</option>
                                        @endforeach
                                    </select>
                                    @if ($errors->has('department_id'))
                                        <span class="help-block">
                                            <strong>{{ $errors->first('department_id') }}</strong>
                                        </span>
                                    @endif
                                </div>
                            </div>
                           

                            <div class="form-group row">
                                <label class="col-sm-2 col-form-label">Role Name</label>
                                <div class="col-sm-10">
                                    <input type="text" name="name" class="form-control" value="{{ old('name') }}">
                                    @if ($errors->has('name'))
                                        <span class="help-block">
                                            <strong>{{ $errors->first('name') }}</strong>
                                        </span>
                                    @endif
                                </div>
                            </div>

                            <div class="form-group row">
                                <label class="col-sm-2 col-form-label">Role Permission</label>
                                <div class="row col-md-10">
                                @foreach($permission as $value)
                                <div class="col-md-3">
                                    <input type="checkbox" name="permission[]" value="{{$value->id}}" >&nbsp;
                                    <label>{{$value->name}}</label>
                                </div>
                                
                                @endforeach
                                <div class="col-md-10">
                                @if ($errors->has('permission'))
                                        <span class="help-block">
                                            <strong>{{ $errors->first('permission') }}</strong>
                                        </span>
                                    @endif
                                </div>
                            </div>
                            </div>

                            <div class="text-center">
                                <button type="submit" class="btn btn-outline-success btn-lg">Submit</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div> <!-- end col -->
        </div> <!-- end row -->


    </div> <!-- container-fluid -->
@endsection