<?php include '../header.php'; ?>
<?php include '../sidemenu.php'; ?>
<?php
$id = "";
if(isset($_GET['id'])){
	if(!empty($_GET['id'])){
		$id = $_GET['id'];
	}
}
?>
<style>
	#myTable td:nth-child(2){
		width: 7%;
	}
	#myTable td:nth-child(3){
		width: 20%;
	}
	#myTable td:nth-child(4){
		width: 15%;
	}
	#myTable td:nth-child(5){
		width: 15%;
	}
	.hId{
		display: none;
	}
	#myTable td:nth-child(1){
		display: none;
	}
	#myCustomer{
		padding-right: 30% !important;
	}
	#myTable tbody tr {
    	cursor: pointer;
    }
</style>

<div class="content-wrapper" style="min-height: 1203.6px;">
	<!-- Content Header (Page header) -->
	<section class="content-header">
		<div class="container-fluid">
			<div class="row mb-2">
				<div class="col-md-6">
					<h1>Sales - Edit</h1>
				</div>
				<div class="col-md-6">
				</div>
			</div>
		</div>
	</section>
	<section class="content">
		<div class="container-fluid">
			<div class="row">
				<div class="col-md-12">
					<div class="card card-outline card-primary">
						<div class="card-header">
							<h3 class="card-title">Info</h3>
						</div>
						<div class="overlay white" id="loading" style="display:none;position: absolute;width: 100%;height: 100%;z-index: 10000;">
							<i class="fas fa-3x fa-sync-alt rotate360"  style="margin: 70px 45%;"></i>
						</div>
						<form role="form" id="frmEntry">
							<div class="card-body">
								<div class="row">
									<div class="col-md-6">
										<div class="form-group row">
											<label class="col-md-4 col-form-label" style="text-align: right;">City: </label>
											<div class="col-md-8">
												<input type="text" class="form-control" id="txtCity" disabled>
											</div>
										</div>
										<div class="form-group row">
											<label class="col-md-4 col-form-label" style="text-align: right;">Date:</label>
											<div class="col-md-8">  
												<div class="input-group input-append date" id="datePicker" data-date="2020-02-04" data-date-format="yyyy-mm-dd">
													<div class="input-group-prepend">
														<span class="input-group-addon input-group-text" style="width: 40px; display: table-cell;">
															<i class="far fa-calendar-alt"></i>
														</span>
													</div>
													<input type="text" class="form-control float-right" id="txtDatePicker" value="1982-06-15" >
												</div>
											</div>
										</div>
										<div class="form-group row">
											<label class="col-md-4 col-form-label" style="text-align: right;">Invoice No.: </label>
											<div class="col-md-8">
												<input type="text" class="form-control" id="txtInvoiceNo" disabled>
											</div>
										</div>
										<div class="form-group row">
											<label class="col-md-4 col-form-label" style="text-align: right;">ID No.: </label>
											<div class="col-md-8">
												<input type="text" class="form-control" id="txtIDNo" disabled>
											</div>
										</div>
										<input type="text" class="form-control" id="txtCustomerID"  style="display: none;">
										<div class="form-group row">
											<label class="col-md-4 col-form-label" style="text-align: right;">Name: </label>
											<div class="col-md-8">
												<input type="text" class="form-control" id="txtName" disabled>
											</div>
										</div>
									</div>
									<div class="col-md-6">
										<div class="form-group row">
											<label class="col-md-4 col-form-label" style="text-align: right;">Package: </label>
											<div class="col-md-8">
												<select type="text" class="form-control" id="cboPackage">
													<option value=""></option>
												</select>
											</div>
										</div>
										<div class="form-group row">
											<label class="col-md-4 col-form-label" style="text-align: right;">Mbps: </label>
											<div class="col-md-3">
												<input type="text" class="form-control" id="txtMbps" style="text-align: right;" value="0" onkeypress="return isNumber(event)" onkeyup="btozero(this);" disabled>
											</div>
											<label class="col-md-2 col-form-label" style="text-align: right;">Days: </label>
											<div class="col-md-3">
												<input type="text" class="form-control" id="txtDays" style="text-align: right;" value="0" onkeypress="return isNumber(event)" onkeyup="btozero(this);" disabled>
											</div>
										</div>
										<!-- <input type="text" class="form-control" id="txtMbps" style="display:none;">
										<input type="text" class="form-control" id="txtDays" style="display:none;">
										<input type="text" class="form-control" id="txtPrice" style="display:none;"> -->
										<div class="form-group row">

											<label class="col-md-4 col-form-label" style="text-align: right;">Price: </label>
											<div class="col-md-3">
												<input type="text" class="form-control" id="txtPrice" style="text-align: right;" value="0" onkeypress="return isNumber(event)" onkeyup="btozero(this);">
											</div>
											<label class="col-md-2 col-form-label" style="text-align: right;"> fee: </label>
											<div class="col-md-3">
												<input type="text" name="txtFee" id="txtFee" class="form-control" style="text-align: right;" value="0" onkeypress="return isNumber(event)" onkeyup="btozero(this);">
											</div>
											
										</div>
										
										<div class="form-group row">
											<label class="col-md-4 col-form-label" style="text-align: right;">Tax Charges(%): </label>
											<div class="col-md-1">
												<input type="text" name="txtTaxCharges" onfocus="this.select();" id="txtTaxPercent" class="form-control" style="text-align: right;"  value=0 >
											</div>
											<div class="col-md-2">
												<input type="text" name="txtTaxCharges" id="txtTaxCharges" class="form-control" style="text-align: right;"  value=0 disabled>
											</div>
											<label class="col-md-2 col-form-label" style="text-align: right;">Payment: </label>
											<div class="col-md-3">
												<input type="text" name="txtPayment" id="txtPayment" class="form-control" style="text-align: right;" value="0" onkeypress="return isNumber(event)" onkeyup="btozero(this);">
											</div>
										</div>
										<!-- <div class="form-group row">
											<label class="col-md-4 col-form-label" style="text-align: right;">Payment Type: </label>
											<div class="col-md-3">
												<select id="cboPaymentType" value='' class="form-control">
													<option value="Cash">Cash</option>
													<option value="KBZ">KBZ</option>
													<option value="KBZ Pay">KBZ Pay</option>
													<option value="AYA">AYA</option>
													<option value="CB">CB</option>
													<option value="OK$">OK$</option>
												</select>
											</div>
											<label class="col-md-4 col-form-label" style="text-align: right;">Refund: </label>
											<div class="col-md-3">
												<input type="text" name="txtFee" id="txtRefund" class="form-control" style="text-align: right;" value="0" onkeypress="return isNumber(event)" onkeyup="btozero(this);">
											</div>


										</div> -->

										<div class="form-group row">
											<label class="col-md-4 col-form-label" style="text-align: right;">Start Date:</label>
											<!-- <div class="col-md-1 icheck-success d-inline" style="padding-top: 5px;">
												<input id="chkDateFrom" type="checkbox" style="margin: 8px 0px">
												<label for="chkDateFrom"></label>
											</div> -->
											<div class="col-md-8">  
												<div class="input-group input-append date" id="datePicker2" data-date="2020-02-04" data-date-format="yyyy-mm-dd">
													<div class="input-group-prepend">
														<span class="input-group-addon input-group-text" style="width: 40px; display: table-cell;">
															<i class="far fa-calendar-alt"></i>
														</span>
													</div>
													<input type="text" value="" id="txtDateFrom" class="form-control" >
												</div>
											</div>
											<!-- <label class="col-md-2 col-form-label" style="text-align: right;">End Date:</label>

											<div class="col-md-3">  
												<div class="input-group input-append date" id="datePicker3" data-date="2020-02-04" data-date-format="yyyy-mm-dd">
													<div class="input-group-prepend">
														<span class="input-group-addon input-group-text" style="width: 40px; display: table-cell;">
															<i class="far fa-calendar-alt"></i>
														</span>
													</div>
													<input type="text" value="" id="txtDateTo" class="form-control" >
												</div>
											</div> -->
										</div>

										<div class="form-group row" style="margin-bottom: 0px;">
											<div class="col-md-9"></div>
											<div class="col-md-3">
												<button type="button" class="btn btn-success btn-block" onclick="validateAndSave()">Update</button>
											</div>
										</div>
									</div>
								</div>
							</div>
						</form>
					</div>

				</div>

				<div class="modal fade" id="myCustomer" style="padding-right: 30% !important;">
					<div class="modal-dialog">
						<div class="modal-content" style="width: 200%;">
							<div class="modal-header">
								<h4 class="modal-title">Customer<span id="total_records" style="font-weight:bold;"> </span></h4>
								<button type="button" class="close" data-dismiss="modal" aria-label="Close">
									<span aria-hidden="true">&times;</span>
								</button>
							</div>
							<section class="content">
								<div class="container-fluid">
									<div class="row">
										<div class="col-md-12">
											<div class="card card-outline card-primary">
												<div class="card-header">
													<h3 class="card-title">List<span id="total_records" style="font-weight:bold;"></span></h3>
													<div class="card-tools">
														<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-minus"></i></button>
														<button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fas fa-remove"></i></button>
													</div>
												</div>
												<div class="card-body p-0">
													<table id="myTable" class="table table-bordered table-hover" style="border-collapse: collapse !important;">
														<thead>                  
															<tr>
																<th style="width: 3%">#</th>
																<th class="hId">Customer ID</th>
																<th>Name</th>
																<th>Type</th>
																<th>NRC No.</th>
																<th>Phone No.</th>
																<th>Address</th>
															</tr>
														</thead>
														<tbody></tbody>
													</table>
												</div>
											</div>
										</div>
									</div>
								</div>
							</section>	
						</div>
					</div>
				</div>
			</div>
		</div>
	</section>
</div>
<?php include '../footer.php'; ?>
<script>

var C = '<?php echo isset($_SESSION['city'])?$_SESSION['city']:""?>';

var id = "<?=$id;?>";
	var d = new Date();
	var mm = (d.getMonth("MM")+1);
	var dd = d.getDate();
	var customDate = d.getFullYear() + "-" + ((mm<10)?"0" + mm:mm) + "-" +  ((dd<10)?"0" + dd:dd);
	$('#datePicker').attr("data-date",customDate);
	$("#txtDatePicker").val(customDate);

	$(function() {
		$("body").addClass("sidebar-collapse");
		getOnePrint();

		$('#datePicker').datepicker();
		// getAllCity();
	});

	$('#txtDatePicker').on('change',function(){

		getPackage();
	});

	$("#txtTaxPercent").on('input', function(){
		var package_price = (parseInt($("#txtPrice").val().replace(/,/g, '')))? (parseInt($("#txtPrice").val().replace(/,/g, ''))):0;
			var tax_percent = (parseInt($("#txtTaxPercent").val().replace(/,/g, '')))? (parseInt($("#txtTaxPercent").val().replace(/,/g, ''))):0;
			var tax = package_price*tax_percent/100;
			$("#txtTaxCharges").val(tax.toLocaleString());
	});

	function getOnePrint(){
		$("#myTable").find("tbody").find("tr").remove();
		$.ajax({
			url: APP_URL + "api/sales/get_one_row.php",
			type: "POST",
			data: JSON.stringify({ id: id  })
		}).done(function(data) {	
			$("#txtCity").val(data.city);
			$("#txtDatePicker").val(data.date);
			$("#txtInvoiceNo").val(data.invoice_no);
			$("#txtIDNo").val(data.id_no);
			$("#txtName").val(data.name);
			$("#txtMbps").val(data.mbps);
			$("#txtDays").val(data.days);
			$("#txtPrice").val(data.price);
			$("#txtFee").val(data.fee);
			$("#txtTaxPercent").val(data.tax);
			$("#txtTaxCharges").val(data.tax_charges);
			$("#cboPaymentType").val(data.payment_type);
			$("#txtPayment").val(data.payment);
			$("#txtDateFrom").val(data.start_date);
			$("#txtExtraDays").val(data.extra_days);
			$("#txtDateTo").val(data.end_date);
			getPackage(data.city,data.package);

			$('#datePicker2').attr("data-date",data.start_date);
			$("#txtDateFrom").val(data.start_date);

			$('#datePicker3').attr("data-date",data.end_date);
			$("#txtDateTo").val(data.end_date);

			$('#datePicker2').datepicker();
			$('#datePicker3').datepicker();

		});
	}


	function getPackage(c,p){

	$("#cboPackage").find("option").remove();
	$("#txtPackageName").val("");
	$("#cboPackage").append("<option value= '' data-price='" + 0 + "'></option>");
	$.ajax({
		url: APP_URL + "api/package/get_all_packages_price_change.php",
		type: "POST",
		data: JSON.stringify({ city: $("#txtCity").val(), pcd:$("#txtDatePicker").val() })
	}).done(function(data) {	
		$.each(data.records, function(i, v) {	
			$("#cboPackage").append("<option value= '" + v.package + "' data-fee='" + v.fee + "' data-mbps='" + v.mbps + "' data-days='" + v.days + "' data-price='" + v.package_price + "' >" + v.package + "</option>");
						
		});
		$("#cboPackage").val(p);


	});
	}	

	$("#cboPackage").change(function(){
		$("#txtMbps").val($("#cboPackage option:selected").attr("data-mbps"));
		$("#txtDays").val($("#cboPackage option:selected").attr("data-days"));
		$("#txtPrice").val($("#cboPackage option:selected").attr("data-price"));
		$("#txtFee").val($("#cboPackage option:selected").attr("data-fee"));

	});
	

	function calculate(){
		var mbps = parseInt($("#txtMbps").val());
		var days = parseInt($("#txtDays").val());
		var price = parseInt($("#txtPrice").val().replace(/,/g, ''));
		var fee = parseInt($("#txtFee").val().replace(/,/g, ''));
		var payment = parseInt($("#txtPayment").val().replace(/,/g, ''));
		
		var total_amount = parseInt($("#txtTotalAmount").val().replace(/,/g, ''));

		$("#txtAmount").val((days * (price/30)).toLocaleString());
		$("#txtTotalAmount").val((days * (price/30) + fee).toLocaleString());

		// if($("#txtType").val()=="VIP"){
		// 	$("#txtPayment").attr("disabled", "disabled"); 
		// 	$("#txtBalance").val(0);

		// }else{
			$("#txtPayment").removeAttr("disabled"); 
			$("#txtBalance").val((days * (price/30) + fee - ((payment)?payment:0)).toLocaleString());
		// }
		

	}

	function validateAndSave(){
		var city = $("#txtCity").val();
		var invoice_no = $("#txtInvoiceNo").val();
		var sales_date = $("#txtDatePicker").val();
		var name = $("#txtName").val();
		var package = $("#cboPackage").val();
		var mbps = $("#txtMbps").val();
		var days = $("#txtDays").val();
		var price = parseInt($("#txtPrice").val().replace(/,/g, ''));
		var fee = parseInt($("#txtFee").val().replace(/,/g, ''));
		var tax_percent = parseInt($("#txtTaxPercent").val().replace(/,/g, ''));
		// var refund = $("#txtRefund").val();
		var payment = parseInt($("#txtPayment").val().replace(/,/g, ''));
		var start_date = $("#txtDateFrom").val();
		// var expire_date = ($("#chkDateFrom").prop("checked"))?$("#txtDatePicker").val():"";

		if(name.trim()=="" || package.trim()==""){
			bootbox.alert("Please fill the boxes.");
			return false;
		}else{
			$.ajax({
				type: "POST",
				url: APP_URL + "api/sales/edit.php",
				data: JSON.stringify({ city: city, invoice_no: invoice_no, sales_date: sales_date, name: name, package: package, mbps: mbps, days: days, price: price, fee: fee, tax_percent: tax_percent, payment: payment, start_date:start_date }),
				success: function(data){	
					if(data.message=="updated"){
						bootbox.alert("Updated.");
						// $("#frmEntry")[0].reset();
						// $("#txtDatePicker").val(customDate);
						// $("#datePicker").datepicker("setDate", customDate);
						// getCity(C);
					}else if(data.message=="duplicate"){
						bootbox.alert("Duplicate Card No.");
					}else{
						bootbox.alert("Error on server side.");
					}
				}
			});
		}
	}

	function isNumber(evt) {
		evt = (evt) ? evt : window.event;
		var charCode = (evt.which) ? evt.which : evt.keyCode;
		if ( (charCode > 31 && charCode < 48) || charCode > 57) {
			return false;
		}
		return true;
	}

	function btozero(obj){
		if($(obj).val() == "")$(obj).val("");
	}	
	
</script>

