@using _0_Framework.Domain.CustomizeCheckoutShared.Enums
@using Microsoft.AspNetCore.Mvc.TagHelpers
@model CompanyManagment.App.Contracts.CustomizeWorkshopSettings.EditCustomizeWorkshopGroupSettings
@{
	string clientVersion = _0_Framework.Application.Version.StyleVersion;
	int indexShiftViewModel = 0;
	int indexShiftViewModelRS = 0;
	<link href="~/assetsclient/pages/rollcall/css/modaleditgroup.css?var=@clientVersion" rel="stylesheet" />
}

	<div class="modal-content">

		<div class="modal-header d-block text-center mb-0 pb-0">
			<button type="button" class="btn-close position-absolute text-start" data-bs-dismiss="modal" aria-label="Close"></button>
			<h6>ویرایش گروه <span>@Model.Name</span></h6>
		</div>

		<div class="modal-body pt-2">
			<form role="form" method="post" name="edit-form" id="edit-form" autocomplete="off">
				<input type="hidden" asp-for="@Model.CustomizeWorkshopSettingId" />
				<div class="container p-0 m-0">
					<div class="row">
					<input type="hidden" id="CommandID" asp-for="@Model.Id" />
					<div class="lableCheckBreakTime">نام گروه</div>
						<div class="col-12 d-flex align-items-center">
							<input type="text" class="form-control m-0" asp-for="@Model.Name" placeholder="نام گروه را وارد نمایید"/>
						</div>
					</div>

					<div class="row p-0">
						<div class="d-flex flex-column align-items-center justify-content-center h-100">
							<div class="d-flex align-items-center justify-content-center mt-3 mb-1">
								<p class="m-0">ساعات کاری پرسنل این گروه را مشخص نمائید</p>
							</div>
							<div class="btn-workTimeOption-container align-items-center justify-content-center w-100">
								<input type="radio" value="Regular" name="workshopShiftStatus" id="organized" class="radio-workTimeOption">
								<label for="organized" class="radio-label-workTimeOption w-100">منظم</label>
								
								<input type="radio" value="Rotating" name="workshopShiftStatus" id="rotating_shift" class="radio-workTimeOption">
								<label for="rotating_shift" class="radio-label-workTimeOption w-100">گردشی</label>

								<input type="radio" value="Irregular" name="workshopShiftStatus" id="disorganized" class="radio-workTimeOption">
								<label for="disorganized" class="radio-label-workTimeOption w-100">مختلط</label>
							</div>
						</div>
					</div>

					<div class="row mt-2" id="step_workTimeOption" style="height: 0; display: none">
						<div class="col-12" id="appendChildTimeWorkHtml">

							@if (Model.ShiftViewModel.Any())
							{
								@foreach (var item in Model.ShiftViewModel)
								{
									<div class="groupBox">
										<div class="row align-items-center justify-content-between">
											<div class="col-3 d-flex align-items-center">
												<input type="hidden" name="ShiftViewModel[@indexShiftViewModel].Placement" value="@item.Placement"/>
												<div class="timeWorkTitle">
													@if (indexShiftViewModel == 0)
													{
														@("نوبت اول")
													}
													else if (indexShiftViewModel == 1)
													{
														@("نوبت دوم")
													} 
													else if (indexShiftViewModel == 2)
													{
														@("نوبت سوم")
													}
												</div>
											</div>

											<div class="col-4 d-flex align-items-center">
												<div class="timeWorkTitle">از</div>
												<input type="text" class="form-control text-center dateTime" name="ShiftViewModel[@indexShiftViewModel].StartTime" value="@item.StartTime" placeholder="00:00" style="direction: ltr;"/>
											</div>

											<div class="col-4 d-flex align-items-center">
												<div class="timeWorkTitle">الی</div>
												<input type="text" class="form-control text-center dateTime" name="ShiftViewModel[@indexShiftViewModel].EndTime" value="@item.EndTime" placeholder="00:00" style="direction: ltr;"/>
											</div>
											@if (indexShiftViewModel == 0)
											{
												<div class="col-1 d-flex align-items-center justify-content-end">
												</div>
											}
											else
											{
												<div class="col-1 d-flex align-items-center justify-content-end">
													<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>
										@{
											indexShiftViewModel++;
										}
									</div>
								}
							}
							else
							{
								<div class="groupBox">
									<div class="row align-items-center justify-content-between">

										<div class="col-3 d-flex align-items-center">
											<input type="hidden" name="ShiftViewModel[0].Placement" value="First"/>
											<div class="timeWorkTitle">
												نوبت اول
											</div>
										</div>

										<div class="col-4 d-flex align-items-center">
											<div class="timeWorkTitle">از</div>
											<input type="text" class="form-control text-center dateTime" name="ShiftViewModel[0].StartTime" value="" placeholder="00:00" style="direction: ltr;">
										</div>

										<div class="col-4 d-flex align-items-center">
											<div class="timeWorkTitle">الی</div>
											<input type="text" class="form-control text-center dateTime" name="ShiftViewModel[0].EndTime" value="" placeholder="00:00" style="direction: ltr;">
										</div>
										<div class="col-1 d-flex align-items-center justify-content-end">
										</div>

									</div>
								</div>
							}
						</div>
						<div class="d-flex align-items-center justify-content-center w-100 my-2">
							
							<button type="button" class="btnAddTimeWork @(Model.ShiftViewModel.Count() == 3 ? "d-none" : "")">
								<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>
								@if (Model.ShiftViewModel.Count() == 2)
								{
									<div class="mx-1 btnAppendChildTimeWork">افزودن نوبت سوم</div>
								}
								else if (Model.ShiftViewModel.Count() == 1)
								{
									<div class="mx-1 btnAppendChildTimeWork">افزودن نوبت دوم</div>
								}
								else
								{
									<div class="mx-1 btnAppendChildTimeWork"></div>
								}
							</button>
						
						</div>
						<div class="col-12">
							<p class="m-0" id="ShowSettingMessage"></p>
						</div>
					</div>
					
					
					
					
					
					
					
					
					
					

					<div class="row mt-2" id="step_workTimeOptionRotatingShift" style="height: 0; display: none">
						<div class="col-12" id="appendChildTimeWorkHtmlRS">
							
						@if (Model.CustomizeRotatingShiftsViewModels.Any())
						{
							@foreach (var item in Model.CustomizeRotatingShiftsViewModels)
							{

								<div class="groupBoxRS">
									<div class="row align-items-center justify-content-between">
										<div class="col-3 d-flex align-items-center">
											<div class="timeWorkTitle">
												@if (indexShiftViewModelRS == 0)
												{
													@("نوبت اول")
												}
												else if (indexShiftViewModelRS == 1)
												{
													@("نوبت دوم")
												}
												else if (indexShiftViewModelRS == 2)
												{
													@("نوبت سوم")
												}
												else if (indexShiftViewModelRS == 3)
												{
													@("نوبت چهارم")
												}
											</div>
										</div>

										<div class="col-4 d-flex align-items-center">
											<div class="timeWorkTitle">از</div>
											<input type="text" class="form-control text-center dateTimeRS" name="CustomizeRotatingShiftsViewModels[@indexShiftViewModelRS].StartTime" value="@item.StartTime" placeholder="00:00" style="direction: ltr;" />
										</div>

										<div class="col-4 d-flex align-items-center">
											<div class="timeWorkTitle">الی</div>
											<input type="text" class="form-control text-center dateTimeRS" name="CustomizeRotatingShiftsViewModels[@indexShiftViewModelRS].EndTime" value="@item.EndTime" placeholder="00:00" style="direction: ltr;" />
										</div>
										@if (indexShiftViewModelRS == 0)
										{
											<div class="col-1 d-flex align-items-center justify-content-end">
											</div>
										}
										else
										{
											<div class="col-1 d-flex align-items-center justify-content-end">
												<button type="button" class="btnRemoveTimeWorkRS">
													<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>
									@{
										indexShiftViewModelRS++;
									}
								</div>
							}
						}
						else
						{
							<div class="groupBoxRS">
								<div class="row align-items-center justify-content-between">
									<div class="col-3 d-flex align-items-center">
										<div class="timeWorkTitle">نوبت اول</div>
									</div>

									<div class="col-4 d-flex align-items-center">
										<div class="timeWorkTitle">از</div>
										<input type="text" class="form-control text-center dateTimeRS" id="startDateTimeRS" name="CustomizeRotatingShiftsViewModels[0].StartTime" placeholder="00:00" style="direction: ltr;">
									</div>

									<div class="col-4 d-flex align-items-center">
										<div class="timeWorkTitle">الی</div>
										<input type="text" class="form-control text-center dateTimeRS" id="endDateTimeRS" name="CustomizeRotatingShiftsViewModels[0].EndTime" placeholder="00:00" style="direction: ltr;">
									</div>
									<div class="col-1 d-flex align-items-center justify-content-end">
									</div>
								</div>
							</div>
						}
						</div>
						<div class="d-flex align-items-center justify-content-center w-100 my-2">
							<button type="button" class="btnAddTimeWorkRS @(Model.CustomizeRotatingShiftsViewModels.Count() == 4 ? "d-none" : "")">
								<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>
								
								@if (Model.CustomizeRotatingShiftsViewModels.Count() == 1)
								{
									<div class="mx-1 btnAppendChildTimeWorkRS">افزودن نوبت دوم</div>
								}
								else if (Model.CustomizeRotatingShiftsViewModels.Count() == 2)
								{
									<div class="mx-1 btnAppendChildTimeWorkRS">افزودن نوبت سوم</div>
								}
								else if (Model.CustomizeRotatingShiftsViewModels.Count() == 3)
								{
									<div class="mx-1 btnAppendChildTimeWorkRS">افزودن نوبت چهارم</div>
								}
								else
								{
									<div class="mx-1 btnAppendChildTimeWorkRS"></div>
								}
							</button>
						</div>
						<div class="col-12">
							<p class="m-0" id="ShowSettingMessageRS"></p>
						</div>
					</div>


					<div class="row p-0" id="step_workTimeOptionIrregular" style="height: 0; gap: 12px; @(Model.WorkshopShiftStatus == WorkshopShiftStatus.Regular ? "display: none" : "")">
						
						<div class="btn-workTimeOption-container align-items-center justify-content-center mt-4">
							<input type="radio" id="TwelveTwentyFour" value="@WorkshopIrregularShifts.TwelveTwentyFour" name="IrregularShift.WorkshopIrregularShifts" class="radio-workTimeOption" @(Model.IrregularShift.WorkshopIrregularShifts == WorkshopIrregularShifts.TwelveTwentyFour ? "checked" : "")>
							<label for="TwelveTwentyFour" class="radio-label-workTimeOption w-100 outlineDate">12 ساعت کار 24 ساعت استراحت</label>

							<input type="radio" id="TwentyFourTwentyFour" value="@WorkshopIrregularShifts.TwentyFourTwentyFour" name="IrregularShift.WorkshopIrregularShifts" class="radio-workTimeOption" @(Model.IrregularShift.WorkshopIrregularShifts == WorkshopIrregularShifts.TwentyFourTwentyFour ? "checked" : "")>
						<label for="TwentyFourTwentyFour" class="radio-label-workTimeOption w-100 outlineDate">24 ساعت کار 24 ساعت استراحت</label>
						</div>
						
						<div class="btn-workTimeOption-container align-items-center justify-content-center">
							<input type="radio" id="TwelveThirtySix" value="@WorkshopIrregularShifts.TwelveThirtySix" name="IrregularShift.WorkshopIrregularShifts" class="radio-workTimeOption" @(Model.IrregularShift.WorkshopIrregularShifts == WorkshopIrregularShifts.TwelveThirtySix ? "checked" : "")>
							<label for="TwelveThirtySix" class="radio-label-workTimeOption w-100 outlineDate">12 ساعت کار 36 ساعت استراحت</label>

							<input type="radio" id="TwentyFourFortyEight" value="@WorkshopIrregularShifts.TwentyFourFortyEight" name="IrregularShift.WorkshopIrregularShifts" class="radio-workTimeOption" @(Model.IrregularShift.WorkshopIrregularShifts == WorkshopIrregularShifts.TwentyFourFortyEight ? "checked" : "")>
							<label for="TwentyFourFortyEight" class="radio-label-workTimeOption w-100 outlineDate">24 ساعت کار 48 ساعت استراحت</label>
						</div>
						
						<div class="hrLine"></div>
						
						<div class="col-12">
							<div class="groupBoxIrregular @(Model.WorkshopShiftStatus != WorkshopShiftStatus.Regular ? "" : "disable")" id="irregularShiftsDateTime">
								<div class="row align-items-center justify-content-between">
									<div class="col-2 d-flex align-items-center">
										<div class="timeWorkTitle"></div>
									</div>

									<div class="col-4 d-flex align-items-center">
										<div class="timeWorkTitle">از</div>
										<input type="text" class="form-control text-center dateTimeIrregular" id="irregularShiftsStartDateTime" value="@Model.IrregularShift.StartTime.ToString("HH:mm")" name="IrregularShift.StartTime" placeholder="00:00" style="direction: ltr;">
									</div>

									<div class="col-4 d-flex align-items-center">
										<div class="timeWorkTitle">الی</div>
									<input type="text" class="form-control text-center dateTimeIrregular" id="irregularShiftsEndDateTime" value="@Model.IrregularShift.EndTime.ToString("HH:mm")" name="IrregularShift.EndTime" placeholder="00:00" style="direction: ltr;">
									</div>
									<div class="col-2 d-flex align-items-center justify-content-end">
									</div>
								</div>
							</div>
						</div>

					</div>
				</div>
			</form>
		</div>

		<div class="modal-footer">
			<div class="container my-2">
				<div class="row breack-time">
					<div>
						<div class="d-flex align-items-center my-1 breakTimeDiv">
							<input type="checkbox" id="BreakTimeFirst" name="BreakTime.hasBreakTimeValue" class="form-check-input" @(Model.BreakTime.BreakTimeType == BreakTimeType.WithoutTime ? "checked" : "")>
							<label for="BreakTimeFirst" class="lableCheckBreakTime">
								این پرسنل دارای ساعت استراحت نامشخص می باشد با انتخاب این تیک پرسنل باید برای استراحت ورود و خروج ثبت کند.
							</label>
						</div>
					</div>

					<div class="d-block">
						<div class="d-flex align-items-center my-1 breakTimeDiv">
							<input type="checkbox" id="BreakTime" name="BreakTime.hasBreakTimeValue" class="form-check-input" @(Model.BreakTime.BreakTimeType == BreakTimeType.WithTime ? "checked" : "")>
							<label for="BreakTime" class="lableCheckBreakTime">
								این پرسنل دارای ساعت استراحت ثابت روزانه می باشد که بصورت خودکار در فیش حقوقی محاسبه می گردد:
							</label>
						</div>

						<div class="d-flex align-items-center justify-content-center my-1 mt-3 @(Model.BreakTime.BreakTimeType == BreakTimeType.None || Model.BreakTime.BreakTimeType == BreakTimeType.WithoutTime ? "disable" : "")" id="computeTime">
							<div class="position-relative">
								<label for="hour" class="position-absolute" style="bottom: 25px; font-size: 13px; font-weight: 700; right: 5px; background-color: #fff; padding: 0 4px;">ساعت</label>
								<select id="hour" asp-for="@Model.BreakTime.BreakTimeValue.Hour" name="selectCheckBreakTime" class="form-select selectCheckBreakTime">
									<option value="0" selected>ساعت</option>
									<option value="1">1</option>
									<option value="2">2</option>
									<option value="3">3</option>
								</select>
							</div>
							<span class="mx-1">:</span>
							<div class="position-relative">
								<label for="min" class="position-absolute" style="bottom: 25px; font-size: 13px; font-weight: 700; right: 5px; background-color: #fff; padding: 0 4px;">دقیقه</label>
								<select id="min" asp-for="@Model.BreakTime.BreakTimeValue.Minute" name="selectCheckBreakTime" class="form-select selectCheckBreakTime">
									<option value="00" selected>دقیقه</option>
									<option value="5">5</option>
									<option value="10">10</option>
									<option value="15">15</option>
									<option value="20">20</option>
									<option value="25">25</option>
									<option value="30">30</option>
									<option value="35">35</option>
									<option value="40">40</option>
									<option value="45">45</option>
									<option value="50">50</option>
									<option value="55">55</option>
								</select>
							</div>

							<input type="hidden" id="TimeOnly" name="BreakTime.BreakTimeValue" value="@Model.BreakTime.BreakTimeValue.ToString("HH:mm")"/>
							@* <span class="mx-1" id="computeTimeText"></span> *@
						</div>
					</div>
				</div>



				<div class="row mt-2">
					<div class="col-12">
						<div class="lableCheckBreakTime text-center">وضعیت فعالیت مجموعه در روز های جمعه و تعطیلات رسمی</div>
						<div class="row extraOptionBorder">

							<div class="col-6 p-0">
								<div class="group-container">
									@* <div class="lableCheckBreakTime">وضعیت فعالیت مجموعه در روز های جمعه</div> *@
									@* <div class="d-flex form-group my-1 group">
										<input type="radio" name="FridayWork" id="Friday1" class="form-check-input Main-Radio" @(Model.FridayWork == FridayWork.Default ? "checked" : "") value="@((int)(FridayWork.Default))" />
										<label for="Friday1" class="lableCheckBreakTime">پرسنل در روزهای جمعه کار نمی‌کند.</label>
									</div>
									<div class="d-flex form-group my-1 group">
										<input type="radio" name="FridayWork" id="Friday2" class="form-check-input Main-Radio" @(Model.FridayWork == FridayWork.WorkInFriday ? "checked" : "") value="@((int)(FridayWork.WorkInFriday))" />
										<label for="Friday2" class="lableCheckBreakTime">پرسنل در روزهای جمعه کار می‌کند.</label>
									</div> *@
								</div>

							</div>


							<div class="col-6 p-0">
								<div class="group-container">
									@* <div class="lableCheckBreakTime">وضعیت فعالیت مجموعه در روز های تعطیلات رسمی</div> *@
									<div class="d-flex form-group my-1 group">
										<input type="radio" name="HolidayWork" id="OffDays1" class="form-check-input Main-Radio" @(Model.HolidayWork == HolidayWork.Default ? "checked" : "") value="@((int)(HolidayWork.Default))" />
										<label for="OffDays1" class="lableCheckBreakTime">پرسنل در ایام تعطیل رسمی کار نمی‌کند.</label>
									</div>
									<div class="d-flex form-group my-1 group">
										<input type="radio" name="HolidayWork" id="OffDays2" class="form-check-input Main-Radio" @(Model.HolidayWork == HolidayWork.WorkInHolidays ? "checked" : "") value="@((int)(HolidayWork.WorkInHolidays))" />
										<label for="OffDays2" class="lableCheckBreakTime">پرسنل در ایام تعطیل رسمی کار می‌کند.</label>
									</div>
								</div>
							</div>

						</div>
					</div>
				</div>

			</div>

			<div class="container m-0">
				<div class="row">
					<div class="col-6 text-end">
					<button type="button" class="btn-cancel2 d-flex align-items-center justify-content-center w-100">انصراف</button>
					</div>
					<div class="col-6 text-start">
						<button type="button" id="btnSave" class="btn-register d-flex align-items-center justify-content-center w-100" onclick="ajaxEditGroupingSaveData()">
							<span class="text-nowrap">ثبت ویرایش</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>

<!-- مودال -->
<div id="ConfirmEmployeeModal" style="display: none" data-bs-backdrop="static" aria-hidden="true" tabindex="-1">
	<div class="modal-dialog modal-dialog-centered ConfirmEmployeeSection">
		<div class="" id="ModalConfirmEmployeeChange">
			<partial name="_Partials/ConfirmEmployeeChangeModal" />
		</div>
	</div>
</div>
<!-- مودال -->


<!-- مودال تاییده -->
<div id="ConfirmModal" style="display: none">
	<div class="modal-dialog modal-dialog-centered ConfirmSection">
		<div class="" id="ModalConfirmChange">
			<partial name="_Partials/ConfirmEditGroupTimeChangeModal" />
		</div>
	</div>
</div>
<!-- مودال تاییده -->

<script src="~/assetsclient/libs/cleave/cleave.min.js"></script>
<script>
	var antiForgeryToken = $(`@Html.AntiForgeryToken()`).val();
	var ajaxEditGroupSave = `@Url.Page("./Grouping", "EditGroup")`;

	var indexShiftViewModel = Number(@indexShiftViewModel);
	var indexShiftViewModelRS = Number(@indexShiftViewModel);

	var ajaxEmployeeSettingsHasChangedValueUrl = `@Url.Page("./Grouping", "EmployeeSettingsHasChangedValue")`;
	var groupId = Number(@Model.Id);

	var IsRegularWorkshop = @(Model.WorkshopShiftStatus == WorkshopShiftStatus.Regular ? 0 : Model.WorkshopShiftStatus == WorkshopShiftStatus.Irregular ? 1 : 2);
	var ajaxReCalculateValuesUrl = `@Url.Page("./Grouping", "ReCalculateValues")`;
	
</script>
<script src="~/assetsclient/pages/rollcall/js/modaleditgroup.js?ver=clientVersion"></script>