@c8y/ngx-components
Version:
Angular modules for Cumulocity IoT applications
330 lines (322 loc) • 33.8 kB
JavaScript
import * as i0 from '@angular/core';
import { Injectable, ViewChild, Component, NgModule } from '@angular/core';
import { RouterLink, RouterModule } from '@angular/router';
import * as i4 from '@c8y/ngx-components';
import { NavigatorNode, Permissions, Status, TitleComponent, ActionBarItemComponent, IconDirective, HelpComponent, ListGroupComponent, ListItemComponent, ListItemIconComponent, ListItemBodyComponent, ForOfDirective, EmptyStateComponent, ProductExperienceDirective, GuideDocsComponent, C8yTranslateDirective, GuideHrefDirective, C8yTranslatePipe, FilterInputComponent, CoreModule, hookRoute, hookNavigator, ViewContext } from '@c8y/ngx-components';
import * as i1 from '@c8y/ngx-components/context-dashboard';
import { ContextDashboardType, PRODUCT_EXPERIENCE, ContextDashboardModule, ContextDashboardComponent } from '@c8y/ngx-components/context-dashboard';
import { tap, debounceTime, distinctUntilChanged, switchMap, shareReplay } from 'rxjs/operators';
import { from, of, BehaviorSubject, combineLatest } from 'rxjs';
import { gettext } from '@c8y/ngx-components/gettext';
import * as i1$1 from '@c8y/client';
import { QueriesUtil } from '@c8y/client';
import * as i3 from '@ngx-translate/core';
import * as i6 from '@angular/forms';
import { FormsModule } from '@angular/forms';
import { NgIf, NgClass, AsyncPipe } from '@angular/common';
import { PopoverDirective, PopoverModule } from 'ngx-bootstrap/popover';
import * as i1$2 from 'ngx-bootstrap/tooltip';
import { TooltipDirective, TooltipModule } from 'ngx-bootstrap/tooltip';
class ReportDashboardGuard {
constructor(contextDashboardService) {
this.contextDashboardService = contextDashboardService;
}
canActivate(route) {
const reportId = route.data.contextData && route.data.contextData.id;
return from(this.contextDashboardService.activateDashboards(route, [ContextDashboardType.Named])).pipe(tap(res => {
return Array.isArray(res) && res.length === 0
? this.createDashboardIfNotExist(reportId)
: of(true);
}));
}
createDashboardIfNotExist(reportId) {
const dashboardCfg = {};
return this.contextDashboardService
.create(dashboardCfg, undefined, `report_${reportId}`)
.then(() => true);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ReportDashboardGuard, deps: [{ token: i1.ContextDashboardService }], target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ReportDashboardGuard, providedIn: 'root' }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ReportDashboardGuard, decorators: [{
type: Injectable,
args: [{ providedIn: 'root' }]
}], ctorParameters: () => [{ type: i1.ContextDashboardService }] });
class ReportDashboardService {
constructor(inventoryService, navigatorService) {
this.inventoryService = inventoryService;
this.navigatorService = navigatorService;
this.queriesUtil = new QueriesUtil();
}
listReports(options = {}) {
let query = {
__has: 'c8y_Report'
};
if (options.filter) {
query = this.queriesUtil.addAndFilter(query, options.filter);
}
const filters = {
query: this.queriesUtil.buildQuery(query),
pageSize: options.pageSize || 50,
withTotalPages: true
};
return this.inventoryService.list(filters);
}
removeNavigatorNode(report) {
this.navigatorService.state.forEach(node => {
if (node.path === `reports/${report.id}`) {
this.navigatorService.remove(node);
return;
}
});
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ReportDashboardService, deps: [{ token: i1$1.InventoryService }, { token: i4.NavigatorService }], target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ReportDashboardService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ReportDashboardService, decorators: [{
type: Injectable
}], ctorParameters: () => [{ type: i1$1.InventoryService }, { type: i4.NavigatorService }] });
const REPORTS_NAVIGATOR_NODE_PRIORITY = 40;
class ReportDashboardNavigationFactory {
constructor(navigatorService, reportDashboardService) {
this.navigatorService = navigatorService;
this.reportDashboardService = reportDashboardService;
this.loaded = false;
}
async get() {
if (!this.loaded) {
this.loaded = true;
this.navigatorService.add(new NavigatorNode({
label: gettext('Reports'),
path: 'reports',
icon: 'c8y-reports',
featureId: 'reports',
priority: REPORTS_NAVIGATOR_NODE_PRIORITY
}));
const reports = (await this.reportDashboardService.listReports({
filter: { __has: 'c8y_IsNavigatorNode' },
pageSize: 2000
})).data;
reports.forEach(report => {
const node = new NavigatorNode({
label: report.name,
path: `reports/${report.id}`,
icon: report.icon,
priority: report.priority,
routerLinkExact: false,
skipLabelTranslation: !report.translateDashboardTitle
});
this.navigatorService.add(node);
});
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ReportDashboardNavigationFactory, deps: [{ token: i4.NavigatorService }, { token: ReportDashboardService }], target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ReportDashboardNavigationFactory, providedIn: 'root' }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ReportDashboardNavigationFactory, decorators: [{
type: Injectable,
args: [{ providedIn: 'root' }]
}], ctorParameters: () => [{ type: i4.NavigatorService }, { type: ReportDashboardService }] });
class ReportDashboardListComponent {
constructor(inventoryService, contextDashboardService, translateService, modal, alertService, reportDashboardService, permissions, gainsightService) {
this.inventoryService = inventoryService;
this.contextDashboardService = contextDashboardService;
this.translateService = translateService;
this.modal = modal;
this.alertService = alertService;
this.reportDashboardService = reportDashboardService;
this.permissions = permissions;
this.gainsightService = gainsightService;
this.PRODUCT_EXPERIENCE = PRODUCT_EXPERIENCE;
this.textFilter$ = new BehaviorSubject('');
this.reload$ = new BehaviorSubject(null);
this.reloading = false;
this.reports$ = combineLatest(this.textFilter$.pipe(debounceTime(400), distinctUntilChanged()), this.reload$).pipe(tap(() => {
this.reloading = true;
}), switchMap(([text]) => this.loadReports(text)), tap(() => {
this.reloading = false;
}), shareReplay(1));
this.canAddReport = false;
this.DELETED_SUCCESS_MSG = gettext('Report deleted.');
}
ngOnInit() {
this.canAddReport = this.permissions.hasAnyRole([
Permissions.ROLE_INVENTORY_CREATE,
Permissions.ROLE_INVENTORY_ADMIN,
Permissions.ROLE_MANAGED_OBJECT_ADMIN,
Permissions.ROLE_MANAGED_OBJECT_CREATE
]);
}
async loadReports(partialName) {
return partialName
? this.reportDashboardService.listReports({ filter: { name: `*${partialName}*` } })
: this.reportDashboardService.listReports();
}
async delete(report) {
try {
const dashboard = await this.contextDashboardService
.getDashboard$(`report_${report.id}`, [ContextDashboardType.Named])
.toPromise();
const isDashboardFrozen = !!dashboard?.c8y_Dashboard?.isFrozen;
const msg = isDashboardFrozen
? gettext(`You are about to delete the report "{{ reportName }}". Be aware that the report has a locked dashboard assigned. Do you want to proceed?`)
: gettext(`You are about to delete the report "{{ reportName }}". Do you want to proceed?`);
await this.modal.confirm(gettext('Delete report'), this.translateService.instant(msg, {
reportName: report.name
}), Status.DANGER, {
ok: gettext('Delete'),
cancel: gettext('Cancel')
});
await this.contextDashboardService.delete(dashboard, false);
await this.inventoryService.delete(report.id);
this.alertService.success(this.DELETED_SUCCESS_MSG);
if (report.c8y_IsNavigatorNode) {
this.reportDashboardService.removeNavigatorNode(report);
}
this.reload$.next();
this.gainsightService.triggerEvent(PRODUCT_EXPERIENCE.DASHBOARD.EVENTS.REPORTS, {
component: PRODUCT_EXPERIENCE.DASHBOARD.COMPONENTS.REPORTS_LIST,
action: PRODUCT_EXPERIENCE.DASHBOARD.ACTIONS.DELETE,
name: report.name,
id: report.id,
context: PRODUCT_EXPERIENCE.DASHBOARD.CONTEXT.REPORT
});
}
catch (ex) {
if (ex) {
throw new Error(`Something went wrong: ${ex}`);
}
}
}
async update(report) {
report.c8y_IsNavigatorNode = report.c8y_IsNavigatorNode ? {} : null;
await this.inventoryService.update(report);
report.c8y_IsNavigatorNode
? this.contextDashboardService.addReportNavigatorNode(report)
: this.reportDashboardService.removeNavigatorNode(report);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ReportDashboardListComponent, deps: [{ token: i1$1.InventoryService }, { token: i1.ContextDashboardService }, { token: i3.TranslateService }, { token: i4.ModalService }, { token: i4.AlertService }, { token: ReportDashboardService }, { token: i4.Permissions }, { token: i4.GainsightService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: ReportDashboardListComponent, isStandalone: true, selector: "c8y-report-dashboard-list", viewQueries: [{ propertyName: "filter", first: true, predicate: FilterInputComponent, descendants: true }], ngImport: i0, template: "<c8y-title>\n {{ 'Reports' | translate }}\n</c8y-title>\n\n<c8y-action-bar-item\n [placement]=\"'left'\"\n itemClass=\"navbar-form\"\n>\n <div class=\"input-group input-group-search\">\n <input\n class=\"form-control\"\n [attr.aria-label]=\"'Filter' | translate\"\n placeholder=\"{{ 'Filter\u2026' | translate }}\"\n type=\"search\"\n [ngModel]=\"textFilter$ | async\"\n (ngModelChange)=\"textFilter$.next($event)\"\n />\n <span class=\"input-group-addon\">\n <i\n c8yIcon=\"search\"\n *ngIf=\"(textFilter$ | async).length === 0\"\n ></i>\n <i\n class=\"text-muted\"\n c8yIcon=\"times\"\n *ngIf=\"(textFilter$ | async).length > 0\"\n (click)=\"textFilter$.next('')\"\n px-event=\"Clear filtering reports\"\n ></i>\n </span>\n </div>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n <button\n class=\"btn btn-link\"\n title=\"{{ 'Add report' | translate }}\"\n type=\"button\"\n [attr.data-cy]=\"'reports-add-report-action-bar-button'\"\n routerLink=\"/report/new-report\"\n [disabled]=\"!canAddReport\"\n >\n <i c8yIcon=\"plus-circle\"></i>\n {{ 'Add report' | translate }}\n </button>\n <button\n class=\"btn btn-dot m-r-16\"\n aria-label=\"{{ 'Info' | translate }}\"\n popover=\"{{ 'You don\\'t have permission to add reports' | translate }}\"\n placement=\"top\"\n triggers=\"focus\"\n container=\"body\"\n type=\"button\"\n *ngIf=\"!canAddReport\"\n >\n <i\n class=\"text-primary\"\n [c8yIcon]=\"'info-circle'\"\n ></i>\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n <button\n class=\"btn btn-link\"\n title=\"{{ 'Reload' | translate }}\"\n type=\"button\"\n (click)=\"loadReports()\"\n >\n <i\n c8yIcon=\"refresh\"\n [ngClass]=\"{ 'icon-spin': reloading }\"\n ></i>\n {{ 'Reload' | translate }}\n </button>\n</c8y-action-bar-item>\n\n<c8y-help src=\"/docs/cockpit/working-with-reports/#working-with-reports\"></c8y-help>\n\n<c8y-list-group>\n <c8y-li\n class=\"page-sticky-header hidden-xs hidden-sm\"\n *ngIf=\"(reports$ | async)?.data.length > 0\"\n >\n <c8y-li-icon>\n <i class=\"p-l-24\"></i>\n </c8y-li-icon>\n <c8y-li-body class=\"content-flex-60\">\n <div class=\"col-3\">\n {{ 'Report' | translate }}\n </div>\n <div class=\"col-6\">\n {{ 'Description' | translate }}\n </div>\n <div class=\"col-2\">\n {{ 'Show in navigator' | translate }}\n </div>\n </c8y-li-body>\n </c8y-li>\n\n <c8y-li *c8yFor=\"let report of reports$; let i = index; loadMore: 'auto'\">\n <c8y-li-icon [icon]=\"report.icon\"></c8y-li-icon>\n <c8y-li-body class=\"content-flex-60\">\n @let reportName = report.translateDashboardTitle ? (report.name | translate) : report.name;\n <div class=\"col-3\">\n <button\n class=\"btn-clean\"\n title=\"{{ reportName }}\"\n type=\"button\"\n routerLink=\"/reports/{{ report.id }}\"\n >\n <span class=\"text-truncate\">\n {{ reportName }}\n </span>\n </button>\n </div>\n <div class=\"col-6\">\n <p class=\"small text-truncate-wrap\">\n <em\n class=\"text-muted\"\n *ngIf=\"!report.description; else showDescription\"\n >\n {{ 'No description available' | translate }}\n </em>\n <ng-template #showDescription>\n {{ report.description }}\n </ng-template>\n </p>\n </div>\n <div class=\"col-2 fit-h-20 m-t-xs-8\">\n <label\n class=\"c8y-switch c8y-switch--inline\"\n title=\"{{ 'Show in navigator' | translate }}\"\n >\n <input\n type=\"checkbox\"\n [ngModel]=\"!!report.c8y_IsNavigatorNode\"\n (ngModelChange)=\"report.c8y_IsNavigatorNode = $event\"\n (change)=\"update(report)\"\n />\n <span></span>\n <span class=\"visible-xs\">\n {{ 'Show in navigator' | translate }}\n </span>\n </label>\n </div>\n <div class=\"col-1 hidden-xs\">\n <button\n class=\"btn btn-dot btn-dot--danger showOnHover m-l-auto d-flex\"\n [attr.aria-label]=\"'Remove report' | translate\"\n tooltip=\"{{ 'Remove report' | translate }}\"\n type=\"button\"\n [delay]=\"500\"\n (click)=\"delete(report)\"\n >\n <i c8yIcon=\"minus-circle\"></i>\n </button>\n </div>\n <div class=\"visible-xs p-t-8 text-right\">\n <button\n class=\"btn btn-default btn-sm\"\n title=\"{{ 'Remove report' | translate }}\"\n type=\"button\"\n (click)=\"delete(report)\"\n >\n <i c8yIcon=\"delete\"></i>\n {{ 'Remove report' | translate }}\n </button>\n </div>\n </c8y-li-body>\n </c8y-li>\n</c8y-list-group>\n\n<c8y-ui-empty-state\n [icon]=\"'c8y-reports'\"\n [title]=\"'There are no reports defined.' | translate\"\n [subtitle]=\"'Add a report first.' | translate\"\n *ngIf=\"(reports$ | async)?.data.length === 0\"\n>\n <p>\n <button\n class=\"btn btn-primary\"\n title=\"{{ 'Add report' | translate }}\"\n type=\"button\"\n [attr.data-cy]=\"'reports-add-report-empty-state-button'\"\n [disabled]=\"!canAddReport\"\n routerLink=\"/report/new-report\"\n c8yProductExperience\n [actionName]=\"PRODUCT_EXPERIENCE.DASHBOARD.EVENTS.REPORTS\"\n [actionData]=\"{ action: PRODUCT_EXPERIENCE.DASHBOARD.ACTIONS.ADD_REPORT }\"\n >\n {{ 'Add report' | translate }}\n </button>\n </p>\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-reports\">user documentation</a>\n .\n </small>\n </p>\n</c8y-ui-empty-state>\n", dependencies: [{ kind: "component", type: TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: 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: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: HelpComponent, selector: "c8y-help", inputs: ["src", "isCollapsed", "priority", "icon"] }, { kind: "component", type: ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: ListItemBodyComponent, selector: "c8y-list-item-body, c8y-li-body", inputs: ["body"] }, { kind: "directive", type: ForOfDirective, selector: "[c8yFor]", inputs: ["c8yForOf", "c8yForLoadMore", "c8yForPipe", "c8yForNotFound", "c8yForMaxIterations", "c8yForLoadingTemplate", "c8yForLoadNextLabel", "c8yForLoadingLabel", "c8yForRealtime", "c8yForRealtimeOptions", "c8yForComparator", "c8yForEnableVirtualScroll", "c8yForVirtualScrollElementSize", "c8yForVirtualScrollStrategy", "c8yForVirtualScrollContainerHeight"], outputs: ["c8yForCount", "c8yForChange", "c8yForLoadMoreComponent"] }, { kind: "directive", type: 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: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: ProductExperienceDirective, selector: "[c8yProductExperience]", inputs: ["actionName", "actionData", "inherit", "suppressDataOverriding"] }, { kind: "component", type: GuideDocsComponent, selector: "[c8y-guide-docs]" }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: GuideHrefDirective, selector: "[c8y-guide-href]", inputs: ["c8y-guide-href"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ReportDashboardListComponent, decorators: [{
type: Component,
args: [{ selector: 'c8y-report-dashboard-list', imports: [
TitleComponent,
ActionBarItemComponent,
FormsModule,
NgIf,
IconDirective,
RouterLink,
PopoverDirective,
NgClass,
HelpComponent,
ListGroupComponent,
ListItemComponent,
ListItemIconComponent,
ListItemBodyComponent,
ForOfDirective,
TooltipDirective,
EmptyStateComponent,
ProductExperienceDirective,
GuideDocsComponent,
C8yTranslateDirective,
GuideHrefDirective,
C8yTranslatePipe,
AsyncPipe
], template: "<c8y-title>\n {{ 'Reports' | translate }}\n</c8y-title>\n\n<c8y-action-bar-item\n [placement]=\"'left'\"\n itemClass=\"navbar-form\"\n>\n <div class=\"input-group input-group-search\">\n <input\n class=\"form-control\"\n [attr.aria-label]=\"'Filter' | translate\"\n placeholder=\"{{ 'Filter\u2026' | translate }}\"\n type=\"search\"\n [ngModel]=\"textFilter$ | async\"\n (ngModelChange)=\"textFilter$.next($event)\"\n />\n <span class=\"input-group-addon\">\n <i\n c8yIcon=\"search\"\n *ngIf=\"(textFilter$ | async).length === 0\"\n ></i>\n <i\n class=\"text-muted\"\n c8yIcon=\"times\"\n *ngIf=\"(textFilter$ | async).length > 0\"\n (click)=\"textFilter$.next('')\"\n px-event=\"Clear filtering reports\"\n ></i>\n </span>\n </div>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n <button\n class=\"btn btn-link\"\n title=\"{{ 'Add report' | translate }}\"\n type=\"button\"\n [attr.data-cy]=\"'reports-add-report-action-bar-button'\"\n routerLink=\"/report/new-report\"\n [disabled]=\"!canAddReport\"\n >\n <i c8yIcon=\"plus-circle\"></i>\n {{ 'Add report' | translate }}\n </button>\n <button\n class=\"btn btn-dot m-r-16\"\n aria-label=\"{{ 'Info' | translate }}\"\n popover=\"{{ 'You don\\'t have permission to add reports' | translate }}\"\n placement=\"top\"\n triggers=\"focus\"\n container=\"body\"\n type=\"button\"\n *ngIf=\"!canAddReport\"\n >\n <i\n class=\"text-primary\"\n [c8yIcon]=\"'info-circle'\"\n ></i>\n </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n <button\n class=\"btn btn-link\"\n title=\"{{ 'Reload' | translate }}\"\n type=\"button\"\n (click)=\"loadReports()\"\n >\n <i\n c8yIcon=\"refresh\"\n [ngClass]=\"{ 'icon-spin': reloading }\"\n ></i>\n {{ 'Reload' | translate }}\n </button>\n</c8y-action-bar-item>\n\n<c8y-help src=\"/docs/cockpit/working-with-reports/#working-with-reports\"></c8y-help>\n\n<c8y-list-group>\n <c8y-li\n class=\"page-sticky-header hidden-xs hidden-sm\"\n *ngIf=\"(reports$ | async)?.data.length > 0\"\n >\n <c8y-li-icon>\n <i class=\"p-l-24\"></i>\n </c8y-li-icon>\n <c8y-li-body class=\"content-flex-60\">\n <div class=\"col-3\">\n {{ 'Report' | translate }}\n </div>\n <div class=\"col-6\">\n {{ 'Description' | translate }}\n </div>\n <div class=\"col-2\">\n {{ 'Show in navigator' | translate }}\n </div>\n </c8y-li-body>\n </c8y-li>\n\n <c8y-li *c8yFor=\"let report of reports$; let i = index; loadMore: 'auto'\">\n <c8y-li-icon [icon]=\"report.icon\"></c8y-li-icon>\n <c8y-li-body class=\"content-flex-60\">\n @let reportName = report.translateDashboardTitle ? (report.name | translate) : report.name;\n <div class=\"col-3\">\n <button\n class=\"btn-clean\"\n title=\"{{ reportName }}\"\n type=\"button\"\n routerLink=\"/reports/{{ report.id }}\"\n >\n <span class=\"text-truncate\">\n {{ reportName }}\n </span>\n </button>\n </div>\n <div class=\"col-6\">\n <p class=\"small text-truncate-wrap\">\n <em\n class=\"text-muted\"\n *ngIf=\"!report.description; else showDescription\"\n >\n {{ 'No description available' | translate }}\n </em>\n <ng-template #showDescription>\n {{ report.description }}\n </ng-template>\n </p>\n </div>\n <div class=\"col-2 fit-h-20 m-t-xs-8\">\n <label\n class=\"c8y-switch c8y-switch--inline\"\n title=\"{{ 'Show in navigator' | translate }}\"\n >\n <input\n type=\"checkbox\"\n [ngModel]=\"!!report.c8y_IsNavigatorNode\"\n (ngModelChange)=\"report.c8y_IsNavigatorNode = $event\"\n (change)=\"update(report)\"\n />\n <span></span>\n <span class=\"visible-xs\">\n {{ 'Show in navigator' | translate }}\n </span>\n </label>\n </div>\n <div class=\"col-1 hidden-xs\">\n <button\n class=\"btn btn-dot btn-dot--danger showOnHover m-l-auto d-flex\"\n [attr.aria-label]=\"'Remove report' | translate\"\n tooltip=\"{{ 'Remove report' | translate }}\"\n type=\"button\"\n [delay]=\"500\"\n (click)=\"delete(report)\"\n >\n <i c8yIcon=\"minus-circle\"></i>\n </button>\n </div>\n <div class=\"visible-xs p-t-8 text-right\">\n <button\n class=\"btn btn-default btn-sm\"\n title=\"{{ 'Remove report' | translate }}\"\n type=\"button\"\n (click)=\"delete(report)\"\n >\n <i c8yIcon=\"delete\"></i>\n {{ 'Remove report' | translate }}\n </button>\n </div>\n </c8y-li-body>\n </c8y-li>\n</c8y-list-group>\n\n<c8y-ui-empty-state\n [icon]=\"'c8y-reports'\"\n [title]=\"'There are no reports defined.' | translate\"\n [subtitle]=\"'Add a report first.' | translate\"\n *ngIf=\"(reports$ | async)?.data.length === 0\"\n>\n <p>\n <button\n class=\"btn btn-primary\"\n title=\"{{ 'Add report' | translate }}\"\n type=\"button\"\n [attr.data-cy]=\"'reports-add-report-empty-state-button'\"\n [disabled]=\"!canAddReport\"\n routerLink=\"/report/new-report\"\n c8yProductExperience\n [actionName]=\"PRODUCT_EXPERIENCE.DASHBOARD.EVENTS.REPORTS\"\n [actionData]=\"{ action: PRODUCT_EXPERIENCE.DASHBOARD.ACTIONS.ADD_REPORT }\"\n >\n {{ 'Add report' | translate }}\n </button>\n </p>\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-reports\">user documentation</a>\n .\n </small>\n </p>\n</c8y-ui-empty-state>\n" }]
}], ctorParameters: () => [{ type: i1$1.InventoryService }, { type: i1.ContextDashboardService }, { type: i3.TranslateService }, { type: i4.ModalService }, { type: i4.AlertService }, { type: ReportDashboardService }, { type: i4.Permissions }, { type: i4.GainsightService }], propDecorators: { filter: [{
type: ViewChild,
args: [FilterInputComponent, { static: false }]
}] } });
class ReportDashboardModule {
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ReportDashboardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.15", ngImport: i0, type: ReportDashboardModule, imports: [CoreModule,
ContextDashboardModule, i1$2.TooltipModule, RouterModule,
PopoverModule,
ReportDashboardListComponent] }); }
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ReportDashboardModule, providers: [
ReportDashboardGuard,
ReportDashboardService,
hookRoute([
{
path: 'reports',
component: ReportDashboardListComponent
},
{
path: 'report/new-report',
component: ContextDashboardComponent,
canDeactivate: [(component) => component.canDeactivate()],
data: {
dashboard: {
c8y_Dashboard: null
},
isReport: true
},
rootContext: ViewContext.Dashboard
},
{
path: 'dashboard/:dashboardId',
component: ContextDashboardComponent,
canActivate: [ReportDashboardGuard],
canDeactivate: [(component) => component.canDeactivate()],
context: ViewContext.Report,
rootContext: ViewContext.Dashboard
}
]),
hookNavigator(ReportDashboardNavigationFactory)
], imports: [CoreModule,
ContextDashboardModule,
TooltipModule.forRoot(),
RouterModule,
PopoverModule,
ReportDashboardListComponent] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ReportDashboardModule, decorators: [{
type: NgModule,
args: [{
imports: [
CoreModule,
ContextDashboardModule,
TooltipModule.forRoot(),
RouterModule,
PopoverModule,
ReportDashboardListComponent
],
providers: [
ReportDashboardGuard,
ReportDashboardService,
hookRoute([
{
path: 'reports',
component: ReportDashboardListComponent
},
{
path: 'report/new-report',
component: ContextDashboardComponent,
canDeactivate: [(component) => component.canDeactivate()],
data: {
dashboard: {
c8y_Dashboard: null
},
isReport: true
},
rootContext: ViewContext.Dashboard
},
{
path: 'dashboard/:dashboardId',
component: ContextDashboardComponent,
canActivate: [ReportDashboardGuard],
canDeactivate: [(component) => component.canDeactivate()],
context: ViewContext.Report,
rootContext: ViewContext.Dashboard
}
]),
hookNavigator(ReportDashboardNavigationFactory)
]
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
export { ReportDashboardGuard, ReportDashboardModule, ReportDashboardNavigationFactory, ReportDashboardService };
//# sourceMappingURL=c8y-ngx-components-report-dashboard.mjs.map