{literal}
<style>
    table.dataTable {
        width: 100% !important;
        white-space: nowrap;
    }

    .dataTables_scrollBody {
        overflow-x: auto !important;
    }

    .table-scrollable {
        overflow-x: auto;
    }
</style>
{/literal}
<div class="row">
    <div class="container">
        <ol class="breadcrumb">
            <li><a href="#">اداره الموظفين</a></li>
            <li class="active">تقرير الموظفين </li>
        </ol>
        <div class="panel panel-default">
            <!-- Default panel contents -->
            <div class="panel-heading">
                <h3 class="panel-title">تقرير الموظفين</h3>
                <a href="{$youtubes[173]->url}" target="_blank" class="hidden-print"><img
                        src="../views/default/assets/img/youtube.png" class="pull-left" alt="Youtube"
                        style="width: 2%;"></a>
            </div>
            <div class="panel-body">



                <form class="form-inline hidden-print" method="post" action="employeereport.php?do=totals">
                    <div class="form-group">
                        <label class="sr-only"> مجموعة الموظفين</label>
                        <select class="select2 select2me" name="empGroup">
                            <option value=""></option>
                            {foreach $employeeGroup as $data}
                            <option value="{$data.id}" {if $empGroup==$data.id} selected {/if}>{$data.name}</option>
                            {/foreach}
                        </select>
                    </div>
                    <div class="form-group">
                        <label class="sr-only"> الفروع</label>
                        <select class="select2 select2me" name="branchId">
                            <option value=""></option>
                            {foreach $allbranchdata as $data}
                            <option value="{$data.branchId}" {if $branchId==$data.branchId} selected {/if}>
                                {$data.branchName}</option>
                            {/foreach}
                        </select>
                    </div>

                    <div class="form-group">
                        <label class="sr-only"> شهر</label>
                        <div class="datepicker"><input type="text" name="month" value="{if !empty($month)}{$month}{/if}"
                                class="form-control awdatepicker" autocomplete="off" data-date-format="yyyy-mm">
                        </div>
                    </div>

                    <br />
                    <div class="form-group">
                        <label class="sr-only">من التاريخ</label>
                        <input type="text" class="form-control awdatepicker" autocomplete="off"
                            data-date-format="yyyy-mm-dd" name="from" value="{$from}">
                    </div>
                    <div class="form-group">
                        <label class="sr-only">إلى التاريخ</label>
                        <input type="text" class="form-control awdatepicker" autocomplete="off"
                            data-date-format="yyyy-mm-dd" name="to" value="{$to}">
                    </div>
                    <button type="submit" class="btn btn-primary">بحث</button>
                </form>
                <hr />
            </div>
            <div class="container">
                <table class="table table-black dataTableClassEmp">
                    <thead>
                        <tr>
                            <th>#</th>
                            <th>اسم الموظف</th>
                            <th>عدد الغياب</th>
                            <th>قيمة الغياب</th>
                            <th>عدد الاستئذان</th>
                            <th>قيمة الاستئذان</th>
                            <th>عدد الانصراف</th>
                            <th>قيمة الانصراف</th>
                            <th>عدد التأخير</th>
                            <th>قيمة التأخير</th>
                            <th>عدد الخصومات</th>
                            <th>قيمة الخصومات</th>
                            <th>عدد السحب</th>
                            <th>قيمة السحب</th>
                            <th>عدد السلف</th>
                            <th>قيمة السلف</th>
                            <th>عدد المكافآت</th>
                            <th>قيمة المكافآت</th>
                            <th>عدد الإضافي</th>
                            <th>قيمة الإضافي</th>
                            <th>اصل الراتب</th>
                            <th>تاريح اخر قبض</th>
                            <th>اخر قبض</th>
                        </tr>
                    </thead>
                    <tbody>
                        {assign var=i value=1}
                        {assign var=totalAbsenceCounter value=0}
                        {assign var=totalAbsence value=0}
                        {assign var=totalPermissionCounter value=0}
                        {assign var=totalPermission value=0}
                        {assign var=totalLeaveCounter value=0}
                        {assign var=totalLeave value=0}
                        {assign var=totalDelayCounter value=0}
                        {assign var=totalDelay value=0}
                        {assign var=totalDisCounter value=0}
                        {assign var=totalDis value=0}
                        {assign var=totalWithdrawCounter value=0}
                        {assign var=totalWithdraw value=0}
                        {assign var=totalBorrowCounter value=0}
                        {assign var=totalBorrow value=0}
                        {assign var=totalRewardCounter value=0}
                        {assign var=totalReward value=0}
                        {assign var=totalBonusCounter value=0}
                        {assign var=totalBonus value=0}
                        {assign var=totalSalary value=0}

                        {foreach $empArr as $emp}
                        <tr>
                            <td>{$i}</td>
                            <td>{$emp.name}</td>
                            <td>{$emp.absenceCounter}</td>
                            <td>{$emp.absence}</td>
                            <td>{$emp.permissionCounter}</td>
                            <td>{$emp.permission}</td>
                            <td>{$emp.leaveCounter}</td>
                            <td>{$emp.leave}</td>
                            <td>{$emp.delayCounter}</td>
                            <td>{$emp.delay}</td>
                            <td>{$emp.disCounter}</td>
                            <td>{$emp.dis}</td>
                            <td>{$emp.withdrawCounter}</td>
                            <td>{$emp.withdraw}</td>
                            <td>{$emp.borrowCounter}</td>
                            <td>{$emp.borrow}</td>
                            <td>{$emp.rewardCounter}</td>
                            <td>{$emp.reward}</td>
                            <td>{$emp.bonusCounter}</td>
                            <td>{$emp.bonus}</td>
                            <td>{$emp.salary}</td>
                            <td>{$emp.lastSalaryDate}</td>
                            <td>{$emp.lastSalary}</td>
                        </tr>
                        {assign var=i value=$i+1}
                        
                        {assign var=totalAbsenceCounter value=$totalAbsenceCounter+$emp.absenceCounter}
                        {assign var=totalAbsence value=$totalAbsence+$emp.absence}
                        {assign var=totalPermissionCounter value=$totalPermissionCounter+$emp.permissionCounter}
                        {assign var=totalPermission value=$totalPermission+$emp.permission}
                        {assign var=totalLeaveCounter value=$totalLeaveCounter+$emp.leaveCounter}
                        {assign var=totalLeave value=$totalLeave+$emp.leave}
                        {assign var=totalDelayCounter value=$totalDelayCounter+$emp.delayCounter}
                        {assign var=totalDelay value=$totalDelay+$emp.delay}
                        {assign var=totalDisCounter value=$totalDisCounter+$emp.disCounter}
                        {assign var=totalDis value=$totalDis+$emp.dis}
                        {assign var=totalWithdrawCounter value=$totalWithdrawCounter+$emp.withdrawCounter}
                        {assign var=totalWithdraw value=$totalWithdraw+$emp.withdraw}
                        {assign var=totalBorrowCounter value=$totalBorrowCounter+$emp.borrowCounter}
                        {assign var=totalBorrow value=$totalBorrow+$emp.borrow}
                        {assign var=totalRewardCounter value=$totalRewardCounter+$emp.rewardCounter}
                        {assign var=totalReward value=$totalReward+$emp.reward}
                        {assign var=totalBonusCounter value=$totalBonusCounter+$emp.bonusCounter}
                        {assign var=totalBonus value=$totalBonus+$emp.bonus}
                        {assign var=totalSalary value=$totalSalary+$emp.salary}
                        
                        {/foreach}
                    </tbody>
                    <tfoot>
                        <tr>
                            <th></th>
                            <th>الإجمالي</th>
                            <th>{$totalAbsenceCounter}</th>
                            <th>{$totalAbsence}</th>
                            <th>{$totalPermissionCounter}</th>
                            <th>{$totalPermission}</th>
                            <th>{$totalLeaveCounter}</th>
                            <th>{$totalLeave}</th>
                            <th>{$totalDelayCounter}</th>
                            <th>{$totalDelay}</th>
                            <th>{$totalDisCounter}</th>
                            <th>{$totalDis}</th>
                            <th>{$totalWithdrawCounter}</th>
                            <th>{$totalWithdraw}</th>
                            <th>{$totalBorrowCounter}</th>
                            <th>{$totalBorrow}</th>
                            <th>{$totalRewardCounter}</th>
                            <th>{$totalReward}</th>
                            <th>{$totalBonusCounter}</th>
                            <th>{$totalBonus}</th>
                            <th>{$totalSalary}</th>
                            <th></th>
                            <th></th>
                        </tr>
                    </tfoot>
                </table>
            </div>
        </div>
    </div>

{literal}
<script>
    $(document).ready(function () {
        $('.dataTableClassEmp').dataTable({
            scrollX: true,
            autoWidth: false,
            dom: 'Bfrtip',
            "bStateSave": true,
            "lengthMenu" : [[100, 200, 300, 400, 500, -1],[100, 200, 300, 400, 500, "All"] ],
                "language": {
                "emptyTable": "لا يوجد بيانات متاحه",
                "infoEmpty": "لا يوجد بيانات متاحه",
                "infoFiltered": "(filtered1 from _MAX_ total records)",
                "lengthMenu": "العدد _MENU_",
                "search": "بحث:",
                "zeroRecords": "No matching records found",
                "paginate": {
                    "previous": "السابق",
                    "next": "التالى",
                    "last": "الاخير",
                    "first": "الاول"
                }
            },
            buttons: [
                {
                    extend: 'copyHtml5',
                    exportOptions: {
                        columns: ':visible'
                    }
                },
                {
                    extend: 'csvHtml5',
                    exportOptions: {
                        columns: ':visible'
                    }
                },
                {
                    extend: 'print',
                    exportOptions: {
                        columns: ':visible'
                    }
                },
                {
                    extend: 'excelHtml5',
                    exportOptions: {
                        columns: ':visible'
                    }
                },
                {
                    extend: 'pdfHtml5',
                    exportOptions: {
                        columns: ':visible'
                    }
                },
                'colvis'
            ],
            "dom": "<'row' <'col-md-12'B>><'row'<'col-md-6 col-sm-12'l><'col-md-6 col-sm-12'f>r><'table-scrollable't><'row'<'col-md-5 col-sm-12'i><'col-md-7 col-sm-12'p>>" ,
            "order": [[0, "desc"]],
            "displayLength": 10,
            "columnDefs": [
                {"className": "dt-center", "targets": "_all"}
            ],
        });
        $('.dataTableClassEmp td').css("height", "30px");
    });
</script>
{/literal}