barsa-calendar 2.3.24 → 2.3.26
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/fesm2022/barsa-calendar.mjs +88 -93
- package/fesm2022/barsa-calendar.mjs.map +1 -1
- package/index.d.ts +14 -10
- package/package.json +1 -1
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import {
|
|
2
|
+
import { Injectable, Pipe, EventEmitter, HostListener, HostBinding, Output, Input, ChangeDetectionStrategy, Component, inject, ViewChild, ChangeDetectorRef, ComponentFactoryResolver, NO_ERRORS_SCHEMA, NgModule } from '@angular/core';
|
|
3
3
|
import { takeUntil, distinctUntilChanged, map, switchMap } from 'rxjs/operators';
|
|
4
4
|
import * as i2$1 from 'barsa-novin-ray-core';
|
|
5
|
-
import { BaseComponent,
|
|
5
|
+
import { BaseComponent, getDateService, getUniqueId, PreventDefaulEvent, PortalService, DateService, BbbTranslatePipe, BarsaApi, ReportViewBaseComponent, LogService, BaseModule, DynamicComponentService, BarsaNovinRayCoreModule } from 'barsa-novin-ray-core';
|
|
6
6
|
import { BehaviorSubject, combineLatest, of } from 'rxjs';
|
|
7
7
|
import moment from 'moment/moment';
|
|
8
8
|
import * as i1 from '@angular/common';
|
|
@@ -15,7 +15,7 @@ import * as i6$1 from '@fundamental-ngx/core/toolbar';
|
|
|
15
15
|
import * as i3$1 from '@fundamental-ngx/core/content-density';
|
|
16
16
|
import * as i6$2 from '@fundamental-ngx/core/table';
|
|
17
17
|
import { DialogService, PopoverComponent, DatetimeAdapter, FdDate, TimeComponent, InputGroupComponent, FdDatetimeAdapter, FundamentalNgxCoreModule } from '@fundamental-ngx/core';
|
|
18
|
-
import * as
|
|
18
|
+
import * as i10 from '@fundamental-ngx/core/dialog';
|
|
19
19
|
import * as i2 from '@fundamental-ngx/core/avatar';
|
|
20
20
|
import * as i4 from '@fundamental-ngx/core/icon';
|
|
21
21
|
import * as i5 from '@fundamental-ngx/core/layout-panel';
|
|
@@ -27,11 +27,11 @@ import * as i2$3 from '@angular/forms';
|
|
|
27
27
|
import { FormsModule } from '@angular/forms';
|
|
28
28
|
import * as i7 from '@fundamental-ngx/core/form';
|
|
29
29
|
import * as i8 from '@fundamental-ngx/core/input-group';
|
|
30
|
-
import * as
|
|
30
|
+
import * as i9 from '@fundamental-ngx/core/menu';
|
|
31
|
+
import * as i13 from '@fundamental-ngx/core/split-button';
|
|
32
|
+
import * as i14 from '@fundamental-ngx/core/time';
|
|
31
33
|
import moment$1 from 'moment';
|
|
32
|
-
import * as i3$2 from '@fundamental-ngx/core/
|
|
33
|
-
import * as i5$2 from '@fundamental-ngx/core/split-button';
|
|
34
|
-
import * as i3$3 from '@fundamental-ngx/core/checkbox';
|
|
34
|
+
import * as i3$2 from '@fundamental-ngx/core/checkbox';
|
|
35
35
|
import { CardModule } from '@fundamental-ngx/core/card';
|
|
36
36
|
|
|
37
37
|
var DayStatus;
|
|
@@ -50,23 +50,12 @@ class CalendarMonthInfo {
|
|
|
50
50
|
|
|
51
51
|
class CalendarService extends BaseComponent {
|
|
52
52
|
constructor() {
|
|
53
|
-
super();
|
|
53
|
+
super(...arguments);
|
|
54
54
|
this._calendarsSource = new BehaviorSubject([]);
|
|
55
55
|
this._modeSource = new BehaviorSubject('month');
|
|
56
56
|
this._currentMonthIndexSource = new BehaviorSubject(-1);
|
|
57
57
|
this._weekModeDaysSource = new BehaviorSubject([]);
|
|
58
58
|
this._daysSource = new BehaviorSubject([]);
|
|
59
|
-
this._logService = inject(LogService);
|
|
60
|
-
this.culture = inject('Date_Culture', { optional: true });
|
|
61
|
-
const _logService = this._logService;
|
|
62
|
-
this._dateService = getDateService(_logService, this.culture);
|
|
63
|
-
this.days$ = this._daysSource.asObservable();
|
|
64
|
-
this.mode$ = this._modeSource.asObservable();
|
|
65
|
-
this.weekModeDays$ = this._weekModeDaysSource.asObservable();
|
|
66
|
-
this.calendars$ = this._calendarsSource.asObservable();
|
|
67
|
-
this.currentMonthIndex$ = this._currentMonthIndexSource.asObservable();
|
|
68
|
-
this._initilize();
|
|
69
|
-
this.setMode('day');
|
|
70
59
|
}
|
|
71
60
|
get todayMonthInfo() {
|
|
72
61
|
return this._todayMonthInfo;
|
|
@@ -90,22 +79,6 @@ class CalendarService extends BaseComponent {
|
|
|
90
79
|
const monthInfo = this._dateService.getDateInfo(value);
|
|
91
80
|
this.loadMonth(monthInfo);
|
|
92
81
|
}
|
|
93
|
-
setDateService(primaryCalendarType) {
|
|
94
|
-
let dateService = this._dateService;
|
|
95
|
-
switch (primaryCalendarType) {
|
|
96
|
-
case 'Persian':
|
|
97
|
-
dateService = getDateService(this._logService, 'fa-IR');
|
|
98
|
-
break;
|
|
99
|
-
case 'Gregorian':
|
|
100
|
-
dateService = getDateService(this._logService, 'en-US');
|
|
101
|
-
break;
|
|
102
|
-
case 'Arabic':
|
|
103
|
-
dateService = getDateService(this._logService, 'ar-AE');
|
|
104
|
-
break;
|
|
105
|
-
}
|
|
106
|
-
this._dateService = dateService;
|
|
107
|
-
this._initilize();
|
|
108
|
-
}
|
|
109
82
|
setDays(days) {
|
|
110
83
|
this._daysSource.next(days);
|
|
111
84
|
}
|
|
@@ -487,6 +460,16 @@ class CalendarService extends BaseComponent {
|
|
|
487
460
|
}
|
|
488
461
|
return Number(replaceString);
|
|
489
462
|
}
|
|
463
|
+
setCulture(culture) {
|
|
464
|
+
this._dateService = getDateService(this._log, culture);
|
|
465
|
+
this.days$ = this._daysSource.asObservable();
|
|
466
|
+
this.mode$ = this._modeSource.asObservable();
|
|
467
|
+
this.weekModeDays$ = this._weekModeDaysSource.asObservable();
|
|
468
|
+
this.calendars$ = this._calendarsSource.asObservable();
|
|
469
|
+
this.currentMonthIndex$ = this._currentMonthIndexSource.asObservable();
|
|
470
|
+
this._initilize();
|
|
471
|
+
this.setMode('day');
|
|
472
|
+
}
|
|
490
473
|
_initilize() {
|
|
491
474
|
this.today = this._dateService.getMoment(new Date());
|
|
492
475
|
const todayMonthInfo = this.getCalendarMonthInfo(new Date());
|
|
@@ -675,12 +658,12 @@ class CalendarService extends BaseComponent {
|
|
|
675
658
|
};
|
|
676
659
|
return { day, isInMonth };
|
|
677
660
|
}
|
|
678
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CalendarService, deps:
|
|
661
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CalendarService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
679
662
|
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CalendarService }); }
|
|
680
663
|
}
|
|
681
664
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CalendarService, decorators: [{
|
|
682
665
|
type: Injectable
|
|
683
|
-
}]
|
|
666
|
+
}] });
|
|
684
667
|
|
|
685
668
|
class DaysInWeekPipe {
|
|
686
669
|
constructor() { }
|
|
@@ -1001,7 +984,7 @@ class EventButtonComponent extends BaseComponent {
|
|
|
1001
984
|
popover.open();
|
|
1002
985
|
}
|
|
1003
986
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: EventButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1004
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: EventButtonComponent, isStandalone: false, selector: "bc-event-button", inputs: { buttonTemplate: "buttonTemplate", calendarFields: "calendarFields", task: "task", rtl: "rtl", canDelete: "canDelete", canEdit: "canEdit", canView: "canView", index: "index", deviceSize: "deviceSize" }, outputs: { deleteEvent: "deleteEvent", editEvent: "editEvent", openPopoverChange: "openPopoverChange" }, host: { properties: { "style.opacity": "this.opacity", "attr.rtl": "this._rtl" } }, viewQueries: [{ propertyName: "defaultButtonTemplate", first: true, predicate: ["defaultButton"], descendants: true, static: true }, { propertyName: "popoverComponent", first: true, predicate: PopoverComponent, descendants: true, static: true }, { propertyName: "_dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true, static: true }, { propertyName: "btnFocus", first: true, predicate: ["btnFocus"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<button\r\n #btnFocus\r\n [attr.id]=\"task.id\"\r\n style=\"width: 0; height: 0; visibility: hidden; max-height: 1px; min-height: 1px; position: absolute\"\r\n></button>\r\n@if ( (task.startdayIsInRow && !task.isStartDay) || (task.isMiddle && !task.isStartDay && !task.isEndDay) ||\r\n(task.isEndDay && !task.isStartDay && !task.isMiddle) ) {\r\n<bc-event-button-start-arrow [task]=\"task\" [calendarFields]=\"calendarFields\" [rtl]=\"rtl\"> </bc-event-button-start-arrow>\r\n}\r\n\r\n<ng-container\r\n *ngTemplateOutlet=\"\r\n buttonTemplate;\r\n context: {\r\n $implicit: task,\r\n calendarFields: calendarFields,\r\n popover: popover,\r\n onButtonClick: onButtonClick.bind(this)\r\n }\r\n \"\r\n></ng-container>\r\n\r\n@if (!task.enddayIsInRow) {\r\n<bc-event-button-end-arrow [task]=\"task\" [calendarFields]=\"calendarFields\" [rtl]=\"rtl\"> </bc-event-button-end-arrow>\r\n}\r\n\r\n<fd-popover\r\n #popover\r\n placement=\"bottom\"\r\n [mobile]=\"deviceSize === 's'\"\r\n [focusTrapped]=\"true\"\r\n [focusAutoCapture]=\"true\"\r\n [mobile]=\"deviceSize === 's'\"\r\n [title]=\"task.event[calendarFields.Title]\"\r\n (isOpenChange)=\"onPopOverOpenChange($event)\"\r\n>\r\n <fd-popover-control></fd-popover-control>\r\n <fd-popover-body>\r\n <bc-event-preview\r\n [event]=\"task.event\"\r\n [calendarFields]=\"calendarFields\"\r\n [popover]=\"popover\"\r\n [canDelete]=\"canDelete\"\r\n [canView]=\"canView\"\r\n [deviceSize]=\"deviceSize\"\r\n [canEdit]=\"canEdit\"\r\n (deleteEvent)=\"deleteEvent.emit($event)\"\r\n (editEvent)=\"editEvent.emit($event)\"\r\n ></bc-event-preview>\r\n </fd-popover-body>\r\n</fd-popover>\r\n\r\n<ng-content></ng-content>\r\n\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\r\n <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n <fd-dialog-body>\r\n <bc-event-preview\r\n [event]=\"task.event\"\r\n [calendarFields]=\"calendarFields\"\r\n [canDelete]=\"canDelete\"\r\n [deviceSize]=\"deviceSize\"\r\n [canEdit]=\"canEdit\"\r\n (deleteEvent)=\"deleteEvent.emit($event)\"\r\n (editEvent)=\"editEvent.emit($event)\"\r\n (closeEvent)=\"dialog.dismiss()\"\r\n ></bc-event-preview>\r\n </fd-dialog-body>\r\n </fd-dialog>\r\n</ng-template>\r\n<ng-template\r\n #defaultButton\r\n let-task\r\n let-popover=\"popover\"\r\n let-calendarFields=\"calendarFields\"\r\n let-onButtonClick=\"onButtonClick\"\r\n>\r\n <button\r\n fd-button\r\n [compact]=\"true\"\r\n (click)=\"onButtonClick(popover)\"\r\n [fdType]=\"task.inDay ? 'standard' : 'emphasized'\"\r\n [label]=\"task | eventTime: calendarFields\"\r\n [style.background-color]=\"task.event[calendarFields.Color] ? task.event[calendarFields.Color] : null\"\r\n class=\"task-title noborder\"\r\n ></button>\r\n</ng-template>\r\n", styles: [":host{display:flex;flex-direction:row;align-items:stretch;justify-content:stretch;width:100%;height:100%;padding-top:1px;border-radius:var(--sapButton_BorderCornerRadius);min-height:1rem}:host ::ng-deep span{margin-top:-4px}:host[rtl=true]{padding-right:3px}:host[rtl=false]{padding-left:3px}.task-title{justify-content:start!important;font-weight:400}button{flex-grow:1;border-radius:0!important;height:100%;max-height:100%;min-height:100%;border:none}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type:
|
|
987
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: EventButtonComponent, isStandalone: false, selector: "bc-event-button", inputs: { buttonTemplate: "buttonTemplate", calendarFields: "calendarFields", task: "task", rtl: "rtl", canDelete: "canDelete", canEdit: "canEdit", canView: "canView", index: "index", deviceSize: "deviceSize" }, outputs: { deleteEvent: "deleteEvent", editEvent: "editEvent", openPopoverChange: "openPopoverChange" }, host: { properties: { "style.opacity": "this.opacity", "attr.rtl": "this._rtl" } }, viewQueries: [{ propertyName: "defaultButtonTemplate", first: true, predicate: ["defaultButton"], descendants: true, static: true }, { propertyName: "popoverComponent", first: true, predicate: PopoverComponent, descendants: true, static: true }, { propertyName: "_dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true, static: true }, { propertyName: "btnFocus", first: true, predicate: ["btnFocus"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<button\r\n #btnFocus\r\n [attr.id]=\"task.id\"\r\n style=\"width: 0; height: 0; visibility: hidden; max-height: 1px; min-height: 1px; position: absolute\"\r\n></button>\r\n@if ( (task.startdayIsInRow && !task.isStartDay) || (task.isMiddle && !task.isStartDay && !task.isEndDay) ||\r\n(task.isEndDay && !task.isStartDay && !task.isMiddle) ) {\r\n<bc-event-button-start-arrow [task]=\"task\" [calendarFields]=\"calendarFields\" [rtl]=\"rtl\"> </bc-event-button-start-arrow>\r\n}\r\n\r\n<ng-container\r\n *ngTemplateOutlet=\"\r\n buttonTemplate;\r\n context: {\r\n $implicit: task,\r\n calendarFields: calendarFields,\r\n popover: popover,\r\n onButtonClick: onButtonClick.bind(this)\r\n }\r\n \"\r\n></ng-container>\r\n\r\n@if (!task.enddayIsInRow) {\r\n<bc-event-button-end-arrow [task]=\"task\" [calendarFields]=\"calendarFields\" [rtl]=\"rtl\"> </bc-event-button-end-arrow>\r\n}\r\n\r\n<fd-popover\r\n #popover\r\n placement=\"bottom\"\r\n [mobile]=\"deviceSize === 's'\"\r\n [focusTrapped]=\"true\"\r\n [focusAutoCapture]=\"true\"\r\n [mobile]=\"deviceSize === 's'\"\r\n [title]=\"task.event[calendarFields.Title]\"\r\n (isOpenChange)=\"onPopOverOpenChange($event)\"\r\n>\r\n <fd-popover-control></fd-popover-control>\r\n <fd-popover-body>\r\n <bc-event-preview\r\n [event]=\"task.event\"\r\n [calendarFields]=\"calendarFields\"\r\n [popover]=\"popover\"\r\n [canDelete]=\"canDelete\"\r\n [canView]=\"canView\"\r\n [deviceSize]=\"deviceSize\"\r\n [canEdit]=\"canEdit\"\r\n (deleteEvent)=\"deleteEvent.emit($event)\"\r\n (editEvent)=\"editEvent.emit($event)\"\r\n ></bc-event-preview>\r\n </fd-popover-body>\r\n</fd-popover>\r\n\r\n<ng-content></ng-content>\r\n\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\r\n <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n <fd-dialog-body>\r\n <bc-event-preview\r\n [event]=\"task.event\"\r\n [calendarFields]=\"calendarFields\"\r\n [canDelete]=\"canDelete\"\r\n [deviceSize]=\"deviceSize\"\r\n [canEdit]=\"canEdit\"\r\n (deleteEvent)=\"deleteEvent.emit($event)\"\r\n (editEvent)=\"editEvent.emit($event)\"\r\n (closeEvent)=\"dialog.dismiss()\"\r\n ></bc-event-preview>\r\n </fd-dialog-body>\r\n </fd-dialog>\r\n</ng-template>\r\n<ng-template\r\n #defaultButton\r\n let-task\r\n let-popover=\"popover\"\r\n let-calendarFields=\"calendarFields\"\r\n let-onButtonClick=\"onButtonClick\"\r\n>\r\n <button\r\n fd-button\r\n [compact]=\"true\"\r\n (click)=\"onButtonClick(popover)\"\r\n [fdType]=\"task.inDay ? 'standard' : 'emphasized'\"\r\n [label]=\"task | eventTime: calendarFields\"\r\n [style.background-color]=\"task.event[calendarFields.Color] ? task.event[calendarFields.Color] : null\"\r\n class=\"task-title noborder\"\r\n ></button>\r\n</ng-template>\r\n", styles: [":host{display:flex;flex-direction:row;align-items:stretch;justify-content:stretch;width:100%;height:100%;padding-top:1px;border-radius:var(--sapButton_BorderCornerRadius);min-height:1rem}:host ::ng-deep span{margin-top:-4px}:host[rtl=true]{padding-right:3px}:host[rtl=false]{padding-left:3px}.task-title{justify-content:start!important;font-weight:400}button{flex-grow:1;border-radius:0!important;height:100%;max-height:100%;min-height:100%;border:none}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i10.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i10.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i5$1.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i5$1.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i5$1.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: EventPreviewComponent, selector: "bc-event-preview", inputs: ["event", "calendarFields", "popover", "popover2", "canEdit", "canView", "canDelete", "inDialog", "deviceSize"], outputs: ["deleteEvent", "editEvent", "closeEvent"] }, { kind: "component", type: EventButtonEndArrowComponent, selector: "bc-event-button-end-arrow", inputs: ["task", "rtl", "calendarFields"] }, { kind: "component", type: EventButtonStartArrowComponent, selector: "bc-event-button-start-arrow", inputs: ["task", "rtl", "calendarFields"] }, { kind: "pipe", type: EventTimePipe, name: "eventTime" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1005
988
|
}
|
|
1006
989
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: EventButtonComponent, decorators: [{
|
|
1007
990
|
type: Component,
|
|
@@ -1144,12 +1127,18 @@ class CalendarMonthComponent extends BaseComponent {
|
|
|
1144
1127
|
ngOnChanges(changes) {
|
|
1145
1128
|
super.ngOnChanges(changes);
|
|
1146
1129
|
let needToDetectChange = false;
|
|
1147
|
-
const { containerHeight, deviceSize, moDataList, days, monthWeeksCount, startSelectedDayIndex, endSelectedDayIndex } = changes;
|
|
1130
|
+
const { containerHeight, deviceSize, moDataList, days, monthWeeksCount, startSelectedDayIndex, endSelectedDayIndex, weekDays, weekDaysMin } = changes;
|
|
1148
1131
|
if (containerHeight && !containerHeight.firstChange) {
|
|
1149
1132
|
this.fitToContainer(changes.containerHeight.currentValue);
|
|
1150
1133
|
}
|
|
1151
1134
|
if (deviceSize && !deviceSize.firstChange) {
|
|
1152
|
-
this.
|
|
1135
|
+
this._prepareWeekDays(changes.deviceSize.currentValue);
|
|
1136
|
+
}
|
|
1137
|
+
if (weekDays && !weekDays.firstChange) {
|
|
1138
|
+
this._prepareWeekDays(this.deviceSize, weekDays.currentValue);
|
|
1139
|
+
}
|
|
1140
|
+
if (weekDaysMin && !weekDaysMin.firstChange) {
|
|
1141
|
+
this._prepareWeekDays(this.deviceSize, undefined, weekDaysMin.currentValue);
|
|
1153
1142
|
}
|
|
1154
1143
|
if (moDataList && !moDataList.firstChange) {
|
|
1155
1144
|
this._prepareDaysTasks(changes.moDataList.currentValue);
|
|
@@ -1176,7 +1165,7 @@ class CalendarMonthComponent extends BaseComponent {
|
|
|
1176
1165
|
ngOnInit() {
|
|
1177
1166
|
super.ngOnInit();
|
|
1178
1167
|
this.isPickerMode = this.datePicker || this.rangePicker;
|
|
1179
|
-
this.
|
|
1168
|
+
this._prepareWeekDays(this.deviceSize);
|
|
1180
1169
|
this._prepareDaysTasks(this.moDataList);
|
|
1181
1170
|
this.fitToContainer(this.containerHeight);
|
|
1182
1171
|
}
|
|
@@ -1234,12 +1223,12 @@ class CalendarMonthComponent extends BaseComponent {
|
|
|
1234
1223
|
}, 0);
|
|
1235
1224
|
}
|
|
1236
1225
|
}
|
|
1237
|
-
|
|
1226
|
+
_prepareWeekDays(deviceSize, weekDays, weekDaysMin) {
|
|
1238
1227
|
if (deviceSize !== 's' && deviceSize !== 'm') {
|
|
1239
|
-
this.selectedWeekDays = this.weekDays;
|
|
1228
|
+
this.selectedWeekDays = weekDays || this.weekDays;
|
|
1240
1229
|
}
|
|
1241
1230
|
else {
|
|
1242
|
-
this.selectedWeekDays = this.weekDaysMin;
|
|
1231
|
+
this.selectedWeekDays = weekDaysMin || this.weekDaysMin;
|
|
1243
1232
|
}
|
|
1244
1233
|
}
|
|
1245
1234
|
fitToContainer(containerHeight) {
|
|
@@ -1578,6 +1567,7 @@ class DateTimePickerComponent extends BaseComponent {
|
|
|
1578
1567
|
this.rangeChange = new EventEmitter();
|
|
1579
1568
|
this.valueChange = new EventEmitter();
|
|
1580
1569
|
this.valueCaption = '';
|
|
1570
|
+
this.supportCultureTypes = { 'fa-IR': 'شمسی', 'en-US': 'Gregorian' };
|
|
1581
1571
|
this.selectionMode = 'day';
|
|
1582
1572
|
this.todayIndex = -1;
|
|
1583
1573
|
this.isValid = true;
|
|
@@ -1585,7 +1575,6 @@ class DateTimePickerComponent extends BaseComponent {
|
|
|
1585
1575
|
this.tempFormmatedDate = '';
|
|
1586
1576
|
this._calendarService = inject(CalendarService, { self: true });
|
|
1587
1577
|
this._datetimeAdapter = inject(DatetimeAdapter);
|
|
1588
|
-
this._dateTimeToCaption = inject(DateTimeToCaptionPipe);
|
|
1589
1578
|
this._dialogService = inject(DialogService);
|
|
1590
1579
|
this._portalService = inject(PortalService);
|
|
1591
1580
|
this.rtl$ = this._portalService.rtl$;
|
|
@@ -1607,42 +1596,17 @@ class DateTimePickerComponent extends BaseComponent {
|
|
|
1607
1596
|
}
|
|
1608
1597
|
ngOnInit() {
|
|
1609
1598
|
super.ngOnInit();
|
|
1610
|
-
|
|
1611
|
-
|
|
1612
|
-
case 'HijriShamsi':
|
|
1613
|
-
culture = 'fa-IR';
|
|
1614
|
-
break;
|
|
1615
|
-
}
|
|
1616
|
-
this.culture = culture;
|
|
1617
|
-
this._calendarService.setMode('month');
|
|
1618
|
-
this.weekDaysMin = this._calendarService.weekDaysMin();
|
|
1619
|
-
this.weekDays = this._calendarService.weekDays();
|
|
1620
|
-
this.selectedMonth$ = this._calendarService.selected$;
|
|
1621
|
-
this.today = this._calendarService.today;
|
|
1622
|
-
if (this.value) {
|
|
1623
|
-
this.timeValue = FdDate.getFdDateByDate(this.value);
|
|
1624
|
-
this._setCaption(this.value);
|
|
1625
|
-
this._calendarService.loadMonthByDate(this.value);
|
|
1626
|
-
}
|
|
1627
|
-
else {
|
|
1628
|
-
this.timeValue = FdDate.getFdDateByDate(new Date());
|
|
1629
|
-
}
|
|
1630
|
-
// if (this.isRangePicker) {
|
|
1631
|
-
// if (this.startRangeDate) {
|
|
1632
|
-
// this._calendarService.loadMonthByDate(this.startRangeDate);
|
|
1633
|
-
// }
|
|
1634
|
-
// if (this.endRangeDate) {
|
|
1635
|
-
// }
|
|
1636
|
-
// } else {
|
|
1637
|
-
// this._calendarService.loadMonthByDate(this.value);
|
|
1638
|
-
// }
|
|
1639
|
-
this.months = this._calendarService.Months;
|
|
1640
|
-
this._prepareYear(this._calendarService.selectedMonth.dateInfo.year);
|
|
1599
|
+
this.originalCulture = this.culture;
|
|
1600
|
+
this._initCalendarService();
|
|
1641
1601
|
this._setFormattedDateToInput(this.value);
|
|
1642
1602
|
if (this.inputGroupComponent) {
|
|
1643
1603
|
this.inputGroupComponent._cva.onChange = this.onCaptionChanged.bind(this);
|
|
1644
1604
|
}
|
|
1645
1605
|
}
|
|
1606
|
+
onCultureChange(culture) {
|
|
1607
|
+
this.culture = culture;
|
|
1608
|
+
this._initCalendarService();
|
|
1609
|
+
}
|
|
1646
1610
|
onHourTextChange(e) {
|
|
1647
1611
|
const val = Number(e.target.value);
|
|
1648
1612
|
if (isNaN(val)) {
|
|
@@ -1703,7 +1667,7 @@ class DateTimePickerComponent extends BaseComponent {
|
|
|
1703
1667
|
return;
|
|
1704
1668
|
}
|
|
1705
1669
|
const englishDateStr = BarsaApi.Common.Util.ReplaceFaToArCharchter(e);
|
|
1706
|
-
let format =
|
|
1670
|
+
let format = this.formatPattern;
|
|
1707
1671
|
if (this.showTime) {
|
|
1708
1672
|
if (this.showDate) {
|
|
1709
1673
|
format += ' HH:mm';
|
|
@@ -1712,7 +1676,8 @@ class DateTimePickerComponent extends BaseComponent {
|
|
|
1712
1676
|
format = 'HH:mm';
|
|
1713
1677
|
}
|
|
1714
1678
|
}
|
|
1715
|
-
const
|
|
1679
|
+
const dateService = this._getDateServiceOriginal();
|
|
1680
|
+
const moment = dateService.stringToMoment(englishDateStr, format);
|
|
1716
1681
|
// const isValid = moment.isValid();// برای شمسی همیشه false نشون میده
|
|
1717
1682
|
if (this.showDate && isNaN(Date.parse(englishDateStr))) {
|
|
1718
1683
|
this.isValid = false;
|
|
@@ -1815,6 +1780,33 @@ class DateTimePickerComponent extends BaseComponent {
|
|
|
1815
1780
|
popover.close();
|
|
1816
1781
|
}
|
|
1817
1782
|
}
|
|
1783
|
+
_initCalendarService() {
|
|
1784
|
+
this._calendarService.setCulture(this.culture);
|
|
1785
|
+
this._calendarService.setMode('month');
|
|
1786
|
+
this.weekDaysMin = this._calendarService.weekDaysMin();
|
|
1787
|
+
this.weekDays = this._calendarService.weekDays();
|
|
1788
|
+
this.selectedMonth$ = this._calendarService.selected$;
|
|
1789
|
+
this.today = this._calendarService.today;
|
|
1790
|
+
if (this.value) {
|
|
1791
|
+
this.timeValue = FdDate.getFdDateByDate(this.value);
|
|
1792
|
+
this._setCaption(this.value);
|
|
1793
|
+
this._calendarService.loadMonthByDate(this.value);
|
|
1794
|
+
}
|
|
1795
|
+
else {
|
|
1796
|
+
this.timeValue = FdDate.getFdDateByDate(new Date());
|
|
1797
|
+
}
|
|
1798
|
+
// if (this.isRangePicker) {
|
|
1799
|
+
// if (this.startRangeDate) {
|
|
1800
|
+
// this._calendarService.loadMonthByDate(this.startRangeDate);
|
|
1801
|
+
// }
|
|
1802
|
+
// if (this.endRangeDate) {
|
|
1803
|
+
// }
|
|
1804
|
+
// } else {
|
|
1805
|
+
// this._calendarService.loadMonthByDate(this.value);
|
|
1806
|
+
// }
|
|
1807
|
+
this.months = this._calendarService.Months;
|
|
1808
|
+
this._prepareYear(this._calendarService.selectedMonth.dateInfo.year);
|
|
1809
|
+
}
|
|
1818
1810
|
_setFormattedDateToInput(date) {
|
|
1819
1811
|
if (date) {
|
|
1820
1812
|
const formattedDate = this._getFormattedDate(date);
|
|
@@ -1830,8 +1822,17 @@ class DateTimePickerComponent extends BaseComponent {
|
|
|
1830
1822
|
this.inputGroupComponent.inputText = val;
|
|
1831
1823
|
}
|
|
1832
1824
|
}
|
|
1825
|
+
_getDateServiceOriginal() {
|
|
1826
|
+
let x = this._calendarService._dateService;
|
|
1827
|
+
if (this.culture !== this.originalCulture) {
|
|
1828
|
+
x = getDateService(this._log, this.originalCulture);
|
|
1829
|
+
}
|
|
1830
|
+
return x;
|
|
1831
|
+
}
|
|
1833
1832
|
_getFormattedDate(date) {
|
|
1834
|
-
|
|
1833
|
+
const x2 = new Date(date);
|
|
1834
|
+
const x = this._getDateServiceOriginal();
|
|
1835
|
+
return x.format(x2, this.formatPattern);
|
|
1835
1836
|
}
|
|
1836
1837
|
_handleValueChange() {
|
|
1837
1838
|
this.value = this.showDate ? this.startSelectedDay?.date ?? this.value : new Date();
|
|
@@ -1899,17 +1900,13 @@ class DateTimePickerComponent extends BaseComponent {
|
|
|
1899
1900
|
}
|
|
1900
1901
|
}
|
|
1901
1902
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: DateTimePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1902
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: DateTimePickerComponent, isStandalone: false, selector: "bc-date-time-picker", inputs: { placeholder: "placeholder",
|
|
1903
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: DateTimePickerComponent, isStandalone: false, selector: "bc-date-time-picker", inputs: { placeholder: "placeholder", calendarType: "calendarType", formatPattern: "formatPattern", value: "value", timeValue: "timeValue", startRangeDate: "startRangeDate", endRangeDate: "endRangeDate", isRangePicker: "isRangePicker", showTime: "showTime", showDate: "showDate", rtl: "rtl", deviceSize: "deviceSize", isMobile: "isMobile", readonly: "readonly", disabled: "disabled", buttonMenuMode: "buttonMenuMode", inlineMode: "inlineMode", daterangeMode: "daterangeMode", culture: "culture" }, outputs: { rangeChange: "rangeChange", valueChange: "valueChange" }, providers: [
|
|
1903
1904
|
{
|
|
1904
1905
|
provide: DatetimeAdapter,
|
|
1905
1906
|
useClass: FdDatetimeAdapter
|
|
1906
1907
|
},
|
|
1907
|
-
{
|
|
1908
|
-
provide: DateService,
|
|
1909
|
-
useFactory: getDateService
|
|
1910
|
-
},
|
|
1911
1908
|
CalendarService
|
|
1912
|
-
], viewQueries: [{ propertyName: "timeComponent", first: true, predicate: TimeComponent, descendants: true }, { propertyName: "inputGroupComponent", first: true, predicate: InputGroupComponent, descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (inlineMode) {\r\n<ng-container\r\n *ngTemplateOutlet=\"\r\n daterangeMode ? dateRangeTpl : month;\r\n context: {\r\n $implicit: selectedMonth$ | async,\r\n width: width$ | async,\r\n height: height,\r\n rtl: rtl$ | async,\r\n weekDays: weekDays,\r\n weekDaysMin: weekDaysMin,\r\n today: today,\r\n deviceSize: deviceSize,\r\n popover: popover\r\n }\r\n \"\r\n>\r\n</ng-container>\r\n}\r\n<ng-template #dateRangeTpl>\r\n <bc-calendar-selection-days\r\n fd-toolbar-item\r\n [inline]=\"true\"\r\n [monthInfo]=\"(selectedMonth$ | async)!!\"\r\n (rangeChange)=\"onRangeChange($event)\"\r\n ></bc-calendar-selection-days>\r\n</ng-template>\r\n<fd-input-group\r\n placement=\"after\"\r\n glyph=\"calendar\"\r\n glyphAriaLabel=\"select day\"\r\n ariaLabelledBy=\"fd-input-group-icon-label-2\"\r\n [placeholder]=\"placeholder\"\r\n [value]=\"value\"\r\n [button]=\"true\"\r\n [state]=\"isValid ? 'success' : 'error'\"\r\n [showFocus]=\"true\"\r\n [disabled]=\"disabled\"\r\n [readonly]=\"readonly\"\r\n [style.display]=\"!buttonMenuMode || inlineMode ? 'inherit' : 'none'\"\r\n (addOnButtonClicked)=\"onOpenPopover(popover, dialogTemplate)\"\r\n>\r\n</fd-input-group>\r\n@if (buttonMenuMode) {\r\n<button\r\n fd-button\r\n [label]=\"tempFormmatedDate || placeholder\"\r\n [title]=\"placeholder\"\r\n [fdType]=\"value ? 'standard' : 'transparent'\"\r\n [fdMenu]=\"true\"\r\n (click)=\"onOpenPopover(popover, dialogTemplate)\"\r\n [class.placeholder-custom]=\"!value\"\r\n class=\"menu-button-datepicker\"\r\n></button>\r\n}\r\n\r\n<fd-popover #popover (isOpenChange)=\"onPopoverOpenChange($event)\" [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\r\n <fd-popover-body [style.width.px]=\"width$ | async\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n daterangeMode ? dateRangeTpl : month;\r\n context: {\r\n $implicit: selectedMonth$ | async,\r\n width: width$ | async,\r\n height: height,\r\n rtl: rtl$ | async,\r\n weekDays: weekDays,\r\n weekDaysMin: weekDaysMin,\r\n today: today,\r\n deviceSize: deviceSize,\r\n popover: popover\r\n }\r\n \"\r\n >\r\n </ng-container>\r\n <div fd-popover-body-footer>\r\n <div fd-bar [barDesign]=\"'footer'\">\r\n <div fd-bar-right>\r\n <container *ngTemplateOutlet=\"footerButtons\"></container>\r\n </div>\r\n </div>\r\n </div>\r\n </fd-popover-body>\r\n</fd-popover>\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\r\n <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n <fd-dialog-body>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n month;\r\n context: {\r\n $implicit: selectedMonth$ | async,\r\n width: width$ | async,\r\n height: height,\r\n rtl: rtl$ | async,\r\n weekDays: weekDays,\r\n weekDaysMin: weekDaysMin,\r\n today: today,\r\n deviceSize: deviceSize,\r\n popover: popover,\r\n dialog: dialog\r\n }\r\n \"\r\n >\r\n </ng-container>\r\n </fd-dialog-body>\r\n <fd-dialog-footer>\r\n <container *ngTemplateOutlet=\"footerButtons; context: { dialog: dialog }\"></container>\r\n </fd-dialog-footer>\r\n </fd-dialog>\r\n</ng-template>\r\n<ng-template #footerButtons let-dialog=\"dialog\">\r\n <fd-button-bar [label]=\"'Ok' | bbbTranslate\" fdType=\"emphasized\" (click)=\"onOk(popover, dialog)\"></fd-button-bar>\r\n <fd-button-bar\r\n [label]=\"'Clear' | bbbTranslate\"\r\n fdType=\"standard\"\r\n (click)=\"onClear(popover, dialog)\"\r\n ></fd-button-bar>\r\n <fd-button-bar [label]=\"'Cancel' | bbbTranslate\" (click)=\"onCancel(popover, dialog)\"></fd-button-bar>\r\n</ng-template>\r\n<ng-template\r\n #month\r\n let-selectedMonth\r\n let-width=\"width\"\r\n let-height=\"height\"\r\n let-rtl=\"rtl\"\r\n let-today=\"today\"\r\n let-showEvents=\"showEvents\"\r\n let-deviceSize=\"deviceSize\"\r\n let-popover=\"popover\"\r\n let-dialog=\"dialog\"\r\n>\r\n @if (showDate) {\r\n <fd-toolbar [fdType]=\"'transparent'\">\r\n <button\r\n fd-button\r\n fd-toolbar-item\r\n [label]=\"(showDate ? 'DateR_Today' : 'Now') | bbbTranslate\"\r\n (click)=\"onToday()\"\r\n ></button>\r\n @if (showDate) {\r\n <button\r\n fd-button\r\n fd-toolbar-item\r\n [fdType]=\"'transparent'\"\r\n [glyph]=\"rtl ? 'navigation-right-arrow' : 'navigation-left-arrow'\"\r\n (click)=\"onPrevTap()\"\r\n ></button>\r\n } @if (showDate) {\r\n <button\r\n fd-button\r\n fd-toolbar-item\r\n [fdType]=\"'transparent'\"\r\n [glyph]=\"rtl ? 'navigation-left-arrow' : 'navigation-right-arrow'\"\r\n (click)=\"onNextTap()\"\r\n ></button>\r\n } @if (showDate) {\r\n <div class=\"month-years-wrapper\" fd-title fd-toolbar-item>\r\n @if (selectionMode === 'day' || selectionMode === 'month') {\r\n <button\r\n fd-button\r\n [fdType]=\"'transparent'\"\r\n [label]=\"selectedMonth.dateInfo.monthName\"\r\n (click)=\"selectionMode = 'month'\"\r\n ></button>\r\n }\r\n <button\r\n fd-button\r\n [fdType]=\"'transparent'\"\r\n [label]=\"selectedMonth.dateInfo.year\"\r\n (click)=\"selectionMode = 'year'\"\r\n ></button>\r\n </div>\r\n }\r\n </fd-toolbar>\r\n }\r\n <div style=\"display: flex\">\r\n @switch (selectionMode) { @case ('month') {\r\n <div class=\"month-year-selection-wrapper\">\r\n @for (month of months; track month; let i = $index) {\r\n <button\r\n style=\"flex-grow: 1; width: 33%\"\r\n fd-button\r\n [fdType]=\"selectedMonth.dateInfo.monthName === month ? 'emphasized' : 'transparent'\"\r\n [label]=\"month\"\r\n (click)=\"selectionMode = 'day'; onMonthSelected(month, i)\"\r\n ></button>\r\n }\r\n </div>\r\n } @case ('year') {\r\n <div class=\"month-year-selection-wrapper\">\r\n @for (year of years; track year) {\r\n <button\r\n style=\"flex-grow: 1; width: 25%\"\r\n fd-button\r\n [fdType]=\"selectedMonth.dateInfo.year === +year ? 'emphasized' : 'transparent'\"\r\n [label]=\"year\"\r\n (click)=\"selectionMode = 'day'; onYearSelected(year)\"\r\n ></button>\r\n }\r\n </div>\r\n } @default {\r\n <div style=\"display: flex\">\r\n @if (showDate) {\r\n <bc-calendar-month\r\n [style.width]=\"width\"\r\n [containerHeight]=\"height\"\r\n [containerWidth]=\"width\"\r\n [rtl]=\"rtl\"\r\n [monthWeeksCount]=\"selectedMonth.weeksCount\"\r\n [weekDays]=\"weekDays\"\r\n [weekDaysMin]=\"weekDaysMin\"\r\n [today]=\"today\"\r\n [datePicker]=\"true\"\r\n [dateRange]=\"true\"\r\n [selectedDate]=\"startSelectedDay ? startSelectedDay.date : value\"\r\n [days]=\"selectedMonth.days\"\r\n [deviceSize]=\"deviceSize\"\r\n (dayClick)=\"onDayClick($event, popover, dialog)\"\r\n ></bc-calendar-month>\r\n }\r\n <div class=\"seperator\"></div>\r\n @if (showTime) {\r\n <div>\r\n <fd-time\r\n style=\"direction: ltr\"\r\n fdCompact\r\n [keepTwoDigits]=\"true\"\r\n [(ngModel)]=\"timeValue\"\r\n [displaySeconds]=\"false\"\r\n ></fd-time>\r\n <div style=\"display: flex; gap: 0.2rem; padding: 0.5rem\">\r\n <input\r\n fd-form-control\r\n class=\"remove-arrow\"\r\n style=\"width: 3rem\"\r\n [value]=\"timeValue?.minute\"\r\n type=\"number\"\r\n maxValue=\"23\"\r\n (input)=\"onMinuteTextChange($event)\"\r\n />\r\n <input\r\n fd-form-control\r\n style=\"width: 3rem\"\r\n class=\"remove-arrow\"\r\n [value]=\"timeValue?.hour\"\r\n type=\"number\"\r\n maxValue=\"59\"\r\n (input)=\"onHourTextChange($event)\"\r\n />\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n } }\r\n </div>\r\n</ng-template>\r\n", styles: [":host{display:block}fd-popover{display:block}fd-input-group ::ng-deep input{direction:ltr}fd-time ::ng-deep .fd-time{padding-top:0}.seperator{border-left:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9)}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2$1.NumbersOnlyInputDirective, selector: "input[type=number], input[numbersOnly]" }, { kind: "component", type: i2$2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size", "role"] }, { kind: "directive", type: i2$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i2$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "directive", type: i3$1.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]), [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]), [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]), [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i7.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i8.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: i9.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i9.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i9.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$2.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i5$1.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i5$1.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i5$1.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i12.TimeComponent, selector: "fd-time", inputs: ["meridian", "validate", "keepTwoDigits", "disabled", "displaySeconds", "displayMinutes", "displayHours", "tablet", "elementsAtOnce", "time", "spinnerButtons"] }, { kind: "component", type: i6$1.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i6$1.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: CalendarMonthComponent, selector: "bc-calendar-month", inputs: ["monthWeeksCount", "weekDays", "weekDaysMin", "today", "containerHeight", "days", "calendarFields", "rtl", "deviceSize", "moDataList", "datePicker", "rangePicker", "canDelete", "canAdd", "canEdit", "canView", "selectedDate", "startSelectedDayIndex", "endSelectedDayIndex"], outputs: ["editEvent", "deleteEvent", "daySelect", "dayClick", "dayMouseMove", "dayMouseUp", "dayMouseDown", "showEvent"] }, { kind: "component", type: CalendarSelectionDaysComponent, selector: "bc-calendar-selection-days", inputs: ["startSelectedDayIndex", "endSelectedDayIndex", "monthInfo", "inline"], outputs: ["rangeChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2$1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1909
|
+
], viewQueries: [{ propertyName: "timeComponent", first: true, predicate: TimeComponent, descendants: true }, { propertyName: "inputGroupComponent", first: true, predicate: InputGroupComponent, descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (inlineMode) {\r\n<ng-container\r\n *ngTemplateOutlet=\"\r\n daterangeMode ? dateRangeTpl : month;\r\n context: {\r\n $implicit: selectedMonth$ | async,\r\n width: width$ | async,\r\n height: height,\r\n rtl: rtl$ | async,\r\n weekDays: weekDays,\r\n weekDaysMin: weekDaysMin,\r\n today: today,\r\n deviceSize: deviceSize,\r\n popover: popover\r\n }\r\n \"\r\n>\r\n</ng-container>\r\n}\r\n<ng-template #dateRangeTpl>\r\n <bc-calendar-selection-days\r\n fd-toolbar-item\r\n [inline]=\"true\"\r\n [monthInfo]=\"(selectedMonth$ | async)!!\"\r\n (rangeChange)=\"onRangeChange($event)\"\r\n ></bc-calendar-selection-days>\r\n</ng-template>\r\n<fd-input-group\r\n placement=\"after\"\r\n glyph=\"calendar\"\r\n glyphAriaLabel=\"select day\"\r\n ariaLabelledBy=\"fd-input-group-icon-label-2\"\r\n [placeholder]=\"placeholder\"\r\n [value]=\"value\"\r\n [button]=\"true\"\r\n [state]=\"isValid ? 'success' : 'error'\"\r\n [showFocus]=\"true\"\r\n [disabled]=\"disabled\"\r\n [readonly]=\"readonly\"\r\n [style.display]=\"!buttonMenuMode || inlineMode ? 'inherit' : 'none'\"\r\n (addOnButtonClicked)=\"onOpenPopover(popover, dialogTemplate)\"\r\n>\r\n</fd-input-group>\r\n@if (buttonMenuMode) {\r\n<button\r\n fd-button\r\n [label]=\"tempFormmatedDate || placeholder\"\r\n [title]=\"placeholder\"\r\n [fdType]=\"value ? 'standard' : 'transparent'\"\r\n [fdMenu]=\"true\"\r\n (click)=\"onOpenPopover(popover, dialogTemplate)\"\r\n [class.placeholder-custom]=\"!value\"\r\n class=\"menu-button-datepicker\"\r\n></button>\r\n}\r\n\r\n<fd-popover #popover (isOpenChange)=\"onPopoverOpenChange($event)\" [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\r\n <fd-popover-body [style.width.px]=\"width$ | async\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n daterangeMode ? dateRangeTpl : month;\r\n context: {\r\n $implicit: selectedMonth$ | async,\r\n width: width$ | async,\r\n height: height,\r\n rtl: rtl$ | async,\r\n weekDays: weekDays,\r\n weekDaysMin: weekDaysMin,\r\n today: today,\r\n deviceSize: deviceSize,\r\n popover: popover\r\n }\r\n \"\r\n >\r\n </ng-container>\r\n <div fd-popover-body-footer>\r\n <div fd-bar [barDesign]=\"'footer'\">\r\n <div fd-bar-right>\r\n <container *ngTemplateOutlet=\"footerButtons\"></container>\r\n </div>\r\n </div>\r\n </div>\r\n </fd-popover-body>\r\n</fd-popover>\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\r\n <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n <fd-dialog-body>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n month;\r\n context: {\r\n $implicit: selectedMonth$ | async,\r\n width: width$ | async,\r\n height: height,\r\n rtl: rtl$ | async,\r\n weekDays: weekDays,\r\n weekDaysMin: weekDaysMin,\r\n today: today,\r\n deviceSize: deviceSize,\r\n popover: popover,\r\n dialog: dialog\r\n }\r\n \"\r\n >\r\n </ng-container>\r\n </fd-dialog-body>\r\n <fd-dialog-footer>\r\n <container *ngTemplateOutlet=\"footerButtons; context: { dialog: dialog }\"></container>\r\n </fd-dialog-footer>\r\n </fd-dialog>\r\n</ng-template>\r\n<ng-template #footerButtons let-dialog=\"dialog\">\r\n <fd-button-bar [label]=\"'Ok' | bbbTranslate\" fdType=\"emphasized\" (click)=\"onOk(popover, dialog)\"></fd-button-bar>\r\n <fd-button-bar\r\n [label]=\"'Clear' | bbbTranslate\"\r\n fdType=\"standard\"\r\n (click)=\"onClear(popover, dialog)\"\r\n ></fd-button-bar>\r\n <fd-button-bar [label]=\"'Cancel' | bbbTranslate\" (click)=\"onCancel(popover, dialog)\"></fd-button-bar>\r\n</ng-template>\r\n<ng-template\r\n #month\r\n let-selectedMonth\r\n let-width=\"width\"\r\n let-height=\"height\"\r\n let-rtl=\"rtl\"\r\n let-today=\"today\"\r\n let-showEvents=\"showEvents\"\r\n let-deviceSize=\"deviceSize\"\r\n let-popover=\"popover\"\r\n let-dialog=\"dialog\"\r\n>\r\n @if (showDate) {\r\n <fd-toolbar [fdType]=\"'transparent'\">\r\n <button\r\n fd-button\r\n fd-toolbar-item\r\n [label]=\"(showDate ? 'DateR_Today' : 'Now') | bbbTranslate\"\r\n (click)=\"onToday()\"\r\n ></button>\r\n <button\r\n fd-button\r\n fd-toolbar-item\r\n [fdType]=\"'transparent'\"\r\n [glyph]=\"rtl ? 'navigation-right-arrow' : 'navigation-left-arrow'\"\r\n (click)=\"onPrevTap()\"\r\n ></button>\r\n\r\n <button\r\n fd-button\r\n fd-toolbar-item\r\n [fdType]=\"'transparent'\"\r\n [glyph]=\"rtl ? 'navigation-left-arrow' : 'navigation-right-arrow'\"\r\n (click)=\"onNextTap()\"\r\n ></button>\r\n <div class=\"month-years-wrapper\" fd-title fd-toolbar-item>\r\n @if (selectionMode === 'day' || selectionMode === 'month') {\r\n <button\r\n fd-button\r\n [fdType]=\"'transparent'\"\r\n [label]=\"selectedMonth.dateInfo.monthName\"\r\n (click)=\"selectionMode = 'month'\"\r\n ></button>\r\n }\r\n <button\r\n fd-button\r\n [fdType]=\"'transparent'\"\r\n [label]=\"selectedMonth.dateInfo.year\"\r\n (click)=\"selectionMode = 'year'\"\r\n ></button>\r\n </div>\r\n <fd-split-button\r\n fd-toolbar-item\r\n [fixedWidth]=\"false\"\r\n [mainAction]=\"{\r\n mainActionTitle: culture === 'fa-IR' ? ('Shamsi' | bbbTranslate) : ('Gregorian' | bbbTranslate),\r\n keepMainAction: false\r\n }\"\r\n >\r\n <fd-menu>\r\n @for(culture of supportCultureTypes | keyvalue;track culture){\r\n <li fd-menu-item (click)=\"onCultureChange(culture.key)\">\r\n <div fd-menu-interactive>\r\n <span fd-menu-title>{{ culture.value }}</span>\r\n </div>\r\n </li>\r\n }\r\n </fd-menu>\r\n </fd-split-button>\r\n </fd-toolbar>\r\n }\r\n <div style=\"display: flex\">\r\n @switch (selectionMode) { @case ('month') {\r\n <div class=\"month-year-selection-wrapper\">\r\n @for (month of months; track month; let i = $index) {\r\n <button\r\n style=\"flex-grow: 1; width: 33%\"\r\n fd-button\r\n [fdType]=\"selectedMonth.dateInfo.monthName === month ? 'emphasized' : 'transparent'\"\r\n [label]=\"month\"\r\n (click)=\"selectionMode = 'day'; onMonthSelected(month, i)\"\r\n ></button>\r\n }\r\n </div>\r\n } @case ('year') {\r\n <div class=\"month-year-selection-wrapper\">\r\n @for (year of years; track year) {\r\n <button\r\n style=\"flex-grow: 1; width: 25%\"\r\n fd-button\r\n [fdType]=\"selectedMonth.dateInfo.year === +year ? 'emphasized' : 'transparent'\"\r\n [label]=\"year\"\r\n (click)=\"selectionMode = 'day'; onYearSelected(year)\"\r\n ></button>\r\n }\r\n </div>\r\n } @default {\r\n <div style=\"display: flex\">\r\n @if (showDate) {\r\n <bc-calendar-month\r\n [style.width]=\"width\"\r\n [containerHeight]=\"height\"\r\n [containerWidth]=\"width\"\r\n [rtl]=\"rtl\"\r\n [monthWeeksCount]=\"selectedMonth.weeksCount\"\r\n [weekDays]=\"weekDays\"\r\n [weekDaysMin]=\"weekDaysMin\"\r\n [today]=\"today\"\r\n [datePicker]=\"true\"\r\n [dateRange]=\"true\"\r\n [selectedDate]=\"startSelectedDay ? startSelectedDay.date : value\"\r\n [days]=\"selectedMonth.days\"\r\n [deviceSize]=\"deviceSize\"\r\n (dayClick)=\"onDayClick($event, popover, dialog)\"\r\n ></bc-calendar-month>\r\n }\r\n <div class=\"seperator\"></div>\r\n @if (showTime) {\r\n <div>\r\n <fd-time\r\n style=\"direction: ltr\"\r\n fdCompact\r\n [keepTwoDigits]=\"true\"\r\n [(ngModel)]=\"timeValue\"\r\n [displaySeconds]=\"false\"\r\n ></fd-time>\r\n <div style=\"display: flex; gap: 0.2rem; padding: 0.5rem\">\r\n <input\r\n fd-form-control\r\n class=\"remove-arrow\"\r\n style=\"width: 3rem\"\r\n [value]=\"timeValue?.minute\"\r\n type=\"number\"\r\n maxValue=\"23\"\r\n (input)=\"onMinuteTextChange($event)\"\r\n />\r\n <input\r\n fd-form-control\r\n style=\"width: 3rem\"\r\n class=\"remove-arrow\"\r\n [value]=\"timeValue?.hour\"\r\n type=\"number\"\r\n maxValue=\"59\"\r\n (input)=\"onHourTextChange($event)\"\r\n />\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n } }\r\n </div>\r\n</ng-template>\r\n", styles: [":host{display:block}fd-popover{display:block}fd-input-group ::ng-deep input{direction:ltr}fd-time ::ng-deep .fd-time{padding-top:0}.seperator{border-left:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9)}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2$1.NumbersOnlyInputDirective, selector: "input[type=number], input[numbersOnly]" }, { kind: "component", type: i2$2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size", "role"] }, { kind: "directive", type: i2$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i2$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "directive", type: i3$1.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]), [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]), [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]), [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i7.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i8.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: i9.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i9.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i9.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i9.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i10.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i10.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i10.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$2.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i5$1.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i5$1.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i5$1.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i13.SplitButtonComponent, selector: "fd-split-button", inputs: ["glyph", "glyphFont", "disabled", "fdType", "expandButtonTitle", "selected", "fixedWidth", "mainAction", "arialLabel"], outputs: ["primaryButtonClicked"] }, { kind: "component", type: i14.TimeComponent, selector: "fd-time", inputs: ["meridian", "validate", "keepTwoDigits", "disabled", "displaySeconds", "displayMinutes", "displayHours", "tablet", "elementsAtOnce", "time", "spinnerButtons"] }, { kind: "component", type: i6$1.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i6$1.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: CalendarMonthComponent, selector: "bc-calendar-month", inputs: ["monthWeeksCount", "weekDays", "weekDaysMin", "today", "containerHeight", "days", "calendarFields", "rtl", "deviceSize", "moDataList", "datePicker", "rangePicker", "canDelete", "canAdd", "canEdit", "canView", "selectedDate", "startSelectedDayIndex", "endSelectedDayIndex"], outputs: ["editEvent", "deleteEvent", "daySelect", "dayClick", "dayMouseMove", "dayMouseUp", "dayMouseDown", "showEvent"] }, { kind: "component", type: CalendarSelectionDaysComponent, selector: "bc-calendar-selection-days", inputs: ["startSelectedDayIndex", "endSelectedDayIndex", "monthInfo", "inline"], outputs: ["rangeChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: i2$1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1913
1910
|
}
|
|
1914
1911
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: DateTimePickerComponent, decorators: [{
|
|
1915
1912
|
type: Component,
|
|
@@ -1918,15 +1915,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
|
|
|
1918
1915
|
provide: DatetimeAdapter,
|
|
1919
1916
|
useClass: FdDatetimeAdapter
|
|
1920
1917
|
},
|
|
1921
|
-
{
|
|
1922
|
-
provide: DateService,
|
|
1923
|
-
useFactory: getDateService
|
|
1924
|
-
},
|
|
1925
1918
|
CalendarService
|
|
1926
|
-
], standalone: false, template: "@if (inlineMode) {\r\n<ng-container\r\n *ngTemplateOutlet=\"\r\n daterangeMode ? dateRangeTpl : month;\r\n context: {\r\n $implicit: selectedMonth$ | async,\r\n width: width$ | async,\r\n height: height,\r\n rtl: rtl$ | async,\r\n weekDays: weekDays,\r\n weekDaysMin: weekDaysMin,\r\n today: today,\r\n deviceSize: deviceSize,\r\n popover: popover\r\n }\r\n \"\r\n>\r\n</ng-container>\r\n}\r\n<ng-template #dateRangeTpl>\r\n <bc-calendar-selection-days\r\n fd-toolbar-item\r\n [inline]=\"true\"\r\n [monthInfo]=\"(selectedMonth$ | async)!!\"\r\n (rangeChange)=\"onRangeChange($event)\"\r\n ></bc-calendar-selection-days>\r\n</ng-template>\r\n<fd-input-group\r\n placement=\"after\"\r\n glyph=\"calendar\"\r\n glyphAriaLabel=\"select day\"\r\n ariaLabelledBy=\"fd-input-group-icon-label-2\"\r\n [placeholder]=\"placeholder\"\r\n [value]=\"value\"\r\n [button]=\"true\"\r\n [state]=\"isValid ? 'success' : 'error'\"\r\n [showFocus]=\"true\"\r\n [disabled]=\"disabled\"\r\n [readonly]=\"readonly\"\r\n [style.display]=\"!buttonMenuMode || inlineMode ? 'inherit' : 'none'\"\r\n (addOnButtonClicked)=\"onOpenPopover(popover, dialogTemplate)\"\r\n>\r\n</fd-input-group>\r\n@if (buttonMenuMode) {\r\n<button\r\n fd-button\r\n [label]=\"tempFormmatedDate || placeholder\"\r\n [title]=\"placeholder\"\r\n [fdType]=\"value ? 'standard' : 'transparent'\"\r\n [fdMenu]=\"true\"\r\n (click)=\"onOpenPopover(popover, dialogTemplate)\"\r\n [class.placeholder-custom]=\"!value\"\r\n class=\"menu-button-datepicker\"\r\n></button>\r\n}\r\n\r\n<fd-popover #popover (isOpenChange)=\"onPopoverOpenChange($event)\" [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\r\n <fd-popover-body [style.width.px]=\"width$ | async\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n daterangeMode ? dateRangeTpl : month;\r\n context: {\r\n $implicit: selectedMonth$ | async,\r\n width: width$ | async,\r\n height: height,\r\n rtl: rtl$ | async,\r\n weekDays: weekDays,\r\n weekDaysMin: weekDaysMin,\r\n today: today,\r\n deviceSize: deviceSize,\r\n popover: popover\r\n }\r\n \"\r\n >\r\n </ng-container>\r\n <div fd-popover-body-footer>\r\n <div fd-bar [barDesign]=\"'footer'\">\r\n <div fd-bar-right>\r\n <container *ngTemplateOutlet=\"footerButtons\"></container>\r\n </div>\r\n </div>\r\n </div>\r\n </fd-popover-body>\r\n</fd-popover>\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\r\n <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n <fd-dialog-body>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n month;\r\n context: {\r\n $implicit: selectedMonth$ | async,\r\n width: width$ | async,\r\n height: height,\r\n rtl: rtl$ | async,\r\n weekDays: weekDays,\r\n weekDaysMin: weekDaysMin,\r\n today: today,\r\n deviceSize: deviceSize,\r\n popover: popover,\r\n dialog: dialog\r\n }\r\n \"\r\n >\r\n </ng-container>\r\n </fd-dialog-body>\r\n <fd-dialog-footer>\r\n <container *ngTemplateOutlet=\"footerButtons; context: { dialog: dialog }\"></container>\r\n </fd-dialog-footer>\r\n </fd-dialog>\r\n</ng-template>\r\n<ng-template #footerButtons let-dialog=\"dialog\">\r\n <fd-button-bar [label]=\"'Ok' | bbbTranslate\" fdType=\"emphasized\" (click)=\"onOk(popover, dialog)\"></fd-button-bar>\r\n <fd-button-bar\r\n [label]=\"'Clear' | bbbTranslate\"\r\n fdType=\"standard\"\r\n (click)=\"onClear(popover, dialog)\"\r\n ></fd-button-bar>\r\n <fd-button-bar [label]=\"'Cancel' | bbbTranslate\" (click)=\"onCancel(popover, dialog)\"></fd-button-bar>\r\n</ng-template>\r\n<ng-template\r\n #month\r\n let-selectedMonth\r\n let-width=\"width\"\r\n let-height=\"height\"\r\n let-rtl=\"rtl\"\r\n let-today=\"today\"\r\n let-showEvents=\"showEvents\"\r\n let-deviceSize=\"deviceSize\"\r\n let-popover=\"popover\"\r\n let-dialog=\"dialog\"\r\n>\r\n @if (showDate) {\r\n <fd-toolbar [fdType]=\"'transparent'\">\r\n <button\r\n fd-button\r\n fd-toolbar-item\r\n [label]=\"(showDate ? 'DateR_Today' : 'Now') | bbbTranslate\"\r\n (click)=\"onToday()\"\r\n ></button>\r\n @if (showDate) {\r\n <button\r\n fd-button\r\n fd-toolbar-item\r\n [fdType]=\"'transparent'\"\r\n [glyph]=\"rtl ? 'navigation-right-arrow' : 'navigation-left-arrow'\"\r\n (click)=\"onPrevTap()\"\r\n ></button>\r\n } @if (showDate) {\r\n <button\r\n fd-button\r\n fd-toolbar-item\r\n [fdType]=\"'transparent'\"\r\n [glyph]=\"rtl ? 'navigation-left-arrow' : 'navigation-right-arrow'\"\r\n (click)=\"onNextTap()\"\r\n ></button>\r\n } @if (showDate) {\r\n <div class=\"month-years-wrapper\" fd-title fd-toolbar-item>\r\n @if (selectionMode === 'day' || selectionMode === 'month') {\r\n <button\r\n fd-button\r\n [fdType]=\"'transparent'\"\r\n [label]=\"selectedMonth.dateInfo.monthName\"\r\n (click)=\"selectionMode = 'month'\"\r\n ></button>\r\n }\r\n <button\r\n fd-button\r\n [fdType]=\"'transparent'\"\r\n [label]=\"selectedMonth.dateInfo.year\"\r\n (click)=\"selectionMode = 'year'\"\r\n ></button>\r\n </div>\r\n }\r\n </fd-toolbar>\r\n }\r\n <div style=\"display: flex\">\r\n @switch (selectionMode) { @case ('month') {\r\n <div class=\"month-year-selection-wrapper\">\r\n @for (month of months; track month; let i = $index) {\r\n <button\r\n style=\"flex-grow: 1; width: 33%\"\r\n fd-button\r\n [fdType]=\"selectedMonth.dateInfo.monthName === month ? 'emphasized' : 'transparent'\"\r\n [label]=\"month\"\r\n (click)=\"selectionMode = 'day'; onMonthSelected(month, i)\"\r\n ></button>\r\n }\r\n </div>\r\n } @case ('year') {\r\n <div class=\"month-year-selection-wrapper\">\r\n @for (year of years; track year) {\r\n <button\r\n style=\"flex-grow: 1; width: 25%\"\r\n fd-button\r\n [fdType]=\"selectedMonth.dateInfo.year === +year ? 'emphasized' : 'transparent'\"\r\n [label]=\"year\"\r\n (click)=\"selectionMode = 'day'; onYearSelected(year)\"\r\n ></button>\r\n }\r\n </div>\r\n } @default {\r\n <div style=\"display: flex\">\r\n @if (showDate) {\r\n <bc-calendar-month\r\n [style.width]=\"width\"\r\n [containerHeight]=\"height\"\r\n [containerWidth]=\"width\"\r\n [rtl]=\"rtl\"\r\n [monthWeeksCount]=\"selectedMonth.weeksCount\"\r\n [weekDays]=\"weekDays\"\r\n [weekDaysMin]=\"weekDaysMin\"\r\n [today]=\"today\"\r\n [datePicker]=\"true\"\r\n [dateRange]=\"true\"\r\n [selectedDate]=\"startSelectedDay ? startSelectedDay.date : value\"\r\n [days]=\"selectedMonth.days\"\r\n [deviceSize]=\"deviceSize\"\r\n (dayClick)=\"onDayClick($event, popover, dialog)\"\r\n ></bc-calendar-month>\r\n }\r\n <div class=\"seperator\"></div>\r\n @if (showTime) {\r\n <div>\r\n <fd-time\r\n style=\"direction: ltr\"\r\n fdCompact\r\n [keepTwoDigits]=\"true\"\r\n [(ngModel)]=\"timeValue\"\r\n [displaySeconds]=\"false\"\r\n ></fd-time>\r\n <div style=\"display: flex; gap: 0.2rem; padding: 0.5rem\">\r\n <input\r\n fd-form-control\r\n class=\"remove-arrow\"\r\n style=\"width: 3rem\"\r\n [value]=\"timeValue?.minute\"\r\n type=\"number\"\r\n maxValue=\"23\"\r\n (input)=\"onMinuteTextChange($event)\"\r\n />\r\n <input\r\n fd-form-control\r\n style=\"width: 3rem\"\r\n class=\"remove-arrow\"\r\n [value]=\"timeValue?.hour\"\r\n type=\"number\"\r\n maxValue=\"59\"\r\n (input)=\"onHourTextChange($event)\"\r\n />\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n } }\r\n </div>\r\n</ng-template>\r\n", styles: [":host{display:block}fd-popover{display:block}fd-input-group ::ng-deep input{direction:ltr}fd-time ::ng-deep .fd-time{padding-top:0}.seperator{border-left:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9)}\n"] }]
|
|
1919
|
+
], standalone: false, template: "@if (inlineMode) {\r\n<ng-container\r\n *ngTemplateOutlet=\"\r\n daterangeMode ? dateRangeTpl : month;\r\n context: {\r\n $implicit: selectedMonth$ | async,\r\n width: width$ | async,\r\n height: height,\r\n rtl: rtl$ | async,\r\n weekDays: weekDays,\r\n weekDaysMin: weekDaysMin,\r\n today: today,\r\n deviceSize: deviceSize,\r\n popover: popover\r\n }\r\n \"\r\n>\r\n</ng-container>\r\n}\r\n<ng-template #dateRangeTpl>\r\n <bc-calendar-selection-days\r\n fd-toolbar-item\r\n [inline]=\"true\"\r\n [monthInfo]=\"(selectedMonth$ | async)!!\"\r\n (rangeChange)=\"onRangeChange($event)\"\r\n ></bc-calendar-selection-days>\r\n</ng-template>\r\n<fd-input-group\r\n placement=\"after\"\r\n glyph=\"calendar\"\r\n glyphAriaLabel=\"select day\"\r\n ariaLabelledBy=\"fd-input-group-icon-label-2\"\r\n [placeholder]=\"placeholder\"\r\n [value]=\"value\"\r\n [button]=\"true\"\r\n [state]=\"isValid ? 'success' : 'error'\"\r\n [showFocus]=\"true\"\r\n [disabled]=\"disabled\"\r\n [readonly]=\"readonly\"\r\n [style.display]=\"!buttonMenuMode || inlineMode ? 'inherit' : 'none'\"\r\n (addOnButtonClicked)=\"onOpenPopover(popover, dialogTemplate)\"\r\n>\r\n</fd-input-group>\r\n@if (buttonMenuMode) {\r\n<button\r\n fd-button\r\n [label]=\"tempFormmatedDate || placeholder\"\r\n [title]=\"placeholder\"\r\n [fdType]=\"value ? 'standard' : 'transparent'\"\r\n [fdMenu]=\"true\"\r\n (click)=\"onOpenPopover(popover, dialogTemplate)\"\r\n [class.placeholder-custom]=\"!value\"\r\n class=\"menu-button-datepicker\"\r\n></button>\r\n}\r\n\r\n<fd-popover #popover (isOpenChange)=\"onPopoverOpenChange($event)\" [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\r\n <fd-popover-body [style.width.px]=\"width$ | async\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n daterangeMode ? dateRangeTpl : month;\r\n context: {\r\n $implicit: selectedMonth$ | async,\r\n width: width$ | async,\r\n height: height,\r\n rtl: rtl$ | async,\r\n weekDays: weekDays,\r\n weekDaysMin: weekDaysMin,\r\n today: today,\r\n deviceSize: deviceSize,\r\n popover: popover\r\n }\r\n \"\r\n >\r\n </ng-container>\r\n <div fd-popover-body-footer>\r\n <div fd-bar [barDesign]=\"'footer'\">\r\n <div fd-bar-right>\r\n <container *ngTemplateOutlet=\"footerButtons\"></container>\r\n </div>\r\n </div>\r\n </div>\r\n </fd-popover-body>\r\n</fd-popover>\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\r\n <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n <fd-dialog-body>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n month;\r\n context: {\r\n $implicit: selectedMonth$ | async,\r\n width: width$ | async,\r\n height: height,\r\n rtl: rtl$ | async,\r\n weekDays: weekDays,\r\n weekDaysMin: weekDaysMin,\r\n today: today,\r\n deviceSize: deviceSize,\r\n popover: popover,\r\n dialog: dialog\r\n }\r\n \"\r\n >\r\n </ng-container>\r\n </fd-dialog-body>\r\n <fd-dialog-footer>\r\n <container *ngTemplateOutlet=\"footerButtons; context: { dialog: dialog }\"></container>\r\n </fd-dialog-footer>\r\n </fd-dialog>\r\n</ng-template>\r\n<ng-template #footerButtons let-dialog=\"dialog\">\r\n <fd-button-bar [label]=\"'Ok' | bbbTranslate\" fdType=\"emphasized\" (click)=\"onOk(popover, dialog)\"></fd-button-bar>\r\n <fd-button-bar\r\n [label]=\"'Clear' | bbbTranslate\"\r\n fdType=\"standard\"\r\n (click)=\"onClear(popover, dialog)\"\r\n ></fd-button-bar>\r\n <fd-button-bar [label]=\"'Cancel' | bbbTranslate\" (click)=\"onCancel(popover, dialog)\"></fd-button-bar>\r\n</ng-template>\r\n<ng-template\r\n #month\r\n let-selectedMonth\r\n let-width=\"width\"\r\n let-height=\"height\"\r\n let-rtl=\"rtl\"\r\n let-today=\"today\"\r\n let-showEvents=\"showEvents\"\r\n let-deviceSize=\"deviceSize\"\r\n let-popover=\"popover\"\r\n let-dialog=\"dialog\"\r\n>\r\n @if (showDate) {\r\n <fd-toolbar [fdType]=\"'transparent'\">\r\n <button\r\n fd-button\r\n fd-toolbar-item\r\n [label]=\"(showDate ? 'DateR_Today' : 'Now') | bbbTranslate\"\r\n (click)=\"onToday()\"\r\n ></button>\r\n <button\r\n fd-button\r\n fd-toolbar-item\r\n [fdType]=\"'transparent'\"\r\n [glyph]=\"rtl ? 'navigation-right-arrow' : 'navigation-left-arrow'\"\r\n (click)=\"onPrevTap()\"\r\n ></button>\r\n\r\n <button\r\n fd-button\r\n fd-toolbar-item\r\n [fdType]=\"'transparent'\"\r\n [glyph]=\"rtl ? 'navigation-left-arrow' : 'navigation-right-arrow'\"\r\n (click)=\"onNextTap()\"\r\n ></button>\r\n <div class=\"month-years-wrapper\" fd-title fd-toolbar-item>\r\n @if (selectionMode === 'day' || selectionMode === 'month') {\r\n <button\r\n fd-button\r\n [fdType]=\"'transparent'\"\r\n [label]=\"selectedMonth.dateInfo.monthName\"\r\n (click)=\"selectionMode = 'month'\"\r\n ></button>\r\n }\r\n <button\r\n fd-button\r\n [fdType]=\"'transparent'\"\r\n [label]=\"selectedMonth.dateInfo.year\"\r\n (click)=\"selectionMode = 'year'\"\r\n ></button>\r\n </div>\r\n <fd-split-button\r\n fd-toolbar-item\r\n [fixedWidth]=\"false\"\r\n [mainAction]=\"{\r\n mainActionTitle: culture === 'fa-IR' ? ('Shamsi' | bbbTranslate) : ('Gregorian' | bbbTranslate),\r\n keepMainAction: false\r\n }\"\r\n >\r\n <fd-menu>\r\n @for(culture of supportCultureTypes | keyvalue;track culture){\r\n <li fd-menu-item (click)=\"onCultureChange(culture.key)\">\r\n <div fd-menu-interactive>\r\n <span fd-menu-title>{{ culture.value }}</span>\r\n </div>\r\n </li>\r\n }\r\n </fd-menu>\r\n </fd-split-button>\r\n </fd-toolbar>\r\n }\r\n <div style=\"display: flex\">\r\n @switch (selectionMode) { @case ('month') {\r\n <div class=\"month-year-selection-wrapper\">\r\n @for (month of months; track month; let i = $index) {\r\n <button\r\n style=\"flex-grow: 1; width: 33%\"\r\n fd-button\r\n [fdType]=\"selectedMonth.dateInfo.monthName === month ? 'emphasized' : 'transparent'\"\r\n [label]=\"month\"\r\n (click)=\"selectionMode = 'day'; onMonthSelected(month, i)\"\r\n ></button>\r\n }\r\n </div>\r\n } @case ('year') {\r\n <div class=\"month-year-selection-wrapper\">\r\n @for (year of years; track year) {\r\n <button\r\n style=\"flex-grow: 1; width: 25%\"\r\n fd-button\r\n [fdType]=\"selectedMonth.dateInfo.year === +year ? 'emphasized' : 'transparent'\"\r\n [label]=\"year\"\r\n (click)=\"selectionMode = 'day'; onYearSelected(year)\"\r\n ></button>\r\n }\r\n </div>\r\n } @default {\r\n <div style=\"display: flex\">\r\n @if (showDate) {\r\n <bc-calendar-month\r\n [style.width]=\"width\"\r\n [containerHeight]=\"height\"\r\n [containerWidth]=\"width\"\r\n [rtl]=\"rtl\"\r\n [monthWeeksCount]=\"selectedMonth.weeksCount\"\r\n [weekDays]=\"weekDays\"\r\n [weekDaysMin]=\"weekDaysMin\"\r\n [today]=\"today\"\r\n [datePicker]=\"true\"\r\n [dateRange]=\"true\"\r\n [selectedDate]=\"startSelectedDay ? startSelectedDay.date : value\"\r\n [days]=\"selectedMonth.days\"\r\n [deviceSize]=\"deviceSize\"\r\n (dayClick)=\"onDayClick($event, popover, dialog)\"\r\n ></bc-calendar-month>\r\n }\r\n <div class=\"seperator\"></div>\r\n @if (showTime) {\r\n <div>\r\n <fd-time\r\n style=\"direction: ltr\"\r\n fdCompact\r\n [keepTwoDigits]=\"true\"\r\n [(ngModel)]=\"timeValue\"\r\n [displaySeconds]=\"false\"\r\n ></fd-time>\r\n <div style=\"display: flex; gap: 0.2rem; padding: 0.5rem\">\r\n <input\r\n fd-form-control\r\n class=\"remove-arrow\"\r\n style=\"width: 3rem\"\r\n [value]=\"timeValue?.minute\"\r\n type=\"number\"\r\n maxValue=\"23\"\r\n (input)=\"onMinuteTextChange($event)\"\r\n />\r\n <input\r\n fd-form-control\r\n style=\"width: 3rem\"\r\n class=\"remove-arrow\"\r\n [value]=\"timeValue?.hour\"\r\n type=\"number\"\r\n maxValue=\"59\"\r\n (input)=\"onHourTextChange($event)\"\r\n />\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n } }\r\n </div>\r\n</ng-template>\r\n", styles: [":host{display:block}fd-popover{display:block}fd-input-group ::ng-deep input{direction:ltr}fd-time ::ng-deep .fd-time{padding-top:0}.seperator{border-left:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9)}\n"] }]
|
|
1927
1920
|
}], ctorParameters: () => [], propDecorators: { placeholder: [{
|
|
1928
1921
|
type: Input
|
|
1929
|
-
}],
|
|
1922
|
+
}], calendarType: [{
|
|
1930
1923
|
type: Input
|
|
1931
1924
|
}], formatPattern: [{
|
|
1932
1925
|
type: Input
|
|
@@ -1960,6 +1953,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
|
|
|
1960
1953
|
type: Input
|
|
1961
1954
|
}], daterangeMode: [{
|
|
1962
1955
|
type: Input
|
|
1956
|
+
}], culture: [{
|
|
1957
|
+
type: Input
|
|
1963
1958
|
}], rangeChange: [{
|
|
1964
1959
|
type: Output
|
|
1965
1960
|
}], valueChange: [{
|
|
@@ -2203,7 +2198,7 @@ class CalendarHeaderComponent extends BaseComponent {
|
|
|
2203
2198
|
}
|
|
2204
2199
|
onPrint() { }
|
|
2205
2200
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CalendarHeaderComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
2206
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: CalendarHeaderComponent, isStandalone: false, selector: "bc-calendar-header", inputs: { monthInfo: "monthInfo", weekModeDays: "weekModeDays", hideMode: "hideMode", modeTitle: "modeTitle", title: "title", deviceSize: "deviceSize", rtl: "rtl", mode: "mode" }, outputs: { prevTap: "prevTap", nextTap: "nextTap", modeChange: "modeChange", rangeChange: "rangeChange", today: "today" }, usesInheritance: true, ngImport: i0, template: "<fd-toolbar [shouldOverflow]=\"true\" [fdType]=\"'transparent'\" [class.rtl]=\"rtl\">\r\n <button fd-button fd-toolbar-item [label]=\"'DateR_Today' | bbbTranslate\" (click)=\"today.emit()\"></button>\r\n <button\r\n fd-button\r\n fdType=\"transparent\"\r\n fd-toolbar-item\r\n [glyph]=\"rtl ? 'navigation-right-arrow' : 'navigation-left-arrow'\"\r\n (click)=\"prevTap.emit()\"\r\n ></button>\r\n <button\r\n fd-button\r\n fdType=\"transparent\"\r\n fd-toolbar-item\r\n [glyph]=\"rtl ? 'navigation-left-arrow' : 'navigation-right-arrow'\"\r\n (click)=\"nextTap.emit()\"\r\n ></button>\r\n <h3 fd-title fd-toolbar-item>{{ title }}</h3>\r\n <fd-toolbar-spacer></fd-toolbar-spacer>\r\n <!-- <button fd-button fd-toolbar-item glyph=\"print\" (click)=\"onPrint()\" fdType=\"transparent\"></button> -->\r\n @if (deviceSize === 's' || deviceSize === 'm') {\r\n <bc-calendar-selection-days\r\n fd-toolbar-item\r\n [monthInfo]=\"monthInfo\"\r\n (rangeChange)=\"onRangeChange($event)\"\r\n ></bc-calendar-selection-days>\r\n } @if (!hideMode) {\r\n <fd-split-button\r\n fd-toolbar-item\r\n [fixedWidth]=\"false\"\r\n [mainAction]=\"{\r\n mainActionTitle: modeTitle,\r\n keepMainAction: true\r\n }\"\r\n >\r\n <fd-menu #menu>\r\n <li fd-menu-item (click)=\"onModeChange(menu, 'day')\" bodyClick>\r\n <div fd-menu-interactive>\r\n <span fd-menu-title>{{ 'Day' | bbbTranslate }}</span>\r\n </div>\r\n </li>\r\n <li fd-menu-item (click)=\"onModeChange(menu, 'week')\" bodyClick>\r\n <div fd-menu-interactive>\r\n <span fd-menu-title>{{ 'Week' | bbbTranslate }} </span>\r\n </div>\r\n </li>\r\n <li fd-menu-item (click)=\"onModeChange(menu, 'month')\" bodyClick>\r\n <div fd-menu-interactive>\r\n <span fd-menu-title>{{ 'Month' | bbbTranslate }}</span>\r\n </div>\r\n </li>\r\n <!-- <li fd-menu-item (click)=\"onModeChange('year')\">\r\n <div fd-menu-interactive>\r\n <span fd-menu-title>{{ \"Year\" | bbbTranslate }}</span>\r\n </div>\r\n </li> -->\r\n </fd-menu>\r\n </fd-split-button>\r\n }\r\n</fd-toolbar>\r\n", styles: [":host{display:block;background-color:var(--sapList_Background, #fff)}:host ::ng-deep span.fd-toolbar__spacer{display:none}:host ::ng-deep fd-toolbar .fd-toolbar{border:none;border-left:1px solid var(--sapList_BorderColor, #e5e5e5)}:host ::ng-deep fd-toolbar.rtl .fd-toolbar{border-left:none;border-right:1px solid var(--sapList_BorderColor, #e5e5e5)}\n"], dependencies: [{ kind: "directive", type: i2$1.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type:
|
|
2201
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: CalendarHeaderComponent, isStandalone: false, selector: "bc-calendar-header", inputs: { monthInfo: "monthInfo", weekModeDays: "weekModeDays", hideMode: "hideMode", modeTitle: "modeTitle", title: "title", deviceSize: "deviceSize", rtl: "rtl", mode: "mode" }, outputs: { prevTap: "prevTap", nextTap: "nextTap", modeChange: "modeChange", rangeChange: "rangeChange", today: "today" }, usesInheritance: true, ngImport: i0, template: "<fd-toolbar [shouldOverflow]=\"true\" [fdType]=\"'transparent'\" [class.rtl]=\"rtl\">\r\n <button fd-button fd-toolbar-item [label]=\"'DateR_Today' | bbbTranslate\" (click)=\"today.emit()\"></button>\r\n <button\r\n fd-button\r\n fdType=\"transparent\"\r\n fd-toolbar-item\r\n [glyph]=\"rtl ? 'navigation-right-arrow' : 'navigation-left-arrow'\"\r\n (click)=\"prevTap.emit()\"\r\n ></button>\r\n <button\r\n fd-button\r\n fdType=\"transparent\"\r\n fd-toolbar-item\r\n [glyph]=\"rtl ? 'navigation-left-arrow' : 'navigation-right-arrow'\"\r\n (click)=\"nextTap.emit()\"\r\n ></button>\r\n <h3 fd-title fd-toolbar-item>{{ title }}</h3>\r\n <fd-toolbar-spacer></fd-toolbar-spacer>\r\n <!-- <button fd-button fd-toolbar-item glyph=\"print\" (click)=\"onPrint()\" fdType=\"transparent\"></button> -->\r\n @if (deviceSize === 's' || deviceSize === 'm') {\r\n <bc-calendar-selection-days\r\n fd-toolbar-item\r\n [monthInfo]=\"monthInfo\"\r\n (rangeChange)=\"onRangeChange($event)\"\r\n ></bc-calendar-selection-days>\r\n } @if (!hideMode) {\r\n <fd-split-button\r\n fd-toolbar-item\r\n [fixedWidth]=\"false\"\r\n [mainAction]=\"{\r\n mainActionTitle: modeTitle,\r\n keepMainAction: true\r\n }\"\r\n >\r\n <fd-menu #menu>\r\n <li fd-menu-item (click)=\"onModeChange(menu, 'day')\" bodyClick>\r\n <div fd-menu-interactive>\r\n <span fd-menu-title>{{ 'Day' | bbbTranslate }}</span>\r\n </div>\r\n </li>\r\n <li fd-menu-item (click)=\"onModeChange(menu, 'week')\" bodyClick>\r\n <div fd-menu-interactive>\r\n <span fd-menu-title>{{ 'Week' | bbbTranslate }} </span>\r\n </div>\r\n </li>\r\n <li fd-menu-item (click)=\"onModeChange(menu, 'month')\" bodyClick>\r\n <div fd-menu-interactive>\r\n <span fd-menu-title>{{ 'Month' | bbbTranslate }}</span>\r\n </div>\r\n </li>\r\n <!-- <li fd-menu-item (click)=\"onModeChange('year')\">\r\n <div fd-menu-interactive>\r\n <span fd-menu-title>{{ \"Year\" | bbbTranslate }}</span>\r\n </div>\r\n </li> -->\r\n </fd-menu>\r\n </fd-split-button>\r\n }\r\n</fd-toolbar>\r\n", styles: [":host{display:block;background-color:var(--sapList_Background, #fff)}:host ::ng-deep span.fd-toolbar__spacer{display:none}:host ::ng-deep fd-toolbar .fd-toolbar{border:none;border-left:1px solid var(--sapList_BorderColor, #e5e5e5)}:host ::ng-deep fd-toolbar.rtl .fd-toolbar{border-left:none;border-right:1px solid var(--sapList_BorderColor, #e5e5e5)}\n"], dependencies: [{ kind: "directive", type: i2$1.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i9.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i9.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i9.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i9.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i4$2.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i13.SplitButtonComponent, selector: "fd-split-button", inputs: ["glyph", "glyphFont", "disabled", "fdType", "expandButtonTitle", "selected", "fixedWidth", "mainAction", "arialLabel"], outputs: ["primaryButtonClicked"] }, { kind: "component", type: i6$1.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i6$1.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i6$1.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: CalendarSelectionDaysComponent, selector: "bc-calendar-selection-days", inputs: ["startSelectedDayIndex", "endSelectedDayIndex", "monthInfo", "inline"], outputs: ["rangeChange"] }, { kind: "pipe", type: i2$1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2207
2202
|
}
|
|
2208
2203
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CalendarHeaderComponent, decorators: [{
|
|
2209
2204
|
type: Component,
|
|
@@ -2725,7 +2720,7 @@ class CalendarContainerComponent extends ReportViewBaseComponent {
|
|
|
2725
2720
|
useFactory: getDateService,
|
|
2726
2721
|
deps: [LogService]
|
|
2727
2722
|
}
|
|
2728
|
-
], viewQueries: [{ propertyName: "_divRef", first: true, predicate: ["divRef"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div style=\"display: flex; width: 100%; height: 100%; flex-direction: row\">\r\n @if (deviceSize !== 's' && deviceSize !== 'm') {\r\n <div style=\"width: 320px; height: 100%\">\r\n <bc-calendar-selection-days\r\n [inline]=\"true\"\r\n [monthInfo]=\"(selectedMonth$ | async)!!\"\r\n (rangeChange)=\"onRangeChange($event)\"\r\n ></bc-calendar-selection-days>\r\n <div style=\"height: 1px; background: #ccc\"></div>\r\n @if (userCalendars?.Data?.MoDataList?.length) {\r\n <div>\r\n <h4>\u062A\u0642\u0648\u06CC\u0645\u200C\u0647\u0627\u06CC\u200C\u0645\u0646</h4>\r\n @for (calendar of userCalendars.Data.MoDataList; track calendar) {\r\n <ul fd-list>\r\n <li fd-list-item style=\"padding: 0\" class=\"user-calendar\">\r\n <span\r\n [style.background]=\"calendar.Color ? calendar.Color : null\"\r\n style=\"width: 5px; height: 100%; position: absolute\"\r\n ></span>\r\n <fd-checkbox\r\n [(ngModel)]=\"calendar.$IsChecked\"\r\n (change)=\"onCalendarCheckChange(calendar)\"\r\n ></fd-checkbox>\r\n <span fd-list-title>{{ calendar.$Caption }}</span>\r\n </li>\r\n </ul>\r\n }\r\n </div>\r\n }\r\n </div>\r\n }\r\n <div style=\"flex: 1\" #divRef>\r\n <bc-calendar-header\r\n [monthInfo]=\"(selectedMonth$ | async)!!\"\r\n [weekModeDays]=\"(weekModeDays$ | async)!!\"\r\n [rtl]=\"rtl\"\r\n [deviceSize]=\"deviceSize\"\r\n [mode]=\"(mode$ | async)!!\"\r\n [modeTitle]=\"(modeTitle$ | async)!!\"\r\n [title]=\"(title$ | async)!!\"\r\n (modeChange)=\"onModeChange($event)\"\r\n (prevTap)=\"onPrevTap()\"\r\n (nextTap)=\"onNextTap()\"\r\n (today)=\"onToday()\"\r\n (rangeChange)=\"onRangeChange($event)\"\r\n >\r\n </bc-calendar-header>\r\n @switch (mode$ | async) { @case ('week') {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n weekCalendar;\r\n context: {\r\n $implicit: selectedMonth$ | async,\r\n moDataList: eventMoDataList$ | async,\r\n width: width,\r\n height: height,\r\n rtl: rtl,\r\n showEvents: showEvents,\r\n weekModeDays: weekModeDays$ | async,\r\n today: today,\r\n deviceSize: deviceSize,\r\n calendarFields: calendarFields,\r\n access: access\r\n }\r\n \"\r\n ></ng-container>\r\n } @case ('day') {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n weekCalendar;\r\n context: {\r\n $implicit: selectedMonth$ | async,\r\n moDataList: eventMoDataList$ | async,\r\n width: width,\r\n height: height,\r\n rtl: rtl,\r\n showEvents: showEvents,\r\n weekModeDays: weekModeDays$ | async,\r\n today: today,\r\n deviceSize: deviceSize,\r\n calendarFields: calendarFields,\r\n access: access\r\n }\r\n \"\r\n ></ng-container>\r\n } @case ('list') { } @default {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n monthCalendar;\r\n context: {\r\n $implicit: days$ | async,\r\n moDataList: eventMoDataList$ | async,\r\n width: width,\r\n height: height,\r\n rtl: rtl,\r\n showEvents: showEvents,\r\n today: today,\r\n deviceSize: deviceSize,\r\n calendarFields: calendarFields,\r\n monthWeeksCount: monthWeeksCount$ | async,\r\n access: access\r\n }\r\n \"\r\n ></ng-container>\r\n } }\r\n </div>\r\n</div>\r\n<ng-template\r\n #monthCalendar\r\n let-days\r\n let-moDataList=\"moDataList\"\r\n let-width=\"width\"\r\n let-height=\"height\"\r\n let-calendarFields=\"calendarFields\"\r\n let-rtl=\"rtl\"\r\n let-today=\"today\"\r\n let-showEvents=\"showEvents\"\r\n let-deviceSize=\"deviceSize\"\r\n let-monthWeeksCount=\"monthWeeksCount\"\r\n let-access=\"access\"\r\n>\r\n <bc-calendar-month\r\n [style.width]=\"width\"\r\n [containerHeight]=\"parentHeight !== 0 ? parentHeight : height\"\r\n [containerWidth]=\"width\"\r\n [calendarFields]=\"calendarFields\"\r\n [moDataList]=\"moDataList\"\r\n [monthWeeksCount]=\"monthWeeksCount\"\r\n [rtl]=\"rtl\"\r\n [weekDays]=\"weekDays\"\r\n [weekDaysMin]=\"weekDaysMin\"\r\n [today]=\"today\"\r\n [showEvents]=\"showEvents\"\r\n [days]=\"days\"\r\n [canView]=\"access.View\"\r\n [canAdd]=\"access.Add\"\r\n [canEdit]=\"access.Edit\"\r\n [canDelete]=\"access.Delete\"\r\n [deviceSize]=\"deviceSize\"\r\n (dayClick)=\"onDayClick($event)\"\r\n (showEvent)=\"onShowTask()\"\r\n (deleteEvent)=\"deleteTask.emit($event)\"\r\n (editEvent)=\"editTask.emit($event)\"\r\n (daySelect)=\"daySelect.emit($event)\"\r\n ></bc-calendar-month>\r\n</ng-template>\r\n\r\n<ng-template #listCalendar>\r\n <bc-calendar-list-container\r\n [showEvents]=\"showEvents\"\r\n [selectedDay]=\"selectedDay\"\r\n [calendarFields]=\"calendarFields\"\r\n (showEventsTap)=\"showEvents = !showEvents\"\r\n ></bc-calendar-list-container>\r\n</ng-template>\r\n\r\n<ng-template\r\n #weekCalendar\r\n let-selectedMonth\r\n let-moDataList=\"moDataList\"\r\n let-width=\"width\"\r\n let-height=\"height\"\r\n let-calendarFields=\"calendarFields\"\r\n let-rtl=\"rtl\"\r\n let-today=\"today\"\r\n let-showEvents=\"showEvents\"\r\n let-deviceSize=\"deviceSize\"\r\n let-weekModeDays=\"weekModeDays\"\r\n let-access=\"access\"\r\n>\r\n <bc-calendar-week\r\n [style.width]=\"width\"\r\n [containerHeight]=\"parentHeight !== 0 ? parentHeight : height\"\r\n [containerWidth]=\"width\"\r\n [inDialog]=\"inDialog\"\r\n [calendarFields]=\"calendarFields\"\r\n [moDataList]=\"moDataList\"\r\n [rtl]=\"rtl\"\r\n [canAdd]=\"access.Add\"\r\n [canView]=\"access.View\"\r\n [canEdit]=\"access.Edit\"\r\n [canDelete]=\"access.Delete\"\r\n [weekDays]=\"weekDays\"\r\n [weekDaysMin]=\"weekDaysMin\"\r\n [today]=\"today\"\r\n [showEvents]=\"showEvents\"\r\n [days]=\"weekModeDays\"\r\n [deviceSize]=\"deviceSize\"\r\n (dayClick)=\"onDayClick($event)\"\r\n (showEvent)=\"onShowTask()\"\r\n (deleteEvent)=\"deleteTask.emit($event)\"\r\n (editEvent)=\"editTask.emit($event)\"\r\n (daySelect)=\"daySelect.emit($event)\"\r\n (rangeSelect)=\"onRangeSelect($event)\"\r\n ></bc-calendar-week>\r\n</ng-template>\r\n", styles: [":host{display:block;width:100%;height:100%}:host ::ng-deep li.user-calendar .fd-list__form-item{padding:.5rem}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$3.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "readonly", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i4$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i4$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"] }, { kind: "directive", type: i4$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "component", type: CalendarListContainerComponent, selector: "bc-calendar-list-container", inputs: ["view", "reportItemComponentName", "showEvents", "selectedDay", "calendarFields"], outputs: ["showEventsTap"] }, { kind: "component", type: CalendarWeekComponent, selector: "bc-calendar-week", inputs: ["weekDays", "weekDaysMin", "today", "containerHeight", "calendarFields", "rtl", "inDialog", "deviceSize", "moDataList", "days", "canDelete", "canAdd", "canEdit", "canView"], outputs: ["editEvent", "deleteEvent", "showEvent", "rangeSelect", "daySelect", "dayClick"] }, { kind: "component", type: CalendarMonthComponent, selector: "bc-calendar-month", inputs: ["monthWeeksCount", "weekDays", "weekDaysMin", "today", "containerHeight", "days", "calendarFields", "rtl", "deviceSize", "moDataList", "datePicker", "rangePicker", "canDelete", "canAdd", "canEdit", "canView", "selectedDate", "startSelectedDayIndex", "endSelectedDayIndex"], outputs: ["editEvent", "deleteEvent", "daySelect", "dayClick", "dayMouseMove", "dayMouseUp", "dayMouseDown", "showEvent"] }, { kind: "component", type: CalendarHeaderComponent, selector: "bc-calendar-header", inputs: ["monthInfo", "weekModeDays", "hideMode", "modeTitle", "title", "deviceSize", "rtl", "mode"], outputs: ["prevTap", "nextTap", "modeChange", "rangeChange", "today"] }, { kind: "component", type: CalendarSelectionDaysComponent, selector: "bc-calendar-selection-days", inputs: ["startSelectedDayIndex", "endSelectedDayIndex", "monthInfo", "inline"], outputs: ["rangeChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2723
|
+
], viewQueries: [{ propertyName: "_divRef", first: true, predicate: ["divRef"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div style=\"display: flex; width: 100%; height: 100%; flex-direction: row\">\r\n @if (deviceSize !== 's' && deviceSize !== 'm') {\r\n <div style=\"width: 320px; height: 100%\">\r\n <bc-calendar-selection-days\r\n [inline]=\"true\"\r\n [monthInfo]=\"(selectedMonth$ | async)!!\"\r\n (rangeChange)=\"onRangeChange($event)\"\r\n ></bc-calendar-selection-days>\r\n <div style=\"height: 1px; background: #ccc\"></div>\r\n @if (userCalendars?.Data?.MoDataList?.length) {\r\n <div>\r\n <h4>\u062A\u0642\u0648\u06CC\u0645\u200C\u0647\u0627\u06CC\u200C\u0645\u0646</h4>\r\n @for (calendar of userCalendars.Data.MoDataList; track calendar) {\r\n <ul fd-list>\r\n <li fd-list-item style=\"padding: 0\" class=\"user-calendar\">\r\n <span\r\n [style.background]=\"calendar.Color ? calendar.Color : null\"\r\n style=\"width: 5px; height: 100%; position: absolute\"\r\n ></span>\r\n <fd-checkbox\r\n [(ngModel)]=\"calendar.$IsChecked\"\r\n (change)=\"onCalendarCheckChange(calendar)\"\r\n ></fd-checkbox>\r\n <span fd-list-title>{{ calendar.$Caption }}</span>\r\n </li>\r\n </ul>\r\n }\r\n </div>\r\n }\r\n </div>\r\n }\r\n <div style=\"flex: 1\" #divRef>\r\n <bc-calendar-header\r\n [monthInfo]=\"(selectedMonth$ | async)!!\"\r\n [weekModeDays]=\"(weekModeDays$ | async)!!\"\r\n [rtl]=\"rtl\"\r\n [deviceSize]=\"deviceSize\"\r\n [mode]=\"(mode$ | async)!!\"\r\n [modeTitle]=\"(modeTitle$ | async)!!\"\r\n [title]=\"(title$ | async)!!\"\r\n (modeChange)=\"onModeChange($event)\"\r\n (prevTap)=\"onPrevTap()\"\r\n (nextTap)=\"onNextTap()\"\r\n (today)=\"onToday()\"\r\n (rangeChange)=\"onRangeChange($event)\"\r\n >\r\n </bc-calendar-header>\r\n @switch (mode$ | async) { @case ('week') {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n weekCalendar;\r\n context: {\r\n $implicit: selectedMonth$ | async,\r\n moDataList: eventMoDataList$ | async,\r\n width: width,\r\n height: height,\r\n rtl: rtl,\r\n showEvents: showEvents,\r\n weekModeDays: weekModeDays$ | async,\r\n today: today,\r\n deviceSize: deviceSize,\r\n calendarFields: calendarFields,\r\n access: access\r\n }\r\n \"\r\n ></ng-container>\r\n } @case ('day') {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n weekCalendar;\r\n context: {\r\n $implicit: selectedMonth$ | async,\r\n moDataList: eventMoDataList$ | async,\r\n width: width,\r\n height: height,\r\n rtl: rtl,\r\n showEvents: showEvents,\r\n weekModeDays: weekModeDays$ | async,\r\n today: today,\r\n deviceSize: deviceSize,\r\n calendarFields: calendarFields,\r\n access: access\r\n }\r\n \"\r\n ></ng-container>\r\n } @case ('list') { } @default {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n monthCalendar;\r\n context: {\r\n $implicit: days$ | async,\r\n moDataList: eventMoDataList$ | async,\r\n width: width,\r\n height: height,\r\n rtl: rtl,\r\n showEvents: showEvents,\r\n today: today,\r\n deviceSize: deviceSize,\r\n calendarFields: calendarFields,\r\n monthWeeksCount: monthWeeksCount$ | async,\r\n access: access\r\n }\r\n \"\r\n ></ng-container>\r\n } }\r\n </div>\r\n</div>\r\n<ng-template\r\n #monthCalendar\r\n let-days\r\n let-moDataList=\"moDataList\"\r\n let-width=\"width\"\r\n let-height=\"height\"\r\n let-calendarFields=\"calendarFields\"\r\n let-rtl=\"rtl\"\r\n let-today=\"today\"\r\n let-showEvents=\"showEvents\"\r\n let-deviceSize=\"deviceSize\"\r\n let-monthWeeksCount=\"monthWeeksCount\"\r\n let-access=\"access\"\r\n>\r\n <bc-calendar-month\r\n [style.width]=\"width\"\r\n [containerHeight]=\"parentHeight !== 0 ? parentHeight : height\"\r\n [containerWidth]=\"width\"\r\n [calendarFields]=\"calendarFields\"\r\n [moDataList]=\"moDataList\"\r\n [monthWeeksCount]=\"monthWeeksCount\"\r\n [rtl]=\"rtl\"\r\n [weekDays]=\"weekDays\"\r\n [weekDaysMin]=\"weekDaysMin\"\r\n [today]=\"today\"\r\n [showEvents]=\"showEvents\"\r\n [days]=\"days\"\r\n [canView]=\"access.View\"\r\n [canAdd]=\"access.Add\"\r\n [canEdit]=\"access.Edit\"\r\n [canDelete]=\"access.Delete\"\r\n [deviceSize]=\"deviceSize\"\r\n (dayClick)=\"onDayClick($event)\"\r\n (showEvent)=\"onShowTask()\"\r\n (deleteEvent)=\"deleteTask.emit($event)\"\r\n (editEvent)=\"editTask.emit($event)\"\r\n (daySelect)=\"daySelect.emit($event)\"\r\n ></bc-calendar-month>\r\n</ng-template>\r\n\r\n<ng-template #listCalendar>\r\n <bc-calendar-list-container\r\n [showEvents]=\"showEvents\"\r\n [selectedDay]=\"selectedDay\"\r\n [calendarFields]=\"calendarFields\"\r\n (showEventsTap)=\"showEvents = !showEvents\"\r\n ></bc-calendar-list-container>\r\n</ng-template>\r\n\r\n<ng-template\r\n #weekCalendar\r\n let-selectedMonth\r\n let-moDataList=\"moDataList\"\r\n let-width=\"width\"\r\n let-height=\"height\"\r\n let-calendarFields=\"calendarFields\"\r\n let-rtl=\"rtl\"\r\n let-today=\"today\"\r\n let-showEvents=\"showEvents\"\r\n let-deviceSize=\"deviceSize\"\r\n let-weekModeDays=\"weekModeDays\"\r\n let-access=\"access\"\r\n>\r\n <bc-calendar-week\r\n [style.width]=\"width\"\r\n [containerHeight]=\"parentHeight !== 0 ? parentHeight : height\"\r\n [containerWidth]=\"width\"\r\n [inDialog]=\"inDialog\"\r\n [calendarFields]=\"calendarFields\"\r\n [moDataList]=\"moDataList\"\r\n [rtl]=\"rtl\"\r\n [canAdd]=\"access.Add\"\r\n [canView]=\"access.View\"\r\n [canEdit]=\"access.Edit\"\r\n [canDelete]=\"access.Delete\"\r\n [weekDays]=\"weekDays\"\r\n [weekDaysMin]=\"weekDaysMin\"\r\n [today]=\"today\"\r\n [showEvents]=\"showEvents\"\r\n [days]=\"weekModeDays\"\r\n [deviceSize]=\"deviceSize\"\r\n (dayClick)=\"onDayClick($event)\"\r\n (showEvent)=\"onShowTask()\"\r\n (deleteEvent)=\"deleteTask.emit($event)\"\r\n (editEvent)=\"editTask.emit($event)\"\r\n (daySelect)=\"daySelect.emit($event)\"\r\n (rangeSelect)=\"onRangeSelect($event)\"\r\n ></bc-calendar-week>\r\n</ng-template>\r\n", styles: [":host{display:block;width:100%;height:100%}:host ::ng-deep li.user-calendar .fd-list__form-item{padding:.5rem}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$2.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "readonly", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i4$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i4$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"] }, { kind: "directive", type: i4$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "component", type: CalendarListContainerComponent, selector: "bc-calendar-list-container", inputs: ["view", "reportItemComponentName", "showEvents", "selectedDay", "calendarFields"], outputs: ["showEventsTap"] }, { kind: "component", type: CalendarWeekComponent, selector: "bc-calendar-week", inputs: ["weekDays", "weekDaysMin", "today", "containerHeight", "calendarFields", "rtl", "inDialog", "deviceSize", "moDataList", "days", "canDelete", "canAdd", "canEdit", "canView"], outputs: ["editEvent", "deleteEvent", "showEvent", "rangeSelect", "daySelect", "dayClick"] }, { kind: "component", type: CalendarMonthComponent, selector: "bc-calendar-month", inputs: ["monthWeeksCount", "weekDays", "weekDaysMin", "today", "containerHeight", "days", "calendarFields", "rtl", "deviceSize", "moDataList", "datePicker", "rangePicker", "canDelete", "canAdd", "canEdit", "canView", "selectedDate", "startSelectedDayIndex", "endSelectedDayIndex"], outputs: ["editEvent", "deleteEvent", "daySelect", "dayClick", "dayMouseMove", "dayMouseUp", "dayMouseDown", "showEvent"] }, { kind: "component", type: CalendarHeaderComponent, selector: "bc-calendar-header", inputs: ["monthInfo", "weekModeDays", "hideMode", "modeTitle", "title", "deviceSize", "rtl", "mode"], outputs: ["prevTap", "nextTap", "modeChange", "rangeChange", "today"] }, { kind: "component", type: CalendarSelectionDaysComponent, selector: "bc-calendar-selection-days", inputs: ["startSelectedDayIndex", "endSelectedDayIndex", "monthInfo", "inline"], outputs: ["rangeChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2729
2724
|
}
|
|
2730
2725
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CalendarContainerComponent, decorators: [{
|
|
2731
2726
|
type: Component,
|