<?php
if (!isset($_SESSION['FirstName'])) {
	session_start();
}



if ($_SESSION['FirstName'] == "") {
	echo 'You are not authorized to view this page. <br><br>You may <a href="index.php"><font color="blue">log in here.</font></a>';
	exit;
}
    
include ('includes/db1config.php');
include ('../includes/mysql_connect.php');

echo "</div><h4>Reporting</h4>";
?>

<?php include("admin_globals.php"); ?>

<style type="text/css" media="screen">
	.datepicker {
		border: 1px solid grey;
	    height: 24px;
	    margin: 5px 0 0;
	    padding: 2px 0 2px 2px;
	    width: 150px;
	}
</style>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<!-- //<script src="https://code.jquery.com/jquery-1.12.4.js"></script> -->
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div class="mainForm">
	<select name="" class="report_type" >
		<option value="">Report Type</option>
		<option value="Daily_Order_Summary">Daily Order Summary</option>
		<option value="Order_History">Order History</option>
	</select>
	<br>
	<label style="display:none;" for="" id="select_date_label" >Select Date</label>
	<input type="text" style="display:none;margin-left: 15px;" name="" id="select_date" class="datepicker" placeholder="Select date" value="<?php echo date('Y-m-d'); ?>" >
	<br>
	

	<select name="" class="" id="customer_name" style ="display:none;" >
		<option value="">Customer Name</option>
		<?php 
			$query = "SELECT * from guestLogin";
			$rt    = mysql_query($query);  // query executed
			echo mysql_error();   
			
			while($nt2=mysql_fetch_array($rt)){
				echo '<option value="'.$nt2['UserKey'].'">'.$nt2['FirstName'].' '.$nt2['LastName'].'</option>';
			}
		?>
	</select>
	<br>
	<label style="display:none;" id="begin_date_label" for="">Begin Date</label>&nbsp;&nbsp;&nbsp;&nbsp;
	<input type="text" style ="display:none;margin-left: 0;" name="" id="begin_date" class="datepicker" placeholder="Begin date">
	
	<br>
	<label style="display:none;" id="end_date_label" for="">End Date</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
	<input type="text" style ="display:none;margin-left: -1px;" name="" id="end_date" class="datepicker" placeholder="End date">
	
	<br>
	<label style="display:none;" for="" id="order_number_label" >Order Number</label>
	<input type="text" style ="display:none;" name="" id="order_number" class="datepicker" placeholder="Order Number">

	<br>
	<br>
	<a style="display:none;cursor:pointer;" class="add-menu-item get_order" id="save-button" >Get Order(s)</a>
	<div style="margin-top:2%;" id="orders_html" >
		<center><h5>Please Select Report Type to see orders</h5></center>
	</div>
	
	<div id="popup_add" class="toPopDiv menu-item" style="display: none;"> 
        <div class="close"></div>
        <span class="ecs_tooltip" style="display: none;">Esc to close <span class="arrow"></span></span>
        <iframe style="width:100%;height:400px;" src="getOrderDetail.php" id="iframe-add" class="menu-item-iframe"></iframe>
    </div>

    <div id="popup_edit" class="toPopDiv menu-item" style="display: none;"> 
        <div class="close"></div>
        <span class="ecs_tooltip" style="display: none;">Esc to close <span class="arrow"></span></span>
        <iframe style="width:100%;height:400px;" src="getOrderDetail.php" id="iframe-add" class="menu-item-iframe"></iframe>
    </div>

</div>
<script>
	$(document).ready(function(){
    	$("#select_date").datepicker({
	        "dateFormat" : "yy-mm-dd",
	        "minDate"    : -14,
	        "maxDate"    : new Date()
	    }).attr("readonly", true);

      	$("#begin_date").datepicker({
	        "dateFormat" : "yy-mm-dd",
	    }).attr("readonly", false);

	    $("#end_date").datepicker({
	        "dateFormat" : "yy-mm-dd",
	    }).attr("readonly", false);

	    $(document).on('change','.report_type',function() {
	    	if($(this).val() != '' ){
	    		
		    	if($(this).val() == 'Daily_Order_Summary' ){
		    		$('#select_date').show();
		    		$('#select_date_label').show();
		    		$('#customer_name,#begin_date,#end_date,#order_number').val('').hide();
		    		$('#customer_name_label,#begin_date_label,#end_date_label,#order_number_label').hide();
		    		$('#orders_html').html('<center><h5>Please Select Report Type to see orders</h5></center>');
		    	} else {
	    			$('#select_date').hide();
	    			$('#select_date_label').hide();
		    		$('#customer_name,#begin_date,#end_date,#order_number').show();
		    		$('#customer_name_label,#begin_date_label,#end_date_label,#order_number_label').show();
		    		$('#orders_html').html('<center><h5>Please Select Report Type to see orders</h5></center>');
		    	}
		    	$('#save-button').show();
	    	} else {
	    		$('#orders_html').html('<center><h5>Please Select Report Type to see orders</h5></center>');
	    		$('#customer_name,#begin_date,#end_date,#order_number').val('').hide();
	    		$('#customer_name_label,#begin_date_label,#end_date_label,#order_number_label').hide();
	    		$('#select_date').hide();
    			$('#select_date_label').hide();
    			$('#save-button').hide();
	    	}
	    });

	    $(document).on('click', '.get_order', function() {
	    	var report_type   = $('.report_type').val();
	    	/* For Filter first*/
	    	var select_date   = $('#select_date').val();
	    	/* For Filter second*/
	    	var customer_name = $('#customer_name').val();
	    	var begin_date    = $('#begin_date').val();
	    	var end_date      = $('#end_date').val();
	    	var order_number  = $('#order_number').val();

	    	if( report_type != '' ){
	    		if(report_type == 'Daily_Order_Summary' ){ // if report type is daily order summary
		    		if( $('#select_date').val() == '' ){ 
		    			alert('Please enter date');
	    			} else {
	    				$.ajax({
				    		url       : '/cmsadmin/getOrder.php',
				    		type      : 'POST',
				    		dataType  : 'html',
				    		data      : {
				    			select_date : select_date
				    		},
				    	}).done(function(res) {
				    		console.log(res);
				    		$('#orders_html').html(res);
				    	});
	    			}
		    	} else { //if report type is order history
    				if(customer_name == '' && begin_date == '' && end_date == '' && order_number == '' ){
    					alert('Please use any of the filters');
    				} else {
    					if( begin_date == '' && end_date != '' ){
    						alert('Please select begin date');
    					} else if(begin_date != '' && end_date == '' )  {
    						alert('Please select end date');
    					} else {
							$.ajax({
					    		url       : '/cmsadmin/getOrder.php',
					    		type      : 'POST',
					    		dataType  : 'html',
					    		data      : {
					    			customer_name : customer_name,
					    			begin_date    : begin_date,
					    			end_date      : end_date,
					    			order_number  : order_number
					    		},
					    	}).done(function(res) {
					    		$('#orders_html').html(res);
					    	});
    					}
    				}
		    	}
	    	} else {
	    		alert('Please select report type');
	    	}
	    });
		
		$(document).on('click', '.popup', function(event) {
        	var popupId = $(this).data('popup-id');
	        var id      = $(this).attr('data-order-id');	
        	$('.menu-item-iframe').attr('src','getOrderDetail.php?id='+id);
    	});

	})
</script>


<div style="clear: both;">&nbsp;</div>
			  <div style="text-align:center;"><?php echo $bottom_links; ?></div>