<?php $this->load->view("partial/header"); ?>
<script type="text/javascript" src="./dist/highcharts.js"></script>
<script type="text/javascript" src="./dist/highcharts-3d.js"></script>
<script src="dist/data_tables/jquery.dataTables.min.js"></script>
<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" src="./dist/dashboard.js"></script>
<script src="dist/data_tables/exporting.js"></script>

<script type="text/javascript">
  $(document).ready(function (){  
    
    <?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){
  filters: $("#filters").val() || [""]
  
  $.ajax({
    type: "POST",
    url:"<?php echo base_url('index.php/Software_update/software_update'); ?>?",
    data: {start_date: start_date,end_date: end_date},
    success: function(data) {
    var tr = "";
	var rslt = JSON.parse(data);
	for(i = 0; i < rslt.result.length; i++){
	tot_op          = rslt.result[i].tot_op;
	book_cancel     = rslt.result[i].book_cancel;
	assigned    = rslt.result[i].assigned;
	cancel = rslt.result[i].cancel;
	
		tr += "<tr><td style ='color:#00000 !important;text-align:center !important;'>Total Operations</td><td style ='color:#00000 !important;text-align:center !important;cursor:pointer;' onclick=get_vehicle_assigned_info('"+start_date+"','"+end_date+"',1)>"+tot_op+"</td><td style ='color:#00000 !important;text-align:center !important;cursor:pointer;' onclick=get_vehicle_assigned_info('"+start_date+"','"+end_date+"',2)>"+book_cancel+"</td></tr><tr><td style ='color:#00000 !important;text-align:center !important;'>Vehicle Not Assigned</td><td style ='color:#00000 !important;text-align:center !important;cursor:pointer;' onclick=get_vehicle_assigned_info('"+start_date+"','"+end_date+"',3)>"+assigned+"</td><td style ='color:#00000 !important;text-align:center !important;')>N/A</td></tr>";
	}
	if(tr === ""){
		tr = "<tr>Data not exists</tr>";
	}
	$('#software_update').html(tr); 

	$('#detail_list').DataTable({		  
		"paging":   false,
		"ordering": false,      
		dom: 'Bfrtip',
		buttons: ['copy','csv','excel','pdf','print'],
		destroy: true,  
		fnDraw: true,
	}); 
	$('#detail_list').DataTable().destroy();
  software_update_chart(start_date,end_date);
    },
  });    
});
});
function get_vehicle_assigned_info(start_date,end_date,sts){
	 var frm = "get_vehicle_assigned_info";
    $.ajax({
      type: "POST",
      url: "./dashboard/report_call.php",
      data: {frm:frm,start_date:start_date,end_date:end_date,sts:sts},
      success: function(data) {
        $('#report_model_body').html(data);
		$('#detail').DataTable( {
			"paging":   false,
			"ordering": false,
			 dom: 'Bfrtip',
            buttons: ['excel'],
		});
        $('#detail_list_model').modal('show');
      },
    });
}
</script>
<div class="row" id='holder'>
    <div class="col-md-12">
      <div class="form-group">
        <?php echo form_input(array('name' => 'daterangepicker', 'class' => 'form-control input-sm', 'id' => 'daterangepicker')); ?>
      </div>
      <div class="form-group">
        <button class="btn btn-primary btn-sm" id="search">Search</button>
      </div>

      <h1>Vehicle Assigned Report</h1>
    </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:#3369E6;'>
            <th style='text-align:center !important;padding:4px;'>Type</th>
            <th style='text-align:center !important;padding:4px;'>Total</th> 
            <th style='text-align:center !important;padding:4px;'>Cancelled</th>       
        </tr>       
      </thead>
        <tbody id="software_update"></tbody>
      </table>
	  </div>
    </div>
    <div class="col-md-12">
      <div id="software_update_chart"></div>
    </div>
</div>
<div class="modal fade" id="detail_list_model" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog modal-lg" style="width: 90%;" role="document">
    <div class="modal-content">
      <div class="modal-header" style='padding: 5px 15px;'>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Detailed List</h4>
      </div>
      <div class="modal-body" id="report_model_body" style="height:260px;">
        
      </div>
    </div>
  </div>
</div>
<style type="text/css">
  #table_holder .fixed-table-body table tr td {
      color: #333333 !important;
      padding: 8px !important;
      line-height: inherit !important;
      vertical-align: middle !important;
      height: auto;
  }
  div#holder {
    padding: 15px;
    background-color: #FFFFFF;
    margin: 5px;
    border-radius: 4px;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
  }
  h1 {
    margin: 0;
    margin-bottom: 4px !important;
    width: auto;
    font-size: 25px;
    color: #d84f57;
    font-weight: bold;
    text-transform: initial;
}
#table .btn-default {
    color: #ffffff !important;
    background: #d84f57;
    padding: 1px 6px !important;
    font-size: 12px !important;
}
.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;
}
#report_model_body .btn-default {
    color: #ffffff !important;
    background: #d84f57;
    padding: 1px 6px !important;
    font-size: 12px !important;
}
</style>
<?php $this->load->view("partial/footer"); ?>