Files
Backend-Api/ServiceHost/wwwroot/AssetsAdminNew/RollCall/js/EmployeeUploadPicture.js

421 lines
19 KiB
JavaScript

var pageIndexMain = 0;
var searchName = '';
$(document).ready(function () {
$('.loadingButton').on('click', function () {
var button = $(this);
var loadingDiv = button.find('.loading');
loadingDiv.show();
});
loadInfoCount();
loadDataAjax();
});
//$(document).on('click', '.desktop-btn, .mobile-btn', function () {
// var id = $(this).attr('id').split('_')[1];
// var isActive = $(this).hasClass('btn-deactive') ? 'deactive' : 'active';
// togglePersonnelStatus(id, isActive);
//});
$(document).on('change', '.toggle-switch-desktop, .toggle-switch-mobile', function () {
var id = $(this).attr('id').split('_')[1]; // Extract ID from toggle switch ID
var isActive = $(this).is(':checked') ? 'active' : 'deactive'; // Check if the switch is active (checked)
togglePersonnelStatus(id, isActive);
});
$('.btn-search-click').on('click', function () {
var isValidSearch = $('#personnelSearch').val().trim();
if (isValidSearch == '') {
$('.alert-msg').show();
$('.alert-msg p').text('نام پرسنل را وارد نمائید');
$('#personnelSearch').addClass('errored');
setTimeout(function () {
$('.alert-msg').hide();
$('.alert-msg p').text('');
$('#personnelSearch').removeClass('errored');
}, 3500);
return;
}
pageIndexMain = 0;
searchName = $('#personnelSearch').val();
$('#filterRemove').removeClass('disable');
$('#ajaxDataLoad').html('');
$('#loadingSkeleton').css('display', 'contents');
loadDataAjax();
});
$('.btn-clear-filter').on('click', function () {
pageIndexMain = 0;
searchName = '';
$('#personnelSearch').val('');
$('#ajaxDataLoad').html('');
$('#loadingSkeleton').css('display', 'contents');
$('#filterRemove').addClass('disable');
loadDataAjax();
});
function loadDataAjax() {
var b = pageIndexMain % 30;
var html = '';
if (b === 0) {
$.ajax({
async: false,
contentType: 'charset=utf-8',
dataType: 'json',
type: 'GET',
url: loadEmployeeUploadDataAjax,
data: {
pageIndex: pageIndexMain,
searchName: searchName,
workshopId: wpId
},
headers: { "RequestVerificationToken": `${antiForgeryToken}` },
success: function (response) {
console.log(response);
if (response.pageIndex > 0) {
var n = pageIndexMain + 1;
var dataLoad = response.data.personnelInfoViewModels;
dataLoad.forEach(function (item) {
html += `
<div></div>
<div id="Section_${item.employeeId}" class="Rtable-row align-items-center position-relative ${(item.isActiveString === "false" && item.hasUploadedImage === "false") ? `deactive` : ``} ${item.Black ? `disable` : ``}">
<div class="Rtable-cell d-md-block d-none width1">
<div class="Rtable-cell--heading">
ردیف
</div>
<div class="Rtable-cell--content">
<span class="d-flex justify-content-center align-items-center justify-content-center">
${n}
</span>
</div>
</div>
<div class="Rtable-cell d-md-block d-none width2">
<div class="Rtable-cell--heading">نام و نام خانوادگی</div>
<div class="Rtable-cell--content d-flex align-items-center">`;
if (item.hasUploadedImage === "true") {
if (item.imagePath === "") {
html += `<img id="ImageEmployee_${item.employeeId}" src="/AssetsClient/images/Credits.png" class="img-avatar border border-2 border-danger" alt="">`;
} else {
html += `<img id="ImageEmployee_${item.employeeId}" src="data:image/jpeg;base64,${item.imagePath}" class="img-avatar" />`;
}
}
else {
html += `<img id="ImageEmployee_${item.employeeId}" src="/AssetsClient/images/Credits.png" class="img-avatar" alt="">`;
}
html += `<div id="EmployeeFullName_${item.employeeId}">${item.employeeFullName}</div>
</div>
</div>
<div class="Rtable-cell d-md-block d-none width3">
<div class="Rtable-cell--heading">کد ملی</div>
<div class="Rtable-cell--content">${item.nationalCode}</div>
</div>
<div class="Rtable-cell d-md-block d-none width4">
<div class="Rtable-cell--heading">وضعیت عکس</div>
<div class="Rtable-cell--content">`;
if (item.hasUploadedImage === "true") {
html += `<p id="TextUpload_${item.employeeId}" class="m-0">عکس پرسنل آپلود شده است</p>`;
}
else {
html += `<p id="TextUpload_${item.employeeId}" class="m-0 text-danger">عکس پرسنل آپلود نشده است</p>`;
}
var isActive = item.isActiveString === "true" ? "deactive" : "active";
html += `</div>
</div>
<div class="Rtable-cell d-md-flex d-none justify-content-end width5">
<div class="Rtable-cell--content align-items-center d-flex d-md-flex text-end me-3">
<div class="d-flex align-items-center justify-content-center">
<span class="mx-1 df">فعال</span>
<label class="switch">
<input type="checkbox"
id="togglePersonnelStatus_${item.id}_desktop"
class="toggle-switch-desktop btnAvticeAction_${item.employeeId} ${item.isActiveString === "true" ? `btn-deactive` : item.hasUploadedImage === "false" ? `disable` : `btn-active`}"
${item.isActiveString === "true" ? `checked` : ``}
${item.hasUploadedImage === "false" ? `disabled` : ``}>
<span class="sliderEUP"></span>
</label>
<span class="mx-1 df">غیر فعال</span>
</div>
</div>
<div class="Rtable-cell--content align-items-center d-flex d-md-block text-end me-1 ${item.isActiveString === "true" ? `` : item.hasUploadedImage === "false" ? `disable` : ``}">
<button class="btn-upload" type="button" onclick='ModalChaneName(${item.employeeId})' style="width: 95px;">
ویرایش نام
</button>
</div>
<div class="Rtable-cell--content align-items-center d-flex d-md-block text-end">
<button class="btn-upload" type="button" onclick='ModalUploadPics(${item.employeeId})' id="uploadMobileBTN_${item.employeeId}" style="width: 95px;">
${item.hasUploadedImage === "true" ? `ویرایش عکس` : `بارگذاری عکس`}
</button>
</div>
</div>
<div class="table-rollcall-mobile w-100 d-flex d-md-none align-items-center justify-content-between">
<div class="d-flex justify-content-center align-items-center justify-content-between">
<div class="Rtable-cell--content">
<span class="d-flex justify-content-center align-items-center justify-content-center" style="width: 30px;height: 30px;">
${n}
</span>
</div>
<div class="Rtable-cell--content">
<span class="mx-2">`;
if (item.hasUploadedImage === "true") {
if (item.imagePath === "") {
html += `<img id="ImageEmployeeMobile_${item.employeeId}" src="/AssetsClient/images/Credits.png" class="img-avatar border border-2 border-danger" alt="">`;
} else {
html += `<img id="ImageEmployeeMobile_${item.employeeId}" src="data:image/jpeg;base64,${item.imagePath}" class="img-avatar" />`;
}
}
else {
html += `<img id="ImageEmployeeMobile_${item.employeeId}" src="/AssetsClient/images/Credits.png" class="img-avatar" alt="">`;
}
html += `</span>
</div>
<div class="Rtable-cell--content my-auto">
<div class="title-mobile" style="width: 132px;" id="EmployeeFullNameMobile_${item.employeeId}">${item.employeeFullName}</div>
<div class="content-mobile">`;
if (item.hasUploadedImage === "true") {
html += `<p id="TextUploadMobile_${item.employeeId}" class="m-0">عکس پرسنل آپلود شده است</p>`;
}
else {
html += `<p id="TextUploadMobile_${item.employeeId}" class="m-0 text-danger">عکس پرسنل آپلود نشده است</p>`;
}
html += `</div>
</div>
</div>
<div class="Rtable-cell--content d-flex justify-content-end align-items-center">
<div class="Rtable-cell--heading d-block text-center" style="width: 120px;">
<div class="Rtable-cell--content align-items-center d-block text-end">
<div class="d-flex align-items-center justify-content-evenly gap-2 px-2">
<button class="btn-upload ${item.isActiveString === "true" ? `` : item.hasUploadedImage === "false" ? `disable` : ``}"" type="button" onclick='ModalChaneName(${item.employeeId})' style="width: 50%; height: 30px;">
<svg width="20" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L6.832 19.82a4.5 4.5 0 0 1-1.897 1.13l-2.685.8.8-2.685a4.5 4.5 0 0 1 1.13-1.897L16.863 4.487Zm0 0L19.5 7.125" />
</svg>
</button>
<button class="btn-upload-mobile text-nowrap" type="button" id="uploadMobileBTNMobile_${item.employeeId}" onclick='ModalUploadPics(${item.employeeId})' style="width: 50%; height: 30px; padding: 0;">
<svg width="20" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" d="M6.827 6.175A2.31 2.31 0 0 1 5.186 7.23c-.38.054-.757.112-1.134.175C2.999 7.58 2.25 8.507 2.25 9.574V18a2.25 2.25 0 0 0 2.25 2.25h15A2.25 2.25 0 0 0 21.75 18V9.574c0-1.067-.75-1.994-1.802-2.169a47.865 47.865 0 0 0-1.134-.175 2.31 2.31 0 0 1-1.64-1.055l-.822-1.316a2.192 2.192 0 0 0-1.736-1.039 48.774 48.774 0 0 0-5.232 0 2.192 2.192 0 0 0-1.736 1.039l-.821 1.316Z" />
<path stroke-linecap="round" stroke-linejoin="round" d="M16.5 12.75a4.5 4.5 0 1 1-9 0 4.5 4.5 0 0 1 9 0ZM18.75 10.5h.008v.008h-.008V10.5Z" />
</svg>
</button>
</div>
<div class="d-flex align-items-center justify-content-center mt-1">
<div class="mx-1 df" style="font-size: 10px;">فعال</div>
<label class="switch">
<input type="checkbox"
id="togglePersonnelStatus_${item.id}_mobile"
class="toggle-switch-mobile btnAvticeAction_${item.employeeId} ${item.isActiveString === "true" ? `btn-deactive` : item.hasUploadedImage === "false" ? `disable` : `btn-active`}"
${item.isActiveString === "true" ? `checked` : ``}
${item.hasUploadedImage === "false" ? `disabled` : ``}>
<div class="sliderEUP"></div>div
</label>
<div class="mx-1 df" style="font-size: 10px;">غیر فعال</div>
</div>
</div>
</div>
</div>
</div>
</div>`;
n += 1;
});
$('#ajaxDataLoad').append(html);
$('#loadingSkeleton').hide();
var newPageIndex = pageIndexMain + response.pageIndex;
pageIndexMain = newPageIndex;
} else {
html += `<div></div>
<div class="text-center bg-white d-flex align-items-center justify-content-center w-100">
<div class="">
<img src="/assetsclient/images/empty.png" alt="" class="img-fluid" />
<h5>اطلاعاتی وجود ندارد.</h5>
</div>
</div>`;
$('#ajaxDataLoad').append(html);
$('#loadingSkeleton').hide();
}
},
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) {
loadDataAjax();
}
if ($(this).scrollTop() > 100) {
$('.goToTop').show().fadeIn();
} else {
$('.goToTop').fadeOut().hide();
}
});
function loadInfoCount() {
$.ajax({
async: false,
dataType: 'json',
url: loadInfoCountAjax,
type: 'GET',
data: { workshopId: wpId },
success: function (response) {
if (response.isSuccedded) {
$('#maxPersonValid').text(response.maxPersonValid);
$('#isTrueActiveCount').text(response.isTrueActiveCount);
$('#isFalseActiveCount').text(response.isFalseActiveCount);
} 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);
}
});
}
function ModalUploadPics(employeeID)
{
$.ajax({
async: false,
dataType: 'json',
url: checkModalTakeImageAjax,
type: 'GET',
data: { workshopId: wpId },
success: function (response) {
if (response.isSuccedded) {
window.location.href = `#showmodal=/AdminNew/Company/RollCall/EmployeeUploadPicture?employeeId=${employeeID}&handler=ModalTakeImages`;
} 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);
}
});
}
function togglePersonnelStatus(id, type) {
var urlType = "";
switch (type) {
case 'deactive':
urlType = deActivePersonnelAjax;
break;
case 'active':
urlType = activePersonnelAjax;
break;
default:
return;
}
const toggleDesktop = $(`#togglePersonnelStatus_${id}_desktop`);
const toggleMobile = $(`#togglePersonnelStatus_${id}_mobile`);
if (type === "deactive") {
swal.fire({
title: "اخطار",
text: "در صورت غیر فعال کردن این پرسنل، حقوق این ماه ایشان محاسبه نخواهد شد. آیا مطمئن هستید؟",
icon: "warning",
showCancelButton: true,
confirmButtonText: "بله",
cancelButtonText: "خیر",
confirmButtonColor: '#84cc16',
reverseButtons: true
}).then((result) => {
if (result.isConfirmed) {
actionPersonnelStatus(urlType, id, type, toggleDesktop, toggleMobile);
} else {
toggleDesktop.prop('checked', true);
toggleMobile.prop('checked', true);
}
});
} else {
actionPersonnelStatus(urlType, id, type, toggleDesktop, toggleMobile);
}
}
function actionPersonnelStatus(url, id, type, buttonDesktop, buttonMobile) {
$.ajax({
async: false,
dataType: 'json',
type: 'POST',
url: url,
headers: { "RequestVerificationToken": antiForgeryToken },
data: { id: id },
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);
loadInfoCount();
// Toggle both desktop and mobile buttons
if (type === "deactive") {
//$(`#IsActiveString_${id}_desktop`).text('فعال کردن');
//$(`#IsActiveString_${id}_mobile`).text('فعال کردن');
buttonDesktop.removeClass('btn-deactive').addClass('btn-active');
buttonMobile.removeClass('btn-deactive').addClass('btn-active');
} else {
//$(`#IsActiveString_${id}_desktop`).text('غیر فعال کردن');
//$(`#IsActiveString_${id}_mobile`).text('غیر فعال کردن');
buttonDesktop.removeClass('btn-active').addClass('btn-deactive');
buttonMobile.removeClass('btn-active').addClass('btn-deactive');
}
} else {
$('.alert-msg').show();
$('.alert-msg p').text(response.message);
buttonDesktop.prop('checked', false);
buttonMobile.prop('checked', false);
setTimeout(function () {
$('.alert-msg').hide();
$('.alert-msg p').text('');
}, 3500);
}
},
error: function (err) {
console.log(err);
}
});
}
function ModalChaneName(employeeID) {
window.location.href = `#showmodal=/AdminNew/Company/RollCall/EmployeeUploadPicture?employeeId=${employeeID}&workshopId=${wpId}&handler=ModalChangeName`;
}