610 lines
19 KiB
Plaintext
610 lines
19 KiB
Plaintext
@model CompanyManagment.App.Contracts.RollCall.EmployeeRollCallsViewModel
|
|
@{
|
|
string clientVersion = _0_Framework.Application.Version.StyleVersion;
|
|
var index = 0;
|
|
var count = Model.RollCalls.Count;
|
|
string countString;
|
|
string txtString;
|
|
|
|
<link rel="stylesheet" href="~/AssetsClient/css/rollcall-package.css?ver=@clientVersion">
|
|
<link href="~/AssetsClient/css/select2.css" rel="stylesheet" />
|
|
<style>
|
|
.errored {
|
|
animation: shake 300ms;
|
|
color: #eb3434 !important;
|
|
background-color: #fef2f2 !important;
|
|
border: 1px solid #eb3434 !important;
|
|
}
|
|
|
|
.modalRollCallWidth {
|
|
max-width: 670px;
|
|
}
|
|
|
|
.modal-dialog, .modal-content {
|
|
height: 510px;
|
|
}
|
|
|
|
.timeWorkTitle {
|
|
color: #5C5C5C;
|
|
font-weight: 600;
|
|
font-size: 12px;
|
|
margin: auto 0 auto 6px;
|
|
white-space: nowrap;
|
|
width: 100px;
|
|
}
|
|
|
|
.groupBox {
|
|
background-color: #F5F5F5;
|
|
border-radius: 10px;
|
|
border: 1px solid #E7E7E7;
|
|
padding: 6px;
|
|
margin: 6px 3px;
|
|
}
|
|
|
|
.groupBox .form-control {
|
|
background-color: #ffffff;
|
|
padding: .375rem .35rem;
|
|
}
|
|
|
|
.groupBox .form-control::placeholder {
|
|
color: #bfbfbf;
|
|
opacity: 1; /* Firefox */
|
|
}
|
|
|
|
.groupBox .form-control::-ms-input-placeholder { /* Edge 12-18 */
|
|
color: #bfbfbf;
|
|
}
|
|
|
|
.btnAddTimeWork {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background-color: #84CC16;
|
|
border-radius: 5px;
|
|
color: #ffffff;
|
|
font-size: 12px;
|
|
font-weight: 500;
|
|
padding: 4px 8px;
|
|
}
|
|
|
|
.removeBtn {
|
|
width: 42px
|
|
}
|
|
|
|
.btnRemoveTimeWork {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
background-color: #F87171;
|
|
border-radius: 7px;
|
|
/* padding: 3px; */
|
|
width: 24px;
|
|
height: 24px;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.ShowMessage {
|
|
position: absolute;
|
|
background: #dfdfdf;
|
|
width: 100%;
|
|
top: 0;
|
|
right: 0;
|
|
height: 100%;
|
|
border-radius: 10px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.heightControll {
|
|
height: 240px;
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
.irregularText {
|
|
color: #5C5C5C;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.irregularBox {
|
|
position: relative;
|
|
width: 100%;
|
|
overflow: hidden;
|
|
background-color: #F5F5F5;
|
|
border-radius: 9px;
|
|
border: 1px solid #E7E7E7;
|
|
padding: 10px;
|
|
}
|
|
|
|
.irrregularContent {
|
|
flex-shrink: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
transform: translateX(100%);
|
|
transition: transform 1s ease-in-out, opacity 1s ease-in-out;
|
|
opacity: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
|
|
.irrregularContent.active {
|
|
transform: translateX(0);
|
|
opacity: 1;
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
.navButton {
|
|
background-color: transparent;
|
|
color: white;
|
|
border: none;
|
|
padding: 10px 20px;
|
|
cursor: pointer;
|
|
font-size: 16px;
|
|
margin: 10px;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border-radius: 4px;
|
|
transition: background-color 0.3s ease;
|
|
}
|
|
|
|
.navigation svg path {
|
|
transition: fill 0.3s ease;
|
|
}
|
|
|
|
|
|
|
|
.allSumtxt {
|
|
font-size: 13px;
|
|
font-weight: 500;
|
|
color: #7f7f7f;
|
|
position: absolute;
|
|
top: 7px;
|
|
left: 6px;
|
|
}
|
|
|
|
|
|
.startDatetxt {
|
|
font-size: 12px;
|
|
font-weight: 500;
|
|
color: #5C5C5C;
|
|
background-color: #ECFCCA;
|
|
border: 1px solid #AAE729;
|
|
width: 140px;
|
|
padding: 5px;
|
|
text-align: center;
|
|
border-radius: 6px;
|
|
}
|
|
|
|
.endDatetxt {
|
|
font-size: 12px;
|
|
font-weight: 500;
|
|
color: #5C5C5C;
|
|
background-color: #ECFCCA;
|
|
border: 1px solid #AAE729;
|
|
width: 140px;
|
|
padding: 4px 5px;
|
|
text-align: center;
|
|
border-radius: 6px;
|
|
}
|
|
|
|
.cusDateTime {
|
|
width: 66px;
|
|
}
|
|
|
|
@@media (max-width: 768px){
|
|
.cusDateTime {
|
|
width: 100%;
|
|
}
|
|
|
|
.mainDate {
|
|
width: 70px;
|
|
}
|
|
|
|
.startDatetxt {
|
|
font-size: 10px;
|
|
font-weight: 800;
|
|
width: 70px;
|
|
}
|
|
|
|
.endDatetxt {
|
|
font-size: 10px;
|
|
font-weight: 800;
|
|
width: 70px;
|
|
}
|
|
|
|
.form-control-date {
|
|
font-size: 10px;
|
|
font-weight: 700;
|
|
}
|
|
}
|
|
</style>
|
|
}
|
|
|
|
<form role="form" method="post" name="create-form" id="create-form" autocomplete="off">
|
|
|
|
<div class="modal-content">
|
|
<div class="modal-header d-block text-center mb-2">
|
|
<button type="button" class="btn-close position-absolute text-start" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
<h4 class="textListTitle">ویرایش ساعت حضور و غیاب</h4>
|
|
<h6 class="textListTitle" id="modalWorkshopFullname"></h6>
|
|
</div>
|
|
|
|
<div class="modal-body py-0">
|
|
<div class="container p-0 m-0">
|
|
<div class="row">
|
|
<div class="col-12 my-1">
|
|
<div class="select-alert">
|
|
<input type="hidden" id="employeeID" name="Command.EmployeeId" value="@Model.EmployeeId" />
|
|
<div class="position-relative">
|
|
<input class="form-control text-center disable" value="@Model.EmployeeFullName" placeholder="نام پرسنل" />
|
|
<span class="allSumtxt"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-12 my-1 position-relative">
|
|
<input type="hidden" name="Command.DateFa" value="@Model.DateFa" />
|
|
<input id="dateFa" class="form-control form-control-date text-center disable" value="@Model.DateFa" placeholder="تاریخ" style="direction: ltr" />
|
|
</div>
|
|
|
|
<div class="col-12 my-1 text-center d-flex align-items-center justify-content-center">
|
|
<div id="resultCalculateRollCallsTotal" style="font-size: 12px; border: 1px solid #04AAB6; border-radius: 5px; padding: 2px 10px; background: #E7F3F4;width: 170px;display: none"></div>
|
|
</div>
|
|
|
|
<div class="heightControll">
|
|
<div class="col-12" id="appendChildTimeWorkHtml">
|
|
@if (@Model.RollCalls.Count > 0)
|
|
{
|
|
@foreach (var item in Model.RollCalls)
|
|
{
|
|
@switch (index)
|
|
{
|
|
case 1:
|
|
txtString = "دوم";
|
|
break;
|
|
case 2:
|
|
txtString = "سوم";
|
|
break;
|
|
case 3:
|
|
txtString = "چهارم";
|
|
break;
|
|
case 4:
|
|
txtString = "پنجم";
|
|
break;
|
|
case 5:
|
|
txtString = "ششم";
|
|
break;
|
|
case 6:
|
|
txtString = "هفتم";
|
|
break;
|
|
case 7:
|
|
txtString = "هشتم";
|
|
break;
|
|
case 8:
|
|
txtString = "نهم";
|
|
break;
|
|
case 9:
|
|
txtString = "دهم";
|
|
break;
|
|
default:
|
|
txtString = "اول";
|
|
break;
|
|
}
|
|
|
|
<div class="groupBox">
|
|
<div class="d-flex align-items-end align-items-md-center justify-content-between">
|
|
<div class="timeWorkTitle d-none d-md-block">
|
|
نوبت @txtString
|
|
</div>
|
|
|
|
<div class="d-flex align-items-end align-items-md-center justify-content-between gap-2">
|
|
<div class="d-flex flex-md-row flex-column align-items-center justify-content-between gap-1 mainDate">
|
|
<span class="startDatetxt">@item.StartDayOfWeekFa</span>
|
|
<input type="text" class="form-control text-center form-control-date StartDate" name="Command.RollCallRecords[@index].StartDate" value="@item.StartDateFa" placeholder="0000/00/00" style="direction: ltr;">
|
|
</div>
|
|
<input type="text" class="form-control text-center cusDateTime dateTime StartTime" name="Command.RollCallRecords[@index].StartTime" placeholder="00:00" value="@item.StartTimeString" style="direction: ltr;">
|
|
</div>
|
|
|
|
<div class="mx-2 position-relative">
|
|
<div class="timeWorkTitle position-absolute d-block d-md-none" style="width: auto;bottom: 43px;right: -10px;">
|
|
نوبت @txtString
|
|
</div>
|
|
<div>الی</div>
|
|
</div>
|
|
|
|
<div class="d-flex align-items-end align-items-md-center justify-content-between gap-2">
|
|
<input type="text" class="form-control text-center cusDateTime dateTime EndTime" name="Command.RollCallRecords[@index].EndTime" placeholder="00:00" value="@item.EndTimeString" style="direction: ltr;">
|
|
<div class="d-flex flex-md-row flex-column align-items-center justify-content-between gap-1 mainDate">
|
|
<input type="text" class="order-2 order-md-0 form-control text-center form-control-date EndDate" name="Command.RollCallRecords[@index].EndDate" value="@item.EndDateFa" placeholder="0000/00/00" style="direction: ltr;">
|
|
<span class="order-1 order-md-0 endDatetxt">@item.EndDayOfWeekFa</span>
|
|
</div>
|
|
</div>
|
|
|
|
@if (index == 0)
|
|
{
|
|
<div class="removeBtn ms-2">
|
|
</div>
|
|
}
|
|
else
|
|
{
|
|
<div class="removeBtn ms-2">
|
|
<button type="button" class="btnRemoveTimeWork">
|
|
<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<circle cx="11" cy="11" r="8.25" stroke="white"/>
|
|
<path d="M6.875 11H15.125" stroke="white"/>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
}
|
|
</div>
|
|
</div>
|
|
index++;
|
|
}
|
|
}
|
|
else
|
|
{
|
|
<div class="groupBox">
|
|
<div class="d-flex align-items-end align-items-md-center justify-content-between">
|
|
<div class="timeWorkTitle d-none d-md-block">
|
|
نوبت اول
|
|
</div>
|
|
|
|
<div class="d-flex align-items-end align-items-md-center justify-content-between gap-2">
|
|
<div class="d-flex flex-md-row flex-column align-items-center justify-content-between gap-1 mainDate">
|
|
<span class="startDatetxt">-</span>
|
|
<input type="text" class="form-control text-center form-control-date StartDate" name="Command.RollCallRecords[0].StartDate" placeholder="0000/00/00" style="direction: ltr;">
|
|
</div>
|
|
<input type="text" class="form-control text-center cusDateTime dateTime StartTime" name="Command.RollCallRecords[0].StartTime" placeholder="00:00" style="direction: ltr;">
|
|
</div>
|
|
|
|
<div class="mx-2 position-relative">
|
|
<div class="timeWorkTitle position-absolute d-block d-md-none" style="width: auto;bottom: 43px;right: -10px;">
|
|
نوبت اول
|
|
</div>
|
|
<div>الی</div>
|
|
</div>
|
|
|
|
<div class="d-flex align-items-end align-items-md-center justify-content-between gap-2">
|
|
<input type="text" class="form-control text-center cusDateTime dateTime EndTime" name="Command.RollCallRecords[0].EndTime" placeholder="00:00" style="direction: ltr;">
|
|
<div class="d-flex flex-md-row flex-column align-items-center justify-content-between gap-1 mainDate">
|
|
<input type="text" class="order-2 order-md-0 form-control text-center form-control-date EndDate" name="Command.RollCallRecords[0].EndDate" placeholder="0000/00/00" style="direction: ltr;">
|
|
<span class="order-1 order-md-0 endDatetxt">-</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="removeBtn ms-2">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
|
|
</div>
|
|
|
|
<div class="d-flex align-items-center justify-content-center w-100 my-2">
|
|
<button type="button" class="btnAddTimeWork">
|
|
<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<circle cx="11" cy="11" r="8.25" stroke="white" />
|
|
<path d="M11 13.75L11 8.25" stroke="white" stroke-linecap="round" />
|
|
<path d="M13.75 11L8.25 11" stroke="white" stroke-linecap="round" />
|
|
</svg>
|
|
|
|
|
|
@switch (count)
|
|
{
|
|
case 0:
|
|
countString = "دوم";
|
|
break;
|
|
case 1:
|
|
countString = "دوم";
|
|
break;
|
|
case 2:
|
|
countString = "سوم";
|
|
break;
|
|
case 3:
|
|
countString = "چهارم";
|
|
break;
|
|
case 4:
|
|
countString = "پنجم";
|
|
break;
|
|
case 5:
|
|
countString = "ششم";
|
|
break;
|
|
case 6:
|
|
countString = "هفتم";
|
|
break;
|
|
case 7:
|
|
countString = "هشتم";
|
|
break;
|
|
case 8:
|
|
countString = "نهم";
|
|
break;
|
|
case 9:
|
|
countString = "دهم";
|
|
break;
|
|
default:
|
|
countString = "اول";
|
|
break;
|
|
}
|
|
|
|
<div class="mx-1 btnAppendChildTimeWork">افزودن نوبت @countString</div>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="col-12 my-1 d-none">
|
|
<div class="irregularBox">
|
|
<div class="row d-flex align-items-center">
|
|
<div class="col-2">
|
|
<div class="navigation">
|
|
<button type="button" id="prevBox" class="navButton">
|
|
<svg width="21" height="24" viewBox="0 0 21 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M19.5 9.40192C21.5 10.5566 21.5 13.4434 19.5 14.5981L4.5 23.2583C2.5 24.413 -1.17888e-06 22.9697 -1.07793e-06 20.6603L-3.2083e-07 3.33974C-2.19883e-07 1.03034 2.5 -0.413032 4.5 0.741669L19.5 9.40192Z" fill="#2DBDBD" />
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-8 position-relative overflow-hidden">
|
|
<div class="irrregularContent active">
|
|
<div class="row">
|
|
<div class="col-6">
|
|
<div class="form-group text-center">
|
|
<div class="irregularText">شروع بکار</div>
|
|
<input type="text" class="form-control text-center dateTimeIrregular" name="" placeholder="00:00" style="direction: ltr;">
|
|
</div>
|
|
</div>
|
|
<div class="col-6">
|
|
<div class="form-group text-center">
|
|
<div class="irregularText">پایان کار</div>
|
|
<input type="text" class="form-control text-center dateTimeIrregular" name="" placeholder="00:00" style="direction: ltr;">
|
|
</div>
|
|
</div>
|
|
|
|
|
|
@* if the date is same, then need col-12 *@
|
|
<div class="col-6">
|
|
<div class="form-group text-center">
|
|
<div class="irregularText">1403/08/25</div>
|
|
<div class="irregularText">شنبه</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-6">
|
|
<div class="form-group text-center">
|
|
<div class="irregularText">1403/08/26</div>
|
|
<div class="irregularText">یکشنبه</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="irrregularContent">
|
|
<div class="row">
|
|
<div class="col-6">
|
|
<div class="form-group text-center">
|
|
<div class="irregularText">شروع بکار</div>
|
|
<input type="text" class="form-control text-center dateTimeIrregular" name="" placeholder="00:00" style="direction: ltr;">
|
|
</div>
|
|
</div>
|
|
<div class="col-6">
|
|
<div class="form-group text-center">
|
|
<div class="irregularText">پایان کار</div>
|
|
<input type="text" class="form-control text-center dateTimeIrregular" name="" placeholder="00:00" style="direction: ltr;">
|
|
</div>
|
|
</div>
|
|
|
|
|
|
@* if the date is same, then need col-12 *@
|
|
<div class="col-6">
|
|
<div class="form-group text-center">
|
|
<div class="irregularText">1403/08/25</div>
|
|
<div class="irregularText">شنبه</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-6">
|
|
<div class="form-group text-center">
|
|
<div class="irregularText">1403/08/26</div>
|
|
<div class="irregularText">یکشنبه</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="irrregularContent">
|
|
<div class="row">
|
|
<div class="col-6">
|
|
<div class="form-group text-center">
|
|
<div class="irregularText">شروع بکار</div>
|
|
<input type="text" class="form-control text-center dateTimeIrregular" name="" placeholder="00:00" style="direction: ltr;">
|
|
</div>
|
|
</div>
|
|
<div class="col-6">
|
|
<div class="form-group text-center">
|
|
<div class="irregularText">پایان کار</div>
|
|
<input type="text" class="form-control text-center dateTimeIrregular" name="" placeholder="00:00" style="direction: ltr;">
|
|
</div>
|
|
</div>
|
|
|
|
|
|
@* if the date is same, then need col-12 *@
|
|
<div class="col-6">
|
|
<div class="form-group text-center">
|
|
<div class="irregularText">1403/08/25</div>
|
|
<div class="irregularText">شنبه</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-6">
|
|
<div class="form-group text-center">
|
|
<div class="irregularText">1403/08/26</div>
|
|
<div class="irregularText">یکشنبه</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-2">
|
|
<div class="navigation">
|
|
<button type="button" id="nextBox" class="navButton">
|
|
<svg width="21" height="24" viewBox="0 0 21 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M1.5 14.5981C-0.500003 13.4434 -0.5 10.5566 1.5 9.40192L16.5 0.741669C18.5 -0.413032 21 1.03034 21 3.33974L21 20.6603C21 22.9697 18.5 24.413 16.5 23.2583L1.5 14.5981Z" fill="#2DBDBD" />
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
<div class="ShowMessage d-none">
|
|
<p class="m-0" id="ShowSettingMessage"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal-footer">
|
|
<div class="container m-0">
|
|
<div class="row">
|
|
<div class="col-6 text-end">
|
|
<button type="button" class="btn-cancel2 d-flex justify-content-center w-100" id="prev-step" data-bs-dismiss="modal" aria-label="Close">انصراف</button>
|
|
</div>
|
|
<div class="col-6 text-start">
|
|
<button type="button" class="btn-register w-100 position-relative" id="next-step">
|
|
<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>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</form>
|
|
|
|
<script src="~/assetsclient/libs/jalaali-js/jalaali.js"></script>
|
|
<script src="~/assetsclient/libs/cleave/cleave.min.js"></script>
|
|
|
|
<script>
|
|
var antiForgeryToken = $('@Html.AntiForgeryToken()').val();
|
|
var saveRollCallWorkTimeAjax = `@Url.Page("./CaseHistory", "ManualCreateOrEdit")`;
|
|
var loadByEmployeeRollCallWorkTimeAjax = `@Url.Page("./CaseHistory", "ManualCreateOrEdit")`;
|
|
var dayOfWeekDataUrl = `@Url.Page("./CaseHistory", "DayOfWeek")`;
|
|
var totalWorkingDataUrl = `@Url.Page("./CaseHistory", "TotalWorking")`;
|
|
var calculateRollCallsTotalDurationDataUrl = `@Url.Page("./CaseHistory", "CalculateRollCallsTotalDuration")`;
|
|
|
|
var saveRollCallWorkTimeFromWorkFlowAjax = `@Url.Page("./RollCall", "ManualCreateOrEdit")`;
|
|
var calculateRollCallsTotalDurationDataWorkFlowUrl = `@Url.Page("./RollCall", "CalculateRollCallsTotalDuration")`;
|
|
var dayOfWeekDataWorkFlowUrl = `@Url.Page("./RollCall", "DayOfWeek")`;
|
|
|
|
//var itemsEditableDatesData = @@Html.Raw(Json.Serialize(Model.EditableDates));
|
|
</script>
|
|
<script src="~/assetsclient/pages/rollcall/js/ModalEditRollCall.js?ver=@clientVersion"></script> |