<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<?php $__env->startSection("content"); ?>
<div>
	<ol class="breadcrumb">
		<li><a href="<?php echo e(URL::route('user.home')); ?>"><?php echo trans('messages.home'); ?></a></li>
		<li><a href="<?php echo e(URL::route('order.index')); ?>">Orders</a></li>
		<li class="active">New Order</li>
	</ol>
</div>
<br>
<div class="container-fluid">
	<div class="row">
		<div class="col-md-12">
			<?php echo Form::open(array('url' => 'facilityrequest', 'id' => 'form-facilityrequest', 'method' => 'POST')); ?>

			<div class="panel panel-primary">
				<h1 class="panel-title" style="text-align:center"><?php echo HTML::image(Config::get('kblis.organization-logo'),  Config::get('kblis.country') . trans('messages.court-of-arms'), array('width' => '150px')); ?>

					<br>
					<strong><?php echo strtoupper(Config::get('constants.FACILITY_REQUEST_FORM_HEADER')); ?>

						<br> <?php echo Config::get('kblis.address-info'); ?></strong></h1>
						<br><br>
						<br>
						<div class="panel panel-warning">
							<tr>
							</tr>
							<div class="panel panel-primary">

								<form method="post" id="insert_form"><input type="hidden" name="row_count" id="row_count" value=0>
									<div class="table-repsonsive">
										<span id="error"></span>
										<table class="table table-bordered" id="item_table">
											<tr>
												<th class="text:center" width="10%">Item Description</th>
												<th class="text:center">Pack Size</th>
												<th class="text:center">UoM</th>
												<th class="text:center">Cost</th>
												<th class="text:center">Projected Quantity</th>
												<th class="text:center">Total Cost</th>
												<th class="text:center">Stock On Hand</th>
												<th class="text:center">Chemonics</th>
												<th class="text:center">Maul</th>
												<th class="text:center">Total PipeLine</th>
												<th class="text:center">Required Quantity</th>
												<th class="text:center">Proposed delivery schedules MAUL</th>
												<th class="text:center">Proposed delivery schedules MAUL</th>
												<th><button type="button" name="add" class="btn btn-success btn-sm add"><span class="glyphicon glyphicon-plus"> Add Item</span></button></th>
											</tr>
										</table>
										<div align="center">
											<?php echo Form::button("<span class='glyphicon glyphicon-save'></span> ".trans('messages.save'),
											array('class' => 'btn btn-primary', 'onclick' => 'submit()')); ?>

										</div>
									</div>
								</div>
							</div>
						</div>
					</form>
				</div>
			</div>

			<script>
				$(document).ready(function(){

					$(document).on('click', '.add', function(){
						var row_count = parseInt($('#row_count').val())+1;
						$('#row_count').val(row_count);
						var keyup = 'onkeyup="compute('+row_count+')"';

						var html = '';
						html += '<tr>';
							html += '<td><select name ="commodity_id[]"> <option value="">Select Item.....</option><?php foreach($commodities as $key =>$commodity_id): ?><option value="<?php echo $key; ?>"><?php echo $commodity_id; ?></option> <?php endforeach; ?></td>';
								html += '<td width="70%"><input type="text" name="pack_size[]" class="form-control pack_size" /></td>';
								html += '<td width="70%"><select name ="issue_unit[]"><option value="">Select Unit Of Measure</option> <option value="50 cards">50 Cards</option><option value="1 pc">1 pc</option><option value=" 1 Book">1 Book</option></td>';
									html += '<td width="70%"><input type="text" name="cost[]" '+keyup+' class="form-control cost" id="cost'+row_count+'" /></td>';
									html += '<td><input type="text" name="projected_qty[]" '+keyup+' class="form-control projected_qty" id="projected_qty'+row_count+'"  /></td>';
									html += '<td><input type="text" name="total_cost[]" '+keyup+' class="form-control total_cost" id="total_cost'+row_count+'" readonly="true"/></td>';
									html += '<td><input type="text" name="stock_on_hand[]" '+keyup+' class="form-control stock_on_hand" id="stock_on_hand'+row_count+'" /></td>';
									html += '<td><input type="text" name="chemonics[]"  '+keyup+' class="form-control chemonics" id="chemonics'+row_count+'"/></td>';
									html += '<td><input type="text" name="maul[]"  '+keyup+' class="form-control maul" id="maul'+row_count+'" /></td>';
									html += '<td><input type="text" name="total_pipeline[]" '+keyup+' class="form-control total_pipeline" id="total_pipeline'+row_count+'" readonly="true"/></td>';
									html += '<td><input type="text" name="required_qty[]" '+keyup+' class="form-control required_qty" id="required_qty'+row_count+'" readonly="true"/></td>';
									html += '<td><input type="text" name="comments[]" class="form-control comments" /></td>';
									html += '<td><input type="text" name="comments[]" class="form-control comments" /></td>';
									html += '<td><button type="button" name="remove" class="btn btn-danger btn-sm remove"><span class="glyphicon glyphicon-minus"></span></button></td></tr>';
									$('#item_table').append(html);
								});

								$(document).on('click', '.remove', function(){
									$(this).closest('tr').remove();
								});

								$('#insert_form').on('submit', function(event){
									event.preventDefault();
									var error = '';
									$('.issue_unit').each(function(){
										var count = 1;
										if($(this).val() == '')
										{
											error += "<p>Enter Unit Of Measure at "+count+" Row</p>";
											return false;
										}
										count = count + 1;
									});

									$('.commodity_id').each(function(){
										var count = 1;
										if($(this).val() == 'Select Item.....')
										{
											error += "<p>Please Select atleast an Item "+count+" Row</p>";
											return false;
										}
										count = count + 1;
									});

									$('.quantity').each(function(){
										var count = 1;
										if($(this).val() == '')
										{
											error += "<p>Hey, enter the quantities needed at "+count+" Row</p>";
											return false;
										}
										count = count + 1;
									});
									var form_data = $(this).serialize();
									if(error == '')
									{
										$.ajax({
											url:"insert.php",
											method:"POST",
											data:form_data,
											success:function(data)
											{
												if(data == 'ok')
												{
													$('#inhouserequest').find("tr:gt(0)").remove();
													$('#error').html('<div class="alert alert-success">Request Submitted</div>');
												}
											}
										});
									}
									else
									{
										$('#error').html('<div class="alert alert-danger">'+error+'</div>');
									}
								});
							});

							function compute(row_count){
								//variables to store values enterd for the fields.
								var cst = parseInt($("#cost"+row_count).val());
								var pq = parseInt($("#projected_qty"+row_count).val());
								var ch = parseInt($("#chemonics"+row_count).val());
								var ml = parseInt($("#maul"+row_count).val());
								var sr = parseInt($("#stock_required"+row_count).val());
								var soh = parseInt($("#stock_on_hand"+row_count).val());

								//computes the total cost
								$("#total_cost"+row_count).val((cst*pq));

								//computes total pipeline
								$("#total_pipeline"+row_count).val((ch+ml));

								//computes required quantity
								// var tpl =((ch+tml));
								// var rq =((pq)-(soh+tpl));
								$("#required_qty"+row_count).val((pq-soh+tpl));

								//computes the maximum stock quantity required
								$("#stock_required"+row_count).val(tc*1.5);

								//computes the quantity to be ordered
								$("#qty_to_order"+row_count).val(sr-tcc);
							}
						</script>

<?php echo $__env->make("layout", array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>