@c8y/ngx-components 1022.45.2 → 1022.46.1
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/c8y-ngx-components-sub-assets.mjs +2 -2
- package/fesm2022/c8y-ngx-components-sub-assets.mjs.map +1 -1
- package/fesm2022/c8y-ngx-components.mjs +2 -2
- package/fesm2022/c8y-ngx-components.mjs.map +1 -1
- package/locales/de.po +6 -0
- package/locales/es.po +8 -2
- package/locales/fr.po +6 -0
- package/locales/ja_JP.po +6 -0
- package/locales/ko.po +8 -2
- package/locales/locales.pot +11 -6
- package/locales/nl.po +8 -2
- package/locales/pl.po +12 -6
- package/locales/pt_BR.po +6 -0
- package/locales/zh_CN.po +8 -2
- package/locales/zh_TW.po +8 -2
- package/package.json +1 -1
|
@@ -31328,7 +31328,7 @@ class WidgetsDashboardComponent {
|
|
|
31328
31328
|
return result;
|
|
31329
31329
|
}
|
|
31330
31330
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: WidgetsDashboardComponent, deps: [{ token: DynamicComponentService }, { token: i1$1.TranslateService }, { token: i1$4.ActivatedRoute }, { token: ModalService }, { token: WidgetGlobalAutoRefreshService }, { token: i1$4.Router }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
31331
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: WidgetsDashboardComponent, isStandalone: true, selector: "c8y-widgets-dashboard", inputs: { widgets: "widgets", context: "context", contextDashboard: "contextDashboard", _settings: ["settings", "_settings"], isCopyDisabled: "isCopyDisabled", breadcrumb: "breadcrumb", editModeButtons: "editModeButtons" }, outputs: { onAddWidget: "onAddWidget", onEditWidget: "onEditWidget", onDeleteWidget: "onDeleteWidget", onChangeDashboard: "onChangeDashboard", onResize: "onResize", onEditDashboard: "onEditDashboard", onCopyDashboard: "onCopyDashboard", onDeleteDashboard: "onDeleteDashboard", onChangeStart: "onChangeStart", onChangeEnd: "onChangeEnd", onSaveDashboard: "onSaveDashboard", onCancelDashboard: "onCancelDashboard", revertChange: "revertChange" }, host: { styleAttribute: "\n display: block;\n ", classAttribute: "dashboard c8y-grid-dashboard" }, providers: [WidgetsDashboardEventService], usesOnChanges: true, ngImport: i0, template: "<c8y-title *ngIf=\"!!settings.title\">\n {{ settings.title | translate }}\n</c8y-title>\n\n<c8y-breadcrumb *ngIf=\"!!breadcrumb\">\n <c8y-breadcrumb-item\n [icon]=\"breadcrumb.icon\"\n [label]=\"breadcrumb.label\"\n [path]=\"breadcrumb.path\"\n ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n [placement]=\"'left'\"\n [priority]=\"ACTION_BAR_EDIT_WIDGETS_PRIORITY\"\n *ngIf=\"!(editMode$ | async)\"\n>\n <button\n class=\"btn btn-link animated fadeIn hidden-xs\"\n title=\"{{ 'Edit widgets' | translate }}\"\n type=\"button\"\n [disabled]=\"settings.isDisabled\"\n (click)=\"enableEditMode()\"\n data-cy=\"c8y-widget-dashboard--edit-widgets\"\n >\n <i c8yIcon=\"send-backward\"></i>\n <span class=\"m-l-4\">{{ 'Edit widgets' | translate }}</span>\n </button>\n <button\n class=\"btn btn-link visible-xs m-l-0\"\n tooltip=\"{{ 'Not available on mobile phone' | translate }}\"\n type=\"button\"\n [disabled]=\"true\"\n >\n <i c8yIcon=\"send-backward\"></i>\n <span class=\"m-l-4\">{{ 'Edit widgets' | translate }}</span>\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'left'\"\n *ngIf=\"editMode$ | async\"\n>\n <button\n class=\"btn btn-link animated fadeIn\"\n title=\"{{ 'Add widget' | translate }}\"\n type=\"button\"\n (click)=\"onAddWidget.emit()\"\n data-cy=\"widget-dashboard--Add-widget\"\n >\n <i c8yIcon=\"plus-circle\"></i>\n {{ 'Add widget' | translate }}\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'left'\"\n itemClass=\"d-flex a-i-center gap-8\"\n *ngIf=\"editMode$ | async\"\n>\n <div class=\"input-group input-group-sm animated fadeIn\">\n <div class=\"input-group-btn\">\n <button\n class=\"btn btn-default btn-sm btn-icon\"\n [attr.aria-label]=\"'Undo' | translate\"\n [tooltip]=\"\n editModeButtons.undoButtonDisabled\n ? ''\n : (undoMessage\n | translate: { changeToUndo: editModeButtons.changeToUndoName | translate })\n \"\n container=\"body\"\n (click)=\"revertChange.emit('undo')\"\n [disabled]=\"editModeButtons.undoButtonDisabled\"\n >\n <i [c8yIcon]=\"'undo'\"></i>\n </button>\n </div>\n <div class=\"input-group-btn\">\n <button\n class=\"btn btn-default btn-sm btn-icon\"\n [attr.aria-label]=\"'Redo' | translate\"\n [tooltip]=\"\n editModeButtons.redoButtonDisabled\n ? ''\n : (redoMessage\n | translate: { changeToRedo: editModeButtons.changeToRedoName | translate })\n \"\n container=\"body\"\n (click)=\"revertChange.emit('redo')\"\n [disabled]=\"editModeButtons.redoButtonDisabled\"\n >\n <i [c8yIcon]=\"'redo'\"></i>\n </button>\n </div>\n <span></span>\n </div>\n <div class=\"btn-group animated fadeIn\">\n <button\n class=\"btn btn-default btn-sm\"\n title=\"{{ 'Cancel' | translate }}\"\n type=\"button\"\n (click)=\"cancelDashboardSave()\"\n >\n {{ 'Cancel' | translate }}\n </button>\n <button\n class=\"btn btn-primary btn-sm m-l-8\"\n title=\"{{ 'Save' | translate }}\"\n type=\"button\"\n [disabled]=\"editModeButtons.undoButtonDisabled\"\n (click)=\"saveDashboard()\"\n data-cy=\"c8y-widgets-dashboard--save\"\n >\n {{ 'Save' | translate }}\n </button>\n </div>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'right'\"\n *ngIf=\"onEditDashboard.observers.length\"\n>\n <button\n class=\"btn btn-link hidden-xs m-l-0\"\n title=\"{{ 'Dashboard settings' | translate }}\"\n type=\"button\"\n [disabled]=\"settings.isDisabled || (editMode$ | async)\"\n (click)=\"onEditDashboard.emit()\"\n data-cy=\"c8y-widgets-dashboard--edit-dashboard\"\n >\n <i c8yIcon=\"sorting-slider\"></i>\n <span class=\"visible-xs-inline hidden-sm visible-md-inline visible-lg-inline\">\n {{ 'Dashboard settings' | translate }}\n </span>\n </button>\n <button\n class=\"btn btn-link visible-xs m-l-0\"\n tooltip=\"{{ 'Not available on mobile phone' | translate }}\"\n type=\"button\"\n [disabled]=\"true\"\n >\n <i c8yIcon=\"sorting-slider\"></i>\n <span class=\"visible-xs-inline hidden-sm visible-md-inline visible-lg-inline\">\n {{ 'Dashboard settings' | translate }}\n </span>\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'right'\"\n *ngIf=\"settings.allowFullscreen\"\n [priority]=\"-5000\"\n itemClass=\"pull-right\"\n>\n <button\n class=\"btn btn-link\"\n [attr.aria-label]=\"'Full screen' | translate\"\n tooltip=\"{{ 'Full screen' | translate }}\"\n placement=\"left\"\n container=\"body\"\n type=\"button\"\n [delay]=\"500\"\n (click)=\"toggleFullscreen()\"\n data-cy=\"widgets-dashboard--Full-screen\"\n >\n <i [c8yIcon]=\"(inFullScreen$ | async) ? 'compress' : 'expand'\"></i>\n <span class=\"visible-xs-inline hidden-sm visible-md-inline visibile-lg-inline\">\n {{ 'Full screen' | translate }}\n </span>\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'more'\"\n [priority]=\"-2000\"\n *ngIf=\"settings.canCopy\"\n>\n <div\n [ngStyle]=\"{\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center'\n }\"\n >\n <button\n class=\"hidden-xs\"\n title=\"{{\n (isCopyDisabled === true || !isCopyDisabled?.state ? 'Disabled' : copyDashboardLabel)\n | translate\n }}\"\n type=\"button\"\n [ngClass]=\"{ 'btn btn-link': !settings.canDelete }\"\n data-cy=\"widgets-dashboard--copy-dashboard\"\n (click)=\"onCopyDashboard.emit()\"\n [disabled]=\"isCopyDisabled === true || !isCopyDisabled?.state || (editMode$ | async)\"\n >\n <i c8yIcon=\"clone\"></i>\n <span>{{ copyDashboardLabel | translate }}</span>\n </button>\n <button\n class=\"btn-help btn-help--sm m-r-16 hidden-xs\"\n [attr.aria-label]=\"'Help' | translate\"\n [popover]=\"copyDisabledPopoverMsg | translate\"\n placement=\"right\"\n triggers=\"focus\"\n container=\"body\"\n type=\"button\"\n *ngIf=\"!isCopyDisabled?.state && copyDisabledPopoverMsg\"\n data-cy=\"widgets-dashboard--info-copy-dashboard\"\n (click)=\"$event.stopPropagation()\"\n ></button>\n </div>\n <button\n class=\"visible-xs m-l-0\"\n tooltip=\"{{ 'Not available on mobile phone' | translate }}\"\n type=\"button\"\n [ngClass]=\"{ 'btn btn-link': !settings.canDelete }\"\n [disabled]=\"true\"\n >\n <i c8yIcon=\"clone\"></i>\n <span>{{ copyDashboardLabel | translate }}</span>\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'more'\"\n [priority]=\"-3000\"\n *ngIf=\"settings.canDelete && onDeleteDashboard.observers.length\"\n>\n <button\n class=\"hidden-xs\"\n title=\"{{ 'Delete dashboard' | translate }}\"\n type=\"button\"\n data-cy=\"widgets-dashboard--delete-dashboard\"\n [ngClass]=\"{ 'btn btn-link': !settings.canCopy }\"\n (click)=\"onDeleteDashboard.emit()\"\n [disabled]=\"settings.isDisabled || (editMode$ | async)\"\n >\n <i c8yIcon=\"delete\"></i>\n <span translate>Delete dashboard</span>\n </button>\n <button\n class=\"visible-xs m-l-0\"\n tooltip=\"{{ 'Not available on mobile phone' | translate }}\"\n type=\"button\"\n data-cy=\"widgets-dashboard--delete-dashboard-mobile\"\n [ngClass]=\"{ 'btn btn-link': !settings.canCopy }\"\n [disabled]=\"true\"\n >\n <i c8yIcon=\"delete\"></i>\n <span translate>Delete dashboard</span>\n </button>\n</c8y-action-bar-item>\n\n<ng-template #loadingIndicator>\n <c8y-loading\n class=\"col-xs-12 text-center\"\n *ngIf=\"isLoadingWidgets$ | async\"\n ></c8y-loading>\n</ng-template>\n\n<ng-container *ngIf=\"!(isLoadingWidgets$ | async); else loadingIndicator\">\n <ng-container *ngIf=\"resolvedWidgets$ | async as widgetsToDisplay\">\n <!-- empty state -->\n <c8y-ui-empty-state\n [icon]=\"'c8y-device'\"\n [title]=\"'No widgets to display.' | translate\"\n *ngIf=\"widgetsToDisplay?.length === 0\"\n >\n <div *ngIf=\"onAddWidget.observers.length\">\n <p\n translate\n *ngIf=\"editMode$ | async\"\n >\n Add widgets to this dashboard.\n </p>\n <p\n translate\n *ngIf=\"!(editMode$ | async)\"\n >\n Click \"Edit widgets\" to unlock\n </p>\n <div>\n <button\n class=\"btn btn-primary m-t-16\"\n title=\"{{ 'Add widget' | translate }}\"\n type=\"button\"\n [disabled]=\"settings.isDisabled || !(editMode$ | async)\"\n (click)=\"onAddWidget.emit()\"\n data-cy=\"c8y-widgets-dashboard--add-widget\"\n translate\n >\n Add widget\n </button>\n </div>\n <p c8y-guide-docs>\n <small\n translate\n ngNonBindable\n >\n Find out more in the\n <a c8y-guide-href=\"/docs/cockpit/working-with-dashboards\">user documentation</a>\n .\n </small>\n </p>\n </div>\n </c8y-ui-empty-state>\n\n <c8y-dashboard\n [columns]=\"settings.columns\"\n (dashboardChange)=\"onChangeDashboard.emit($event)\"\n #dashboard\n >\n <c8y-dashboard-child\n [class]=\"widget.classes\"\n *ngFor=\"let widget of widgetsToDisplay\"\n [x]=\"widget._x\"\n [y]=\"widget._y\"\n [width]=\"widget._width || settings.defaultWidth\"\n [height]=\"widget._height || settings.defaultHeight\"\n [margin]=\"settings.widgetMargin\"\n [data]=\"widget\"\n [useIntersection]=\"true\"\n [editMode]=\"editMode$ | async\"\n (changeStart)=\"onChangeStart.emit({ widget: widget, source: child, dashboard: dashboard })\"\n (changeEnd)=\"onChangeEnd.emit({ widget: widget, source: child, dashboard: dashboard })\"\n (toggleFullscreen)=\"toggleFullscreenOnWidget(child)\"\n [canToggleFullscreen]=\"!(inFullScreen$ | async) || widgetInFullscreenMode\"\n #child\n >\n <c8y-dashboard-child-title>\n <span\n data-cy=\"c8y-dashboard-list--device-widget\"\n *ngIf=\"settings.translateWidgetTitle\"\n >\n {{ widget.title | translate }}\n </span>\n <span *ngIf=\"!settings.translateWidgetTitle\">\n {{ widget.title }}\n </span>\n </c8y-dashboard-child-title>\n <c8y-dashboard-child-action *ngIf=\"onEditWidget.observers.length\">\n <button\n title=\"{{ 'Edit widget' | translate }}\"\n type=\"button\"\n data-cy=\"widgets-dashboard--Edit-widget\"\n (click)=\"onEditWidget.emit({ widget: widget, source: child, dashboard: dashboard })\"\n >\n <i c8yIcon=\"pencil\"></i>\n <span translate>Edit</span>\n </button>\n </c8y-dashboard-child-action>\n <c8y-dashboard-child-action *ngIf=\"onDeleteWidget.observers.length\">\n <button\n title=\"{{ 'Remove widget' | translate }}\"\n type=\"button\"\n data-cy=\"c8y-widgets-dashboard--remove-widget\"\n (click)=\"onDeleteWidget.emit({ widget: widget, source: child, dashboard: dashboard })\"\n >\n <i c8yIcon=\"delete\"></i>\n <span translate>Remove</span>\n </button>\n </c8y-dashboard-child-action>\n\n <c8y-widget-time-context\n *ngIf=\"\n (widget.config?.displaySettings?.globalTimeContext ||\n widget.config?.displaySettings?.globalRealtimeContext) &&\n (widget.config.widgetInstanceGlobalTimeContext ||\n widget.config.widgetInstanceGlobalAutoRefreshContext)\n \"\n (dateContextChange)=\"updateWidgetConfig($event, widget)\"\n [canDecouple]=\"widget.config.canDecoupleGlobalTimeContext\"\n [displaySettings]=\"widget.config.displaySettings\"\n [hidden]=\"editMode$ | async\"\n ></c8y-widget-time-context>\n\n <c8y-widget-auto-refresh-context\n *ngIf=\"\n widget?.config?.widgetInstanceGlobalAutoRefreshContext &&\n widget.config?.displaySettings.globalAutoRefreshContext\n \"\n [editMode$]=\"editMode$\"\n ></c8y-widget-auto-refresh-context>\n\n <c8y-dynamic-component\n [componentId]=\"widget.componentId || widget.name\"\n [config]=\"\n widget.templateUrl || widget.widgetComponent\n ? { child: widget, dashboard: contextDashboard, context: context }\n : widget.config\n \"\n *ngIf=\"child.intersected\"\n (updateWidgetClasses)=\"updateWidgetClasses(widget, $event)\"\n ></c8y-dynamic-component>\n </c8y-dashboard-child>\n </c8y-dashboard>\n </ng-container>\n</ng-container>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i1$5.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: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "directive", type: i1$9.PopoverDirective, selector: "[popover]", inputs: ["adaptivePosition", "boundariesElement", "popover", "popoverContext", "popoverTitle", "placement", "outsideClick", "triggers", "container", "containerClass", "isOpen", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "component", type: GuideDocsComponent, selector: "[c8y-guide-docs]" }, { kind: "directive", type: GuideHrefDirective, selector: "[c8y-guide-href]", inputs: ["c8y-guide-href"] }, { kind: "component", type: DashboardComponent, selector: "c8y-dashboard", inputs: ["columns", "gap", "rows"], outputs: ["dashboardChange"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: DashboardChildComponent, selector: "c8y-dashboard-child", inputs: ["x", "y", "width", "height", "data", "margin", "useIntersection", "isFrozen", "canToggleFullscreen", "editMode", "class"], outputs: ["changeStart", "changeEnd", "toggleFullscreen"] }, { kind: "component", type: DashboardChildTitleComponent, selector: "c8y-dashboard-child-title" }, { kind: "component", type: DashboardChildActionComponent, selector: "c8y-dashboard-child-action" }, { kind: "component", type: WidgetTimeContextComponent, selector: "c8y-widget-time-context", inputs: ["canDecouple", "displaySettings", "hidden"], outputs: ["dateContextChange"] }, { kind: "component", type: WidgetAutoRefreshContextComponent, selector: "c8y-widget-auto-refresh-context", inputs: ["editMode$"] }, { kind: "component", type: DynamicComponentComponent, selector: "c8y-dynamic-component", inputs: ["componentId", "config", "mode", "notFoundError", "executeResolvers"], outputs: ["updateWidgetClasses"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
|
|
31331
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: WidgetsDashboardComponent, isStandalone: true, selector: "c8y-widgets-dashboard", inputs: { widgets: "widgets", context: "context", contextDashboard: "contextDashboard", _settings: ["settings", "_settings"], isCopyDisabled: "isCopyDisabled", breadcrumb: "breadcrumb", editModeButtons: "editModeButtons" }, outputs: { onAddWidget: "onAddWidget", onEditWidget: "onEditWidget", onDeleteWidget: "onDeleteWidget", onChangeDashboard: "onChangeDashboard", onResize: "onResize", onEditDashboard: "onEditDashboard", onCopyDashboard: "onCopyDashboard", onDeleteDashboard: "onDeleteDashboard", onChangeStart: "onChangeStart", onChangeEnd: "onChangeEnd", onSaveDashboard: "onSaveDashboard", onCancelDashboard: "onCancelDashboard", revertChange: "revertChange" }, host: { styleAttribute: "\n display: block;\n ", classAttribute: "dashboard c8y-grid-dashboard" }, providers: [WidgetsDashboardEventService], usesOnChanges: true, ngImport: i0, template: "<c8y-title *ngIf=\"!!settings.title\">\n {{ settings.title | translate }}\n</c8y-title>\n\n<c8y-breadcrumb *ngIf=\"!!breadcrumb\">\n <c8y-breadcrumb-item\n [icon]=\"breadcrumb.icon\"\n [label]=\"breadcrumb.label\"\n [path]=\"breadcrumb.path\"\n ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n [placement]=\"'left'\"\n [priority]=\"ACTION_BAR_EDIT_WIDGETS_PRIORITY\"\n *ngIf=\"!(editMode$ | async)\"\n>\n <button\n class=\"btn btn-link animated fadeIn hidden-xs\"\n title=\"{{ 'Edit widgets' | translate }}\"\n type=\"button\"\n [disabled]=\"settings.isDisabled\"\n (click)=\"enableEditMode()\"\n data-cy=\"c8y-widget-dashboard--edit-widgets\"\n >\n <i c8yIcon=\"send-backward\"></i>\n <span class=\"m-l-4\">{{ 'Edit widgets' | translate }}</span>\n </button>\n <button\n class=\"btn btn-link visible-xs m-l-0\"\n tooltip=\"{{ 'Not available on mobile phone' | translate }}\"\n type=\"button\"\n [disabled]=\"true\"\n >\n <i c8yIcon=\"send-backward\"></i>\n <span class=\"m-l-4\">{{ 'Edit widgets' | translate }}</span>\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'left'\"\n *ngIf=\"editMode$ | async\"\n>\n <button\n class=\"btn btn-link animated fadeIn\"\n title=\"{{ 'Add widget' | translate }}\"\n type=\"button\"\n (click)=\"onAddWidget.emit()\"\n data-cy=\"widget-dashboard--Add-widget\"\n >\n <i c8yIcon=\"plus-circle\"></i>\n {{ 'Add widget' | translate }}\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'left'\"\n itemClass=\"d-flex a-i-center gap-8\"\n *ngIf=\"editMode$ | async\"\n>\n <div class=\"input-group input-group-sm animated fadeIn\">\n <div class=\"input-group-btn\">\n <button\n class=\"btn btn-default btn-sm btn-icon\"\n [attr.aria-label]=\"'Undo' | translate\"\n [tooltip]=\"\n editModeButtons.undoButtonDisabled\n ? ''\n : (undoMessage\n | translate: { changeToUndo: editModeButtons.changeToUndoName | translate })\n \"\n container=\"body\"\n (click)=\"revertChange.emit('undo')\"\n [disabled]=\"editModeButtons.undoButtonDisabled\"\n >\n <i [c8yIcon]=\"'undo'\"></i>\n </button>\n </div>\n <div class=\"input-group-btn\">\n <button\n class=\"btn btn-default btn-sm btn-icon\"\n [attr.aria-label]=\"'Redo' | translate\"\n [tooltip]=\"\n editModeButtons.redoButtonDisabled\n ? ''\n : (redoMessage\n | translate: { changeToRedo: editModeButtons.changeToRedoName | translate })\n \"\n container=\"body\"\n (click)=\"revertChange.emit('redo')\"\n [disabled]=\"editModeButtons.redoButtonDisabled\"\n >\n <i [c8yIcon]=\"'redo'\"></i>\n </button>\n </div>\n <span></span>\n </div>\n <div class=\"btn-group animated fadeIn\">\n <button\n class=\"btn btn-default btn-sm\"\n title=\"{{ 'Cancel' | translate }}\"\n type=\"button\"\n (click)=\"cancelDashboardSave()\"\n >\n {{ 'Cancel' | translate }}\n </button>\n <button\n class=\"btn btn-primary btn-sm m-l-8\"\n title=\"{{ 'Save' | translate }}\"\n type=\"button\"\n [disabled]=\"editModeButtons.undoButtonDisabled\"\n (click)=\"saveDashboard()\"\n data-cy=\"c8y-widgets-dashboard--save\"\n >\n {{ 'Save' | translate }}\n </button>\n </div>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'right'\"\n *ngIf=\"onEditDashboard.observers.length\"\n>\n <button\n class=\"btn btn-link hidden-xs m-l-0\"\n title=\"{{ 'Dashboard settings' | translate }}\"\n type=\"button\"\n [disabled]=\"settings.isDisabled || (editMode$ | async)\"\n (click)=\"onEditDashboard.emit()\"\n data-cy=\"c8y-widgets-dashboard--edit-dashboard\"\n >\n <i c8yIcon=\"sorting-slider\"></i>\n <span class=\"visible-xs-inline hidden-sm visible-md-inline visible-lg-inline\">\n {{ 'Dashboard settings' | translate }}\n </span>\n </button>\n <button\n class=\"btn btn-link visible-xs m-l-0\"\n tooltip=\"{{ 'Not available on mobile phone' | translate }}\"\n type=\"button\"\n [disabled]=\"true\"\n >\n <i c8yIcon=\"sorting-slider\"></i>\n <span class=\"visible-xs-inline hidden-sm visible-md-inline visible-lg-inline\">\n {{ 'Dashboard settings' | translate }}\n </span>\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'right'\"\n *ngIf=\"settings.allowFullscreen\"\n [priority]=\"-5000\"\n itemClass=\"pull-right\"\n>\n <button\n class=\"btn btn-link\"\n [attr.aria-label]=\"'Full screen' | translate\"\n tooltip=\"{{ 'Full screen' | translate }}\"\n placement=\"left\"\n container=\"body\"\n type=\"button\"\n [delay]=\"500\"\n (click)=\"toggleFullscreen()\"\n data-cy=\"widgets-dashboard--Full-screen\"\n >\n <i [c8yIcon]=\"(inFullScreen$ | async) ? 'compress' : 'expand'\"></i>\n <span class=\"visible-xs-inline hidden-sm visible-md-inline visibile-lg-inline\">\n {{ 'Full screen' | translate }}\n </span>\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'more'\"\n [priority]=\"-2000\"\n *ngIf=\"settings.canCopy\"\n>\n <div\n [ngStyle]=\"{\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center'\n }\"\n >\n <button\n class=\"hidden-xs\"\n title=\"{{\n (isCopyDisabled === true || !isCopyDisabled?.state ? 'Disabled' : copyDashboardLabel)\n | translate\n }}\"\n type=\"button\"\n [ngClass]=\"{ 'btn btn-link': !settings.canDelete }\"\n data-cy=\"widgets-dashboard--copy-dashboard\"\n (click)=\"onCopyDashboard.emit()\"\n [disabled]=\"isCopyDisabled === true || !isCopyDisabled?.state || (editMode$ | async)\"\n >\n <i c8yIcon=\"clone\"></i>\n <span>{{ copyDashboardLabel | translate }}</span>\n </button>\n <button\n class=\"btn-help btn-help--sm m-r-16 hidden-xs\"\n [attr.aria-label]=\"'Help' | translate\"\n [popover]=\"copyDisabledPopoverMsg | translate\"\n placement=\"right\"\n triggers=\"focus\"\n container=\"body\"\n type=\"button\"\n *ngIf=\"!isCopyDisabled?.state && copyDisabledPopoverMsg\"\n data-cy=\"widgets-dashboard--info-copy-dashboard\"\n (click)=\"$event.stopPropagation()\"\n ></button>\n </div>\n <button\n class=\"visible-xs m-l-0\"\n tooltip=\"{{ 'Not available on mobile phone' | translate }}\"\n type=\"button\"\n [ngClass]=\"{ 'btn btn-link': !settings.canDelete }\"\n [disabled]=\"true\"\n >\n <i c8yIcon=\"clone\"></i>\n <span>{{ copyDashboardLabel | translate }}</span>\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'more'\"\n [priority]=\"-3000\"\n *ngIf=\"settings.canDelete && onDeleteDashboard.observers.length\"\n>\n <button\n class=\"hidden-xs\"\n title=\"{{ 'Delete dashboard' | translate }}\"\n type=\"button\"\n data-cy=\"widgets-dashboard--delete-dashboard\"\n [ngClass]=\"{ 'btn btn-link': !settings.canCopy }\"\n (click)=\"onDeleteDashboard.emit()\"\n [disabled]=\"settings.isDisabled || (editMode$ | async)\"\n >\n <i c8yIcon=\"delete\"></i>\n <span translate>Delete dashboard</span>\n </button>\n <button\n class=\"visible-xs m-l-0\"\n tooltip=\"{{ 'Not available on mobile phone' | translate }}\"\n type=\"button\"\n data-cy=\"widgets-dashboard--delete-dashboard-mobile\"\n [ngClass]=\"{ 'btn btn-link': !settings.canCopy }\"\n [disabled]=\"true\"\n >\n <i c8yIcon=\"delete\"></i>\n <span translate>Delete dashboard</span>\n </button>\n</c8y-action-bar-item>\n\n<ng-template #loadingIndicator>\n <c8y-loading\n class=\"col-xs-12 text-center\"\n *ngIf=\"isLoadingWidgets$ | async\"\n ></c8y-loading>\n</ng-template>\n\n<ng-container *ngIf=\"!(isLoadingWidgets$ | async); else loadingIndicator\">\n <ng-container *ngIf=\"resolvedWidgets$ | async as widgetsToDisplay\">\n <!-- empty state -->\n <c8y-ui-empty-state\n [icon]=\"'c8y-device'\"\n [title]=\"'No widgets to display.' | translate\"\n *ngIf=\"widgetsToDisplay?.length === 0\"\n >\n <div *ngIf=\"onAddWidget.observers.length\">\n <p\n translate\n *ngIf=\"editMode$ | async\"\n >\n Add widgets to this dashboard.\n </p>\n <p\n translate\n *ngIf=\"!(editMode$ | async)\"\n >\n Click \"Edit widgets\" to unlock\n </p>\n <div>\n @if (!settings.isDisabled && (editMode$ | async)) {\n <button\n class=\"btn btn-primary m-t-16\"\n title=\"{{ 'Add widget' | translate }}\"\n type=\"button\"\n (click)=\"onAddWidget.emit()\"\n data-cy=\"c8y-widgets-dashboard--add-widget\"\n translate\n >\n Add widget\n </button>\n }\n </div>\n <p c8y-guide-docs>\n <small\n translate\n ngNonBindable\n >\n Find out more in the\n <a c8y-guide-href=\"/docs/cockpit/working-with-dashboards\">user documentation</a>\n .\n </small>\n </p>\n </div>\n </c8y-ui-empty-state>\n\n <c8y-dashboard\n [columns]=\"settings.columns\"\n (dashboardChange)=\"onChangeDashboard.emit($event)\"\n #dashboard\n >\n <c8y-dashboard-child\n [class]=\"widget.classes\"\n *ngFor=\"let widget of widgetsToDisplay\"\n [x]=\"widget._x\"\n [y]=\"widget._y\"\n [width]=\"widget._width || settings.defaultWidth\"\n [height]=\"widget._height || settings.defaultHeight\"\n [margin]=\"settings.widgetMargin\"\n [data]=\"widget\"\n [useIntersection]=\"true\"\n [editMode]=\"editMode$ | async\"\n (changeStart)=\"onChangeStart.emit({ widget: widget, source: child, dashboard: dashboard })\"\n (changeEnd)=\"onChangeEnd.emit({ widget: widget, source: child, dashboard: dashboard })\"\n (toggleFullscreen)=\"toggleFullscreenOnWidget(child)\"\n [canToggleFullscreen]=\"!(inFullScreen$ | async) || widgetInFullscreenMode\"\n #child\n >\n <c8y-dashboard-child-title>\n <span\n data-cy=\"c8y-dashboard-list--device-widget\"\n *ngIf=\"settings.translateWidgetTitle\"\n >\n {{ widget.title | translate }}\n </span>\n <span *ngIf=\"!settings.translateWidgetTitle\">\n {{ widget.title }}\n </span>\n </c8y-dashboard-child-title>\n <c8y-dashboard-child-action *ngIf=\"onEditWidget.observers.length\">\n <button\n title=\"{{ 'Edit widget' | translate }}\"\n type=\"button\"\n data-cy=\"widgets-dashboard--Edit-widget\"\n (click)=\"onEditWidget.emit({ widget: widget, source: child, dashboard: dashboard })\"\n >\n <i c8yIcon=\"pencil\"></i>\n <span translate>Edit</span>\n </button>\n </c8y-dashboard-child-action>\n <c8y-dashboard-child-action *ngIf=\"onDeleteWidget.observers.length\">\n <button\n title=\"{{ 'Remove widget' | translate }}\"\n type=\"button\"\n data-cy=\"c8y-widgets-dashboard--remove-widget\"\n (click)=\"onDeleteWidget.emit({ widget: widget, source: child, dashboard: dashboard })\"\n >\n <i c8yIcon=\"delete\"></i>\n <span translate>Remove</span>\n </button>\n </c8y-dashboard-child-action>\n\n <c8y-widget-time-context\n *ngIf=\"\n (widget.config?.displaySettings?.globalTimeContext ||\n widget.config?.displaySettings?.globalRealtimeContext) &&\n (widget.config.widgetInstanceGlobalTimeContext ||\n widget.config.widgetInstanceGlobalAutoRefreshContext)\n \"\n (dateContextChange)=\"updateWidgetConfig($event, widget)\"\n [canDecouple]=\"widget.config.canDecoupleGlobalTimeContext\"\n [displaySettings]=\"widget.config.displaySettings\"\n [hidden]=\"editMode$ | async\"\n ></c8y-widget-time-context>\n\n <c8y-widget-auto-refresh-context\n *ngIf=\"\n widget?.config?.widgetInstanceGlobalAutoRefreshContext &&\n widget.config?.displaySettings.globalAutoRefreshContext\n \"\n [editMode$]=\"editMode$\"\n ></c8y-widget-auto-refresh-context>\n\n <c8y-dynamic-component\n [componentId]=\"widget.componentId || widget.name\"\n [config]=\"\n widget.templateUrl || widget.widgetComponent\n ? { child: widget, dashboard: contextDashboard, context: context }\n : widget.config\n \"\n *ngIf=\"child.intersected\"\n (updateWidgetClasses)=\"updateWidgetClasses(widget, $event)\"\n ></c8y-dynamic-component>\n </c8y-dashboard-child>\n </c8y-dashboard>\n </ng-container>\n</ng-container>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i1$5.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: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "directive", type: i1$9.PopoverDirective, selector: "[popover]", inputs: ["adaptivePosition", "boundariesElement", "popover", "popoverContext", "popoverTitle", "placement", "outsideClick", "triggers", "container", "containerClass", "isOpen", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "component", type: GuideDocsComponent, selector: "[c8y-guide-docs]" }, { kind: "directive", type: GuideHrefDirective, selector: "[c8y-guide-href]", inputs: ["c8y-guide-href"] }, { kind: "component", type: DashboardComponent, selector: "c8y-dashboard", inputs: ["columns", "gap", "rows"], outputs: ["dashboardChange"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: DashboardChildComponent, selector: "c8y-dashboard-child", inputs: ["x", "y", "width", "height", "data", "margin", "useIntersection", "isFrozen", "canToggleFullscreen", "editMode", "class"], outputs: ["changeStart", "changeEnd", "toggleFullscreen"] }, { kind: "component", type: DashboardChildTitleComponent, selector: "c8y-dashboard-child-title" }, { kind: "component", type: DashboardChildActionComponent, selector: "c8y-dashboard-child-action" }, { kind: "component", type: WidgetTimeContextComponent, selector: "c8y-widget-time-context", inputs: ["canDecouple", "displaySettings", "hidden"], outputs: ["dateContextChange"] }, { kind: "component", type: WidgetAutoRefreshContextComponent, selector: "c8y-widget-auto-refresh-context", inputs: ["editMode$"] }, { kind: "component", type: DynamicComponentComponent, selector: "c8y-dynamic-component", inputs: ["componentId", "config", "mode", "notFoundError", "executeResolvers"], outputs: ["updateWidgetClasses"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
|
|
31332
31332
|
}
|
|
31333
31333
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: WidgetsDashboardComponent, decorators: [{
|
|
31334
31334
|
type: Component,
|
|
@@ -31363,7 +31363,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
|
|
|
31363
31363
|
DynamicComponentComponent,
|
|
31364
31364
|
C8yTranslatePipe,
|
|
31365
31365
|
AsyncPipe
|
|
31366
|
-
], template: "<c8y-title *ngIf=\"!!settings.title\">\n {{ settings.title | translate }}\n</c8y-title>\n\n<c8y-breadcrumb *ngIf=\"!!breadcrumb\">\n <c8y-breadcrumb-item\n [icon]=\"breadcrumb.icon\"\n [label]=\"breadcrumb.label\"\n [path]=\"breadcrumb.path\"\n ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n [placement]=\"'left'\"\n [priority]=\"ACTION_BAR_EDIT_WIDGETS_PRIORITY\"\n *ngIf=\"!(editMode$ | async)\"\n>\n <button\n class=\"btn btn-link animated fadeIn hidden-xs\"\n title=\"{{ 'Edit widgets' | translate }}\"\n type=\"button\"\n [disabled]=\"settings.isDisabled\"\n (click)=\"enableEditMode()\"\n data-cy=\"c8y-widget-dashboard--edit-widgets\"\n >\n <i c8yIcon=\"send-backward\"></i>\n <span class=\"m-l-4\">{{ 'Edit widgets' | translate }}</span>\n </button>\n <button\n class=\"btn btn-link visible-xs m-l-0\"\n tooltip=\"{{ 'Not available on mobile phone' | translate }}\"\n type=\"button\"\n [disabled]=\"true\"\n >\n <i c8yIcon=\"send-backward\"></i>\n <span class=\"m-l-4\">{{ 'Edit widgets' | translate }}</span>\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'left'\"\n *ngIf=\"editMode$ | async\"\n>\n <button\n class=\"btn btn-link animated fadeIn\"\n title=\"{{ 'Add widget' | translate }}\"\n type=\"button\"\n (click)=\"onAddWidget.emit()\"\n data-cy=\"widget-dashboard--Add-widget\"\n >\n <i c8yIcon=\"plus-circle\"></i>\n {{ 'Add widget' | translate }}\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'left'\"\n itemClass=\"d-flex a-i-center gap-8\"\n *ngIf=\"editMode$ | async\"\n>\n <div class=\"input-group input-group-sm animated fadeIn\">\n <div class=\"input-group-btn\">\n <button\n class=\"btn btn-default btn-sm btn-icon\"\n [attr.aria-label]=\"'Undo' | translate\"\n [tooltip]=\"\n editModeButtons.undoButtonDisabled\n ? ''\n : (undoMessage\n | translate: { changeToUndo: editModeButtons.changeToUndoName | translate })\n \"\n container=\"body\"\n (click)=\"revertChange.emit('undo')\"\n [disabled]=\"editModeButtons.undoButtonDisabled\"\n >\n <i [c8yIcon]=\"'undo'\"></i>\n </button>\n </div>\n <div class=\"input-group-btn\">\n <button\n class=\"btn btn-default btn-sm btn-icon\"\n [attr.aria-label]=\"'Redo' | translate\"\n [tooltip]=\"\n editModeButtons.redoButtonDisabled\n ? ''\n : (redoMessage\n | translate: { changeToRedo: editModeButtons.changeToRedoName | translate })\n \"\n container=\"body\"\n (click)=\"revertChange.emit('redo')\"\n [disabled]=\"editModeButtons.redoButtonDisabled\"\n >\n <i [c8yIcon]=\"'redo'\"></i>\n </button>\n </div>\n <span></span>\n </div>\n <div class=\"btn-group animated fadeIn\">\n <button\n class=\"btn btn-default btn-sm\"\n title=\"{{ 'Cancel' | translate }}\"\n type=\"button\"\n (click)=\"cancelDashboardSave()\"\n >\n {{ 'Cancel' | translate }}\n </button>\n <button\n class=\"btn btn-primary btn-sm m-l-8\"\n title=\"{{ 'Save' | translate }}\"\n type=\"button\"\n [disabled]=\"editModeButtons.undoButtonDisabled\"\n (click)=\"saveDashboard()\"\n data-cy=\"c8y-widgets-dashboard--save\"\n >\n {{ 'Save' | translate }}\n </button>\n </div>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'right'\"\n *ngIf=\"onEditDashboard.observers.length\"\n>\n <button\n class=\"btn btn-link hidden-xs m-l-0\"\n title=\"{{ 'Dashboard settings' | translate }}\"\n type=\"button\"\n [disabled]=\"settings.isDisabled || (editMode$ | async)\"\n (click)=\"onEditDashboard.emit()\"\n data-cy=\"c8y-widgets-dashboard--edit-dashboard\"\n >\n <i c8yIcon=\"sorting-slider\"></i>\n <span class=\"visible-xs-inline hidden-sm visible-md-inline visible-lg-inline\">\n {{ 'Dashboard settings' | translate }}\n </span>\n </button>\n <button\n class=\"btn btn-link visible-xs m-l-0\"\n tooltip=\"{{ 'Not available on mobile phone' | translate }}\"\n type=\"button\"\n [disabled]=\"true\"\n >\n <i c8yIcon=\"sorting-slider\"></i>\n <span class=\"visible-xs-inline hidden-sm visible-md-inline visible-lg-inline\">\n {{ 'Dashboard settings' | translate }}\n </span>\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'right'\"\n *ngIf=\"settings.allowFullscreen\"\n [priority]=\"-5000\"\n itemClass=\"pull-right\"\n>\n <button\n class=\"btn btn-link\"\n [attr.aria-label]=\"'Full screen' | translate\"\n tooltip=\"{{ 'Full screen' | translate }}\"\n placement=\"left\"\n container=\"body\"\n type=\"button\"\n [delay]=\"500\"\n (click)=\"toggleFullscreen()\"\n data-cy=\"widgets-dashboard--Full-screen\"\n >\n <i [c8yIcon]=\"(inFullScreen$ | async) ? 'compress' : 'expand'\"></i>\n <span class=\"visible-xs-inline hidden-sm visible-md-inline visibile-lg-inline\">\n {{ 'Full screen' | translate }}\n </span>\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'more'\"\n [priority]=\"-2000\"\n *ngIf=\"settings.canCopy\"\n>\n <div\n [ngStyle]=\"{\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center'\n }\"\n >\n <button\n class=\"hidden-xs\"\n title=\"{{\n (isCopyDisabled === true || !isCopyDisabled?.state ? 'Disabled' : copyDashboardLabel)\n | translate\n }}\"\n type=\"button\"\n [ngClass]=\"{ 'btn btn-link': !settings.canDelete }\"\n data-cy=\"widgets-dashboard--copy-dashboard\"\n (click)=\"onCopyDashboard.emit()\"\n [disabled]=\"isCopyDisabled === true || !isCopyDisabled?.state || (editMode$ | async)\"\n >\n <i c8yIcon=\"clone\"></i>\n <span>{{ copyDashboardLabel | translate }}</span>\n </button>\n <button\n class=\"btn-help btn-help--sm m-r-16 hidden-xs\"\n [attr.aria-label]=\"'Help' | translate\"\n [popover]=\"copyDisabledPopoverMsg | translate\"\n placement=\"right\"\n triggers=\"focus\"\n container=\"body\"\n type=\"button\"\n *ngIf=\"!isCopyDisabled?.state && copyDisabledPopoverMsg\"\n data-cy=\"widgets-dashboard--info-copy-dashboard\"\n (click)=\"$event.stopPropagation()\"\n ></button>\n </div>\n <button\n class=\"visible-xs m-l-0\"\n tooltip=\"{{ 'Not available on mobile phone' | translate }}\"\n type=\"button\"\n [ngClass]=\"{ 'btn btn-link': !settings.canDelete }\"\n [disabled]=\"true\"\n >\n <i c8yIcon=\"clone\"></i>\n <span>{{ copyDashboardLabel | translate }}</span>\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'more'\"\n [priority]=\"-3000\"\n *ngIf=\"settings.canDelete && onDeleteDashboard.observers.length\"\n>\n <button\n class=\"hidden-xs\"\n title=\"{{ 'Delete dashboard' | translate }}\"\n type=\"button\"\n data-cy=\"widgets-dashboard--delete-dashboard\"\n [ngClass]=\"{ 'btn btn-link': !settings.canCopy }\"\n (click)=\"onDeleteDashboard.emit()\"\n [disabled]=\"settings.isDisabled || (editMode$ | async)\"\n >\n <i c8yIcon=\"delete\"></i>\n <span translate>Delete dashboard</span>\n </button>\n <button\n class=\"visible-xs m-l-0\"\n tooltip=\"{{ 'Not available on mobile phone' | translate }}\"\n type=\"button\"\n data-cy=\"widgets-dashboard--delete-dashboard-mobile\"\n [ngClass]=\"{ 'btn btn-link': !settings.canCopy }\"\n [disabled]=\"true\"\n >\n <i c8yIcon=\"delete\"></i>\n <span translate>Delete dashboard</span>\n </button>\n</c8y-action-bar-item>\n\n<ng-template #loadingIndicator>\n <c8y-loading\n class=\"col-xs-12 text-center\"\n *ngIf=\"isLoadingWidgets$ | async\"\n ></c8y-loading>\n</ng-template>\n\n<ng-container *ngIf=\"!(isLoadingWidgets$ | async); else loadingIndicator\">\n <ng-container *ngIf=\"resolvedWidgets$ | async as widgetsToDisplay\">\n <!-- empty state -->\n <c8y-ui-empty-state\n [icon]=\"'c8y-device'\"\n [title]=\"'No widgets to display.' | translate\"\n *ngIf=\"widgetsToDisplay?.length === 0\"\n >\n <div *ngIf=\"onAddWidget.observers.length\">\n <p\n translate\n *ngIf=\"editMode$ | async\"\n >\n Add widgets to this dashboard.\n </p>\n <p\n translate\n *ngIf=\"!(editMode$ | async)\"\n >\n Click \"Edit widgets\" to unlock\n </p>\n <div>\n <button\n class=\"btn btn-primary m-t-16\"\n title=\"{{ 'Add widget' | translate }}\"\n type=\"button\"\n [disabled]=\"settings.isDisabled || !(editMode$ | async)\"\n (click)=\"onAddWidget.emit()\"\n data-cy=\"c8y-widgets-dashboard--add-widget\"\n translate\n >\n Add widget\n </button>\n </div>\n <p c8y-guide-docs>\n <small\n translate\n ngNonBindable\n >\n Find out more in the\n <a c8y-guide-href=\"/docs/cockpit/working-with-dashboards\">user documentation</a>\n .\n </small>\n </p>\n </div>\n </c8y-ui-empty-state>\n\n <c8y-dashboard\n [columns]=\"settings.columns\"\n (dashboardChange)=\"onChangeDashboard.emit($event)\"\n #dashboard\n >\n <c8y-dashboard-child\n [class]=\"widget.classes\"\n *ngFor=\"let widget of widgetsToDisplay\"\n [x]=\"widget._x\"\n [y]=\"widget._y\"\n [width]=\"widget._width || settings.defaultWidth\"\n [height]=\"widget._height || settings.defaultHeight\"\n [margin]=\"settings.widgetMargin\"\n [data]=\"widget\"\n [useIntersection]=\"true\"\n [editMode]=\"editMode$ | async\"\n (changeStart)=\"onChangeStart.emit({ widget: widget, source: child, dashboard: dashboard })\"\n (changeEnd)=\"onChangeEnd.emit({ widget: widget, source: child, dashboard: dashboard })\"\n (toggleFullscreen)=\"toggleFullscreenOnWidget(child)\"\n [canToggleFullscreen]=\"!(inFullScreen$ | async) || widgetInFullscreenMode\"\n #child\n >\n <c8y-dashboard-child-title>\n <span\n data-cy=\"c8y-dashboard-list--device-widget\"\n *ngIf=\"settings.translateWidgetTitle\"\n >\n {{ widget.title | translate }}\n </span>\n <span *ngIf=\"!settings.translateWidgetTitle\">\n {{ widget.title }}\n </span>\n </c8y-dashboard-child-title>\n <c8y-dashboard-child-action *ngIf=\"onEditWidget.observers.length\">\n <button\n title=\"{{ 'Edit widget' | translate }}\"\n type=\"button\"\n data-cy=\"widgets-dashboard--Edit-widget\"\n (click)=\"onEditWidget.emit({ widget: widget, source: child, dashboard: dashboard })\"\n >\n <i c8yIcon=\"pencil\"></i>\n <span translate>Edit</span>\n </button>\n </c8y-dashboard-child-action>\n <c8y-dashboard-child-action *ngIf=\"onDeleteWidget.observers.length\">\n <button\n title=\"{{ 'Remove widget' | translate }}\"\n type=\"button\"\n data-cy=\"c8y-widgets-dashboard--remove-widget\"\n (click)=\"onDeleteWidget.emit({ widget: widget, source: child, dashboard: dashboard })\"\n >\n <i c8yIcon=\"delete\"></i>\n <span translate>Remove</span>\n </button>\n </c8y-dashboard-child-action>\n\n <c8y-widget-time-context\n *ngIf=\"\n (widget.config?.displaySettings?.globalTimeContext ||\n widget.config?.displaySettings?.globalRealtimeContext) &&\n (widget.config.widgetInstanceGlobalTimeContext ||\n widget.config.widgetInstanceGlobalAutoRefreshContext)\n \"\n (dateContextChange)=\"updateWidgetConfig($event, widget)\"\n [canDecouple]=\"widget.config.canDecoupleGlobalTimeContext\"\n [displaySettings]=\"widget.config.displaySettings\"\n [hidden]=\"editMode$ | async\"\n ></c8y-widget-time-context>\n\n <c8y-widget-auto-refresh-context\n *ngIf=\"\n widget?.config?.widgetInstanceGlobalAutoRefreshContext &&\n widget.config?.displaySettings.globalAutoRefreshContext\n \"\n [editMode$]=\"editMode$\"\n ></c8y-widget-auto-refresh-context>\n\n <c8y-dynamic-component\n [componentId]=\"widget.componentId || widget.name\"\n [config]=\"\n widget.templateUrl || widget.widgetComponent\n ? { child: widget, dashboard: contextDashboard, context: context }\n : widget.config\n \"\n *ngIf=\"child.intersected\"\n (updateWidgetClasses)=\"updateWidgetClasses(widget, $event)\"\n ></c8y-dynamic-component>\n </c8y-dashboard-child>\n </c8y-dashboard>\n </ng-container>\n</ng-container>\n" }]
|
|
31366
|
+
], template: "<c8y-title *ngIf=\"!!settings.title\">\n {{ settings.title | translate }}\n</c8y-title>\n\n<c8y-breadcrumb *ngIf=\"!!breadcrumb\">\n <c8y-breadcrumb-item\n [icon]=\"breadcrumb.icon\"\n [label]=\"breadcrumb.label\"\n [path]=\"breadcrumb.path\"\n ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n [placement]=\"'left'\"\n [priority]=\"ACTION_BAR_EDIT_WIDGETS_PRIORITY\"\n *ngIf=\"!(editMode$ | async)\"\n>\n <button\n class=\"btn btn-link animated fadeIn hidden-xs\"\n title=\"{{ 'Edit widgets' | translate }}\"\n type=\"button\"\n [disabled]=\"settings.isDisabled\"\n (click)=\"enableEditMode()\"\n data-cy=\"c8y-widget-dashboard--edit-widgets\"\n >\n <i c8yIcon=\"send-backward\"></i>\n <span class=\"m-l-4\">{{ 'Edit widgets' | translate }}</span>\n </button>\n <button\n class=\"btn btn-link visible-xs m-l-0\"\n tooltip=\"{{ 'Not available on mobile phone' | translate }}\"\n type=\"button\"\n [disabled]=\"true\"\n >\n <i c8yIcon=\"send-backward\"></i>\n <span class=\"m-l-4\">{{ 'Edit widgets' | translate }}</span>\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'left'\"\n *ngIf=\"editMode$ | async\"\n>\n <button\n class=\"btn btn-link animated fadeIn\"\n title=\"{{ 'Add widget' | translate }}\"\n type=\"button\"\n (click)=\"onAddWidget.emit()\"\n data-cy=\"widget-dashboard--Add-widget\"\n >\n <i c8yIcon=\"plus-circle\"></i>\n {{ 'Add widget' | translate }}\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'left'\"\n itemClass=\"d-flex a-i-center gap-8\"\n *ngIf=\"editMode$ | async\"\n>\n <div class=\"input-group input-group-sm animated fadeIn\">\n <div class=\"input-group-btn\">\n <button\n class=\"btn btn-default btn-sm btn-icon\"\n [attr.aria-label]=\"'Undo' | translate\"\n [tooltip]=\"\n editModeButtons.undoButtonDisabled\n ? ''\n : (undoMessage\n | translate: { changeToUndo: editModeButtons.changeToUndoName | translate })\n \"\n container=\"body\"\n (click)=\"revertChange.emit('undo')\"\n [disabled]=\"editModeButtons.undoButtonDisabled\"\n >\n <i [c8yIcon]=\"'undo'\"></i>\n </button>\n </div>\n <div class=\"input-group-btn\">\n <button\n class=\"btn btn-default btn-sm btn-icon\"\n [attr.aria-label]=\"'Redo' | translate\"\n [tooltip]=\"\n editModeButtons.redoButtonDisabled\n ? ''\n : (redoMessage\n | translate: { changeToRedo: editModeButtons.changeToRedoName | translate })\n \"\n container=\"body\"\n (click)=\"revertChange.emit('redo')\"\n [disabled]=\"editModeButtons.redoButtonDisabled\"\n >\n <i [c8yIcon]=\"'redo'\"></i>\n </button>\n </div>\n <span></span>\n </div>\n <div class=\"btn-group animated fadeIn\">\n <button\n class=\"btn btn-default btn-sm\"\n title=\"{{ 'Cancel' | translate }}\"\n type=\"button\"\n (click)=\"cancelDashboardSave()\"\n >\n {{ 'Cancel' | translate }}\n </button>\n <button\n class=\"btn btn-primary btn-sm m-l-8\"\n title=\"{{ 'Save' | translate }}\"\n type=\"button\"\n [disabled]=\"editModeButtons.undoButtonDisabled\"\n (click)=\"saveDashboard()\"\n data-cy=\"c8y-widgets-dashboard--save\"\n >\n {{ 'Save' | translate }}\n </button>\n </div>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'right'\"\n *ngIf=\"onEditDashboard.observers.length\"\n>\n <button\n class=\"btn btn-link hidden-xs m-l-0\"\n title=\"{{ 'Dashboard settings' | translate }}\"\n type=\"button\"\n [disabled]=\"settings.isDisabled || (editMode$ | async)\"\n (click)=\"onEditDashboard.emit()\"\n data-cy=\"c8y-widgets-dashboard--edit-dashboard\"\n >\n <i c8yIcon=\"sorting-slider\"></i>\n <span class=\"visible-xs-inline hidden-sm visible-md-inline visible-lg-inline\">\n {{ 'Dashboard settings' | translate }}\n </span>\n </button>\n <button\n class=\"btn btn-link visible-xs m-l-0\"\n tooltip=\"{{ 'Not available on mobile phone' | translate }}\"\n type=\"button\"\n [disabled]=\"true\"\n >\n <i c8yIcon=\"sorting-slider\"></i>\n <span class=\"visible-xs-inline hidden-sm visible-md-inline visible-lg-inline\">\n {{ 'Dashboard settings' | translate }}\n </span>\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'right'\"\n *ngIf=\"settings.allowFullscreen\"\n [priority]=\"-5000\"\n itemClass=\"pull-right\"\n>\n <button\n class=\"btn btn-link\"\n [attr.aria-label]=\"'Full screen' | translate\"\n tooltip=\"{{ 'Full screen' | translate }}\"\n placement=\"left\"\n container=\"body\"\n type=\"button\"\n [delay]=\"500\"\n (click)=\"toggleFullscreen()\"\n data-cy=\"widgets-dashboard--Full-screen\"\n >\n <i [c8yIcon]=\"(inFullScreen$ | async) ? 'compress' : 'expand'\"></i>\n <span class=\"visible-xs-inline hidden-sm visible-md-inline visibile-lg-inline\">\n {{ 'Full screen' | translate }}\n </span>\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'more'\"\n [priority]=\"-2000\"\n *ngIf=\"settings.canCopy\"\n>\n <div\n [ngStyle]=\"{\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center'\n }\"\n >\n <button\n class=\"hidden-xs\"\n title=\"{{\n (isCopyDisabled === true || !isCopyDisabled?.state ? 'Disabled' : copyDashboardLabel)\n | translate\n }}\"\n type=\"button\"\n [ngClass]=\"{ 'btn btn-link': !settings.canDelete }\"\n data-cy=\"widgets-dashboard--copy-dashboard\"\n (click)=\"onCopyDashboard.emit()\"\n [disabled]=\"isCopyDisabled === true || !isCopyDisabled?.state || (editMode$ | async)\"\n >\n <i c8yIcon=\"clone\"></i>\n <span>{{ copyDashboardLabel | translate }}</span>\n </button>\n <button\n class=\"btn-help btn-help--sm m-r-16 hidden-xs\"\n [attr.aria-label]=\"'Help' | translate\"\n [popover]=\"copyDisabledPopoverMsg | translate\"\n placement=\"right\"\n triggers=\"focus\"\n container=\"body\"\n type=\"button\"\n *ngIf=\"!isCopyDisabled?.state && copyDisabledPopoverMsg\"\n data-cy=\"widgets-dashboard--info-copy-dashboard\"\n (click)=\"$event.stopPropagation()\"\n ></button>\n </div>\n <button\n class=\"visible-xs m-l-0\"\n tooltip=\"{{ 'Not available on mobile phone' | translate }}\"\n type=\"button\"\n [ngClass]=\"{ 'btn btn-link': !settings.canDelete }\"\n [disabled]=\"true\"\n >\n <i c8yIcon=\"clone\"></i>\n <span>{{ copyDashboardLabel | translate }}</span>\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n [placement]=\"'more'\"\n [priority]=\"-3000\"\n *ngIf=\"settings.canDelete && onDeleteDashboard.observers.length\"\n>\n <button\n class=\"hidden-xs\"\n title=\"{{ 'Delete dashboard' | translate }}\"\n type=\"button\"\n data-cy=\"widgets-dashboard--delete-dashboard\"\n [ngClass]=\"{ 'btn btn-link': !settings.canCopy }\"\n (click)=\"onDeleteDashboard.emit()\"\n [disabled]=\"settings.isDisabled || (editMode$ | async)\"\n >\n <i c8yIcon=\"delete\"></i>\n <span translate>Delete dashboard</span>\n </button>\n <button\n class=\"visible-xs m-l-0\"\n tooltip=\"{{ 'Not available on mobile phone' | translate }}\"\n type=\"button\"\n data-cy=\"widgets-dashboard--delete-dashboard-mobile\"\n [ngClass]=\"{ 'btn btn-link': !settings.canCopy }\"\n [disabled]=\"true\"\n >\n <i c8yIcon=\"delete\"></i>\n <span translate>Delete dashboard</span>\n </button>\n</c8y-action-bar-item>\n\n<ng-template #loadingIndicator>\n <c8y-loading\n class=\"col-xs-12 text-center\"\n *ngIf=\"isLoadingWidgets$ | async\"\n ></c8y-loading>\n</ng-template>\n\n<ng-container *ngIf=\"!(isLoadingWidgets$ | async); else loadingIndicator\">\n <ng-container *ngIf=\"resolvedWidgets$ | async as widgetsToDisplay\">\n <!-- empty state -->\n <c8y-ui-empty-state\n [icon]=\"'c8y-device'\"\n [title]=\"'No widgets to display.' | translate\"\n *ngIf=\"widgetsToDisplay?.length === 0\"\n >\n <div *ngIf=\"onAddWidget.observers.length\">\n <p\n translate\n *ngIf=\"editMode$ | async\"\n >\n Add widgets to this dashboard.\n </p>\n <p\n translate\n *ngIf=\"!(editMode$ | async)\"\n >\n Click \"Edit widgets\" to unlock\n </p>\n <div>\n @if (!settings.isDisabled && (editMode$ | async)) {\n <button\n class=\"btn btn-primary m-t-16\"\n title=\"{{ 'Add widget' | translate }}\"\n type=\"button\"\n (click)=\"onAddWidget.emit()\"\n data-cy=\"c8y-widgets-dashboard--add-widget\"\n translate\n >\n Add widget\n </button>\n }\n </div>\n <p c8y-guide-docs>\n <small\n translate\n ngNonBindable\n >\n Find out more in the\n <a c8y-guide-href=\"/docs/cockpit/working-with-dashboards\">user documentation</a>\n .\n </small>\n </p>\n </div>\n </c8y-ui-empty-state>\n\n <c8y-dashboard\n [columns]=\"settings.columns\"\n (dashboardChange)=\"onChangeDashboard.emit($event)\"\n #dashboard\n >\n <c8y-dashboard-child\n [class]=\"widget.classes\"\n *ngFor=\"let widget of widgetsToDisplay\"\n [x]=\"widget._x\"\n [y]=\"widget._y\"\n [width]=\"widget._width || settings.defaultWidth\"\n [height]=\"widget._height || settings.defaultHeight\"\n [margin]=\"settings.widgetMargin\"\n [data]=\"widget\"\n [useIntersection]=\"true\"\n [editMode]=\"editMode$ | async\"\n (changeStart)=\"onChangeStart.emit({ widget: widget, source: child, dashboard: dashboard })\"\n (changeEnd)=\"onChangeEnd.emit({ widget: widget, source: child, dashboard: dashboard })\"\n (toggleFullscreen)=\"toggleFullscreenOnWidget(child)\"\n [canToggleFullscreen]=\"!(inFullScreen$ | async) || widgetInFullscreenMode\"\n #child\n >\n <c8y-dashboard-child-title>\n <span\n data-cy=\"c8y-dashboard-list--device-widget\"\n *ngIf=\"settings.translateWidgetTitle\"\n >\n {{ widget.title | translate }}\n </span>\n <span *ngIf=\"!settings.translateWidgetTitle\">\n {{ widget.title }}\n </span>\n </c8y-dashboard-child-title>\n <c8y-dashboard-child-action *ngIf=\"onEditWidget.observers.length\">\n <button\n title=\"{{ 'Edit widget' | translate }}\"\n type=\"button\"\n data-cy=\"widgets-dashboard--Edit-widget\"\n (click)=\"onEditWidget.emit({ widget: widget, source: child, dashboard: dashboard })\"\n >\n <i c8yIcon=\"pencil\"></i>\n <span translate>Edit</span>\n </button>\n </c8y-dashboard-child-action>\n <c8y-dashboard-child-action *ngIf=\"onDeleteWidget.observers.length\">\n <button\n title=\"{{ 'Remove widget' | translate }}\"\n type=\"button\"\n data-cy=\"c8y-widgets-dashboard--remove-widget\"\n (click)=\"onDeleteWidget.emit({ widget: widget, source: child, dashboard: dashboard })\"\n >\n <i c8yIcon=\"delete\"></i>\n <span translate>Remove</span>\n </button>\n </c8y-dashboard-child-action>\n\n <c8y-widget-time-context\n *ngIf=\"\n (widget.config?.displaySettings?.globalTimeContext ||\n widget.config?.displaySettings?.globalRealtimeContext) &&\n (widget.config.widgetInstanceGlobalTimeContext ||\n widget.config.widgetInstanceGlobalAutoRefreshContext)\n \"\n (dateContextChange)=\"updateWidgetConfig($event, widget)\"\n [canDecouple]=\"widget.config.canDecoupleGlobalTimeContext\"\n [displaySettings]=\"widget.config.displaySettings\"\n [hidden]=\"editMode$ | async\"\n ></c8y-widget-time-context>\n\n <c8y-widget-auto-refresh-context\n *ngIf=\"\n widget?.config?.widgetInstanceGlobalAutoRefreshContext &&\n widget.config?.displaySettings.globalAutoRefreshContext\n \"\n [editMode$]=\"editMode$\"\n ></c8y-widget-auto-refresh-context>\n\n <c8y-dynamic-component\n [componentId]=\"widget.componentId || widget.name\"\n [config]=\"\n widget.templateUrl || widget.widgetComponent\n ? { child: widget, dashboard: contextDashboard, context: context }\n : widget.config\n \"\n *ngIf=\"child.intersected\"\n (updateWidgetClasses)=\"updateWidgetClasses(widget, $event)\"\n ></c8y-dynamic-component>\n </c8y-dashboard-child>\n </c8y-dashboard>\n </ng-container>\n</ng-container>\n" }]
|
|
31367
31367
|
}], ctorParameters: () => [{ type: DynamicComponentService }, { type: i1$1.TranslateService }, { type: i1$4.ActivatedRoute }, { type: ModalService }, { type: WidgetGlobalAutoRefreshService }, { type: i1$4.Router }, { type: i0.ElementRef }], propDecorators: { widgets: [{
|
|
31368
31368
|
type: Input
|
|
31369
31369
|
}], context: [{
|