@using _0_Framework.Domain.CustomizeCheckoutShared.Enums
@using Microsoft.AspNetCore.Mvc.TagHelpers
@model CompanyManagment.App.Contracts.CustomizeWorkshopSettings.EditCustomizeWorkshopSettings
@{
	string adminVersion = _0_Framework.Application.Version.AdminVersion;
    int i = 0;
	<link rel="stylesheet" href="~/AssetsClient/css/rollcall-package.css">
	<link href="~/assetsclient/pages/rollcall/css/modalsettingworktime.css?ver=@adminVersion" rel="stylesheet" />
}

<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>
			<h6>تنظیم ساعات کاری</h6>
		</div>

		<div class="modal-body">
			<div class="container p-0 m-0">
				
				<div class="row p-0 m-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 mb-2">
							<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="Irregular" name="workshopShiftStatus" id="disorganized" class="radio-workTimeOption">
							<label for="disorganized" class="radio-label-workTimeOption w-100">مستمر</label>
						</div>
					</div>
				</div>

				<div class="row" id="step_workTimeOption" style="height: 0">

					<input type="hidden" name="customizeWorkshopSettingsId" id="customizeWorkshopSettingsId" value="@Model.Id"/>

					<div class="col-12" id="appendChildTimeWorkHtml">
						@if (Model.ShiftsList.Any())
						{
							@foreach (var item in Model.ShiftsList.OrderBy(x => x.Placement))
							{
								<div class="groupBox">
									<div class="row align-items-center justify-content-between">

										<div class="col-2 d-flex align-items-center">
											<input type="hidden" name="shiftViewModels[@i].Placement" value="@item.Placement"/>
											<div class="timeWorkTitle">
												@if (item.Placement == ShiftPlacement.First)
												{
													@("نوبت اول")
												}
												else if (item.Placement == ShiftPlacement.Second)
												{
													@("نوبت دوم")
												}
												else
												{
													@("نوبت سوم")
												}
											</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="shiftViewModels[@i].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="shiftViewModels[@i].EndTime" value="@item.EndTime" placeholder="00:00" style="direction: ltr;">
										</div>
										@if (i == 0)
										{
											<div class="col-2 d-flex align-items-center justify-content-end">
											</div>
										}
										else
										{
											<div class="col-2 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>
								</div>
								i++;
							}
						}
						else
						{
							<div class="groupBox">
								<div class="row align-items-center justify-content-between">

									<div class="col-2 d-flex align-items-center">
										<input type="hidden" name="shiftViewModels[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="shiftViewModels[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="shiftViewModels[0].EndTime" value="" placeholder="00:00" style="direction: ltr;">
									</div>
									<div class="col-2 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" style="visibility: hidden">
							<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>
							<div class="mx-1 btnAppendChildTimeWork">افزودن نوبت دوم</div>
						</button>
					</div>

					<div class="ShowMessage d-none">
						<p class="m-0" id="ShowSettingMessage"></p>
					</div>

				</div>
				
				<div id="step_workTimeOptionIrregular" style="display: none">
					<div class="show-disorganized mt-5">
						<p class="m-0">مجموعه بدون وقفه و بصورت مستمر فعال می‌باشد</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 justify-content-center w-100" data-bs-dismiss="modal" aria-label="Close">انصراف</button>
					</div>
					<div class="col-6 text-start">
						@* <button type="button" onclick="actionForShowModalReplaceChange()" class="btn-register w-100">ثبت</button> *@
						<button type="button" onclick="saveEditSettingWorkTime()" class="btn-register w-100">ثبت</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="_ModalWorkTimePartials/ConfirmReplaceGroupAndEmployee" />
			</div>
		</div>
	</div> *@
	<!-- مودال -->
</form>

<script src="~/assetsclient/libs/cleave/cleave.min.js"></script>
<script>
	var antiForgeryToken = $('@Html.AntiForgeryToken()').val();
	var saveEditSettingWorkTimeAjax = `@Url.Page("./Options", "EditSettingWorkTime")`;
	var getGroupListAndEmployeeListAjax = `@Url.Page("./Options", "GroupListAndEmployeeList")`;

	var IsRegularWorkshop = @(Model.WorkshopShiftStatus == WorkshopShiftStatus.Regular ? "true" : "false");

</script>
<script src="~/AssetsAdminNew/rollcall/js/EditSettingWorkTime.js?ver=adminVersion"></script>