<?php 
include_once("../connect.php");
include_once("../session.php");


$customer = new Customer($_REQUEST['an']);
 ?>
 
 <!DOCTYPE html>
 <html lang="en">
   <head>
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <title><?= $config['CompanyName'] ?></title>
 
     <!-- Bootstrap -->
     <link href="../css/bootstrap.min.css" rel="stylesheet">
     <link rel="stylesheet" href="../css/bootstrap-combobox.css" />
 
     <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
     <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
     <!--[if lt IE 9]>
       <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
       <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
       <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
           <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
           <!-- Include all compiled plugins (below), or include individual files as needed -->
           <script src="../js/bootstrap.min.js"></script>
       	 <script src="../js/bootstrap-combobox.js"></script>
       	 <script src="../js/excellentexport.js"></script>
				 <script src="../js/functions.js"></script>
           <script type="text/javascript">
             $(document).ready(function(){
       //        $('.grpline').css("width", "100px");
             });
           </script>

     <![endif]-->
	<link rel="stylesheet" href="../css/styles.css"/>
   </head>
   <body>
   
       <?= include("navbar.php"); ?>     

   
   <!-- Stack the columns on mobile by making one full-width and the other half-width -->
<div class="container " style="padding-top: 10px;">
	<div class="panel panel-default">
	  <div class="panel-heading form-inline">
	  <a class="btn btn-success" role="button" style="float: right;" href="#" download="Aging<?= $customer->Name . "(" . date("m.d.Y",strtotime($fromDate)) . " - " . date("m.d.Y",strtotime($toDate)) . ")" ?>.xls" href="#" onclick="return ExcellentExport.excel(this, 'orderhistory', 'Order History');" data-toggle="tooltip" data-placement="left" title="Does not work with Internet Explorer">Export To Excel</a>
	  
	  	
	  		    <h3 class="panel-title">Aging Edit - <?= $customer->AccountNumber . " - " . $customer->Name ?></h3><br />
				
					    
	  </div>
	  <div class="panel-body">
	  	<table class="table table-hover table-condensed" id="agingeditview">
	  		<thead>
	  			<tr>
	  				<th>Invoice Date</th>
	  				<th>InvoiceNumber</th>
						<th>Reference</th>
						<th>Amount<br>Edit</th>
	  				<th>Tax</th>
					
	  				<th>Total</th>
					
	  			</tr>
	  			
	  		</thead>
	    <?php
		$invoices = $customer->getInvoices();
	   	$total = 0;
		foreach($invoices as $invoice){
	   	?>
	   		<tr>
	   			<td><?= date("m-d-Y", strtotime(($invoice['InvoiceDate']))) ?></td>
	   			<td><?= $invoice['InvoiceNumber'] ?></td>
					<td><?= $invoice['Reference'] ?></td>
				<td><button class="btn btn-warning btn-xs" onclick="editInvoiceModal('<?= $invoice['InvoiceNumber'] ?>', '<?= $invoice['Subtotal'] ?>')"><?= $invoice['Subtotal'] ?></button></td>
				<td><?= $invoice['SalesTax'] ?></td>
				<td><?= $invoice['Subtotal']+$invoice['SalesTax'] ?></td>
				<td></td>
	   		</tr>
	   	<?php
	   	}
	     ?>
	     </table>
	  </div>
	  <div class="panel-footer" >
	  	
	  </div>
	</div>

</div>       
<script type="text/javascript">



$('[name=filter]').on('keypress', function(e) {
	if (e.which == 13) {
		filter();
	}

});
function clearFilter() {
	$('[name=filter]').val("");
	$('#clearButton').css('display', 'none');
	$('tr').css('display', '');
	
}
function filter() {
	var	name = $('[name=filter]').val();
	filterByName(name);
}
function filterByName(name) {
	$('#clearButton').css('display', '');
	var cols = $('#paymenthistory th').length;
	for (var i = 0; i < $('#paymenthistory td').length; i=i+cols) {
	
		var text = $($('td')[i]).text();
		
		var result = text.toUpperCase().indexOf(name.toUpperCase());
		if (text != name) {
			$($('tr')[i/cols+1]).css('display', 'none');
		}else {
			$($('tr')[i/cols+1]).css('display', '');
		}
		
	}
}
function editInvoiceModal(invoiceNumber, amount){
	clearInvoiceEditModal();
	$('#InvoiceNumber').val(invoiceNumber);
	$('#InvoiceAmount').val(amount);
	$('#EditInvoiceAmountModal').modal('toggle');
	
}
function submitInvoiceAdjust(){
	$('#submitInvoiceAdjust').attr('disabled', true);
	recalculate();
	
	var overpaymentAmt = $('#OverpaymentAmount').val();

	var reason = ($('#InvoiceAdjustReason').val()).trim();
	if(reason === ""){
		alert('Please enter a valid reason');
		$('#submitInvoiceAdjust').attr('disabled', false);
		return;
	}
	data = {
						InvoiceNumber: $('#InvoiceNumber').val(),
						Reason: reason,
						Amount: overpaymentAmt
					};
	$.post('mod.php?p=agingedit&a=functions&f=saveInvoiceAdjust',data, function(e){
		
		$('#EditInvoiceAmountModal').modal('toggle');
		location.reload();
	});
}
function recalculate(){
	var originalAmt = $('#InvoiceAmount').val();
	var overpaymentAmt = $('#OverpaymentAmount').val();
	var newAmt = originalAmt - overpaymentAmt;
	if(overpaymentAmt < 0){
		alert('The Overpayment Amount must not less than Zero');
		$('#OverpaymentAmount').val(0);
		$('#OverpaymentAmount').focus();
		return;
	}
	if(newAmt < 0){
		alert('The Overpayment Amount must not exceed the Invoice Amount');
		$('#OverpaymentAmount').val(0);
		$('#OverpaymentAmount').focus();
		return;
	}
	$('#BalanceAmount').val((newAmt).toFixed(2));
}
function clearInvoiceEditModal(){
	$('#InvoiceNumber').val('');
	$('#InvoiceAmount').val('');
	$('#OverpaymentAmount').val('');
	$('#BalanceAmount').val('');
	$('#InvoiceAdjustReason').val('');
	$('#submitInvoiceAdjust').attr('disabled', false);
}

</script>

	<div class="modal fade" id="EditInvoiceAmountModal">
	  <div class="modal-dialog">
	    <div class="modal-content">
	      <div class="modal-header">
	        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
	        <h4 class="modal-title" id="EditInvoiceAmountTitle">Edit Invoice Amount</h4>
	      </div>
	      <div class="modal-body">
			<div class="form">
				<div class="form-group">
					<label for="InvoiceNumber">InvoiceNumber</label>
					<input type="text" class="form-control"  name="InvoiceNumber" id="InvoiceNumber" value="" readonly />
				</div>
				<div class="form-group">
					<label for="InvoiceAmount">Invoice Amount</label>
					<input type="text" class="form-control" readonly name="InvoiceAmount" id="InvoiceAmount" value="" />
				</div>
				<div class="form-group">
					<label for="OverpaymentAmount">Overpayment Amount</label>
					<input type="number" class="form-control" onblur="recalculate();" name="OverpaymentAmount" id="OverpaymentAmount" value="" />
				</div>
				<div class="form-group">
					<label for="BalanceAmount">Balance Amount</label>
					<input type="text" class="form-control" readonly name="BalanceAmount" id="BalanceAmount" value="" />
				</div>
				<div class="form-group">
					<label for="InvoiceAdjustReason">Reason</label>
					<textarea class="form-control" rows="5" id="InvoiceAdjustReason"></textarea>
				</div>
			</div>
			
	      </div>
	      <div class="modal-footer">
	        <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
	        <button type="button" id="submitInvoiceAdjust" class="btn btn-success" onclick="submitInvoiceAdjust();">Submit Edit</button>
	      </div>
	    </div><!-- /.modal-content -->
	  </div><!-- /.modal-dialog -->
	</div><!-- /.modal -->
	
	<script>
		$('#OverpaymentAmount').on('keyup', function(e){
			if(e.keyCode == 13){
				$('#InvoiceAdjustReason').focus();
			}
		});
		$('#EditInvoiceAmountModal').on('shown.bs.modal', function () {
			$('#OverpaymentAmount').focus()
		});
	</script>
	<!-- -->
	
	
	
	

   </body>
   
 </html>