@extends('layouts.master')

@section('title', '- Group List')

@section('links')
@endsection

@section('content-header', 'Group List')

@section('breadcrumb')
   <!-- <li><a href="{{ url('/group') }}">Group</a></li>  -->
<!-- <li class="active">Group List</li> -->
@endsection

@section('content')
<section class="content">

    <!-- End Navigation Bar-->

        <div class="container-fluid">
            <!-- Page-Title -->
            <div class="row">
                <div class="col-sm-12">
                    <div class="page-title-box">
                        <div class="btn-group float-right">
                            <ol class="breadcrumb hide-phone p-0 m-0">
                                <li class="breadcrumb-item"><a href="home">Dashboard</a></li>
                                <li class="breadcrumb-item"><a href="salutation">Add Role</a></li>

                            </ol>
                        </div>
                        <h4 class="page-title">Add Role</h4>
                    </div>
                </div>
            </div>
			</div>
			  </div>
</div>


<!-- end page title end breadcrumb -->
			<div class="wrapper">
            <div class="container-fluid" style="max-width: 1770px;">
            <div class="row">
                <div class="col-12">
                    <div class="card m-b-30">
                        <div class="card-body">
                            <h4 class="mt-0 header-title">Add Role</h4>
							<div class="pull-right">
								<a class="btn btn-primary" href="{{ route('roles.index') }}"> Back</a>
							</div>
							@if (count($errors) > 0)
								<div class="alert alert-danger">
									<strong>Whoops!</strong> There were some problems with your input.<br><br>
									<ul>
									@foreach ($errors->all() as $error)
										<li>{{ $error }}</li>
									@endforeach
									</ul>
								</div>
							@endif
							<div class="row">
							  <div class="col-md-4">
							{!! Form::open(array('route' => 'roles.store','method'=>'POST')) !!}
							{{ Form::radio('select_role', 'r_department' , true) }}  By Department
                            {{ Form::radio('select_role', 'r_designation' , false) }}  By Designation
                            {{ Form::radio('select_role', 'r_profile' , false) }}  By Profile
							   </div>
							</div>
							<div class="row">
								<div class="col-xs-2 col-sm-2 col-md-2 department" style="margin-top: 10px;">
								<div class="form-group">
                             {!! Form::select('department', [null => 'Select Department'] + $department, 
                                     ['class'=>'form-control'],['class'=>'form-control','id'=>'department'])!!}

                                   </div>
                               </div>
                               <div class="col-xs-2 col-sm-2 col-md-2 designation" style="display:none; margin-top: 10px;">
								<div class="form-group">
                             {!! Form::select('designation', [null => 'Select Designation'], 
                                     ['class'=>'form-control'],['class'=>'form-control','id'=>'designation'])!!}

                                   </div>
                               </div>
							   
                               <div class="col-md-4 profile" style="display:none; margin-top: 10px;">
								<div class="form-group">
                                 {!! Form::text('profile_name', null, array('placeholder' => 'Name Profile','id'=>'profile_name','class' => 'form-control')) !!}
                                   </div>
                               </div>
							   
							   <div class="col-xs-2 col-sm-2 col-md-2" style="display:none;">
								<div class="form-group">
                             {!! Form::select('level', [null => 'Select Level'] + $levels, 
                                     ['class'=>'form-control'],['class'=>'form-control','id'=>'level'])!!}

                                   </div>
                               </div>
							   
								<div class="col-xs-12 col-sm-12 col-md-12">
									 
									<div class="form-group">
										<strong>Name:</strong>
										{!! Form::text('name', null, array('placeholder' => 'Name','id'=>'role_name','readonly'=>'readonly','class' => 'form-control')) !!}
									</div>
								</div>
								<div class="col-xs-12 col-sm-12 col-md-12">
									<div class="form-group">
										<strong>Permission:</strong>
										<br/>
										@foreach($permission as $value)
                                         <div class="switch">
											<label>{{ Form::checkbox('permission[]', $value->id, false, array('class' => 'name')) }}
											{{ $value->name }} <span class="lever switch-col-green"></span></label>
										<br/>
                                       </div>
										@endforeach
									</div>
								</div>
								<div class="col-xs-12 col-sm-12 col-md-12 text-center">
									<button type="submit" class="btn btn-primary">Submit</button>
								</div>
							</div>
							{!! Form::close() !!}
						</div>
                    </div>
                </div>
            </div>
            <!-- end row -->

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

</section>
@endsection

@section('scripts')

<script type="text/javascript">

	
	  $(function() {
        $('select[name=department]').change(function() {
        	// role=$("form select[name= designation]").text();

        	
          var department =  $(this).val();
  
            var url = '{{ url('department') }}/'+ $(this).val()+'/designation';
            
            $.get(url, function(data) {       
                var select = $('select[name= designation]');

                select.empty();
                select.append("<option value=''>Select designation</option>");
                $.each(data,function(key, value) {
                    select.append('<option value=' + value.id + '>' + value.name + '</option>');
                });
            });
        });

  $('select[name=level]').change(function() {
        var designation=$("#department :selected").text();
        var department=$("#designation :selected").text();
        var level=$("#level :selected").text();
        $("#role_name").val(designation+'_'+department+'_'+level);
        });
		
		var roleValue = $("input[name=select_role]:checked").val();
		if(roleValue=='r_department'){
			$(".department").show();
			$('select[name=department]').change(function() {
				var deprtvalue = $(this).find("option:selected").text();
				$("#role_name").val(deprtvalue);
			});
		}else if(roleValue=='r_designation'){
			$(".department").show();
			$(".designation").show();
			$('select[name=designation]').change(function() {
				var designation = $(this).find("option:selected").text();
				$("#role_name").val(designation);
			});
		}else if(roleValue=='r_profile'){
			$(".profile").show();
			$(".department").hide();
			$('#profile_name').change(function() {
				var profile_name = $(this).val();
				$("#role_name").val(profile_name);
			});
		}
		
		
	$("input[type=radio][name=select_role]").change(function(){
		$('select[name= designation]').prop('selectedIndex',0);
		$('select[name= department]').prop('selectedIndex',0);
		var roleValue = $("input[name=select_role]:checked").val();
		if(roleValue=='r_designation'){
			$("#role_name").val("");
			$(".department").show();
			$(".designation").show();
			$(".profile").hide();
			$('select[name=designation]').change(function() {
				var designation = $(this).find("option:selected").text();
				$("#role_name").val(designation);
			});
		}else if(roleValue=='r_department'){
			$("#role_name").val("");
			$(".department").show();
			$(".designation").hide();
			$(".profile").hide();
			$('select[name=department]').change(function() {
				var deprtvalue = $(this).find("option:selected").text();
				$("#role_name").val(deprtvalue);
			});
		}else if(roleValue=='r_profile'){
			$("#role_name").val("");
			$(".department").hide();
			$(".designation").hide();
			$(".profile").show();
			$('#profile_name').change(function() {
				var profile_name = $(this).val();
				$("#role_name").val(profile_name);
			});
		}
	});	

    });
</script>

@endsection