admin/Backend-Api
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

camera ui changes - rollcall bug fixed

Browse Source
This commit is contained in:
SamSys
2024-09-16 20:34:57 +03:30
parent 774c0e8463
commit d8f14f611a
18 changed files with 1069 additions and 387 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
CompanyManagment.App.Contracts/RollCallEmployee/RollCallEmployeeViewModel.cs
View File

@@ -31,4 +31,7 @@ public class RollCallEmployeeViewModel : EditRollCallEmployee
public string EmployeeSlug { get; set; }
public List<RollCallEmployeeViewModel> PersonnelInfoViewModels { get; set; }
public IEnumerable<RollCallEmployeeStatusViewModel> Statuses { get; set; }
public string EmployeeLName { get; set; }
public string EmployeeFName { get; set; }
}

8
CompanyManagment.EFCore/Repository/RollCallEmployeeRepository.cs
View File

@@ -238,13 +238,15 @@ public class RollCallEmployeeRepository : RepositoryBase<long, RollCallEmployee>
&& x.IsActiveString == "true" && x.HasUploadedImage == "true");
var personnel =
_context.PersonnelCodeSet.Include(x => x.Employee).Where(x => rollCallEmployeeIdQuery.Any(y => y.EmployeeId == x.EmployeeId));
_context.PersonnelCodeSet.Include(x => x.Employee).Where(x => rollCallEmployeeIdQuery.Any(y => y.EmployeeId == x.EmployeeId && y.WorkshopId == x.WorkshopId));
return personnel.Select(x => new RollCallEmployeeViewModel()
{
PersonelCode = x.PersonnelCode,
EmployeeFullName = $"{x.Employee.FName} {x.Employee.LName}",
}).ToList();
EmployeeFName = x.Employee.FName,
EmployeeLName = x.Employee.LName
}).OrderBy(x => x.EmployeeLName).ToList();
}

4
CompanyManagment.EFCore/Repository/RollCallRepository.cs
View File

@@ -319,7 +319,7 @@ public class RollCallRepository : RepositoryBase<long, RollCall>, IRollCallRepos
var personnelCodeList =
_context.PersonnelCodeSet.Where(x => activeEmployeesQuery.Any(y => y.EmployeeId == x.EmployeeId));
_context.PersonnelCodeSet.Where(x => activeEmployeesQuery.Any(y => y.EmployeeId == x.EmployeeId && y.WorkshopId == x.WorkshopId));
var rollCallsList = rollCallsQuery.ToList();
var activatedEmployeesList = activeEmployeesQuery.ToList();
var leavesList = leavesQuery.ToList();
@@ -462,7 +462,7 @@ public class RollCallRepository : RepositoryBase<long, RollCall>, IRollCallRepos
var absentsViewModel = absentsQuery.Select(x => new AbsentEmployeeViewModel()
{
PersonnelCode = personnelCodes
.FirstOrDefault(y => y.EmployeeId == x.EmployeeId)?
.FirstOrDefault(y => y.EmployeeId == x.EmployeeId && y.WorkshopId == x.WorkshopId)?
.PersonnelCode.ToString(),
EmployeeId = x.EmployeeId,
EmployeeFullName = x.EmployeeFullName,

27
ServiceHost/Areas/Camera/Pages/Index.cshtml
View File

@@ -37,7 +37,7 @@
.title-logo-mobile {
font-size: 16px;
font-weight: 700;
margin: 0 0 40px 0;
/* margin: 0 0 40px 0; */
}
</style>
}
@@ -47,8 +47,8 @@
<div class="row align-items-center">
<div class="col-2">
<div class="text-center">
<button type="button" class="bg-transparent" onclick="openPersonnelModal()">
<svg width="26" height="26" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<button type="button" class="" onclick="openPersonnelModal()" style="border: 1px solid #373a3d;background-color: #2b333f;border-radius: 10px;">
<svg width="30" height="30" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7" cy="9" r="3" fill="#8FFAFA"/>
<circle cx="17" cy="9" r="3" fill="#8FFAFA"/>
<circle cx="12" cy="9" r="4" fill="#23A8A8"/>
@@ -56,7 +56,7 @@
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.12197 13.7991C8.57989 13.3205 7.88609 13 7 13C4.55208 13 3.57166 15.4458 3.20343 16.9162C3.05971 17.4901 3.51335 18 4.10498 18H6.43155C6.83464 16.4902 7.61422 14.7773 9.12197 13.7991Z" fill="#8FFAFA"/>
<path d="M12 14C15.7087 14 16.6665 17.301 16.9139 19.0061C16.9932 19.5526 16.5523 20 16 20H8C7.44772 20 7.00684 19.5526 7.08614 19.0061C7.33351 17.301 8.29134 14 12 14Z" fill="#23A8A8"/>
</svg>
<p style="font-size: 14px; color: #ffffff">جستجو</p>
<p class="m-0" style="font-size: 14px; color: #ffffff">جستجو</p>
</button>
</div>
</div>
@@ -75,7 +75,7 @@
<path d="M8 18.9282C9.21615 19.6303 10.5957 20 12 20C13.4043 20 14.7838 19.6303 16 18.9282C17.2162 18.2261 18.2261 17.2162 18.9282 16C19.6303 14.7838 20 13.4043 20 12C20 10.5957 19.6303 9.21615 18.9282 8C18.2261 6.78385 17.2162 5.77394 16 5.0718C14.7838 4.36965 13.4043 4 12 4C10.5957 4 9.21615 4.36965 8 5.0718" stroke="#ef4444" stroke-width="1.2" stroke-linecap="round" />
<path d="M6 7L2 12M2 12L6 17M2 12H11" stroke="#ef4444" stroke-width="1.2" stroke-linecap="round" />
</svg>
<p style="font-size: 14px; color: #ffffff">خاموش</p>
<p class="m-0" style="font-size: 14px; color: #ffffff">خاموش</p>
</a>
</div>
</div>
@@ -136,9 +136,12 @@
</div>
</div>
<div class="item-wrapper hover-dot" id="cleanBtn" style="border: 1px solid #ef4444;">
<div class="item">
<i class="fa fa-trash"></i>
</div>
<div class="item">
<svg width="30" height="30" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M21.0001 6H3.00006V9C4.10463 9 5.00006 9.89543 5.00006 11V15C5.00006 17.8284 5.00006 19.2426 5.87874 20.1213C6.75742 21 8.17163 21 11.0001 21H13.0001C15.8285 21 17.2427 21 18.1214 20.1213C19.0001 19.2426 19.0001 17.8284 19.0001 15V11C19.0001 9.89543 19.8955 9 21.0001 9V6ZM10.5001 11C10.5001 10.4477 10.0523 10 9.50006 10C8.94778 10 8.50006 10.4477 8.50006 11V16C8.50006 16.5523 8.94778 17 9.50006 17C10.0523 17 10.5001 16.5523 10.5001 16V11ZM15.5001 11C15.5001 10.4477 15.0523 10 14.5001 10C13.9478 10 13.5001 10.4477 13.5001 11V16C13.5001 16.5523 13.9478 17 14.5001 17C15.0523 17 15.5001 16.5523 15.5001 16V11Z" fill="#ffffff" />
<path d="M10.0681 3.37059C10.1821 3.26427 10.4332 3.17033 10.7825 3.10332C11.1318 3.03632 11.5597 3 12 3C12.4403 3 12.8682 3.03632 13.2175 3.10332C13.5668 3.17033 13.8179 3.26427 13.9319 3.37059" stroke="#ffffff" stroke-width="2" stroke-linecap="round"/>
</svg>
</div>
</div>
<div class="item-wrapper hover-dot">
<div class="item">
@@ -285,10 +288,10 @@
</div> *@
<div class="modal fade" id="MainModal" tabindex="-1" aria-labelledby="personalLabel" aria-hidden="true" style="display: none;">
<div class="modal-dialog modal-fullscreen-sm-down">
<div class="w-100 h-100" id="ModalContent">
</div>
</div>
<div class="modal-dialog modal-fullscreen-sm-down">
<div class="w-100 h-100" id="ModalContent">
</div>
</div>
</div>
@section Script

15
ServiceHost/Areas/Camera/Pages/Shared/_Layout.cshtml
View File

@@ -1,4 +1,6 @@
<!-- -->
<!DOCTYPE html>
<html lang="fa">
<head>
@@ -12,7 +14,15 @@
<link rel="icon" type="image/x-icon" href="~/AssetsClient/images/favicon.ico">
<link rel="stylesheet" href="~/AssetsClient/css/bootstrap.rtl.css">
<link href="~/AssetsClient/css/validation-style.css" rel="stylesheet" />
<link href="~/AssetsClient/libs/font-awesome/css/font-awesome.min.css" rel="stylesheet" />
<style>
.alert-msg, .alert-success-msg {
bottom: auto;
top: 15px;
}
</style>
@RenderSection("Styles", false)
@@ -39,8 +49,9 @@
</div>
</div>
<partial name="_validationAlert" />
<script src="~/AssetsClient/js/jquery-3.7.1.min.js"></script>
<script src="~/AssetsClient/js/jquery-3.7.1.min.js"></script>
<script src="~/AssetsClient/js/bootstrap.bundle.min.js"></script>
@RenderSection("Script", false)

45
ServiceHost/Areas/Camera/Pages/Shared/_validationAlert.cshtml Normal file
View File

@@ -0,0 +1,45 @@
<!-- پیغام خطا -->
<div class="alert-msg" style="display:none">
<div class="d-flex align-items-center justify-content-between">
<div class="px-1">
<h4 class="alert-msg-heading">خطا</h4>
<p class="m-0"></p>
</div>
<button class="bg-transparent btn-alert-danger" id="closeAlert">
<svg width="40" height="40" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="32" height="32" rx="16" fill="#D3D3D3" />
<mask id="mask0_1503_13337" maskUnits="userSpaceOnUse" x="4" y="4" width="24" height="24">
<rect x="4" y="4" width="24" height="24" fill="#D9D9D9" />
</mask>
<g mask="url(#mask0_1503_13337)">
<path d="M12.4 21L16 17.4L19.6 21L21 19.6L17.4 16L21 12.4L19.6 11L16 14.6L12.4 11L11 12.4L14.6 16L11 19.6L12.4 21ZM16 26C14.6167 26 13.3167 25.7373 12.1 25.212C10.8833 24.6873 9.825 23.975 8.925 23.075C8.025 22.175 7.31267 21.1167 6.788 19.9C6.26267 18.6833 6 17.3833 6 16C6 14.6167 6.26267 13.3167 6.788 12.1C7.31267 10.8833 8.025 9.825 8.925 8.925C9.825 8.025 10.8833 7.31233 12.1 6.787C13.3167 6.26233 14.6167 6 16 6C17.3833 6 18.6833 6.26233 19.9 6.787C21.1167 7.31233 22.175 8.025 23.075 8.925C23.975 9.825 24.6873 10.8833 25.212 12.1C25.7373 13.3167 26 14.6167 26 16C26 17.3833 25.7373 18.6833 25.212 19.9C24.6873 21.1167 23.975 22.175 23.075 23.075C22.175 23.975 21.1167 24.6873 19.9 25.212C18.6833 25.7373 17.3833 26 16 26Z" fill="#F04248" />
</g>
</svg>
</button>
</div>
<div class="border-msg position-absolute"></div>
</div>
<!-- پیغام خطا -->
<!-- پیغام موفق -->
<div class="alert-success-msg" style="display:none">
<div class="d-flex align-items-center justify-content-between">
<div class="px-1">
<h4 class="alert-msg-heading">موفق</h4>
<p class="m-0"></p>
</div>
<button class="bg-transparent btn-alert-success" id="closeAlert">
<svg width="40" height="40" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="32" height="32" rx="16" fill="#E5FFEF" />
<mask id="mask0_222_9438" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="4" y="4" width="24" height="24">
<rect x="4" y="4" width="24" height="24" fill="#D9D9D9"/>
</mask>
<g mask="url(#mask0_222_9438)">
<path d="M14.6 20.6L21.65 13.55L20.25 12.15L14.6 17.8L11.75 14.95L10.35 16.35L14.6 20.6ZM16 26C14.6167 26 13.3167 25.7373 12.1 25.212C10.8833 24.6873 9.825 23.975 8.925 23.075C8.025 22.175 7.31267 21.1167 6.788 19.9C6.26267 18.6833 6 17.3833 6 16C6 14.6167 6.26267 13.3167 6.788 12.1C7.31267 10.8833 8.025 9.825 8.925 8.925C9.825 8.025 10.8833 7.31233 12.1 6.787C13.3167 6.26233 14.6167 6 16 6C17.3833 6 18.6833 6.26233 19.9 6.787C21.1167 7.31233 22.175 8.025 23.075 8.925C23.975 9.825 24.6873 10.8833 25.212 12.1C25.7373 13.3167 26 14.6167 26 16C26 17.3833 25.7373 18.6833 25.212 19.9C24.6873 21.1167 23.975 22.175 23.075 23.075C22.175 23.975 21.1167 24.6873 19.9 25.212C18.6833 25.7373 17.3833 26 16 26Z" fill="#00DF80"/>
</g>
</svg>
</button>
</div>
<div class="border-success-msg position-absolute"></div>
</div>
<!-- پیغام موفق -->

36
ServiceHost/Areas/Camera/Pages/ViewPersonnelModal.cshtml
View File

@@ -8,12 +8,13 @@
.itemSection {
display: flex;
align-items: center;
justify-content: space-between;
/* justify-content: space-between; */
background-color: #253247;
padding: 7px 5px;
border-radius: 10px;
margin: 5px 0;
font-size: 13px;
gap: 10px;
}
.itemSection.header {
@@ -56,6 +57,24 @@
width: 100%;
color: #ffffff;
}
.employee-lname {
width: 50%;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.employee-name {
width: 30%;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.employee-code {
width: 20%;
}
</style>
@@ -92,16 +111,18 @@
</div>
<div class="itemSection header">
<span>نام پرسنل</span>
<span>کد پرسنل</span>
<span style="width: 50%">نام خانوادگی پرسنل</span>
<span style="width: 30%">نام پرسنل</span>
<span class="text-end" style="width: 20%">کد پرسنل</span>
</div>
</div>
<div id="employeeList">
@foreach (var item in Model)
{
<div class="itemSection employee-item">
<span class="employee-name">@item.EmployeeFullName</span>
<span class="employee-code">@item.PersonelCode</span>
<span class="employee-lname">@item.EmployeeLName</span>
<span class="employee-name">@item.EmployeeFName</span>
<span class="employee-code text-end">@item.PersonelCode</span>
</div>
}
</div>
@@ -121,10 +142,11 @@
$('#searchPersonnel').on('keyup', function() {
var value = $(this).val().toLowerCase();
$('#employeeList .employee-item').filter(function() {
var employeeName = $(this).find('.employee-name').text().toLowerCase();
var employeeFName = $(this).find('.employee-name').text().toLowerCase();
var employeeLName = $(this).find('.employee-lname').text().toLowerCase();
var employeeCode = $(this).find('.employee-code').text().toLowerCase();
if (employeeName.includes(value) || employeeCode.includes(value)) {
if (employeeFName.includes(value) || employeeLName.includes(value) || employeeCode.includes(value)) {
$(this).show();
} else {
$(this).hide();

185
ServiceHost/Areas/Client/Pages/Company/RollCall/CurrentDay.cshtml
View File

@@ -46,11 +46,11 @@
<div class="container-fluid">
<div class="row p-lg-2">
<div class="col-8 ps-0 d-none d-md-block">
<div class="card">
<div class="card" style="height: 779px; overflow-y: scroll">
<div class="wrapper table-rollcall">
<div class="rollcall-list Rtable Rtable--5cols Rtable--collapse px-1">
<div class="Rtable-row Rtable-row--head align-items-center d-flex">
<div class="Rtable-row Rtable-row--head align-items-center d-flex sticky">
<div class="Rtable-cell column-heading width1">ردیف</div>
<div class="Rtable-cell column-heading width2">نام پرسنل</div>
<div class="Rtable-cell column-heading width3">شماره پرسنلی</div>
@@ -61,101 +61,102 @@
<div class="Rtable-cell column-heading width8 text-center">مجموع ساعات کاری</div>
</div>
<div class="w-100" style="height: 731px; overflow-y: scroll">
<div></div>
@if (@Model.RollCallViewModels.PresentEmployees.Any())
@if (@Model.RollCallViewModels.PresentEmployees.Any())
{
@foreach (var item in Model.RollCallViewModels.PresentEmployees)
{
@foreach (var item in Model.RollCallViewModels.PresentEmployees)
{
<div class="Rtable-row align-items-center position-relative openAction @(item.RollCallTimesList.Last().EndDate != null ? "existTimeRollCall" : "")">
<div class="Rtable-cell width1">
<div class="Rtable-cell--heading d-none">
ردیف
</div>
<div class="Rtable-cell--content">
<div class="d-flex justify-content-center align-items-center table-number">
@(index++)
</div>
<div class="Rtable-row align-items-center position-relative openAction @(Model.RollCallViewModels.PresentEmployees.Count() == 1 ? "radius" : "") @(index == 1 ? "firstRadius" : "") @(index == Model.RollCallViewModels.PresentEmployees.Count() - 1 ? " lastRadius" : "" ) @(item.RollCallTimesList.Last().EndDate != null ? "existTimeRollCall" : "")">
<div class="Rtable-cell width1">
<div class="Rtable-cell--heading d-none">
ردیف
</div>
<div class="Rtable-cell--content">
<div class="d-flex justify-content-center align-items-center table-number">
@(index++)
</div>
</div>
<div class="Rtable-cell width2">
<div class="Rtable-cell--heading d-none">نام پرسنل</div>
<div class="Rtable-cell--content">
@item.EmployeeFullName
</div>
</div>
<div class="Rtable-cell width3">
<div class="Rtable-cell--content text-center">
<div class="d-md-none d-none">شماره پرسنلی: </div>
<div class="d-flex ms-1">@item.PersonnelCode</div>
</div>
</div>
<div class="Rtable-cell width4 position-relative bg-filter">
<div class="Rtable-cell--content text-center">
<div class="d-md-none d-none">تاخیر در ورود: </div>
<div class="d-flex ms-1">-</div>
</div>
</div>
<div class="Rtable-cell width5 position-relative text-center">
@foreach (var itemTime in item.RollCallTimesList)
{
<div class="Rtable-cell--heading">ساعت ورود</div>
<div style="direction: ltr; z-index: 6; position: relative" class="Rtable-cell--content text-center">
<div>@(itemTime.StartDate ?? "-")</div>
</div>
}
</div>
<div class="Rtable-cell width6 position-relative text-center">
@foreach (var itemTime in item.RollCallTimesList)
{
<div class="Rtable-cell--heading">ساعت خروج</div>
<div style="direction: ltr; z-index: 6; position: relative" class="Rtable-cell--content text-center">
<div>@(itemTime.EndDate ?? "-")</div>
</div>
}
</div>
<div class="Rtable-cell position-relative width7 bg-filter">
<div class="Rtable-cell--content text-center">
<div class="d-md-none d-none">تجمیع در خروج: </div>
<div class="d-flex ms-1">-</div>
</div>
</div>
<div class="Rtable-cell position-relative width8 bg-filter">
<div class="Rtable-cell--content text-center">
<div class="d-md-none d-none">مجموع ساعات کاری: </div>
<div class="d-flex ms-1">
@if (item.RollCallTimesList.Last().EndDate == null)
{
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12 12L18.1254 16.1694C18.6725 16.5418 19 17.1608 19 17.8227V20.5C19 20.7761 18.7761 21 18.5 21H5.5C5.22386 21 5 20.7761 5 20.5V17.8227C5 17.1608 5.32746 16.5418 5.87462 16.1694L12 12ZM12 12L18.1254 7.83062C18.6725 7.45819 19 6.83917 19 6.17729V3.5C19 3.22386 18.7761 3 18.5 3H5.5C5.22386 3 5 3.22386 5 3.5V6.17729C5 6.83917 5.32746 7.45819 5.87462 7.83062L12 12Z" stroke="#13AEAE" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M15 20.2071V20.85C15 20.9328 14.9328 21 14.85 21H9.15C9.06716 21 9 20.9328 9 20.85V20.2071C9 20.0745 9.05268 19.9473 9.14645 19.8536L11.4343 17.5657C11.7467 17.2533 12.2533 17.2533 12.5657 17.5657L14.8536 19.8536C14.9473 19.9473 15 20.0745 15 20.2071Z" fill="#13AEAE"/>
<path d="M12 11L17 8H7L12 11Z" fill="#13AEAE"/>
<path d="M12 18V12" stroke="#13AEAE" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
}
else
{
@item.TotalWorkingHours
}
</div>
</div>
</div>
</div>
}
<div class="Rtable-cell width2">
<div class="Rtable-cell--heading d-none">نام پرسنل</div>
<div class="Rtable-cell--content">
@item.EmployeeFullName
</div>
</div>
<div class="Rtable-cell width3">
<div class="Rtable-cell--content text-center">
<div class="d-md-none d-none">شماره پرسنلی: </div>
<div class="d-flex ms-1">@item.PersonnelCode</div>
</div>
</div>
<div class="Rtable-cell width4 position-relative bg-filter">
<div class="Rtable-cell--content text-center">
<div class="d-md-none d-none">تاخیر در ورود: </div>
<div class="d-flex ms-1">-</div>
</div>
</div>
<div class="Rtable-cell width5 position-relative text-center">
@foreach (var itemTime in item.RollCallTimesList)
{
<div class="Rtable-cell--heading">ساعت ورود</div>
<div style="direction: ltr; z-index: 6; position: relative" class="Rtable-cell--content text-center">
<div>@(itemTime.StartDate ?? "-")</div>
</div>
}
</div>
<div class="Rtable-cell width6 position-relative text-center">
@foreach (var itemTime in item.RollCallTimesList)
{
<div class="Rtable-cell--heading">ساعت خروج</div>
<div style="direction: ltr; z-index: 6; position: relative" class="Rtable-cell--content text-center">
<div>@(itemTime.EndDate ?? "-")</div>
</div>
}
</div>
<div class="Rtable-cell position-relative width7 bg-filter">
<div class="Rtable-cell--content text-center">
<div class="d-md-none d-none">تجمیع در خروج: </div>
<div class="d-flex ms-1">-</div>
</div>
</div>
<div class="Rtable-cell position-relative width8 h-100 bg-filter">
<div class="Rtable-cell--content text-center">
<div class="d-md-none d-none">مجموع ساعات کاری: </div>
<div class="d-flex ms-1">
@if (item.RollCallTimesList.Last().EndDate == null)
{
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12 12L18.1254 16.1694C18.6725 16.5418 19 17.1608 19 17.8227V20.5C19 20.7761 18.7761 21 18.5 21H5.5C5.22386 21 5 20.7761 5 20.5V17.8227C5 17.1608 5.32746 16.5418 5.87462 16.1694L12 12ZM12 12L18.1254 7.83062C18.6725 7.45819 19 6.83917 19 6.17729V3.5C19 3.22386 18.7761 3 18.5 3H5.5C5.22386 3 5 3.22386 5 3.5V6.17729C5 6.83917 5.32746 7.45819 5.87462 7.83062L12 12Z" stroke="#13AEAE" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
<path d="M15 20.2071V20.85C15 20.9328 14.9328 21 14.85 21H9.15C9.06716 21 9 20.9328 9 20.85V20.2071C9 20.0745 9.05268 19.9473 9.14645 19.8536L11.4343 17.5657C11.7467 17.2533 12.2533 17.2533 12.5657 17.5657L14.8536 19.8536C14.9473 19.9473 15 20.0745 15 20.2071Z" fill="#13AEAE" />
<path d="M12 11L17 8H7L12 11Z" fill="#13AEAE" />
<path d="M12 18V12" stroke="#13AEAE" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
</svg>
}
else
{
@item.TotalWorkingHours
}
</div>
</div>
</div>
</div>
}
else
{
<partial name="Company/Partial/_EmptySection"></partial>
}
</div>
}
else
{
<partial name="Company/Partial/_EmptySection"></partial>
}
@* <div class="w-100" style="height: 731px; overflow-y: scroll">
<div></div>
</div> *@
</div>
</div>
</div>

1
ServiceHost/Areas/Client/Pages/Company/RollCall/CurrentDay.cshtml.cs
View File

@@ -68,6 +68,7 @@ namespace ServiceHost.Areas.Client.Pages.Company.RollCall
}
public IActionResult OnGetCurrentDayAjax(string type)
{
var workshopHash = User.FindFirstValue("WorkshopSlug");

66
ServiceHost/Areas/Client/Pages/Company/RollCall/EmployeeUploadPicture.cshtml
View File

@@ -68,20 +68,20 @@
<div class="msg-note my-1">
<div class="row align-items-center">
<div class="col-12 col-md-4 text-center text-md-start">
<div class="d-flex align-items-center">
<div class="d-flex align-items-center justify-content-center justify-content-md-start">
<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="18" cy="18" r="13.5" fill="#2FC1C1"></circle>
<path d="M19.5 10.5C19.5 11.3284 18.8284 12 18 12C17.1716 12 16.5 11.3284 16.5 10.5C16.5 9.67157 17.1716 9 18 9C18.8284 9 19.5 9.67157 19.5 10.5Z" fill="white"></path>
<path stroke-width="1.5" d="M18 24.75V17.25C18 15.8358 18 15.1287 17.5607 14.6893C17.1213 14.25 16.4142 14.25 15 14.25V14.25M18 24.75H20.25M18 24.75H15.75" stroke="white"></path>
</svg>
<p class="m-0 ms-2">تعداد پرسنل سرویس خریداری شده: @(Model.MaxPersonValid == -1 ? "نامحدود" : Model.MaxPersonValid)</p>
<p class="m-0 ms-2">تعداد پرسنل سرویس خریداری شده: <span id="maxPersonValid"></span></p>
</div>
</div>
<div class="col-12 col-md-4 text-center text-md-center">
<p class="m-0">تعداد افراد فعال: @Model.Employees.PersonnelInfoViewModels.Count(x => x.IsActiveString == "true")</p>
<p class="m-0">تعداد افراد فعال: <span id="isTrueActiveCount"></span></p>
</div>
<div class="col-12 col-md-4 text-center text-md-end">
<p class="m-0 me-2">تعداد افراد غیرفعال: @Model.Employees.PersonnelInfoViewModels.Count(x => x.IsActiveString == "false")</p>
<p class="m-0 me-2">تعداد افراد غیرفعال: <span id="isFalseActiveCount"></span></p>
</div>
</div>
</div>
@@ -90,7 +90,7 @@
<div class="wrapper bg-white my-1 list-box table-rollcall">
@if (@Model.HasEmployees)
{
<div class="Rtable Rtable--collapse">
<div class="Rtable Rtable--collapse" id="ajaxDataLoad">
<div class="Rtable-row Rtable-row--head align-items-center">
<div class="Rtable-cell column-heading width1">ردیف</div>
<div class="Rtable-cell column-heading width2">نام و نام خانوادگی</div>
@@ -145,21 +145,20 @@
</div>
<div class="Rtable-cell d-md-block d-none width5">
<div class="Rtable-cell--content align-items-center d-flex d-md-block text-end">
@if (item.IsActiveString == "true")
{
<button class="btn-deactive" type="button" onclick="deactivePersonnel(@item.Id)">
غیرفعال کردن
</button>
}
else
{
<button class="btn-active @(item.HasUploadedImage == "false" ? "disable" : "")" type="button" onclick="activePersonnel(@item.Id, '@item.HasUploadedImage')">
فعال کردن
</button>
@{
var isActive = item.IsActiveString == "true" ? "deactive" : "active";
}
<button class="desktop-btn @(item.IsActiveString == "true" ? "btn-deactive" : item.HasUploadedImage == "false" ? "btn-active disable" : "btn-active")"
type="button"
style="width: 95px;"
id="togglePersonnelStatus_@(item.Id)_desktop">
<div id="IsActiveString_@(item.Id)_desktop">
@(item.IsActiveString == "true" ? "غیر فعال کردن" : "فعال کردن")
</div>
</button>
<button class="btn-upload" type="button" onclick='ModalUploadPics(@item.EmployeeId)'>
@(item.HasUploadedImage == "true" ? "ویرایش عکس پرسنل" : "بارگذاری عکس")
<button class="btn-upload" type="button" onclick='ModalUploadPics(@item.EmployeeId)' style="width: 95px;">
@(item.HasUploadedImage == "true" ? "ویرایش عکس" : "بارگذاری عکس")
</button>
</div>
</div>
@@ -201,20 +200,18 @@
<div class="Rtable-cell--heading d-block text-center" style="width: 100px;">
<div class="Rtable-cell--content align-items-center d-block text-end">
<button class="btn-upload-mobile text-nowrap w-100" type="button" onclick='ModalUploadPics(@item.EmployeeId)'>
@(item.HasUploadedImage == "true" ? "ویرایش عکس پرسنل" : "بارگذاری عکس")
@(item.HasUploadedImage == "true" ? "ویرایش عکس" : "بارگذاری عکس")
</button>
<button
class="mobile-btn text-nowrap mt-1 w-100 @(item.IsActiveString == "true" ? "btn-deactive" : item.HasUploadedImage == "false" ? "btn-active disable" : "btn-active")"
type="button"
id="togglePersonnelStatus_@(item.Id)_mobile"
style="padding: 9px 8px; font-weight: 600; font-size: 10px;">
<div id="IsActiveString_@(item.Id)_mobile">
@(item.IsActiveString == "true" ? "غیر فعال کردن" : "فعال کردن")
</div>
</button>
@if (item.IsActiveString == "true")
{
<button class="btn-deactive text-nowrap mt-1 w-100" type="button" onclick="deactivePersonnel(@item.Id)" style="padding: 9px 8px;font-weight: 600;font-size: 10px;">
غیرفعال کردن
</button>
}
else
{
<button class="btn-active text-nowrap mt-1 w-100 @(item.HasUploadedImage == "false" ? "disable" : "")" type="button" onclick="activePersonnel(@item.Id, @item.HasUploadedImage)" style="padding: 9px 8px;font-weight: 600;font-size: 10px;">
فعال کردن
</button>
}
</div>
</div>
</div>
@@ -240,6 +237,8 @@
</div>
</div>
<input type="hidden" id="pageIndex" value="@Model.PageIndex" />
<div id="MainModal" class="modal fade personalListModal" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
<div class="modal-dialog modal-md modal-dialog-centered">
@* modal-dialog-scrollable *@
@@ -250,12 +249,15 @@
<input type="hidden" asp-for="@Model.HasEmployees" value="@Model.HasEmployees" id="hasEmployee" />
@section Script {
<script src="~/assetsadminnew/libs/sweetalert2/sweetalert2.all.min.js"></script>
<script src="~/assetsclient/js/site.js?ver=@Version.StyleVersion"></script>
<script>
var antiForgeryToken = $('@Html.AntiForgeryToken()').val();
var loadEmployeeUploadDataAjax = `@Url.Page("EmployeeUploadPicture", "EmployeeUploadDataAjax")`;
var loadInfoCountAjax = `@Url.Page("EmployeeUploadPicture", "LoadInfoCount")`;
var checkModalTakeImageAjax = `@Url.Page("EmployeeUploadPicture", "CheckModalTakeImage")`;
var deActivePersonnelAjax = `@Url.Page("./EmployeeUploadPicture", "DeActivePersonnel")`;
var activePersonnelAjax = `@Url.Page("./EmployeeUploadPicture", "ActivePersonnel")`;
</script>
<script src="~/assetsclient/pages/rollcall/js/employeeuploadpicture.js"></script>
<script src="~/assetsclient/pages/rollcall/js/employeeuploadpicture.js?ver=215"></script>
}

84
ServiceHost/Areas/Client/Pages/Company/RollCall/EmployeeUploadPicture.cshtml.cs
View File

@@ -9,6 +9,7 @@ using CompanyManagment.App.Contracts.Workshop;
using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using ServiceHost.Pages;
namespace ServiceHost.Areas.Client.Pages.Company.RollCall
{
@@ -20,6 +21,7 @@ namespace ServiceHost.Areas.Client.Pages.Company.RollCall
public bool HasEmployees;
public int MaxPersonValid;
public long WorkshopId;
public int PageIndex;
private readonly IWorkshopApplication _workshopApplication;
private readonly IEmployeeApplication _employeeApplication;
@@ -60,14 +62,16 @@ namespace ServiceHost.Areas.Client.Pages.Company.RollCall
.Select(g => g.First())
.OrderBy(x => x.Black ? 1 : 0)
.ThenBy(x => x.PersonelCode)
.ToList();
.Skip(0)
.Take(30)
.ToList();
Employees = new RollCallEmployeeViewModel
{
PersonnelInfoViewModels = distinctEmployees
};
PageIndex = Employees.PersonnelInfoViewModels.Count();
HasEmployees = Employees.PersonnelInfoViewModels.Count > 0 ? true : false;
return Page();
}
@@ -77,6 +81,82 @@ namespace ServiceHost.Areas.Client.Pages.Company.RollCall
}
}
public IActionResult OnGetEmployeeUploadDataAjax(int pageIndex)
{
var workshopHash = User.FindFirstValue("WorkshopSlug");
var workshopId = _passwordHasher.SlugDecrypt(workshopHash);
if (workshopId > 0)
{
MaxPersonValid = _rollCallServiceApplication.GetActiveServiceByWorkshopId(workshopId).MaxPersonValid;
var distinctEmployees = _rollCallEmployeeApplication
.GetPersonnelRollCallList(workshopId)
.GroupBy(x => x.EmployeeId)
.Select(g => g.First())
.OrderBy(x => x.Black ? 1 : 0)
.ThenBy(x => x.PersonelCode)
.Skip(pageIndex)
.Take(30)
.ToList();
Employees = new RollCallEmployeeViewModel
{
PersonnelInfoViewModels = distinctEmployees
};
return new JsonResult(new
{
isSuccedded = true,
data = Employees,
pageIndex = Employees.PersonnelInfoViewModels.Count()
});
}
else
{
return new JsonResult(new
{
isSuccedded = false,
message = "کارگاهی یافت نشد"
});
}
}
public IActionResult OnGetLoadInfoCount()
{
var workshopHash = User.FindFirstValue("WorkshopSlug");
var workshopId = _passwordHasher.SlugDecrypt(workshopHash);
if (workshopId <= 0)
{
return new JsonResult(new
{
isSuccedded = false,
message = "کارگاهی یافت نشد"
});
}
var activeService = _rollCallServiceApplication.GetActiveServiceByWorkshopId(workshopId);
var maxPersonValid = activeService.MaxPersonValid;
var employees = _rollCallEmployeeApplication
.GetPersonnelRollCallList(workshopId)
.GroupBy(e => e.EmployeeId)
.Select(g => g.First())
.OrderBy(e => e.Black ? 1 : 0)
.ThenBy(e => e.PersonelCode)
.ToList();
var activeCount = employees.Count(e => e.IsActiveString == "true");
var inactiveCount = employees.Count(e => e.IsActiveString == "false");
return new JsonResult(new
{
isSuccedded = true,
maxPersonValid = maxPersonValid == -1 ? "نامحدود" : maxPersonValid.ToString(),
isTrueActiveCount = activeCount,
isFalseActiveCount = inactiveCount,
message = "موفق"
});
}
public IActionResult OnGetCheckModalTakeImage()
{
var workshopHash = User.FindFirstValue("WorkshopSlug");

53
ServiceHost/Areas/Client/Pages/Company/RollCall/ModalTakeImages.cshtml
View File

@@ -93,21 +93,58 @@
<div id="result2" style="margin-bottom: 5px;"></div>
<div id="demoResult1" class="image-show">
<button type="button" class="upload-image1">بارگذاری عکس اول</button>
@* <div class="loadingImage" id="loadingImage1">
<div class="spinner-border" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</div> *@
@if (Model.HasPicture)
{
<img style="width: 100%; height: 100%; border-radius:10px;" data-uri="data:image/jpeg;base64,@Model.Pic1" id="pic1" src="data:image/jpeg;base64,@Model.Pic1" />
}
</div>
<div id="demoResult2" class="image-show">
<button type="button" class="upload-image2">بارگذاری عکس دوم</button>
@* <div class="loadingImage" id="loadingImage2">
<div class="spinner-border" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</div> *@
@if (Model.HasPicture)
{
<img style="width: 100%; height: 100%; border-radius:10px;" id="pic2" data-uri="data:image/jpeg;base64,@Model.Pic2" src="data:image/jpeg;base64,@Model.Pic2" />
}
</div>
<button type="button" onclick="set()" class="btn btn-success">ذخیره</button>
<div class="row mt-3">
<div class="col-12 position-relative overflow-hidden" style="height: 20px; direction: ltr;">
<div class="spinner-loading-progress loading" style="display: none; border-radius: 6px; position: unset;">
<span id="progressBar" style="color: #ffffff"></span>
</div>
</div>
</div>
<div class="row mt-4">
<div class="col-6 text-end">
@* <a asp-page="/Company/Task/Index" id="cancel" class="btn-tm-cancel m-1 text-white" type="button"> *@
<button class="w-100 btn-cancel text-white cancelAndRefresh" data-bs-dismiss="modal" aria-label="Close" type="button" style="display: block">
<span>انصراف</span>
</button>
</div>
<div class="col-6 text-start">
<button type="button" onclick="set()" class="w-100 btn-primary disable position-relative overflow-auto" id="SaveImageEmployee">
<span>ذخیره</span>
<div class="spinner-loading loading" style="display: none">
<span class="spinner-border spinner-border-sm loading text-white" role="status" aria-hidden="true"></span>
</div>
</button>
@* <a href="#" id="save" class="btn-tm-save">ارسال</a> *@
</div>
</div>
<input type="hidden" id="workshopId" asp-for="@Model.WorkshopId" value="@Model.WorkshopId" />
<input type="hidden" id="employeeId" asp-for="@Model.EmployeeId" value="@Model.EmployeeId" />
</div>
@@ -126,16 +163,16 @@
</div> *@
</div>
<div class="modal-footer justify-content-center align-items-center">
@* <div class="modal-footer justify-content-center align-items-center">
<div class="row">
@* <div class="col-6 text-end">
<div class="col-6 text-end">
<button type="button" class="btn-cancel2" id="prev-step">انصراف</button>
</div>
<div class="col-6 text-start">
<button type="button" class="btn-register" id="next-step">مرحله بعد</button>
</div> *@
</div>
</div>
</div>
</div> *@
</div>
</div>
@@ -178,5 +215,7 @@
<script>
var antiForgeryToken = $('@Html.AntiForgeryToken()').val();
var takePictureAjax = `@Url.Page("./EmployeeUploadPicture", "TakePicture")`;
var checkFace = @(Model.HasPicture ? 2 : 0);
</script>
<script src="~/assetsclient/pages/rollcall/js/modaltakeimages.js?ver=000"></script>
<script src="~/weights/face-api.js"></script>
<script src="~/assetsclient/pages/rollcall/js/modaltakeimages.js"></script>

2
ServiceHost/wwwroot/AssetsCamera/css/Index.css
View File

@@ -518,7 +518,7 @@ canvas {
}
}
/* ----------------------------------------------------------------------------------------- Responsive */
@media (min-width: 680px) {
.cameraSection {
width: 650px;

43
ServiceHost/wwwroot/AssetsCamera/js/Index.js
View File

@@ -1,5 +1,4 @@
$(document).ready(function () {
$(document).ready(function () {
if ($(window).width() > 992) {
$('#desktopDisplay').show();
$('#mobileDisplay').hide();
@@ -473,17 +472,25 @@ function out(flagId) {
success: function (response) {
if (response.isSuccess) {
// $.Notification.autoHideNotify('success', 'top center', 'پیام سیستم ', "خروج شما ثبت شد");
alert("خروج شما ثبت شد");
$('.alert-success-msg').show();
$('.alert-success-msg p').text('خروج شما ثبت شد');
setTimeout(function () {
$('.alert-success-msg').hide();
$('.alert-success-msg p').text('');
}, 1500);
roloadAgain();
} else {
// $.Notification.autoHideNotify('error', 'top center', 'پیام سیستم ', "خطا در ثبت اطلاعات");
alert("خطا در ثبت اطلاعات");
$('.alert-msg').show();
$('.alert-msg p').text('خطا در ثبت اطلاعات');
setTimeout(function () {
$('.alert-msg').hide();
$('.alert-msg p').text('');
}, 1500);
}
},
failure: function (response) {
console.log(5, response);
}
});
}
@@ -501,18 +508,26 @@ function inCom(employeeId) {
success: function (response) {
if (response.isSuccess) {
// $.Notification.autoHideNotify('success', 'top center', 'پیام سیستم ', "ورود شما ثبت شد");
alert("ورود شما ثبت شد");
$('.alert-success-msg').show();
$('.alert-success-msg p').text('ورود شما ثبت شد');
setTimeout(function () {
$('.alert-success-msg').hide();
$('.alert-success-msg p').text('');
}, 1500);
roloadAgain();
} else {
// $.Notification.autoHideNotify('error', 'top center', 'پیام سیستم ', "خطا در ثبت اطلاعات");
alert("خطا در ثبت اطلاعات");
$('.alert-msg').show();
$('.alert-msg p').text('خطا در ثبت اطلاعات');
setTimeout(function () {
$('.alert-msg').hide();
$('.alert-msg p').text('');
}, 1500);
}
},
failure: function (response) {
console.log(5, response);
}
});
}
@@ -521,11 +536,6 @@ function inCom(employeeId) {
// ------------------------------------------------------------- keyboard number
$(document).ready(function () {
//const androidUserAgentString = window.navigator.userAgent.slice(window.navigator.userAgent.indexOf("Android"));
//const androidDeviceName = androidUserAgentString.slice(androidUserAgentString.indexOf("; ") + 1, androidUserAgentString.indexOf(")"));
//console.log(androidDeviceName);
$('#errorMessage').text(androidUserAgentString);
$('.keypad-numbers .item').click(function () {
let number = $(this).text().trim();
@@ -554,6 +564,7 @@ function enterPersonnelCode() {
if (code === "") {
$('#errorMessage').text('کد پرسنلی خود را وارد کنید.');
} else {
$('#errorMessage').text('');
sendPersonelCodeToGetEmployeeId(code);
}
}
@@ -561,4 +572,4 @@ function enterPersonnelCode() {
function openPersonnelModal() {
var goTo = `#showmodal=/Camera/Index?handler=PersonnelWorkshopAjax`;
window.location.href = goTo;
}
}

6
ServiceHost/wwwroot/AssetsClient/pages/RollCall/css/CurrentDay.css
View File

@@ -46,3 +46,9 @@
bottom: -10px;
right: 20px;
}
.sticky {
position: sticky;
top: 0;
z-index: 10;
}

16
ServiceHost/wwwroot/AssetsClient/pages/RollCall/css/ModalTakeImages.css
View File

@@ -147,3 +147,19 @@ video {
height: 100% !important;
object-fit: cover !important;
}
.loadingImage {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 5;
background: #75ffff99;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
border-radius: 10px;
display: none;
}

363
ServiceHost/wwwroot/AssetsClient/pages/RollCall/js/EmployeeUploadPicture.js
View File

@@ -3,9 +3,218 @@
var button = $(this);
var loadingDiv = button.find('.loading');
loadingDiv.show();
});
});
$('.desktop-btn, .mobile-btn').on('click', function () {
var id = $(this).attr('id').split('_')[1];
var isActive = $(this).hasClass('btn-deactive') ? 'deactive' : 'active';
togglePersonnelStatus(id, isActive);
});
loadInfoCount();
});
function loadDataAjax() {
let pageIndex = Number($('#pageIndex').val());
var b = pageIndex % 30;
var html = '';
console.log(pageIndex);
if (b === 0 && pageIndex > 0) {
$.ajax({
async: false,
contentType: 'charset=utf-8',
dataType: 'json',
type: 'GET',
url: loadEmployeeUploadDataAjax,
data: {
pageIndex: pageIndex
},
headers: { "RequestVerificationToken": `${antiForgeryToken}` },
success: function (response) {
if (response.pageIndex > 0) {
var n = pageIndex + 1;
var dataLoad = response.data.personnelInfoViewModels;
dataLoad.forEach(function(item) {
html += `
<div 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">`;
if (item.hasUploadedImage === "true") {
html += `<img src="data:image/jpeg;base64,${item.imagePath}" class="img-avatar" />`;
}
else
{
html += `<img src="/AssetsClient/images/Credits.png" class="img-avatar" alt="">`;
}
html += `${item.employeeFullName}
</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 class="m-0">عکس پرسنل آپلود شده است</p>`;
}
else {
html += `<p class="m-0 text-danger">عکس پرسنل آپلود نشده است</p>`;
}
html += `</div>
</div>
<div class="Rtable-cell d-md-block d-none width5">
<div class="Rtable-cell--content align-items-center d-flex d-md-block text-end">`;
var isActive = item.isActiveString === "true" ? "deactive" : "active";
html += `<button class="desktop-btn ${(item.isActiveString === "true"
? `btn-deactive`
: item.hasUploadedImage === "false"
? `btn-active disable`
: `btn-active`)}"
type="button"
style="width: 95px;"
id="togglePersonnelStatus_${item.id}_desktop">
<div id="IsActiveString_${item.id}_desktop">
${item.isActiveString === "true" ? `غیر فعال کردن` : `فعال کردن`}
</div>
</button>
<button class="btn-upload" type="button" onclick='ModalUploadPics(${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") {
html += `<img src="data:image/jpeg;base64,${item.imagePath}" class="img-avatar" />`;
}
else {
html += `<img 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;">@item.EmployeeFullName</div>
<div class="content-mobile">`;
if (item.hasUploadedImage === "true") {
html += `<p class="m-0">عکس پرسنل آپلود شده است</p>`;
}
else {
html += `<p 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: 100px;">
<div class="Rtable-cell--content align-items-center d-block text-end">
<button class="btn-upload-mobile text-nowrap w-100" type="button" onclick='ModalUploadPics(${item.employeeId})'>
${item.hasUploadedImage === "true" ? `ویرایش عکس` : `بارگذاری عکس`}
</button>
<button
class="mobile-btn text-nowrap mt-1 w-100 ${item.isActiveString === "true" ? `btn-deactive` : item.hasUploadedImage === "false" ? `btn-active disable` : `btn-active`}"
type="button"
id="togglePersonnelStatus_${item.id}_mobile"
style="padding: 9px 8px; font-weight: 600; font-size: 10px;">
<div id="IsActiveString_${item.id}_mobile">
${item.isActiveString === "true" ? `غیر فعال کردن` : `فعال کردن`}
</div>
</button>
</div>
</div>
</div>
</div>
</div>`;
n += 1;
});
$('#ajaxDataLoad').append(html);
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) {
loadDataAjax();
}
if ($(this).scrollTop() > 100) {
$('.goToTop').show().fadeIn();
} else {
$('.goToTop').fadeOut().hide();
}
});
function loadInfoCount() {
$.ajax({
async: false,
dataType: 'json',
url: loadInfoCountAjax,
type: 'GET',
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({
@@ -31,76 +240,86 @@ function ModalUploadPics(employeeID)
});
}
function deactivePersonnel(id) {
$.ajax({
async: false,
dataType: 'json',
type: 'POST',
url: deActivePersonnelAjax,
headers: { "RequestVerificationToken": antiForgeryToken },
data: { id: Number(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('');
window.location.reload();
}, 2000);
} 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;
}
function activePersonnel(id, hasUploadedImage) {
if (hasUploadedImage) {
$.ajax({
async: false,
dataType: 'json',
type: 'POST',
url: activePersonnelAjax,
headers: { "RequestVerificationToken": antiForgeryToken },
data: { id: Number(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('');
window.location.reload();
}, 2000);
} 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 {
var errorText = "برای این پرسنل، هنوز هیچ عکسی آپلود نشده است. بعد از آپلود عکس بطور خودکار فعال خواهد شد";
$('.alert-msg').show();
$('.alert-msg p').text(errorText);
setTimeout(function () {
$('.alert-msg').hide();
$('.alert-msg p').text('');
}, 3500);
}
const buttonDesktop = $(`#togglePersonnelStatus_${id}_desktop`);
const buttonMobile = $(`#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, buttonDesktop, buttonMobile);
} else {
return;
}
});
} else {
actionPersonnelStatus(urlType, id, type, buttonDesktop, buttonMobile);
}
}
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);
setTimeout(function () {
$('.alert-msg').hide();
$('.alert-msg p').text('');
}, 3500);
}
},
error: function (err) {
console.log(err);
}
});
}

499
ServiceHost/wwwroot/AssetsClient/pages/RollCall/js/ModalTakeImages.js
View File

@@ -120,164 +120,319 @@
// }
$(document).ready(function () {
if ($(window).width() > 992) {
$('#desktopDisplay').show();
$('#mobileDisplay').hide();
$('#mobileDisplay').html('');
}
$(document).ready(function () {
if ($(window).width() > 992) {
$('#desktopDisplay').show();
$('#mobileDisplay').hide();
$('#mobileDisplay').html('');
}
if ($(window).width() <= 992) {
$('#desktopDisplay').html('');
$('#desktopDisplay').hide();
$('#mobileDisplay').show();
}
if ($(window).width() <= 992) {
$('#desktopDisplay').html('');
$('#desktopDisplay').hide();
$('#mobileDisplay').show();
}
$(document).on('click', '.upload-image1', function () {
$('.md-modal').addClass('md-show');
$('.take_snapshot1').show();
$('.take_snapshot2').hide();
startCamera();
});
$(document).on('click', '.upload-image2', function () {
$('.md-modal').addClass('md-show');
$('.take_snapshot1').hide();
$('.take_snapshot2').show();
startCamera();
});
$(document).on('click', '.camera_close', function () {
$('.md-modal').removeClass('md-show');
stopCamera();
});
$(document).on('click', '.upload-image1', function () {
$('.md-modal').addClass('md-show');
$('.take_snapshot1').show();
$('.take_snapshot2').hide();
startCamera();
});
var FACING_MODES = JslibHtml5CameraPhoto.FACING_MODES;
var IMAGE_TYPES = JslibHtml5CameraPhoto.IMAGE_TYPES;
// Check if videoElement is already declared to avoid redeclaration
// if (typeof videoElement === 'undefined') {
var videoElement = document.getElementById('videoElement');
var cameraPhoto = new JslibHtml5CameraPhoto.default(videoElement);
// }
function startCamera() {
// startCameraMaxResolution
cameraPhoto.startCamera(FACING_MODES.USER).then(() => {
console.log('Camera started!');
}).catch((error) => {
console.log(error);
console.error('Camera not started!', error);
});
}
function stopCamera() {
cameraPhoto.stopCamera().then(() => {
console.log('Camera stopped!');
}).catch((error) => {
console.log('No camera to stop!:', error);
});
}
function cropAndResizeImage(base64Str, newWidth, newHeight) {
return new Promise((resolve) => {
let img = new Image();
img.src = base64Str;
img.onload = () => {
let canvas = document.createElement('canvas');
let ctx = canvas.getContext('2d');
let sideLength = Math.min(img.width, img.height);
let startX = (img.width - sideLength) / 2;
let startY = (img.height - sideLength) / 2;
canvas.width = newWidth;
canvas.height = newHeight;
ctx.drawImage(img, startX, startY, sideLength, sideLength, 0, 0, newWidth, newHeight);
resolve(canvas.toDataURL('image/jpeg'));
};
});
}
function take_snapshot1() {
var sizeFactor = 1;
var imageType = IMAGE_TYPES.JPG;
var imageCompression = 1;
var config = {
sizeFactor,
imageType,
imageCompression
};
var dataUri = cameraPhoto.getDataUri(config);
cropAndResizeImage(dataUri, 1800, 1800).then((resizedDataUri) => {
document.getElementById('result1').innerHTML = '<img style="display:none; object-fit: cover;" id="pic1" data-uri="' + resizedDataUri + '" src="' + resizedDataUri + '"/>';
document.getElementById('demoResult1').innerHTML = '<button type="button" class="upload-image1">آپلود عکس اول</button><img style="width: 100%; height: 100%; border-radius:10px; object-fit: cover;" data-uri="' + resizedDataUri + '" src="' + resizedDataUri + '"/>';
}).catch((error) => {
console.error('Error cropping and resizing photo:', error);
});
$(document).on('click', '.upload-image2', function () {
$('.md-modal').addClass('md-show');
$('.take_snapshot1').hide();
$('.take_snapshot2').show();
startCamera();
});
$(document).on('click', '.camera_close', function () {
$('.md-modal').removeClass('md-show');
stopCamera();
});
updateSaveButton();
});
window.onload = async () => {
await loadModels();
modelsLoaded = true;
};
var loadModels = async () => {
await Promise.all([
faceapi.nets.ssdMobilenetv1.loadFromUri("\\weights\\"),
faceapi.nets.faceRecognitionNet.loadFromUri("\\weights\\"),
faceapi.nets.faceLandmark68Net.loadFromUri("\\weights\\")
]);
};
var modelsLoaded = false;
var ensureModelsLoaded = async () => {
if (!modelsLoaded) {
await loadModels();
modelsLoaded = true;
}
};
var updateSaveButton = () => {
if (checkFace === 2) {
$('#SaveImageEmployee').removeClass('disable');
} else {
$('#SaveImageEmployee').addClass('disable');
}
};
var runCheckFace1 = async () => {
await ensureModelsLoaded();
const img1 = document.getElementById('pic1');
const detectionPromise1 = faceapi.detectSingleFace(img1).withFaceLandmarks().withFaceDescriptor();
const delayPromise1 = new Promise(resolve => setTimeout(resolve, 2000));
const [detection1] = await Promise.all([detectionPromise1, delayPromise1]);
//const detection1 = await faceapi.detectSingleFace(img1).withFaceLandmarks().withFaceDescriptor();
if (detection1) {
console.log('چهره در تصویر اول شناسایی شد');
if (checkFace < 2) {
checkFace = checkFace + 1;
}
$('#demoResult1').css('border', '2px dashed #148b8b');
} else {
$('.alert-msg').show();
$('.alert-msg p').text('چهره‌ای در تصویر اول شناسایی نشد');
setTimeout(function () {
$('.alert-msg').hide();
$('.alert-msg p').text('');
}, 2000);
if (checkFace > 0) {
checkFace = checkFace - 1;
}
$('#SaveImageEmployee').addClass('disable');
$('.upload-image1').css('background', '#ff090940');
$('#demoResult1').css('border', '2px dashed #ff5c5c');
}
updateSaveButton();
$('#loadingImage1').hide();
};
function take_snapshot2() {
var sizeFactor = 1;
var imageType = IMAGE_TYPES.JPG;
var imageCompression = 1;
var runCheckFace2 = async () => {
await ensureModelsLoaded();
const img2 = document.getElementById('pic2');
var config = {
sizeFactor,
imageType,
imageCompression
const detectionPromise2 = faceapi.detectSingleFace(img2).withFaceLandmarks().withFaceDescriptor();
const delayPromise2 = new Promise(resolve => setTimeout(resolve, 2000));
const [detection2] = await Promise.all([detectionPromise2, delayPromise2]);
//const detection2 = await faceapi.detectSingleFace(img2).withFaceLandmarks().withFaceDescriptor();
if (detection2) {
console.log('چهره در تصویر دوم شناسایی شد');
if (checkFace < 2) {
checkFace = checkFace + 1;
}
$('#demoResult2').css('border', '2px dashed #148b8b');
} else {
$('.alert-msg').show();
$('.alert-msg p').text('چهره‌ای در تصویر دوم شناسایی نشد');
setTimeout(function () {
$('.alert-msg').hide();
$('.alert-msg p').text('');
}, 2000);
if (checkFace > 0) {
checkFace = checkFace - 1;
}
$('#SaveImageEmployee').addClass('disable');
$('.upload-image2').css('background', '#ff090940');
$('#demoResult2').css('border', '2px dashed #ff5c5c');
}
updateSaveButton();
$('#loadingImage2').hide();
};
var FACING_MODES = JslibHtml5CameraPhoto.FACING_MODES;
var IMAGE_TYPES = JslibHtml5CameraPhoto.IMAGE_TYPES;
// Check if videoElement is already declared to avoid redeclaration
// if (typeof videoElement === 'undefined') {
var videoElement = document.getElementById('videoElement');
var cameraPhoto = new JslibHtml5CameraPhoto.default(videoElement);
// }
function startCamera() {
// startCameraMaxResolution
cameraPhoto.startCamera(FACING_MODES.USER).then(() => {
console.log('Camera started!');
}).catch((error) => {
console.log(error);
console.error('Camera not started!', error);
});
}
function stopCamera() {
cameraPhoto.stopCamera().then(() => {
console.log('Camera stopped!');
}).catch((error) => {
console.log('No camera to stop!:', error);
});
}
function cropAndResizeImage(base64Str, newWidth, newHeight) {
return new Promise((resolve) => {
let img = new Image();
img.src = base64Str;
img.onload = () => {
let canvas = document.createElement('canvas');
let ctx = canvas.getContext('2d');
let sideLength = Math.min(img.width, img.height);
let startX = (img.width - sideLength) / 2;
let startY = (img.height - sideLength) / 2;
canvas.width = newWidth;
canvas.height = newHeight;
ctx.drawImage(img, startX, startY, sideLength, sideLength, 0, 0, newWidth, newHeight);
resolve(canvas.toDataURL('image/jpeg'));
};
});
}
var dataUri = cameraPhoto.getDataUri(config);
cropAndResizeImage(dataUri, 1800, 1800).then((resizedDataUri) => {
document.getElementById('result2').innerHTML = '<img style="display:none; object-fit: cover;" id="pic2" data-uri="' + resizedDataUri + '" src="' + resizedDataUri + '"/>';
document.getElementById('demoResult2').innerHTML = '<button type="button" class="upload-image2">آپلود عکس دوم</button><img style="width: 100%; height: 100%; border-radius:10px; object-fit: cover;" data-uri="' + resizedDataUri + '" src="' + resizedDataUri + '"/>';
}).catch((error) => {
console.error('Error cropping and resizing photo:', error);
});
function take_snapshot1() {
$('#SaveImageEmployee').addClass('disable');
var sizeFactor = 1;
var imageType = IMAGE_TYPES.JPG;
var imageCompression = 1;
$('.md-modal').removeClass('md-show');
stopCamera();
}
var config = {
sizeFactor,
imageType,
imageCompression
};
function set() {
let pic1 = $("#pic1").attr('src');
let pic2 = $("#pic2").attr('src');
let workshopId = Number($('#workshopId').val());
let employeeId = Number($('#employeeId').val());
var dataUri = cameraPhoto.getDataUri(config);
cropAndResizeImage(dataUri, 1800, 1800).then((resizedDataUri) => {
document.getElementById('result1').innerHTML = '<img style="display:none; object-fit: cover;" id="pic1" data-uri="' + resizedDataUri + '" src="' + resizedDataUri + '"/>';
document.getElementById('demoResult1').innerHTML = '<button type="button" class="upload-image1">آپلود عکس اول</button><div class="loadingImage" id="loadingImage1"><div class="spinner-border" role="status"><span class="visually-hidden">Loading...</span></div></div><img style="width: 100%; height: 100%; border-radius:10px; object-fit: cover;" data-uri="' + resizedDataUri + '" src="' + resizedDataUri + '"/>';
$('#loadingImage1').css('display', 'flex');
runCheckFace1();
}).catch((error) => {
console.error('Error cropping and resizing photo:', error);
});
$('.md-modal').removeClass('md-show');
stopCamera();
}
function take_snapshot2() {
$('#SaveImageEmployee').addClass('disable');
var sizeFactor = 1;
var imageType = IMAGE_TYPES.JPG;
var imageCompression = 1;
var config = {
sizeFactor,
imageType,
imageCompression
};
var dataUri = cameraPhoto.getDataUri(config);
cropAndResizeImage(dataUri, 1800, 1800).then((resizedDataUri) => {
document.getElementById('result2').innerHTML = '<img style="display:none; object-fit: cover;" id="pic2" data-uri="' + resizedDataUri + '" src="' + resizedDataUri + '"/>';
document.getElementById('demoResult2').innerHTML = '<button type="button" class="upload-image2">آپلود عکس دوم</button><div class="loadingImage" id="loadingImage2"><div class="spinner-border" role="status"><span class="visually-hidden">Loading...</span></div></div><img style="width: 100%; height: 100%; border-radius:10px; object-fit: cover;" data-uri="' + resizedDataUri + '" src="' + resizedDataUri + '"/>';
$('#loadingImage2').css('display', 'flex');
runCheckFace2();
}).catch((error) => {
console.error('Error cropping and resizing photo:', error);
});
$('.md-modal').removeClass('md-show');
stopCamera();
loadModels();
runCheckFace2();
}
function set() {
let pic1 = $("#pic1").attr('src');
let pic2 = $("#pic2").attr('src');
let workshopId = Number($('#workshopId').val());
let employeeId = Number($('#employeeId').val());
if (checkFace) {
if (pic1 != null && pic2 != null) {
const loading = $('.spinner-loading-progress').show();
const loadingBtn = $('.spinner-loading').show();
let startTime = Date.now();
$('#SaveImageEmployee').addClass('disable');
$.ajax({
type: 'POST',
url: takePictureAjax,
data: { "base64pic1": pic1, "base64pic2": pic2, "workshopId": workshopId, "employeeId": employeeId },
headers: { "RequestVerificationToken": antiForgeryToken },
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('');
window.location.reload();
}, 2000);
} else {
$('.alert-msg').show();
$('.alert-msg p').text(response.message);
setTimeout(function () {
$('.alert-msg').hide();
$('.alert-msg p').text('');
}, 3500);
}
data: {
"base64pic1": pic1,
"base64pic2": pic2,
"workshopId": workshopId,
"employeeId": employeeId
},
failure: function (response) {
headers: {
"RequestVerificationToken": antiForgeryToken
},
xhr: function () {
let xhr = new XMLHttpRequest();
// Track the progress of the upload
xhr.upload.onprogress = function (e) {
if (e.lengthComputable) {
var percentComplete = (e.loaded / e.total) * 100;
$('#progressBar').text(Math.round(percentComplete) + '%');
$('.spinner-loading-progress').css('width', `${Math.round(percentComplete)}%`);
}
};
return xhr;
},
success: function (response) {
let elapsedTime = Date.now() - startTime;
let delay = Math.max(1000 - elapsedTime, 0);
setTimeout(function () {
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('');
$('#SaveImageEmployee').removeClass('disable');
//loading.hide();
$('#MainModal').modal('hide');
//window.location.reload();
}, 1000);
} else {
$('#SaveImageEmployee').removeClass('disable');
$('.alert-msg').show();
$('.alert-msg p').text(response.message);
setTimeout(function () {
$('.alert-msg').hide();
$('.alert-msg p').text('');
}, 3500);
}
}, delay); // Delay the hiding of the spinner
},
error: function (response) {
console.log(5, response);
}
});
@@ -289,4 +444,70 @@
$('.alert-msg p').text('');
}, 3500);
}
}
} else {
$('.alert-msg').show();
$('.alert-msg p').text('گرفتن دو عکس الزامیست');
setTimeout(function () {
$('.alert-msg').hide();
$('.alert-msg p').text('');
}, 3500);
}
}
//function set() {
// let pic1 = $("#pic1").attr('src');
// let pic2 = $("#pic2").attr('src');
// let workshopId = Number($('#workshopId').val());
// let employeeId = Number($('#employeeId').val());
// if (checkFace) {
// if (pic1 != null && pic2 != null) {
// $.ajax({
// type: 'POST',
// url: takePictureAjax,
// data: { "base64pic1": pic1, "base64pic2": pic2, "workshopId": workshopId, "employeeId": employeeId },
// headers: { "RequestVerificationToken": antiForgeryToken },
// 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('');
// window.location.reload();
// },
// 2000);
// } else {
// $('.alert-msg').show();
// $('.alert-msg p').text(response.message);
// setTimeout(function() {
// $('.alert-msg').hide();
// $('.alert-msg p').text('');
// },
// 3500);
// }
// },
// failure: function(response) {
// console.log(5, response);
// }
// });
// } else {
// $('.alert-msg').show();
// $('.alert-msg p').text('گرفتن دو عکس الزامیست');
// setTimeout(function() {
// $('.alert-msg').hide();
// $('.alert-msg p').text('');
// },
// 3500);
// }
// } else {
// $('.alert-msg').show();
// $('.alert-msg p').text('گرفتن دو عکس الزامیست');
// setTimeout(function () {
// $('.alert-msg').hide();
// $('.alert-msg p').text('');
// }, 3500);
// }
//}