<?php $this->load->view("partial/header"); ?>
<link rel="stylesheet" type="text/css" href="dist/data_tables/datatables.min.css"/>
<script type="text/javascript" src="dist/data_tables/datatables.min.js"></script>
<script type="text/javascript">
$(document).ready(function (){
	$.fn.dataTableExt.sErrMode = 'throw';
	<?php $this->load->view('partial/daterangepicker'); ?>
	$('#daterangepicker').data('daterangepicker').setStartDate("<?php echo date($this->config->item('dateformat'), mktime(0,0,0,date("m"),1,date("Y"))); ?>");
	var start_date = "<?php echo date('Y-m-d', mktime(0,0,0,date("m"),1,date("Y"))); ?>";
	var end_date   = "<?php echo date('Y-m-d', mktime(0,0,0,date("m")+1,1,date("Y"))-1); ?>";
	
		$('#search').on('click', function (e){
			var cust_sts            = $("#cust_sts").val();
			var referral_type       = $("#referral_type").val();
			$.ajax({
			url: "<?php echo base_url('index.php/Customer_data_report/search'); ?>",
			type: "POST",
			data: {start_date:start_date,end_date:end_date,cust_sts:cust_sts,referral_type:referral_type},
			async: false,
				success: function (data) {
					var tr = "";
					var rslt   = JSON.parse(data);
					for(i = 0; i < rslt.result.length; i++) {
						customer_name     = rslt.result[i].customer_name;
						phone_number      = rslt.result[i].phone_number;
						alt_number        = rslt.result[i].alt_number;
						land_line         = rslt.result[i].land_line;
						cust_email        = rslt.result[i].cust_email;
						cust_address      = rslt.result[i].cust_address;
						city              = rslt.result[i].city;
						state_name        = rslt.result[i].state_name;
						dob               = rslt.result[i].dob;
						referral_type     = rslt.result[i].referral_type;
						allow_contract    = rslt.result[i].allow_contract;
						cust_sts          = rslt.result[i].cust_sts;
						
						tr += "<tr><td>"+customer_name+"</td><td>"+phone_number+"</td><td>"+alt_number+"</td><td>"+land_line+"</td><td>"+cust_email+"</td><td>"+cust_address+"</td><td>"+city+"</td><td>"+state_name+"</td><td>"+dob+"</td><td>"+referral_type+"</td><td>"+allow_contract+"</td><td>"+cust_sts+"</td></tr>";
					}
					$("#customer_details").html(tr);
					$('#detail_list').DataTable({		  
						"paging":   false,
						"ordering": false,
						//destroy: true,
						dom: 'Bfrtip',
						buttons: ['copy','csv','excel','pdf','print'],
					});
					//$('#detail_list').DataTable().destroy();
					
				},
				
			});
		});
		
		
});

</script>
<div id="table_holder" style="padding:0px;">
	<div class="analysis_holder">
		<h1>Customer Data Export</h1>
		<div class="form-group">
			<?php 
				echo form_label("Select Date", 'daterangepicker', array('class' => ''));
				echo form_input(array('name' => 'daterangepicker', 'class' => 'form-control input-sm', 'id' => 'daterangepicker')); 
			?>
		</div>
		<div class="form-group">
			<?php
				echo form_label("Select Status", 'cust_sts', array('class' => ''));echo "<br/>";
				echo form_multiselect('cust_sts[]', $cust_sts, '', array('id' => 'cust_sts', 'class' => 'selectpicker show-menu-arrow', 'data-none-selected-text' => '--Select Status--', 'data-selected-text-format' => 'count > 1', 'data-style' => 'btn-default btn-sm', 'data-width' => 'fit'));
			?>
		</div>
		<div class="form-group">
			<?php
				echo form_label("Referral Type", 'referral_type', array('class' => '')); echo "<br/>";
				echo form_multiselect('referral_type[]', $referral_type, '', array('id' => 'referral_type', 'class' => 'selectpicker show-menu-arrow', 'data-none-selected-text' => '--Select Type--', 'data-selected-text-format' => 'count > 1', 'data-style' => 'btn-default btn-sm', 'data-width' => 'fit'));
			?>
		</div>
		<div class="form-group">
			<button class="btn btn-primary btn-sm" id="search" > Search</button>
		</div>
	</div>
	<div class="col-md-12">
		<div id="table">
			<table id='detail_list' class='table table-hover table-striped col-style'>
			   <thead>
					<tr style='font-weight:bold;text-align:center !important;background:#d84f57;'>
						 <th style='padding:4px;'>Name</th>
						 <th style='padding:4px;'>Mobile No.</th>              
						 <th style='padding:4px;'>Alt Mobile No.</th>
						 <th style='padding:4px;'>Landline</th>
						 <th style='padding:4px;'>Email</th>
						 <th style='padding:4px;'>Address</th>
						 <th style='padding:4px;'>City</th>
						 <th style='padding:4px;'>State</th>
						 <th style='padding:4px;'>DOB</th>
						 <th style='padding:4px;'>Referral By</th>
						 <th style='padding:4px;'>Allow Contract</th>
						 <th style='padding:4px;'>Status</th>
					</tr>       
			  </thead>
			  <tbody id="customer_details"></tbody>
			</table>	
		</div>
	</div>
</div>
<style>
h1{
	margin: 0;
	width: auto;
	font-size: 25px;
	color: #d84f57;
	font-weight: bold;
	text-transform: initial;
	margin-bottom: 15px;
}
.analysis_holder{
	box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
	padding: 8px; 
	background-color: #EEEEEE;
	margin-bottom: 15px;
}
.btn-group, .btn-group-vertical {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	float: right;
}
div.dataTables_wrapper div.dataTables_filter label {
	font-weight: normal;
	white-space: nowrap;
	text-align: left;
	float: left;
}
div.dataTables_wrapper div.dataTables_filter input {
    margin-left: 0.5em;
    display: inline-block;
    width: auto;
    width: 170px !important;
}
.buttons-html5 , .buttons-print {
    color: #ffffff;
    background-color: #d84f57;
    border: 0px;
    padding: 3px 15px;
	font-size:12px
}
.pagination>li>a, .pagination>li>span {
    position: relative;
    float: left;
    padding: 8px 15px;
    line-height: 1.42857143;
    text-decoration: none;
    color: #ffffff;
    background-color: #d84f57;
    border: 1px solid transparent;
    margin-left: -1px;
}
.pagination>.disabled>span, .pagination>.disabled>span:hover, .pagination>.disabled>span:focus, .pagination>.disabled>a, .pagination>.disabled>a:hover, .pagination>.disabled>a:focus {
    color: #FFFFFF;
    background-color:#d84f57;
    border-color: transparent;
    cursor: not-allowed;
}
</style>

<?php $this->load->view("partial/footer"); ?>