$(document).ready(function () {
    let $checkAll = $("#checkAll2");
    let $checkboxes = $(".foo");

    

    $checkAll.on("change", function () {
        $checkboxes.prop("checked", this.checked);
    });

    $checkboxes.on("change", function () {
        let allChecked = $checkboxes.length === $checkboxes.filter(":checked").length;
        let someChecked = $checkboxes.filter(":checked").length > 0;
        $checkAll.prop("checked", allChecked);
        $checkAll.prop("indeterminate", !allChecked && someChecked);
    });
});

// *************************** عملیت مربوط اسکرول کردن مربوط به سال و ماه در دسکتاپ  ********************************
var Scrollbar = window.Scrollbar;
Scrollbar.init(document.querySelector('#my-scrollbar'), {
    alwaysShowTracks: true
});

const selectedAll = document.querySelectorAll(".wrapper-dropdown");
$(document).ready(function () {

    ////******************** چسباندن هدر تیبل به صفحه بالا ********************
    //// Get the offset position of the sticky element
    //var stickyDiv = $(".sticky-div");
    //var stickyOffset = stickyDiv.offset().top;

    //// Add the sticky class to the element when you reach its scroll position
    //$(window).scroll(function () {
    //    if (window.pageYOffset >= stickyOffset) {
    //        stickyDiv.addClass("sticky");
    //    } else {
    //        stickyDiv.removeClass("sticky");
    //    }
    //});
    ////******************** چسباندن هدر تیبل به صفحه بالا ********************


    // if ($(window).width() < 992) {
    //     window.onbeforeprint = (event) => {
    //         $("#MainModal").modal("hide");
    //     }
    // }

    var wrapperDropdown = $(".wrapper-dropdown");

    wrapperDropdown.on("click", function () {
        var dropdown = $(this);
        var optionsContainer = dropdown.children(".dropdown");
        var optionsList = optionsContainer.find(".item");

        dropdown.toggleClass("active");

        if (dropdown.hasClass("active")) {
            wrapperDropdown.not(this).removeClass("active");
        }

        optionsList.on("click", function () {
            var selectedOption = $(this);
            var valueData = selectedOption.data("value");

            dropdown.removeClass("active");
            dropdown.find(".selected-display").text(selectedOption.text());
            $("#sendSorting").val(valueData);

            optionsList.removeClass("active");
            selectedOption.addClass("active");
        });
    });

    var defaultValue = $("#sendSorting").val();
    if (defaultValue) {

        let defaultItem = $(".dropdown").find(".item[value-data='" + defaultValue + "']");
        defaultItem.addClass("active");
        var selectedDisplay = wrapperDropdown.find(".selected-display");
        selectedDisplay.text(defaultItem.text());
    }
});

// check if anything else ofther than the dropdown is clicked
window.addEventListener("click", function (e) {
    if (e.target.closest(".wrapper-dropdown") === null) {
        closeAllDropdowns();
    }
});

// close all the dropdowns
function closeAllDropdowns() {
    const selectedAll = document.querySelectorAll(".wrapper-dropdown");
    selectedAll.forEach((selected) => {
        const optionsContainer = selected.children[2];
        let arrow = selected.children[1];

        handleDropdown(selected, arrow, false);
    });
}

// open all the dropdowns
function handleDropdown(dropdown, arrow, open) {
    if (open) {
        arrow.classList.add("rotated");
        dropdown.classList.add("active");
    } else {
        arrow.classList.remove("rotated");
        dropdown.classList.remove("active");
    }
}
// *************************** عملیت مربوط اسکرول کردن مربوط به سال و ماه در دسکتاپ  ********************************


//******************** انتخاب همه ی چک باکس ها ********************
$(".checkAll").change(function () {
    let dataValYear = $('#Year').val();
    let dataValMonth = $('#Month').val();
    let dataValPersonel = Number($('#employeeId').val());

    if ((dataValYear === '0' || dataValMonth === '0') && dataValPersonel === 0) {
        $('#dropdown-year').addClass("errored");
        $('#dropdown-month').addClass("errored");

        $(this).prop('checked', false);
        $('.alert-msg').show();
        $('.alert-msg p').text('جهت انتخاب گروهی ابتدا میبایست سال و ماه مورد نظر را انتخاب نمائید.');
        setTimeout(function () {
            $('.alert-msg').hide();
            $('.alert-msg p').text('');
            $('#dropdown-year').removeClass("errored");
            $('#dropdown-month').removeClass("errored");
        }, 3500);
    } else {
        // $('.foo:checkbox').not(this).prop('checked', this.checked);
        $('input:checkbox').not(this).prop('checked', this.checked);
    }
});
//******************** انتخاب همه ی چک باکس ها ********************

//******************** فیلتر کردن برای جستجو ***********

$(document).on('click', '.btn-search-click', function (event) {
    event.preventDefault();

    // جستجو سال و ماه
    const selectedYear = $('#sendDropdownYear').val();
    const selectedMonth = $('#sendDropdownMonth').val();
    const isYearMonthSelected = selectedYear === "0" && selectedMonth === "0";

    if (!isYearMonthSelected && (selectedYear === "0" || selectedMonth === "0") ) {
        $('#dropdown-year').addClass("errored");
        $('#dropdown-month').addClass("errored");

        $('.alert-msg').show();
        $('.alert-msg p').text('لطفاً سال و ماه را باهم انتخاب نمائید.');
        setTimeout(function () {
            $('.alert-msg').hide();
            $('.alert-msg p').text('');

            $('#dropdown-year').removeClass("errored");
            $('#dropdown-month').removeClass("errored");
            $('.start-date').removeClass("errored");
            $('.end-date').removeClass("errored");
        }, 3500);
        return;
    }
    // جستجو سال و ماه


    // جستجو تاریخ شروع و پایان
    const startDate = $('.start-date').val();
    const endDate = $('.end-date').val();
    const isStartEndDateSelected = startDate.trim() === "" && endDate.trim() === "";

    if (!isStartEndDateSelected && (startDate.trim() === "" || endDate.trim() === "") ) {
        $('.start-date').addClass("errored");
        $('.end-date').addClass("errored");

        $('.alert-msg').show();
        $('.alert-msg p').text('لطفاً تاریخ شروع و پایان را باهم مشخص نمائید.');
        setTimeout(function () {
            $('.alert-msg').hide();
            $('.alert-msg p').text('');

            $('#dropdown-year').removeClass("errored");
            $('#dropdown-month').removeClass("errored");
            $('.start-date').removeClass("errored");
            $('.end-date').removeClass("errored");
        }, 3500);
        return;
    }
    // جستجو تاریخ شروع و پایان


    $('#search-theme-form1').submit();
    $('#filterRemove').show();
});

$(document).on('click', '.btn-clear-filter', function () {
    $(this).hide();
    $('.search-box input').val('');
    $('.search-box .form-select').val(null);
    $('#yearText').text('سال');
    $('#monthText').text('ماه');
    middleYearIndex = 2;
    selectedMonth = 1;
});


$(document).ready(function () {
    var filterEmployeeId = $('#employeeId').val();
    var filterYear = $('#Year').val();
    var filterMonth = $('#Month').val();
    var filterStart = $('#SearchStartFa').val();
    var filterEnd = $('#SearchEndFa').val();
    var filterBank = $('#BankId').val();

    if (filterEmployeeId !== "0" || filterYear !== "0" || filterMonth !== "0" || filterStart !== '' || filterEnd !== '' || filterBank !== "0") {
        $('.btn-clear-filter').removeClass('disable');
    } else {
        $('.btn-clear-filter').addClass('disable');
    }
    if(filterStart !== '') {
        $('#start-date').text(filterStart);
    }
    if (filterEnd !== '') {
        $('#end-date').text(filterEnd);
    }
});

// قسمت دکمه حذف فیلتر
// $('#filterRemove').filter(function () {
//     if ($('.start-date').val() == '' && $('.end-date').val() == '') {
//         $(this).hide();
//     } else {
//         $(this).show();
//     }
// });
//******************** فیلتر کردن برای جستجو ********************

//******************** برای تاریک و محو کردن بکگراند مربوط به انتخاب تاریخ سال و ماه ********************
$("#overlaySearchAdvance").click(function () {
    $('#overlaySearchAdvance').toggleClass("overlaySearchAdvance");
    $('.datepicker-container-year').remove();
    $('.datepicker-container-month').remove();
});
//******************** برای تاریک و محو کردن بکگراند مربوط به انتخاب تاریخ سال و ماه ********************


//******************** نمایش سال و ماه در موبایل ********************
if ($(window).width() < 768) {

    var middleYearIndex = 2;
    var selectedMonth = 2;

    //************* Year *************
    $('.persianDateInputYear').on('click',
        function () {
            $('#overlaySearchAdvance').addClass("overlaySearchAdvance");

            var datepicker = $(this);
            if ($(this).parent().find('.datepicker-container-year').length) {
                return false;
            } else {
                $(this).parent().append(`
                                                <div class="datepicker-container-year">
                                                    <div class="datepicker-container-date-div">
                                                        <div class="date-container">
                                                            <div id="years" class="scrollable-container"></div>
                                                        </div>
                                                        <div class="d-flex justify-content-around">
                                                            <button type="button" class="btn-secondary" id="cancelYear" style="width:100px; font-size: 11px;">انصراف</button>
                                                            <button type="button" class="btn-primary" id="confirmYear" style="width:100px; font-size: 11px;">تائید</button>
                                                        </div>
                                                    </div>
                                                </div>
                                          `);
            }

            var datepickerContainer = $(this).parent().find('.datepicker-container-year');
            var years = datepickerContainer.find('#years');
            // datepickerContainer.width(datepicker.outerWidth());

            var middleYearIndexArray = [];
            let yearlyList = [];
            yearlyList.push({ year: 1368 });
            yearlyList.push({ year: 1369 });
            itemsYearList.forEach(function (year) {
                yearlyList.push({ year: Number(year) });
            });

            var yearIndex = yearlyList.length;
            yearIndex = yearIndex - 1;
            var no3 = yearlyList[yearIndex].year + 1;
            var no4 = yearlyList[yearIndex].year + 2;
            yearlyList.push({ year: no3 });
            yearlyList.push({ year: no4 });
            var i = 0;

            for (var j = yearlyList[yearIndex + 2].year; j >= 1368; j--) {
                let y = { index: i, value: j };
                middleYearIndexArray.push(j);
                i++;

                var formattedNumber = String(j).padStart(2, '0');
                if (j == no3 || j == no4) {
                    years.append($('<span>').text('-').css('visibility', 'hidden'));
                } else if (j == 1368 || j == 1369) {
                    years.append($('<span>').text(formattedNumber).css('visibility', 'hidden'));
                } else {
                    years.append($('<span>').text(formattedNumber));
                }

                // var middleYearIndex = Math.floor(years.children('span').length / 2) - 2;
                years.children('span').eq(middleYearIndex).addClass('chosen-date');
                var containerHeightYear = years.height();
                var optionHeightYear = years.children('span').outerHeight();
                var scrollOffsetYear = optionHeightYear * middleYearIndex;
                years.scrollTop(scrollOffsetYear - containerHeightYear / 2);
            }

            // datepickerContainer.addClass("date-container");

            var selectedYear = yearlyList[yearIndex].year;
            var yearsScrollTop;
            var scrollTimeout;

            // Scroll event listener
            datepickerContainer.find('.scrollable-container').on('scroll',
                function () {
                    var optionHeightYear = years.children('span').outerHeight();
                    // var scrollTopYear = years.scrollTop() + (optionHeightYear * 2);
                    var scrollTopYear = Math.round((years.scrollTop() + (optionHeightYear * 2)) / 10) * 10;
                    var selectedIndexYear = Math.round(scrollTopYear / optionHeightYear);
                    years.children('span').removeClass('chosen-date');
                    years.children('span').eq(selectedIndexYear).addClass('chosen-date');
                    yearsScrollTop = years.scrollTop();
                    var selectedValueYear = years.children('span').eq(selectedIndexYear).text();

                    clearTimeout(scrollTimeout);
                    scrollTimeout = setTimeout(function () {
                        var scrollTopYearRounded = customRound(yearsScrollTop);

                        if (yearsScrollTop !== scrollTopYearRounded) {
                            years.scrollTop(scrollTopYearRounded);
                        }
                    },
                        250);

                    var containerId = $(this).attr('id');

                    if (containerId === 'years') {
                        selectedYear = selectedValueYear;

                        index = middleYearIndexArray.indexOf(Number(selectedValueYear));
                        middleYearIndex = index;
                    }

                    if (selectedYear) {
                        var formattedDate = selectedYear;
                        datepicker.val(formattedDate);
                        $('#yearModal').val(formattedDate);
                        $('#yearText').text(selectedYear);
                    }
                });

            $(document).on('click',
                '#confirmYear',
                function (event) {
                    $('#yearModal').val(selectedYear);
                    $('#yearText').text(selectedYear);
                    datepickerContainer.remove();
                    $('#overlaySearchAdvance').removeClass("overlaySearchAdvance");
                });

            $(document).on('click',
                '#cancelYear',
                function (event) {
                    $('#yearModal').val('');
                    $('#yearText').text('سال');
                    middleYearIndex = 2;
                    datepickerContainer.remove();
                    $('#overlaySearchAdvance').removeClass("overlaySearchAdvance");
                });

            $(document).on('click',
                '.chosen-date',
                function () {
                    // if (selectedYear == 0) {
                    //     $('#yearModal').val($(this).text());
                    //     console.log(selectedYear)
                    //     $('#yearText').text($(this).text());
                    // } else {
                    $('#yearModal').val(selectedYear);
                    $('#yearText').text(selectedYear);
                    // }
                    $('#overlaySearchAdvance').removeClass("overlaySearchAdvance");
                    datepickerContainer.remove();
                });
        });
    //************* End Year *************


    //************* Month *************
    $('.persianDateInputMonth').on('click',
        function () {
            $('#overlaySearchAdvance').addClass("overlaySearchAdvance");

            var datepicker = $(this);
            if ($(this).parent().find('.datepicker-container-month').length) {
                return false;
            } else {
                $(this).parent().append(`
                                                <div class="datepicker-container-month">
                                                    <div class="datepicker-container-date-div">
                                                        <div class="date-container">
                                                            <div id="months" class="scrollable-container"></div>
                                                        </div>
                                                        <div class="d-flex justify-content-around">
                                                            <button type="button" class="btn-secondary" id="cancelMonth" style="width:100px; font-size: 11px;">انصراف</button>
                                                            <button type="button" class="btn-primary" id="confirmMonth" style="width:100px; font-size: 11px;">تائید</button>
                                                        </div>
                                                    </div>
                                                </div>
                                            `);
                if ($(this).val() != '') {
                    let number = selectedMonth + 1;
                    var middleMonthIndex = number;
                }
            }


            var datepickerContainer = $(this).parent().find('.datepicker-container-month');
            var months = datepickerContainer.find('#months');

            // Populate months
            var monthNames = ['-', 'فروردین', 'اردیبهشت', 'خرداد', 'تیر', 'مرداد', 'شهریور', 'مهر', 'آبان', 'آذر', 'دی', 'بهمن', 'اسفند', '-'];
            for (var j = 0; j < 14; j++) {
                var monthIndex = j;
                // var monthIndex = (j * 12) % 12;
                // var monthIndex = (j + i * 12) % 12;
                var monthName = monthNames[j];

                if (j == 0) {
                    months.append($('<span>').text('-').css('visibility', 'hidden'));
                    months.append($('<span>').text('-').css('visibility', 'hidden'));
                } else if (j == 13) {
                    months.append($('<span>').text('-').css('visibility', 'hidden'));
                    months.append($('<span>').text('-').css('visibility', 'hidden'));

                } else {
                    months.append($('<span>').text(monthName));
                }

                // var middleMonthIndex = selectedMonth;
                // var middleMonthIndex = Math.floor(months.children('span').length / 2) - 17;
                months.children('span').eq(selectedMonth).addClass('chosen-date');

                var containerHeightMonth = months.height();
                var optionHeightMonth = months.children('span').outerHeight();
                var scrollOffsetMonth = optionHeightMonth * middleMonthIndex;
                months.scrollTop(scrollOffsetMonth - containerHeightMonth / 2);

            }

            var selectedMonthValue = "01";
            var selectedNumber = 2;
            var selectedMonthText = "فروردین";
            var monthScrollTop;
            var scrollTimeout;

            // Scroll event listener
            datepickerContainer.find('.scrollable-container').on('scroll',
                function () {

                    var optionHeightMonth = months.children('span').outerHeight();
                    var scrollTopMonth = Math.round((months.scrollTop() + (optionHeightMonth * 2)) / 10) * 10;
                    var selectedIndexMonth = Math.round(scrollTopMonth / optionHeightMonth);
                    months.children('span').removeClass('chosen-date');
                    months.children('span').eq(selectedIndexMonth).addClass('chosen-date');
                    monthScrollTop = months.scrollTop();
                    var selectedValueMonth = months.children('span').eq(selectedIndexMonth).text();

                    clearTimeout(scrollTimeout);
                    scrollTimeout = setTimeout(function () {
                        var scrollTopMonthRounded = customRound(monthScrollTop);

                        if (monthScrollTop !== scrollTopMonthRounded) {
                            months.scrollTop(scrollTopMonthRounded);
                        }
                    },
                        250);

                    var containerId = $(this).attr('id');

                    if (containerId === 'months') {
                        if (selectedValueMonth === 'فروردین') {
                            selectedMonthValue = '01';
                            selectedNumber = 1;
                            selectedMonthText = "فروردین";
                        } else if (selectedValueMonth === 'اردیبهشت') {
                            selectedMonthValue = '02';
                            selectedNumber = 2;
                            selectedMonthText = "اردیبهشت";
                        } else if (selectedValueMonth === 'خرداد') {
                            selectedMonthValue = '03';
                            selectedNumber = 3;
                            selectedMonthText = "خرداد";
                        } else if (selectedValueMonth === 'تیر') {
                            selectedMonthValue = '04';
                            selectedNumber = 4;
                            selectedMonthText = "تیر";
                        } else if (selectedValueMonth === 'مرداد') {
                            selectedMonthValue = '05';
                            selectedNumber = 5;
                            selectedMonthText = "مرداد";
                        } else if (selectedValueMonth === 'شهریور') {
                            selectedMonthValue = '06';
                            selectedNumber = 6;
                            selectedMonthText = "شهریور";
                        } else if (selectedValueMonth === 'مهر') {
                            selectedMonthValue = '07';
                            selectedNumber = 7;
                            selectedMonthText = "مهر";
                        } else if (selectedValueMonth === 'آبان') {
                            selectedMonthValue = '08';
                            selectedNumber = 8;
                            selectedMonthText = "آبان";
                        } else if (selectedValueMonth === 'آذر') {
                            selectedMonthValue = '09';
                            selectedNumber = 9;
                            selectedMonthText = "آذر";
                        } else if (selectedValueMonth === 'دی') {
                            selectedMonthValue = '10';
                            selectedNumber = 10;
                            selectedMonthText = "دی";
                        } else if (selectedValueMonth === 'بهمن') {
                            selectedMonthValue = '11';
                            selectedNumber = 11;
                            selectedMonthText = "بهمن";
                        } else if (selectedValueMonth === 'اسفند') {
                            selectedMonthValue = '12';
                            selectedNumber = 12;
                            selectedMonthText = "اسفند";
                        }
                    }

                    if (selectedMonthValue) {
                        var formattedDate = selectedMonthValue;
                        datepicker.val(formattedDate);
                        $('#monthModal').val(formattedDate);
                        $('#monthText').text(selectedMonthText);
                        selectedMonth = selectedNumber;
                    }
                });


            $(document).on('click',
                '#confirmMonth',
                function (event) {
                    $('#monthModal').val(selectedMonthValue);
                    $('#monthText').text(selectedMonthText);
                    selectedMonth = selectedNumber;
                    datepickerContainer.remove();
                    $('#overlaySearchAdvance').removeClass("overlaySearchAdvance");
                });

            $(document).on('click',
                '#cancelMonth',
                function (event) {
                    $('#monthModal').val('');
                    $('#monthText').text('ماه');
                    selectedMonth = 2;
                    datepickerContainer.remove();
                    $('#overlaySearchAdvance').removeClass("overlaySearchAdvance");
                });

            $(document).on('click',
                '.chosen-date',
                function () {
                    $('#monthModal').val(selectedMonthValue);
                    $('#monthText').text(selectedMonthText);
                    selectedMonth = selectedNumber;
                    $('#overlaySearchAdvance').removeClass("overlaySearchAdvance");
                    datepickerContainer.remove();
                });
        });
    //************* End Month *************

    //Pixel of height for Span in date
    //For example: datepicker-container-date .years span
    function customRound(number) {
        var roundedNumber = Math.round(number);
        var remainder = roundedNumber % 60; //60px
        if (remainder <= 10) {
            return roundedNumber - remainder;
        } else {
            return roundedNumber + (60 - remainder);
        }
    }
}
//******************** نمایش سال و ماه در موبایل ********************


//******************** نمایش تاریخ در موبایل ********************
if ($(window).width() < 768) {

    // Input Start Date
    var middleYearIndexDateStart = 2;
    var selectedMonthDateStart = 2;
    var middleDayIndexStart = 2;
    $('.persianDateInputStartDate').on('click',
        function () {
            $('#overlaySearchAdvance').addClass("overlaySearchAdvance");

            var datepicker = $(this);
            if ($(this).parent().find('.datepicker-container-date').length) {
                return false;
            } else {
                $(this).parent().append(`
                                                <div class="datepicker-container-date">
                                                    <div class="datepicker-container-date-div">
                                                        <div class="date-container">
                                                            <div id="yearsValue" class="years scrollable-container"></div>
                                                            <div id="monthsValue" class="months scrollable-container"></div>
                                                            <div id="daysValue" class="days scrollable-container"></div>
                                                        </div>
                                                        <div class="d-flex justify-content-around">
                                                            <button type="button" class="btn-secondary" id="cancelDateStart" style="width:100px; font-size: 11px;">انصراف</button>
                                                            <button type="button" class="btn-primary" id="confirmDateStart" style="width:100px; font-size: 11px;">تائید</button>
                                                        </div>
                                                    </div>
                                                </div>
                                            `);

                if ($(this).val() != '') {
                    let number = selectedMonthDateStart + 1;
                    var middleMonthIndex = number;
                }
            }

            var datepickerContainer = $(this).parent().find('.datepicker-container-date');
            var years = datepickerContainer.find('.years');
            var months = datepickerContainer.find('.months');
            var days = datepickerContainer.find('.days');
            // datepickerContainer.width(datepicker.outerWidth());


            // Populate years, months, and days
            var middleYearIndexArray = [];
            let yearlyList = [];
            yearlyList.push({ year: 1368 });
            yearlyList.push({ year: 1369 });

            itemsYearList.forEach(function (year) {
                yearlyList.push({ year: Number(year) });
            });

            var yearIndex = yearlyList.length;
            yearIndex = yearIndex - 1;
            var no3 = yearlyList[yearIndex].year + 1;
            var no4 = yearlyList[yearIndex].year + 2;
            yearlyList.push({ year: no3 });
            yearlyList.push({ year: no4 });
            var i = 0;


            for (var j = yearlyList[yearIndex + 2].year; j >= 1368; j--) {
                let y = { index: i, value: j };
                middleYearIndexArray.push(j);
                i++;

                var formattedNumber = String(j).padStart(2, '0');
                if (j == no3 || j == no4) {
                    years.append($('<span>').text('-').css('visibility', 'hidden'));
                } else if (j == 1368 || j == 1369) {
                    years.append($('<span>').text(formattedNumber).css('visibility', 'hidden'));
                } else {
                    years.append($('<span>').text(formattedNumber));
                }

                years.children('span').eq(middleYearIndexDateStart).addClass('chosen-date');
                var containerHeightYear = years.height();
                var optionHeightYear = years.children('span').outerHeight();
                var scrollOffsetYear = optionHeightYear * middleYearIndexDateStart;
                years.scrollTop(scrollOffsetYear - containerHeightYear / 2);
            }


            var monthNames = ['-', 'فروردین', 'اردیبهشت', 'خرداد', 'تیر', 'مرداد', 'شهریور', 'مهر', 'آبان', 'آذر', 'دی', 'بهمن', 'اسفند', '-'];
            for (var j = 0; j < 14; j++) {
                var monthIndex = j;
                // var monthIndex = (j * 12) % 12;
                // var monthIndex = (j + i * 12) % 12;
                var monthName = monthNames[j];

                if (j == 0) {
                    months.append($('<span>').text('-').css('visibility', 'hidden'));
                    months.append($('<span>').text('-').css('visibility', 'hidden'));
                } else if (j == 13) {
                    months.append($('<span>').text('-').css('visibility', 'hidden'));
                    months.append($('<span>').text('-').css('visibility', 'hidden'));

                } else {
                    months.append($('<span>').text(monthName));
                }

                var containerHeightMonth = months.height();
                var optionHeightMonth = months.children('span').outerHeight();
                var scrollOffsetMonth = optionHeightMonth * middleMonthIndex;
                months.scrollTop(scrollOffsetMonth - containerHeightMonth / 2);
            }

            for (var d = 1; d <= 31; d++) {
                var formattedNumber = String(d).padStart(2, '0');

                if (d == 1) {
                    days.append($('<span>').text('-').css('visibility', 'hidden'));
                    days.append($('<span>').text('-').css('visibility', 'hidden'));
                    days.append($('<span>').text(formattedNumber));
                } else if (d == 31) {
                    days.append($('<span>').text(formattedNumber));
                    days.append($('<span>').text('-').css('visibility', 'hidden'));
                    days.append($('<span>').text('-').css('visibility', 'hidden'));
                } else {
                    days.append($('<span>').text(formattedNumber));
                }

                // var middleDayIndex = Math.floor(days.children('span').length / 2) - 45;
                var containerHeightDay = days.height();
                var optionHeightDay = days.children('span').outerHeight();
                var scrollOffsetDay = optionHeightDay * middleDayIndexStart;
                days.scrollTop(scrollOffsetDay - containerHeightDay / 2);
            }

            var selectedYear = yearlyList[yearIndex].year;
            var selectedMonth = "01";
            var selectedNumberMonth = 1;

            var selectedDay = "01";

            var yearsScrollTop;
            var monthScrollTop;
            var dayScrollTop;
            var scrollTimeout;

            var formattedDate;

            // Scroll event listener
            datepickerContainer.find('.scrollable-container').on('scroll',
                function () {
                    var optionHeightYear = years.children('span').outerHeight();

                    var scrollTopYear = years.scrollTop() + (optionHeightYear * 2);
                    var selectedIndexYear = Math.round(scrollTopYear / optionHeightYear);
                    yearsScrollTop = years.scrollTop();
                    years.children('span').removeClass('chosen-date');
                    years.children('span').eq(selectedIndexYear).addClass('chosen-date');
                    var selectedValueYear = years.children('span').eq(selectedIndexYear).text();


                    var optionHeightMonth = months.children('span').outerHeight();
                    var scrollTopMonth = Math.round((months.scrollTop() + (optionHeightMonth * 2)) / 10) * 10;
                    var selectedIndexMonth = Math.round(scrollTopMonth / optionHeightMonth);
                    months.children('span').removeClass('chosen-date');
                    months.children('span').eq(selectedIndexMonth).addClass('chosen-date');
                    monthScrollTop = months.scrollTop();
                    var selectedValueMonth = months.children('span').eq(selectedIndexMonth).text();
                    var optionHeightDay = days.children('span').outerHeight();
                    var scrollTopDay = days.scrollTop() + (optionHeightDay * 2);

                    var selectedIndexDay = Math.round(scrollTopDay / optionHeightDay);
                    dayScrollTop = days.scrollTop();
                    days.children('span').removeClass('chosen-date');
                    days.children('span').eq(selectedIndexDay).addClass('chosen-date');
                    var selectedValueDay = days.children('span').eq(selectedIndexDay).text();

                    clearTimeout(scrollTimeout);
                    scrollTimeout = setTimeout(function () {
                        var scrollTopYearRounded = customRound(yearsScrollTop);
                        var scrollTopMonthRounded = customRound(monthScrollTop);
                        var scrollTopDayRounded = customRound(dayScrollTop);

                        if (yearsScrollTop !== scrollTopYearRounded) {
                            years.scrollTop(scrollTopYearRounded);
                        }
                        if (monthScrollTop !== scrollTopMonthRounded) {
                            months.scrollTop(scrollTopMonthRounded);
                        }
                        if (dayScrollTop !== scrollTopDayRounded) {
                            days.scrollTop(scrollTopDayRounded);
                        }
                    },
                        250);

                    var containerId = $(this).attr('id');

                    if (containerId === 'yearsValue') {
                        selectedYear = selectedValueYear;
                        index = middleYearIndexArray.indexOf(Number(selectedValueYear));
                        middleYearIndexDateStart = index;

                    } else if (containerId === 'monthsValue') {
                        if (selectedValueMonth === 'فروردین') {
                            selectedMonth = '01';
                            selectedNumberMonth = 1;
                        } else if (selectedValueMonth === 'اردیبهشت') {
                            selectedMonth = '02';
                            selectedNumberMonth = 2;
                        } else if (selectedValueMonth === 'خرداد') {
                            selectedMonth = '03';
                            selectedNumberMonth = 3;
                        } else if (selectedValueMonth === 'تیر') {
                            selectedMonth = '04';
                            selectedNumberMonth = 4;
                        } else if (selectedValueMonth === 'مرداد') {
                            selectedMonth = '05';
                            selectedNumberMonth = 5;
                        } else if (selectedValueMonth === 'شهریور') {
                            selectedMonth = '06';
                            selectedNumberMonth = 6;
                        } else if (selectedValueMonth === 'مهر') {
                            selectedMonth = '07';
                            selectedNumberMonth = 7;
                        } else if (selectedValueMonth === 'آبان') {
                            selectedMonth = '08';
                            selectedNumberMonth = 8;
                        } else if (selectedValueMonth === 'آذر') {
                            selectedMonth = '09';
                            selectedNumberMonth = 9;
                        } else if (selectedValueMonth === 'دی') {
                            selectedMonth = '10';
                            selectedNumberMonth = 10;
                        } else if (selectedValueMonth === 'بهمن') {
                            selectedMonth = '11';
                            selectedNumberMonth = 11;
                        } else if (selectedValueMonth === 'اسفند') {
                            selectedMonth = '12';
                            selectedNumberMonth = 12;
                        }
                    } else if (containerId === 'daysValue') {
                        selectedDay = selectedValueDay;
                        middleDayIndexStart = parseInt(selectedValueDay) + 1;
                    }

                    selectedMonthDateStart = selectedNumberMonth;

                    formattedDate = selectedYear + '/' + selectedMonth + '/' + selectedDay;
                    datepicker.val(formattedDate);

                });


            $(document).on('click',
                '#overlaySearchAdvance',
                function () {
                    datepickerContainer.remove();
                });

            $(document).on('click',
                '.chosen-date',
                function () {
                    $('#start-date').text(formattedDate);
                    $('.start-date').val(formattedDate);
                    $('#overlaySearchAdvance').removeClass("overlaySearchAdvance");
                    datepickerContainer.remove();
                });

            $(document).on('click',
                '#confirmDateStart',
                function (event) {
                    $(this).parents().eq(2).find('.persianDateInput').val(formattedDate);
                    $('#start-date').text(formattedDate);
                    $('.start-date').val(formattedDate);
                    datepickerContainer.remove();
                    $('#overlaySearchAdvance').removeClass("overlaySearchAdvance");
                });

            $(document).on('click',
                '#cancelDateStart',
                function (event) {
                    // $(this).parents().eq(3).find('.persianDateInputStartDate').val('');
                    //$('#start-date').text('تاریخ شروع');
                    //$('.start-date').val('');
                    //middleYearIndexDateStart = 2;
                    //selectedMonthDateStart = 2;
                    //middleDayIndexStart = 2;
                    datepickerContainer.remove();
                    $('#overlaySearchAdvance').removeClass("overlaySearchAdvance");
                });
        });


    // Input End Date
    var middleYearIndexDateEnd = 2;
    var selectedMonthDateEnd = 2;
    var middleDayIndexEnd = 2;
    $('.persianDateInputEndDate').on('click',
        function () {
            $('#overlaySearchAdvance').addClass("overlaySearchAdvance");

            var datepicker = $(this);
            if ($(this).parent().find('.datepicker-container-date').length) {
                return false;
            } else {
                $(this).parent().append(`
                                                <div class="datepicker-container-date">
                                                    <div class="datepicker-container-date-div">
                                                        <div class="date-container">
                                                            <div id="yearsValue" class="years scrollable-container"></div>
                                                            <div id="monthsValue" class="months scrollable-container"></div>
                                                            <div id="daysValue" class="days scrollable-container"></div>
                                                        </div>
                                                        <div class="d-flex justify-content-around">
                                                            <button type="button" class="btn-secondary" id="cancelDateEnd" style="width:100px; font-size: 11px;">انصراف</button>
                                                            <button type="button" class="btn-primary" id="confirmDateEnd" style="width:100px; font-size: 11px;">تائید</button>
                                                        </div>
                                                    </div>
                                                </div>
                                            `);

                if ($(this).val() != '') {
                    let number = selectedMonthDateEnd + 1;
                    var middleMonthIndex = number;
                }
            }

            var datepickerContainer = $(this).parent().find('.datepicker-container-date');
            var years = datepickerContainer.find('.years');
            var months = datepickerContainer.find('.months');
            var days = datepickerContainer.find('.days');
            // datepickerContainer.width(datepicker.outerWidth());


            // Populate years, months, and days
            var middleYearIndexArray = [];
            let yearlyList = [];
            yearlyList.push({ year: 1368 });
            yearlyList.push({ year: 1369 });
            itemsYearList.forEach(function (year) {
                yearlyList.push({ year: Number(year) });
            });

            var yearIndex = yearlyList.length;
            yearIndex = yearIndex - 1;
            var no3 = yearlyList[yearIndex].year + 1;
            var no4 = yearlyList[yearIndex].year + 2;
            yearlyList.push({ year: no3 });
            yearlyList.push({ year: no4 });
            var i = 0;

            for (var j = yearlyList[yearIndex + 2].year; j >= 1368; j--) {
                let y = { index: i, value: j };
                middleYearIndexArray.push(j);
                i++;

                var formattedNumber = String(j).padStart(2, '0');
                if (j == no3 || j == no4) {
                    years.append($('<span>').text('-').css('visibility', 'hidden'));
                } else if (j == 1368 || j == 1369) {
                    years.append($('<span>').text(formattedNumber).css('visibility', 'hidden'));
                } else {
                    years.append($('<span>').text(formattedNumber));
                }

                years.children('span').eq(middleYearIndexDateEnd).addClass('chosen-date');
                var containerHeightYear = years.height();
                var optionHeightYear = years.children('span').outerHeight();
                var scrollOffsetYear = optionHeightYear * middleYearIndexDateEnd;
                years.scrollTop(scrollOffsetYear - containerHeightYear / 2);
            }


            var monthNames = ['-', 'فروردین', 'اردیبهشت', 'خرداد', 'تیر', 'مرداد', 'شهریور', 'مهر', 'آبان', 'آذر', 'دی', 'بهمن', 'اسفند', '-'];
            for (var j = 0; j < 14; j++) {
                var monthIndex = j;
                // var monthIndex = (j * 12) % 12;
                // var monthIndex = (j + i * 12) % 12;
                var monthName = monthNames[j];

                if (j == 0) {
                    months.append($('<span>').text('-').css('visibility', 'hidden'));
                    months.append($('<span>').text('-').css('visibility', 'hidden'));
                } else if (j == 13) {
                    months.append($('<span>').text('-').css('visibility', 'hidden'));
                    months.append($('<span>').text('-').css('visibility', 'hidden'));

                } else {
                    months.append($('<span>').text(monthName));
                }

                var containerHeightMonth = months.height();
                var optionHeightMonth = months.children('span').outerHeight();
                var scrollOffsetMonth = optionHeightMonth * middleMonthIndex;
                months.scrollTop(scrollOffsetMonth - containerHeightMonth / 2);
            }

            for (var d = 1; d <= 31; d++) {
                var formattedNumber = String(d).padStart(2, '0');

                if (d == 1) {
                    days.append($('<span>').text('-').css('visibility', 'hidden'));
                    days.append($('<span>').text('-').css('visibility', 'hidden'));
                    days.append($('<span>').text(formattedNumber));
                } else if (d == 31) {
                    days.append($('<span>').text(formattedNumber));
                    days.append($('<span>').text('-').css('visibility', 'hidden'));
                    days.append($('<span>').text('-').css('visibility', 'hidden'));
                } else {
                    days.append($('<span>').text(formattedNumber));
                }

                // var middleDayIndex = Math.floor(days.children('span').length / 2) - 45;
                var containerHeightDay = days.height();
                var optionHeightDay = days.children('span').outerHeight();
                var scrollOffsetDay = optionHeightDay * middleDayIndexEnd;
                days.scrollTop(scrollOffsetDay - containerHeightDay / 2);
            }

            var selectedYear = yearlyList[yearIndex].year;
            var selectedMonth = "01";
            var selectedNumberMonth = 1;

            var selectedDay = "01";

            var yearsScrollTop;
            var monthScrollTop;
            var dayScrollTop;
            var scrollTimeout;

            var formattedDate;

            // Scroll event listener
            datepickerContainer.find('.scrollable-container').on('scroll',
                function () {
                    var optionHeightYear = years.children('span').outerHeight();

                    var scrollTopYear = years.scrollTop() + (optionHeightYear * 2);
                    var selectedIndexYear = Math.round(scrollTopYear / optionHeightYear);
                    yearsScrollTop = years.scrollTop();
                    years.children('span').removeClass('chosen-date');
                    years.children('span').eq(selectedIndexYear).addClass('chosen-date');
                    var selectedValueYear = years.children('span').eq(selectedIndexYear).text();


                    var optionHeightMonth = months.children('span').outerHeight();
                    var scrollTopMonth = Math.round((months.scrollTop() + (optionHeightMonth * 2)) / 10) * 10;
                    var selectedIndexMonth = Math.round(scrollTopMonth / optionHeightMonth);
                    months.children('span').removeClass('chosen-date');
                    months.children('span').eq(selectedIndexMonth).addClass('chosen-date');
                    monthScrollTop = months.scrollTop();
                    var selectedValueMonth = months.children('span').eq(selectedIndexMonth).text();
                    var optionHeightDay = days.children('span').outerHeight();
                    var scrollTopDay = days.scrollTop() + (optionHeightDay * 2);

                    var selectedIndexDay = Math.round(scrollTopDay / optionHeightDay);
                    dayScrollTop = days.scrollTop();
                    days.children('span').removeClass('chosen-date');
                    days.children('span').eq(selectedIndexDay).addClass('chosen-date');
                    var selectedValueDay = days.children('span').eq(selectedIndexDay).text();

                    clearTimeout(scrollTimeout);
                    scrollTimeout = setTimeout(function () {
                        var scrollTopYearRounded = customRound(yearsScrollTop);
                        var scrollTopMonthRounded = customRound(monthScrollTop);
                        var scrollTopDayRounded = customRound(dayScrollTop);

                        if (yearsScrollTop !== scrollTopYearRounded) {
                            years.scrollTop(scrollTopYearRounded);
                        }
                        if (monthScrollTop !== scrollTopMonthRounded) {
                            months.scrollTop(scrollTopMonthRounded);
                        }
                        if (dayScrollTop !== scrollTopDayRounded) {
                            days.scrollTop(scrollTopDayRounded);
                        }
                    },
                        250);


                    var containerId = $(this).attr('id');

                    if (containerId === 'yearsValue') {
                        selectedYear = selectedValueYear;
                        index = middleYearIndexArray.indexOf(Number(selectedValueYear));
                        middleYearIndexDateEnd = index;
                    } else if (containerId === 'monthsValue') {
                        if (selectedValueMonth === 'فروردین') {
                            selectedMonth = '01';
                            selectedNumberMonth = 1;
                        } else if (selectedValueMonth === 'اردیبهشت') {
                            selectedMonth = '02';
                            selectedNumberMonth = 2;
                        } else if (selectedValueMonth === 'خرداد') {
                            selectedMonth = '03';
                            selectedNumberMonth = 3;
                        } else if (selectedValueMonth === 'تیر') {
                            selectedMonth = '04';
                            selectedNumberMonth = 4;
                        } else if (selectedValueMonth === 'مرداد') {
                            selectedMonth = '05';
                            selectedNumberMonth = 5;
                        } else if (selectedValueMonth === 'شهریور') {
                            selectedMonth = '06';
                            selectedNumberMonth = 6;
                        } else if (selectedValueMonth === 'مهر') {
                            selectedMonth = '07';
                            selectedNumberMonth = 7;
                        } else if (selectedValueMonth === 'آبان') {
                            selectedMonth = '08';
                            selectedNumberMonth = 8;
                        } else if (selectedValueMonth === 'آذر') {
                            selectedMonth = '09';
                            selectedNumberMonth = 9;
                        } else if (selectedValueMonth === 'دی') {
                            selectedMonth = '10';
                            selectedNumberMonth = 10;
                        } else if (selectedValueMonth === 'بهمن') {
                            selectedMonth = '11';
                            selectedNumberMonth = 11;
                        } else if (selectedValueMonth === 'اسفند') {
                            selectedMonth = '12';
                            selectedNumberMonth = 12;
                        }
                    } else if (containerId === 'daysValue') {
                        selectedDay = selectedValueDay;
                        middleDayIndexEnd = parseInt(selectedValueDay) + 1;
                    }

                    selectedMonthDateEnd = selectedNumberMonth;

                    formattedDate = selectedYear + '/' + selectedMonth + '/' + selectedDay;
                    datepicker.val(formattedDate);
                });


            $(document).on('click',
                '#overlaySearchAdvance',
                function () {
                    datepickerContainer.remove();
                });

            $(document).on('click',
                '.chosen-date',
                function () {
                    $('#end-date').text(formattedDate);
                    $('.end-date').val(formattedDate);
                    $('#overlaySearchAdvance').removeClass("overlaySearchAdvance");
                    datepickerContainer.remove();
                });

            $(document).on('click',
                '#confirmDateEnd',
                function (event) {
                    $('#end-date').text(formattedDate);
                    $('.end-date').val(formattedDate);
                    datepickerContainer.remove();
                    $('#overlaySearchAdvance').removeClass("overlaySearchAdvance");
                });

            $(document).on('click',
                '#cancelDateEnd',
                function (event) {
                    //$('#end-date').text('تاریخ پایان');
                    //$('.end-date').val('');
                    //middleYearIndexDateEnd = 2;
                    //selectedMonthDateEnd = 2;
                    //middleDayIndexEnd = 2;
                    datepickerContainer.remove();
                    $('#overlaySearchAdvance').removeClass("overlaySearchAdvance");
                });

        });


    //Pixel of height for Span in date
    //For example: datepicker-container-date .years span
    function customRound(number) {
        let roundedNumber = Math.round(number);
        var remainder = roundedNumber % 60; // 60px
        if (remainder <= 10) {
            return roundedNumber - remainder;
        } else {
            return roundedNumber + (60 - remainder);
        }
    }
}

function ajaxBanks() {
    var selectBankId = $('#BankId').val();

    $.ajax({
        url: bankListAjax,
        type: 'GET',
        success: function (response) {

            if (response.success) {
                var banks = response.data;
                var bankOptionsHtml = '<option value="0">انتخاب بانک ...</option>';
                banks.forEach(function (bank) {
                    bankOptionsHtml += `<option value="${bank.id}" ${selectBankId == bank.id ? 'selected' : ''}>${bank.bankName}</option>`;
                });
                $('#bankSelectIndex').html(bankOptionsHtml);
                $('#bankSelectIndexMobile').html(bankOptionsHtml);
                //$('#employeeSelectIndexMobile').html(employeeOptionsHtml);
            } else {
                $('.alert-msg').show();
                $('.alert-msg p').text(response.message);
                setTimeout(function () {
                    $('.alert-msg').hide();
                    $('.alert-msg p').text('');
                }, 3500);
            }
        },
        error: function (xhr, status, error) {
            console.error(xhr.responseText);
        }
    });
}


$(document).ready(function () {
    ajaxPersonals();
    ajaxBanks();

    if ($(window).width() < 768) {
        $('#search-theme-form1').remove();

    } else {
        $('#search-theme-form2').remove();
    }


    $(".select2Option").select2({
        language: "fa",
        dir: "rtl",
        templateResult: function (data, container) {
            if (data.element) {
                $(container).addClass($(data.element).attr("class"));
            }
            return data.text;
        }
    });

    $(".select2OptionMobile").select2({
        language: "fa",
        dir: "rtl",
        dropdownParent: $('#searchModal'),
        templateResult: function (data, container) {
            if (data.element) {
                $(container).addClass($(data.element).attr("class"));
            }
            return data.text;
        }
    });


    $("#bankSelectIndex").select2({
        language: "fa",
        dir: "rtl"
    });

    $("#bankSelectIndexMobile").select2({
        language: "fa",
        dir: "rtl",
        dropdownParent: $('#searchModal'),
        templateResult: function (data, container) {
            if (data.element) {
                $(container).addClass($(data.element).attr("class"));
            }
            return data.text;
        }
    });

    $(".form-control-date").each(function () {
        let element = $(this);
        element.on('input', function () {
            let value = convertPersianNumbersToEnglish(element.val());
            element.val(value);
        });

        new Cleave(this, {
            delimiters: ['/', '/'],
            blocks: [4, 2, 2],
            numericOnly: true
        });

        //new Cleave(this, {
        //    date: true,
        //    delimiter: '/',
        //    datePattern: ['Y', 'm', 'd']
        //});
    });



    //$("#getPersonnel").select2({
    //    language: "fa",
    //    dir: "rtl"
    //});

    //$("#getPersonneModal").select2({
    //    language: "fa",
    //    dir: "rtl",
    //    dropdownParent: $("#searchModal")
    //});

    //// $(".date").mask("0000/00/00");
    //$(".date").on('input', function () {
    //    var value = $(this).val();
    //    $(this).val(convertPersianNumbersToEnglish(value));
    //}).mask("0000/00/00");
    //$('.goToTop').hide();
});

$(".date").keyup(function () {
    let value = $(this).val();
    let lengthValue = value.length;
    if (lengthValue == 10) {
        if (!dateValidcheck(this)) {
            $(this).addClass("errored");
        } else {
            $(this).removeClass("errored");
        }
    } else if (lengthValue == 0) {
        $(this).removeClass("errored");
    }
});

// $('#sorting').on("change",
//     function () {
//         $('#searchBtn').click();
//     });
$('.dropdown .item').on("click", function () {
    let dataVal = $(this).attr("value-data");
    $('#sendSorting').val(dataVal);
    $('#searchBtn').click();
});
$('.dropdown-year .item').on("click", function () {
    let dataVal = $(this).attr("value-data-year");
    $('#sendDropdownYear').val(dataVal);
});
$('.dropdown-month .item').on("click", function () {
    let dataVal = $(this).attr("value-data-month");
    $('#sendDropdownMonth').val(dataVal);
});

var sendDropdownYear = $("#sendDropdownYear").val();
if (sendDropdownYear) {
    let itemDropdownYear = $(".dropdown-year").find(".item[value-data-year='" + sendDropdownYear + "']");
    itemDropdownYear.addClass("active");
    var selectedYearDisplay = $(".wrapper-dropdown-year").find(".selected-display");
    selectedYearDisplay.text(itemDropdownYear.text());
}

var sendDropdownMonth = $("#sendDropdownMonth").val();
if (sendDropdownMonth) {
    let itemDropdownMonth = $(".dropdown-month").find(".item[value-data-month='" + sendDropdownMonth + "']");
    itemDropdownMonth.addClass("active");
    var selectedMonthDisplay = $(".wrapper-dropdown-month").find(".selected-display");
    selectedMonthDisplay.text(itemDropdownMonth.text());
}


function loadMore() {
    let pageIndex = Number($('#pageIndex').val());
    var b = pageIndex % 30;
    var employeeId = Number($('#employeeId').val());
    var year = $('#Year').val();
    var month = $('#Month').val();
    var start = $('#SearchStartFa').val();
    var end = $('#SearchEndFa').val();
    var sorting = $('#OrderBy').val();

    var bankSelectIndex = $('#bankSelectIndex').val();
    var bankSelectIndexMobile = $('#bankSelectIndexMobile').val();
    var bankId = (bankSelectIndex === "0") ? bankSelectIndex : bankSelectIndexMobile;

    if (b === 0 && pageIndex > 0) {

        $.ajax({
            async: false,
            contentType: 'charset=utf-8',
            dataType: 'json',
            type: 'GET',
            url: loadAllCheckoutUnofficialListAjax,
            data: {
                PageIndex: pageIndex,
                EmployeeId: employeeId,
                Year: year,
                Month: month,
                SearchStartFa: start,
                SearchEndFa: end,
                OrderBy: sorting,
                BankId: bankId
            },
            headers: { "RequestVerificationToken": antiForgeryToken },
            success: function (response) {

                if (response.pageIndex > 0) {
                    var n = pageIndex + 1;
                    $.each(response.data, function (i, item) {
                        let html = `
                                                            <div class="Rtable-row align-items-center position-relative printAllTd">
                                                                            <div class="Rtable-cell d-md-block d-none width1">
                                                                                <div class="Rtable-cell--heading">
                                                                                    ردیف
                                                                                </div>
                                                                                <label for="${n}" class="Rtable-cell--content prevent-select">
                                                                                    <span class="d-flex justify-content-center align-items-center justify-content-between">
                                                                                        <input id="${n}" type="checkbox" class="form-check-input foo" name="foo" value="${item.id}">
                                                                                        <div class="row-number">
										                                                    ${n}
									                                                    </div>
                                                                                    </span>
                                                                                </label>
                                                                            </div>
                                                                            <div class="Rtable-cell d-md-block d-none width2">
                                                                                <div class="Rtable-cell--heading">شماره پرسنلی</div>
                                                                                <div class="Rtable-cell--content">${item.personnelCode}</div>
                                                                            </div>
                                                                        <div class="Rtable-cell d-md-block d-none width3">
                                                                            <div class="Rtable-cell--heading">سال</div>
                                                                            <div class="Rtable-cell--content">${item.year}</div>
                                                                        </div>
                                                                        <div class="Rtable-cell d-md-block d-none width4">
                                                                            <div class="Rtable-cell--heading">ماه</div>
                                                                            <div class="Rtable-cell--content">${item.month}</div>
                                                                        </div>
                                                                            <div class="Rtable-cell d-md-block d-none width6">
                                                                                <div class="Rtable-cell--heading">نام پرسنل</div>
                                                                                <div class="Rtable-cell--content ">${item.employeeFullName}`;
                                                                                if (item.hasAmountConflict) {
                                                                                  html+= ` <svg
                                                                                        xmlns="http://www.w3.org/2000/svg"
                                                                                        width="24" height="24"
                                                                                        fill="red"
                                                                                        className="bi bi-exclamation-circle"
                                                                                        viewBox="0 0 16 16"
                                                                                        style="cursor: pointer; margin-left: 10px;"
                                                                                        data-bs-toggle="tooltip"
                                                                                        data-bs-placement="top"
                                                                                        title="توجه داشته باشید این فیش حقوقی دارای تغییرات اعمال نشده میباشد. جهت صدور فیش حقوقی استاندارد مجددا فیش را ایجاد کنید!">
                                                                                        <path
                                                                                            d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16z"/>
                                                                                        <path
                                                                                            d="M7.002 11a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm.1-5.995a.905.905 0 0 1 1.8 0l-.35 3.5a.552.552 0 0 1-1.1 0l-.35-3.5z"/>
                                                                                    </svg>`;
                                                                                }
                                                                        html += `</div>
                                                                            </div>
                                                                            <div class="Rtable-cell d-md-block d-none width7">
                                                                                <div class="Rtable-cell--heading">آغاز قرارداد</div>
                                                                                <div class="Rtable-cell--content ">${item.contractStartFa}</div>
                                                                            </div>
                                                                            <div class="Rtable-cell d-md-block d-none width8">
                                                                                <div class="Rtable-cell--heading">پایان قرارداد</div>
                                                                                <div class="Rtable-cell--content ">${item.contractEndFa}</div>
                                                                            </div>
                                                                            <div class="Rtable-cell d-md-flex d-none width9">
                                                                                <div class="Rtable-cell--heading">روزهای کارکرد</div>
                                                                                <div class="Rtable-cell--content ">${item.sumOfWorkingDays}</div>
                                                                            </div>
                                                                            <div class="Rtable-cell d-md-flex d-none width9">
	                                                                            <div class="Rtable-cell--heading">تاخیر در ورود</div>
                                                                                <div class="Rtable-cell--content ${item.totalLateToWorkDeduction === "0" ? "" : "textRed"}">${item.totalLateToWorkDeduction}</div>
                                                                            </div> 
                                                                            <div class="Rtable-cell d-md-flex d-none width9">
	                                                                            <div class="Rtable-cell--heading">غیبت</div>
                                                                                <div class="Rtable-cell--content ${item.absenceDeduction === "0" ? "" : "textRed"}">${item.absenceDeduction}</div>
                                                                            </div> 
                                                                            <div class="Rtable-cell d-md-flex d-none width9">
	                                                                            <div class="Rtable-cell--heading">مساعده</div>
                                                                                <div class="Rtable-cell--content ${item.salaryAidDeduction === "0" ? "" : "textRed"}">${item.salaryAidDeduction}</div>
                                                                            </div> 
                                                                            <div class="Rtable-cell d-md-flex d-none width9">
                                                                                <div class="${item.totalPaymentD < 0 ? "bgColorMonthlySalaryMinus" : "bgColorMonthlySalaryPlus"}">
		                                                                            <div class="Rtable-cell--heading">مبلغ قابل پرداخت</div>
		                                                                            <div class="Rtable-cell--content ">${item.totalPayment}  ریال</div>
	                                                                            </div>
                                                                            </div>

                                                                <div class="Rtable-contract w-100 d-flex d-md-none align-items-center justify-content-between printAllTd">
                                                                    <div class="d-flex justify-content-center align-items-center justify-content-between">
                                                                        <div class="checkbox-responsive d-flex justify-content-center align-items-center justify-content-around">
                                                                            <input type="checkbox" class="form-check-input fooMobile" name="foo" value="${item.id}" id="">
                                                                            <span class="row-number">
										                                        ${n}
									                                        </span>
                                                                        </div>

                                                                        <div class="Rtable-cell--content">
                                                                            <span class="mx-sm-2">
                                                                             ${item.employeeFullName}`;
                                                                                if (item.hasAmountConflict) {
                                                                                    html += ` <svg
                                                                                                                                                                                                    xmlns="http://www.w3.org/2000/svg"
                                                                                                                                                                                                    width="12" height="12"
                                                                                                                                                                                                    fill="red"
                                                                                                                                                                                                    className="bi bi-exclamation-circle"
                                                                                                                                                                                                    viewBox="0 0 16 16"
                                                                                                                                                                                                    style="cursor: pointer; margin-left: 10px;"
                                                                                                                                                                                                    data-bs-toggle="tooltip"
                                                                                                                                                                                                    data-bs-placement="top"
                                                                                                                                                                                                    title="توجه داشته باشید این فیش حقوقی دارای تغییرات اعمال نشده میباشد. جهت صدور فیش حقوقی استاندارد مجددا فیش را ایجاد کنید!">
                                                                                                                                                                                                    <path
                                                                                                                                                                                                        d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16z"/>
                                                                                                                                                                                                    <path
                                                                                                                                                                                                        d="M7.002 11a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm.1-5.995a.905.905 0 0 1 1.8 0l-.35 3.5a.552.552 0 0 1-1.1 0l-.35-3.5z"/>
                                                                                                                                                                                            </svg>`;
                                                                                }
                                                                         html += `</span>
                                                                        </div>
                                                                    </div>


                                                                    <div class="Rtable-cell--content d-flex justify-content-end align-items-center">

                                                                        <div class="Rtable-cell--heading d-block text-center text-nowrap">
                                                                            <span class="d-block">آغاز قرارداد</span>
                                            ${item.contractStartFa}
                                                                        </div>
                                                                        <div class="Rtable-cell--heading d-block text-center text-nowrap">
                                                                            <span class="d-block">پایان قرارداد</span>
                                    ${item.contractEndFa}
                                                                        </div>
                                                                        <div class="Rtable-cell--heading d-flex text-center">
                                                                              ${response.printPermission === "true" ? `

                                                                                     <button class="btn-print" type="button" onclick="printOne(${item.id}, '${item.year}', '${item.month}')">
                                                                                        <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 20 20" fill="none" stroke="currentColor">
                                                                                            <path d="M15.0001 11.2493H15.139C16.0279 11.2493 16.4723 11.2493 16.759 10.9866C16.7805 10.967 16.801 10.9464 16.8207 10.9249C17.0834 10.6382 17.0834 10.1938 17.0834 9.3049V9.3049C17.0834 7.52714 17.0834 6.63826 16.558 6.06484C16.5187 6.02194 16.4775 5.98077 16.4346 5.94146C15.8612 5.41602 14.9723 5.41602 13.1945 5.41602H6.91675C5.03113 5.41602 4.08832 5.41602 3.50253 6.0018C2.91675 6.58759 2.91675 7.5304 2.91675 9.41602V10.2493C2.91675 10.7208 2.91675 10.9565 3.06319 11.1029C3.20964 11.2493 3.44534 11.2493 3.91675 11.2493H5.00008" />
                                                                                            <path d="M5.41675 16.3903L5.41675 9.91732C5.41675 8.97451 5.41675 8.5031 5.70964 8.21021C6.00253 7.91732 6.47394 7.91732 7.41675 7.91732L12.5834 7.91732C13.5262 7.91732 13.9976 7.91732 14.2905 8.21021C14.5834 8.5031 14.5834 8.97451 14.5834 9.91732L14.5834 16.3903C14.5834 16.7068 14.5834 16.8651 14.4796 16.9399C14.3758 17.0148 14.2256 16.9647 13.9253 16.8646L12.2572 16.3086C12.1712 16.2799 12.1282 16.2656 12.0839 16.2669C12.0396 16.2682 11.9975 16.285 11.9134 16.3187L10.1858 17.0097C10.0941 17.0464 10.0482 17.0647 10.0001 17.0647C9.95194 17.0647 9.90609 17.0464 9.81439 17.0097L8.0868 16.3187C8.00267 16.285 7.9606 16.2682 7.91627 16.2669C7.87194 16.2656 7.82896 16.2799 7.74299 16.3086L6.07486 16.8646C5.77455 16.9647 5.62439 17.0148 5.52057 16.9399C5.41675 16.8651 5.41675 16.7068 5.41675 16.3903Z" />
                                                                                            <path d="M7.91675 11.25L11.2501 11.25" stroke-linecap="round" />
                                                                                            <path d="M7.91675 13.75L12.0834 13.75" stroke-linecap="round" />
                                                                                            <path d="M14.5834 5.41732V5.41732C14.5834 3.97799 14.5834 3.25833 14.1954 2.76756C14.1087 2.65791 14.0095 2.55874 13.8998 2.47204C13.4091 2.08398 12.6894 2.08398 11.2501 2.08398H8.75008C7.31076 2.08398 6.5911 2.08398 6.10032 2.47204C5.99068 2.55874 5.8915 2.65791 5.8048 2.76756C5.41675 3.25833 5.41675 3.97799 5.41675 5.41732V5.41732" />
                                                                                        </svg>
                                                                                     </button>


                                                                              ` : ``}
                                                                             ${response.deletePermission === "true" ? `
                                                                                       <button type="button" class="btn-delete RemoveBtn" data-delete-id="${item.id}">
                                                                                    <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 22 22" fill="none" stroke="currentColor">
                                                                                        <path d="M8.70825 13.2915L8.70825 10.5415" stroke-linecap="round" />
                                                                                        <path d="M13.2917 13.2915L13.2917 10.5415" stroke-linecap="round" />
                                                                                        <path d="M2.75 5.9585H19.25V5.9585C18.122 5.9585 17.558 5.9585 17.1279 6.17946C16.7561 6.3704 16.4536 6.67297 16.2626 7.04469C16.0417 7.47488 16.0417 8.03886 16.0417 9.16683V13.8752C16.0417 15.7608 16.0417 16.7036 15.4559 17.2894C14.8701 17.8752 13.9273 17.8752 12.0417 17.8752H9.95833C8.07271 17.8752 7.12991 17.8752 6.54412 17.2894C5.95833 16.7036 5.95833 15.7608 5.95833 13.8752V9.16683C5.95833 8.03886 5.95833 7.47488 5.73737 7.04469C5.54643 6.67297 5.24386 6.3704 4.87214 6.17946C4.44195 5.9585 3.87797 5.9585 2.75 5.9585V5.9585Z" stroke-linecap="round" />
                                                                                        <path d="M8.70841 3.20839C8.70841 3.20839 9.16675 2.2915 11.0001 2.2915C12.8334 2.2915 13.2917 3.20817 13.2917 3.20817" stroke-linecap="round" />
                                                                                    </svg>
                                                                                    <span class="mx-1">حذف</span>
                                                                                        </button>

                                                                              ` : ``}

                                                                            
                                                                        </div>
                                                                            </div>
                                                                            </div>

                                                                            <div class="Rtable-cell d-md-flex d-none width10">
                                                                                <div class="Rtable-cell--content align-items-center d-flex d-md-block text-end">
                                                                               ${response.printPermission === "true" ? `

                                                                                    <button class="btn-print moreThan992" type="button" onclick="printOne(${item.id}, '${item.year}', '${item.month}')">
                                                                                        <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none" stroke="currentColor">
                                                                                            <path d="M15.0001 11.2493H15.139C16.0279 11.2493 16.4723 11.2493 16.759 10.9866C16.7805 10.967 16.801 10.9464 16.8207 10.9249C17.0834 10.6382 17.0834 10.1938 17.0834 9.3049V9.3049C17.0834 7.52714 17.0834 6.63826 16.558 6.06484C16.5187 6.02194 16.4775 5.98077 16.4346 5.94146C15.8612 5.41602 14.9723 5.41602 13.1945 5.41602H6.91675C5.03113 5.41602 4.08832 5.41602 3.50253 6.0018C2.91675 6.58759 2.91675 7.5304 2.91675 9.41602V10.2493C2.91675 10.7208 2.91675 10.9565 3.06319 11.1029C3.20964 11.2493 3.44534 11.2493 3.91675 11.2493H5.00008" />
                                                                                            <path d="M5.41675 16.3903L5.41675 9.91732C5.41675 8.97451 5.41675 8.5031 5.70964 8.21021C6.00253 7.91732 6.47394 7.91732 7.41675 7.91732L12.5834 7.91732C13.5262 7.91732 13.9976 7.91732 14.2905 8.21021C14.5834 8.5031 14.5834 8.97451 14.5834 9.91732L14.5834 16.3903C14.5834 16.7068 14.5834 16.8651 14.4796 16.9399C14.3758 17.0148 14.2256 16.9647 13.9253 16.8646L12.2572 16.3086C12.1712 16.2799 12.1282 16.2656 12.0839 16.2669C12.0396 16.2682 11.9975 16.285 11.9134 16.3187L10.1858 17.0097C10.0941 17.0464 10.0482 17.0647 10.0001 17.0647C9.95194 17.0647 9.90609 17.0464 9.81439 17.0097L8.0868 16.3187C8.00267 16.285 7.9606 16.2682 7.91627 16.2669C7.87194 16.2656 7.82896 16.2799 7.74299 16.3086L6.07486 16.8646C5.77455 16.9647 5.62439 17.0148 5.52057 16.9399C5.41675 16.8651 5.41675 16.7068 5.41675 16.3903Z" />
                                                                                            <path d="M7.91675 11.25L11.2501 11.25" stroke-linecap="round" />
                                                                                            <path d="M7.91675 13.75L12.0834 13.75" stroke-linecap="round" />
                                                                                            <path d="M14.5834 5.41732V5.41732C14.5834 3.97799 14.5834 3.25833 14.1954 2.76756C14.1087 2.65791 14.0095 2.55874 13.8998 2.47204C13.4091 2.08398 12.6894 2.08398 11.2501 2.08398H8.75008C7.31076 2.08398 6.5911 2.08398 6.10032 2.47204C5.99068 2.55874 5.8915 2.65791 5.8048 2.76756C5.41675 3.25833 5.41675 3.97799 5.41675 5.41732V5.41732" />
                                                                                        </svg>
                                                                                    </button>


                                                                              ` : ``}
                                                                             ${response.deletePermission === "true" ? `

                                                                                    <button type="button" class="btn-delete RemoveBtn" data-delete-id="${item.id}">
									                                                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 22 22" fill="none" stroke="currentColor">
										                                                <path d="M8.70825 13.2915L8.70825 10.5415" stroke-linecap="round" />
										                                                <path d="M13.2917 13.2915L13.2917 10.5415" stroke-linecap="round" />
										                                                <path d="M2.75 5.9585H19.25V5.9585C18.122 5.9585 17.558 5.9585 17.1279 6.17946C16.7561 6.3704 16.4536 6.67297 16.2626 7.04469C16.0417 7.47488 16.0417 8.03886 16.0417 9.16683V13.8752C16.0417 15.7608 16.0417 16.7036 15.4559 17.2894C14.8701 17.8752 13.9273 17.8752 12.0417 17.8752H9.95833C8.07271 17.8752 7.12991 17.8752 6.54412 17.2894C5.95833 16.7036 5.95833 15.7608 5.95833 13.8752V9.16683C5.95833 8.03886 5.95833 7.47488 5.73737 7.04469C5.54643 6.67297 5.24386 6.3704 4.87214 6.17946C4.44195 5.9585 3.87797 5.9585 2.75 5.9585V5.9585Z" stroke-linecap="round" />
										                                                <path d="M8.70841 3.20839C8.70841 3.20839 9.16675 2.2915 11.0001 2.2915C12.8334 2.2915 13.2917 3.20817 13.2917 3.20817" stroke-linecap="round" />
									                                                </svg>
									                                                <span class="mx-1">حذف</span>
								                                                    </button>


                                                                              ` : ``}


                                                                                </div>
                                                                            </div>
                                                                    </div>

                                        `;

                        $('.tb').append(html);
                        document.querySelectorAll('[data-bs-toggle="tooltip"]').forEach(el => {
                            bootstrap.Tooltip.getOrCreateInstance(el);
                        });
                        n += 1;
                    });
                    updateRowNumbers();
                    var newPageIndex = pageIndex + response.pageIndex;
                    $('#pageIndex').val(newPageIndex);
                }
            },
            failure: function (response) {
                console.log(5, response);
            }
        });
    }
}

$('.goToTop').on('click', function () {
    $('html, body').animate({ scrollTop: 0 }, 360);
    return false;
});

$(window).scroll(function () {
    if ($(window).scrollTop() + $(window).height() > $(document).height() - 600) {
        // goToTop();
        loadMore();
    }

    if ($(this).scrollTop() > 100) {
        $('.goToTop').show().fadeIn();
    } else {
        $('.goToTop').fadeOut().hide();
    }
});

function printOne(id, year, month) {
    var checkoutId = '&checkoutId=' + id;
    var yearFa = '&yearFa=' + year;
    var monthFa = '&monthFa=' + month;

    var url = PrintOneUrl;
    window.location.href = url + checkoutId + yearFa + monthFa;
}

function printAll() {
    var idlist = "";
    var year = $('#Year').val();
    var month = $('#Month').val();


    if (year === '0' || month === '0') {
        $('#dropdown-year').addClass("errored");
        $('#dropdown-month').addClass("errored");
        $('.alert-msg').show();
        $('.alert-msg p').text('لطفا سال و ماه را انتخاب نموده و جستجو نمایید');
        setTimeout(function () {
            $('.alert-msg').hide();
            $('.alert-msg p').text('');
            $('#dropdown-year').removeClass("errored");
            $('#dropdown-month').removeClass("errored");
        }, 3500);
        return
    }

    if (!($('input:checkbox').is(":checked"))) {
        $('.alert-msg').show();
        $('.alert-msg p').text('هیچ موردی انتخاب نشده است.');
        setTimeout(function () {
            $('.alert-msg').hide();
            $('.alert-msg p').text('');
        }, 3500);
        return
    }

    $('.foo').each(function () {
        if ($(this).is(":checked")) {

            var a = $(this).val();
            var b = a + "+";
            idlist += b;

        }
    });

    if (idlist !== "") {

        var url = CheckoutPrintAllUrl;
        var yearFa = '&yearFa=' + year;
        var monthFa = '&monthFa=' + month;
        //console.log(url + '?checkoutId=' + idlist + yearFa + monthFa);
        window.location.href = url + '?idlist=' + idlist + yearFa + monthFa;
    }
}

function showExcelAllModal() {
    var year = $('#Year').val();
    var month = $('#Month').val();

    if (year === '0' || month === '0') {
        $('#dropdown-year').addClass("errored");
        $('#dropdown-month').addClass("errored");
        $('.alert-msg').show();
        $('.alert-msg p').text('لطفا سال و ماه را انتخاب نموده و جستجو نمایید');
        setTimeout(function () {
            $('.alert-msg').hide();
            $('.alert-msg p').text('');
            $('#dropdown-year').removeClass("errored");
            $('#dropdown-month').removeClass("errored");
        }, 3500);
        return
    }

    if (!($('.foo:checkbox').is(":checked"))) {
        $('.alert-msg').show();
        $('.alert-msg p').text('هیچ موردی انتخاب نشده است.');
        setTimeout(function () {
            $('.alert-msg').hide();
            $('.alert-msg p').text('');
        }, 3500);
        return
    }

    window.location.href = showCheckoutExcelModalUrl;
}

function downloadExcelAll() {
    var year = $('#Year').val();
    var month = $('#Month').val();

    if (year === '0' || month === '0') {
        $('#dropdown-year').addClass("errored");
        $('#dropdown-month').addClass("errored");
        $('.alert-msg').show();
        $('.alert-msg p').text('لطفا سال و ماه را انتخاب نموده و جستجو نمایید');
        setTimeout(function () {
            $('.alert-msg').hide();
            $('.alert-msg p').text('');
            $('#dropdown-year').removeClass("errored");
            $('#dropdown-month').removeClass("errored");
        }, 3500);
        return
    }

    if (!($('.foo:checkbox').is(":checked"))) {
        $('.alert-msg').show();
        $('.alert-msg p').text('هیچ موردی انتخاب نشده است.');
        setTimeout(function () {
            $('.alert-msg').hide();
            $('.alert-msg p').text('');
        }, 3500);
        return
    }


    var idlist = "";
    $('.foo').each(function () {
        if ($(this).is(":checked")) {

            var a = $(this).val();
            var b = a + "+";
            idlist += b;

        }
    });

    var filterArray = [];
    $("input[name='filter[]']:checked").each(function () {
        filterArray.push($(this).val());
    });


    if (idlist !== "") {
        //var url = CheckoutExcelAllUrl + "&idList=" + idlist;
        var url = CheckoutExcelAllUrl + "&idList=" + encodeURIComponent(idlist);

        filterArray.forEach(function (filter) {
            url += "&filter=" + encodeURIComponent(filter);
        });
        window.open(url, "_blank");
    }
}

function printAllMobile() {
    var idlist = "";
    var year = $('#Year').val();
    var month = $('#Month').val();


    if (year === '0' || month === '0') {
        $('#dropdown-year').addClass("errored");
        $('#dropdown-month').addClass("errored");
        $('.alert-msg').show();
        $('.alert-msg p').text('لطفا سال و ماه را انتخاب نموده و جستجو نمایید');
        setTimeout(function () {
            $('.alert-msg').hide();
            $('.alert-msg p').text('');
            $('#dropdown-year').removeClass("errored");
            $('#dropdown-month').removeClass("errored");
        }, 3500);
        return
    }

    if (!($('input:checkbox').is(":checked"))) {
        $('.alert-msg').show();
        $('.alert-msg p').text('هیچ موردی انتخاب نشده است.');
        setTimeout(function () {
            $('.alert-msg').hide();
            $('.alert-msg p').text('');
        }, 3500);
        return
    }

    $('.fooMobile').each(function () {
        if ($(this).is(":checked")) {

            var a = $(this).val();
            var b = a + "+";
            idlist += b;

        }
    });

    if (idlist !== "") {

        var url = CheckoutPrintAllUrl;
        var yearFa = '&yearFa=' + year;
        var monthFa = '&monthFa=' + month;
        //console.log(url + '?checkoutId=' + idlist + yearFa + monthFa);
        window.location.href = url + '?idlist=' + idlist + yearFa + monthFa;
    }
}
//------------------------------------------------------------------------------------



function openCreateCheckoutUnofficialModal() {
    var goTo = `#showmodal=/Client/Company/CustomizeCheckout/CheckoutUnofficial?handler=Create`;
    window.location.href = goTo;
}

function ajaxPersonals() {
    var selectEmplyeeID = $('#employeeId').val();
    $.ajax({
        url: employeeListAjax,
        type: 'GET',
        success: function (response) {
            if (response.success) {
                var employees = response.data;
                var employeeOptionsHtml = '<option value="0">انتخاب پرسنل ...</option>';
                employees.forEach(function (employee) {
                    var black = employee.black ? "blackSelect" : "";
                    employeeOptionsHtml += `<option class="${black}" value="${employee.id}" ${selectEmplyeeID == employee.id ? 'selected' : ''}>${employee.employeeFullName}</option>`;
                });
                $('#getPersonnel').html(employeeOptionsHtml);
                $('#getPersonnelMobile').html(employeeOptionsHtml);
            } else {
                $('.alert-msg').show();
                $('.alert-msg p').text(response.message);
                setTimeout(function () {
                    $('.alert-msg').hide();
                    $('.alert-msg p').text('');
                }, 3500);
            }
        },
        error: function (xhr, status, error) {
            console.error(xhr.responseText);
        }
    });
}



$(document).on('click', '.RemoveBtn', function () {
    var id = $(this).data("delete-id");
    var button = this;

    swal({
        title: "آیا از حذف این فیش حقوقی نهایی اطمینان دارید؟",
        text: "",
        type: "warning",
        showCancelButton: true,
        confirmButtonColor: "#DD6B55",
        confirmButtonText: "بله",
        cancelButtonText: "خیر",
        closeOnConfirm: true,
        closeOnCancel: true
    }, function (isConfirm) {
        if (isConfirm) {
            deleteOneItem(id, button);
        }
    });
});
function updateRowNumbers() {
    $('.Rtable-row').each(function (index) {
        $(this).find('.row-number').text(index);
    });
}
function deleteOneItem(id, button) {
    $.ajax({
        async: false,
        type: 'POST',
        url: deleteOneAjax,
        data: { checkoutId: Number(id) },
        headers: { "RequestVerificationToken": `${antiForgeryToken}` },
        success: function (response) {
            if (response.success) {
                $('.alert-success-msg').show();
                $('.alert-success-msg p').text(response.message);
                setTimeout(function () {
                    $('.alert-success-msg').hide();
                    $('.alert-success-msg p').text('');
                }, 2000);

                $(button).closest('.Rtable-row').remove();
                updateRowNumbers();

            } else {
                $('.alert-msg').show();
                $('.alert-msg p').text(response.message);
                setTimeout(function () {
                    $('.alert-msg').hide();
                    $('.alert-msg p').text('');
                }, 3000);
            }
        },
        failure: function (response) {
            console.log(5, response);
        }
    });
}



$('.RemoveBtnAll').on("click", function () {
    var idListArray = [];
    var year = $('#Year').val();
    var month = $('#Month').val();

    if (year === '0' || month === '0') {
        $('#dropdown-year').addClass("errored");
        $('#dropdown-month').addClass("errored");
        $('.alert-msg').show();
        $('.alert-msg p').text('لطفا سال و ماه را انتخاب نموده و جستجو نمایید');
        setTimeout(function () {
            $('.alert-msg').hide();
            $('.alert-msg p').text('');
            $('#dropdown-year').removeClass("errored");
            $('#dropdown-month').removeClass("errored");
        }, 3500);
        return
    }

    if (!($('input:checkbox').is(":checked"))) {
        $('.alert-msg').show();
        $('.alert-msg p').text('هیچ موردی برای حذف گروهی انتخاب نشده است.');
        setTimeout(function () {
            $('.alert-msg').hide();
            $('.alert-msg p').text('');
        }, 3500);
        return
    }

    $('input[name="foo"]').each(function () {
        if ($(this).is(":checked")) {
            idListArray.push($(this).val());
        }
    });

    if (idListArray.length > 0) {
        swal({
            title: "آیا از حذف گروهی فیش حقوقی نهایی اطمینان دارید؟",
            text: "",
            type: "warning",
            showCancelButton: true,
            confirmButtonColor: "#DD6B55",
            confirmButtonText: "بله",
            cancelButtonText: "خیر",
            closeOnConfirm: true,
            closeOnCancel: true
        }, function (isConfirm) {
            if (isConfirm) {
                $.ajax({
                    async: false,
                    type: 'POST',
                    url: deleteAllAjax,
                    data: { checkoutIds: idListArray },
                    headers: { "RequestVerificationToken": `${antiForgeryToken}` },
                    success: function (response) {
                        if (response.success) {
                            $('.alert-success-msg').show();
                            $('.alert-success-msg p').text(response.message);
                            setTimeout(function () {
                                $('.alert-success-msg').hide();
                                $('.alert-success-msg p').text('');
                            }, 2000);
                            $('input[name="foo"]:checked').each(function () {
                                $(this).closest('.Rtable-row').remove();
                            });
                            updateRowNumbers();

                        } else {
                            $('.alert-msg').show();
                            $('.alert-msg p').text(response.message);
                            setTimeout(function () {
                                $('.alert-msg').hide();
                                $('.alert-msg p').text('');
                            }, 3000);
                        }
                    },
                    failure: function (response) {
                        console.log(5, response);
                    }
                });
            }
        });
    }
})