<link href="<?php echo THEME_PATH; ?>css/style.css" rel="stylesheet" type="text/css" />
<link href="<?php echo THEME_PATH; ?>css/style-responsive.css" rel="stylesheet">


<script>
    // to remove many digits after the period
    $(function() {
        $(".ValSpan").each(function() {
            $(this).html(AddCommas(parseFloat($.trim($(this).text())).toFixed(2))).animate({
                opacity: 1
            })
        })
    })
</script>
<style>
    .table thead tr>th {
        background-color: #4c0870;
        color: #fff;
    }

    .table thead tr th[class*='sorting_'] {
        color: #FFFFFF;
    }

    .bg-master-lighter {
        border: none;
        background-color: #fff;
        border-top: 1px solid #ddd;

    }
</style>

<div class="container-fluid container-fixed-lg bg-white">
    <div class="panel panel-transparent">
        <div class="panel-heading">
            <div class="panel-title"> <?php print CommonLanguage::getMessage('payslip_details'); ?></div>
            <div class="clearfix"></div>
        </div>
        <div class="panel-body">
            <table class="table table-bordered table-hover demo-table-search" id="PaySlipDetails">
                <thead>
                    <tr>
                        <th class="text-center"><?php print CommonLanguage::getMessage('employee_name'); ?></th>
                        <th class="text-center"><?php print CommonLanguage::getMessage('department'); ?></th>
                        <th class="text-center"><?php print CommonLanguage::getMessage('position'); ?></th>
                        <th class="text-center"><?php print CommonLanguage::getMessage('amount'); ?></th>
                        <th class="text-center"><?php print CommonLanguage::getMessage('date'); ?></th>
                        <th class="text-center"><?php print CommonLanguage::getMessage('action'); ?></th>

                    </tr>
                </thead>
                <tbody>
                    <?php
                    for ($x = 0; $x < count($Total_Details); $x++) {
                        $CurItem = $Total_Details[$x];

                    ?>
                        <tr>
                            <td class="text-center"><?php echo $CurItem['Employee_Name'] ?></td>
                            <td class="text-center"><?php echo $CurItem['Branch_Name'] ?></td>
                            <td class="text-center"><?php echo $CurItem['Job_Name'] ?></td>
                            <td class="text-center"><span class=""><?php echo CommonFunctions::formatNumber($CurItem['Amount_Paid']) ?></span> <?php echo $CurItem['Currency_Symbol'] ?></td>
                            <td class="text-center"><?php echo $CurItem['Payroll_Date'] ?></td>
                            <td class=" dt-center">
                                <div class="btn-group m-b-sm Action " data-id="<?php echo $CurItem['Payroll_ID'] ?>">
                                    <button type="button" class="btn bg-success dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                                        <?php print CommonLanguage::getMessage('action'); ?><span class="caret"></span>
                                    </button>
                                    <ul class="dropdown-menu" role="menu">
                                        <li hidden> <a title="Print" id="printBtn" class="print_emp">
                                                <i class="fa fa-print" type="button"></i> <?php print CommonLanguage::getMessage('print'); ?>
                                            </a>
                                        </li>
                                        <li> <a title="Delete" class="Delete">
                                                <i class="fa fa-trash" type="button"></i> <?php print CommonLanguage::getMessage('delete'); ?>
                                            </a></li>


                                    </ul>
                                </div>
                            </td>
                        </tr>
                    <?php } ?>
                </tbody>
            </table>

            <br />
            <br />

            <div class="modal fade bs-example-modal-md" id="DeleteFromList" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
                <div class="modal-dialog" style="width:50%">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                            <h4 class="modal-title"><?php print CommonLanguage::getMessage('Confirm_Delete'); ?></h4>
                            <div id="DeleteEmployee_modalAlert"></div>
                        </div>
                        <div class="modal-body">
                            <form>
                                <div class="row">
                                    <div class="col-md-12 ">
                                        <div class="col-md-12" style="margin-top: 20px;">
                                            <p><?php print CommonLanguage::getMessage('delete_payroll'); ?> <strong class="Name"></strong> <?php print CommonLanguage::getMessage('delete_pay_hint'); ?> </p>
                                            <p><?php print CommonLanguage::getMessage('Proceed_Delete'); ?></p>
                                        </div>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal"><?php print CommonLanguage::getMessage('Close'); ?></button>
                            <button type="button" class="btn btn-danger" id="Employee_Delete" style="width:auto"><?php print CommonLanguage::getMessage('delete'); ?></button>
                        </div>
                    </div>
                </div>
            </div>

            <div class="row no-print">
                <div class="col-md-12">
                    <div class="pull-right">
                        <a class="btn btn-danger" onclick="javascript:window.print();"><i class="fa fa-print"></i> <?php print CommonLanguage::getMessage('print'); ?></a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    $(function() {
        var Submitted_Successfully = <?php echo json_encode(CommonLanguage::getMessage('Submitted_Successfully')); ?>,
            Failed_Submit = <?php echo json_encode(CommonLanguage::getMessage('Failed_Submit')); ?>,
            title = <?php echo json_encode(CommonLanguage::getMessage('employees')); ?>;
        var CuurentEmployee_ToDelete;
        $('#PaySlipDetails').dataTable();
        $("#PaySlipDetails").on("click", ".Action .Delete", function() {
            var EmployeeName = $(this).parents("tr").find("td:eq(0)").text();
            $("#DeleteFromList").find(".Name").text(EmployeeName).end().modal("show"); // to set the name of employee in modal to delete 
            CuurentEmployee_ToDelete = $(this).parents("tr").find('.Action').attr('data-id'); // current id to delete
        });
        $("#PaySlipDetails").on("click", ".print_emp", function() {
            var myurl = "HRM/print_payroll_payroll?pay_id=" + $(this).parents("tr").find('.Action').attr('data-id');

            printExternal(myurl);
        });
        $("#Employee_Delete").on("click", function() {
             $.ajax({
                type: 'POST',
                url: 'HRMAjax/delete_payrool_employee',
                data: {
                    GetID: CuurentEmployee_ToDelete
                },
                complete: function(data, vv) {
                    if (vv == "success" && data.responseText == "OK") {
                        $("#DeleteEmployee_modalAlert").attr("class", "alert alert-success").html(Submitted_Successfully);
                        location.reload();
                    } else {
                        $("#DeleteEmployee_modalAlert").attr("class", "alert alert-danger").html(Failed_Submit);
                    }
                }
            });
        });

        $('#PaySlipDetails').dataTable();


    })
</script>