koperasi/script/lap/rekapitulasitest.js

const App = document.getElementById('app');
const jurubayar = _id('jurubayar').innerHTML.toJson();
const golongan = _id('golongan').innerHTML.toJson();

let jubar = _id('jubar');
jubar.style.marginBottom = '10px';
jubar.innerHTML = `<option value="all">All</option>` + jurubayar.map(function (s) {
    return `<option value="${s.kode}">${s.name}</option>`
}).join('');
setTimeout(function () {
    $("#jubar").select2();
})
let year = Number(tanggal().normal.split('-')[0])

let statusData = '01';

Array.from(document.querySelectorAll('input[name="gol"]'))
.forEach(function(s){
    s.addEventListener('click', function(){
        let val = this.value;
        statusData = val;
        let dataR = [].concat(jurubayar);
        
        if(val == "02"){
            dataR = [].concat(golongan);
        }
        dataR = dataR.map(function (s) {
            if (val == "02"){
                return {
                    id:s.kode,
                    text: s.nama
                }
            }
            return {
                id: s.kode,
                text: s.name
            } 
        });
        setTimeout(function () {
            $("#jubar").empty().select2({
                data: [{id:'all', text:'All'}, ...dataR]
            });
        })
    },false)
})

_id('next').addEventListener('click', function () {
    year++;
    if (typeof makeTable != 'undefined') {
        makeTable();
    }
}, false);

_id('prev').addEventListener('click', function () {
    year--;
    if (typeof makeTable != 'undefined') {
        makeTable();
    }
}, false);

const actionPrint = function (e) {
    e = e.el;
    if (
        e.querySelector('button') != undefined
        || e.querySelector('button') != null
    ) {
        let btn = e.querySelector('button.btn-primary')
        btn.onclick = function () {
            var url = '{{PATH}}/admin/api/export/excel/rekapitulasi/' + year + '/' + this.dataset.kode + '/' + btoa(_id('jubar').value) + '/' + statusData;
            location.href = url;
        }
    }
}

const NamaBulan = [
    "Januari",
    "Februari",
    "Maret",
    "April",
    "Mei",
    "Juni",
    "Juli",
    "Agustus",
    "September",
    "Oktober",
    "November",
    "Desember"
]

const addRow = function (arr, i) {
    let tr = el('tr').data('kode', i);
    if (Array.isArray(arr)) {
        arr.forEach(function (w) {
            let y = el('td').html(w);
            tr.child(
                y
            );
        });
    };
    tr.load(actionPrint);
    return tr;
}

const makeTable = function (callback) {
    let x = el('div').class('card');
    let tbl = el('table').class('table')
    let ArrayData = [];
    ArrayData.push(['Tahun', 'Bulan', '#'])
    let bulan = 12;
    for (let bln = 0; bln < bulan; bln++) {
        ArrayData.push([
            year
            , NamaBulan[bln]
            , `
                <button data-kode="${(bln + 1).pad(2)}" class="btn btn-sm btn-primary">Print Rekapitulasi Anggota</button>
            `
        ]);
    }
    ArrayData.forEach(function (o, i) {
        tbl.child(
            addRow(o, i)
        );
    });
    x.child(
        el('div').class('card-body')
            .child(
                tbl
            )
    );
    App.innerHTML = '';
    App.appendChild(x.get());
};

makeTable();