@c8y/ngx-components 1018.0.31 → 1018.0.33
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/core/dashboard/dashboard-child.component.d.ts +5 -2
- package/core/dashboard/widget-time-context.component.d.ts +3 -3
- package/esm2020/core/dashboard/dashboard-child.component.mjs +14 -3
- package/esm2020/core/dashboard/widget-time-context.component.mjs +6 -6
- package/esm2020/core/dashboard/widget-time-context.model.mjs +2 -2
- package/esm2020/ecosystem/shared/ecosystem.service.mjs +4 -1
- package/fesm2015/c8y-ngx-components-ecosystem-shared.mjs +3 -0
- package/fesm2015/c8y-ngx-components-ecosystem-shared.mjs.map +1 -1
- package/fesm2015/c8y-ngx-components.mjs +19 -8
- package/fesm2015/c8y-ngx-components.mjs.map +1 -1
- package/fesm2020/c8y-ngx-components-ecosystem-shared.mjs +3 -0
- package/fesm2020/c8y-ngx-components-ecosystem-shared.mjs.map +1 -1
- package/fesm2020/c8y-ngx-components.mjs +19 -8
- package/fesm2020/c8y-ngx-components.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -23917,6 +23917,9 @@ class DashboardChildComponent {
|
|
|
23917
23917
|
*/
|
|
23918
23918
|
this.lastChange = null;
|
|
23919
23919
|
}
|
|
23920
|
+
set templateActions(actions) {
|
|
23921
|
+
this.addActions(actions, true);
|
|
23922
|
+
}
|
|
23920
23923
|
/**
|
|
23921
23924
|
* Updates the pixel width of the child (used for resizing)
|
|
23922
23925
|
*/
|
|
@@ -24014,6 +24017,14 @@ class DashboardChildComponent {
|
|
|
24014
24017
|
}
|
|
24015
24018
|
this.removeSelfFromDashboard();
|
|
24016
24019
|
}
|
|
24020
|
+
addActions(actions, prepend = false) {
|
|
24021
|
+
if (prepend) {
|
|
24022
|
+
this.actions = [...actions, ...this.actions];
|
|
24023
|
+
}
|
|
24024
|
+
else {
|
|
24025
|
+
this.actions = [...this.actions, ...actions];
|
|
24026
|
+
}
|
|
24027
|
+
}
|
|
24017
24028
|
removeSelfFromDashboard() {
|
|
24018
24029
|
const i = this.dashboard.children.indexOf(this);
|
|
24019
24030
|
if (i >= 0) {
|
|
@@ -24032,13 +24043,13 @@ class DashboardChildComponent {
|
|
|
24032
24043
|
}
|
|
24033
24044
|
}
|
|
24034
24045
|
DashboardChildComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: DashboardChildComponent, deps: [{ token: DashboardComponent }, { token: i1$4.DomSanitizer }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
24035
|
-
DashboardChildComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: DashboardChildComponent, selector: "c8y-dashboard-child", inputs: { x: "x", y: "y", width: "width", height: "height", data: "data", margin: "margin", isFrozen: "isFrozen", useIntersection: "useIntersection", class: "class" }, outputs: { changeStart: "changeStart", changeEnd: "changeEnd" }, host: { properties: { "attr.style": "this.inlineStyle" }, classAttribute: "dashboard-grid-child" }, queries: [{ propertyName: "
|
|
24046
|
+
DashboardChildComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: DashboardChildComponent, selector: "c8y-dashboard-child", inputs: { x: "x", y: "y", width: "width", height: "height", data: "data", margin: "margin", isFrozen: "isFrozen", useIntersection: "useIntersection", class: "class" }, outputs: { changeStart: "changeStart", changeEnd: "changeEnd" }, host: { properties: { "attr.style": "this.inlineStyle" }, classAttribute: "dashboard-grid-child" }, queries: [{ propertyName: "templateActions", predicate: DashboardChildActionComponent }], usesOnChanges: true, ngImport: i0, template: "<div cdkDropList>\n <div *ngIf=\"isResize\" class=\"card-placeholder\"></div>\n <div\n [ngClass]=\"klasses\"\n cdkDrag\n [ngStyle]=\"{ width: _pxWidth, height: _pxHeight }\"\n (cdkDragStarted)=\"dragStarted($event)\"\n (cdkDragEnded)=\"reset($event)\"\n [cdkDragDisabled]=\"isFrozen\"\n >\n <div\n class=\"card-header-actions card-header-grid\"\n [ngClass]=\"{ 'drag-handle': !isFrozen, draggableCursor: !isFrozen }\"\n cdkDragHandle\n [style.--dashboard-time-context]=\"\n data?.config?.widgetInstanceGlobalTimeContext ? 'block' : 'none'\n \"\n >\n <ng-content select=\"c8y-dashboard-child-title\"></ng-content>\n <div class=\"header-actions d-flex a-i-center\" *ngIf=\"!isFrozen && actions.length > 0\">\n <span class=\"m-l-auto\" style=\"display: var(--dashboard-time-context)\">\n <button\n class=\"btn-clean\"\n tooltip=\"{{ 'This widget is in sync with the dashboard time range.' | translate }}\"\n placement=\"top\"\n container=\"body\"\n [attr.aria-label]=\"'This widget is in sync with the dashboard time range.' | translate\"\n >\n <span class=\"c8y-icon-badge d-inline-flex\">\n <i c8yIcon=\"clock\"></i>\n <span class=\"badge badge-success\">\n <i c8yIcon=\"link\" class=\"text-gray-white\"></i>\n </span>\n </span>\n </button>\n </span>\n <div class=\"optionsBtn dropdown\" dropdown placement=\"bottom right\">\n <button\n title=\"{{ 'Settings' | translate }}\"\n class=\"btnIcon c8y-dropdown\"\n (click)=\"(false)\"\n dropdownToggle\n aria-haspopup=\"true\"\n >\n <i [c8yIcon]=\"'cog'\"></i>\n </button>\n <ul class=\"dropdown-menu dropdown-menu-right\" style=\"right: -1px\" *dropdownMenu>\n <ng-container *ngFor=\"let action of actions\">\n <ng-container *ngTemplateOutlet=\"action.template\"></ng-container>\n </ng-container>\n </ul>\n </div>\n </div>\n </div>\n <div class=\"card-inner-scroll\">\n <ng-content></ng-content>\n </div>\n <div\n *ngIf=\"!isFrozen && !isDragging\"\n class=\"resize-handle hidden-xs\"\n cdkDrag\n [cdkDragDisabled]=\"isFrozen\"\n (cdkDragStarted)=\"resizeStarted($event)\"\n (cdkDragEnded)=\"reset($event)\"\n ></div>\n <div class=\"resize-icon hidden-xs\" *ngIf=\"!isFrozen && !isDragging\"></div>\n\n <div *cdkDragPlaceholder class=\"card-placeholder\"></div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i5$3.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i5$3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i5$3.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: i5$3.CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }, { kind: "directive", type: i1$5.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { kind: "directive", type: i1$5.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { kind: "directive", type: i1$5.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "directive", type: i1$7.TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["adaptivePosition", "tooltip", "placement", "triggers", "container", "containerClass", "boundariesElement", "isOpen", "isDisabled", "delay", "tooltipHtml", "tooltipPlacement", "tooltipIsOpen", "tooltipEnable", "tooltipAppendToBody", "tooltipAnimation", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "tooltipFadeDuration", "tooltipTrigger"], outputs: ["tooltipChange", "onShown", "onHidden", "tooltipStateChanged"], exportAs: ["bs-tooltip"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] });
|
|
24036
24047
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: DashboardChildComponent, decorators: [{
|
|
24037
24048
|
type: Component,
|
|
24038
24049
|
args: [{ selector: 'c8y-dashboard-child', host: {
|
|
24039
24050
|
class: 'dashboard-grid-child'
|
|
24040
24051
|
}, template: "<div cdkDropList>\n <div *ngIf=\"isResize\" class=\"card-placeholder\"></div>\n <div\n [ngClass]=\"klasses\"\n cdkDrag\n [ngStyle]=\"{ width: _pxWidth, height: _pxHeight }\"\n (cdkDragStarted)=\"dragStarted($event)\"\n (cdkDragEnded)=\"reset($event)\"\n [cdkDragDisabled]=\"isFrozen\"\n >\n <div\n class=\"card-header-actions card-header-grid\"\n [ngClass]=\"{ 'drag-handle': !isFrozen, draggableCursor: !isFrozen }\"\n cdkDragHandle\n [style.--dashboard-time-context]=\"\n data?.config?.widgetInstanceGlobalTimeContext ? 'block' : 'none'\n \"\n >\n <ng-content select=\"c8y-dashboard-child-title\"></ng-content>\n <div class=\"header-actions d-flex a-i-center\" *ngIf=\"!isFrozen && actions.length > 0\">\n <span class=\"m-l-auto\" style=\"display: var(--dashboard-time-context)\">\n <button\n class=\"btn-clean\"\n tooltip=\"{{ 'This widget is in sync with the dashboard time range.' | translate }}\"\n placement=\"top\"\n container=\"body\"\n [attr.aria-label]=\"'This widget is in sync with the dashboard time range.' | translate\"\n >\n <span class=\"c8y-icon-badge d-inline-flex\">\n <i c8yIcon=\"clock\"></i>\n <span class=\"badge badge-success\">\n <i c8yIcon=\"link\" class=\"text-gray-white\"></i>\n </span>\n </span>\n </button>\n </span>\n <div class=\"optionsBtn dropdown\" dropdown placement=\"bottom right\">\n <button\n title=\"{{ 'Settings' | translate }}\"\n class=\"btnIcon c8y-dropdown\"\n (click)=\"(false)\"\n dropdownToggle\n aria-haspopup=\"true\"\n >\n <i [c8yIcon]=\"'cog'\"></i>\n </button>\n <ul class=\"dropdown-menu dropdown-menu-right\" style=\"right: -1px\" *dropdownMenu>\n <ng-container *ngFor=\"let action of actions\">\n <ng-container *ngTemplateOutlet=\"action.template\"></ng-container>\n </ng-container>\n </ul>\n </div>\n </div>\n </div>\n <div class=\"card-inner-scroll\">\n <ng-content></ng-content>\n </div>\n <div\n *ngIf=\"!isFrozen && !isDragging\"\n class=\"resize-handle hidden-xs\"\n cdkDrag\n [cdkDragDisabled]=\"isFrozen\"\n (cdkDragStarted)=\"resizeStarted($event)\"\n (cdkDragEnded)=\"reset($event)\"\n ></div>\n <div class=\"resize-icon hidden-xs\" *ngIf=\"!isFrozen && !isDragging\"></div>\n\n <div *cdkDragPlaceholder class=\"card-placeholder\"></div>\n </div>\n</div>\n" }]
|
|
24041
|
-
}], ctorParameters: function () { return [{ type: DashboardComponent }, { type: i1$4.DomSanitizer }, { type: i0.ElementRef }]; }, propDecorators: {
|
|
24052
|
+
}], ctorParameters: function () { return [{ type: DashboardComponent }, { type: i1$4.DomSanitizer }, { type: i0.ElementRef }]; }, propDecorators: { templateActions: [{
|
|
24042
24053
|
type: ContentChildren,
|
|
24043
24054
|
args: [DashboardChildActionComponent]
|
|
24044
24055
|
}], x: [{
|
|
@@ -24129,7 +24140,7 @@ var TimeSpanInMs;
|
|
|
24129
24140
|
TimeSpanInMs[TimeSpanInMs["MINUTE"] = 60000] = "MINUTE";
|
|
24130
24141
|
TimeSpanInMs[TimeSpanInMs["HOUR"] = 3600000] = "HOUR";
|
|
24131
24142
|
TimeSpanInMs[TimeSpanInMs["DAY"] = 86400000] = "DAY";
|
|
24132
|
-
TimeSpanInMs[TimeSpanInMs["WEEK"] = 604800000] = "WEEK";
|
|
24143
|
+
TimeSpanInMs[TimeSpanInMs["WEEK"] = 604800000] = "WEEK";
|
|
24133
24144
|
})(TimeSpanInMs || (TimeSpanInMs = {}));
|
|
24134
24145
|
|
|
24135
24146
|
class WidgetTimeContextComponent {
|
|
@@ -24171,9 +24182,9 @@ class WidgetTimeContextComponent {
|
|
|
24171
24182
|
/**
|
|
24172
24183
|
* @ignore Adding custom actions.
|
|
24173
24184
|
*/
|
|
24174
|
-
|
|
24175
|
-
if (this.
|
|
24176
|
-
this.dashboardChild.
|
|
24185
|
+
ngAfterViewInit() {
|
|
24186
|
+
if (this.canDecouple) {
|
|
24187
|
+
this.dashboardChild.addActions([this.action]);
|
|
24177
24188
|
}
|
|
24178
24189
|
}
|
|
24179
24190
|
/**
|
|
@@ -24361,10 +24372,10 @@ class WidgetTimeContextComponent {
|
|
|
24361
24372
|
}
|
|
24362
24373
|
}
|
|
24363
24374
|
WidgetTimeContextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: WidgetTimeContextComponent, deps: [{ token: WidgetsDashboardEventService }, { token: DashboardChildComponent }, { token: i1$6.Router }, { token: i1$6.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
|
|
24364
|
-
WidgetTimeContextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: WidgetTimeContextComponent, selector: "c8y-widget-time-context", inputs: { canDecouple: "canDecouple" }, outputs: { dateContextChange: "dateContextChange" }, host: { classAttribute: "d-flex a-i-center gap-4" }, viewQueries: [{ propertyName: "action", first: true, predicate: DashboardChildActionComponent, descendants: true }], ngImport: i0, template: "<c8y-action-bar-item\n *ngIf=\"isCoupled\"\n [groupId]=\"'timecontext'\"\n [placement]=\"'left'\"\n itemClass=\"navbar-form\"\n>\n <ng-container\n [ngTemplateOutlet]=\"dateTimePicker\"\n [ngTemplateOutletContext]=\"{ date: globalDate }\"\n ></ng-container>\n</c8y-action-bar-item>\n\n<ng-container\n *ngIf=\"!isCoupled\"\n [ngTemplateOutlet]=\"dateTimePicker\"\n [ngTemplateOutletContext]=\"{ date: localDate }\"\n></ng-container>\n\n<ng-template #dateTimePicker let-date=\"date\">\n <label>{{ 'Time range' | translate }}</label>\n <div\n class=\"dropdown m-r-4\"\n dropdown\n #dropdown=\"bs-dropdown\"\n container=\"body\"\n [insideClick]=\"true\"\n >\n <button\n class=\"dropdown-toggle form-control l-h-1 d-flex a-i-center\"\n dropdownToggle\n title=\"{{ date[0] | c8yDate: 'short' }} \u2014 {{ date[1] | c8yDate: 'short' }}\"\n aria-haspopup=\"true\"\n >\n <span>{{ date[0] | c8yDate: 'shortDate' }} \u2014 {{ date[1] | c8yDate: 'shortDate' }}</span>\n <span class=\"caret m-r-8 m-l-4\"></span>\n </button>\n\n <div *dropdownMenu class=\"dropdown-menu dropdown-menu--date-range\">\n <div class=\"p-16\">\n <formly-form [form]=\"form\" [fields]=\"fields\" [model]=\"model\"></formly-form>\n </div>\n <div class=\"p-16 d-flex gap-8 separator-top\">\n <button\n class=\"btn btn-default btn-sm flex-grow\"\n (click)=\"reset(); dropdown.isOpen = false\"\n title=\"{{ 'Reset' | translate }}\"\n type=\"button\"\n translate\n >\n Reset\n </button>\n\n <button\n class=\"btn btn-primary btn-sm flex-grow\"\n (click)=\"applyDatetimeContext(); dropdown.isOpen = false\"\n [disabled]=\"(form.pristine && form.untouched) || form.invalid\"\n title=\"{{ 'Apply' | translate }}\"\n type=\"button\"\n translate\n >\n Apply\n </button>\n </div>\n </div>\n </div>\n\n <div class=\"c8y-select-wrapper\">\n <select\n class=\"form-control\"\n [attr.aria-label]=\"'Range' | translate\"\n [ngModel]=\"currentPredefinedTimeSpan\"\n (ngModelChange)=\"predefinedDateFromSelected($event)\"\n >\n <option value=\"undefined\" disabled=\"true\">{{ 'Custom range`time`' | translate }}</option>\n <option *ngFor=\"let dateFrom of predefinedTimeSpanList\" [ngValue]=\"dateFrom\">\n {{ dateFrom.title }}\n </option>\n </select>\n <span></span>\n </div>\n</ng-template>\n\n<c8y-dashboard-child-action
|
|
24375
|
+
WidgetTimeContextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: WidgetTimeContextComponent, selector: "c8y-widget-time-context", inputs: { canDecouple: "canDecouple" }, outputs: { dateContextChange: "dateContextChange" }, host: { classAttribute: "d-flex a-i-center gap-4" }, viewQueries: [{ propertyName: "action", first: true, predicate: DashboardChildActionComponent, descendants: true }], ngImport: i0, template: "<c8y-action-bar-item\n *ngIf=\"isCoupled\"\n [groupId]=\"'timecontext'\"\n [placement]=\"'left'\"\n itemClass=\"navbar-form\"\n>\n <ng-container\n [ngTemplateOutlet]=\"dateTimePicker\"\n [ngTemplateOutletContext]=\"{ date: globalDate }\"\n ></ng-container>\n</c8y-action-bar-item>\n\n<ng-container\n *ngIf=\"!isCoupled\"\n [ngTemplateOutlet]=\"dateTimePicker\"\n [ngTemplateOutletContext]=\"{ date: localDate }\"\n></ng-container>\n\n<ng-template #dateTimePicker let-date=\"date\">\n <label>{{ 'Time range' | translate }}</label>\n <div\n class=\"dropdown m-r-4\"\n dropdown\n #dropdown=\"bs-dropdown\"\n container=\"body\"\n [insideClick]=\"true\"\n >\n <button\n class=\"dropdown-toggle form-control l-h-1 d-flex a-i-center\"\n dropdownToggle\n title=\"{{ date[0] | c8yDate: 'short' }} \u2014 {{ date[1] | c8yDate: 'short' }}\"\n aria-haspopup=\"true\"\n >\n <span>{{ date[0] | c8yDate: 'shortDate' }} \u2014 {{ date[1] | c8yDate: 'shortDate' }}</span>\n <span class=\"caret m-r-8 m-l-4\"></span>\n </button>\n\n <div *dropdownMenu class=\"dropdown-menu dropdown-menu--date-range\">\n <div class=\"p-16\">\n <formly-form [form]=\"form\" [fields]=\"fields\" [model]=\"model\"></formly-form>\n </div>\n <div class=\"p-16 d-flex gap-8 separator-top\">\n <button\n class=\"btn btn-default btn-sm flex-grow\"\n (click)=\"reset(); dropdown.isOpen = false\"\n title=\"{{ 'Reset' | translate }}\"\n type=\"button\"\n translate\n >\n Reset\n </button>\n\n <button\n class=\"btn btn-primary btn-sm flex-grow\"\n (click)=\"applyDatetimeContext(); dropdown.isOpen = false\"\n [disabled]=\"(form.pristine && form.untouched) || form.invalid\"\n title=\"{{ 'Apply' | translate }}\"\n type=\"button\"\n translate\n >\n Apply\n </button>\n </div>\n </div>\n </div>\n\n <div class=\"c8y-select-wrapper\">\n <select\n class=\"form-control\"\n [attr.aria-label]=\"'Range' | translate\"\n [ngModel]=\"currentPredefinedTimeSpan\"\n (ngModelChange)=\"predefinedDateFromSelected($event)\"\n >\n <option value=\"undefined\" disabled=\"true\">{{ 'Custom range`time`' | translate }}</option>\n <option *ngFor=\"let dateFrom of predefinedTimeSpanList\" [ngValue]=\"dateFrom\">\n {{ dateFrom.title }}\n </option>\n </select>\n <span></span>\n </div>\n</ng-template>\n\n<c8y-dashboard-child-action>\n <button (click)=\"toggleDecoupling();\" type=\"button\">\n <i [c8yIcon]=\"isCoupled ? 'schedule1' : 'today'\"></i>\n <span class=\"m-l-4\">\n {{ (isCoupled ? decoupleTimeContextLabel : coupleTimeContextLabel) | translate }}\n </span>\n </button>\n</c8y-dashboard-child-action>\n", dependencies: [{ kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId"] }, { kind: "directive", type: i1$5.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { kind: "directive", type: i1$5.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { kind: "directive", type: i1$5.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "component", type: DashboardChildActionComponent, selector: "c8y-dashboard-child-action" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: DatePipe, name: "c8yDate" }] });
|
|
24365
24376
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: WidgetTimeContextComponent, decorators: [{
|
|
24366
24377
|
type: Component,
|
|
24367
|
-
args: [{ selector: 'c8y-widget-time-context', host: { class: 'd-flex a-i-center gap-4' }, template: "<c8y-action-bar-item\n *ngIf=\"isCoupled\"\n [groupId]=\"'timecontext'\"\n [placement]=\"'left'\"\n itemClass=\"navbar-form\"\n>\n <ng-container\n [ngTemplateOutlet]=\"dateTimePicker\"\n [ngTemplateOutletContext]=\"{ date: globalDate }\"\n ></ng-container>\n</c8y-action-bar-item>\n\n<ng-container\n *ngIf=\"!isCoupled\"\n [ngTemplateOutlet]=\"dateTimePicker\"\n [ngTemplateOutletContext]=\"{ date: localDate }\"\n></ng-container>\n\n<ng-template #dateTimePicker let-date=\"date\">\n <label>{{ 'Time range' | translate }}</label>\n <div\n class=\"dropdown m-r-4\"\n dropdown\n #dropdown=\"bs-dropdown\"\n container=\"body\"\n [insideClick]=\"true\"\n >\n <button\n class=\"dropdown-toggle form-control l-h-1 d-flex a-i-center\"\n dropdownToggle\n title=\"{{ date[0] | c8yDate: 'short' }} \u2014 {{ date[1] | c8yDate: 'short' }}\"\n aria-haspopup=\"true\"\n >\n <span>{{ date[0] | c8yDate: 'shortDate' }} \u2014 {{ date[1] | c8yDate: 'shortDate' }}</span>\n <span class=\"caret m-r-8 m-l-4\"></span>\n </button>\n\n <div *dropdownMenu class=\"dropdown-menu dropdown-menu--date-range\">\n <div class=\"p-16\">\n <formly-form [form]=\"form\" [fields]=\"fields\" [model]=\"model\"></formly-form>\n </div>\n <div class=\"p-16 d-flex gap-8 separator-top\">\n <button\n class=\"btn btn-default btn-sm flex-grow\"\n (click)=\"reset(); dropdown.isOpen = false\"\n title=\"{{ 'Reset' | translate }}\"\n type=\"button\"\n translate\n >\n Reset\n </button>\n\n <button\n class=\"btn btn-primary btn-sm flex-grow\"\n (click)=\"applyDatetimeContext(); dropdown.isOpen = false\"\n [disabled]=\"(form.pristine && form.untouched) || form.invalid\"\n title=\"{{ 'Apply' | translate }}\"\n type=\"button\"\n translate\n >\n Apply\n </button>\n </div>\n </div>\n </div>\n\n <div class=\"c8y-select-wrapper\">\n <select\n class=\"form-control\"\n [attr.aria-label]=\"'Range' | translate\"\n [ngModel]=\"currentPredefinedTimeSpan\"\n (ngModelChange)=\"predefinedDateFromSelected($event)\"\n >\n <option value=\"undefined\" disabled=\"true\">{{ 'Custom range`time`' | translate }}</option>\n <option *ngFor=\"let dateFrom of predefinedTimeSpanList\" [ngValue]=\"dateFrom\">\n {{ dateFrom.title }}\n </option>\n </select>\n <span></span>\n </div>\n</ng-template>\n\n<c8y-dashboard-child-action
|
|
24378
|
+
args: [{ selector: 'c8y-widget-time-context', host: { class: 'd-flex a-i-center gap-4' }, template: "<c8y-action-bar-item\n *ngIf=\"isCoupled\"\n [groupId]=\"'timecontext'\"\n [placement]=\"'left'\"\n itemClass=\"navbar-form\"\n>\n <ng-container\n [ngTemplateOutlet]=\"dateTimePicker\"\n [ngTemplateOutletContext]=\"{ date: globalDate }\"\n ></ng-container>\n</c8y-action-bar-item>\n\n<ng-container\n *ngIf=\"!isCoupled\"\n [ngTemplateOutlet]=\"dateTimePicker\"\n [ngTemplateOutletContext]=\"{ date: localDate }\"\n></ng-container>\n\n<ng-template #dateTimePicker let-date=\"date\">\n <label>{{ 'Time range' | translate }}</label>\n <div\n class=\"dropdown m-r-4\"\n dropdown\n #dropdown=\"bs-dropdown\"\n container=\"body\"\n [insideClick]=\"true\"\n >\n <button\n class=\"dropdown-toggle form-control l-h-1 d-flex a-i-center\"\n dropdownToggle\n title=\"{{ date[0] | c8yDate: 'short' }} \u2014 {{ date[1] | c8yDate: 'short' }}\"\n aria-haspopup=\"true\"\n >\n <span>{{ date[0] | c8yDate: 'shortDate' }} \u2014 {{ date[1] | c8yDate: 'shortDate' }}</span>\n <span class=\"caret m-r-8 m-l-4\"></span>\n </button>\n\n <div *dropdownMenu class=\"dropdown-menu dropdown-menu--date-range\">\n <div class=\"p-16\">\n <formly-form [form]=\"form\" [fields]=\"fields\" [model]=\"model\"></formly-form>\n </div>\n <div class=\"p-16 d-flex gap-8 separator-top\">\n <button\n class=\"btn btn-default btn-sm flex-grow\"\n (click)=\"reset(); dropdown.isOpen = false\"\n title=\"{{ 'Reset' | translate }}\"\n type=\"button\"\n translate\n >\n Reset\n </button>\n\n <button\n class=\"btn btn-primary btn-sm flex-grow\"\n (click)=\"applyDatetimeContext(); dropdown.isOpen = false\"\n [disabled]=\"(form.pristine && form.untouched) || form.invalid\"\n title=\"{{ 'Apply' | translate }}\"\n type=\"button\"\n translate\n >\n Apply\n </button>\n </div>\n </div>\n </div>\n\n <div class=\"c8y-select-wrapper\">\n <select\n class=\"form-control\"\n [attr.aria-label]=\"'Range' | translate\"\n [ngModel]=\"currentPredefinedTimeSpan\"\n (ngModelChange)=\"predefinedDateFromSelected($event)\"\n >\n <option value=\"undefined\" disabled=\"true\">{{ 'Custom range`time`' | translate }}</option>\n <option *ngFor=\"let dateFrom of predefinedTimeSpanList\" [ngValue]=\"dateFrom\">\n {{ dateFrom.title }}\n </option>\n </select>\n <span></span>\n </div>\n</ng-template>\n\n<c8y-dashboard-child-action>\n <button (click)=\"toggleDecoupling();\" type=\"button\">\n <i [c8yIcon]=\"isCoupled ? 'schedule1' : 'today'\"></i>\n <span class=\"m-l-4\">\n {{ (isCoupled ? decoupleTimeContextLabel : coupleTimeContextLabel) | translate }}\n </span>\n </button>\n</c8y-dashboard-child-action>\n" }]
|
|
24368
24379
|
}], ctorParameters: function () { return [{ type: WidgetsDashboardEventService }, { type: DashboardChildComponent }, { type: i1$6.Router }, { type: i1$6.ActivatedRoute }]; }, propDecorators: { canDecouple: [{
|
|
24369
24380
|
type: Input
|
|
24370
24381
|
}], dateContextChange: [{
|