Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Tolk 2629 heldagsfravær #2113

Merged
merged 14 commits into from
Oct 24, 2024
Merged

Tolk 2629 heldagsfravær #2113

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
14 commits
Select commit Hold shift + click to select a range
0da07bd
forenkle html for fraværsmodal
AndreMarthinsen Oct 22, 2024
992df4f
legge til mulighet for å sette manuelt klokkeslett i formatLocalDatetime
AndreMarthinsen Oct 22, 2024
609e383
legge til håndtering av heldagshendelser i back-end
AndreMarthinsen Oct 22, 2024
9636dba
legge til håndtering av heldagshendelser i front-end
AndreMarthinsen Oct 22, 2024
2a1f872
endre hendelsestype til norsk i bekreftelse
AndreMarthinsen Oct 22, 2024
3794d83
Merge branch 'master' into TOLK-2629-heldagsfravær
AndreMarthinsen Oct 22, 2024
b9a3b10
legge til overstyring av starttid for fravær ved dagsvisning
AndreMarthinsen Oct 24, 2024
ceeb691
endre tekst ved bekreftelse av fravær ved konflikt
AndreMarthinsen Oct 24, 2024
a1a67cf
legge til sjekk om slutt alt er ved midnatt
AndreMarthinsen Oct 24, 2024
4f1d90d
endre flytting av sluttdato
AndreMarthinsen Oct 24, 2024
e495ca4
fikse feil språk på fraværstype i bekreftelse
AndreMarthinsen Oct 24, 2024
e7673b4
sette sluttid == startid ulovlig i front og back end
AndreMarthinsen Oct 24, 2024
3dcf50c
fjerne debug meldinger
AndreMarthinsen Oct 24, 2024
6c509c5
Merge branch 'master' into TOLK-2629-heldagsfravær
AndreMarthinsen Oct 24, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 11 additions & 3 deletions force-app/main/freelanceCalendar/lwc/hot_calendar/hot_calendar.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -119,7 +119,15 @@ export default class LibsFullCalendar extends NavigationMixin(LightningElement)
absence: {
text: 'Nytt fravær',
click: () => {
this.openAbsenceModal();
if (this.calendar?.view.type == 'timeGridDay') {
const millisecondsPerHour = 60 * 60 * 1000;
const viewedDate = this.calendar.view.activeStart;
const suggestedStartTime = new Date(viewedDate.getTime() + 12 * millisecondsPerHour);
const suggestEndTime = new Date(suggestedStartTime.getTime() + millisecondsPerHour);
this.openAbsenceModal(null, suggestedStartTime, suggestEndTime);
} else {
this.openAbsenceModal();
}
}
}
},
Expand Down Expand Up @@ -280,8 +288,8 @@ export default class LibsFullCalendar extends NavigationMixin(LightningElement)
this.isLoading = false;
}

async openAbsenceModal(event) {
const result = await Hot_Calendar_Absence_Modal.open({ event: event });
async openAbsenceModal(event, initialAbsenceStart, initialAbsenceEnd) {
const result = await Hot_Calendar_Absence_Modal.open({ event, initialAbsenceEnd, initialAbsenceStart });
if (result) {
await this.refreshCalendar(false);
this.updatePseudoEventsDisplay(this.calendar.view);
Expand Down
93 changes: 37 additions & 56 deletions ...app/main/freelanceCalendar/lwc/hot_calendar_absence_modal/hot_calendar_absence_modal.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,75 +5,56 @@
<lightning-spinner alternative-text="Loading" size="large"></lightning-spinner>
</div>
</template>
<template lwc:if={isEdit}>
<lightning-modal-header label="Endre/Slett fravær"></lightning-modal-header>
<lightning-modal-body>
<lightning-radio-group
name="radioGroup"
lwc:ref="absenceTypeRadioGroup"
label="Type fravær"
options={options}
value={absenceType}
type="radio"
>
</lightning-radio-group>
<lightning-modal-header label={headerText}></lightning-modal-header>
<lightning-modal-body>
<lightning-radio-group
name="radioGroup"
lwc:ref="absenceTypeRadioGroup"
label="Type fravær"
options={options}
value={absenceType}
type="radio"
>
</lightning-radio-group>
<div class="slds-var-m-top_medium">
<lightning-input
type="datetime"
type="checkbox"
label="Heldags"
value={isAllDayAbsence}
onchange={handleAllDayEventSet}
></lightning-input>
<lightning-input
type={timeFormat}
name="input1"
lwc:ref="absenceStartDateTimeInput"
label="Legg inn ny start dato/tid"
value={absenceStart}
label={startTimeInputLabel}
value={initialAbsenceStart}
onchange={handleDateStartChange}
></lightning-input>
<lightning-input
type="datetime"
type={timeFormat}
name="input2"
lwc:ref="absenceEndDateTimeInput"
label="Legg inn ny slutt dato/tid"
value={absenceEnd}
label={endTimeInputLabel}
value={initialAbsenceEnd}
onchange={handleDateEndChange}
></lightning-input>
</lightning-modal-body>
<lightning-modal-footer>
<div class="button-container">
</div>
</lightning-modal-body>
<lightning-modal-footer>
<div class="button-container">
<template lwc:if={isEdit}>
<button
class="slds-button slds-button_destructive cancel-button custom-button"
onclick={handleDeleteAbsence}
>
Slett
</button>
<button class="slds-button slds-button_brand custom-button" onclick={handleOkay}>Endre</button>
</div>
</lightning-modal-footer>
</template>
<template lwc:else>
<lightning-modal-header label="Registrer nytt fravær"></lightning-modal-header>
<lightning-modal-body>
<lightning-radio-group
name="radioGroup"
lwc:ref="absenceTypeRadioGroup"
label="Type fravær"
options={options}
value={value}
type="radio"
>
</lightning-radio-group>
<lightning-input
type="datetime"
name="input1"
lwc:ref="absenceStartDateTimeInput"
label="Legg inn start dato/tid"
value={absenceStart}
></lightning-input>
<lightning-input
type="datetime"
name="input2"
lwc:ref="absenceEndDateTimeInput"
label="Legg inn slutt dato/tid"
value={absenceEnd}
></lightning-input>
</lightning-modal-body>
<lightning-modal-footer>
<lightning-button variant="brand" label="Registrer" onclick={handleOkay}></lightning-button>
</lightning-modal-footer>
</template>
</template>
<button class="slds-button slds-button_brand custom-button" onclick={handleOkay}>
{registerButtonText}
</button>
</div>
</lightning-modal-footer>
</div>
</template>
131 changes: 98 additions & 33 deletions ...e-app/main/freelanceCalendar/lwc/hot_calendar_absence_modal/hot_calendar_absence_modal.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,10 +11,16 @@ export default class Hot_Calendar_Absence_Modal extends LightningModal {
@api event;
isEdit;
absenceType;
absenceStart;
absenceEnd;
@api initialAbsenceStart;
@api initialAbsenceEnd;
value = '';
timeFormat = 'datetime';
isAllDayAbsence = false;
isLoading = false;
headerText;
startTimeInputLabel;
endTImeInputLabel;
registerButtonText;

get options() {
return [
Expand All @@ -24,37 +30,90 @@ export default class Hot_Calendar_Absence_Modal extends LightningModal {
];
}

getEnglishAbsenceType(absenceType) {
for (const pair of this.options) {
if (absenceType === pair.label) {
return pair.value;
}
}
return 'Other';
}

getNorwegianAbsenceType(absenceType) {
for (const pair of this.options) {
if (absenceType === pair.value) {
return pair.label;
}
}
return 'Annet';
}

connectedCallback() {
if (this.event && this.event.extendedProps.recordId) {
this.isEdit = true;
switch (this.event.extendedProps.description) {
case 'Ferie':
this.absenceType = 'Vacation';
break;
case 'Sykdom':
this.absenceType = 'Medical';
break;
case 'Annet':
this.absenceType = 'Other';
break;
default:
this.absenceType = 'Other';
break;
}
this.absenceStart = this.formatLocalDateTime(this.event.start);
this.absenceEnd = this.formatLocalDateTime(this.event.end);
this.absenceType = this.getEnglishAbsenceType(this.event.extendedProps.description);
this.initialAbsenceStart = this.formatLocalDateTime(this.event.start);
this.initialAbsenceEnd = this.formatLocalDateTime(this.event.end);
} else {
const now = new Date();
const startTime = new Date(Date.now() + (60 - now.getMinutes()) * 60000);
this.absenceStart = this.formatLocalDateTime(startTime);
this.absenceEnd = this.formatLocalDateTime(new Date(startTime.getTime() + 86400000));
const startTime = new Date(now.getTime() + (60 - now.getMinutes()) * 60000);
this.initialAbsenceStart = this.formatLocalDateTime(this.initialAbsenceStart ?? startTime);
this.initialAbsenceEnd = this.formatLocalDateTime(
this.initialAbsenceEnd ?? new Date(startTime.getTime() + 60 * 60000)
);
}

this.headerText = this.isEdit ? 'Endre/Slett fravær' : 'Registrer nytt fravær';
this.startTimeInputLabel = `Legg inn${this.isEdit ? ' ny' : ''} startdato/tid`;
this.endTimeInputLabel = `Legg inn${this.isEdit ? ' ny' : ''} sluttdato/tid`;
this.registerButtonText = this.isEdit ? 'Endre' : 'Registrer';
}

validateAbsenceType(absenceType) {
return ['Vacation', 'Other', 'Medical'].includes(absenceType);
}

handleAllDayEventSet(event) {
this.isAllDayAbsence = event.detail.checked;
this.timeFormat = this.isAllDayAbsence ? 'date' : 'datetime';
const startTime = this.refs.absenceStartDateTimeInput.value;
const endTime = this.refs.absenceEndDateTimeInput.value;
if (this.isAllDayAbsence) {
this.initialAbsenceStart = this.formatLocalDateTime(new Date(startTime), '00', '00');
this.initialAbsenceEnd = this.formatLocalDateTime(new Date(endTime), '23', '59');
} else {
const hours = new Date().getHours();
const hoursString = (hours < 10 ? '0' : '') + hours.toString();
this.initialAbsenceStart = this.formatLocalDateTime(new Date(startTime), hoursString, '00');
this.initialAbsenceEnd = this.formatLocalDateTime(new Date(endTime), hoursString, '00');
}
}

handleDateStartChange(event) {
const startTime = new Date(event.detail.value);
const endTime = new Date(this.refs.absenceEndDateTimeInput.value);
if (!this.endHasBeenSet) {
this.initialAbsenceEnd = this.formatLocalDateTime(new Date(startTime.getTime() + 60 * 60 * 1000 * 24));
}

const startInput = this.refs.absenceStartDateTimeInput;
startInput.setCustomValidity(
startTime >= endTime && this.endHasBeenSet ? 'Sluttid må komme etter starttid' : ''
);
startInput.reportValidity();
this.initialAbsenceStart = event.detail.value;
}

handleDateEndChange(event) {
const startInput = this.refs.absenceStartDateTimeInput;
const startTime = new Date(startInput.value);
const newEndDate = new Date(event.detail.value);
startInput.setCustomValidity(startTime >= newEndDate ? 'Sluttid må komme etter starttid' : '');
startInput.reportValidity();
this.endHasBeenSet = true;
this.initialAbsenceEnd = event.detail.value;
}

async handleOkay() {
// Fetch radio button value
let validInputs = true;
Expand All @@ -71,11 +130,16 @@ export default class Hot_Calendar_Absence_Modal extends LightningModal {
}

// Fetch input field values
const absenceStartDateTime = this.refs.absenceStartDateTimeInput.value;
const absenceEndDateTime = this.refs.absenceEndDateTimeInput.value;
let absenceStartDateTime = this.refs.absenceStartDateTimeInput.value;
let absenceEndDateTime = this.refs.absenceEndDateTimeInput.value;
if (this.isAllDayAbsence) {
absenceStartDateTime = this.formatLocalDateTime(new Date(absenceStartDateTime), '00', '00');
absenceEndDateTime = this.formatLocalDateTime(new Date(absenceEndDateTime), '23', '59');
}

const absenceStartElement = this.refs.absenceStartDateTimeInput;
if (absenceEndDateTime < absenceStartDateTime) {
absenceStartElement.setCustomValidity('Starttid kan ikke komme etter sluttid');
if (absenceEndDateTime <= absenceStartDateTime) {
absenceStartElement.setCustomValidity('Sluttid må komme etter starttid');
absenceStartElement.reportValidity();
validInputs = false;
} else {
Expand All @@ -86,11 +150,13 @@ export default class Hot_Calendar_Absence_Modal extends LightningModal {
if (!validInputs) {
return;
}

let result;
try {
result = await getConflictsForTimePeriod({
startTimeInMilliseconds: new Date(absenceStartDateTime).getTime(),
endTimeInMilliseconds: new Date(absenceEndDateTime).getTime()
endTimeInMilliseconds: new Date(absenceEndDateTime).getTime(),
checkWholeDayForConflicts: this.isAllDayAbsence
});
} catch {
const event = new ShowToastEvent({
Expand All @@ -104,7 +170,7 @@ export default class Hot_Calendar_Absence_Modal extends LightningModal {

const confirmation = await ConfimationModal.open({
content: result,
absenceType: absenceType,
absenceType: this.getNorwegianAbsenceType(absenceType),
absenceStartDateTime: absenceStartDateTime,
absenceEndDateTime: absenceEndDateTime
});
Expand All @@ -114,10 +180,10 @@ export default class Hot_Calendar_Absence_Modal extends LightningModal {
await createAbsenceAndResolveConflicts({
absenceType: absenceType,
startTimeInMilliseconds: new Date(absenceStartDateTime).getTime(),
endTimeInMilliseconds: new Date(absenceEndDateTime).getTime()
endTimeInMilliseconds: new Date(absenceEndDateTime).getTime(),
isAllDayAbsence: this.isAllDayAbsence
});
} catch (error) {
console.error(error);
const event = new ShowToastEvent({
title: 'Kunne ikke legge til fravær',
message: 'Det oppstod en feil, prøv igjen senere',
Expand All @@ -126,7 +192,6 @@ export default class Hot_Calendar_Absence_Modal extends LightningModal {
this.dispatchEvent(event);
}
if (this.isEdit) {
console.log('nå er vi edit');
try {
await deleteAbsence({ recordId: this.event.extendedProps.recordId });
const event = new ShowToastEvent({
Expand Down Expand Up @@ -183,12 +248,12 @@ export default class Hot_Calendar_Absence_Modal extends LightningModal {
}

// Hjelper metode for å få dato i riktig tidsone for dateTime input felt
formatLocalDateTime(date) {
formatLocalDateTime(date, hoursOverride, minutesOverride) {
const year = date.getFullYear();
const month = ('0' + (date.getMonth() + 1)).slice(-2); // Måneder er 0 indeksiert
const day = ('0' + date.getDate()).slice(-2);
const hours = ('0' + date.getHours()).slice(-2);
const minutes = ('0' + date.getMinutes()).slice(-2);
const hours = hoursOverride !== undefined ? hoursOverride : ('0' + date.getHours()).slice(-2);
const minutes = minutesOverride !== undefined ? minutesOverride : ('0' + date.getMinutes()).slice(-2);

return `${year}-${month}-${day}T${hours}:${minutes}`;
}
Expand Down
4 changes: 2 additions & 2 deletions .../lwc/hot_calendar_absence_modal_confirmation/hot_calendar_absence_modal_confirmation.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,9 +13,9 @@
<!-- Display Conflicts Message -->
<div class="slds-p-around_medium">
<p>
Dersom du legger til fravær vil følgende oppdrag avlyses. Ved ledig på lønn vil du bli satt
utilgjengelig.
Ved bekreftelse vil Oppdrag i listen under få status "Avlyst av tolk", og du blir tatt av oppdraget.
</p>
<p>Ved Ledig på lønn bekrefter du å tilbaketrekke tilgjengeligheten, og mister retten til lønn.</p>
</div>

<!-- Display Conflicts -->
Expand Down
Loading
Loading