<?php $__env->startSection('title'); ?> Order-Vehicle Wise Report <?php $__env->stopSection(); ?>
<?php $__env->startSection('body'); ?>

<div class="row">
	<div class="col-md-12">
		<div class="form-group col-md-3">
			<label class="control-label">From</label>
			<input type="text" class="form-control fromDate" name="fromDate">
		</div>
		<div class="form-group col-md-3">
			<label class="control-label">To</label>
			<input type="text" class="form-control toDate" name="toDate">
		</div>
	</div>
</div>

<div class="row">
	<div class="col-md-12">
		<div class="form-group col-md-3">
			<label class="control-label">Orders</label>
			<select class="form-control orders chosen-select" name="orders">
				<option value="">Please select an option</option>
			</select>
		</div>
		<div class="form-group col-md-3" style="margin-top: 25px;">
			<button class="btn btn-primary generate">Generate</button>
		</div>
	</div>
</div>

<style type="text/css">
	.generalResults tr td, .generalResults tr th{
		border: none !important;
	}
	.min-width-1000 {
		min-width: 1000px;
	}
</style>

<div class="row">
	<div class="col-md-12">

		<div class="col-md-12 report">


		</div>
	</div>
</div>

<?php $__env->stopSection(); ?>
<?php $__env->startSection('script'); ?>
<script type="text/javascript">

$(function(){
	var _token = $('meta[name="_token"]').attr('content');

	$('.chosen-select').chosen({search_contains:true});

	$('.fromDate').datepicker({
		dateFormat: "yy-mm-dd",
		onSelect: function(){
			$(".toDate").datepicker( "option", "minDate", new Date($('.fromDate').val()) );
		}
	});
	$(".toDate").datepicker({
		dateFormat: "yy-mm-dd",
		onSelect: function(){
			$(".fromDate").datepicker( "option", "maxDate", new Date($('.toDate').val()) );
		}
	});

	loadOrders();

	$('.generate').click(function(){
		generate();
	});

	function highlightOrThrow(e, callback){
		$.clearHighlights();
		if(e != undefined && typeof(e) == 'object'){
			if(e.hasOwnProperty('errors')){
				$.each(e.errors, function(i, k){
					$('.'+i).highlightElement({msg: k});
				});
			}else if(e.hasOwnProperty('ok') && e.hasOwnProperty('msg') && e.ok == 0){
				$.notify.error({msg: e.msg});
			}else if(e.hasOwnProperty('ok') && e.hasOwnProperty('msg')  && e.ok == 1){
				$.notify.success({msg: e.msg});
				if(callback != undefinded && typeof(callback) == 'function'){
					callback();
				}
			}else{
				callback();
			}
		}
	}

	function loadOrders(){
		var $select = $('.orders');
		var dom = '';
		$.post("<?php echo e(url('/report/loadOrders')); ?>", {_token: _token}, function(e){
			if(e != undefined && typeof(e) == 'object' && Object.keys(e).length > 0){
				$.each(e, function(i, k){
					dom += '<option value="'+ k.id +'">'+ k.num +'</option>';
				});
			}else{
				dom = '<option value="">Please select an option</option>';
			}
			$select.html(dom);
			$('.chosen-select').trigger('chosen:updated');
		}, 'json');
	}

	function generate(){
		var $report = $('.report');
		var data = {
			fromDate: $('.fromDate').val(),
			toDate: $('.toDate').val(),
			orders: $('.orders').val()
		};
		$report.html('-- no results found --');
		$.post("<?php echo e(url('/report4/generate')); ?>", {_token: _token, data: data}, function(e){
			highlightOrThrow(e, function(){

				var dom = '';
				if(e != undefined && typeof(e) == 'object' && Object.keys(e).length == 2 && e.hasOwnProperty('order') && e.hasOwnProperty('trip_orders')){
					
					var order = e.order;

					var property = '';
					if(order.status == 'completed'){
						property = 'background-color: #2ecc71;';
					}else if(order.status == 'fulfilled'){
						property = 'background-color: #f39c12;';
					}else if(order.status == 'pending'){
						property = 'background-color: #f9f9f9;';
					}

					dom += '<div class="form-group img-thumbnail min-width-1000" style="width: 100%; '+ property +'">';
					dom += '	<h3 style="margin: 0px auto 20px; border-bottom: 1px solid #ccc;">Order General Details</h3>';
					dom += '	<div class="col-xs-5">';
					dom += '		<div class="row">';
					dom += '			<div class="col-md-6">Order Number : </div>';
					dom += '			<div class="col-md-6">'+ order.num +'</div>';
					dom += '		</div>';
					dom += '		<div class="row">';
					dom += '			<div class="col-md-6">Location : </div>';
					dom += '			<div class="col-md-6">'+ order.name +'</div>';
					dom += '		</div>';
					dom += '		<div class="row">';
					dom += '			<div class="col-md-6">Volume : </div>';
					dom += '			<div class="col-md-6">'+ order.orderVolume +'</div>';
					dom += '		</div>';
					dom += '		<div class="row">';
					dom += '			<div class="col-md-6">Weight : </div>';
					dom += '			<div class="col-md-6">'+ order.orderWeight +'</div>';
					dom += '		</div>';
					dom += '	</div>';
					dom += '	<div class="col-xs-2"></div>';
					dom += '	<div class="col-xs-5">';
					dom += '		<div class="row">';
					dom += '			<div class="col-md-6">Delivery Number : </div>';
					dom += '			<div class="col-md-6">'+ order.deliveryNumber +'</div>';
					dom += '		</div>';
					dom += '		<div class="row">';
					dom += '			<div class="col-md-6">Distributor : </div>';
					dom += '			<div class="col-md-6">'+ order.distributor +'</div>';
					dom += '		</div>';
					dom += '		<div class="row">';
					dom += '			<div class="col-md-6">Order Status : </div>';
					dom += '			<div class="col-md-6">'+ order.status +'</div>';
					dom += '		</div>';
					dom += '	</div>';
					dom += '</div>';
					
					var trip_orders = e.trip_orders;
					
					if(Object.keys(trip_orders).length > 0){

						$.each(trip_orders, function(i, k){

							dom += '<div class="panel panel-default">';
							dom += '	<div class="panel-heading">';
							dom += '		Trip '+ k.trip_id +' Details';
							dom += '	</div>';
							dom += '	<div class="panel-body">';


							if(k.hasOwnProperty('vehicles') && Object.keys(k.vehicles).length > 0){
								var vehicles = k.vehicles;
								var size = Object.keys(k.vehicles).length;
								$.each(vehicles, function(counter, v){

									dom += '		<div class="row">';
									dom += '			<div class="col-xs-6">';
									dom += '				<div class="row">';
									dom += '					<div class="col-xs-5">Transporter :</div>';
									dom += '					<div class="col-xs-1"></div>';
									dom += '					<div class="col-xs-6">'+ v.name +'</div>';
									dom += '				</div>';
									dom += '				<div class="row">';
									dom += '					<div class="col-xs-5">Vehicle Number :</div>';
									dom += '					<div class="col-xs-1"></div>';
									dom += '					<div class="col-xs-6">'+ v.number +'</div>';
									dom += '				</div>';
									dom += '				<div class="row">';
									dom += '					<div class="col-xs-5">Remaining Bulk Volume :</div>';
									dom += '					<div class="col-xs-1"></div>';
									dom += '					<div class="col-xs-6">'+ v.bulk_volume +'</div>';
									dom += '				</div>';
									dom += '				<div class="row">';
									dom += '					<div class="col-xs-5">Remaining Bulk Weight :</div>';
									dom += '					<div class="col-xs-1"></div>';
									dom += '					<div class="col-xs-6">'+ v.bulk_weight +'</div>';
									dom += '				</div>';
									dom += '			</div>';
									dom += '			<div class="col-xs-6">';
									dom += '				<div class="row">';
									dom += '					<div class="col-xs-12">';
									dom += '						<div class="table-responsive">';
									dom += '							<table class="table table-condensed generalResults">';
									dom += '								<thead>';
									dom += '									<tr>';
									dom += '										<th width="120px">Ref. No</th>';
									dom += '										<th>Items</th>';
									dom += '									</tr>';
									dom += '								</thead>';
									dom += '								<tbody>';
									if(v.hasOwnProperty('items') && Object.keys(v.items).length > 0){

										dom += '								<tr>';
										dom += '									<td>';
										dom += $.addLeadingZeros(v.id, 6);
										dom += '									</td>';
										dom += '									<td>';
										dom += '										<ul style="list-style: none; padding: 0px 0px 0px 2px;">';
										$.each(v.items, function(i, item){
											
											dom += '										<li><span style="width: 60%; display: inline-block;">'+ item.name +'</span><span style="display: inline-block; width: 5%;"> : </span>'+ item.qty +'</li>';

										});
										dom += '										</ul>';
										dom += '									</td>';
										dom += '								</tr>';

									}else{
										dom += '<tr>';
										dom += '	<td colspan="2">-- no items added --</td>';
										dom += '</tr>';
									}
									dom == '								</tbody>';
									dom += '							</table>';
									dom += '						</div>';
									dom += '					</div>';
									dom += '				</div>';
									dom += '			</div>';
									dom += '		</div>';

									if((counter+1) < size){
										dom += '		<hr style="margin: 10px 0px;" />';
									}
									
								});

							}else{
								dom += '-- order is not loaded to any vehicle in this trip --';
							}

							dom += '	</div>';
							dom += '</div>';

						});

					}else{
						dom += '-- this order is not assigned to any trip in the given date range --';
					}

				}else{
					dom = 'Sorry, No results found.';
				}
				$report.html(dom);

			});
		}, 'json');
	}
});

</script>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('layouts.master', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>