<script type="text/javascript">
    $(document).ready(function() {
        $(".download").click(function() {

            var jenis = $(this).attr('id');
            var cabang = "<?= $cabang ?>";
            var karyawan = "<?= $karyawan ?>";
            var departemen = "<?= $departemen ?>";
            var tanggal_mulai = "<?= $mulai ?>";
            var tanggal_selesai = "<?= $selesai ?>";

            window.location.href = "<?= site_url('absensi/data/download/') ?>" + tanggal_mulai + '/' + tanggal_selesai + '/' + karyawan + '/' + cabang + '/' + departemen + '/' + jenis;
        });
    });
</script>
<div class="btn-group mb-1 pull-right">
    <div class="btn-group mb-1 pull-right">
        <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
            Download
        </button>
        <div class="dropdown-menu">
            <a id="excel" class="dropdown-item download"><i class="fa fa-file-excel-o"></i> Excel</a>
            <a id="pdf" class="dropdown-item download"><i class="fa fa-file-pdf-o"></i> PDF</a>
        </div>
    </div>
</div>
<div class="table-responsive">
    <table id="list_data" class="table table-striped" style="width:100%">
        <thead>
            <tr>
                <th class="text-center no-sort" rowspan="2">NO</th>
                <th class="text-center no-sort" rowspan="2">TANGGAL</th>
                <th class="text-center no-sort" rowspan="2">NAMA</th>
                <th class="text-center no-sort">CABANG</th>
                <th class="text-center no-sort" rowspan="2">KODE</th>
                <th class="text-center no-sort" rowspan="2">ABSENSI MASUK</th>
                <th class="text-center no-sort" rowspan="2">ABSENSI PULANG</th>
                <th class="text-center no-sort" rowspan="2">ISTIRAHAT MULAI</th>
                <th class="text-center no-sort" rowspan="2">ISTIRAHAT SELESAI</th>
                <?php if ($usergroup == 1) { ?>
                    <th class="text-center no-sort" rowspan="2">AKSI</th>
                <?php } ?>
            </tr>
            <tr>
                <th class="text-center no-sort">DEPARTEMEN</th>
            </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
</div>
<script type="text/javascript">
    $(function() {
        table = $('#list_data').DataTable({
            'searching': false,
            'paging': true,
            'lengthChange': true,
            'ordering': true,
            'info': true,
            'scrollX': true,
            'language': {
                'url': '<?= base_url("assets/plugins/datatables/dataTables-language-id.json") ?>',
                'sEmptyTable': 'Tidak ada data untuk ditampilkan'
            },
            "processing": true,
            "serverSide": true,
            "order": [],

            "ajax": {
                "url": "<?= site_url('absensi/list/data') ?>/<?= $mulai ?>/<?= $selesai ?>/<?= $karyawan ?>/<?= $cabang ?>/<?= $departemen ?>",
                "type": "POST",
            },
            "aoColumnDefs": [{
                'bSortable': false,
                'aTargets': ['no-sort']
            }],
            "fnRowCallback": function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
                $('td:eq(0)', nRow).css({'width': '10px','text-align': 'center','vertical-align':'top'});
                $('td:eq(1)', nRow).css({'width': '100px','text-align': 'center','vertical-align':'top'});
                $('td:eq(2)', nRow).css({'text-align': 'left','vertical-align':'top'});
                $('td:eq(3)', nRow).css({'width': '200px','text-align': 'left','vertical-align':'top'});
                $('td:eq(4)', nRow).css({'width': '120px','text-align': 'center','vertical-align':'top'});
                $('td:eq(5)', nRow).css({'width': '120px','text-align': 'center','vertical-align':'top'});
                $('td:eq(6)', nRow).css({'width': '120px','text-align': 'center','vertical-align':'top'});
                $('td:eq(7)', nRow).css({'width': '120px','text-align': 'center','vertical-align':'top'});
                $('td:eq(8)', nRow).css({'width': '120px','text-align': 'center','vertical-align':'top'});
                <?php if ($usergroup == 1) { ?>
                    $('td:eq(-1)', nRow).css({'width': '10px','text-align': 'center'});
                <?php } ?>
            },
        });
    });
</script>