<div class="container-fluid mt-5 mb-5">
    <div class="card bg-light-transparent">  
        <div class="card-header bg-white">
            <div class="float-left">
                <h5>My OT Claim Details for <?php echo date("F Y",mktime(0,0,0, $rsOt['month'],1,$rsOt['year'])) ?></h5>
                <a href="<?php echo base_url('hr/overtime/otClaim')?>" class="btn btn-outline-dark btn-sm" title="Back to My OT List"  >
                    <i class="fa fa-angle-double-left"></i>Back to My OT Claim
                </a>
                <a onclick="printMyOTClaim()" target="_blank" class="btn btn-outline-dark btn-sm" title="Print My OT Claim"><i class="fa fa-print"></i> Print</a><br>
            </div>
        </div>

        <div class="tab-content">
            <div class="tab-pane fade active show" id="tableView" role="tabpanel" aria-labelledby="nav-table-tab">
                <div class="card-body">
                    <div class="card text-white bg-dark">
                        <div class="card-body">
                            <div class="row">
                                <div class="col-12 col-md-6">
                                    <div class="row">
                                        <label class="col-12 control-label" for="name" align="left">Name :</label>
                                        <div class="col-12">
                                            <input type="text" name="name" id="name" class="form-control" value="<?php echo $name ?>" readonly/>
                                            <input type="hidden" name="user_id" id="user_id" value="<?php echo $_SESSION['user']['id']; ?>">
                                        </div>
                                    </div>
                                    <div class="row">
                                        <label class="col-6 control-label" for="dept_name" >IC No:</label>
                                        <label class="col-6 control-label" for="dept_name" >Employee ID:</label>
                                        <div class="col-6">
                                            <input type="text" name="dept_name" id="dept_name" class="form-control" value="<?php echo $ic_no ?>" readonly/>
                                        </div>
                                        <div class="col-6">
                                            <input type="text" name="dept_name" id="dept_name" class="form-control" value="<?php echo $staff_id ?>" readonly/>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-12 col-md-6">
                                    <div class="row">
                                        <label class="col-12 control-label" for="name" align="left">Department :</label>
                                        <div class="col-12">
                                            <input type="text" name="name" id="name" class="form-control" value="<?php echo $department_name ?>" readonly/>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <label class="col-12 control-label" for="dept_name" >Designation:</label>
                                        <div class="col-12">
                                            <input type="text" name="dept_name" id="dept_name" class="form-control" value="<?php echo $position_name ?>" readonly/>
                                        </div>
                                    </div>
                                </div>
                            </div>  
                        </div>
                    </div>

                    <div class="card no-shadow">
                        <div class="card-body">
                            <div class="table-responsive">
                                <table class="table table-bordered p-0 m-0" width="100%">
                                   <thead>
                                        <th class="sorting" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="#: activate to sort column ascending" style="width: 0px;">
                                            #
                                        </th>
                                        <th class="sorting" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="Company Code/ Cost Centre: activate to sort column ascending" style="width: 0px;">
                                            Date
                                        </th>
                                        <th class="sorting" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="Salary/ Wage Month: activate to sort column ascending" style="width: 0px;">
                                            Client
                                        </th>
                                        <th class="sorting" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="Employee Total Upload: activate to sort column ascending" style="width: 0px;">
                                            Task
                                        </th>
                                        <th class="sorting" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="Employee Total Upload: activate to sort column ascending" style="width: 0px;">
                                            Start Time
                                        </th>
                                        <th class="sorting" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="Employee Total Upload: activate to sort column ascending" style="width: 0px;">
                                            End Time
                                        </th>
                                        <th class="sorting" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="Employee Total Upload: activate to sort column ascending" style="width: 0px;">
                                            Break (minutes)
                                        </th>
                                        <th class="sorting" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="Employee Total Upload: activate to sort column ascending" style="width: 0px;">
                                            Total Hours
                                        </th>
                                        <th class="sorting" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="Employee Total Upload: activate to sort column ascending" style="width: 0px;">
                                            Day Type
                                        </th>
                                         <th class="sorting" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="Employee Total Upload: activate to sort column ascending" style="width: 0px;">
                                            Supervisor
                                        </th>
                                        <th class="sorting" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="Employee Total Upload: activate to sort column ascending" style="width: 0px;">
                                            Status
                                        </th>       
                                    </thead>  
                                    <tbody>
                                        <?php if (!empty($otLists)): ?>
                                            <?php foreach ($otLists as $key => $ot): ?>       
                                            <tr>
                                                <td><?php echo $key+1;?></td>
                                                <td><?php echo date('d/m/Y',strtotime($ot['otDate']));?></td>
                                                <td><?php if($ot['clientID'] > 0 ){ echo $ot['clientName']; }else{ echo 'Others';};?></td>
                                                <td><?php echo $ot['task'];?></td>
                                                <td><?php echo date("h:i A", strtotime($ot['startTime']));?></td>
                                                <td><?php echo date("h:i A", strtotime($ot['endTime']));?></td>
                                                <td><?php echo $ot['refreshment'];?></td>
                                                <td><?php echo $ot['totalHoursApplied'];?></td>
                                                <td><?php 
                                                    if($ot['dayType'] == 1){
                                                        echo 'Normal Day';
                                                    }else if($ot['dayType'] == 2){
                                                        echo 'Rest Day';
                                                    }else if($ot['dayType'] == 3){
                                                        echo 'Public Holiday';
                                                    }else if($ot['dayType'] == 4){
                                                        echo 'Weekend';
                                                    }else if($ot['dayType'] == 5){
                                                        echo 'Weekdays';
                                                    }
                                                 ?></td>
                                                <td><?php echo $ot['svName'];?> <br><small><b> - <?php echo $ot['svDeptName'];?></b></small></td>
                                                <td id="otID" class="" otDetailID="<?php echo $ot['ID']; ?>" otID="<?php echo $ot['otID']; ?>">
                                                    <?php if($ot['status'] == 0) { ?>
                                                        <span class="badge badge-warning text-white">Pending</span><br>
                                                        <small><i><b>*Remarks : </b><?php echo $ot['remarks'];?></i><br></small>
                                                    <?php } else if($ot['status'] == 1) { ?>
                                                        <span class="badge badge-success text-white">Approved</span><br>
                                                        <small><i><b>*Remarks : </b><?php echo $ot['remarks'];?></i><br></small>
                                                        <small><i><b>*Approved by : </b><?php echo $ot['status_by_name'];?></i><br></small>
                                                    <?php }else { ?>
                                                        <span class="badge badge-danger text-white">Rejected</span><br>
                                                        <small><i><b>*Remarks : </b><?php echo $ot['remarks'];?></i><br></small>
                                                        <small><i><b>*Rejected by : </b><?php echo $ot['status_by_name'];?></i><br></small>
                                                    <?php } ?>
                                                </td>                                                
                                            </tr> 
                                            <?php endforeach ?>
                                        <?php endif ?>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="card no-shadow">
                    <div class="card-body">

                        <table class="table-bordered" width="100%">
                            <h5>My Claim Summary By Job for <?php echo date("F Y",mktime(0,0,0, $rsOt['month'],1,$rsOt['year'])) ?>
                            <thead>
                                <th colspan="2" class="text-center bg-light py-3">Department</th>
                                <th colspan="2" class="text-center bg-light">Details</th>
                            </thead>
                            <tbody>
                                <?php $sum = 0; ?>
                                <?php foreach($OTSummaryByDept as $row): ?>
                                    <tr>
                                        <?php if($row['svDeptID'] !=0){ ?>
                                            <td colspan="2" class="text-center"><?php echo $row['dept']; ?></td>
                                        <?php } else { ?>
                                            <td colspan="2" class="text-center"><?php echo $department_name; ?></td>
                                        <?php }?>
                                        <td class="text-left">
                                            &nbsp;OT Applied (Hours)<br>
                                            &nbsp;OT Approved (Hours)<br> 
                                            &nbsp;OT Claim<br><hr> 
                                            <?php if($row['svDeptID'] !=0){ ?>
                                                &nbsp;<b>Total for <?php echo $row['dept']; ?></b>
                                            <?php } else { ?>
                                                &nbsp;<b>Total for <?php echo $department_name; ?></b>
                                            <?php }?>
                                            
                                        </td>
                                        <td colspan="2" class="text-center">
                                            
                                            <?php 
                                                if(!empty($row['totalHoursApproved'])){ $row['totalHoursApproved'] = $row['totalHoursApproved']; } else { $row['totalHoursApproved'] = 0; };

                                                $totalClaim = $row['totalHoursApproved']*7;

                                                $totalDept = $totalClaim;

                                                $sum+=$totalDept;

                                            ?>

                                            <?php echo $row['totalHoursApplied']; ?><br>
                                            <?php echo $row['totalHoursApproved']; ?><br>
                                            RM<?php echo number_format((float)$totalClaim, 2, '.', ''); ?><br><hr>
                                            <b>RM<?php echo number_format((float)$totalDept, 2, '.', ''); ?></b>
                                        </td>
                                    </tr>
                                <?php endforeach ?>
                            </tbody>
                            <tfoot>
                                <td colspan="3" class="text-right bg-light py-3"><b>Total Claim All : </b></td>
                                <td colspan="2" class="text-center bg-light"><b>RM<?php echo number_format((float)$sum, 2, '.', ''); ?></b></td>
                            </tfoot>
                        </table><br><br>

                        <table class="table-bordered" width="100%">
                            <h5>Claim Summary for <?php echo date("F Y",mktime(0,0,0, $rsOt['month'],1,$rsOt['year'])) ?></h5><br>
                            <thead>
                                <th class="bg-light"></th>
                                <th colspan="2" class="text-center bg-light py-3">OT Applied (Hours)</th>
                                <th colspan="2" class="text-center bg-light py-3">OT Approved (Hours)</th>
                            </thead>
                            <tbody>
                                <tr>
                                    <td class="text-center py-3">Total OT</td>
                                    <td colspan="2" class="text-center"><input type="hidden" value="<?php echo $ot['totalHoursAppliedTotal']; ?>" id="totalOT"><?php echo $ot['totalHoursAppliedTotal']; ?></td>
                                    <td colspan="2" class="text-center"><input type="hidden" value="<?php echo $ot['totalHoursApproved']; ?>" id="totalApprovedOT"><?php echo $ot['totalHoursApproved']; ?></td>
                                </tr>
                                <tr>
                                    <td class="bg-light py-2"><b></b></td>
                                    <td class="text-center bg-light py-3"><b>Total Hours Approved</b></td>
                                    <td class="text-center bg-light"><b>Calculation</b></td>
                                    <td class="text-center bg-light" colspan="2"><b>Total</b></td>
                                </tr>
                            </tbody>
                            <tfoot>
                                <?php 
                                    if(!empty($ot['otID'])){ $ot['otID']             = $ot['otID']; } else { $ot['otID'] = 0; };
                                    if(!empty($ot['NormalMeal'])){ $ot['NormalMeal'] = $ot['NormalMeal']; } else { $ot['NormalMeal'] = 0; };
                                    if(!empty($ot['RestMeal'])){ $ot['RestMeal']     = $ot['RestMeal']; } else { $ot['RestMeal'] = 0; };
                                    if(!empty($ot['PublicMeal'])){ $ot['PublicMeal'] = $ot['PublicMeal']; } else { $ot['PublicMeal'] = 0; };

                                    if(!empty($ot['normal'])){ $ot['normal']     = $ot['normal']; } else { $ot['normal'] = 0; };
                                    if(!empty($ot['rest'])){ $ot['rest']         = $ot['rest']; } else { $ot['rest'] = 0; };
                                    if(!empty($ot['public'])){ $ot['public']     = $ot['public']; } else { $ot['public'] = 0; };
                                    if(!empty($ot['weekend'])){ $ot['weekend']   = $ot['weekend']; } else { $ot['weekend'] = 0; };
                                    if(!empty($ot['weekdays'])){ $ot['weekdays'] = $ot['weekdays']; } else { $ot['weekdays'] = 0; };
                                    if(!empty($ot['totalHoursAppliedTotal'])){ $ot['totalHoursAppliedTotal'] = $ot['totalHoursAppliedTotal']; } else { $ot['totalHoursAppliedTotal'] = 0; };
                                    if(!empty($ot['totalHoursApproved'])){ $ot['totalHoursApproved'] = $ot['totalHoursApproved']; } else { $ot['totalHoursApproved'] = 0; };
                                    if(!empty($ot['claim_status'])){ $ot['claim_status'] = $ot['claim_status']; } else { $ot['claim_status'] = 0; };
                        
                                    $weekendTotal2   = $ot['weekend']*7;
                                    $weekdaysTotal2  = $ot['weekdays']*7;
                                    $total2          = $weekendTotal2+$weekdaysTotal2; 

                                    $convertALHour      = intval($ot['totalHoursApproved']/8)*8;
                                    $convertALHourValue = $convertALHour*7;

                                    $total2Final        = $total2-$convertALHourValue;
                                ?>
                                <tr>
                                    <td class="text-center"> 
                                        Weekend 
                                    </td>
                                    <td class="text-center"><?php if($ot['weekend']){ echo $ot['weekend']; }else{ echo "0"; } ?></td>
                                    <td class="text-center"><?php echo $ot['weekend'].' x RM7 '; ?><br><small>(Actual Overtime x RM7.00)</small></td>
                                    <td class="text-center" colspan="2"><b>RM<?php echo number_format((float)$weekendTotal2, 2, '.', ''); ?></b></td>
                                </tr>
                                <tr>
                                    <td class="text-center"> 
                                        Weekdays
                                    </td>
                                    <td class="text-center"><?php if($ot['weekdays']){ echo $ot['weekdays']; }else{ echo "0"; } ?></td>
                                    <td class="text-center"><?php echo $ot['weekdays'].' x RM7 '; ?><br><small>(Actual Overtime x RM7.00 )</small></td>
                                    <td class="text-center" colspan="2"><b>RM<?php echo number_format((float)$weekdaysTotal2, 2, '.', ''); ?></b></td>
                                </tr>
                                <tr>
                                    <td colspan="3" class="text-right bg-light py-3"><b>Total Claim :</b></td>
                                    <td class="text-center bg-light" colspan="2"><input type="hidden" name="total2" id="total2" value="<?php echo number_format((float)$total2, 2, '.', ''); ?>"><b>RM<?php echo number_format((float)$total2, 2, '.', ''); ?></b></td>
                                </tr>
                                
                                <?php if($basicSalary->basic_pay > 2000){ ?>
                                    <?php if($ot['claim_status']==0){ ?>
                                        <?php if($ot['totalHoursApproved'] >= 8){ ?> 
                                            <tr>
                                                <td class="text-center"><span class="text-danger">* </span>Convert to AL<br><small>(Completion of 8 hours)</small></td>
                                                <td colspan="3"><input type="text" value="<?php echo $convertALHour; ?>" id="totalConvertAL" class="form-control text-center" onchange="calculateALValue()"></td>
                                                <td class="text-center" colspan="2"><input type="hidden" class="form-control text-center" name="ALValue" id="ALValue" value="<?php echo number_format((float)$convertALHourValue, 2, '.', ''); ?>"><b id="total2echo"><?php echo "(RM". number_format((float)$convertALHourValue, 2, '.', '').")" ?></b>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td colspan="3" class="text-right bg-light py-3"><b>Final Total Claim :</b></td>
                                                <td class="text-center bg-light" colspan="2"><input type="hidden" class="form-control text-center" name="total2Final" id="total2Final" value="<?php echo number_format((float)$total2Final, 2, '.', ''); ?>"><b id="ALValueEcho"><?php echo "RM".number_format((float)$total2Final, 2, '.', '').""; ?></b></td>
                                            </tr>
                                        <?php } else { ?>
                                            <tr>
                                                <td class="text-center"><span class="text-danger">* </span>Convert to AL<br><small>(Completion of 8 hours)</small></td>
                                                <td colspan="3"><input type="text" value="0" id="totalConvertAL" class="form-control text-center" disabled></td>
                                                <td class="text-center"><input type="hidden" class="form-control text-center" name="ALValue" id="ALValue" value="<?php echo number_format((float)$convertALHourValue, 2, '.', ''); ?>"><b id="total2echo"><?php echo "(RM". number_format((float)$convertALHourValue, 2, '.', '').")" ?></b>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td colspan="4" class="text-right bg-light py-3"><b>Final Total Claim :</b></td>
                                                <td class="text-center bg-light"><input type="hidden" class="form-control text-center" name="total2Final" id="total2Final" value="<?php echo number_format((float)$total2Final, 2, '.', ''); ?>"><b id="ALValueEcho"><?php echo "RM".number_format((float)$total2Final, 2, '.', '').""; ?></b></td>
                                            </tr>
                                        <?php } ?>
                                    <?php } else { ?>
                                        <tr>
                                            <td class="text-center"><span class="text-danger">* </span>Convert to AL<br><small>(Completion of 8 hours)</small></td>
                                            <td colspan="3"><input type="text" value="<?php echo $ot['totalConvertToLeave']; ?>" id="totalConvertAL" class="form-control text-center" disabled></td>
                                            <td class="text-center"><input type="hidden" class="form-control text-center" name="ALValue" id="ALValue" value="<?php echo number_format((float)$ot['totalConvertToLeave']*10, 2, '.', ''); ?>"><b id="total2echo"><?php echo "(RM". number_format((float)$ot['totalConvertToLeave']*10, 2, '.', '').")" ?></b>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td colspan="4" class="text-right bg-light py-3"><b>Final Total Claim :</b></td>
                                            <td class="text-center bg-light"><input type="hidden" class="form-control text-center" name="total2Final" id="total2Final" value="<?php echo number_format((float)$ot['totalClaim'], 2, '.', ''); ?>"><b id="ALValueEcho"><?php echo "RM".number_format((float)$ot['totalClaim'], 2, '.', '').""; ?></b></td>
                                        </tr>
                                    <?php } ?>
                                <?php }else{ ?>

                                <?php } ?>
                            </tfoot>
                        </table>

                    </div>

                    <div class="d-print-none">
                        <?php if($ot['claim_status'] == 0 && (date('d') <= 7 || date('d') >= 15)){ ?> <!-- claim not submitted / open period-->
                            <?php if (!empty($otPendingDetails)) { ?> <!-- claim not submitted / details still pending-->
                                <button class="btn btn-success text-white btn-lg btn-block" id="submit_ot" style="width: 100%;" disabled title="Your OT Details still got pending.">Submit OT Claim</button>
                            <?php } else if($basicSalary->basic_pay <= 2000){ ?>
                                <button class="btn btn-success text-white btn-lg btn-block" id="submit_ot" style="width: 100%;" onclick="submitOTClaim(<?php echo $ot['otID']; ?>)">Submit OT Claim</button>
                            <?php } else {?>
                                <button class="btn btn-success text-white btn-lg btn-block" id="submit_ot" style="width: 100%;" onclick="submitOTClaim2(<?php echo $ot['otID']; ?>)">Submit OT Claim</button>
                            <?php } ?>
                        <?php } else if($ot['claim_status'] == 0 && (date('d') > 7 || date('d') < 15)){ ?> <!-- claim not submitted / closed period -->  
                            <button class="btn btn-success text-white btn-lg btn-block" id="submit_ot" style="width: 100%;" disabled>Submit OT Claim</button>
                        <?php } else if($ot['claim_status'] == 1 && (date('d') <= 7 || date('d') >= 15)){ ?> <!-- claim submitted / open period -->  
                            <button class="btn btn-success text-white btn-lg btn-block" id="submit_ot" style="width: 100%;" disabled>Claim Submitted</button>
                        <?php } else if($ot['claim_status'] == 1 && (date('d') > 7 || date('d') < 15)){ ?> <!-- claim submitted /closed period -->
                            <button class="btn btn-success text-white btn-lg btn-block" id="submit_ot" style="width: 100%;" disabled>Claim Submitted</button>
                        <?php } else { ?> <!-- others -->
                            <button class="btn btn-success text-white btn-lg btn-block" id="submit_ot" style="width: 100%;" disabled>Claim Submitted</button>
                        <?php }?>
                        <span class="text-danger float-right" style="margin-right: 20px;"> *Submit OT Claim will be disabled every 8th-15th every month.</span>
                    </div><br>

                </div>
            </div>
        </div>      
    </div>
</div>

<script>

    $('.datepicker').datepicker({
        uiLibrary: 'bootstrap4',
        autoclose: true,
        orientation: 'bottom',
        format: "mm-yyyy",
        viewMode: "months", 
        minViewMode: "months"
    });

    function calculateALValue() {
        var convertAL = $('#totalConvertAL').val();
        var total2    = $('#total2').val();

        if(convertAL % 8 > 0){
            alert("Your AL conversion hour is NOT VALID. Please insert hours in multiples of 8.");
            location.reload();
        } else {
            var ALValue     = convertAL*10;
            var total2Final = total2-ALValue;

            $('#ALValue').val(ALValue);
            $('#total2echo').html('(RM'+ALValue.toFixed(2)+')');
            $('#total2Final').val(total2Final);
            $('#ALValueEcho').html('RM'+total2Final.toFixed(2));
            
        }
        
    }

    function submitOTClaim(otID) {

        validateForm("#submit_ot", "Submit this OT Claim?", function() {
            
            var postData = {
                'otID'        : otID,
                'totalClaim'  : $('#total2').val()
            }

            $.ajax({
                type: "POST",
                dataType: "json",
                url: "<?php echo base_url(); ?>hr/Overtime/submitOTClaim",
                data: postData,
                success: function(data) {
                    if ($.trim(data.status) == "success") 
                    {
                        localStorage.setItem("status", data.status);
                        localStorage.setItem("msg", data.msg);

                        location.reload();
                    }
                }
            });
        });
    }

    function submitOTClaim2(otID) {

        validateForm("#submit_ot", "Submit this OT Claim?", function() {

            var postData = {
                'otID'                : otID,
                'totalConvertToLeave' : $('#totalConvertAL').val(),
                'totalClaim'          : $('#total2Final').val()
            }

            $.ajax({
                type: "POST",
                dataType: "json",
                url: "<?php echo base_url(); ?>hr/Overtime/submitOTClaim",
                data: postData,
                success: function(data) {
                    if ($.trim(data.status) == "success") 
                    {
                        localStorage.setItem("status", data.status);
                        localStorage.setItem("msg", data.msg);

                        location.reload();
                    }
                }
            });
        });
    }

    function printMyOTClaim(){

        var otID = $('#otID').attr('otID');

        window.open("<?php echo base_url().'hr/Overtime_report/printMyOTClaim/'?>" + otID , "_blank");
    }


</script> 