kejarid

d.sort(function(a, b) {
    var dateA = new Date(a.invoice_date.slice(0, -17)),
        dateB = new Date(b.invoice_date.slice(0, -17))
    return dateA - dateB
});

//optional array to object
var object = Object.assign({}, data);


var object = ['apel', 'mangga', 'jeruk']

const allowed = ['mangga'];

var filtered = Object.keys(object)
.filter(key => allowed.includes(key))
.reduce((obj, key) => {
    obj[key] = object[key];
    return obj;
}, {});
data = filtered;

<x-icon classicon="fill-grey-6" type="home" />

$filterStudents = $search !== null ? [
    'filter[entry_year]' => $entry_year,
    'filter[search]' => $search,
    'relation[student_group]' => 1,
    'page' => (int)$page,
    'per_page' => 20,
] : [
    'filter[entry_year]' => $entry_year,
    'relation[student_group]' => 1,
    'page' => (int)$page,
    'per_page' => 20,
];

$totalPayment = collect($billingData['payment_not_distirbute'])->sum('balance');

async function renderAllStudent(params) {
    const promisesEach = arrStudentGroup.map((d) =>  getStudents(d.id, true) );
}

if (meta && (meta['total'] >= 40)) {
                pagination += (`<nav class="navigation mt-5">
                    <div>
                        <span class="pagination-detail">${ meta.to } dari ${ meta.total } siswa</span>
                    </div>
                    <ul class="pagination">
                        <li class="page-item ${ (currentPage ?? 1) - 1 <= 0 ? 'disabled' : '' }">
                            <a class="page-link" onclick="(getStudents('${grade}','${status}','${ 1 }'))" tabindex="-1">&lt;</a>
                        </li>
                `)
                if (meta.last_page <= 5) {
                    page_first = 1;
                    page_last = meta.last_page;
                } else {
                    if (currentPage <= 3) {
                        page_first = 1;
                        page_last = 5;
                    } else if (currentPage >= meta.last_page - 2) {
                        page_first = meta.last_page - 4;
                        page_last = meta.last_page;
                    } else {
                        page_first = currentPage - 2;
                        page_last = currentPage + 2;
                    }
                    page_final = meta.last_page;
                }
                for (page_first; page_first <= page_last; page_first++) {
                    if (page_first == currentPage) {
                        pagination += (`
                        <li class="page-item active">
                            <a class="page-link" onclick="(getStudents('${grade}','${status}','${ page_first }'))">${ page_first }</a>
                        </li>`)
                    } else {
                        pagination += (`
                        <li class="page-item">
                            <a class="page-link" onclick="(getStudents('${grade}','${status}','${ page_first }'))">${ page_first }</a>
                        </li>`)
                    }
                }

                pagination += (`
                        <li class="page-item ${((currentPage ?? 1) + 1) > meta.last_page ? 'disabled' : '' }">
                            <a class="page-link" onclick="(getStudents('${grade}','${status}','${ meta.last_page }'))">&gt;</a>
                        </li>
                    </ul>
                </nav>
                `)
            }

$.ajax({
                url: ``,
                type: 'GET',
                dataType: 'json',
                data: {},
                beforeSend: function() {

                },
                error: function(error) {

                },
                success: function(response) {

                }
            });

<div>
                    <x-infobox typeInfoBox="danger" classInfoText="font-15 font-w400 mx-4" classInfoIcon="pt-0"
                    textInfoBox="Segera distribusikan pembayaran agar status tagihan siswa berubah." />
                </div>

const loading = `<td id="loading" colspan="7" class="bg-white-2">
            <div class="d-flex align-items-center">
                <div class="col-1">
                    <div class="snippet" data-title=".dot-flashing">
                        <div class="stage">
                            <div class="dot-flashing"></div>
                        </div>
                    </div>
                </div>
                <p class="grey-6 ml-6 pl-1">Memuat data pembayaran...</p>
            </div>
        </td>`

const loadingMobile = `
        <div id="loading-get-data" class="mt-2 alert alert-primary">
            <div class="d-flex align-items-center">
                <div class="spinner spinner-border spinner-border-sm text-primary" role="status">
                    <span class="sr-only">Loading...</span>
                </div>
                <h6 class="ml-2">Memuat tagihan...</h6>
            </div>
        </div>`

 const loading = `
    <div class="p-2 d-flex align-items-center bg-white-2 mt-2">
        <div class="col-1 mr-4">
            <div class="snippet" data-title=".dot-flashing">
                <div class="stage">
                    <div class="dot-flashing"></div>
                </div>
            </div>
        </div>
        <p class="grey-6">Memuat siswa butuh perhatian..</p>
    </div>`

$calendar = collect($calendar)->where('report_period_id', '!=', $dataCalendarDesc['report_period_id'])->toArray();

let mediaQuery = window.matchMedia("(min-width: 768px)");
if (mediaQuery.matches) {
                // destop
            } else {
                // mobile
            }

<form-basic class="search-no-decoration form-class">
                    <div class="input-group" id="search-input">
                        <span class="input-group-append">
                            <h2 class="border-right-0 border pl-3 border-radius-grey-13-left-top-bottom">
                                <x-icon classicon="fill-grey-3" type="search" />
                            </h2>
                        </span>
                        <input name="search" id="input-search" placeholder="Cari nama siswa..."
                            class="form-control py-2 border-left-0 border-right-0 border input-search border-radius-grey-13-right-top-bottom"
                            type="search">
                        <span class="input-group-append d-none" id="close-search">
                            <h2 class="border-left-0 border pr-3 border-radius-grey-13-right-top-bottom"
                                id="close-search">
                                <x-icon classicon="fill-grey-3" type="close" />
                            </h2>
                        </span>
                    </div>
                </form-basic>

const loading = `<div class="spinner spinner-border text-white" role="status">
                <span class="sr-only">Loading...</span>
            </div> Loading`

beforeSend: function () {
    $("#btn-submit").html(loading);
    $("#btn-submit").attr('disabled', true);
},
success: function (response) {
  $("#btn-submit").removeAttr('disabled');
  $("#btn-submit").html("Proses");
}

//Feature Input select2
(function ($) {

    var Defaults = $.fn.select2.amd.require('select2/defaults');

    $.extend(Defaults.defaults, {
        searchInputPlaceholder: ''
    });

    var SearchDropdown = $.fn.select2.amd.require('select2/dropdown/search');

    var _renderSearchDropdown = SearchDropdown.prototype.render;

    SearchDropdown.prototype.render = function (decorated) {

        // invoke parent method
        var $rendered = _renderSearchDropdown.apply(this, Array.prototype.slice.apply(arguments));

        this.$search.attr('placeholder', this.options.get('searchInputPlaceholder'));
        $(document).on('select2:open', (e) => {
            var id = e.target.id
            document.querySelector('.select2-search__field[aria-controls=select2-' + id + '-results').focus();
        });

        return $rendered;
    };

})(window.jQuery);
//End Feature Input select2