<div class="container-fluid" style="">

	<div class="jumbotron">
		<div class="row">
			<div class="col-md-4 text-center align-self-center">
				<img class="image-responsive" src="<?php echo base_url($company['file_location'].$company['file_name']); ?>" style="max-height: 15rem; max-width: 15rem;">
			</div>
			<div class="col-md-8">
				<h1 class="display-4" id="cardName"><?php echo $company['name']; ?></h1>
				<p class="lead" id="cardProfile"><?php echo $company['profile']; ?></p>
				<hr class="my-4">
				<p id="cardPhone"><?php echo $company['phone']; ?></p>
				<p><a id="cardWebsite" target="_blank" href="<?php echo 'http://'.$company['website']; ?>"><?php echo $company['website']; ?></a></p>
			</div>
		</div>
	</div>
	<div class="row">
		<div class="col">
			<button onclick="printOvertimeReport()" type="button" class="btn btn-dark btn-round btn-sm pull-right" style="height:100px; width: 100%; ">
				<h5 class="card-title"><i class="fa fa-print"></i> Print</h5>
				<p class="card-text">Print Overtime Details Report.</p>
			</button>
		</div>
	</div>

	<section style="padding-top: 2rem; padding-bottom: 2rem;">
		<div class="card">
			<div class="card-body">
				<h4 class="card-title">Overtime Details Report</h4>
				<hr>
				<form id="filterForm">
					<div class="form-row">
						<div class="col">
							<label for="filter_department">Department</label>
							<select name="filter_department" id="filter_department" class="form-control form-control-sm" onchange="changeStaffList(this)">
								<option value="">ALL</option>  
                                    <?php if(!empty($department)) foreach ($department as $row): ?>
                                        <option value="<?php echo $row['id'];?>"><?php echo $row['name']; ?> [<?php echo $row['branch_name']; ?>]</option>
                                    <?php endforeach ?> 
                            </select>
						</div>
						<div class="col">
							<label for="filter_staff">Staff Name</label>
							<select type="text" id="filter_staff" class="form-control form-control-sm">
								<option value="" selected="selected">ALL</option>
	                            <?php foreach($staff as $staff){ ?>
	                                <option 
	                                <?php if($staff['id']) { 
	                            		//echo 'selected';
	                            	}?> 
	                            	value="<?php echo $staff['id']; ?>"><?php echo $staff['name']; ?></option>
	                            <?php } ?>
							</select>
						</div>
						<div class="col">
							<label for="filter_dayType">Day Type</label>
							<select id="filter_dayType" type="text" class="form-control form-control-sm">
								<option value="" selected="selected">ALL</option>
								<option value="1">Normal Day</option>
								<option value="2">Rest Day</option>
								<option value="3">Public Holiday</option>
								<option value="4">Weekend</option>
                                <option value="5">Weekdays</option>
							</select>
						</div>
						<div class="col">
							<label for="filter_status">Status</label>
							<select id="filter_status" type="text" class="form-control form-control-sm">
								<option value="-1" selected="selected">ALL</option>
								<option value="0">Pending</option>
								<option value="1">Approved</option>
								<option value="2">Rejected</option>
							</select>
						</div>
						<div class="col">
							<label for="filter_client">Client</label>
							<select id="filter_client" type="text" class="form-control form-control-sm">
	                            <option selected="selected">ALL</option>
                                <?php if(!empty($clientList)) foreach ($clientList as $client): ?>
                                    <option value="<?php echo $client->customer_id;?>"><?php echo $client->name;?></option>

                                <?php endforeach ?>
                                <option value="-1">Others</option> 
							</select>
						</div>
					</div>
					<div class="form-row">
						<div class="col">
							<label for="filter_ot_start_date">Start Date</label>
							<input type="text" class="form-control form-control-sm" id="ot_start_date" placeholder="Enter Start Date" value="">
						</div>
						<div class="col">
							<label for="filter_ot_end_date">End Date</label>
							<input type="text" class="form-control form-control-sm" id="ot_end_date" aria-describedby="emailHelp" placeholder="Enter End Date" value="">
						</div>
						<div class="col">
							<label for="filter_svdepartment">SV Department</label>
							<select name="filter_svdepartment" id="filter_svdepartment" class="form-control form-control-sm" onchange="changeSVList(this)">
								<option value="">ALL</option>  
                                    <?php if(!empty($department)) foreach ($department as $row): ?>
                                        <option value="<?php echo $row['id'];?>"><?php echo $row['name']; ?> [<?php echo $row['branch_name']; ?>]</option>
                                    <?php endforeach ?> 
                            </select>
						</div>
						<div class="col">
							<label for="filter_sv">SV Name</label>
							<select type="text" id="filter_sv" class="form-control form-control-sm">
								<option value="" selected="selected">ALL</option>
	                            <?php foreach($staff1 as $staff){ ?>
	                                <option 
	                                <?php if($staff['id']) { 
	                            		//echo 'selected';
	                            	}?> 
	                            	value="<?php echo $staff['id']; ?>"><?php echo $staff['name']; ?></option>
	                            <?php } ?>
							</select>
						</div>
						<div class="col">
							<label for="filter_submit"><br></label>
							<button type="button" class="btn btn-primary btn-sm btn-block" id="filter_submit" name="filter_submit"><i class="fas fa-search"></i> Submit</button>
						</div>
					</div>
				</form><br><hr>
				<div class="table-responsive">
					<table id="table_OTReport" class="table table-hover table-bordered">
						<thead>
							<tr>
								<th class="text-center">#</th>
								<th class="text-center">Department</th>
								<th class="text-center">Staff Name</th>	
								<th class="text-center">Date</th>
								<th class="text-center">Client</th>
								<th class="text-center">Task</th>
								<th class="text-center">Meal Allowance</th>
								<th class="text-center">Time</th>
								<th class="text-center">Day Type</th>
								<th class="text-center">Total Hours</th>
								<th class="text-center">Supervisor</th>
								<th class="text-center">Status</th>
							</tr>
						</thead>
						<tbody>
							<?php 
								$i = 1;
								if($otDetail) foreach($otDetail as $row) {  ?>
									<tr>
										<td scope="row"><small><?php echo $i; ?></small></td>
										<td><small><?php echo $row->deptName; ?></small></td>
										<td><small><?php echo $row->staffName; ?></small></td>
										<td><small><?php echo date('d/m/Y',strtotime($row->otDate)); ?></small></td>
										<td><small><?php if($row->clientID > 0 ){ echo $row->clientName; }else{ echo 'Others';};?></small></td>
										<td><small><?php echo $row->task; ?></small></td>
										<td><small><?php if($row->mealAllowance == 1){
                                                    echo 'Claimable (Included)';
                                                  } else if($row->mealAllowance == 2){
                                                    echo 'Claimable (Not Included)';
                                                  } else {
                                                    echo 'Unclaimable';
                                                  } ?>  
                                        </small></td>
										<td><small><b>Start : </b><?php echo date("h:i A", strtotime($row->startTime)); ?><br>
											<b>End   : </b><?php echo date("h:i A", strtotime($row->endTime)); ?><br>
											<b>Break : </b><?php echo $row->refreshment; ?> minutes</small>
										</td>
										<td><small><?php 
                                                if($row->dayType == 1){
                                                    echo 'Normal Day';
                                                }else if($row->dayType == 2){
                                                    echo 'Rest Day';
                                                }else if($row->dayType == 3){
                                                    echo 'Public Holiday';
                                                }else if($ot['dayType'] == 4){
                                                    echo 'Weekend';
                                                }else if($ot['dayType'] == 5){
                                                    echo 'Weekdays';
                                                }
                                            ?></small>
										</td>
										<td><small><?php echo $row->totalHoursApplied; ?></small></td>
										<td><small><?php echo $row->svName;?> <br><b> - <?php echo $row->svDeptName;?></b></small></td>
										<td class=""><?php if($row->status == 0) { ?>
                                                <span class="badge badge-warning text-white">Pending</span><br>
                                                <small><i><b>*Remarks : </b><?php echo $row->remarks;?></i></small>
                                            <?php } else if($row->status == 1) { ?>
                                                <span class="badge badge-success text-white">Approved</span><br>
                                                <small><i><b>*Remarks : </b><?php echo $row->remarks;?></i><br></small>
                                                <small><i><b>*Approved by : </b><?php echo $row->status_by_name;?></i></small>
                                            <?php }else { ?>
                                                <span class="badge badge-danger text-white">Rejected</span><br>
                                                <small><i><b>*Remarks : </b><?php echo $row->remarks;?></i><br></small>
                                                <small><i><b>*Rejected by : </b><?php echo $row->status_by_name;?></i></small>
                                            <?php } ?>
										</td>
									</tr>
								    <?php
	                                $i++;
	                        } ?>
						</tbody>
					</table>
				</div>
			</div>
		</div>
	</section>
</div>

<script type="text/javascript">

	$('#ot_start_date, #ot_end_date').datepicker({
		uiLibrary: 'bootstrap4',
		format: 'dd-mm-yyyy'
	});

	$('#filter_submit').click(function(){
      $('#table_OTReport').dataTable().fnDraw();

      	if($('#ot_start_date').val() == ""){
      		var start_date = 0;
      	}else{
      		var start_date = $('#ot_start_date').val();
      	}

      	if($('#ot_end_date').val() == ""){
      		var end_date = 0;
      	}else{
      		var end_date = $('#ot_end_date').val();
      	}

      	var postData = {
            'department_id'	: $('#filter_department').val(),
            'staff_id'		: $('#filter_staff').val(),
            'dayType_id'	: $('#filter_dayType').val(),
            'status'		: $('#filter_status').val(),
            'client_id'		: $('#filter_client').val(),
            'start_date'	: start_date,
            'end_date'		: end_date,
            'svdepartment_id': $('#filter_svdepartment').val(),
            'sv_id'			: $('#filter_sv').val()
        };

        $.ajax({
          type:'POST',
          dataType:'json',
          url: '<?php echo base_url(); ?>hr/Overtime_report/fnLoadOTDetailList',
          data: postData, 
          success: function(data) {
             var oTable = $('#table_OTReport').dataTable();
              oTable.fnClearTable();
              if ($.trim(data.status)== 'success') {
                  $.each(data.message,function(index, value){

                  	if(value.mealAllowance == 1){
                  		mealAllowance = "Claimable (Included)";
                  	}else if(value.mealAllowance == 2){
                  		mealAllowance = "Claimable (Not Included)";
                  	}else{
                  		mealAllowance = "Unclaimable";
                  	}

                  	if(value.dayType == 1){
                  		dayType = "Normal Day";
                  	}else if(value.dayType == 2){
                  		dayType = "Rest Day";
                  	}else if(value.dayType == 3){
                  		dayType = "Public Day";
                  	}else if(value.dayType == 4){
                  		dayType = "Weekend";
                  	}else if(value.dayType == 5){
                  		dayType = "Weekdays";
                  	}

                  	if(value.status == 0){
                  		status = '<span class="badge badge-warning text-white">Pending</span><br><small><i><b>*Remarks : </b>' + value.remarks + '</i></small><br>';
                  	}else if(value.status == 1){
                  		status = '<span class="badge badge-success text-white">Approved</span><br><small><i><b>*Remarks : </b>' + value.remarks + '</i></small><br><small><i><b>*Approved by : </b>' + value.status_by_name + '</i></small>';
                  	}else{
                  		status = '<span class="badge badge-danger text-white">Rejected</span><br><small><i><b>*Remarks : </b>' + value.remarks + '</i></small><br><small><i><b>*Rejected by : </b>' + value.status_by_name + '</i></small>';
                  	}

                  	if(value.svName == null){
                  		value.svName = '';
                  	}

                  	if(value.svDeptName == null){
                  		value.svDeptName = '';
                  	}
                  	
                    var row = oTable.fnAddData([
                    '<small>'+ ++index  + '</small>',
                    '<small>'+ value.deptName + '</small>',
                    '<small>'+ value.staffName + '</small>',
                    '<small>'+ value.otDate + '</small>',
					'<small>'+ value.clientName + '</small>',
					'<small>'+ value.task + '</small>',
					'<small>'+ mealAllowance + '</small>',
					'<small><b>Start : </b>' + value.startTime + '<br>' +
							'<b>End   : </b>' + value.endTime + '<br>' +
							'<b>Break : </b>' + value.refreshment + ' minutes</small>',
					'<small>'+ dayType + '</small>',
					'<small>'+ value.totalHoursApplied + '</small>',
					'<small>'+ value.svName + '<b> - ' + value.svDeptName + '</b></small>',
					status,
                    ]);
                  });
                  oTable.fnDraw();
                    } else {
                  console.log(data.message);
                    }
          },
          error: function(data){
          console.log('failed ' + data);
          }
        });
    });

	function changeStaffList(obj) 
    {
        var id = obj.value;

        $.ajax({
            type: "POST",
            url: "<?php echo base_url() ?>hr/Overtime_report/getStaffByDept",
            data: "dept_id=" + id,
            dataType: "json",
            success: function(content) {

                if (content.status == "success") {

                    var items = [];
                    items.push('<option>ALL</option>');
                    for (var i = 0; i < content.message.length; i++) {
                        items.push('<option value="' + content.message[i].id + '">'
                                + content.message[i].name + '</option>');
                    }
                    jQuery("#filter_staff").empty();
                    jQuery("#filter_staff").append(items.join('</br>'));
                } else {
                    $("#error").html('<p>' + content.message + '</p>');
                }
            }
        });
        return false;
    }

    function changeSVList(obj) 
    {
        var id = obj.value;

        $.ajax({
            type: "POST",
            url: "<?php echo base_url() ?>hr/Overtime_report/getStaffByDept",
            data: "dept_id=" + id,
            dataType: "json",
            success: function(content) {

                if (content.status == "success") {

                    var items = [];
                    items.push('<option>ALL</option>');
                    for (var i = 0; i < content.message.length; i++) {
                        items.push('<option value="' + content.message[i].id + '">'
                                + content.message[i].name + '</option>');
                    }
                    jQuery("#filter_sv").empty();
                    jQuery("#filter_sv").append(items.join('</br>'));
                } else {
                    $("#error").html('<p>' + content.message + '</p>');
                }
            }
        });
        return false;
    }

    function printOvertimeReport()
	{
		if($('#filter_department').val() == ""){ 
			var department = "ALL"; 
		} else { 
			var department = $('#filter_department').val(); 
		};

		if($('#filter_staff').val() == ""){ 
			var staff = "ALL"; 
		} else { 
			var staff = $('#filter_staff').val(); 
		};

		if($('#filter_svdepartment').val() == ""){ 
			var svdepartment = "ALL"; 
		} else { 
			var svdepartment = $('#filter_svdepartment').val(); 
		};

		if($('#filter_sv').val() == ""){ 
			var sv = "ALL"; 
		} else { 
			var sv = $('#filter_sv').val(); 
		};

		if($('#filter_dayType').val() == ""){ 
			var dayType = "ALL"; 
		} else { 
			var dayType = $('#filter_dayType').val(); 
		};

		if($('#filter_status').val() == "-1"){ 
			var status = "-1"; 
		} else { 
			var status = $('#filter_status').val(); 
		};

		if($('#filter_client').val() == ""){ 
			var client = "ALL"; 
		} else { 
			var client = $('#filter_client').val(); 
		};

		if($('#ot_start_date').val() == ""){ 
			var start_date = "ALL"; 
		} else { 
			var start_date = $('#ot_start_date').val(); 
		};

		if($('#ot_end_date').val() == ""){ 
			var end_date = "ALL"; 
		} else { 
			var end_date = $('#ot_end_date').val(); 
		};


		window.open("<?php echo base_url().'hr/Overtime_report/printOvertimeReport/'?>" + department + "/" + staff + "/" + dayType + "/" + status + "/" + client + "/" + start_date +"/" + end_date + "/" + svdepartment +"/" + sv , "_blank");
	}

</script>