@extends('layouts.admin')

@section('content')
<div class="row m-b-40">
  @if($customFuelSurcharge)
	<form action="{{ route('admin.customfuelsurcharge.update', $customFuelSurcharge->id) }}" method="POST" id="customfuelsurchargeform" class="form-floating form-validate" enctype="multipart/form-data">
	{{ method_field('PUT') }}
	{{ csrf_field() }}
	@var $btnLabel = 'Update'
	@var $fuelBased = ($customFuelSurcharge->fuel_cost_based ? true : false);
  @else
	<form action="{{ route('admin.customfuelsurcharge.store') }}" method="POST" id="customfuelsurchargeform" class="form-floating form-validate" enctype="multipart/form-data">
	{{ csrf_field() }}
	@var $btnLabel = 'Add'
	@var $fuelBased = true;
  @endif	  
		<div class="col-md-12">
		<div class="well white consearcheight">
			<fieldset>
			<div class="form-group">
				<label for="description" class="control-label">Description</label>
				<input type="text" class="form-control" id="description" name="description" value="{{ FormField::value('description', $customFuelSurcharge) }}" data-validation="required">
			</div>
			<div class="form-group" style="margin-top:45px;">
				<label class="control-label normal">Based on Fuel Cost</label>
				<div class="switch">
				  <label> No <input type="checkbox" name="fuel_cost_based" id="fuel_cost_based" value="1" @if($fuelBased == true) checked @endif ><span class="lever"></span> Yes </label>
				</div>
			</div>
			
			<div class="nfcb-box @if($fuelBased) hide @endif">
			<div class="form-group">
				<label for="fixed_rate" class="control-label">Fixed Fuel Surcharge Rate</label>
				<input type="text" class="form-control" id="fixed_rate" name="fixed_rate" value="{{ FormField::value('fixed_rate', $customFuelSurcharge) }}">
			</div>
			</div>
			
			<div class="fcb-box @if(!$fuelBased) hide @endif">
			<div class="form-group" style="margin-top:45px;">
				<label for="rate_type" class="control-label normal">Rate Type</label>
				{!! FormField::select('rate_type', $rateTypes, $customFuelSurcharge, false) !!}
			</div>
			<div class="form-group hide vc-box" style="margin-top:45px;">
				<label for="value_cost" class="control-label normal">Value Cost</label>
				{!! FormField::select('value_cost', $valueCosts, $customFuelSurcharge, true) !!}
			</div>
			<div class="form-group">
				<legend>Apply Fuel Charge</legend>
			</div>
			<div class="form-group">
				<div class="radio">
				  <label class="filled">
					<input type="radio" name="fuel_apply_type" id="fuel_apply_type_latest" value="latest" data-validation="required" data-validation-depends-on="fuel_cost_based" data-validation-depends-on-value="1" data-validation-error-msg-container="#fuel_apply_type_error" {{ FormField::checked('fuel_apply_type', $customFuelSurcharge, 'latest') }}
					> Day of Cost Change </label>
				</div>
			</div>
			<div class="form-group">
				<div class="radio">
				  <label class="filled">
					<input type="radio" name="fuel_apply_type" id="fuel_apply_type_weekday" value="weekday" data-validation="required" data-validation-depends-on="fuel_cost_based" data-validation-depends-on-value="1" data-validation-error-msg-container="#fuel_apply_type_error" {{ FormField::checked('fuel_apply_type', $customFuelSurcharge, 'weekday') }}
					> Weekday </label>
				</div>
			</div>
			<span id="fuel_apply_type_error"></span>
			<div id="weekday-box" class="hide">
			<div class="form-group" style="margin-top:45px;">
				<label for="week_day" class="control-label normal">Apply 1st</label>
				<select name="week_day" id="week_day" class="form-control" data-validation-depends-on-value="weekday" data-validation-depends-on="fuel_apply_type" data-validation="required">
					{!! FormField::dropDownOptions('week_day', $weekDays, $customFuelSurcharge) !!}
				</select>
			</div>
			<div class="form-group" style="margin-top:45px;">
				<label for="of_week" class="control-label normal">Of</label>
				<select name="of_week" id="of_week" class="form-control" data-validation-depends-on-value="weekday" data-validation-depends-on="fuel_apply_type" data-validation="required">
					{!! FormField::dropDownOptions('of_week', $ofWeeks, $customFuelSurcharge) !!}
				</select>
			</div>
			</div>
			</div>
		  </fieldset>
		</div>
		</div>			
		<div class="newcontbtn">
		  <input type="hidden" name="deleterates" id="deleterates" value="">
		  <input class="btn btn-sm btn-danger" type="submit" name="{{ $btnLabel }}" value="{{ $btnLabel }}">
		  <a href="{{ url('admin/customfuelsurcharge') }}" class="btn btn-sm btn-danger btn-white">Cancel</a>
		</div>
  </form>
</div>
@endsection

@section('scripts')
<script>
$(function(){
	$('#fuel_cost_based').change(function(){
		manageboxes();
	});
	
	function manageboxes()
	{
		if($('#fuel_cost_based').is(":checked"))
		{
			$('.fcb-box').removeClass('hide');
			$('.nfcb-box').addClass('hide');
			$('#rate_type').attr('data-validation', 'required');
			$('#fixed_rate').removeAttr('data-validation');
		}
		else{
			$('.nfcb-box').removeClass('hide');
			$('.fcb-box').addClass('hide');
			$('#fixed_rate').attr('data-validation', 'required');
			$('#rate_type').removeAttr('data-validation');
		}		
	}
	
	manageboxes();
	
	
	$('#rate_type').change(function(){
		managevaluecosts();
	});
	
	function managevaluecosts()
	{
		if($('#rate_type').val() == 'percent')
		{
			$('.vc-box').removeClass('hide');
			$('#value_cost').attr('data-validation', 'required');
		}
		else{
			$('.vc-box').addClass('hide');
			$('#value_cost').removeAttr('data-validation');
		}		
	}
	
	managevaluecosts();
	
	$("input[name='fuel_apply_type']").change(function(){
		manageweekdays();
	});
	
	function manageweekdays()
	{
		var fuelApplyType = $("input[type=radio][name='fuel_apply_type']:checked").val();
		
		if(fuelApplyType == 'latest'){
			$('#weekday-box').addClass('hide');
		}
		else if(fuelApplyType == 'weekday'){
			$('#weekday-box').removeClass('hide');
		}		
	}
	
	manageweekdays();
});
</script>
@endsection