282 lines
9.6 KiB
Plaintext
282 lines
9.6 KiB
Plaintext
@using BeWoPlanerMobil.Models;
|
|
@using BS.Shared.Extensions
|
|
|
|
@model IAbsenceTimeModel
|
|
|
|
@{
|
|
var controllerName = Model is EmployeeModel ? "Employee" : "Customer";
|
|
var prefix = Model.HtmlPrefix;
|
|
}
|
|
|
|
<script type="text/javascript">
|
|
var initialDatePrependWidth = 0;
|
|
function calcAbsenceTimePrependWidth() {
|
|
try {
|
|
setTimeout(function () {
|
|
if(initialDatePrependWidth <= 0 && $.isNumeric(getMaxWidth(`absence-time-prepend`))) {
|
|
initialDatePrependWidth = getMaxWidth(`absence-time-prepend`);
|
|
}
|
|
|
|
if(initialDatePrependWidth <= 0) {
|
|
return;
|
|
}
|
|
|
|
$(`.absence-time-prepend`).width(getMaxWidth(`absence-time-prepend`));
|
|
});
|
|
} catch(error) {
|
|
showErrorPopup(error);
|
|
}
|
|
}
|
|
|
|
function validateAbsenceTimeForm() {
|
|
try {
|
|
$("#form-validation-result-column").addClass("d-none");
|
|
$("#form-validation-result-container").html("");
|
|
|
|
let validationMessage = "";
|
|
|
|
const startAndEnd = getStartAndEndAndIfInfinite();
|
|
const [start, end, isInfinite] = startAndEnd;
|
|
|
|
const isStartValid = false === isNaN(start.getTime());
|
|
const isEndValid = false === isNaN(end.getTime()) || isInfinite;
|
|
|
|
if(!isStartValid || !isEndValid) {
|
|
return "Die Datumsangaben sind ungültig!";
|
|
}
|
|
|
|
const selectedOption = $("#absence-reason-select option:selected");
|
|
|
|
if(!isInfinite && end.getTime() < start.getTime()) {
|
|
validationMessage = "Das Startdatum muss vor dem Enddatum liegen.";
|
|
}
|
|
|
|
if(selectedOption.val() === "-1") {
|
|
if(validationMessage.length === 0) {
|
|
validationMessage = "Die Kategorie darf nicht leer sein.";
|
|
} else {
|
|
validationMessage += "<br />Die Kategorie darf nicht leer sein.";
|
|
}
|
|
}
|
|
|
|
return validationMessage;
|
|
} catch(error) {
|
|
showErrorPopup(error);
|
|
}
|
|
}
|
|
|
|
function getStartAndEndAndIfInfinite() {
|
|
const allDay = $(`#@Model.HtmlPrefix-absence-time-allday-cb`).is(":checked");
|
|
|
|
const startDateString = $(`#@Model.HtmlPrefix-absence-time-start-date-input`).val();
|
|
const endDateString = $(`#@Model.HtmlPrefix-absence-time-end-date-input`).val(); // z.B. 2025-05-20
|
|
const startTimeString = $(`#@Model.HtmlPrefix-absence-time-start-time-input`).val(); // z.B. 09:17
|
|
const endTimeString = $(`#@Model.HtmlPrefix-absence-time-end-time-input`).val();
|
|
|
|
const isInfinite = endDateString.length === 0 && endTimeString.length === 0;
|
|
|
|
const start = allDay ? new Date(`${startDateString}T00:00`) : combineDateAndTime(new Date(startDateString), startTimeString);
|
|
const end = allDay ? new Date(`${endDateString}T00:00`) : combineDateAndTime(new Date(endDateString), endTimeString);
|
|
|
|
return [start, end, isInfinite];
|
|
}
|
|
|
|
function toggleAllDay() {
|
|
try {
|
|
const checkbox = $(`#@Model.HtmlPrefix-absence-time-allday-cb`);
|
|
const isChecked = checkbox.is(":checked");
|
|
|
|
if(isChecked === true) {
|
|
$(`#@Model.HtmlPrefix-absence-time-start-time-input, #@Model.HtmlPrefix-absence-time-end-time-input`).val(null);
|
|
}
|
|
|
|
$(`#@Model.HtmlPrefix-absence-time-start-time-input, #@Model.HtmlPrefix-absence-time-end-time-input`).prop("disabled", isChecked);
|
|
} catch(error) {
|
|
showErrorPopup(error);
|
|
}
|
|
}
|
|
|
|
function submitAbsenceTimesForm() {
|
|
try {
|
|
const validationMessage = validateAbsenceTimeForm();
|
|
|
|
if(validationMessage !== undefined && validationMessage !== null && validationMessage.length > 0) {
|
|
$("#form-validation-result-row").removeClass("d-none");
|
|
$("#form-validation-result-container").html(validationMessage);
|
|
|
|
return;
|
|
}
|
|
|
|
const [start, end] = getStartAndEndAndIfInfinite();
|
|
|
|
$.get("@Url.Action("CheckForOverlappingAbsenceTimes", controllerName)",
|
|
{
|
|
startStr: getUnixTimeStamp(start, true, false),
|
|
endStr: getUnixTimeStamp(end, true, false),
|
|
oid: @Model.AbsenteeOid
|
|
}
|
|
).done(
|
|
function(messagesJson) {
|
|
const messages = JSON.parse(messagesJson);
|
|
|
|
if(messages.length === 0) {
|
|
showSpinner();
|
|
$("#create-absence-time-form").submit();
|
|
$(`#@Model.HtmlPrefix-absence-times-form-popup`).modal("hide");
|
|
} else {
|
|
$(`#@Model.HtmlPrefix-absence-times-form-popup`).modal("hide");
|
|
|
|
let messagesStr = "";
|
|
|
|
for(let i = 0; i < messages.length; i++) {
|
|
messagesStr += messages[i];
|
|
}
|
|
|
|
showMessagePopupWithHtmlAndCallbacks(
|
|
"BeWoPlaner",
|
|
messagesStr,
|
|
() => {
|
|
showSpinner();
|
|
$("#create-absence-time-form").submit();
|
|
$(`#@Model.HtmlPrefix-absence-times-form-popup`).modal("hide");
|
|
},
|
|
() => {
|
|
$("#messagePopup").modal("hide");
|
|
$(`#@Model.HtmlPrefix-absence-times-form-popup`).modal("show");
|
|
}
|
|
);
|
|
}
|
|
}
|
|
);
|
|
} catch(error) {
|
|
showErrorPopup(error);
|
|
}
|
|
}
|
|
|
|
function clearAbsenceTimesForm() {
|
|
try {
|
|
$(`#@Model.HtmlPrefix-absence-time-notice, #@Model.HtmlPrefix-absence-time-start-date, #@Model.HtmlPrefix-absence-time-end-date, #@Model.HtmlPrefix-absence-time-start-time, #@Model.HtmlPrefix-absence-time-end-time`).val("");
|
|
$.get("@Url.Action("DeselectAbsenceTime", controllerName)");
|
|
} catch(error) {
|
|
showErrorPopup(error);
|
|
}
|
|
}
|
|
</script>
|
|
|
|
@using(Html.BeginForm("CreateOrUpdateAbsenceTime", controllerName, FormMethod.Post, new { id = "create-absence-time-form" }))
|
|
{
|
|
var isAllDay = Model.SelectedAbsenceTime?.Start?.IsTimeZero() ?? false;
|
|
var allDay = Model.SelectedAbsenceTimeOid is null || isAllDay ? "checked" : "";
|
|
var isDisabled = Model.SelectedAbsenceTimeOid is null || isAllDay ? "disabled" : "";
|
|
var startDate = Model.SelectedAbsenceTime?.Start?.ToString("yyyy-MM-dd");
|
|
var endDate = Model.SelectedAbsenceTime?.End?.ToString("yyyy-MM-dd");
|
|
var startTime = Model.SelectedAbsenceTime?.Start?.ToString("HH:mm");
|
|
var endTime = Model.SelectedAbsenceTime?.End?.ToString("HH:mm");
|
|
|
|
if(startTime?.Equals("00:00") ?? false)
|
|
{
|
|
startTime = string.Empty;
|
|
}
|
|
|
|
if(endTime?.Equals("00:00") ?? false)
|
|
{
|
|
endTime = string.Empty;
|
|
}
|
|
|
|
var absenceTimeOid = Model.SelectedAbsenceTime?.AbsenceTimeOid;
|
|
|
|
<input type="hidden" name="@prefix-absence-time-oid" value="@absenceTimeOid" />
|
|
|
|
<div class="form-row d-none" id="form-validation-result-row">
|
|
<div class="col-12">
|
|
<div class="alert alert-danger mb-0" role="alert" id="form-validation-result-container"></div>
|
|
</div>
|
|
</div>
|
|
|
|
#region Datumsangaben
|
|
<div class="form-row">
|
|
<div class="col-md-6 mt-2">
|
|
<div class="input-group">
|
|
<div class="input-group-prepend">
|
|
<span class="input-group-text absence-time-prepend">
|
|
Startdatum
|
|
</span>
|
|
</div>
|
|
<input type="date" value="@startDate" class="form-control" id="@prefix-absence-time-start-date-input" name="@prefix-absence-time-start-date" />
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mt-2">
|
|
<div class="input-group">
|
|
<div class="input-group-prepend">
|
|
<span class="input-group-text absence-time-prepend">
|
|
Enddatum
|
|
</span>
|
|
</div>
|
|
<input type="date" value="@endDate" class="form-control" id="@prefix-absence-time-end-date-input" name="@prefix-absence-time-end-date" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-row">
|
|
<div class="col-md-6 mt-2">
|
|
<div class="input-group">
|
|
<div class="input-group-prepend">
|
|
<span class="input-group-text absence-time-prepend">
|
|
Von
|
|
</span>
|
|
</div>
|
|
<input type="time" class="form-control" id="@prefix-absence-time-start-time-input" name="@prefix-absence-time-start-time" @isDisabled value="@startTime" />
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mt-2">
|
|
<div class="input-group">
|
|
<div class="input-group-prepend">
|
|
<span class="input-group-text absence-time-prepend">
|
|
Bis
|
|
</span>
|
|
</div>
|
|
<input type="time" class="form-control" id="@prefix-absence-time-end-time-input" name="@prefix-absence-time-end-time" @isDisabled value="@endTime" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-row">
|
|
<div class="col-md py-1">
|
|
<div class="custom-control custom-checkbox custom-control-inline">
|
|
<input type="checkbox" class="custom-control-input" name="@prefix-absence-time-allday-cb" id="@prefix-absence-time-allday-cb" onclick="toggleAllDay()" @allDay />
|
|
<label class="custom-control-label" for="@prefix-absence-time-allday-cb">Ganztägig</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
#endregion
|
|
|
|
<div class="form-row">
|
|
<div class="col-md">
|
|
<div class="form-group mb-2 mt-0">
|
|
<div class="input-group">
|
|
<div class="input-group-prepend">
|
|
<div class="input-group-text absence-time-prepend">
|
|
Kategorie
|
|
</div>
|
|
</div>
|
|
@Html.DropDownListFor(m => m.SelectedAbsenceReasonOid, Model.AbsenceReasonItems, new { @class = "custom-select", Id = "absence-reason-select", Name = Model.HtmlPrefix + "-absence-time-category" })
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-row">
|
|
<div class="col-md">
|
|
<div class="form-group mb-1">
|
|
<div class="input-group">
|
|
<div class="input-group-prepend">
|
|
<div class="input-group-text absence-time-prepend">
|
|
Erläuterung
|
|
</div>
|
|
</div>
|
|
<textarea class="form-control" autocomplete="on" id="@prefix-absence-time-notice" name="@prefix-absence-time-notice" maxlength="1024">@(Model.SelectedAbsenceTime?.Notice ?? string.Empty)</textarea>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
} |