@using Version = _0_Framework.Application.Version
@model CompanyManagment.App.Contracts.Leave.CreateLeave

@{
    <link href="~/AssetsClient/css/select2.css?ver=@Version.StyleVersion" rel="stylesheet" />
    <style>
        .errored {
            color: #FF3A3A !important;
            border: 1px solid #FF3A3A !important
        }

        #printSection {
            display: none;
        }

        .blackSelect {
            background-color: #cbd5e1;
        }
    </style>
}


<form role="form" method="post" name="create-leave-form" id="create-leave-form" autocomplete="off">
    
    <input type="hidden" asp-for="WorkshopId" />

	<div class="modal-content">
        <div class="modal-header d-block text-center position-relative">
            <button type="button" class="btn-close position-absolute text-start" data-bs-dismiss="modal" aria-label="Close"></button>
            <h5 class="modal-title" id="morakhasiEstehghaghiModalLabel">ثبت مرخصی</h5>
        </div>

        <div class="modal-body">
            <div class="container-fluid">
                <div class="row form-morakhasi-estehghaghi">
	                <div class="container-fluid">     
                        
		                <div class="row mb-3">
			                <div class="col-12">
				                <select class="form-select select2Option" aria-label="انتخاب پرسنل ..." asp-for="EmployeeId" id="employeeSelect">
					                <option value="">ابتدا کارگاه را انتخاب کنید ...</option>
				                </select>
			                </div>
		                </div>

		                <div id="cardSectionLeave" class="card border">
                            <div class="row my-3">
                                <div class="col-12 d-block d-sm-flex">
                                    <div class="d-flex align-items-center">
                                        <label class="d-flex justify-content-center align-items-center">نوع مرخصی:</label>
                                        <div class="inputGroup-morakhasi-type d-flex flex-sm-column">
                                            <div class="d-flex align-items-center mb-2">
                                                <div>
                                                    <input class="form-check-input LeaveType" type="radio" asp-for="LeaveType" id="paid" value="استحقاقی" checked>
                                                    <label class="form-check-label" for="paid">
                                                        استحقاقی
                                                    </label>
                                                </div>
                                            </div>

                                            <div>
                                                <input class="form-check-input LeaveType" type="radio" asp-for="LeaveType" id="sick" value="استعلاجی">
                                                <label class="form-check-label" for="sick">
                                                    استعلاجی
                                                </label>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="ms-sm-4" id="dailyType">
                                        <div class="d-flex align-items-center">
                                            <label class="d-block d-sm-flex justify-content-center align-items-center" for="inputGroup-morakhasi-time">مدت مرخصی:</label>
                                            <div class="inputGroup-morakhasi-time d-flex align-items-center">
                                                <input class="form-check-input LeaveTime" type="radio" asp-for="PaidLeaveType" id="daily" value="روزانه" checked>
                                                <label class="form-check-label" for="daily">
                                                    روزانه
                                                </label>

                                                <input class="form-check-input LeaveTime" type="radio" asp-for="PaidLeaveType" id="hourly" value="ساعتی">
                                                <label class="form-check-label" for="hourly">
                                                    ساعتی
                                                </label>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="row my-3">
                                <div class="col-lg-6 col-12 my-1">
                                    <div class="input-group">
                                        <label class="input-group-text" for="StartLeave">تاریخ شروع</label>
                                        <input type="text" asp-for="StartLeave" class="form-control d-flex justify-content-center align-items-center text-center date" id="StartLeave">
                                    </div>
                                </div>
                                <div class="col-lg-6 col-12 my-1" id="end_date_estehghaghi">
                                    <div class="input-group">
                                        <label class="input-group-text" for="EndLeave">تاریخ پایان</label>
                                        <input type="text" asp-for="EndLeave" class="form-control d-flex justify-content-center align-items-center text-center date" id="EndLeave">
                                    </div>
                                </div>
                                <div class="col-lg-3 col-6 my-1 time_paid" style="display:none;">
                                    <div class="input-group">
                                        <label class="input-group-text" for="start_time">ساعت شروع</label>
                                        <input type="text" asp-for="StartHoures" class="form-control d-flex justify-content-center align-items-center text-center dateTime" style="direction: ltr" id="StartHoures">
                                    </div>
                                </div>

                                <div class="col-lg-3 col-6 my-1 time_paid" style="display:none;">
                                    <div class="input-group">
                                        <label class="input-group-text" for="end_time">ساعت پایان</label>
                                        <input type="text" asp-for="EndHours" class="form-control d-flex justify-content-center align-items-center text-center dateTime" style="direction: ltr" id="EndHours">
                                    </div>
                                </div>



                                <p class="mt-2">
                                    <span>مدت مرخصی: </span>
                                    <span class="sumHours sumHourseDiv"></span>
                                    <span class="sumDaysDiv sumDays"></span>
                                </p>
                            </div>

                            <div class="row">
                                <div class="col-12">
                                    <div class="form-check form-switch d-flex align-items-center">
                                        <label class="form-check-label me-2" for="IsAccepted">عدم موافقت</label>
                                        <input type="checkbox" asp-for="IsAccepted" id="IsAccepted" class="form-check-input" checked>
                                        <label class="form-check-label" for="IsAccepted">موافقت</label>
                                    </div>
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-12">
                                    <div class="position-relative blur" id="blur-div">
                                        <div class="position-absolute title-legend">دلیل عدم موافقت:</div>
                                        <textarea asp-for="Decription" disabled="disabled" id="descriptionAcceptedCheck" class="w-100 my-3 p-2" cols="10" rows="2"></textarea>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="modal-footer">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-12 text-center">
                        <div class="d-flex justify-content-center">
                            <a class="btn-cancel text-white w-25 mx-2" data-bs-dismiss="modal" aria-label="Close">انصراف</a>
                            <a href="#" id="save" class="btn-primary text-white w-25 mx-2" style="padding: 10px 8px;font-size: 14px;">ثبت</a>
                            <a id="printSingle" class="btn-blue text-white w-25 mx-2" style="display: none">پرینت</a>
                            <input type="hidden" id="printSingleID" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</form>

<script src="~/assetsclient/libs/cleave/cleave.min.js"></script>
<script src="~/admintheme/js/jquery.mask_1.14.16.min.js"></script>
<style>
    .validTime {
        color: #4d7c0f !important;
    }

    .invalidTime {
        color: #b91c1c !important;
    }
</style>
<script>
    $(document).ready(function () {

        $('.loading').hide();
        
        $(".modal-xxl").css('max-width', '900px');

        document.getElementById("MainModal").style.visibility = "visible";

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


        //******************** شرط استحقاقی و استعلاجی ********************
        $(document).on("change", ".LeaveType", function () {
            if ($('#paid').is(':checked')) {
                $('#dailyType').css('visibility', 'visible');
            }

            if ($('#sick').is(':checked')) {
                $('#dailyType').css('visibility', 'hidden');
                $('#daily').prop('checked', true);
                if ($('#daily').is(':checked')) {
                    $('#end_date_estehghaghi').show();
                    $('.time_paid').hide();
                }
            }
        });

        // شرط ساعتی و روزانه
        $(document).on("change", ".LeaveTime", function () {
            if ($('#daily').is(':checked')) {
                $('#end_date_estehghaghi').show();
                $('.time_paid').hide();
            }

            if ($('#hourly').is(':checked')) {
                $('#end_date_estehghaghi').hide();
                $('.time_paid').show();
            }
        });
        //******************** شرط استحقاقی و استعلاجی ********************


        //******************** بلور کردن باکس ********************
        $('#IsAccepted').on('change', function () {
            if ($(this).is(':checked')) {
                $('#blur-div').addClass('blur');
                $('#descriptionAcceptedCheck').text('');
                $('#descriptionAcceptedCheck').attr('disabled', true);

            } else {
                $('#blur-div').removeClass('blur');
                $('#descriptionAcceptedCheck').attr('disabled', false);
            }
        });


        if ($('#IsAccepted').is(':checked')) {
            $('#blur-div').addClass('blur');
            $('#descriptionAcceptedCheck').text('');
            $('#descriptionAcceptedCheck').attr('disabled', true);
        } else {
            $('#blur-div').removeClass('blur');
            $('#descriptionAcceptedCheck').attr('disabled', false);
        }
        //******************** بلور کردن باکس ********************

        $(document).ready(function () {
            $(document).on("change", "#IsAccepted", function () {
                var IsAcceptedCheck = $('#IsAccepted').is(':checked');
                if (IsAcceptedCheck) {
                    $('#descriptionAcceptedCheck').removeClass('errored');
                    $('#descriptionAcceptedCheck').addClass('disable-input');
                    $("#descriptionAcceptedCheck").prop('disabled', true);
                } else {
                    $('#descriptionAcceptedCheck').removeClass('disable-input');
                    $("#descriptionAcceptedCheck").prop('disabled', false);
                }
            })
        });

        $('#save').on('click', function () {
            var workshopSelect = $("#WorkshopId").val();
        
            var employeeSelect = $("#employeeSelect").val();
            if (employeeSelect == '') {
                $('.alert-msg').show();
                $('.alert-msg p').text('لطفا پرسنل را انتخاب کنید ...');
                setTimeout(function () {
                    $('.alert-msg').hide();
                    $('.alert-msg p').text('');
                }, 3500);
                return false;
            }

            $("#descriptionAcceptedCheck").on("change", function () {
                $('#descriptionAcceptedCheck').removeClass('errored');
            });

            var IsAcceptedCheck = $('#IsAccepted').is(':checked');
            var descriptionAcceptedCheck = $('#descriptionAcceptedCheck').val();

            if (!IsAcceptedCheck && descriptionAcceptedCheck.length === 0) {
                $('#descriptionAcceptedCheck').addClass('errored');
                $('.alert-msg').show();
                $('.alert-msg p').text('لطفا توضیحات در صورت عدم موافقت را پر کنید.');
                setTimeout(function () {
                    $('.alert-msg').hide();
                    $('.alert-msg p').text('');
                }, 3500);
                return false;
            }

            if ($('.errored').length < 1) {

                $.ajax({
                    async: false,
                    dataType: 'json',
                    type: 'POST',
                    url: '@Url.Page("/Index", "LeaveSave")',
                    headers: { "RequestVerificationToken": $('@Html.AntiForgeryToken()').val() },
                    data: $('#create-leave-form').serialize(),
                    success: function (response) {
                        if (response.isSuccedded) {
                            $('.alert-success-msg').show();
                            $('.alert-success-msg p').text(response.message);
                            setTimeout(function () {
                                $('.alert-success-msg').hide();
                                $('.alert-success-msg p').text('');
                            }, 2000);

                            //$('#MainModal').modal('toggle');
                            $('#printSingleID').val(response.printID);
                            $('#printSingle').show();
                        } else {
                            $('.alert-msg').show();
                            $('.alert-msg p').text(response.message);
                            setTimeout(function () {
                                $('.alert-msg').hide();
                                $('.alert-msg p').text('');
                            }, 3500);
                        }
                    },
                    error: function (err) {
                        console.log(err);
                    }
                });
            } else {
                $('.alert-msg').show();
                $('.alert-msg p').text('لطفا خطاها را برطرف کنید.');
                setTimeout(function () {
                    $('.alert-msg').hide();
                    $('.alert-msg p').text('');
                }, 3500);
            }
        });

        $('#printSingle').on('click', function () {
            var id = $('#printSingleID').val();
            var parametr = '&id=' + id;
            var url = '#showmodal=@Url.Page("./Leave", "PrintOneMobile")';
            location.href = url + parametr;
        });


        // $(".date").mask("0000/00/00");
        $(".date").on('input', function () {
	        var value = $(this).val();
	        $(this).val(convertPersianNumbersToEnglish(value));
        }).mask("0000/00/00");
        $('.date').on('input',
            function () {
                let startDate = this.value;
                if (startDate.length == 10) {
                    let submitcheck = dateValidcheck(this);
                    if (submitcheck) {

                        $(this).removeClass('errored');
                        if ($('#StartLeave').val() != '' && $('#EndLeave').val() != '') {
                            computeDays();
                        }

                    } else {
                        $(this).addClass('errored');
                    }

                } else {
                    $(this).addClass('errored');
                }
            });

        function dateValidcheck(inputField1) {

            let persianNumbers = [/۰/g, /۱/g, /۲/g, /۳/g, /۴/g, /۵/g, /۶/g, /۷/g, /۸/g, /۹/g],
                arabicNumbers = [/٠/g, /١/g, /٢/g, /٣/g, /٤/g, /٥/g, /٦/g, /٧/g, /٨/g, /٩/g],
                fixNumbers = function (str) {
                    if (typeof str === 'string') {
                        for (var i = 0; i < 10; i++) {
                            str = str.replace(persianNumbers[i], i).replace(arabicNumbers[i], i);
                        }
                    }
                    return str;
                };
            let getdate = inputField1.value;

            let m1, m2;
            let y1, y2, y3, y4;
            let d1, d2;
            let s1, s2;
            for (var i = 0; i < getdate.length; i++) {
                if (i === 0) {
                    y1 = fixNumbers(getdate[i]);
                }
                if (i === 1) {
                    y2 = fixNumbers(getdate[i]);
                }
                if (i === 2) {
                    y3 = fixNumbers(getdate[i]);
                }
                if (i === 3) {
                    y4 = fixNumbers(getdate[i]);
                }
                if (i === 4) {
                    s1 = fixNumbers(getdate[i]);
                }
                if (i === 5) {
                    m1 = fixNumbers(getdate[i]);
                }
                if (i === 6) {
                    m2 = fixNumbers(getdate[i]);
                }
                if (i === 7) {
                    s2 = fixNumbers(getdate[i]);
                }
                if (i === 8) {
                    d1 = fixNumbers(getdate[i]);
                }
                if (i === 9) {
                    d2 = fixNumbers(getdate[i]);
                }

            }
            let yRes = y1 + y2 + y3 + y4;
            let year = parseInt(yRes);
            let mRes = m1 + m2;
            let month = parseInt(mRes);
            let dRes = d1 + d2;
            let day = parseInt(dRes);
            let fixResult = yRes + s1 + mRes + s2 + dRes;
            let test1 = checkEnValid(inputField1.value);

            let isValid = /^([1][3-4][0-9][0-9][/])([0][1-9]|[1][0-2])([/])([0][1-9]|[1-2][0-9]|[3][0-1])$/.test(fixResult);


            if (isValid && test1) {
                // inputField1.style.backgroundColor = '#a6e9a6';
                start1valid = true;
            } else {
                if (inputField1.value != "") {
                    // inputField1.style.backgroundColor = '#f94c4c';
                    $.Notification.autoHideNotify('error', 'top center', 'پیام سیستم ', "لطفا تاریخ را بصورت صحیح وارد کنید");
                    start1valid = false;
                }
            }
            return start1valid;

        }

        function checkEnValid(fixDate1) {

            let persianNumbers = [/۰/g, /۱/g, /۲/g, /۳/g, /۴/g, /۵/g, /۶/g, /۷/g, /۸/g, /۹/g],
                arabicNumbers = [/٠/g, /١/g, /٢/g, /٣/g, /٤/g, /٥/g, /٦/g, /٧/g, /٨/g, /٩/g],
                fixNumbers = function (str) {
                    if (typeof str === 'string') {
                        for (var i = 0; i < 10; i++) {
                            str = str.replace(persianNumbers[i], i).replace(arabicNumbers[i], i);
                        }
                    }
                    return str;
                };
            let getdate = fixDate1;

            let m1, m2;
            let y1, y2, y3, y4;
            let d1, d2;
            for (let i = 0; i < getdate.length; i++) {
                if (i === 0) {
                    y1 = fixNumbers(getdate[i]);
                }
                if (i === 1) {
                    y2 = fixNumbers(getdate[i]);
                }
                if (i === 2) {
                    y3 = fixNumbers(getdate[i]);
                }
                if (i === 3) {
                    y4 = fixNumbers(getdate[i]);
                }
                if (i === 5) {
                    m1 = fixNumbers(getdate[i]);
                }
                if (i === 6) {
                    m2 = fixNumbers(getdate[i]);
                }
                if (i === 8) {
                    d1 = fixNumbers(getdate[i]);
                }
                if (i === 9) {
                    d2 = fixNumbers(getdate[i]);
                }
            }
            let yRes = y1 + y2 + y3 + y4;
            let year = parseInt(yRes);
            let mRes = m1 + m2;
            let month = parseInt(mRes);
            let dRes = d1 + d2;
            let day = parseInt(dRes);
            let kabiseh = false;
            if (month <= 6 && day > 31) {
                return false;
            } else if (month > 6 && month < 12 && day > 30) {
                return false;
            } else if (month === 12) {

                switch (year) {
                    case 1346:
                        kabiseh = true;
                        break;
                    case 1350:
                        kabiseh = true;
                        break;
                    case 1354:
                        kabiseh = true;
                        break;
                    case 1358:
                        kabiseh = true;
                        break;
                    case 1362:
                        kabiseh = true;
                        break;
                    case 1366:
                        kabiseh = true;
                        break;
                    case 1370:
                        kabiseh = true;
                        break;
                    case 1375:
                        kabiseh = true;
                        break;
                    case 1379:
                        kabiseh = true;
                        break;
                    case 1383:
                        kabiseh = true;
                        break;
                    case 1387:
                        kabiseh = true;
                        break;
                    case 1391:
                        kabiseh = true;
                        break;
                    case 1395:
                        kabiseh = true;
                        break;
                    case 1399:
                        kabiseh = true;
                        break;
                    case 1403:
                        kabiseh = true;
                        break;
                    case 1408:
                        kabiseh = true;
                        break;
                    case 1412:
                        kabiseh = true;
                        break;
                    case 1416:
                        kabiseh = true;
                        break;
                    case 1420:
                        kabiseh = true;
                        break;
                    case 1424:
                        kabiseh = true;
                        break;
                    case 1428:
                        kabiseh = true;
                        break;
                    case 1432:
                        kabiseh = true;
                        break;
                    case 1436:
                        kabiseh = true;
                        break;
                    case 1441:
                        kabiseh = true;
                        break;
                    case 1445:
                        kabiseh = true;
                        break;
                    default:
                        kabiseh = false;

                }
                if (kabiseh == true && day > 30) {
                    return false;
                } else if (kabiseh == false && day > 29) {
                    return false;
                } else {
                    return true;
                }
            } else {
                return true;
            }
        }

        $('input:radio[name="PaidLeaveType"]').change(function () {
            if ($(this).is(':checked') && $(this).val() == 'روزانه') {
                $("#hours").val('');
                $("#hours").attr("disabled", "disabled");
                $("#endLeave").removeAttr("disabled");
                $('.endLeaveLabal').show();
                $('#StartHoures').removeClass("invalidTime");
                $('#StartHoures').val('');
                $('#EndHours').removeClass("invalidTime");
                $('#EndHours').val('');
                $("#endLeave").show();
                $('.res').remove();
                $('.validTime').removeClass("validTime");
                $('.sumHourseDiv').hide();
                $('.sumDaysDiv').show();
            } else if ($(this).is(':checked') && $(this).val() == 'ساعتی') {
                $("#endLeave").val('');
                $("#endLeave").attr("disabled", "disabled");
                $("#endLeave").hide();
                $('.endLeaveLabal').hide();
                $("#hours").removeAttr("disabled");
                $('.sumHourseDiv').show();
                $('.sumDaysDiv').hide();
            }
        });
        /////////////////Time Input Validatet/////////////////

        var selectEmployeeValue = $('#employeeSelect').val();
        if (selectEmployeeValue == '') {
            $('#cardSectionLeave').addClass('blur');
            $("#cardSectionLeave div *").prop('disabled', true);
        }

        $('#employeeSelect').change(function () {
            var selectValue = $('#employeeSelect').val();

            if (selectValue == '') {
                $('#cardSectionLeave').addClass('blur');
                $("#cardSectionLeave div *").prop('disabled', true);
            } else {
                $('#cardSectionLeave').removeClass('blur');
                $("#cardSectionLeave div *").prop('disabled', false);
                $('#descriptionAcceptedCheck').attr('disabled', true);
            }
        });



        $(".dateTime").each(function () {
	        new Cleave(this, {
		        time: true,
		        timePattern: ['h', 'm']
	        });
        });

        $("#StartHoures, #EndHours").on("keyup", validateTimeOrder);
        function parseTimeToMinutes(time) {
	        const [hours, minutes] = time.split(':').map(Number);
	        return hours * 60 + minutes;
        }

        function validateTimeOrder() {
	        const startTime = $("#StartHoures").val();
	        const endTime = $("#EndHours").val();

	        if (startTime && endTime) {
		        const startMinutes = parseTimeToMinutes(startTime);
		        const endMinutes = parseTimeToMinutes(endTime);

		        if (startMinutes >= endMinutes) {
			        $('.alert-success-msg').show();
			        $('.alert-success-msg p').text('ساعت شروع و پایان نامعتبر است');

			        $("#StartHoures, #EndHours").addClass("invalidTime").removeClass("validTime");

			        return false;
		        } else {
			        $('.alert-success-msg').hide();
			        $('.alert-success-msg p').text('');

			        $("#StartHoures, #EndHours").addClass("validTime").removeClass("invalidTime");

		        }

		        if ($("#StartHoures").val().length === 5 && $("#EndHours").val().length === 5) {
			        computeHourse();
		        }
	        }else {
		        $('.alert-msg').hide();
		        $('.alert-msg p').text('');
	        }
	        return true;
        }

        // $('#StartHoures').on("keyup",
        //     function () {
        //         var isValid = /^([2][0-3]|[1][0-9]|[0-9]|[0][0-9])([:][0-5][0-9])$/.test($(this).val());
        //         if (isValid) {
        //             $(this).addClass("validTime");
        //             $(this).removeClass("invalidTime");
        //             if ($('#EndHours').hasClass('validTime') && $('#EndHours').val() != null) {
        //                 computeHourse();
        //             }
        //         } else {
        //             $(this).removeClass("validTime");
        //             $(this).addClass("invalidTime");
        //         }
        //     });
        // $('#EndHours').on("keyup",
        //     function () {
        //         var isValid = /^([2][0-3]|[1][0-9]|[0-9]|[0][0-9])([:][0-5][0-9])$/.test($(this).val());
        //         if (isValid) {
        //             $(this).addClass("validTime");
        //             $(this).removeClass("invalidTime");
        //             if ($('#StartHoures').hasClass('validTime') && $('#StartHoures').val() != null) {
        //                 computeHourse();
        //             }
        //         } else {
        //             $(this).removeClass("validTime");
        //             $(this).addClass("invalidTime");
        //         }
        //     });

        function computeHourse() {
            $('.res').remove();
            $.ajax({
                async: false,
                dataType: 'json',
                type: 'GET',
                url: '@Url.Page("/Company/Employees/Index", "ComputeLeaveHourly")',
                headers: { "RequestVerificationToken": $('input[name="__RequestVerificationToken"]').val() },
                data: { "startHours": $('#StartHoures').val(), "endHours": $('#EndHours').val() },
                success: function (response) {
                    let res = `<span class="res">${response.res}</span>`;
                    $('.sumHours').append(res);
                },
                failure: function (response) {
                    console.log(5, response);
                }
            });
        }

        function computeDays() {
            $('.resultDays').remove();
            $.ajax({
                async: false,
                dataType: 'json',
                type: 'GET',
                url: '@Url.Page("/Company/Employees/Index", "ComputeLeaveDaily")',
                headers: { "RequestVerificationToken": $('input[name="__RequestVerificationToken"]').val() },
                data: { "startDay": $('#StartLeave').val(), "endDay": $('#EndLeave').val() },
                success: function (response) {
                    if (response.status == false) {
                        $('.sumDays').addClass("note");
                    } else {
                        $('.sumDays').removeClass("note");
                    }
                    let res = `<span class="resultDays">${response.res}</span>`;
                    $('.sumDays').append(res);
                },
                failure: function (response) {
                    console.log(5, response);
                }
            });
        }


        ajaxPersonals();
        function ajaxPersonals() {
            $.ajax({
                url: '@Url.Page("/Company/Employees/Index", "EmployeeList")',
                type: 'GET',
                success: function (response) {
                    console.log(response);
                    $('#cardSectionLeave').addClass('blur');
                    $("#cardSectionLeave div *").prop('disabled', true);
                    var employees = response.connectedPersonnel.connectedPersonnelViewModels;
                    var employeeOptionsHtml = '<option value="">انتخاب پرسنل ...</option>';
                    employees.forEach(function (employee) {
                        var black = employee.black ? "blackSelect" : "";
                        employeeOptionsHtml += `<option class="${black}" value="${employee.employeeId}">${employee.personName}</option>`;
                    });
                    $('#employeeSelect').html(employeeOptionsHtml);
                },
                error: function (xhr, status, error) {
                    console.error(xhr.responseText);
                }
            });
        }
    });
</script>
<script>

</script>