@extends('layouts.admin')

@section('content')
<div class="card">
  <div>
	<div class="manageratetb">
	  <table class="table table-bordered" id="custombaserates-table">
		<thead>
            <tr>
				@if($customRateBase->origin_city)
				<th>orgCity</th>
			    @endif
				@if($customRateBase->destination_city)
				<th>destCity</th>
			    @endif
				@if($customRateBase->origin_state)
				<th>orgState</th>
			    @endif
				@if($customRateBase->destination_state)
				<th>destState</th>
			    @endif
				@if($customRateBase->origin_zip)
				<th>orgZip</th>
			    @endif
				@if($customRateBase->destination_zip)
				<th>destZip</th>
			    @endif
				@if($customRateBase->origin_area)
				<th>orgArea</th>
			    @endif
				@if($customRateBase->destination_area)
				<th>destArea</th>
			    @endif
				@if($customRateBase->minimum_charge)
				<th>minCharge</th>
			    @endif
				@if($customRateBase->mileage_rate_breakdowns)
					@foreach($customRateBase->mileage_rate_breakdowns as $breakdown)
					<th>Over {{ $breakdown }} Miles</th>
					@endforeach
			    @endif
				<th>Actions</th>
            </tr>
		</thead>
		<tbody>
		</tbody>
	  </table>
	</div>
  </div>
</div>
<div style="margin-left:0px;" class="newcontbtn">
    {{ csrf_field() }}
	<input type="button" value="Add" name="Add" id="add-rate" class="btn btn-sm btn-danger"></input>
	<input type="button" value="Import" id="importBtn" name="importBtn" class="btn btn-sm btn-danger">
	<input type="button" value="Export"  class="btn btn-sm btn-danger" onclick="location.href='{{ url('admin/customratebase/'.$customRateBase->id.'/rates/export') }}';">
	<input type="button" value="Back" name="Back" class="btn btn-sm btn-danger" onclick="location.href='{{ url('admin/customratebase/'.$customRateBase->id.'/edit') }}';"></input>
</div>
<!-- Column Preview Modal -->
<div class="modal fade addRateModal" id="addRateModal" role="dialog">
	<div class="modal-dialog">
	<!-- Modal content-->
	  <div class="modal-content">
		<div class="modal-header">
		  <button type="button" class="close" data-dismiss="modal">&times;</button>
		  <h4 class="modal-title firstTime" id="rateModalTitle"></h4>
		</div>
		<form class="form-floating form-validate form-ajax" id="rateform" name="rateform">
		<div class="modal-body">
			  <div class="col-md-12">
					<fieldset>
						@if($customRateBase->origin_city)
						<div class="form-group">
							<label for="origin_city" class="control-label">OrgCity</label>
								<input type="text" class="form-control cityField" name="origin_city" id="origin_city" data-validation="required">
						</div>
						@endif
						@if($customRateBase->destination_city)
						<div class="form-group">
							<label for="destination_city" class="control-label">destCity</label>
							<input type="text" class="form-control cityField" name="destination_city" id="destination_city" data-validation="required">
						</div>
						@endif
						@if($customRateBase->origin_state)
						<div class="form-group" style="width:400px;">
							<label for="origin_state" class="control-label normal">orgState</label>
							{!! FormField::select('origin_state', $states, null, true, 'Please Select', 'modalselect') !!}
						</div>
						@endif
						@if($customRateBase->destination_state)
						<div class="form-group" style="width:400px;">
							<label for="destination_state" class="control-label normal">destState</label>
							{!! FormField::select('destination_state', $states, null, true, 'Please Select', 'modalselect') !!}
						</div>
						@endif
						@if($customRateBase->origin_zip)
						<div class="form-group">
							<label for="origin_zip" class="control-label">orgZip</label>
							<input type="text" class="form-control zipField" name="origin_zip" id="origin_zip" maxlength="7" data-validation="length, validzip" data-validation-length="min5">
						</div>
						@endif
						@if($customRateBase->destination_zip)
						<div class="form-group">
							<label for="destination_zip" class="control-label">destZip</label>
							<input type="text" class="form-control zipField" name="destination_zip" id="destination_zip" maxlength="7" data-validation="length, validzip" data-validation-length="min5">
						</div>
						@endif
						@if($customRateBase->origin_area)
						<div class="form-group">
							<label for="origin_area" class="control-label">orgArea</label>
							<input type="text" class="form-control" name="origin_area" id="origin_area" data-validation="required">
						</div>
						@endif
						@if($customRateBase->destination_area)
						<div class="form-group">
							<label for="destination_area" class="control-label">destArea</label>
							<input type="text" class="form-control" name="destination_area" id="destination_area" data-validation="required">
						</div>
						@endif
						@if($customRateBase->minimum_charge)
						<div class="form-group">
							<label for="minimum_charge" class="control-label">minCharge</label>
							<input type="text" class="form-control" name="minimum_charge" id="minimum_charge" data-validation="number" data-validation-allowing="float">
						</div>
						@endif
						@if($customRateBase->mileage_rate_breakdowns)
						@foreach($customRateBase->mileage_rate_breakdowns as $breakdown)
						<div class="form-group">
							<label for="mile_{{ $breakdown }}" class="control-label">Over {{ $breakdown }} Miles</label>
							<input type="text" class="form-control" name="mile_{{ $breakdown }}" id="mile_{{ $breakdown }}" data-validation="number" data-validation-allowing="float">
						</div>
						@endforeach
						@endif
					</fieldset>
			  </div>
		  <div class="clearfix"></div>
		</div>
		<div class="modal-footer firstTime_footer">
		  {{ csrf_field() }}
		  <input type="hidden" name="id" id="id" class="hidden-field" value=""></input>
		  <input type="hidden" name="custom_rate_base_id" id="custom_rate_base_id" value="{{ $customRateBase->id }}"></input>
		  <input class="btn btn-sm btn-danger" type="submit" name="Save" value="Save" id="rate-save"></input>
		</div>
		</form>
	  </div>  
	</div>
</div>
<!--------->
<style>
.manageratetb table th{
	padding-right:5px !important;
	font-size: 10px;
}
</style>
@endsection


@section('scripts')
<script>
$(function() {
	
	function renderZeroValue(value)
	{
		if(String(value).charAt(0) == '.'){
			return '0'+value;
		}
		
		return value;
	}
    var custombaseratestable = $('#custombaserates-table').DataTable({
        processing: true,
        serverSide: true,
        ajax: "{!! route('admin.customratebase.anycustombaserates', $customRateBase->id) !!}", 
        columns: [
			@if($customRateBase->origin_city)
			{ data: 'origin_city', name: 'origin_city' },
			@endif
			@if($customRateBase->destination_city)
			{ data: 'destination_city', name: 'destination_city' },
			@endif
			@if($customRateBase->origin_state)
			{ data: 'origin_state', name: 'origin_state' },
			@endif
			@if($customRateBase->destination_state)
			{ data: 'destination_state', name: 'destination_state' },
			@endif
			@if($customRateBase->origin_zip)
			{ data: 'origin_zip', name: 'origin_zip' },
			@endif
			@if($customRateBase->destination_zip)
			{ data: 'destination_zip', name: 'destination_zip' },
			@endif
			@if($customRateBase->origin_area)
			{ data: 'origin_area', name: 'origin_area' },
			@endif
			@if($customRateBase->destination_area)
			{ data: 'destination_area', name: 'destination_area' },
			@endif
			@if($customRateBase->minimum_charge)
			{ data: 'minimum_charge', name: 'minimum_charge', "render": function ( data, type, row ) { return renderZeroValue(data); } },
			@endif
			@if($customRateBase->mileage_rate_breakdowns)
				@foreach($customRateBase->mileage_rate_breakdowns as $breakdown)
				 {data: 'mile_{{ $breakdown }}', name: 'mile_{{ $breakdown }}', "render": function ( data, type, row ) { return renderZeroValue(data); } },
				@endforeach
			@endif
			{data: 'actions', name: 'actions', orderable: false, searchable: false},
        ]
    });
	
	$('body').on('click', '.del-row', function () {
		var clickedRow = $(this);
		bootbox.confirm("Are you sure you want to delete?", function(result) {
			if(result){
				showLoader();
				$.ajax({
					type: 'POST',
					url:  '{!! url("admin/customratebase/rate") !!}/'+clickedRow.data('id'),
					data: {id: clickedRow.data('id'), _token: $("input[name='_token']").val(), _method: 'DELETE'},
					success: function (data) {
						hideLoader();
						toastr.success('Rate deleted successfully.');
						custombaseratestable.row( clickedRow.parents('tr') ).remove().draw();						
					}
				});
			}
		});
	});
	
	$('body').on('click', '.edit-row', function () {
		var clickedRow = $(this);
		showLoader();
		
		$.get('{!! url("admin/customratebase/getrate") !!}/'+clickedRow.data('id'),
		function(data) {
			hideLoader();
			$('#rateModalTitle').html('Edit Rate');
			
			$.each(data, function( index, value ) {
				if($('#'+index).length){
					 if($('#'+index).is("input")){
						  if($('#'+index).attr("type") == 'text'){
							  if(value !== ''){
								  if(String(value).charAt(0) == '.'){
									return '0'+value;
								  }
								  $('#'+index).val(value).parents('.form-group').addClass('filled');
							  }
						  }
						  else if($('#'+index).attr("type") == 'hidden'){
							  if(value){
								  $('#'+index).val(value);
							  }
						  }
					 }
					 else if($('#'+index).is("select")){
						  if(value){
							  $('#'+index).val(value);
							  if($('#'+index).hasClass("select2")){
								  $('#'+index).trigger('change');
							  }
						  }				 
					 }
				}
			});
			$('#addRateModal').modal('show');
		},
		"json");
	});
	
	$('body').on('click', '#add-rate', function () {
		$('#rateModalTitle').html('Add Rate');
		$('#addRateModal').modal('show');
	});
	
	$('#addRateModal').on('hidden.bs.modal', function (e) {
		resetForm($('#rateform'));
	});
	
	$('#rateform').on("formSubmitSuccess", function( event, form, requestType ) {
		
			var formData = $('#rateform').serialize();
			$('#addRateModal').modal('hide');
			showLoader();
			
			$.ajax({
				type: 'POST',
                url:  '{!! url("admin/customratebase/saverate") !!}',
				data: formData,
                dataType: 'json',
                success: function (data) {
					hideLoader();
					toastr.success(data.message);
					custombaseratestable.draw();
				}
			});
	});
	
	$('.modalselect').select2({ dropdownParent: $("#addRateModal") });
	
	
  var uploader = new ss.SimpleUpload({
        button: 'importBtn',
        url: '{!! url("admin/customratebase/import") !!}',
        name: 'uploadfile',
        multipart: true,
        hoverClass: 'hover',
        focusClass: 'focus',
        responseType: 'json',
		allowedExtensions: ["csv"],
		data: { id: '{{ $customRateBase->id }}', _token: $('input[name="_token"]').val() },
		autoSubmit : true,
        onExtError: function( filename, extension ){
			toastr.error('Only CSV files are allowed.');
		},
        onSubmit: function() {
			uploader.disable();
			showLoader();
			$('#importBtn').val('Uploading..');
          },
        onComplete: function( filename, response ) {
			uploader.enable();
			hideLoader();
			$('#importBtn').val('Import');

            if (!response) {
                toastr.error('Error occured. Please try again.');
                return;
            }

            if(response.status == 'success') {
			   toastr.success(response.message);
			   custombaseratestable.draw();
            }
			else{
				toastr.error(response.message);
			}
          },
        onError: function() {
			uploader.enable();
			hideLoader();
			$('#importBtn').val('Import');
			toastr.error('Error occured. Please try again.');
          }
	});
});
</script>
<script>
</script>
<style>
.modalselect{
	width:538px;
}
</style>
@endsection