@skysoftware-co/bayan-hr-widgets-ui 1.0.3 → 1.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +95 -0
- package/fesm2022/skysoftware-co-bayan-hr-widgets-ui.mjs +451 -72
- package/fesm2022/skysoftware-co-bayan-hr-widgets-ui.mjs.map +1 -1
- package/lib/my-calendar-widget/my-calendar-widget.component.d.ts +41 -0
- package/lib/my-main-details-widget/my-main-details-widget.component.d.ts +7 -7
- package/lib/my-upcoming-events-widget/event-item/event-item.component.d.ts +6 -6
- package/lib/my-upcoming-events-widget/event-tab-bar/event-tab-bar.component.d.ts +8 -6
- package/lib/my-upcoming-events-widget/events-popup/events-popup.component.d.ts +4 -4
- package/lib/my-upcoming-events-widget/my-upcoming-events-widget.component.d.ts +3 -5
- package/lib/{my-upcoming-events-widget → shared/components}/card-header/card-header.component.d.ts +3 -3
- package/lib/shared/components/hr-employee-calendar/hr-employee-calendar.component.d.ts +35 -0
- package/lib/shared/pipes/translate.pipe.d.ts +10 -0
- package/lib/shared/services/common-methods.service.d.ts +6 -0
- package/lib/shared/services/constants.service.d.ts +10 -0
- package/lib/{types → shared/types}/common.d.ts +36 -0
- package/package.json +1 -1
- package/public-api.d.ts +7 -4
- package/lib/common/constants.service.d.ts +0 -7
- package/lib/common/lexicon.service.d.ts +0 -12
- package/lib/pipes/translate.pipe.d.ts +0 -10
- /package/lib/{common → shared/services}/translate.service.d.ts +0 -0
|
@@ -1,17 +1,18 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable, Pipe, EventEmitter, Input, Output, Component, inject } from '@angular/core';
|
|
2
|
+
import { Injectable, Pipe, EventEmitter, Input, Output, Component, inject, ViewChild } from '@angular/core';
|
|
3
3
|
import * as i1$1 from 'devextreme-angular';
|
|
4
|
-
import { DxTooltipModule, DxPopupModule, DxScrollViewModule, DxLoadPanelModule } from 'devextreme-angular';
|
|
4
|
+
import { DxTooltipModule, DxPopupModule, DxScrollViewModule, DxLoadPanelModule, DxCalendarModule } from 'devextreme-angular';
|
|
5
5
|
import { NgClass, DecimalPipe, DatePipe, LowerCasePipe, CommonModule } from '@angular/common';
|
|
6
6
|
import * as i1$2 from '@fortawesome/angular-fontawesome';
|
|
7
7
|
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
|
|
8
8
|
import { BayanEmployeeBadgeComponent } from '@skysoftware-co/bayan-components-ui';
|
|
9
|
-
import
|
|
10
|
-
import { SkyShortcutIconComponent, SkyAlertType } from '@skysoftware-co/sky-components-ui';
|
|
9
|
+
import { SkyShortcutIconComponent } from '@skysoftware-co/sky-components-ui';
|
|
11
10
|
import * as i1 from '@angular/common/http';
|
|
12
11
|
import { HttpParams } from '@angular/common/http';
|
|
13
12
|
import { faCakeCandles, faTreePalm, faCalendarStar } from '@fortawesome/pro-light-svg-icons';
|
|
14
13
|
import * as i2 from 'devextreme-angular/core';
|
|
14
|
+
import { faCircle, faCalendarDays } from '@fortawesome/pro-regular-svg-icons';
|
|
15
|
+
import moment from 'moment';
|
|
15
16
|
|
|
16
17
|
var MainWidgetShortcut;
|
|
17
18
|
(function (MainWidgetShortcut) {
|
|
@@ -43,6 +44,14 @@ var EventTypeEnum;
|
|
|
43
44
|
EventTypeEnum[EventTypeEnum["Birthdays"] = 1] = "Birthdays";
|
|
44
45
|
EventTypeEnum[EventTypeEnum["PublicHolidays"] = 2] = "PublicHolidays";
|
|
45
46
|
})(EventTypeEnum || (EventTypeEnum = {}));
|
|
47
|
+
var ScheduleVacationTypes;
|
|
48
|
+
(function (ScheduleVacationTypes) {
|
|
49
|
+
ScheduleVacationTypes[ScheduleVacationTypes["DaysOff"] = 1] = "DaysOff";
|
|
50
|
+
ScheduleVacationTypes[ScheduleVacationTypes["PublicHoliday"] = 2] = "PublicHoliday";
|
|
51
|
+
ScheduleVacationTypes[ScheduleVacationTypes["Vacations"] = 3] = "Vacations";
|
|
52
|
+
ScheduleVacationTypes[ScheduleVacationTypes["AddedVacations"] = 4] = "AddedVacations";
|
|
53
|
+
ScheduleVacationTypes[ScheduleVacationTypes["Events"] = 5] = "Events";
|
|
54
|
+
})(ScheduleVacationTypes || (ScheduleVacationTypes = {}));
|
|
46
55
|
|
|
47
56
|
var ReportingTo$2 = "Reporting to";
|
|
48
57
|
var NotAnknown$2 = "N\\A";
|
|
@@ -65,9 +74,17 @@ var ViewAll$2 = "View all";
|
|
|
65
74
|
var WeekendDayNotDefined$2 = "Weekend day is not defined.";
|
|
66
75
|
var Today$2 = "Today";
|
|
67
76
|
var Tomorrow$2 = "Tomorrow";
|
|
68
|
-
var
|
|
77
|
+
var TwoDays$2 = "2 days";
|
|
69
78
|
var ThisWeek$2 = "This week";
|
|
70
79
|
var NextWeek$2 = "Next week";
|
|
80
|
+
var Profile$2 = "Profile";
|
|
81
|
+
var PaySlip$2 = "Payslip";
|
|
82
|
+
var Attendance$2 = "Attendance";
|
|
83
|
+
var VacationStatement$2 = "Vacation statement";
|
|
84
|
+
var Calendar$2 = "Calendar";
|
|
85
|
+
var DayOff$2 = "Day off";
|
|
86
|
+
var Events$2 = "Events";
|
|
87
|
+
var ScheduledVacations$2 = "Scheduled vacations";
|
|
71
88
|
var en = {
|
|
72
89
|
ReportingTo: ReportingTo$2,
|
|
73
90
|
NotAnknown: NotAnknown$2,
|
|
@@ -90,9 +107,17 @@ var en = {
|
|
|
90
107
|
WeekendDayNotDefined: WeekendDayNotDefined$2,
|
|
91
108
|
Today: Today$2,
|
|
92
109
|
Tomorrow: Tomorrow$2,
|
|
93
|
-
|
|
110
|
+
TwoDays: TwoDays$2,
|
|
94
111
|
ThisWeek: ThisWeek$2,
|
|
95
|
-
NextWeek: NextWeek$2
|
|
112
|
+
NextWeek: NextWeek$2,
|
|
113
|
+
Profile: Profile$2,
|
|
114
|
+
PaySlip: PaySlip$2,
|
|
115
|
+
Attendance: Attendance$2,
|
|
116
|
+
VacationStatement: VacationStatement$2,
|
|
117
|
+
Calendar: Calendar$2,
|
|
118
|
+
DayOff: DayOff$2,
|
|
119
|
+
Events: Events$2,
|
|
120
|
+
ScheduledVacations: ScheduledVacations$2
|
|
96
121
|
};
|
|
97
122
|
|
|
98
123
|
var ReportingTo$1 = "مفوض الى";
|
|
@@ -116,13 +141,17 @@ var ViewAll$1 = "عرض الكل";
|
|
|
116
141
|
var WeekendDayNotDefined$1 = "يوم عطلة نهاية الأسبوع غير محدد";
|
|
117
142
|
var Today$1 = "اليوم";
|
|
118
143
|
var Tomorrow$1 = "غداً";
|
|
119
|
-
var
|
|
144
|
+
var TwoDays$1 = "يومين";
|
|
120
145
|
var ThisWeek$1 = "هذا الأسبوع";
|
|
121
146
|
var NextWeek$1 = "الأسبوع القادم";
|
|
122
147
|
var Profile$1 = "الملف الشخصي";
|
|
123
148
|
var PaySlip$1 = "كشف الراتب";
|
|
124
149
|
var Attendance$1 = "الحضور";
|
|
125
150
|
var VacationStatement$1 = "كشف الإجازة";
|
|
151
|
+
var Calendar$1 = "التقويم";
|
|
152
|
+
var DayOff$1 = "يوم اجازة";
|
|
153
|
+
var Events$1 = "حدث";
|
|
154
|
+
var ScheduledVacations$1 = "الإجازات المجدولة";
|
|
126
155
|
var ar = {
|
|
127
156
|
ReportingTo: ReportingTo$1,
|
|
128
157
|
NotAnknown: NotAnknown$1,
|
|
@@ -145,13 +174,17 @@ var ar = {
|
|
|
145
174
|
WeekendDayNotDefined: WeekendDayNotDefined$1,
|
|
146
175
|
Today: Today$1,
|
|
147
176
|
Tomorrow: Tomorrow$1,
|
|
148
|
-
|
|
177
|
+
TwoDays: TwoDays$1,
|
|
149
178
|
ThisWeek: ThisWeek$1,
|
|
150
179
|
NextWeek: NextWeek$1,
|
|
151
180
|
Profile: Profile$1,
|
|
152
181
|
PaySlip: PaySlip$1,
|
|
153
182
|
Attendance: Attendance$1,
|
|
154
|
-
VacationStatement: VacationStatement$1
|
|
183
|
+
VacationStatement: VacationStatement$1,
|
|
184
|
+
Calendar: Calendar$1,
|
|
185
|
+
DayOff: DayOff$1,
|
|
186
|
+
Events: Events$1,
|
|
187
|
+
ScheduledVacations: ScheduledVacations$1
|
|
155
188
|
};
|
|
156
189
|
|
|
157
190
|
var ReportingTo = "Rapport à";
|
|
@@ -175,13 +208,17 @@ var ViewAll = "Tout voir";
|
|
|
175
208
|
var WeekendDayNotDefined = "Le jour de week-end n'est pas défini.";
|
|
176
209
|
var Today = "Aujourd'hui";
|
|
177
210
|
var Tomorrow = "Demain";
|
|
178
|
-
var
|
|
211
|
+
var TwoDays = "Dans 2 jours";
|
|
179
212
|
var ThisWeek = "Cette semaine";
|
|
180
213
|
var NextWeek = "La semaine prochaine";
|
|
181
214
|
var Profile = "Profil";
|
|
182
215
|
var PaySlip = "Fiche de paie";
|
|
183
216
|
var Attendance = "Présence";
|
|
184
217
|
var VacationStatement = "Déclaration de vacances";
|
|
218
|
+
var Calendar = "Calendrier";
|
|
219
|
+
var DayOff = "Jour de congé";
|
|
220
|
+
var Events = "Événements";
|
|
221
|
+
var ScheduledVacations = "Vacances programmées";
|
|
185
222
|
var fr = {
|
|
186
223
|
ReportingTo: ReportingTo,
|
|
187
224
|
NotAnknown: NotAnknown,
|
|
@@ -204,13 +241,17 @@ var fr = {
|
|
|
204
241
|
WeekendDayNotDefined: WeekendDayNotDefined,
|
|
205
242
|
Today: Today,
|
|
206
243
|
Tomorrow: Tomorrow,
|
|
207
|
-
|
|
244
|
+
TwoDays: TwoDays,
|
|
208
245
|
ThisWeek: ThisWeek,
|
|
209
246
|
NextWeek: NextWeek,
|
|
210
247
|
Profile: Profile,
|
|
211
248
|
PaySlip: PaySlip,
|
|
212
249
|
Attendance: Attendance,
|
|
213
|
-
VacationStatement: VacationStatement
|
|
250
|
+
VacationStatement: VacationStatement,
|
|
251
|
+
Calendar: Calendar,
|
|
252
|
+
DayOff: DayOff,
|
|
253
|
+
Events: Events,
|
|
254
|
+
ScheduledVacations: ScheduledVacations
|
|
214
255
|
};
|
|
215
256
|
|
|
216
257
|
const BUILT_IN_LEXICONS = { en, ar, fr };
|
|
@@ -236,17 +277,17 @@ class HRTranslateService {
|
|
|
236
277
|
const foundKey = Object.keys(builtIn).find(k => k.toLowerCase() === key.toLowerCase());
|
|
237
278
|
return foundKey ? builtIn[foundKey] : key;
|
|
238
279
|
}
|
|
239
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
240
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.
|
|
280
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HRTranslateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
281
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HRTranslateService, providedIn: 'root' });
|
|
241
282
|
}
|
|
242
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
283
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HRTranslateService, decorators: [{
|
|
243
284
|
type: Injectable,
|
|
244
285
|
args: [{
|
|
245
286
|
providedIn: 'root'
|
|
246
287
|
}]
|
|
247
288
|
}] });
|
|
248
289
|
|
|
249
|
-
class
|
|
290
|
+
class HRTranslatePipe {
|
|
250
291
|
translateService;
|
|
251
292
|
constructor(translateService) {
|
|
252
293
|
this.translateService = translateService;
|
|
@@ -254,14 +295,11 @@ class HrTranslatePipe {
|
|
|
254
295
|
transform(key) {
|
|
255
296
|
if (!key)
|
|
256
297
|
return '';
|
|
257
|
-
// 1. Built-in translation
|
|
258
298
|
key = this.translateService.translateBuiltIn(key);
|
|
259
|
-
// 2. Lexicon lookup (full key)
|
|
260
299
|
const lexicon = this.translateService.getLexicon();
|
|
261
300
|
let foundKey = Object.keys(lexicon).find(k => k.toLowerCase() === key.toLowerCase());
|
|
262
301
|
if (foundKey)
|
|
263
302
|
return lexicon[foundKey];
|
|
264
|
-
// 3. Lexicon lookup (word by word)
|
|
265
303
|
const arrKey = key.split(' ');
|
|
266
304
|
let keyValue = '';
|
|
267
305
|
for (let i = 0; i < arrKey.length; i++) {
|
|
@@ -277,31 +315,34 @@ class HrTranslatePipe {
|
|
|
277
315
|
}
|
|
278
316
|
return keyValue;
|
|
279
317
|
}
|
|
280
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
281
|
-
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.
|
|
318
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HRTranslatePipe, deps: [{ token: HRTranslateService }], target: i0.ɵɵFactoryTarget.Pipe });
|
|
319
|
+
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.21", ngImport: i0, type: HRTranslatePipe, isStandalone: true, name: "HRTranslate" });
|
|
282
320
|
}
|
|
283
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
321
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HRTranslatePipe, decorators: [{
|
|
284
322
|
type: Pipe,
|
|
285
323
|
args: [{
|
|
286
324
|
standalone: true,
|
|
287
|
-
name: '
|
|
325
|
+
name: 'HRTranslate'
|
|
288
326
|
}]
|
|
289
327
|
}], ctorParameters: () => [{ type: HRTranslateService }] });
|
|
290
328
|
|
|
291
|
-
class
|
|
329
|
+
class HRConstantsService {
|
|
292
330
|
defaultVacationBalanceColor = '#727070';
|
|
293
331
|
defaultVacationColor = '#DCDCDC';
|
|
294
|
-
|
|
295
|
-
|
|
332
|
+
defaultPublicHolidayColor = '#249EA0';
|
|
333
|
+
defaultDayOffColor = '#FCCF5A';
|
|
334
|
+
defaultEventsColor = '#e67e0f';
|
|
335
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HRConstantsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
336
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HRConstantsService, providedIn: 'root' });
|
|
296
337
|
}
|
|
297
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
338
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HRConstantsService, decorators: [{
|
|
298
339
|
type: Injectable,
|
|
299
340
|
args: [{
|
|
300
341
|
providedIn: 'root',
|
|
301
342
|
}]
|
|
302
343
|
}] });
|
|
303
344
|
|
|
304
|
-
class
|
|
345
|
+
class HRMyMainDetailsWidgetComponent {
|
|
305
346
|
http;
|
|
306
347
|
constants;
|
|
307
348
|
translatePipe;
|
|
@@ -422,13 +463,13 @@ class HrMyMainDetailsWidgetComponent {
|
|
|
422
463
|
headers: { 'api-version': '2' }
|
|
423
464
|
});
|
|
424
465
|
}
|
|
425
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
426
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: HrMyMainDetailsWidgetComponent, isStandalone: true, selector: "hr-my-main-details-widget", inputs: { badgeClass: "badgeClass", badgeImageClass: "badgeImageClass", badgeWidth: "badgeWidth", badgeHeight: "badgeHeight", employeeInfoContainerClass: "employeeInfoContainerClass", employeeDetailsClass: "employeeDetailsClass", employeeNameContainerClass: "employeeNameContainerClass", employeeNameClass: "employeeNameClass", employeePositionClass: "employeePositionClass", employeeGradeClass: "employeeGradeClass", containerClass: "containerClass", cardBodyClass: "cardBodyClass", headerRowClass: "headerRowClass", shortcutsContainerClass: "shortcutsContainerClass", shortcutItemClass: "shortcutItemClass", shortcutIconContainerClass: "shortcutIconContainerClass", shortcutIconClass: "shortcutIconClass", shortcutTextClass: "shortcutTextClass", detailsRowClass: "detailsRowClass", reportingBlockClass: "reportingBlockClass", captionLabelClasses: "captionLabelClasses", captionLabelValueClass: "captionLabelValueClass", vacationBalancesContainerClass: "vacationBalancesContainerClass", vacationBalanceItemClass: "vacationBalanceItemClass", vacationBalanceHeaderClass: "vacationBalanceHeaderClass", vacationColorDotClass: "vacationColorDotClass", vacationTypeNameClass: "vacationTypeNameClass", vacationBalanceValueRowClass: "vacationBalanceValueRowClass", vacationBalanceValueClass: "vacationBalanceValueClass", tooltipTriggerLinkClass: "tooltipTriggerLinkClass", tooltipTriggerTextClass: "tooltipTriggerTextClass", tooltipVacationRowClass: "tooltipVacationRowClass", tooltipVacationNameContainerClass: "tooltipVacationNameContainerClass", tooltipVacationNameClass: "tooltipVacationNameClass", defaultVacationBalanceColor: "defaultVacationBalanceColor", defaultVacationColor: "defaultVacationColor", baseUrl: "baseUrl", isMobile: "isMobile", isTablet: "isTablet", shortcuts: "shortcuts" }, outputs: { onShortcutClicked: "onShortcutClicked", isLoadingChanged: "isLoadingChanged" }, usesOnChanges: true, ngImport: i0, template: "<div [class]=\"containerClass\">\r\n <div [class]=\"cardBodyClass\">\r\n <div [class]=\"headerRowClass\">\r\n <div>\r\n @if(employeeMainInfo!=null){\r\n <div [class]=\"employeeInfoContainerClass\">\r\n <bayan-employee-badge [badge]=\"employeeBadge\"\r\n [badgeClass]=\"badgeClass\"\r\n [imageClass]=\"badgeImageClass\"\r\n [width]=\"badgeWidth\"\r\n [height]=\"badgeHeight\"\r\n (employeePhotoError)=\"handleEmployeePhotoError()\"></bayan-employee-badge>\r\n\r\n <div [class]=\"employeeDetailsClass\">\r\n <div [class]=\"employeeNameContainerClass\">\r\n <div [class]=\"employeeNameClass\"\r\n data-bs-toggle=\"tooltip\" [title]=\"employeeMainInfo.EmployeeNumber+' | '+ employeeMainInfo.EmployeeName\">\r\n {{employeeMainInfo.EmployeeNumber + ' | ' + employeeMainInfo.EmployeeName}}\r\n </div>\r\n </div>\r\n @if(employeeMainInfo.PositionName != null && employeeMainInfo.PositionName != ''){\r\n <div [class]=\"employeePositionClass\"\r\n data-bs-toggle=\"tooltip\"\r\n [title]=\"employeeMainInfo.PositionName\">\r\n {{employeeMainInfo.PositionName}}\r\n </div>\r\n }\r\n @if(employeeMainInfo.GradeName !=null){\r\n <div [class]=\"employeeGradeClass\" [title]=\"employeeMainInfo.GradeName\">\r\n {{employeeMainInfo.GradeName}}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <div [class]=\"shortcutsContainerClass\">\r\n @for(Icon of shortcuts ; track Icon ; let i = $index;){\r\n <sky-shortcut-icon [shortcut]=\"Icon\"\r\n [itemClass]=\"shortcutItemClass\"\r\n [iconContainerClass]=\"shortcutIconContainerClass\"\r\n [iconClass]=\"shortcutIconClass\"\r\n [textClass]=\"shortcutTextClass\"\r\n (onClicked)=\"shortcutClicked($event)\"></sky-shortcut-icon>\r\n }\r\n </div>\r\n </div>\r\n <div [class]=\"detailsRowClass\" [ngClass]=\"{'flex-wrap': isMobile || isTablet}\">\r\n <div [class]=\"reportingBlockClass\" [ngClass]=\"{'mb-3': isMobile}\">\r\n <div [class]=\"captionLabelClasses + ' me-5'\">\r\n <div>\r\n {{'ReportingTo' | hrTranslate}}\r\n </div>\r\n <div [class]=\"captionLabelValueClass\">\r\n @if(employeeMainInfo?.ReportingTo){\r\n {{employeeMainInfo?.ReportingTo}}\r\n }@else{\r\n {{'NotAnknown' | hrTranslate}}\r\n }\r\n </div>\r\n </div>\r\n <div [class]=\"captionLabelClasses\" [ngClass]=\"{'border-end border-1 pe-4': !isMobile}\">\r\n <div>\r\n {{'ServiceYears' | hrTranslate}}\r\n </div>\r\n <div [class]=\"captionLabelValueClass\">\r\n {{employeeMainInfo?.ServiceYears}}\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"flex-grow-1\" [ngClass]=\"{' ms-4': !isMobile && !isTablet, 'w-100': isTablet}\">\r\n <div [class]=\"vacationBalancesContainerClass\" [ngClass]=\"{'flex-wrap': isMobile,'w-100': isTablet}\">\r\n @for(vacationBalance of employeeMainInfo?.VacationBalances ; track vacationBalance ; let i = $index;){\r\n @if(i <= 2 || employeeMainInfo?.VacationBalances?.length == 4) {\r\n <div [class]=\"vacationBalanceItemClass\" [ngClass]=\"{'mb-2 w-40': isMobile}\">\r\n <div [class]=\"vacationBalanceHeaderClass\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"vacationBalance.VacationTypeColor\"></div>\r\n </div>\r\n <div [class]=\"vacationTypeNameClass\">\r\n {{vacationBalance.VacationTypeName}}\r\n </div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueRowClass\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle invisible\" style=\"height: 11px; width: 11px;\"></div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueClass\">{{vacationBalance.CurrentBalance | number:'1.2-2'}} {{(vacationBalance.CurrentBalance! == 1 ? 'day' : 'days') | hrTranslate}}</div>\r\n </div>\r\n </div>\r\n }\r\n }\r\n\r\n @if(employeeMainInfo?.VacationBalances && employeeMainInfo!.VacationBalances!.length > 4){\r\n <div [class]=\"vacationBalanceItemClass\">\r\n <div [class]=\"tooltipTriggerLinkClass\" id=\"otherVacationBalances\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"defaultVacationBalanceColor\"></div>\r\n </div>\r\n <div [class]=\"tooltipTriggerTextClass\">\r\n +{{(employeeMainInfo!.VacationBalances!.length - 3)}} {{'More' | hrTranslate}}\r\n </div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueRowClass\" style=\"visibility: hidden\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\"></div>\r\n </div>\r\n <div class=\"mx-1 fw-medium fs-14 text-dark-gray\">{{'More' | hrTranslate}}</div>\r\n </div>\r\n <dx-tooltip [target]=\"'#otherVacationBalances'\"\r\n [showEvent]=\"'mouseenter'\"\r\n [hideEvent]=\"'mouseleave'\">\r\n @for (vacationBalance of employeeMainInfo!.VacationBalances! ; track vacationBalance; let i = $index;){\r\n @if(i > 2){\r\n <div [class]=\"tooltipVacationRowClass\">\r\n <div [class]=\"tooltipVacationNameContainerClass\">\r\n\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"vacationBalance.VacationTypeColor\"></div>\r\n </div>\r\n <div [class]=\"tooltipVacationNameClass\">\r\n {{vacationBalance.VacationTypeName}}\r\n </div>\r\n </div>\r\n <div>{{vacationBalance.CurrentBalance | number:'1.2-2'}} {{(vacationBalance.CurrentBalance! == 1 ? 'day' : 'days') | hrTranslate}}</div>\r\n </div>\r\n }\r\n }\r\n </dx-tooltip>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: DxTooltipModule }, { kind: "component", type: i1$1.DxTooltipComponent, selector: "dx-tooltip", inputs: ["animation", "closeOnOutsideClick", "container", "contentTemplate", "deferRendering", "disabled", "height", "hideEvent", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showEvent", "target", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "animationChange", "closeOnOutsideClickChange", "containerChange", "contentTemplateChange", "deferRenderingChange", "disabledChange", "heightChange", "hideEventChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showEventChange", "targetChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "component", type: BayanEmployeeBadgeComponent, selector: "bayan-employee-badge", inputs: ["badge", "width", "height", "imageClass", "badgeClass"], outputs: ["employeePhotoError"] }, { kind: "component", type: SkyShortcutIconComponent, selector: "sky-shortcut-icon", inputs: ["shortcut", "itemClass", "iconContainerClass", "iconClass", "textClass"], outputs: ["onClicked"] }, { kind: "pipe", type: HrTranslatePipe, name: "hrTranslate" }] });
|
|
466
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HRMyMainDetailsWidgetComponent, deps: [{ token: i1.HttpClient }, { token: HRConstantsService }, { token: HRTranslatePipe }], target: i0.ɵɵFactoryTarget.Component });
|
|
467
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: HRMyMainDetailsWidgetComponent, isStandalone: true, selector: "hr-my-main-details-widget", inputs: { badgeClass: "badgeClass", badgeImageClass: "badgeImageClass", badgeWidth: "badgeWidth", badgeHeight: "badgeHeight", employeeInfoContainerClass: "employeeInfoContainerClass", employeeDetailsClass: "employeeDetailsClass", employeeNameContainerClass: "employeeNameContainerClass", employeeNameClass: "employeeNameClass", employeePositionClass: "employeePositionClass", employeeGradeClass: "employeeGradeClass", containerClass: "containerClass", cardBodyClass: "cardBodyClass", headerRowClass: "headerRowClass", shortcutsContainerClass: "shortcutsContainerClass", shortcutItemClass: "shortcutItemClass", shortcutIconContainerClass: "shortcutIconContainerClass", shortcutIconClass: "shortcutIconClass", shortcutTextClass: "shortcutTextClass", detailsRowClass: "detailsRowClass", reportingBlockClass: "reportingBlockClass", captionLabelClasses: "captionLabelClasses", captionLabelValueClass: "captionLabelValueClass", vacationBalancesContainerClass: "vacationBalancesContainerClass", vacationBalanceItemClass: "vacationBalanceItemClass", vacationBalanceHeaderClass: "vacationBalanceHeaderClass", vacationColorDotClass: "vacationColorDotClass", vacationTypeNameClass: "vacationTypeNameClass", vacationBalanceValueRowClass: "vacationBalanceValueRowClass", vacationBalanceValueClass: "vacationBalanceValueClass", tooltipTriggerLinkClass: "tooltipTriggerLinkClass", tooltipTriggerTextClass: "tooltipTriggerTextClass", tooltipVacationRowClass: "tooltipVacationRowClass", tooltipVacationNameContainerClass: "tooltipVacationNameContainerClass", tooltipVacationNameClass: "tooltipVacationNameClass", defaultVacationBalanceColor: "defaultVacationBalanceColor", defaultVacationColor: "defaultVacationColor", baseUrl: "baseUrl", isMobile: "isMobile", isTablet: "isTablet", shortcuts: "shortcuts" }, outputs: { onShortcutClicked: "onShortcutClicked", isLoadingChanged: "isLoadingChanged" }, usesOnChanges: true, ngImport: i0, template: "<div [class]=\"containerClass\">\r\n <div [class]=\"cardBodyClass\">\r\n <div [class]=\"headerRowClass\">\r\n <div>\r\n @if(employeeMainInfo!=null){\r\n <div [class]=\"employeeInfoContainerClass\">\r\n <bayan-employee-badge [badge]=\"employeeBadge\"\r\n [badgeClass]=\"badgeClass\"\r\n [imageClass]=\"badgeImageClass\"\r\n [width]=\"badgeWidth\"\r\n [height]=\"badgeHeight\"\r\n (employeePhotoError)=\"handleEmployeePhotoError()\"></bayan-employee-badge>\r\n\r\n <div [class]=\"employeeDetailsClass\">\r\n <div [class]=\"employeeNameContainerClass\">\r\n <div [class]=\"employeeNameClass\"\r\n data-bs-toggle=\"tooltip\" [title]=\"employeeMainInfo.EmployeeNumber+' | '+ employeeMainInfo.EmployeeName\">\r\n {{employeeMainInfo.EmployeeNumber + ' | ' + employeeMainInfo.EmployeeName}}\r\n </div>\r\n </div>\r\n @if(employeeMainInfo.PositionName != null && employeeMainInfo.PositionName != ''){\r\n <div [class]=\"employeePositionClass\"\r\n data-bs-toggle=\"tooltip\"\r\n [title]=\"employeeMainInfo.PositionName\">\r\n {{employeeMainInfo.PositionName}}\r\n </div>\r\n }\r\n @if(employeeMainInfo.GradeName !=null){\r\n <div [class]=\"employeeGradeClass\" [title]=\"employeeMainInfo.GradeName\">\r\n {{employeeMainInfo.GradeName}}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <div [class]=\"shortcutsContainerClass\">\r\n @for(Icon of shortcuts ; track Icon ; let i = $index;){\r\n <sky-shortcut-icon [shortcut]=\"Icon\"\r\n [itemClass]=\"shortcutItemClass\"\r\n [iconContainerClass]=\"shortcutIconContainerClass\"\r\n [iconClass]=\"shortcutIconClass\"\r\n [textClass]=\"shortcutTextClass\"\r\n (onClicked)=\"shortcutClicked($event)\"></sky-shortcut-icon>\r\n }\r\n </div>\r\n </div>\r\n <div [class]=\"detailsRowClass\" [ngClass]=\"{'flex-wrap': isMobile || isTablet}\">\r\n <div [class]=\"reportingBlockClass\" [ngClass]=\"{'mb-3': isMobile}\">\r\n <div [class]=\"captionLabelClasses + ' me-5'\">\r\n <div>\r\n {{'ReportingTo' | HRTranslate}}\r\n </div>\r\n <div [class]=\"captionLabelValueClass\">\r\n @if(employeeMainInfo?.ReportingTo){\r\n {{employeeMainInfo?.ReportingTo}}\r\n }@else{\r\n {{'NotAnknown' | HRTranslate}}\r\n }\r\n </div>\r\n </div>\r\n <div [class]=\"captionLabelClasses\" [ngClass]=\"{'border-end border-1 pe-4': !isMobile}\">\r\n <div>\r\n {{'ServiceYears' | HRTranslate}}\r\n </div>\r\n <div [class]=\"captionLabelValueClass\">\r\n {{employeeMainInfo?.ServiceYears}}\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"flex-grow-1\" [ngClass]=\"{' ms-4': !isMobile && !isTablet, 'w-100': isTablet}\">\r\n <div [class]=\"vacationBalancesContainerClass\" [ngClass]=\"{'flex-wrap': isMobile,'w-100': isTablet}\">\r\n @for(vacationBalance of employeeMainInfo?.VacationBalances ; track vacationBalance ; let i = $index;){\r\n @if(i <= 2 || employeeMainInfo?.VacationBalances?.length == 4) {\r\n <div [class]=\"vacationBalanceItemClass\" [ngClass]=\"{'mb-2 w-40': isMobile}\">\r\n <div [class]=\"vacationBalanceHeaderClass\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"vacationBalance.VacationTypeColor\"></div>\r\n </div>\r\n <div [class]=\"vacationTypeNameClass\">\r\n {{vacationBalance.VacationTypeName}}\r\n </div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueRowClass\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle invisible\" style=\"height: 11px; width: 11px;\"></div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueClass\">{{vacationBalance.CurrentBalance | number:'1.2-2'}} {{(vacationBalance.CurrentBalance! == 1 ? 'day' : 'days') | HRTranslate}}</div>\r\n </div>\r\n </div>\r\n }\r\n }\r\n\r\n @if(employeeMainInfo?.VacationBalances && employeeMainInfo!.VacationBalances!.length > 4){\r\n <div [class]=\"vacationBalanceItemClass\">\r\n <div [class]=\"tooltipTriggerLinkClass\" id=\"otherVacationBalances\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"defaultVacationBalanceColor\"></div>\r\n </div>\r\n <div [class]=\"tooltipTriggerTextClass\">\r\n +{{(employeeMainInfo!.VacationBalances!.length - 3)}} {{'More' | HRTranslate}}\r\n </div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueRowClass\" style=\"visibility: hidden\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\"></div>\r\n </div>\r\n <div class=\"mx-1 fw-medium fs-14 text-dark-gray\">{{'More' | HRTranslate}}</div>\r\n </div>\r\n <dx-tooltip [target]=\"'#otherVacationBalances'\"\r\n [showEvent]=\"'mouseenter'\"\r\n [hideEvent]=\"'mouseleave'\">\r\n @for (vacationBalance of employeeMainInfo!.VacationBalances! ; track vacationBalance; let i = $index;){\r\n @if(i > 2){\r\n <div [class]=\"tooltipVacationRowClass\">\r\n <div [class]=\"tooltipVacationNameContainerClass\">\r\n\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"vacationBalance.VacationTypeColor\"></div>\r\n </div>\r\n <div [class]=\"tooltipVacationNameClass\">\r\n {{vacationBalance.VacationTypeName}}\r\n </div>\r\n </div>\r\n <div>{{vacationBalance.CurrentBalance | number:'1.2-2'}} {{(vacationBalance.CurrentBalance! == 1 ? 'day' : 'days') | HRTranslate}}</div>\r\n </div>\r\n }\r\n }\r\n </dx-tooltip>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: DxTooltipModule }, { kind: "component", type: i1$1.DxTooltipComponent, selector: "dx-tooltip", inputs: ["animation", "closeOnOutsideClick", "container", "contentTemplate", "deferRendering", "disabled", "height", "hideEvent", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showEvent", "target", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "animationChange", "closeOnOutsideClickChange", "containerChange", "contentTemplateChange", "deferRenderingChange", "disabledChange", "heightChange", "hideEventChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showEventChange", "targetChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "component", type: BayanEmployeeBadgeComponent, selector: "bayan-employee-badge", inputs: ["badge", "width", "height", "imageClass", "badgeClass"], outputs: ["employeePhotoError"] }, { kind: "component", type: SkyShortcutIconComponent, selector: "sky-shortcut-icon", inputs: ["shortcut", "itemClass", "iconContainerClass", "iconClass", "textClass"], outputs: ["onClicked"] }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }] });
|
|
427
468
|
}
|
|
428
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
469
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HRMyMainDetailsWidgetComponent, decorators: [{
|
|
429
470
|
type: Component,
|
|
430
|
-
args: [{ selector: 'hr-my-main-details-widget', standalone: true, imports: [DxTooltipModule, NgClass, FontAwesomeModule, DecimalPipe, BayanEmployeeBadgeComponent, SkyShortcutIconComponent,
|
|
431
|
-
}], ctorParameters: () => [{ type: i1.HttpClient }, { type:
|
|
471
|
+
args: [{ selector: 'hr-my-main-details-widget', standalone: true, imports: [DxTooltipModule, NgClass, FontAwesomeModule, DecimalPipe, BayanEmployeeBadgeComponent, SkyShortcutIconComponent, HRTranslatePipe], template: "<div [class]=\"containerClass\">\r\n <div [class]=\"cardBodyClass\">\r\n <div [class]=\"headerRowClass\">\r\n <div>\r\n @if(employeeMainInfo!=null){\r\n <div [class]=\"employeeInfoContainerClass\">\r\n <bayan-employee-badge [badge]=\"employeeBadge\"\r\n [badgeClass]=\"badgeClass\"\r\n [imageClass]=\"badgeImageClass\"\r\n [width]=\"badgeWidth\"\r\n [height]=\"badgeHeight\"\r\n (employeePhotoError)=\"handleEmployeePhotoError()\"></bayan-employee-badge>\r\n\r\n <div [class]=\"employeeDetailsClass\">\r\n <div [class]=\"employeeNameContainerClass\">\r\n <div [class]=\"employeeNameClass\"\r\n data-bs-toggle=\"tooltip\" [title]=\"employeeMainInfo.EmployeeNumber+' | '+ employeeMainInfo.EmployeeName\">\r\n {{employeeMainInfo.EmployeeNumber + ' | ' + employeeMainInfo.EmployeeName}}\r\n </div>\r\n </div>\r\n @if(employeeMainInfo.PositionName != null && employeeMainInfo.PositionName != ''){\r\n <div [class]=\"employeePositionClass\"\r\n data-bs-toggle=\"tooltip\"\r\n [title]=\"employeeMainInfo.PositionName\">\r\n {{employeeMainInfo.PositionName}}\r\n </div>\r\n }\r\n @if(employeeMainInfo.GradeName !=null){\r\n <div [class]=\"employeeGradeClass\" [title]=\"employeeMainInfo.GradeName\">\r\n {{employeeMainInfo.GradeName}}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <div [class]=\"shortcutsContainerClass\">\r\n @for(Icon of shortcuts ; track Icon ; let i = $index;){\r\n <sky-shortcut-icon [shortcut]=\"Icon\"\r\n [itemClass]=\"shortcutItemClass\"\r\n [iconContainerClass]=\"shortcutIconContainerClass\"\r\n [iconClass]=\"shortcutIconClass\"\r\n [textClass]=\"shortcutTextClass\"\r\n (onClicked)=\"shortcutClicked($event)\"></sky-shortcut-icon>\r\n }\r\n </div>\r\n </div>\r\n <div [class]=\"detailsRowClass\" [ngClass]=\"{'flex-wrap': isMobile || isTablet}\">\r\n <div [class]=\"reportingBlockClass\" [ngClass]=\"{'mb-3': isMobile}\">\r\n <div [class]=\"captionLabelClasses + ' me-5'\">\r\n <div>\r\n {{'ReportingTo' | HRTranslate}}\r\n </div>\r\n <div [class]=\"captionLabelValueClass\">\r\n @if(employeeMainInfo?.ReportingTo){\r\n {{employeeMainInfo?.ReportingTo}}\r\n }@else{\r\n {{'NotAnknown' | HRTranslate}}\r\n }\r\n </div>\r\n </div>\r\n <div [class]=\"captionLabelClasses\" [ngClass]=\"{'border-end border-1 pe-4': !isMobile}\">\r\n <div>\r\n {{'ServiceYears' | HRTranslate}}\r\n </div>\r\n <div [class]=\"captionLabelValueClass\">\r\n {{employeeMainInfo?.ServiceYears}}\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"flex-grow-1\" [ngClass]=\"{' ms-4': !isMobile && !isTablet, 'w-100': isTablet}\">\r\n <div [class]=\"vacationBalancesContainerClass\" [ngClass]=\"{'flex-wrap': isMobile,'w-100': isTablet}\">\r\n @for(vacationBalance of employeeMainInfo?.VacationBalances ; track vacationBalance ; let i = $index;){\r\n @if(i <= 2 || employeeMainInfo?.VacationBalances?.length == 4) {\r\n <div [class]=\"vacationBalanceItemClass\" [ngClass]=\"{'mb-2 w-40': isMobile}\">\r\n <div [class]=\"vacationBalanceHeaderClass\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"vacationBalance.VacationTypeColor\"></div>\r\n </div>\r\n <div [class]=\"vacationTypeNameClass\">\r\n {{vacationBalance.VacationTypeName}}\r\n </div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueRowClass\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle invisible\" style=\"height: 11px; width: 11px;\"></div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueClass\">{{vacationBalance.CurrentBalance | number:'1.2-2'}} {{(vacationBalance.CurrentBalance! == 1 ? 'day' : 'days') | HRTranslate}}</div>\r\n </div>\r\n </div>\r\n }\r\n }\r\n\r\n @if(employeeMainInfo?.VacationBalances && employeeMainInfo!.VacationBalances!.length > 4){\r\n <div [class]=\"vacationBalanceItemClass\">\r\n <div [class]=\"tooltipTriggerLinkClass\" id=\"otherVacationBalances\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"defaultVacationBalanceColor\"></div>\r\n </div>\r\n <div [class]=\"tooltipTriggerTextClass\">\r\n +{{(employeeMainInfo!.VacationBalances!.length - 3)}} {{'More' | HRTranslate}}\r\n </div>\r\n </div>\r\n <div [class]=\"vacationBalanceValueRowClass\" style=\"visibility: hidden\">\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\"></div>\r\n </div>\r\n <div class=\"mx-1 fw-medium fs-14 text-dark-gray\">{{'More' | HRTranslate}}</div>\r\n </div>\r\n <dx-tooltip [target]=\"'#otherVacationBalances'\"\r\n [showEvent]=\"'mouseenter'\"\r\n [hideEvent]=\"'mouseleave'\">\r\n @for (vacationBalance of employeeMainInfo!.VacationBalances! ; track vacationBalance; let i = $index;){\r\n @if(i > 2){\r\n <div [class]=\"tooltipVacationRowClass\">\r\n <div [class]=\"tooltipVacationNameContainerClass\">\r\n\r\n <div [class]=\"vacationColorDotClass\">\r\n <div class=\"rounded rounded-circle\" style=\"height: 11px; width: 11px;\" [style.background-color]=\"vacationBalance.VacationTypeColor\"></div>\r\n </div>\r\n <div [class]=\"tooltipVacationNameClass\">\r\n {{vacationBalance.VacationTypeName}}\r\n </div>\r\n </div>\r\n <div>{{vacationBalance.CurrentBalance | number:'1.2-2'}} {{(vacationBalance.CurrentBalance! == 1 ? 'day' : 'days') | HRTranslate}}</div>\r\n </div>\r\n }\r\n }\r\n </dx-tooltip>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n" }]
|
|
472
|
+
}], ctorParameters: () => [{ type: i1.HttpClient }, { type: HRConstantsService }, { type: HRTranslatePipe }], propDecorators: { onShortcutClicked: [{
|
|
432
473
|
type: Output
|
|
433
474
|
}], isLoadingChanged: [{
|
|
434
475
|
type: Output
|
|
@@ -514,16 +555,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
|
|
|
514
555
|
type: Input
|
|
515
556
|
}] } });
|
|
516
557
|
|
|
517
|
-
class
|
|
558
|
+
class HRCardHeaderComponent {
|
|
518
559
|
icon;
|
|
519
560
|
title;
|
|
520
561
|
containerClass = 'd-flex align-items-center mb-2';
|
|
521
562
|
iconClass = 'fs-6 text-primary pe-2';
|
|
522
563
|
titleClass = 'text-center table-header-lg fw-medium';
|
|
523
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
524
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
564
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HRCardHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
565
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.21", type: HRCardHeaderComponent, isStandalone: true, selector: "hr-card-header", inputs: { icon: "icon", title: "title", containerClass: "containerClass", iconClass: "iconClass", titleClass: "titleClass" }, ngImport: i0, template: "<div [class]=\"containerClass\">\r\n <fa-icon [icon]=\"icon\" [class]=\"iconClass\"></fa-icon>\r\n <span [class]=\"titleClass\">{{ title }}</span>\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1$2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }] });
|
|
525
566
|
}
|
|
526
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
567
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HRCardHeaderComponent, decorators: [{
|
|
527
568
|
type: Component,
|
|
528
569
|
args: [{ selector: 'hr-card-header', standalone: true, imports: [FontAwesomeModule], template: "<div [class]=\"containerClass\">\r\n <fa-icon [icon]=\"icon\" [class]=\"iconClass\"></fa-icon>\r\n <span [class]=\"titleClass\">{{ title }}</span>\r\n</div>\r\n" }]
|
|
529
570
|
}], propDecorators: { icon: [{
|
|
@@ -538,7 +579,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
|
|
|
538
579
|
type: Input
|
|
539
580
|
}] } });
|
|
540
581
|
|
|
541
|
-
class
|
|
582
|
+
class HREventItemComponent {
|
|
542
583
|
events = [];
|
|
543
584
|
showDates = false;
|
|
544
585
|
showProperty = true;
|
|
@@ -558,12 +599,12 @@ class HrEventItemComponent {
|
|
|
558
599
|
get isArabic() { return this.selectedLanguage === 'ar'; }
|
|
559
600
|
isBirthday(event) { return event.EventType === EventTypeEnum.Birthdays; }
|
|
560
601
|
hasPropertyBadge(event) { return this.showProperty && !!event.PropertySymbol; }
|
|
561
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
562
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
602
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HREventItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
603
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: HREventItemComponent, isStandalone: true, selector: "hr-event-item", inputs: { events: "events", showDates: "showDates", showProperty: "showProperty", selectedLanguage: "selectedLanguage", selectedEventType: "selectedEventType", weekendWarningDescription: "weekendWarningDescription", eventIconClass: "eventIconClass", eventNameBoldClass: "eventNameBoldClass", eventDescriptionClass: "eventDescriptionClass", propertyBadgeClass: "propertyBadgeClass", noEventsTextClass: "noEventsTextClass", warningTextClass: "warningTextClass", dateFormat: "dateFormat" }, ngImport: i0, template: "@if (events.length > 0) {\r\n<div>\r\n @for (event of events; track event) {\r\n <div [class]=\"'d-flex ' + (showDates ? 'my-3' : 'my-1')\">\r\n <fa-icon [icon]=\"isBirthday(event) ? cakeCandles : treePalm\"\r\n [class]=\"eventIconClass\"\r\n [title]=\"isBirthday(event) ? ('Birthday' | HRTranslate) : ('PublicHoliday' | HRTranslate)\">\r\n </fa-icon>\r\n\r\n <div>\r\n @if (isBirthday(event)) {\r\n @if (hasPropertyBadge(event)) {\r\n <span [class]=\"propertyBadgeClass\" [title]=\"event.PropertyName!\">{{ event.PropertySymbol }}</span>\r\n }\r\n @if (isArabic) {\r\n <span>{{ 'Birthday' | HRTranslate }}</span>\r\n <span [class]=\"eventNameBoldClass\">{{ ' ' + event.Name + ' ' }}</span>\r\n @if (event.IsIn2Days) { <span>{{ 'During' | HRTranslate }} </span> }\r\n } @else {\r\n <span [class]=\"eventNameBoldClass\">{{ event.Name }}'s </span>\r\n <span>{{ ('Birthday' | HRTranslate) + ' ' + ((event.IsIn2Days ? ('isIn' | HRTranslate) : ('is' | HRTranslate)) | lowercase) }} </span>\r\n }\r\n } @else {\r\n @if (isArabic) {\r\n <span [class]=\"eventNameBoldClass\">{{ event.Name }}</span> <span> {{ ('In' | HRTranslate) + ' ' }}</span>\r\n } @else {\r\n <span [class]=\"eventNameBoldClass\">{{ event.Name }} </span><span>{{ ' ' + (('is' | HRTranslate) | lowercase) }} </span>\r\n }\r\n }\r\n\r\n <span [class]=\"eventDescriptionClass\">{{ event.Description | HRTranslate }}</span>\r\n\r\n @if (!isBirthday(event) && showDates && event.StartDate && event.EndDate) {\r\n <span>{{ ' (' + (event.StartDate | date:dateFormat) + ' - ' + (event.EndDate | date:dateFormat) + ')' }}</span>\r\n }\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n} @else {\r\n@if (weekendWarningDescription) {\r\n<div [class]=\"warningTextClass\">{{ weekendWarningDescription | HRTranslate}}</div>\r\n} @else {\r\n<div [class]=\"noEventsTextClass\">{{ 'NoEvents' | HRTranslate }}</div>\r\n}\r\n}\r\n", dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1$2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: LowerCasePipe, name: "lowercase" }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }] });
|
|
563
604
|
}
|
|
564
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
605
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HREventItemComponent, decorators: [{
|
|
565
606
|
type: Component,
|
|
566
|
-
args: [{ selector: 'hr-event-item', standalone: true, imports: [FontAwesomeModule, DatePipe, LowerCasePipe,
|
|
607
|
+
args: [{ selector: 'hr-event-item', standalone: true, imports: [FontAwesomeModule, DatePipe, LowerCasePipe, HRTranslatePipe], template: "@if (events.length > 0) {\r\n<div>\r\n @for (event of events; track event) {\r\n <div [class]=\"'d-flex ' + (showDates ? 'my-3' : 'my-1')\">\r\n <fa-icon [icon]=\"isBirthday(event) ? cakeCandles : treePalm\"\r\n [class]=\"eventIconClass\"\r\n [title]=\"isBirthday(event) ? ('Birthday' | HRTranslate) : ('PublicHoliday' | HRTranslate)\">\r\n </fa-icon>\r\n\r\n <div>\r\n @if (isBirthday(event)) {\r\n @if (hasPropertyBadge(event)) {\r\n <span [class]=\"propertyBadgeClass\" [title]=\"event.PropertyName!\">{{ event.PropertySymbol }}</span>\r\n }\r\n @if (isArabic) {\r\n <span>{{ 'Birthday' | HRTranslate }}</span>\r\n <span [class]=\"eventNameBoldClass\">{{ ' ' + event.Name + ' ' }}</span>\r\n @if (event.IsIn2Days) { <span>{{ 'During' | HRTranslate }} </span> }\r\n } @else {\r\n <span [class]=\"eventNameBoldClass\">{{ event.Name }}'s </span>\r\n <span>{{ ('Birthday' | HRTranslate) + ' ' + ((event.IsIn2Days ? ('isIn' | HRTranslate) : ('is' | HRTranslate)) | lowercase) }} </span>\r\n }\r\n } @else {\r\n @if (isArabic) {\r\n <span [class]=\"eventNameBoldClass\">{{ event.Name }}</span> <span> {{ ('In' | HRTranslate) + ' ' }}</span>\r\n } @else {\r\n <span [class]=\"eventNameBoldClass\">{{ event.Name }} </span><span>{{ ' ' + (('is' | HRTranslate) | lowercase) }} </span>\r\n }\r\n }\r\n\r\n <span [class]=\"eventDescriptionClass\">{{ event.Description | HRTranslate }}</span>\r\n\r\n @if (!isBirthday(event) && showDates && event.StartDate && event.EndDate) {\r\n <span>{{ ' (' + (event.StartDate | date:dateFormat) + ' - ' + (event.EndDate | date:dateFormat) + ')' }}</span>\r\n }\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n} @else {\r\n@if (weekendWarningDescription) {\r\n<div [class]=\"warningTextClass\">{{ weekendWarningDescription | HRTranslate}}</div>\r\n} @else {\r\n<div [class]=\"noEventsTextClass\">{{ 'NoEvents' | HRTranslate }}</div>\r\n}\r\n}\r\n" }]
|
|
567
608
|
}], propDecorators: { events: [{
|
|
568
609
|
type: Input
|
|
569
610
|
}], showDates: [{
|
|
@@ -592,7 +633,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
|
|
|
592
633
|
type: Input
|
|
593
634
|
}] } });
|
|
594
635
|
|
|
595
|
-
class
|
|
636
|
+
class HREventTabBarComponent {
|
|
637
|
+
translatePipe;
|
|
596
638
|
selectedType = null;
|
|
597
639
|
selectedLanguage = 'en';
|
|
598
640
|
tabSelectedClass = 'selected-event-option';
|
|
@@ -604,7 +646,9 @@ class HrEventTabBarComponent {
|
|
|
604
646
|
tabTextClass = 'fs-16';
|
|
605
647
|
tabIconClass = 'fs-6';
|
|
606
648
|
tabSelected = new EventEmitter();
|
|
607
|
-
translatePipe
|
|
649
|
+
constructor(translatePipe) {
|
|
650
|
+
this.translatePipe = translatePipe;
|
|
651
|
+
}
|
|
608
652
|
tabList = [
|
|
609
653
|
{ id: null, icon: null },
|
|
610
654
|
{ id: EventTypeEnum.Birthdays, icon: faCakeCandles },
|
|
@@ -617,13 +661,13 @@ class HrEventTabBarComponent {
|
|
|
617
661
|
return this.translatePipe.transform('Birthday');
|
|
618
662
|
return this.translatePipe.transform('PublicHoliday');
|
|
619
663
|
}
|
|
620
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
621
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
664
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HREventTabBarComponent, deps: [{ token: HRTranslatePipe }], target: i0.ɵɵFactoryTarget.Component });
|
|
665
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: HREventTabBarComponent, isStandalone: true, selector: "hr-event-tab-bar", inputs: { selectedType: "selectedType", selectedLanguage: "selectedLanguage", tabSelectedClass: "tabSelectedClass", tabNotSelectedClass: "tabNotSelectedClass", tabTextSelectedClass: "tabTextSelectedClass", tabTextNotSelectedClass: "tabTextNotSelectedClass", containerClass: "containerClass", tabItemClass: "tabItemClass", tabTextClass: "tabTextClass", tabIconClass: "tabIconClass" }, outputs: { tabSelected: "tabSelected" }, ngImport: i0, template: "<div [class]=\"containerClass\">\r\n @for (tab of tabList; track tab) {\r\n <div [class]=\"tabItemClass + ' ' + (selectedType == tab.id ? tabSelectedClass : tabNotSelectedClass)\"\r\n [ngClass]=\"{'w-25': (selectedLanguage == 'fr' && !tab?.icon)}\"\r\n (click)=\"tabSelected.emit(tab.id)\">\r\n @if (!tab?.icon) {\r\n <span [class]=\"tabTextClass + ' ' + (selectedType == tab.id ? tabTextSelectedClass : tabTextNotSelectedClass)\">{{ getTabText(tab) }}</span>\r\n } @else {\r\n <fa-icon [icon]=\"tab.icon!\" [class]=\"tabIconClass + ' ' + (selectedType == tab.id ? tabTextSelectedClass : tabTextNotSelectedClass)\" [title]=\"getTabText(tab)\"></fa-icon>\r\n }\r\n </div>\r\n }\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1$2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
622
666
|
}
|
|
623
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
667
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HREventTabBarComponent, decorators: [{
|
|
624
668
|
type: Component,
|
|
625
|
-
args: [{ selector: 'hr-event-tab-bar', standalone: true, imports: [FontAwesomeModule, NgClass,
|
|
626
|
-
}], propDecorators: { selectedType: [{
|
|
669
|
+
args: [{ selector: 'hr-event-tab-bar', standalone: true, imports: [FontAwesomeModule, NgClass, HRTranslatePipe], template: "<div [class]=\"containerClass\">\r\n @for (tab of tabList; track tab) {\r\n <div [class]=\"tabItemClass + ' ' + (selectedType == tab.id ? tabSelectedClass : tabNotSelectedClass)\"\r\n [ngClass]=\"{'w-25': (selectedLanguage == 'fr' && !tab?.icon)}\"\r\n (click)=\"tabSelected.emit(tab.id)\">\r\n @if (!tab?.icon) {\r\n <span [class]=\"tabTextClass + ' ' + (selectedType == tab.id ? tabTextSelectedClass : tabTextNotSelectedClass)\">{{ getTabText(tab) }}</span>\r\n } @else {\r\n <fa-icon [icon]=\"tab.icon!\" [class]=\"tabIconClass + ' ' + (selectedType == tab.id ? tabTextSelectedClass : tabTextNotSelectedClass)\" [title]=\"getTabText(tab)\"></fa-icon>\r\n }\r\n </div>\r\n }\r\n</div>\r\n" }]
|
|
670
|
+
}], ctorParameters: () => [{ type: HRTranslatePipe }], propDecorators: { selectedType: [{
|
|
627
671
|
type: Input
|
|
628
672
|
}], selectedLanguage: [{
|
|
629
673
|
type: Input
|
|
@@ -647,7 +691,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
|
|
|
647
691
|
type: Output
|
|
648
692
|
}] } });
|
|
649
693
|
|
|
650
|
-
class
|
|
694
|
+
class HREventsPopupComponent {
|
|
651
695
|
visible = false;
|
|
652
696
|
events = [];
|
|
653
697
|
hasBirthdays = false;
|
|
@@ -682,12 +726,12 @@ class HrEventsPopupComponent {
|
|
|
682
726
|
onPopupClose() {
|
|
683
727
|
this.closed.emit();
|
|
684
728
|
}
|
|
685
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
686
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
729
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HREventsPopupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
730
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: HREventsPopupComponent, isStandalone: true, selector: "hr-upcoming-events-popup", inputs: { visible: "visible", events: "events", hasBirthdays: "hasBirthdays", hasHolidays: "hasHolidays", isLoading: "isLoading", selectedLanguage: "selectedLanguage", showProperty: "showProperty", weekendWarningDescription: "weekendWarningDescription", popupTitle: "popupTitle", selectedEventType: "selectedEventType", tabSelectedClass: "tabSelectedClass", tabNotSelectedClass: "tabNotSelectedClass", tabTextSelectedClass: "tabTextSelectedClass", tabTextNotSelectedClass: "tabTextNotSelectedClass", tabContainerClass: "tabContainerClass", tabItemClass: "tabItemClass", tabTextClass: "tabTextClass", tabIconClass: "tabIconClass", eventIconClass: "eventIconClass", eventNameBoldClass: "eventNameBoldClass", eventDescriptionClass: "eventDescriptionClass", propertyBadgeClass: "propertyBadgeClass", noEventsTextClass: "noEventsTextClass", warningTextClass: "warningTextClass", dateFormat: "dateFormat" }, outputs: { visibleChange: "visibleChange", tabSelected: "tabSelected", closed: "closed" }, ngImport: i0, template: "<dx-popup id=\"popup\"\r\n [(visible)]=\"visible\"\r\n [height]=\"'400'\"\r\n [maxHeight]=\"400\"\r\n [width]=\"'650'\"\r\n shadingColor=\"rgba(0,0,0,0.4)\"\r\n contentTemplate=\"popup-content\"\r\n [showCloseButton]=\"true\"\r\n [title]=\"popupTitle\"\r\n (onHiding)=\"onPopupClose()\"\r\n (visibleChange)=\"visibleChange.emit($event)\">\r\n\r\n <div class=\"text-dark\" *dxTemplate=\"let data of 'popup-content'\">\r\n <dx-scroll-view #upcomingEventsScrollView\r\n id=\"upcomingEventsScrollView\"\r\n [scrollByContent]=\"true\"\r\n [scrollByThumb]=\"true\"\r\n [showScrollbar]=\"'onScroll'\"\r\n [bounceEnabled]=\"false\">\r\n\r\n @if (hasBirthdays || hasHolidays) {\r\n <hr-event-tab-bar [selectedType]=\"selectedEventType\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [tabSelectedClass]=\"tabSelectedClass\"\r\n [tabNotSelectedClass]=\"tabNotSelectedClass\"\r\n [tabTextSelectedClass]=\"tabTextSelectedClass\"\r\n [tabTextNotSelectedClass]=\"tabTextNotSelectedClass\"\r\n [containerClass]=\"tabContainerClass\"\r\n [tabItemClass]=\"tabItemClass\"\r\n [tabTextClass]=\"tabTextClass\"\r\n [tabIconClass]=\"tabIconClass\"\r\n (tabSelected)=\"onTabSelected($event)\">\r\n </hr-event-tab-bar>\r\n\r\n <hr-event-item [events]=\"events\"\r\n [showDates]=\"true\"\r\n [showProperty]=\"showProperty\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [selectedEventType]=\"selectedEventType\"\r\n [weekendWarningDescription]=\"weekendWarningDescription\"\r\n [eventIconClass]=\"eventIconClass\"\r\n [eventNameBoldClass]=\"eventNameBoldClass\"\r\n [eventDescriptionClass]=\"eventDescriptionClass\"\r\n [propertyBadgeClass]=\"propertyBadgeClass\"\r\n [noEventsTextClass]=\"noEventsTextClass\"\r\n [warningTextClass]=\"warningTextClass\"\r\n [dateFormat]=\"dateFormat\">\r\n </hr-event-item>\r\n } @else {\r\n <div [class]=\"noEventsTextClass\">{{ 'NoEvents' | HRTranslate }}</div>\r\n }\r\n </dx-scroll-view>\r\n </div>\r\n</dx-popup>\r\n\r\n<dx-load-panel shadingColor=\"rgba(0,0,0,0.4)\"\r\n [visible]=\"isLoading\"\r\n [showIndicator]=\"true\" [showPane]=\"true\"\r\n [shading]=\"true\" [hideOnOutsideClick]=\"false\">\r\n</dx-load-panel>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: DxPopupModule }, { kind: "component", type: i1$1.DxPopupComponent, selector: "dx-popup", inputs: ["accessKey", "animation", "closeOnOutsideClick", "container", "contentTemplate", "deferRendering", "disabled", "dragAndResizeArea", "dragEnabled", "dragOutsideBoundary", "enableBodyScroll", "focusStateEnabled", "fullScreen", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "resizeEnabled", "restorePosition", "rtlEnabled", "shading", "shadingColor", "showCloseButton", "showTitle", "tabIndex", "title", "titleTemplate", "toolbarItems", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onResize", "onResizeEnd", "onResizeStart", "onShowing", "onShown", "onTitleRendered", "accessKeyChange", "animationChange", "closeOnOutsideClickChange", "containerChange", "contentTemplateChange", "deferRenderingChange", "disabledChange", "dragAndResizeAreaChange", "dragEnabledChange", "dragOutsideBoundaryChange", "enableBodyScrollChange", "focusStateEnabledChange", "fullScreenChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "resizeEnabledChange", "restorePositionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showTitleChange", "tabIndexChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "directive", type: i2.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { kind: "ngmodule", type: DxScrollViewModule }, { kind: "component", type: i1$1.DxScrollViewComponent, selector: "dx-scroll-view", inputs: ["bounceEnabled", "direction", "disabled", "elementAttr", "height", "pulledDownText", "pullingDownText", "reachBottomText", "refreshingText", "rtlEnabled", "scrollByContent", "scrollByThumb", "showScrollbar", "useNative", "width"], outputs: ["onDisposing", "onInitialized", "onOptionChanged", "onPullDown", "onReachBottom", "onScroll", "onUpdated", "bounceEnabledChange", "directionChange", "disabledChange", "elementAttrChange", "heightChange", "pulledDownTextChange", "pullingDownTextChange", "reachBottomTextChange", "refreshingTextChange", "rtlEnabledChange", "scrollByContentChange", "scrollByThumbChange", "showScrollbarChange", "useNativeChange", "widthChange"] }, { kind: "ngmodule", type: DxLoadPanelModule }, { kind: "component", type: i1$1.DxLoadPanelComponent, selector: "dx-load-panel", inputs: ["animation", "closeOnOutsideClick", "container", "deferRendering", "delay", "focusStateEnabled", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "indicatorSrc", "maxHeight", "maxWidth", "message", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showIndicator", "showPane", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "animationChange", "closeOnOutsideClickChange", "containerChange", "deferRenderingChange", "delayChange", "focusStateEnabledChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "indicatorSrcChange", "maxHeightChange", "maxWidthChange", "messageChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showIndicatorChange", "showPaneChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "component", type: HREventItemComponent, selector: "hr-event-item", inputs: ["events", "showDates", "showProperty", "selectedLanguage", "selectedEventType", "weekendWarningDescription", "eventIconClass", "eventNameBoldClass", "eventDescriptionClass", "propertyBadgeClass", "noEventsTextClass", "warningTextClass", "dateFormat"] }, { kind: "component", type: HREventTabBarComponent, selector: "hr-event-tab-bar", inputs: ["selectedType", "selectedLanguage", "tabSelectedClass", "tabNotSelectedClass", "tabTextSelectedClass", "tabTextNotSelectedClass", "containerClass", "tabItemClass", "tabTextClass", "tabIconClass"], outputs: ["tabSelected"] }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }] });
|
|
687
731
|
}
|
|
688
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
732
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HREventsPopupComponent, decorators: [{
|
|
689
733
|
type: Component,
|
|
690
|
-
args: [{ selector: 'hr-upcoming-events-popup', standalone: true, imports: [CommonModule, DxPopupModule, DxScrollViewModule, DxLoadPanelModule,
|
|
734
|
+
args: [{ selector: 'hr-upcoming-events-popup', standalone: true, imports: [CommonModule, DxPopupModule, DxScrollViewModule, DxLoadPanelModule, HREventItemComponent, HREventTabBarComponent, HRTranslatePipe], template: "<dx-popup id=\"popup\"\r\n [(visible)]=\"visible\"\r\n [height]=\"'400'\"\r\n [maxHeight]=\"400\"\r\n [width]=\"'650'\"\r\n shadingColor=\"rgba(0,0,0,0.4)\"\r\n contentTemplate=\"popup-content\"\r\n [showCloseButton]=\"true\"\r\n [title]=\"popupTitle\"\r\n (onHiding)=\"onPopupClose()\"\r\n (visibleChange)=\"visibleChange.emit($event)\">\r\n\r\n <div class=\"text-dark\" *dxTemplate=\"let data of 'popup-content'\">\r\n <dx-scroll-view #upcomingEventsScrollView\r\n id=\"upcomingEventsScrollView\"\r\n [scrollByContent]=\"true\"\r\n [scrollByThumb]=\"true\"\r\n [showScrollbar]=\"'onScroll'\"\r\n [bounceEnabled]=\"false\">\r\n\r\n @if (hasBirthdays || hasHolidays) {\r\n <hr-event-tab-bar [selectedType]=\"selectedEventType\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [tabSelectedClass]=\"tabSelectedClass\"\r\n [tabNotSelectedClass]=\"tabNotSelectedClass\"\r\n [tabTextSelectedClass]=\"tabTextSelectedClass\"\r\n [tabTextNotSelectedClass]=\"tabTextNotSelectedClass\"\r\n [containerClass]=\"tabContainerClass\"\r\n [tabItemClass]=\"tabItemClass\"\r\n [tabTextClass]=\"tabTextClass\"\r\n [tabIconClass]=\"tabIconClass\"\r\n (tabSelected)=\"onTabSelected($event)\">\r\n </hr-event-tab-bar>\r\n\r\n <hr-event-item [events]=\"events\"\r\n [showDates]=\"true\"\r\n [showProperty]=\"showProperty\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [selectedEventType]=\"selectedEventType\"\r\n [weekendWarningDescription]=\"weekendWarningDescription\"\r\n [eventIconClass]=\"eventIconClass\"\r\n [eventNameBoldClass]=\"eventNameBoldClass\"\r\n [eventDescriptionClass]=\"eventDescriptionClass\"\r\n [propertyBadgeClass]=\"propertyBadgeClass\"\r\n [noEventsTextClass]=\"noEventsTextClass\"\r\n [warningTextClass]=\"warningTextClass\"\r\n [dateFormat]=\"dateFormat\">\r\n </hr-event-item>\r\n } @else {\r\n <div [class]=\"noEventsTextClass\">{{ 'NoEvents' | HRTranslate }}</div>\r\n }\r\n </dx-scroll-view>\r\n </div>\r\n</dx-popup>\r\n\r\n<dx-load-panel shadingColor=\"rgba(0,0,0,0.4)\"\r\n [visible]=\"isLoading\"\r\n [showIndicator]=\"true\" [showPane]=\"true\"\r\n [shading]=\"true\" [hideOnOutsideClick]=\"false\">\r\n</dx-load-panel>\r\n" }]
|
|
691
735
|
}], propDecorators: { visible: [{
|
|
692
736
|
type: Input
|
|
693
737
|
}], events: [{
|
|
@@ -748,7 +792,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
|
|
|
748
792
|
|
|
749
793
|
class MyUpcomingEventsWidgetComponent {
|
|
750
794
|
http;
|
|
751
|
-
alertToastService;
|
|
752
795
|
baseUrl = '';
|
|
753
796
|
weekendWarningDescription = 'WeekendDayNotDefined';
|
|
754
797
|
selectedLanguage = 'en';
|
|
@@ -783,9 +826,8 @@ class MyUpcomingEventsWidgetComponent {
|
|
|
783
826
|
popupEvents = [];
|
|
784
827
|
popupVisible = false;
|
|
785
828
|
weekendWarning = null;
|
|
786
|
-
constructor(http
|
|
829
|
+
constructor(http) {
|
|
787
830
|
this.http = http;
|
|
788
|
-
this.alertToastService = alertToastService;
|
|
789
831
|
}
|
|
790
832
|
ngOnInit() {
|
|
791
833
|
this.loadEvents(EventOption.All);
|
|
@@ -834,9 +876,6 @@ class MyUpcomingEventsWidgetComponent {
|
|
|
834
876
|
},
|
|
835
877
|
error: (error) => {
|
|
836
878
|
this.isLoadingChanged.emit(false);
|
|
837
|
-
if (error.status == 401)
|
|
838
|
-
return;
|
|
839
|
-
this.alertToastService.toastInformation(error.error.ResponseData.Errors[0].Message, SkyAlertType.Error);
|
|
840
879
|
},
|
|
841
880
|
});
|
|
842
881
|
}
|
|
@@ -845,17 +884,17 @@ class MyUpcomingEventsWidgetComponent {
|
|
|
845
884
|
const holidays = source?.PublicHolidays || [];
|
|
846
885
|
let filtered;
|
|
847
886
|
if (eventType === EventTypeEnum.Birthdays) {
|
|
848
|
-
filtered = birthdays.map(b => this.mapBirthday(b));
|
|
887
|
+
filtered = birthdays.map(b => this.mapBirthday(b)).sort((a, b) => new Date(a.EventDate).getTime() - new Date(b.EventDate).getTime());
|
|
849
888
|
}
|
|
850
889
|
else if (eventType === EventTypeEnum.PublicHolidays) {
|
|
851
|
-
filtered = holidays.map(h => this.mapHoliday(h));
|
|
890
|
+
filtered = holidays.map(h => this.mapHoliday(h)).sort((a, b) => new Date(a.EventDate).getTime() - new Date(b.EventDate).getTime());
|
|
852
891
|
}
|
|
853
892
|
else {
|
|
854
893
|
if (limit) {
|
|
855
894
|
filtered = [
|
|
856
|
-
...birthdays.map(b => this.mapBirthday(b))
|
|
857
|
-
...holidays.map(h => this.mapHoliday(h))
|
|
858
|
-
];
|
|
895
|
+
...birthdays.map(b => this.mapBirthday(b)),
|
|
896
|
+
...holidays.map(h => this.mapHoliday(h))
|
|
897
|
+
].sort((a, b) => new Date(a.EventDate).getTime() - new Date(b.EventDate).getTime()).slice(0, 2);
|
|
859
898
|
}
|
|
860
899
|
else {
|
|
861
900
|
filtered = [
|
|
@@ -892,13 +931,13 @@ class MyUpcomingEventsWidgetComponent {
|
|
|
892
931
|
Description: h.WeekContext.toString()
|
|
893
932
|
};
|
|
894
933
|
}
|
|
895
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
896
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
934
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: MyUpcomingEventsWidgetComponent, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Component });
|
|
935
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: MyUpcomingEventsWidgetComponent, isStandalone: true, selector: "hr-my-upcoming-events-widget", inputs: { baseUrl: "baseUrl", weekendWarningDescription: "weekendWarningDescription", selectedLanguage: "selectedLanguage", showProperty: "showProperty", cardClass: "cardClass", noEventsTextClass: "noEventsTextClass", viewAllLinkClass: "viewAllLinkClass", viewAllContainerClass: "viewAllContainerClass", warningTextClass: "warningTextClass", tabSelectedClass: "tabSelectedClass", tabNotSelectedClass: "tabNotSelectedClass", tabTextSelectedClass: "tabTextSelectedClass", tabTextNotSelectedClass: "tabTextNotSelectedClass", tabContainerClass: "tabContainerClass", tabItemClass: "tabItemClass", tabTextClass: "tabTextClass", tabIconClass: "tabIconClass", eventIconClass: "eventIconClass", eventNameBoldClass: "eventNameBoldClass", eventDescriptionClass: "eventDescriptionClass", propertyBadgeClass: "propertyBadgeClass", dateFormat: "dateFormat", externalViewAll: "externalViewAll" }, outputs: { isLoadingChanged: "isLoadingChanged", viewAllClicked: "viewAllClicked" }, ngImport: i0, template: "<!-- Card View -->\r\n<div [class]=\"cardClass\">\r\n <hr-card-header [icon]=\"calendarStar\" [title]=\"'UpcomingEvents' | HRTranslate\"></hr-card-header>\r\n\r\n @if (birthdays.length > 0 || holidays.length > 0) {\r\n <hr-event-tab-bar\r\n [selectedType]=\"selectedEventType\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [tabSelectedClass]=\"tabSelectedClass\"\r\n [tabNotSelectedClass]=\"tabNotSelectedClass\"\r\n [tabTextSelectedClass]=\"tabTextSelectedClass\"\r\n [tabTextNotSelectedClass]=\"tabTextNotSelectedClass\"\r\n [containerClass]=\"tabContainerClass\"\r\n [tabItemClass]=\"tabItemClass\"\r\n [tabTextClass]=\"tabTextClass\"\r\n [tabIconClass]=\"tabIconClass\"\r\n (tabSelected)=\"onTabClick($event)\">\r\n </hr-event-tab-bar>\r\n\r\n <hr-event-item\r\n [events]=\"filteredEvents\"\r\n [showDates]=\"false\"\r\n [showProperty]=\"showProperty\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [selectedEventType]=\"selectedEventType\"\r\n [weekendWarningDescription]=\"weekendWarning\"\r\n [eventIconClass]=\"eventIconClass\"\r\n [eventNameBoldClass]=\"eventNameBoldClass\"\r\n [eventDescriptionClass]=\"eventDescriptionClass\"\r\n [propertyBadgeClass]=\"propertyBadgeClass\"\r\n [noEventsTextClass]=\"noEventsTextClass\"\r\n [warningTextClass]=\"warningTextClass\"\r\n [dateFormat]=\"dateFormat\">\r\n </hr-event-item>\r\n\r\n <div [class]=\"viewAllContainerClass\">\r\n <a [class]=\"viewAllLinkClass\" (click)=\"showPopup()\">{{ 'ViewAll' | HRTranslate }}</a>\r\n </div>\r\n } @else {\r\n <div [class]=\"noEventsTextClass\">{{ 'NoEvents' | HRTranslate }}</div>\r\n }\r\n</div>\r\n\r\n<!-- Popup -->\r\n<hr-upcoming-events-popup\r\n [visible]=\"popupVisible\"\r\n [events]=\"popupEvents\"\r\n [hasBirthdays]=\"birthdays.length > 0\"\r\n [hasHolidays]=\"holidays.length > 0\"\r\n [isLoading]=\"false\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [showProperty]=\"showProperty\"\r\n [weekendWarningDescription]=\"weekendWarning\"\r\n [popupTitle]=\"'UpcomingEvents' | HRTranslate\"\r\n [selectedEventType]=\"selectedPopupEventType\"\r\n [tabSelectedClass]=\"tabSelectedClass\"\r\n [tabNotSelectedClass]=\"tabNotSelectedClass\"\r\n [tabTextSelectedClass]=\"tabTextSelectedClass\"\r\n [tabTextNotSelectedClass]=\"tabTextNotSelectedClass\"\r\n [tabContainerClass]=\"tabContainerClass\"\r\n [tabItemClass]=\"tabItemClass\"\r\n [tabTextClass]=\"tabTextClass\"\r\n [tabIconClass]=\"tabIconClass\"\r\n [eventIconClass]=\"eventIconClass\"\r\n [eventNameBoldClass]=\"eventNameBoldClass\"\r\n [eventDescriptionClass]=\"eventDescriptionClass\"\r\n [propertyBadgeClass]=\"propertyBadgeClass\"\r\n [noEventsTextClass]=\"noEventsTextClass\"\r\n [warningTextClass]=\"warningTextClass\"\r\n [dateFormat]=\"dateFormat\"\r\n (visibleChange)=\"popupVisible = $event\"\r\n (tabSelected)=\"onPopupTabClick($event)\"\r\n (closed)=\"onPopupClose()\">\r\n</hr-upcoming-events-popup>\r\n", dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: HRCardHeaderComponent, selector: "hr-card-header", inputs: ["icon", "title", "containerClass", "iconClass", "titleClass"] }, { kind: "component", type: HREventItemComponent, selector: "hr-event-item", inputs: ["events", "showDates", "showProperty", "selectedLanguage", "selectedEventType", "weekendWarningDescription", "eventIconClass", "eventNameBoldClass", "eventDescriptionClass", "propertyBadgeClass", "noEventsTextClass", "warningTextClass", "dateFormat"] }, { kind: "component", type: HREventTabBarComponent, selector: "hr-event-tab-bar", inputs: ["selectedType", "selectedLanguage", "tabSelectedClass", "tabNotSelectedClass", "tabTextSelectedClass", "tabTextNotSelectedClass", "containerClass", "tabItemClass", "tabTextClass", "tabIconClass"], outputs: ["tabSelected"] }, { kind: "component", type: HREventsPopupComponent, selector: "hr-upcoming-events-popup", inputs: ["visible", "events", "hasBirthdays", "hasHolidays", "isLoading", "selectedLanguage", "showProperty", "weekendWarningDescription", "popupTitle", "selectedEventType", "tabSelectedClass", "tabNotSelectedClass", "tabTextSelectedClass", "tabTextNotSelectedClass", "tabContainerClass", "tabItemClass", "tabTextClass", "tabIconClass", "eventIconClass", "eventNameBoldClass", "eventDescriptionClass", "propertyBadgeClass", "noEventsTextClass", "warningTextClass", "dateFormat"], outputs: ["visibleChange", "tabSelected", "closed"] }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }] });
|
|
897
936
|
}
|
|
898
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
937
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: MyUpcomingEventsWidgetComponent, decorators: [{
|
|
899
938
|
type: Component,
|
|
900
|
-
args: [{ selector: 'hr-my-upcoming-events-widget', standalone: true, imports: [FontAwesomeModule,
|
|
901
|
-
}], ctorParameters: () => [{ type: i1.HttpClient }
|
|
939
|
+
args: [{ selector: 'hr-my-upcoming-events-widget', standalone: true, imports: [FontAwesomeModule, HRCardHeaderComponent, HREventItemComponent, HREventTabBarComponent, HREventsPopupComponent, HRTranslatePipe], template: "<!-- Card View -->\r\n<div [class]=\"cardClass\">\r\n <hr-card-header [icon]=\"calendarStar\" [title]=\"'UpcomingEvents' | HRTranslate\"></hr-card-header>\r\n\r\n @if (birthdays.length > 0 || holidays.length > 0) {\r\n <hr-event-tab-bar\r\n [selectedType]=\"selectedEventType\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [tabSelectedClass]=\"tabSelectedClass\"\r\n [tabNotSelectedClass]=\"tabNotSelectedClass\"\r\n [tabTextSelectedClass]=\"tabTextSelectedClass\"\r\n [tabTextNotSelectedClass]=\"tabTextNotSelectedClass\"\r\n [containerClass]=\"tabContainerClass\"\r\n [tabItemClass]=\"tabItemClass\"\r\n [tabTextClass]=\"tabTextClass\"\r\n [tabIconClass]=\"tabIconClass\"\r\n (tabSelected)=\"onTabClick($event)\">\r\n </hr-event-tab-bar>\r\n\r\n <hr-event-item\r\n [events]=\"filteredEvents\"\r\n [showDates]=\"false\"\r\n [showProperty]=\"showProperty\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [selectedEventType]=\"selectedEventType\"\r\n [weekendWarningDescription]=\"weekendWarning\"\r\n [eventIconClass]=\"eventIconClass\"\r\n [eventNameBoldClass]=\"eventNameBoldClass\"\r\n [eventDescriptionClass]=\"eventDescriptionClass\"\r\n [propertyBadgeClass]=\"propertyBadgeClass\"\r\n [noEventsTextClass]=\"noEventsTextClass\"\r\n [warningTextClass]=\"warningTextClass\"\r\n [dateFormat]=\"dateFormat\">\r\n </hr-event-item>\r\n\r\n <div [class]=\"viewAllContainerClass\">\r\n <a [class]=\"viewAllLinkClass\" (click)=\"showPopup()\">{{ 'ViewAll' | HRTranslate }}</a>\r\n </div>\r\n } @else {\r\n <div [class]=\"noEventsTextClass\">{{ 'NoEvents' | HRTranslate }}</div>\r\n }\r\n</div>\r\n\r\n<!-- Popup -->\r\n<hr-upcoming-events-popup\r\n [visible]=\"popupVisible\"\r\n [events]=\"popupEvents\"\r\n [hasBirthdays]=\"birthdays.length > 0\"\r\n [hasHolidays]=\"holidays.length > 0\"\r\n [isLoading]=\"false\"\r\n [selectedLanguage]=\"selectedLanguage\"\r\n [showProperty]=\"showProperty\"\r\n [weekendWarningDescription]=\"weekendWarning\"\r\n [popupTitle]=\"'UpcomingEvents' | HRTranslate\"\r\n [selectedEventType]=\"selectedPopupEventType\"\r\n [tabSelectedClass]=\"tabSelectedClass\"\r\n [tabNotSelectedClass]=\"tabNotSelectedClass\"\r\n [tabTextSelectedClass]=\"tabTextSelectedClass\"\r\n [tabTextNotSelectedClass]=\"tabTextNotSelectedClass\"\r\n [tabContainerClass]=\"tabContainerClass\"\r\n [tabItemClass]=\"tabItemClass\"\r\n [tabTextClass]=\"tabTextClass\"\r\n [tabIconClass]=\"tabIconClass\"\r\n [eventIconClass]=\"eventIconClass\"\r\n [eventNameBoldClass]=\"eventNameBoldClass\"\r\n [eventDescriptionClass]=\"eventDescriptionClass\"\r\n [propertyBadgeClass]=\"propertyBadgeClass\"\r\n [noEventsTextClass]=\"noEventsTextClass\"\r\n [warningTextClass]=\"warningTextClass\"\r\n [dateFormat]=\"dateFormat\"\r\n (visibleChange)=\"popupVisible = $event\"\r\n (tabSelected)=\"onPopupTabClick($event)\"\r\n (closed)=\"onPopupClose()\">\r\n</hr-upcoming-events-popup>\r\n" }]
|
|
940
|
+
}], ctorParameters: () => [{ type: i1.HttpClient }], propDecorators: { baseUrl: [{
|
|
902
941
|
type: Input
|
|
903
942
|
}], weekendWarningDescription: [{
|
|
904
943
|
type: Input
|
|
@@ -950,6 +989,346 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
|
|
|
950
989
|
type: Input
|
|
951
990
|
}] } });
|
|
952
991
|
|
|
992
|
+
class HRCommonMethodsService {
|
|
993
|
+
calculateDaysDifference(dateOne, dateTwo) {
|
|
994
|
+
const resetTime = (inputDate) => {
|
|
995
|
+
const newDate = new Date(inputDate);
|
|
996
|
+
newDate.setHours(0, 0, 0, 0);
|
|
997
|
+
return newDate;
|
|
998
|
+
};
|
|
999
|
+
const firstDate = resetTime(new Date(dateOne));
|
|
1000
|
+
const secondDate = resetTime(new Date(dateTwo));
|
|
1001
|
+
return (firstDate.getTime() - secondDate.getTime()) / (1000 * 60 * 60 * 24);
|
|
1002
|
+
}
|
|
1003
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HRCommonMethodsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1004
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HRCommonMethodsService, providedIn: 'root' });
|
|
1005
|
+
}
|
|
1006
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HRCommonMethodsService, decorators: [{
|
|
1007
|
+
type: Injectable,
|
|
1008
|
+
args: [{
|
|
1009
|
+
providedIn: 'root',
|
|
1010
|
+
}]
|
|
1011
|
+
}] });
|
|
1012
|
+
|
|
1013
|
+
class HREmployeeCalendarComponent {
|
|
1014
|
+
calendar;
|
|
1015
|
+
showEvents = false;
|
|
1016
|
+
showUpComingVacations = false;
|
|
1017
|
+
scheduleCalenderVacation = [];
|
|
1018
|
+
minDate = new Date();
|
|
1019
|
+
maxDate = new Date();
|
|
1020
|
+
legendContainerClass = 'row mb-2';
|
|
1021
|
+
legendRowClass = 'd-flex';
|
|
1022
|
+
legendItemClass = 'd-flex align-items-center';
|
|
1023
|
+
legendDotClass = 'me-1 circle-sm';
|
|
1024
|
+
legendLabelClass = 'me-1 fs-12';
|
|
1025
|
+
publicHolidayDotClass = 'bg-accent';
|
|
1026
|
+
dayOffDotClass = 'bg-yellow';
|
|
1027
|
+
eventsDotClass = 'bg-primary';
|
|
1028
|
+
vacationsContainerClass = 'd-flex mt-3';
|
|
1029
|
+
vacationsItemClass = 'd-flex align-items-center';
|
|
1030
|
+
vacationsIconClass = 'fs-8 me-1';
|
|
1031
|
+
calendarContainerClass = 'row mt-2 col-12';
|
|
1032
|
+
calendarClass = 'button-boeder-none';
|
|
1033
|
+
squreCheckIcon = faCircle;
|
|
1034
|
+
DaysOffVacationTypes = ScheduleVacationTypes.DaysOff;
|
|
1035
|
+
PublicHolidaysVacationTypes = ScheduleVacationTypes.PublicHoliday;
|
|
1036
|
+
commonMethods = inject(HRCommonMethodsService);
|
|
1037
|
+
customCellTemplate = (cellData) => {
|
|
1038
|
+
if (cellData.view != 'month') {
|
|
1039
|
+
return this.createDateSpan(cellData);
|
|
1040
|
+
}
|
|
1041
|
+
const cellDate = cellData.date;
|
|
1042
|
+
let matchedVacation = this.scheduleCalenderVacation.find((vacation) => this.isDateInPeriod(cellDate, vacation.VacationDays));
|
|
1043
|
+
let matchedOffOrPublicHolidayBullet = this.scheduleCalenderVacation.find((vacation) => this.isDateInPeriod(cellDate, vacation.VacationDays) && vacation.VacationType != ScheduleVacationTypes.Vacations && vacation.VacationType != ScheduleVacationTypes.AddedVacations);
|
|
1044
|
+
if (matchedVacation) {
|
|
1045
|
+
if (this.commonMethods.calculateDaysDifference(matchedVacation.VacationDays.EndDate, matchedVacation.VacationDays.StartDate) === 0) {
|
|
1046
|
+
return this.createDateSpan(cellData, matchedVacation, matchedOffOrPublicHolidayBullet, false, false, false);
|
|
1047
|
+
}
|
|
1048
|
+
let isStartRange = this.commonMethods.calculateDaysDifference(cellDate, matchedVacation.VacationDays.StartDate) === 0;
|
|
1049
|
+
let isEndRange = this.commonMethods.calculateDaysDifference(matchedVacation.VacationDays.EndDate, cellDate) === 0;
|
|
1050
|
+
return this.createDateSpan(cellData, matchedVacation, matchedOffOrPublicHolidayBullet, true, isStartRange, isEndRange);
|
|
1051
|
+
}
|
|
1052
|
+
return this.createDateSpan(cellData);
|
|
1053
|
+
};
|
|
1054
|
+
createDateSpan = (cellData, matchedVacation = undefined, matchedOffOrPublicHolidayBullet = undefined, isInRange = false, isStartRange = false, isEndRange = false) => {
|
|
1055
|
+
const offDayOrPublicHolidaySpan = document.createElement('span');
|
|
1056
|
+
const cellElement = document.createElement('span');
|
|
1057
|
+
cellElement.textContent = cellData.text;
|
|
1058
|
+
cellElement.style.backgroundColor = '';
|
|
1059
|
+
cellElement.style.borderRadius = '15px';
|
|
1060
|
+
cellElement.style.borderWidth = '0';
|
|
1061
|
+
cellElement.style.fontSize = '10px';
|
|
1062
|
+
cellElement.style.margin = '0';
|
|
1063
|
+
cellElement.style.padding = '0';
|
|
1064
|
+
cellElement.style.alignContent = 'center';
|
|
1065
|
+
cellElement.style.position = 'relative';
|
|
1066
|
+
if (matchedVacation) {
|
|
1067
|
+
cellElement.title = matchedVacation.Description;
|
|
1068
|
+
if (matchedVacation.VacationType != ScheduleVacationTypes.DaysOff && matchedVacation.VacationType != ScheduleVacationTypes.PublicHoliday && matchedVacation.VacationType != ScheduleVacationTypes.Events) {
|
|
1069
|
+
if (matchedVacation.Color) {
|
|
1070
|
+
cellElement.style.backgroundColor = (matchedVacation.Color + '99');
|
|
1071
|
+
cellElement.style.color = '#FFFFFF';
|
|
1072
|
+
}
|
|
1073
|
+
else {
|
|
1074
|
+
cellElement.style.backgroundColor = '#DCDCDC';
|
|
1075
|
+
cellElement.style.color = '#000000';
|
|
1076
|
+
}
|
|
1077
|
+
if (isInRange) {
|
|
1078
|
+
cellElement.style.width = '100%';
|
|
1079
|
+
cellElement.style.alignContent = 'start';
|
|
1080
|
+
if (isStartRange) {
|
|
1081
|
+
cellElement.style.borderEndEndRadius = '0px';
|
|
1082
|
+
cellElement.style.borderStartEndRadius = '0px';
|
|
1083
|
+
}
|
|
1084
|
+
if (isEndRange) {
|
|
1085
|
+
cellElement.style.borderStartStartRadius = '0px';
|
|
1086
|
+
cellElement.style.borderEndStartRadius = '0px';
|
|
1087
|
+
}
|
|
1088
|
+
if (!isStartRange && !isEndRange)
|
|
1089
|
+
cellElement.style.borderRadius = '0px';
|
|
1090
|
+
}
|
|
1091
|
+
}
|
|
1092
|
+
}
|
|
1093
|
+
if (matchedOffOrPublicHolidayBullet) {
|
|
1094
|
+
offDayOrPublicHolidaySpan.style.width = '8px';
|
|
1095
|
+
offDayOrPublicHolidaySpan.style.height = '8px';
|
|
1096
|
+
offDayOrPublicHolidaySpan.className = 'rounded rounded-circle';
|
|
1097
|
+
offDayOrPublicHolidaySpan.style.position = 'absolute';
|
|
1098
|
+
offDayOrPublicHolidaySpan.style.opacity = '1';
|
|
1099
|
+
offDayOrPublicHolidaySpan.style.top = '-5px';
|
|
1100
|
+
offDayOrPublicHolidaySpan.style.right = '0';
|
|
1101
|
+
offDayOrPublicHolidaySpan.title = matchedOffOrPublicHolidayBullet.Description;
|
|
1102
|
+
if (matchedVacation) {
|
|
1103
|
+
if (matchedVacation.VacationType != ScheduleVacationTypes.DaysOff && matchedVacation.VacationType != ScheduleVacationTypes.PublicHoliday && matchedVacation.VacationType != ScheduleVacationTypes.Events) {
|
|
1104
|
+
if (isInRange) {
|
|
1105
|
+
offDayOrPublicHolidaySpan.style.right = '8px';
|
|
1106
|
+
}
|
|
1107
|
+
}
|
|
1108
|
+
}
|
|
1109
|
+
offDayOrPublicHolidaySpan.style.background = matchedOffOrPublicHolidayBullet.Color || '';
|
|
1110
|
+
offDayOrPublicHolidaySpan.style.marginTop = '2px';
|
|
1111
|
+
cellElement.appendChild(offDayOrPublicHolidaySpan);
|
|
1112
|
+
}
|
|
1113
|
+
return cellElement;
|
|
1114
|
+
};
|
|
1115
|
+
isDateInPeriod(date, period) {
|
|
1116
|
+
if (this.commonMethods.calculateDaysDifference(date, period.StartDate) == 0)
|
|
1117
|
+
return true;
|
|
1118
|
+
if (this.commonMethods.calculateDaysDifference(date, period.EndDate) == 0)
|
|
1119
|
+
return true;
|
|
1120
|
+
let daysDifferenceWithStartDate = this.commonMethods.calculateDaysDifference(date, period.StartDate);
|
|
1121
|
+
let daysDifferenceWithEndDate = this.commonMethods.calculateDaysDifference(period.EndDate, date);
|
|
1122
|
+
if (daysDifferenceWithStartDate < 0 || daysDifferenceWithEndDate < 0)
|
|
1123
|
+
return false;
|
|
1124
|
+
return true;
|
|
1125
|
+
}
|
|
1126
|
+
resetCalenderCurrentDate(currentDate = new Date()) {
|
|
1127
|
+
this.calendar.instance.option('currentDate', currentDate);
|
|
1128
|
+
}
|
|
1129
|
+
preventInteraction(event) {
|
|
1130
|
+
event.component.option('value', null);
|
|
1131
|
+
}
|
|
1132
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HREmployeeCalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1133
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: HREmployeeCalendarComponent, isStandalone: true, selector: "hr-employee-calendar", inputs: { showEvents: "showEvents", showUpComingVacations: "showUpComingVacations", scheduleCalenderVacation: "scheduleCalenderVacation", minDate: "minDate", maxDate: "maxDate", legendContainerClass: "legendContainerClass", legendRowClass: "legendRowClass", legendItemClass: "legendItemClass", legendDotClass: "legendDotClass", legendLabelClass: "legendLabelClass", publicHolidayDotClass: "publicHolidayDotClass", dayOffDotClass: "dayOffDotClass", eventsDotClass: "eventsDotClass", vacationsContainerClass: "vacationsContainerClass", vacationsItemClass: "vacationsItemClass", vacationsIconClass: "vacationsIconClass", calendarContainerClass: "calendarContainerClass", calendarClass: "calendarClass" }, viewQueries: [{ propertyName: "calendar", first: true, predicate: ["calendar"], descendants: true }], ngImport: i0, template: "<div [class]=\"legendContainerClass\">\r\n <div [class]=\"legendRowClass\">\r\n <div [class]=\"legendItemClass + ' me-4'\">\r\n <div [class]=\"legendDotClass + ' ' + publicHolidayDotClass\"></div>\r\n <div [class]=\"legendLabelClass\"><p>{{'PublicHoliday' | HRTranslate}}</p></div>\r\n </div>\r\n <div [class]=\"legendItemClass\">\r\n <div [class]=\"legendDotClass + ' ' + dayOffDotClass\"></div>\r\n <div [class]=\"legendLabelClass\"><p>{{'DayOff' | HRTranslate}}</p></div>\r\n </div>\r\n @if(showEvents){\r\n <div [class]=\"legendItemClass + ' ms-4'\">\r\n <div [class]=\"legendDotClass + ' ' + eventsDotClass\"></div>\r\n <div [class]=\"legendLabelClass\"><p>{{'Events' | HRTranslate}}</p></div>\r\n </div>\r\n }\r\n </div>\r\n @if(showUpComingVacations){\r\n <div [class]=\"vacationsContainerClass\">\r\n <div [class]=\"vacationsItemClass\">\r\n <fa-icon [icon]=\"squreCheckIcon\" [class]=\"vacationsIconClass\"></fa-icon>\r\n <div [class]=\"legendLabelClass\"><p>{{'ScheduledVacations' | HRTranslate}}</p></div>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n\r\n <div [class]=\"calendarContainerClass\">\r\n <dx-calendar #calendar [class]=\"calendarClass\" [selectionMode]=\"'multiple'\"\r\n [cellTemplate]=\"customCellTemplate\"\r\n [showWeekNumbers]=\"false\"\r\n [min]=\"minDate\"\r\n [max]=\"maxDate\"\r\n (onValueChanged)=\"preventInteraction($event)\">\r\n </dx-calendar>\r\n </div>\r\n", dependencies: [{ kind: "ngmodule", type: DxCalendarModule }, { kind: "component", type: i1$1.DxCalendarComponent, selector: "dx-calendar", inputs: ["accessKey", "activeStateEnabled", "cellTemplate", "dateSerializationFormat", "disabled", "disabledDates", "elementAttr", "firstDayOfWeek", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "isDirty", "isValid", "max", "maxZoomLevel", "min", "minZoomLevel", "name", "readOnly", "rtlEnabled", "selectionMode", "selectWeekOnClick", "showTodayButton", "showWeekNumbers", "tabIndex", "validationError", "validationErrors", "validationMessageMode", "validationMessagePosition", "validationStatus", "value", "visible", "weekNumberRule", "width", "zoomLevel"], outputs: ["onDisposing", "onInitialized", "onOptionChanged", "onValueChanged", "accessKeyChange", "activeStateEnabledChange", "cellTemplateChange", "dateSerializationFormatChange", "disabledChange", "disabledDatesChange", "elementAttrChange", "firstDayOfWeekChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "isDirtyChange", "isValidChange", "maxChange", "maxZoomLevelChange", "minChange", "minZoomLevelChange", "nameChange", "readOnlyChange", "rtlEnabledChange", "selectionModeChange", "selectWeekOnClickChange", "showTodayButtonChange", "showWeekNumbersChange", "tabIndexChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationMessagePositionChange", "validationStatusChange", "valueChange", "visibleChange", "weekNumberRuleChange", "widthChange", "zoomLevelChange", "onBlur"] }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1$2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }] });
|
|
1134
|
+
}
|
|
1135
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HREmployeeCalendarComponent, decorators: [{
|
|
1136
|
+
type: Component,
|
|
1137
|
+
args: [{ standalone: true, selector: 'hr-employee-calendar', imports: [DxCalendarModule, HRTranslatePipe, FontAwesomeModule], template: "<div [class]=\"legendContainerClass\">\r\n <div [class]=\"legendRowClass\">\r\n <div [class]=\"legendItemClass + ' me-4'\">\r\n <div [class]=\"legendDotClass + ' ' + publicHolidayDotClass\"></div>\r\n <div [class]=\"legendLabelClass\"><p>{{'PublicHoliday' | HRTranslate}}</p></div>\r\n </div>\r\n <div [class]=\"legendItemClass\">\r\n <div [class]=\"legendDotClass + ' ' + dayOffDotClass\"></div>\r\n <div [class]=\"legendLabelClass\"><p>{{'DayOff' | HRTranslate}}</p></div>\r\n </div>\r\n @if(showEvents){\r\n <div [class]=\"legendItemClass + ' ms-4'\">\r\n <div [class]=\"legendDotClass + ' ' + eventsDotClass\"></div>\r\n <div [class]=\"legendLabelClass\"><p>{{'Events' | HRTranslate}}</p></div>\r\n </div>\r\n }\r\n </div>\r\n @if(showUpComingVacations){\r\n <div [class]=\"vacationsContainerClass\">\r\n <div [class]=\"vacationsItemClass\">\r\n <fa-icon [icon]=\"squreCheckIcon\" [class]=\"vacationsIconClass\"></fa-icon>\r\n <div [class]=\"legendLabelClass\"><p>{{'ScheduledVacations' | HRTranslate}}</p></div>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n\r\n <div [class]=\"calendarContainerClass\">\r\n <dx-calendar #calendar [class]=\"calendarClass\" [selectionMode]=\"'multiple'\"\r\n [cellTemplate]=\"customCellTemplate\"\r\n [showWeekNumbers]=\"false\"\r\n [min]=\"minDate\"\r\n [max]=\"maxDate\"\r\n (onValueChanged)=\"preventInteraction($event)\">\r\n </dx-calendar>\r\n </div>\r\n" }]
|
|
1138
|
+
}], propDecorators: { calendar: [{
|
|
1139
|
+
type: ViewChild,
|
|
1140
|
+
args: ['calendar']
|
|
1141
|
+
}], showEvents: [{
|
|
1142
|
+
type: Input
|
|
1143
|
+
}], showUpComingVacations: [{
|
|
1144
|
+
type: Input
|
|
1145
|
+
}], scheduleCalenderVacation: [{
|
|
1146
|
+
type: Input
|
|
1147
|
+
}], minDate: [{
|
|
1148
|
+
type: Input
|
|
1149
|
+
}], maxDate: [{
|
|
1150
|
+
type: Input
|
|
1151
|
+
}], legendContainerClass: [{
|
|
1152
|
+
type: Input
|
|
1153
|
+
}], legendRowClass: [{
|
|
1154
|
+
type: Input
|
|
1155
|
+
}], legendItemClass: [{
|
|
1156
|
+
type: Input
|
|
1157
|
+
}], legendDotClass: [{
|
|
1158
|
+
type: Input
|
|
1159
|
+
}], legendLabelClass: [{
|
|
1160
|
+
type: Input
|
|
1161
|
+
}], publicHolidayDotClass: [{
|
|
1162
|
+
type: Input
|
|
1163
|
+
}], dayOffDotClass: [{
|
|
1164
|
+
type: Input
|
|
1165
|
+
}], eventsDotClass: [{
|
|
1166
|
+
type: Input
|
|
1167
|
+
}], vacationsContainerClass: [{
|
|
1168
|
+
type: Input
|
|
1169
|
+
}], vacationsItemClass: [{
|
|
1170
|
+
type: Input
|
|
1171
|
+
}], vacationsIconClass: [{
|
|
1172
|
+
type: Input
|
|
1173
|
+
}], calendarContainerClass: [{
|
|
1174
|
+
type: Input
|
|
1175
|
+
}], calendarClass: [{
|
|
1176
|
+
type: Input
|
|
1177
|
+
}] } });
|
|
1178
|
+
|
|
1179
|
+
class HRMyCalendarWidgetComponent {
|
|
1180
|
+
http;
|
|
1181
|
+
baseUrl = '';
|
|
1182
|
+
headerContainerClass = '';
|
|
1183
|
+
isLoadingChanged = new EventEmitter();
|
|
1184
|
+
calendarIcon = faCalendarDays;
|
|
1185
|
+
legendContainerClass = 'row mb-2';
|
|
1186
|
+
legendRowClass = 'd-flex';
|
|
1187
|
+
legendItemClass = 'd-flex align-items-center';
|
|
1188
|
+
legendDotClass = 'me-1 circle-sm';
|
|
1189
|
+
legendLabelClass = 'me-1 fs-12';
|
|
1190
|
+
publicHolidayDotClass = 'bg-accent';
|
|
1191
|
+
dayOffDotClass = 'bg-yellow';
|
|
1192
|
+
eventsDotClass = 'bg-primary';
|
|
1193
|
+
vacationsContainerClass = 'd-flex mt-3';
|
|
1194
|
+
vacationsItemClass = 'd-flex align-items-center';
|
|
1195
|
+
vacationsIconClass = 'fs-8 me-1';
|
|
1196
|
+
calendarContainerClass = 'row mt-2 col-12';
|
|
1197
|
+
calendarClass = 'button-boeder-none';
|
|
1198
|
+
constants = inject(HRConstantsService);
|
|
1199
|
+
translatePipe = inject(HRTranslatePipe);
|
|
1200
|
+
publicHolidayColor = this.constants.defaultPublicHolidayColor;
|
|
1201
|
+
dayOffColor = this.constants.defaultDayOffColor;
|
|
1202
|
+
eventsColor = this.constants.defaultEventsColor;
|
|
1203
|
+
hrCalendar;
|
|
1204
|
+
scheduleCalenderVacation = [];
|
|
1205
|
+
minDate = new Date();
|
|
1206
|
+
maxDate;
|
|
1207
|
+
constructor(http) {
|
|
1208
|
+
this.http = http;
|
|
1209
|
+
const currentDate = moment().date(1).subtract(1, 'month');
|
|
1210
|
+
this.minDate = new Date(currentDate.year(), currentDate.month(), currentDate.date());
|
|
1211
|
+
this.maxDate = new Date(this.minDate.getFullYear() + 1, this.minDate.getMonth() + 1, 0);
|
|
1212
|
+
}
|
|
1213
|
+
ngOnInit() {
|
|
1214
|
+
this.loadCalendar();
|
|
1215
|
+
}
|
|
1216
|
+
getCalendar(month, year, monthsCount) {
|
|
1217
|
+
const params = new HttpParams()
|
|
1218
|
+
.set('Month', month)
|
|
1219
|
+
.set('Year', year)
|
|
1220
|
+
.set('MonthsCount', monthsCount);
|
|
1221
|
+
return this.http.get(`${this.baseUrl}/hr/employee-portal/calendar`, {
|
|
1222
|
+
params,
|
|
1223
|
+
headers: { 'api-version': '2' }
|
|
1224
|
+
});
|
|
1225
|
+
}
|
|
1226
|
+
loadCalendar() {
|
|
1227
|
+
const currentDate = moment().date(1).subtract(1, 'month');
|
|
1228
|
+
const month = currentDate.month() === 0 ? 1 : currentDate.month() + 1;
|
|
1229
|
+
const year = currentDate.year();
|
|
1230
|
+
this.isLoadingChanged.emit(true);
|
|
1231
|
+
this.getCalendar(month, year, 12).subscribe({
|
|
1232
|
+
next: (response) => {
|
|
1233
|
+
this.isLoadingChanged.emit(false);
|
|
1234
|
+
this.mapCalendarData(response.ResponseData);
|
|
1235
|
+
},
|
|
1236
|
+
error: (error) => {
|
|
1237
|
+
this.isLoadingChanged.emit(false);
|
|
1238
|
+
},
|
|
1239
|
+
});
|
|
1240
|
+
}
|
|
1241
|
+
mapCalendarData(data) {
|
|
1242
|
+
const result = [];
|
|
1243
|
+
for (const v of data.Vacations) {
|
|
1244
|
+
result.push({
|
|
1245
|
+
VacationType: ScheduleVacationTypes.Vacations,
|
|
1246
|
+
Description: v.VacationTypeName,
|
|
1247
|
+
Color: v.Color,
|
|
1248
|
+
VacationDays: { StartDate: v.StartDate, EndDate: v.EndDate }
|
|
1249
|
+
});
|
|
1250
|
+
}
|
|
1251
|
+
for (const ph of data.PublicHolidays) {
|
|
1252
|
+
result.push({
|
|
1253
|
+
VacationType: ScheduleVacationTypes.PublicHoliday,
|
|
1254
|
+
Description: ph.Description,
|
|
1255
|
+
Color: this.publicHolidayColor,
|
|
1256
|
+
VacationDays: { StartDate: ph.StartDate, EndDate: ph.EndDate }
|
|
1257
|
+
});
|
|
1258
|
+
}
|
|
1259
|
+
for (const od of data.OffDays) {
|
|
1260
|
+
result.push({
|
|
1261
|
+
VacationType: ScheduleVacationTypes.DaysOff,
|
|
1262
|
+
Description: this.translatePipe.transform('DayOff'),
|
|
1263
|
+
Color: this.dayOffColor,
|
|
1264
|
+
VacationDays: { StartDate: od, EndDate: od }
|
|
1265
|
+
});
|
|
1266
|
+
}
|
|
1267
|
+
for (const ev of data.Events) {
|
|
1268
|
+
result.push({
|
|
1269
|
+
VacationType: ScheduleVacationTypes.Events,
|
|
1270
|
+
Description: ev.Description,
|
|
1271
|
+
Color: this.eventsColor,
|
|
1272
|
+
VacationDays: { StartDate: ev.StartDate, EndDate: ev.EndDate }
|
|
1273
|
+
});
|
|
1274
|
+
}
|
|
1275
|
+
this.scheduleCalenderVacation = result;
|
|
1276
|
+
setTimeout(() => {
|
|
1277
|
+
if (this.hrCalendar?.calendar) {
|
|
1278
|
+
this.hrCalendar.calendar.instance._refresh();
|
|
1279
|
+
this.hrCalendar.resetCalenderCurrentDate();
|
|
1280
|
+
}
|
|
1281
|
+
}, 100);
|
|
1282
|
+
}
|
|
1283
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HRMyCalendarWidgetComponent, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Component });
|
|
1284
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.21", type: HRMyCalendarWidgetComponent, isStandalone: true, selector: "hr-my-calendar-widget", inputs: { baseUrl: "baseUrl", headerContainerClass: "headerContainerClass", legendContainerClass: "legendContainerClass", legendRowClass: "legendRowClass", legendItemClass: "legendItemClass", legendDotClass: "legendDotClass", legendLabelClass: "legendLabelClass", publicHolidayDotClass: "publicHolidayDotClass", dayOffDotClass: "dayOffDotClass", eventsDotClass: "eventsDotClass", vacationsContainerClass: "vacationsContainerClass", vacationsItemClass: "vacationsItemClass", vacationsIconClass: "vacationsIconClass", calendarContainerClass: "calendarContainerClass", calendarClass: "calendarClass", publicHolidayColor: "publicHolidayColor", dayOffColor: "dayOffColor", eventsColor: "eventsColor" }, outputs: { isLoadingChanged: "isLoadingChanged" }, viewQueries: [{ propertyName: "hrCalendar", first: true, predicate: HREmployeeCalendarComponent, descendants: true }], ngImport: i0, template: "<hr-card-header\r\n [icon]=\"calendarIcon\"\r\n [title]=\"'Calendar' | HRTranslate\"\r\n [containerClass]=\"'d-flex align-items-center mb-3 ' + headerContainerClass\">\r\n</hr-card-header>\r\n<hr-employee-calendar\r\n [showEvents]=\"true\"\r\n [showUpComingVacations]=\"true\"\r\n [scheduleCalenderVacation]=\"scheduleCalenderVacation\"\r\n [minDate]=\"minDate\"\r\n [maxDate]=\"maxDate\"\r\n [legendContainerClass]=\"legendContainerClass\"\r\n [legendRowClass]=\"legendRowClass\"\r\n [legendItemClass]=\"legendItemClass\"\r\n [legendDotClass]=\"legendDotClass\"\r\n [legendLabelClass]=\"legendLabelClass\"\r\n [publicHolidayDotClass]=\"publicHolidayDotClass\"\r\n [dayOffDotClass]=\"dayOffDotClass\"\r\n [eventsDotClass]=\"eventsDotClass\"\r\n [vacationsContainerClass]=\"vacationsContainerClass\"\r\n [vacationsItemClass]=\"vacationsItemClass\"\r\n [vacationsIconClass]=\"vacationsIconClass\"\r\n [calendarContainerClass]=\"calendarContainerClass\"\r\n [calendarClass]=\"calendarClass\">\r\n</hr-employee-calendar>\r\n", dependencies: [{ kind: "component", type: HREmployeeCalendarComponent, selector: "hr-employee-calendar", inputs: ["showEvents", "showUpComingVacations", "scheduleCalenderVacation", "minDate", "maxDate", "legendContainerClass", "legendRowClass", "legendItemClass", "legendDotClass", "legendLabelClass", "publicHolidayDotClass", "dayOffDotClass", "eventsDotClass", "vacationsContainerClass", "vacationsItemClass", "vacationsIconClass", "calendarContainerClass", "calendarClass"] }, { kind: "component", type: HRCardHeaderComponent, selector: "hr-card-header", inputs: ["icon", "title", "containerClass", "iconClass", "titleClass"] }, { kind: "pipe", type: HRTranslatePipe, name: "HRTranslate" }] });
|
|
1285
|
+
}
|
|
1286
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: HRMyCalendarWidgetComponent, decorators: [{
|
|
1287
|
+
type: Component,
|
|
1288
|
+
args: [{ standalone: true, selector: 'hr-my-calendar-widget', imports: [HREmployeeCalendarComponent, HRCardHeaderComponent, HRTranslatePipe], template: "<hr-card-header\r\n [icon]=\"calendarIcon\"\r\n [title]=\"'Calendar' | HRTranslate\"\r\n [containerClass]=\"'d-flex align-items-center mb-3 ' + headerContainerClass\">\r\n</hr-card-header>\r\n<hr-employee-calendar\r\n [showEvents]=\"true\"\r\n [showUpComingVacations]=\"true\"\r\n [scheduleCalenderVacation]=\"scheduleCalenderVacation\"\r\n [minDate]=\"minDate\"\r\n [maxDate]=\"maxDate\"\r\n [legendContainerClass]=\"legendContainerClass\"\r\n [legendRowClass]=\"legendRowClass\"\r\n [legendItemClass]=\"legendItemClass\"\r\n [legendDotClass]=\"legendDotClass\"\r\n [legendLabelClass]=\"legendLabelClass\"\r\n [publicHolidayDotClass]=\"publicHolidayDotClass\"\r\n [dayOffDotClass]=\"dayOffDotClass\"\r\n [eventsDotClass]=\"eventsDotClass\"\r\n [vacationsContainerClass]=\"vacationsContainerClass\"\r\n [vacationsItemClass]=\"vacationsItemClass\"\r\n [vacationsIconClass]=\"vacationsIconClass\"\r\n [calendarContainerClass]=\"calendarContainerClass\"\r\n [calendarClass]=\"calendarClass\">\r\n</hr-employee-calendar>\r\n" }]
|
|
1289
|
+
}], ctorParameters: () => [{ type: i1.HttpClient }], propDecorators: { baseUrl: [{
|
|
1290
|
+
type: Input
|
|
1291
|
+
}], headerContainerClass: [{
|
|
1292
|
+
type: Input
|
|
1293
|
+
}], isLoadingChanged: [{
|
|
1294
|
+
type: Output
|
|
1295
|
+
}], legendContainerClass: [{
|
|
1296
|
+
type: Input
|
|
1297
|
+
}], legendRowClass: [{
|
|
1298
|
+
type: Input
|
|
1299
|
+
}], legendItemClass: [{
|
|
1300
|
+
type: Input
|
|
1301
|
+
}], legendDotClass: [{
|
|
1302
|
+
type: Input
|
|
1303
|
+
}], legendLabelClass: [{
|
|
1304
|
+
type: Input
|
|
1305
|
+
}], publicHolidayDotClass: [{
|
|
1306
|
+
type: Input
|
|
1307
|
+
}], dayOffDotClass: [{
|
|
1308
|
+
type: Input
|
|
1309
|
+
}], eventsDotClass: [{
|
|
1310
|
+
type: Input
|
|
1311
|
+
}], vacationsContainerClass: [{
|
|
1312
|
+
type: Input
|
|
1313
|
+
}], vacationsItemClass: [{
|
|
1314
|
+
type: Input
|
|
1315
|
+
}], vacationsIconClass: [{
|
|
1316
|
+
type: Input
|
|
1317
|
+
}], calendarContainerClass: [{
|
|
1318
|
+
type: Input
|
|
1319
|
+
}], calendarClass: [{
|
|
1320
|
+
type: Input
|
|
1321
|
+
}], publicHolidayColor: [{
|
|
1322
|
+
type: Input
|
|
1323
|
+
}], dayOffColor: [{
|
|
1324
|
+
type: Input
|
|
1325
|
+
}], eventsColor: [{
|
|
1326
|
+
type: Input
|
|
1327
|
+
}], hrCalendar: [{
|
|
1328
|
+
type: ViewChild,
|
|
1329
|
+
args: [HREmployeeCalendarComponent]
|
|
1330
|
+
}] } });
|
|
1331
|
+
|
|
953
1332
|
/*
|
|
954
1333
|
* Public API Surface of shared-ui
|
|
955
1334
|
*/
|
|
@@ -958,5 +1337,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
|
|
|
958
1337
|
* Generated bundle index. Do not edit.
|
|
959
1338
|
*/
|
|
960
1339
|
|
|
961
|
-
export { EventOption, EventTypeEnum,
|
|
1340
|
+
export { EventOption, EventTypeEnum, HRCardHeaderComponent, HRConstantsService, HREmployeeCalendarComponent, HRMyCalendarWidgetComponent, HRMyMainDetailsWidgetComponent, HRTranslatePipe, HRTranslateService, MainWidgetShortcut, MyUpcomingEventsWidgetComponent, PublicHolidayWeekContext, RelativeDay, ScheduleVacationTypes };
|
|
962
1341
|
//# sourceMappingURL=skysoftware-co-bayan-hr-widgets-ui.mjs.map
|