Files
Backend-Api/ServiceHost/Areas/Client/Pages/Company/Employees/LeaveCreateModal.cshtml

796 lines
33 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
@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>