@push('page_modals')

<div class="modal fade" id="salarySlipListModal" tabindex="-1" aria-labelledby="salarySlipListModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-xl">
        <div class="modal-content">
            <div class="modal-header bg-body-secondary rounded-0">
                <h5 class="modal-title" id="salarySlipListModalLabel">Employee Salary Slips</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <div class="slr-div_form">
                    <div class="card bg-white border-0">
                        <div class="card-body">
                            <div class="tab">
                                <div class="row frm_emp_prsnl_dtl mt-3 employee_detail"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

@endpush

@push('page_scripts')
<script type="text/javascript">
    
    class SalarySlip extends BaseClass {
        
        constructor() {
            super();
            
            this.salarySlipListModalElem    =   document.getElementById('salarySlipListModal');
            this.salarySlipListModal        =   new bootstrap.Modal(this.salarySlipListModalElem, {keyboard: false, backdrop : 'static'});
            this.year                       =   2025;
            this.employee_id                =   '';
            this.salary_keys                =   [];
            
            this.salary_slip_add_url        =   '