Backend-Api/ServiceHost/wwwroot/AssetsAdminNew/ServiceAmountsManagement/js/Index.js

var ajax = new AjaxService(antiForgeryToken);
var pageIndexMain = 0;

$(document).on('click', ".openAction", function () {
    if (window.matchMedia('(max-width: 767px)').matches) {
        $(this).next().find(".operations-btns").slideToggle(500);
        $(".operations-btns").not($(this).next().find(".operations-btns")).slideUp(500);
    }
});

$(document).ready(function () {
    ajaxDataService();

    const { countPerson } = getSearchParamsFromUrl();
    $('#countPersonInput').val(countPerson);
    $('#countPersonInputMobile').val(countPerson);

    if (countPerson !== "") {
        $('.btn-clear-filter').removeClass('disable');
    } else {
        $('.btn-clear-filter').addClass('disable');
    }

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

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

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

    $('.btn-search-click').click(function () {
        var isMobile = window.matchMedia('(max-width: 767px)').matches;
        var inputCountPerson = isMobile ? $('#countPersonInputMobile') : $('#countPersonInput');

        if (inputCountPerson.val().trim() === '') {
            inputCountPerson.addClass('errored');
            $('.alert-msg').show();
            $('.alert-msg p').text('لطفا تعداد پرسنل وارد کنید.');

            setTimeout(function () {
                $('.alert-msg').hide();
                $('.alert-msg p').text('');
                inputCountPerson.removeClass('errored');
            }, 3500);

            return;
        }

        const { countPerson } = getSearchParamsFromUrl();
        var countPersonParams = countPerson;

        if (countPersonParams !== '') {
            $('.btn-clear-filter').removeClass('disable');
        } else {
            $('.btn-clear-filter').addClass('disable');
        }

        paramsUrl(inputCountPerson.val());
        
        pageIndexMain = 0;
        $('#LoadDataOfServices').html('<div></div>');
        ajaxDataService();

        if (isMobile) {
            $('#searchModal').modal('hide');
        }
        
    });
});

function ajaxDataService() {
    var htmlContent = '';
    const { countPerson } = getSearchParamsFromUrl();
    ajax.get(loadInstitutionPlanListUrl, { pageIndex: pageIndexMain, countPeron: countPerson }, false)
		.then(response => {
			pageIndexMain = pageIndexMain + response.pageIndex;
			var data = response.data;

			if (data.length > 0) {
				data.forEach(function (item, index) {
					htmlContent += `
						<div class="service-list Rtable-row align-items-center position-relative openAction p-0">
							<div class="Rtable-cell d-block width1">
								<div class="Rtable-cell--content text-center">${item.countPerson}</div>
							</div>
							<div class="Rtable-cell d-md-block d-none width2">
								<div class="Rtable-cell--content text-center">${item.contractAndCheckout}</div>
							</div>
							<div class="Rtable-cell d-md-block d-none width3">
								<div class="Rtable-cell--content text-center">${item.insurance}</div>
							</div>
							<div class="Rtable-cell d-md-block d-none width4">
								<div class="Rtable-cell--content text-center">${item.rollCall}</div>
							</div>
							<div class="Rtable-cell d-md-block d-none width5">
								<div class="Rtable-cell--content text-center">${item.customizeCheckout}</div>
							</div>
							<div class="Rtable-cell d-md-block d-none width6">
				                <div class="Rtable-cell--content text-center">${item.contractAndCheckoutInPerson}</div>
                            </div>
							<div class="Rtable-cell d-md-block d-none width7">
                                <div class="Rtable-cell--content text-center">${item.insuranceInPerson}</div>
                            </div>
                            <div class="Rtable-cell d-md-block d-none width8">
                                <div class="Rtable-cell--content text-center">${item.inPersonSumAmountStr}</div>
                            </div>
                            <div class="Rtable-cell d-md-block d-none width9">
                                <div class="Rtable-cell--content text-center">${item.onlineOnlySumAmountStr}</div>
                            </div>
                            <div class="Rtable-cell d-md-block d-none width10">
                                <div class="Rtable-cell--content text-center">${item.onlineAndInPersonSumAmountStr}</div>
                            </div>
							
							<div class="Rtable-cell d-md-none d-block width11">
                                <div class="Rtable-cell--content text-end">
								    <div class="my-1">
									    <span style="background-color: #B6F2E1;padding: 5px;border-radius: 4px;">عملیات بیشتر</span>
									</div>
								</div>
                            </div>
						</div>
                        <div class="operation-div w-100">
				            <div class="operations-btns">
					            <div class="row p-0">
						            <div class="d-flex align-items-center justify-content-between">
							            <span class="span1">تعداد پرسنل</span>
							            <span class="span1">${item.countPerson}</span>
						            </div>
						            <div class="d-flex align-items-center justify-content-between">
							            <span class="span2">مبلغ قرداد و تصفیه</span>
							            <span class="span2">${item.contractAndCheckout} ریال</span>
						            </div>
						            <div class="d-flex align-items-center justify-content-between">
							            <span class="span2">خدمات بیمه</span>
							            <span class="span2">${item.insurance} ریال</span>
						            </div>
						            <div class="d-flex align-items-center justify-content-between">
							            <span class="span2">خدمات خصور و غیاب</span>
							            <span class="span2">${item.rollCall} ریال</span>
						            </div>
						            <div class="d-flex align-items-center justify-content-between">
							            <span class="span2">خدمات فیش حقوقی غیر رسمی</span>
							            <span class="span2">${item.customizeCheckout} ریال</span>
						            </div>
                                    <div class="d-flex align-items-center justify-content-between">
                                        <span class="span2">خدمات حضوری قرارداد و تصفیه</span>
                                        <span class="span2">${item.contractAndCheckoutInPerson} ریال</span>
                                    </div>
                                    <div class="d-flex align-items-center justify-content-between">
                                        <span class="span2">خدمات حضور بیمه</span>
                                        <span class="span2">${item.insuranceInPerson} ریال</span>
                                    </div>
                                    <div class="d-flex align-items-center justify-content-between">
                                        <span class="span2">خدمات حضوری موسسه</span>
                                        <span class="span2">${item.inPersonSumAmountStr} ریال</span>
                                    </div>
                                    <div class="d-flex align-items-center justify-content-between">
                                        <span class="span2">مبلغ کل خدمات سامانه بدون خدمات خصوری</span>
                                        <span class="span2">${item.onlineOnlySumAmountStr} ریال</span>
                                    </div>
                                    <div class="d-flex align-items-center justify-content-between">
                                        <span class="span2">مبلغ کل خدمات سامانه + خدمات خصوری</span>
                                        <span class="span2">${item.onlineAndInPersonSumAmountStr} ریال</span>
                                    </div>
					            </div>
				            </div>
                        </div>
					`;
				});
				$('#LoadDataOfServices').append(htmlContent);
            }
        });
}

function openCreateModal() {
	AjaxUrlContentModal(showModalNewServiceUrl);
}

function paramsUrl(countPerson) {
    const params = new URLSearchParams();
    let hasAnyFilter = false;

    if (countPerson !== '') {
        params.set("count-person", countPerson);
        hasAnyFilter = true;
    }
    
    const newUrl = hasAnyFilter
        ? `${window.location.origin}/AdminNew/Company/ServiceAmountsManagement?${params.toString()}`
        : `${window.location.origin}/AdminNew/Company/ServiceAmountsManagement`;

    window.history.pushState({}, '', newUrl);
}

function getSearchParamsFromUrl() {
    const urlParams = new URLSearchParams(window.location.search);

    return {
        countPerson : urlParams.get("count-person") || ""
    };
}