HEX
Server: Apache/2.4.41 (Amazon) OpenSSL/1.0.2k-fips PHP/5.6.40
System: Linux ip-172-31-40-18 4.14.146-93.123.amzn1.x86_64 #1 SMP Tue Sep 24 00:45:23 UTC 2019 x86_64
User: apache (48)
PHP: 5.6.40
Disabled: NONE
Upload Files
File: /var/www/html/taxicamera/application/views/admin/payin/add_payin.php
<style>
	#video,#video1,#video2,#video3 {
		border: 5px solid #28ce92;
    box-shadow: none;
    width: 100%;
    height: auto;
	}

	#photo,#photo1,#photo2,#photo3 {
		border: 5px solid #28ce92;
    box-shadow: none;
    width: 100%;
    height: 358px;
    float: right;
    position: relative;
    top: 0;
	}

	#canvas,#canvas1,#canvas2,#canvas3 {
	display:none;
	}

	.camera,.camera1,.camera2,.camera3 {
		width: 49%;
    display: inline-block;
	}

	.output,.output1,.output2,.output3 {
	width: 49%;
	display:inline-block;
	}

	/*#startbutton,#startbutton1 {
		display:block;
		position:relative;
		margin-left:auto;
		margin-right:auto;
		bottom:32px;
		background-color: rgba(0, 150, 0, 0.5);
		border: 1px solid rgba(255, 255, 255, 0.7);
		box-shadow: 0px 0px 1px 2px rgba(0, 0, 0, 0.2);
		font-size: 14px;
		font-family: "Lucida Grande", "Arial", sans-serif;
		color: rgba(255, 255, 255, 1.0);
	}*/

	.contentarea,.contentarea1,.contentarea2,.contentarea3 {
	font-size: 16px;
	font-family: "Lucida Grande", "Arial", sans-serif;
	width: 100%;
	}

	#payin_data_div hr{
		border-color: #ccc;
	}
</style>
<div class="main-content">
	<div class="content-wrapper">
		<div class="container-fluid">
			<!-- Basic form layout section start -->
			<section id="basic-form-layouts">
				<div class="row">
					<div class="col-md-12">
						<div class="card">
							<div class="card-header">
								<div class="page-title-wrap">
									<h4 class="card-title">Start Shift & Submit Payin</h4>
								</div>
							</div>
							<div class="card-body">
								<div class="px-3">
									<form id="driver_payin" class="roster_form_s" method="post">
										<input type="hidden" id="shift_id" name="shift_id" value="">
										<div class="form-body">
											<div class="daily_stl_top_box">
												<div class="filter_area">
													<div class="row">
														<div class="col-md-3">
															<div class="form-group">
																<label>Select Driver</label>
																<div class="input-group">
																	<select id="driver_id" name="driver_id" class="js-select2" data-show-subtext="true" data-live-search="true" required>
																		<option value="">Select Driver</option>
																		<?php if (!empty($driver_list)) : ?>
																			<?php foreach ($driver_list as $list) : ?>
																				<?php if (!empty($list['middle_name'])) : ?>
																					<?php $middle = $list['middle_name'] . ' '; ?>
																				<?php else : ?>
																					<?php $middle = ''; ?>
																				<?php endif; ?>
																				<option value="<?php echo $list['user_id']; ?>"><?php echo $list['first_name'] . ' ' . $middle . $list['last_name'] . ' - ' . $list['dc_no']; ?></option>
																			<?php endforeach; ?>
																		<?php endif; ?>
																	</select>
																</div>
															</div>
														</div>
														<div class="col-md-4">
															<div class="form-group">
																<label>Shift From Date</label>
																<div class="input-group">
																	<input type="text" class="form-control" id="shift_from_date" name="shift_from_date" value="" placeholder="" required />
																	<div class="input-group-append">
																		<span class="input-group-text">
																			<span class="fa fa-calendar-o"></span>
																		</span>
																	</div>
																</div>
															</div>
														</div>
														<div class="col-md-4">
															<div class="form-group">
																<label>Shift To Date</label>
																<div class="input-group">
																	<input type="text" class="form-control" id="shift_to_date" name="shift_to_date" placeholder="" value="" required />
																	<div class="input-group-append">
																		<span class="input-group-text">
																			<span class="fa fa-calendar-o"></span>
																		</span>
																	</div>
																</div>
															</div>
														</div>
														<div class="col-md-1">
															<div class="form-group">
																<button type="button" name="search_payin" id="search_payin" class="btn btn-success" style="margin-top:30px;">Search</button>
															</div>
														</div>
													</div>
												</div>
											</div>
												
											<div class="row">
												<div id="shift_data_div" class="col-md-12"></div>									
											</div>
											<div class="row">
												<div id="payin_data_div" style="display:none;" class="col-md-12">
													<div class="table_row repeat">
													<h4 style="font-weight: bold;">Start & Finsh Reading Details : </h4>
														<div class="table-responsive custom_table_area">
															<table class="table table-striped table-bordered daily_stl_table">
																<thead>
																	<tr>
																		<th width="25%">Start Reading</th>
																		<th width="25%">Name of Reading</th>
																		<th width="25%">Finish Reading</th>
																	</tr>
																</thead>
																<tbody>
																	<tr class="start_finish_reading_tr">
																		<td>
																			<input type="text" class="form-control decimal_validation_cls start_finish_reading " id="total_extra_start" name="total_extra_start" style="width:65%" value="" required>
																		</td>
																		<td>Total + Extra</td>
																		<td>
																			<input type="text" class="form-control decimal_validation_cls start_finish_reading" style="width:65%" id="total_extra_end" name="total_extra_end" value="" required>
																		</td>
																	</tr>
																	<tr class="start_finish_reading_tr">
																		<td>
																			<input type="text" class="form-control num_validation_cls start_finish_reading" style="width:65%" id="paid_km_start" name="paid_km_start" value="" required>
																		</td>
																		<td>Paid KM</td>
																		<td>
																			<input type="text" class="form-control num_validation_cls start_finish_reading" style="width:65%" id="paid_km_end" name="paid_km_end" value="" required>
																		</td>
																	</tr>
																	<tr class="start_finish_reading_tr">
																		<td>
																			<input type="text" class="form-control num_validation_cls start_finish_reading" style="width:65%" id="total_km_start"  name="total_km_start" value=""  required>
																		</td>
																		<td>Total KM</td>
																		<td>
																			<input type="text" class="form-control num_validation_cls start_finish_reading" style="width:65%" id="total_km_end"  name="total_km_end" value=""  required>
																		</td>
																	</tr>
																	<tr class="start_finish_reading_tr">
																		<td>
																			<input type="text" class="form-control num_validation_cls start_finish_reading" style="width:65%" id="extra_start" name="extra_start" value=""  required>
																		</td>
																		<td>Extra</td>
																		<td>
																	
																			<input type="text" class="form-control num_validation_cls start_finish_reading" style="width:65%" id="extra_end" name="extra_end" value=""  required>
																		</td>
																	</tr>
																	<tr class="start_finish_reading_tr">
																		<td>
																			<input type="text" class="form-control num_validation_cls start_finish_reading" style="width:65%" id="no_of_hiring_start" name="no_of_hiring_start" value=""  required>
																		</td>
																		<td>Number of Hiring</td>
																		<td>
																			<input type="text" class="form-control num_validation_cls start_finish_reading" style="width:65%" id="no_of_hiring_end" name="no_of_hiring_end" value=""  required>
																		</td>
																	</tr>
																	<tr class="start_finish_reading_tr">
																		<td>
																			<input type="text" class="form-control num_validation_cls start_finish_reading" style="width:65%" id="speedo_reading_start" name="speedo_reading_start" value="" required>
																		</td>
																		<td>Speedo Reading</td>
																		<td>
																			<input type="text" class="form-control num_validation_cls start_finish_reading" style="width:65%" id="speedo_reading_end" name="speedo_reading_end" value=""  required>
																		</td>
																	</tr>                    
																</tbody>
															</table>
														</div>
														<h5 style="font-weight: bold; display: inline-block;">KM TRAVELLED : <span id="km_travelled_span">0.00</span></h5>
														<h5 style="font-weight: bold; display: inline-block; float:right;">METERED FARES : <span id="metered_fares_span">0.00</span></h5>
														<input type="hidden" id="km_travelled" name="km_travelled" value="">
														<input type="hidden" id="metered_fares" name="metered_fares" value="">
													</div>
													
													<div class="table_row repeat">
														<h5 style="font-weight: bold; display: inline-block;">Life-Time Total : </h5>
														<input type="hidden" id="life_time_total_image" name="life_time_total_image" value="">
														<select name="life_time_total_image_type" class="lifetime_total_upload_image_btn">
															<option value="">Select</option>
															<option value="C" selected>Camera</option>
															<option value="F">File</option>
														</select>
														<input type="file" id="life_time_total_image_file" name="life_time_total_image_file" class="life_time_total_image_file" style="display:none;">
														<div class="contentarea2">
															<div class="camera2">
																<video id="video2">Video stream not available.</video>
																
															</div>
															<canvas id="canvas2"></canvas>
															<div class="output2">
																<img id="photo2" alt="The screen capture will appear in this box."> 
															</div>
															<hr>				
															<button id="startbutton2" type="button" data-button_id="" class="btn btn-success btn-sm">Capture</button> 
														</div>
													</div>


													<div class="table_row repeat">
													<h5 style="font-weight: bold; display: inline-block;">Shift Total : </h5>
														<input type="hidden" id="shift_total_image" name="shift_total_image" value="">
														<select name="shift_total_image_type" class="shift_total_upload_image_btn">
															<option value="">Select</option>
															<option value="C" selected>Camera</option>
															<option value="F">File</option>
														</select>
														<input type="file" id="shift_total_image_file" name="shift_total_image_file" class="shift_total_image_file" style="display:none;">
														
														<div class="contentarea3">
															<div class="camera3">
																<video id="video3">Video stream not available.</video>
																
															</div>
															<canvas id="canvas3"></canvas>
															<div class="output3">
																<img id="photo3" alt="The screen capture will appear in this box."> 
															</div>
															<hr>				
															<button id="startbutton3" type="button" data-button_id="" class="btn btn-success btn-sm">Capture</button> 
														</div>
																					
													
													</div>
													
													<div class="table_row repeat">
														<h4 style="font-weight: bold;">Other Details : </h4>
														<div class="list_filter_sett">
															<ul>
																<li><strong>Total Fares : </strong><span id="total_fares_text"></span></li>
																<input type="hidden" id="total_fares" name="total_fares" value="">
																<li><strong>No Of Hirings : </strong><span id="no_of_hiring_text"></span></li>
																<input type="hidden" id="no_of_hiring" name="no_of_hiring" value="">
																<li><strong>Levy : </strong><span id="levy_text"></span></li>
																<input type="hidden" id="levy" name="levy" value="">
																<li class="no_of_whl_div"><strong>No Of WHL : </strong><input type="text" class="form-control" id="no_of_whl" name="no_of_whl" value="" width="50%"></li>
																<li class="no_of_whl_div"><strong>WHL : </strong><input type="hidden" id="whl" name="whl" value=""><span id="whl_text"></span></li>
																					

															</ul>
														</div>
													</div>
													
													
													
													<div class="table_row repeat">
														<h4 style="font-weight: bold;">Dockets Details 
															<button type="button" id="add_more_docket" class="btn btn-success btn-sm" style="float:right;"><span><i class="fa fa-plus" aria-hidden="true"></i></span> Docket</button> 
														</h4>
														<div class="table-responsive custom_table_area">
															<table class="table table-striped table-bordered daily_stl_table">
																<thead>
																	<tr>
																		<th width="33%">Dockets Name</th>
																		<th width="33%">Photo</th>
																		<th width="34%">Total</th>
																	</tr>
																</thead>
																<tbody id="driver_docket_tbody"><tr><td colspan="3">No Data Available</td></tr></tbody>
																<tfoot>
																	<tr>
																		<td colspan="2"><strong>TOTAL</strong></td>
																		<td><strong id="docket_total_text">0.00</strong></td>
																		<input type="hidden" id="docket_total" name="docket_total" value="0">
																	</tr>
																</tfoot>
															</table>
														</div>
														<div class="contentarea" style="display:none;">
															<div class="camera">
																<video id="video">Video stream not available.</video>
																
															</div>
															<canvas id="canvas"></canvas>
															<div class="output">
																<img id="photo" alt="The screen capture will appear in this box."> 
															</div>
															<hr>				
															<button id="startbutton" type="button" data-button_id="" class="btn btn-success btn-sm">Capture</button> 
														</div>

													</div>
													<div class="table_row repeat">
														<h4 style="font-weight: bold;">Expense Details
															<button type="button" id="add_more_expense" class="btn btn-success btn-sm" style="float:right;"><span><i class="fa fa-plus" aria-hidden="true"></i></span> Expense</button>
														</h4>
														<div class="table-responsive custom_table_area">
															<table class="table table-striped table-bordered daily_stl_table">
																<thead>
																	<tr>
																		<th width="33%">Expense Name</th>
																		<th width="33%">Photo</th>
																		<th width="34%">Amount</th>
																	</tr>
																</thead>
																<tbody id="driver_expense_tbody"><tr><td colspan="3">No Data Available</td></tr></tbody>
																<tfoot>
																	<tr>
																		<td colspan="2"><strong>TOTAL</strong></td>
																		<td><strong id="expense_total_text">0.00</strong></td>
																		<input type="hidden" id="expense_total" name="expense_total" value="0">
																	</tr>
																</tfoot>
															</table>
														</div>
														<div class="contentarea1" style="display:none;">
															<div class="camera1">
																<video id="video1">Video stream not available.</video>
																 
															</div>
															<canvas id="canvas1"></canvas>
															<div class="output1">
																<img id="photo1" alt="The screen capture will appear in this box."> 
															</div>
															<hr>
															<button id="startbutton1" type="button" data-button_id="" class="btn btn-success btn-sm">Capture</button>
														</div>
													</div>
												
													<div class="table_row repeat">
														<h5 style="font-weight: bold; display: inline-block;">SUBTOTAL : <span id="subtotal_span">0.00</span></h5>
														<h5 style="font-weight: bold; display: inline-block; float:right;">TOTAL PAYIN PAYOUT : <span id="tot_payin_payout_span">0.00</span></h5>
														<input type="hidden" id="subtotal" name="subtotal" value="">
														<input type="hidden" id="tot_payin_payout" name="tot_payin_payout" value="">
													</div>
													
													
												</div>
        									</div>
        									
											<div id="payin_submit_div" class="form-actions" style="display:none;text-align:center;">
												<button type="submit" id="submit_driver_payin" class="btn btn-success">
													<i class="fa fa-floppy-o" aria-hidden="true"></i> Submit
												</button>
											</div>
										</div>
									</form>
								</div>
							</div>
						</div>
					</div>
				</div>
			</section>
			<!-- // Basic form layout section end -->
		</div>
	</div>
</div>
<script type="text/javascript"> base_url = "<?=base_url()?>"; </script>
<script src="<?=base_url('public/admin_assets/js/capture.js')?>"></script>
<script src="<?=base_url('public/admin_assets/js/capture_expense.js')?>"></script>
<script src="<?=base_url('public/admin_assets/js/capture_life_time_docs.js')?>"></script>
<script src="<?=base_url('public/admin_assets/js/shift_docs.js')?>"></script>
<script>
	$(document).ready(function() {

		$(".js-select2").select2();
		populate_datepicker();
		$(".decimal_validation_cls").inputFilter(function(value) {
      		return /^-?\d*[.]?\d*$/.test(value);  
    	});
    	$(".num_validation_cls").inputFilter(function(value) {
      		return /^\d*$/.test(value);    
    	});

	})

	function populate_datepicker() {

		var from_$input = $('#shift_from_date').pickadate({
				format: 'dd/mm/yyyy',
				autoclose: true
			}),
			from_picker = from_$input.pickadate('picker')

		var to_$input = $('#shift_to_date').pickadate({
				format: 'dd/mm/yyyy',
				autoclose: true,
				max:new Date()
			}),
			to_picker = to_$input.pickadate('picker')

		// Check if there’s a “from” or “to” date to start with.
		if (from_picker.get('value')) {
			to_picker.set('min', from_picker.get('select'))
		}
		if (to_picker.get('value')) {
			from_picker.set('max', to_picker.get('select'))
		}

		// When something is selected, update the “from” and “to” limits.
		from_picker.on('set', function(event) {

			if (event.select) {
				to_picker.set('min', from_picker.get('select'));
			} else if ('clear' in event) {
				to_picker.set('min', false);
			}
		})

		to_picker.on('set', function(event) {

			if (event.select) {
				from_picker.set('max', to_picker.get('select'));
			} else if ('clear' in event) {
				from_picker.set('max', false);
			}
		})

	}


		$(document).on('keyup change',"#total_extra_start,#total_extra_end,#no_of_hiring_start,#no_of_hiring_end,#speedo_reading_start,#speedo_reading_end",function(){

			var total_extra_start = $("#total_extra_start").val();
			var total_extra_end = $("#total_extra_end").val();
			if(total_extra_start && total_extra_end){
				var metered_fares= parseFloat(Number(total_extra_end) - Number(total_extra_start)).toFixed(2);
				$("#metered_fares_span").text(metered_fares);
				$("#metered_fares").val(metered_fares);
				$("#total_fares_text").text(metered_fares);
				$("#total_fares").val(metered_fares);
			}

			var speedo_reading_start = $("#speedo_reading_start").val();
			var speedo_reading_end = $("#speedo_reading_end").val();
			if(speedo_reading_start && speedo_reading_end){
				var km_travelled= parseFloat(Number(speedo_reading_end) - Number(speedo_reading_start)).toFixed(2);
				$("#km_travelled_span").text(km_travelled);
				$("#km_travelled").val(km_travelled);
			}
			
			var no_of_hiring_start = $("#no_of_hiring_start").val();
			var no_of_hiring_end = $("#no_of_hiring_end").val();
			if(no_of_hiring_start && no_of_hiring_end){
				var no_of_hiring= parseInt(Number(no_of_hiring_end) - Number(no_of_hiring_start));
				$("#no_of_hiring_text").text(no_of_hiring);
				$("#no_of_hiring").val(no_of_hiring);
			}

			var levy_rate = $("#levy_rate").val();
			var levy = parseFloat(no_of_hiring * levy_rate).toFixed(2);
			$("#levy_text").text(levy);
			$("#levy").val(levy);
			
			
			calculate_subtotal_payin_payout();
			
		})

		 
		// $(document).on('keyup change',"#no_of_hiring_start,#no_of_hiring_end",function(){

		// 	var no_of_hiring_start = $("#no_of_hiring_start").val();
		// 	var no_of_hiring_end = $("#no_of_hiring_end").val();
		// 	var no_of_hiring= parseInt(Number(no_of_hiring_end) - Number(no_of_hiring_start));
		// 	$("#no_of_hiring_text").text(no_of_hiring);
		// 	$("#no_of_hiring").val(no_of_hiring);

		// 	var levy_rate = $("#levy_rate").val();
		// 	var levy = parseFloat(no_of_hiring * levy_rate).toFixed(2);
		// 	$("#levy_text").text(levy);
		// 	$("#levy").val(levy);
		// 	calculate_subtotal_payin_payout();
		// })


		$(document).on('keyup change',"#no_of_whl",function(){

			var no_of_whl = $("#no_of_whl").val();
			var lifting_fees = $("#lifting_fees").val();
			var whl= parseFloat(Number(no_of_whl) * Number(lifting_fees)).toFixed(2);
			$("#whl_text").text(whl);
			$("#whl").val(whl);

			calculate_subtotal_payin_payout();

		})

		$(document).on('keyup change',".docket_price_cls",function(){
			calculate_docket_total();
		})

		function calculate_docket_total(){

			var docket_total_price = 0 * 1;
			$('.docket_price_cls').each(function(){
				docket_total_price +=Number($(this).val());
			})
			$("#docket_total").val(parseFloat(docket_total_price).toFixed(2));
			$("#docket_total_text").text(parseFloat(docket_total_price).toFixed(2));
			calculate_subtotal_payin_payout();
		
		}	

		$(document).on('keyup change',".expense_price_cls",function(){
			calculate_expense_total();
		})

		function calculate_expense_total(){
			var expense_total_price = 0 * 1;
			$('.expense_price_cls').each(function(){
				expense_total_price +=Number($(this).val());
			})
			$("#expense_total").val(parseFloat(expense_total_price).toFixed(2));
			$("#expense_total_text").text(parseFloat(expense_total_price).toFixed(2));
			calculate_subtotal_payin_payout();
		}


		function calculate_subtotal_payin_payout(){

			var dr_driver_type=Number($("#dr_driver_type").val());
			var totalFare = Number($("#total_fares").val());
			var commissionRateDriver = Number($("#commission_rate_driver").val());
			var levy = Number($("#levy").val());
			var bond_value = Number($("#bond_value").val());
			var total_docket = Number($("#docket_total").val());
			var total_expense = Number($("#expense_total").val());
			var lifting_fees = Number($("#whl").val());

			var SubTotal = Number(0);
			var tot_payin_payout = Number(0);
			
			if(dr_driver_type == 1)
         		SubTotal = (totalFare * (commissionRateDriver * 0.01)) + levy + bond_value - total_docket;
				 
        	else{
            	SubTotal = (totalFare * (commissionRateDriver * 0.01)) + levy + bond_value - total_docket + lifting_fees;
        	}
			tot_payin_payout = Number(SubTotal) - Number(total_expense);
			
			$("#subtotal").val(SubTotal.toFixed(2));
			$("#subtotal_span").text(SubTotal.toFixed(2));
			$("#tot_payin_payout").val(tot_payin_payout.toFixed(2));
			$("#tot_payin_payout_span").text(tot_payin_payout.toFixed(2));
			
			
 
		}


		$(document).on('change',".start_finish_reading",function(){

			var start_reading = $(this).parents('.start_finish_reading_tr').find('td:nth-child(1) input').val();
			var end_reading = $(this).parents('.start_finish_reading_tr').find('td:nth-child(3) input').val();
			if(start_reading && end_reading){
				if(Number(start_reading) > Number(end_reading)){

					$.alert({
						type: 'red',
						title: 'Alert!',
						content: 'Finish Reading Should Be Greater Than Start Reading',
					});
					$(this).parents('.start_finish_reading_tr').find('td:nth-child(3) input').val('');
				}
			}

		})
		
		$(document).on('click', '#search_payin', function() {
			search_payin();
		});
		
		function search_payin(){
			var shift_from_date = $('#shift_from_date').val();
			var shift_to_date = $('#shift_to_date').val();
			var driver_id = $("#driver_id").val();
			$.ajax({
				type: "POST",
				url: '<?= base_url('admin/payin/search_payin') ?>',
				data: {
					shift_from_date: shift_from_date,
					driver_id: driver_id,
					shift_to_date: shift_to_date
				},
				dataType: 'json',
				encode: true,
				async:false,
				success: function(data) {
					if(data.status){
						var resultHTML =`<div class="table_row repeat"><h4 style="font-weight: bold;">Shift Details : </h4><div class="list_filter_sett"><ul>`;
						
						if(data.shift_details.status_code==1){
							resultHTML +=`<li><strong>Status :</strong> `+data.shift_details.status+`</li>
										<li><strong>Car No :</strong> `+data.shift_details.car_no+`</li>
										<input type="hidden" id="roster_driver_id" name="roster_driver_id" value="`+data.shift_details.roster_driver_id+`">
										<li><button type="button" id="start_shift_btn" class="btn btn-success">Start Shift</button></li>`;
						} else if(data.shift_details.status_code==2){
							resultHTML +=`<li><strong>Status :</strong> `+data.shift_details.status+`</li>
										<li><strong>Car No :</strong> `+data.shift_details.car_no+`</li>
										<input type="hidden" id="roster_driver_id" name="roster_driver_id" value="`+data.shift_details.roster_driver_id+`">
										<li><strong>Shift No :</strong> `+data.shift_details.shift_no+`</li>
										<li><button type="button" id="end_shift_btn" class="btn btn-success">End Shift</button></li>`;
							$("#shift_id").val(data.shift_details.shift_id);
						}else{
							resultHTML +=`<li><strong>Status :</strong> `+data.shift_details.status+`</li>
										<input type="hidden" id="roster_driver_id" name="roster_driver_id" value="`+data.shift_details.roster_driver_id+`">`;
						}
						resultHTML +=`</ul></div></div>`;
						if(data.payin_onload_value){
						 	resultHTML +=`<div class="table_row repeat">
												<h4 style="font-weight: bold;">Driver Details : </h4>
												<div class="list_filter_sett">
													<ul>
														<li><strong>Driver Type : </strong>`+((data.payin_onload_value.dr_driver_type==1)?`Sedan`:`Maxi`)+`</li>
														<input type="hidden" id="dr_driver_type" name="dr_driver_type" value="`+data.payin_onload_value.dr_driver_type+`">
														<li><strong>Rental : </strong>`+((data.payin_onload_value.dr_rental && data.payin_onload_value.dr_rental !=0)?data.payin_onload_value.dr_rental:`N/A`)+`</li>
														<input type="hidden" id="dr_rental" name="dr_rental" value="`+data.payin_onload_value.dr_rental+`">
														
														<li><strong>Bond :</strong> `+data.payin_onload_value.bond_value+`</li>
														<input type="hidden" id="bond_value" name="bond_value" value="`+data.payin_onload_value.bond_value+`">
														<li><strong>Levy Rate :</strong> `+data.payin_onload_value.levy_rate+`</li>
														<input type="hidden" id="levy_rate" name="levy_rate" value="`+data.payin_onload_value.levy_rate+`">
														<li><strong>Lifting Fees :</strong> `+data.payin_onload_value.lifting_fees+`</li>
														<input type="hidden" id="lifting_fees" name="lifting_fees" value="`+data.payin_onload_value.lifting_fees+`">
														<input type="hidden" id="commission_rate_driver" name="commission_rate_driver" value="`+data.payin_onload_value.commission_rate_driver+`">
													</ul>
												</div>
											</div>`;
						}
						
						$("#shift_data_div").html(resultHTML);
						if(data.previous_payin_details){

							$("#total_extra_start").val(Number(data.previous_payin_details.total_extra_start).toFixed(2));
							$("#paid_km_start").val(Number(data.previous_payin_details.paid_km_start));
							$("#total_km_start ").val(Number(data.previous_payin_details.total_km_start));
							$("#extra_start").val(Number(data.previous_payin_details.extra_start));
							$("#no_of_hiring_start").val(Number(data.previous_payin_details.no_of_hiring_start));
							$("#speedo_reading_start").val(Number(data.previous_payin_details.speedo_reading_start));
						}

					}
				},
				error: function(response) {
					$.alert({
						type: 'red',
						title: 'Alert!',
						content: 'Oops!Something went wrong...',
					});
				}
			});
		}

	$(document).on('click', '#start_shift_btn', function() {
		var roster_driver_id = $('#roster_driver_id').val();
		
		$.ajax({
			type: "POST",
			url: '<?= base_url('admin/payin/start_shift') ?>',
			data: {
				roster_driver_id: roster_driver_id
			},
			dataType: 'json',
			encode: true,
			async:false,
			success: function(data) {
				if(data.status){
					$.alert({
						type: 'green',
						title: data.msg,
						content: 'Shift No : '+data.shift_details.shift_no,
					});
					$("#shift_id").val(data.shift_details.shift_id);
					search_payin();
				}
			},
			error: function(response) {
				$.alert({
					type: 'red',
					title: 'Alert!',
					content: 'Oops!Something went wrong...',
				});
			}
		});
	});

	$(document).on('click', '#end_shift_btn', function() {
		$("#payin_data_div").show();
		$("#payin_submit_div").show();
		if($("#dr_driver_type").val() == 1){
			$(".no_of_whl_div").hide();
		}else{
			$(".no_of_whl_div").show();
		}

	});
	var i = 0,j = 0;
	$("#add_more_docket").click(function(){i++;
		var resultHTML =`<tr class="driver_docket_tr">                                  
							<td>
						   		<select  name="docket_id[]" class="js-select2" data-show-subtext="true" data-live-search="true" required>
									<option value="">Select Docket</option>
									<?php if(!empty($docket_list)): ?>
									<?php   foreach($docket_list as $list): ?>
									<option value="<?php echo $list['docket_id'];?>"><?php echo $list['docket_name'];?></option>
									<?php   endforeach; ?>
									<?php endif; ?>
						   		</select>
						 	</td>
							<td>
								
								<select name="docket_image_type[]" class="docket_upload_image_btn">
								<option value="" data-id="`+i+`">Select</option>
								<option value="C" data-id="`+i+`">Camera</option>
								<option value="F" data-id="`+i+`">File</option>
								</select>
								
								<input type="hidden" id="docket_image_`+i+`"  class="docket_image" name="docket_image[]">
								<input type="file" id="docket_image_file_`+i+`" name="docket_image_file[]" class="docket_image_file" style="display:none;">

								<a id="docket_uploaded_a_`+i+`" data-fancybox data-caption="Dockets IMAGE">
								<img id="docket_uploaded_img_`+i+`" alt="The screen capture will appear in this box." height="50px" width="50px" style="display:none;"> 
								</a>  
								
							</td>
						 	<td class="td_amount_right">
							 	<div class="input-group">
									<div class="input-group-prepend">
										<span class="input-group-text" id="basic-addon1">$</span>
									</div>
									<input class="form-control  decimal_validation_cls docket_price_cls" type="text" name="docket_price[]"  value="" style="width:65%" required>
									<button type="button" class="btn btn-danger btn-sm delete_btn" style="margin-left: 10px;"><span><i class="fa fa-trash" aria-hidden="true"></i></span></button>
								</div>
							</td>
						</tr>`; 
				if(i==1){
					$("#driver_docket_tbody").html(resultHTML);
				}else{
					$("#driver_docket_tbody").append(resultHTML);
				}
				$(".js-select2").select2();
		})
		$(document).on('click','.delete_btn',function(){
			$(this).parents('.driver_docket_tr').remove();
			calculate_docket_total();
		})

		

		$(document).on('change','.docket_upload_image_btn',function(e){
		  var upload_option = $(this).val();
			var data_id = $('option:selected',this).data('id');
			//alert(data_id);
			if(upload_option == 'C'){
				$("#startbutton").attr("data-button_id",data_id);
				$('.contentarea').show();
				$("#docket_image_file_"+data_id).hide();
			} else if(upload_option == 'F'){
				$("#startbutton").attr("data-button_id","");
				$('.contentarea').hide();
				$("#docket_image_file_"+data_id).show();
			} else{
				$("#startbutton").attr("data-button_id","");
				$('.contentarea').hide();
				$("#docket_image_file_"+data_id).hide(); 
			}
      
		});
		$(document).on('click','#add_more_docket,.delete_btn',function(){
			$('.contentarea').hide();
		});

		

	$("#add_more_expense").click(function(){j++;
		var resultHTML =`<tr class="driver_expenses_tr">                                  
						<td>
						  <select  class="js-select2" data-show-subtext="true" data-live-search="true" name="expense_id[]" required>
							<option value="">Select Expense</option>
							<?php if(!empty($expense_list)): ?>
							<?php   foreach($expense_list as $list): ?>
							  <option value="<?php echo $list['expense_id'];?>"><?php echo $list['expense_name'];?></option>
							<?php   endforeach; ?>
							<?php endif; ?>
						  </select>
						</td>
						<td>
							<select name="expense_image_type[]" class="expense_upload_image_btn">
                              <option value="" data-id="`+j+`">Select</option>
                              <option value="C" data-id="`+j+`">Camera</option>
                              <option value="F" data-id="`+j+`">File</option>
                            </select>
                            
                            <input type="hidden" id="expense_image_`+j+`"  name="expense_image[]" class="expense_image">
                            <input type="file" id="expense_image_file_`+j+`" name="expense_image_file[]" class="expense_image_file" style="display:none;">

                            <a id="expense_uploaded_a_`+j+`" data-fancybox data-caption="Expense IMAGE">
                              <img id="expense_uploaded_img_`+j+`" alt="The screen capture will appear in this box." height="50px" width="50px" style="display:none;"> 
                            </a>
						</td>
						<td class="td_amount_right">
							<div class="input-group">
								<div class="input-group-prepend">
									<span class="input-group-text" id="basic-addon1">$</span>
								</div>
								<input class="form-control  decimal_validation_cls expense_price_cls" type="text" name="expense_price[]"  value="" style="width:65%" required>
								<button type="button" class="btn btn-danger btn-sm delete_btn_expense" style="margin-left: 10px;"><span><i class="fa fa-trash" aria-hidden="true"></i></span></button>
							</div>
						</td>
					</tr>`; 
					if(j==1){
					$("#driver_expense_tbody").html(resultHTML);
				}else{
					$("#driver_expense_tbody").append(resultHTML);
				}
			$(".js-select2").select2();
	})

	$(document).on('change','.expense_upload_image_btn',function(e){
		  var upload_option = $(this).val();
      var data_id = $('option:selected',this).data('id');
      //alert(data_id);
      if(upload_option == 'C'){
        $("#startbutton1").attr("data-button_id",data_id);
        $('.contentarea1').show();
        $("#expense_image_file_"+data_id).hide();
      } else if(upload_option == 'F'){
        $("#startbutton1").attr("data-button_id","");
        $('.contentarea1').hide();
        $("#expense_image_file_"+data_id).show();
      } else{
        $("#startbutton1").attr("data-button_id","");
        $('.contentarea1').hide();
        $("#expense_image_file_"+data_id).hide(); 
      }
      
		});
    $(document).on('click','#add_more_expense,.delete_btn_expense',function(){
      $('.contentarea1').hide();
    });

	
	$(document).on('click','.delete_btn_expense',function(){
		$(this).parents('.driver_expenses_tr').remove();
		calculate_expense_total();
	})

	$(document).on('submit','#driver_payin',function(event){
		event.preventDefault();
		var formData = new FormData(this);
		var driver_id = $("#driver_id").val();
		var shift_id = $("#shift_id").val();
		$.ajax({
			type: "POST",
			url: "<?=base_url('admin/payin/submit_payin_data')?>",
			data: formData,
			dataType: 'json',
			processData: false,
    		contentType: false,
			encode: true,
			async:false,
			success: function(data) {
				if(data.status){
					
					
					$.alert({
						type: 'green',
						title: 'Success',
						content: data.message,
						buttons: {
        					confirm: function () {
								var href="<?=base_url()?>admin/driver-settlement/"+driver_id+"/"+shift_id;
            					window.location.href=href;
							},
						}
					});
				} else {
					$.alert({
						type: 'red',
						title: 'Alert!',
						content: data.message,
					});
				}
			},
			error: function(response) {
				$.alert({
					type: 'red',
					title: 'Alert!',
					content: 'Oops!Something went wrong...',
				});
			}
		});
	})

	$(document).on('change','.lifetime_total_upload_image_btn',function(){
      var upload_option = $(this).val();
      if(upload_option == 'C'){
        $('.contentarea2').show();
        $("#life_time_total_image_file").hide();
      } else if(upload_option == 'F'){
       $('.contentarea2').hide();
        $("#life_time_total_image_file").show();
      } else{
        $('.contentarea2').hide();
        $("#life_time_total_image_file").hide(); 
      }
     
    })

	$(document).on('change','.shift_total_upload_image_btn',function(){
      var upload_option = $(this).val();
      if(upload_option == 'C'){
        $('.contentarea3').show();
        $("#shift_total_image_file").hide();
      } else if(upload_option == 'F'){
        $('.contentarea3').hide();
        $("#shift_total_image_file").show();
      } else{
        $('.contentarea3').hide();
        $("#shift_total_image_file").hide(); 
      }
     
    })
</script>