@netgrif/components
Version:
Netgrif Application Engine frontend Angular components
36 lines • 14.2 kB
JavaScript
import { Component } from '@angular/core';
import { AbstractDashboardComponent, } from '@netgrif/components-core';
import * as i0 from "@angular/core";
import * as i1 from "@netgrif/components-core";
import * as i2 from "@angular/router";
import * as i3 from "@angular/common";
import * as i4 from "@ngbracket/ngx-layout";
import * as i5 from "@ngbracket/ngx-layout/extended";
import * as i6 from "@angular/material/card";
import * as i7 from "@angular/material/icon";
import * as i8 from "@angular/material/progress-spinner";
import * as i9 from "../../toolbar/toolbar.component";
export class DashboardComponent extends AbstractDashboardComponent {
_caseResource;
_log;
_pathService;
_router;
_languageService;
_doubleDrawerNavigationService;
constructor(_caseResource, _log, _pathService, _router, _languageService, _doubleDrawerNavigationService) {
super(_caseResource, _log, _pathService, _router, _languageService, _doubleDrawerNavigationService);
this._caseResource = _caseResource;
this._log = _log;
this._pathService = _pathService;
this._router = _router;
this._languageService = _languageService;
this._doubleDrawerNavigationService = _doubleDrawerNavigationService;
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DashboardComponent, deps: [{ token: i1.CaseResourceService }, { token: i1.LoggerService }, { token: i1.PathService }, { token: i2.Router }, { token: i1.LanguageService }, { token: i1.DoubleDrawerNavigationService }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DashboardComponent, selector: "nc-dashboard", usesInheritance: true, ngImport: i0, template: "<div class=\"height-100\" fxLayout=\"column\" >\n <nc-toolbar [toolbarConfig]=\"toolbarConfig\"></nc-toolbar>\n <div fxLayout=\"column\" fxFlex=\"100\" fxLayoutAlign=\"center center\" class=\"background-dashboard\">\n <div class=\"cards-container\" fxLayout=\"row wrap\" fxLayoutAlign=\"center center\" fxFlex=\"100\">\n <div *ngIf=\"loading$ | async\" fxLayout=\"column\" fxLayoutAlign=\"center center\" class=\"margin-top-default\">\n <mat-spinner color=\"primary\" diameter=\"60\" mode=\"indeterminate\"></mat-spinner>\n </div>\n <ng-template ngFor let-item [ngForOf]=\"dashboardItems\">\n <div fxLayout=\"column\" fxLayoutAlign=\"end center\" class=\"dashboard-card\" (click)=\"navigate(item)\">\n <mat-card-content fxLayout=\"column\" fxLayoutAlign=\"center center\" class=\"card-content\">\n <mat-icon *ngIf=\"!getItemExternalIcon(item)\" class=\"card-icon\" [ngStyle]=\"{'color': getItemIconColor(item)}\">{{ getItemIcon(item) }}</mat-icon>\n <img *ngIf=\"getItemExternalIcon(item)\" class=\"card-icon\" src=\"{{getItemIcon(item)}}\" alt=\"{{getItemName(item)}}\">\n <div class=\"card-main-text\" [ngStyle]=\"{'color': getItemFontColor(item), 'font-weight': getItemFontWeight(item)}\">{{ getItemName(item) }}</div>\n </mat-card-content>\n </div>\n </ng-template>\n </div>\n </div>\n</div>\n", styles: [".height-100{height:100%;min-height:935px}.background-dashboard{background:#f2f2f2}.cards-container{max-width:1050px}.dashboard-card{width:300px;height:250px;background:#fff;margin:16px;box-shadow:0 1px 2px #0000001a,0 2px 6px 2px #0000001a;border-radius:8px;padding:20px;gap:16px;cursor:pointer}.card-content{text-align:center;margin-bottom:0!important}.card-icon{max-height:80px;max-width:80px;height:auto;width:auto;margin-bottom:20px;font-size:75px}.card-main-text{font-weight:400;font-size:44px;line-height:50px;letter-spacing:1px;text-align:center;margin-bottom:20px!important;margin-top:10px!important}\n"], dependencies: [{ 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.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i4.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i4.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i4.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i5.DefaultStyleDirective, selector: " [ngStyle], [ngStyle.xs], [ngStyle.sm], [ngStyle.md], [ngStyle.lg], [ngStyle.xl], [ngStyle.lt-sm], [ngStyle.lt-md], [ngStyle.lt-lg], [ngStyle.lt-xl], [ngStyle.gt-xs], [ngStyle.gt-sm], [ngStyle.gt-md], [ngStyle.gt-lg]", inputs: ["ngStyle", "ngStyle.xs", "ngStyle.sm", "ngStyle.md", "ngStyle.lg", "ngStyle.xl", "ngStyle.lt-sm", "ngStyle.lt-md", "ngStyle.lt-lg", "ngStyle.lt-xl", "ngStyle.gt-xs", "ngStyle.gt-sm", "ngStyle.gt-md", "ngStyle.gt-lg"] }, { kind: "directive", type: i6.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i8.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: i9.ToolbarComponent, selector: "nc-toolbar" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DashboardComponent, decorators: [{
type: Component,
args: [{ selector: 'nc-dashboard', template: "<div class=\"height-100\" fxLayout=\"column\" >\n <nc-toolbar [toolbarConfig]=\"toolbarConfig\"></nc-toolbar>\n <div fxLayout=\"column\" fxFlex=\"100\" fxLayoutAlign=\"center center\" class=\"background-dashboard\">\n <div class=\"cards-container\" fxLayout=\"row wrap\" fxLayoutAlign=\"center center\" fxFlex=\"100\">\n <div *ngIf=\"loading$ | async\" fxLayout=\"column\" fxLayoutAlign=\"center center\" class=\"margin-top-default\">\n <mat-spinner color=\"primary\" diameter=\"60\" mode=\"indeterminate\"></mat-spinner>\n </div>\n <ng-template ngFor let-item [ngForOf]=\"dashboardItems\">\n <div fxLayout=\"column\" fxLayoutAlign=\"end center\" class=\"dashboard-card\" (click)=\"navigate(item)\">\n <mat-card-content fxLayout=\"column\" fxLayoutAlign=\"center center\" class=\"card-content\">\n <mat-icon *ngIf=\"!getItemExternalIcon(item)\" class=\"card-icon\" [ngStyle]=\"{'color': getItemIconColor(item)}\">{{ getItemIcon(item) }}</mat-icon>\n <img *ngIf=\"getItemExternalIcon(item)\" class=\"card-icon\" src=\"{{getItemIcon(item)}}\" alt=\"{{getItemName(item)}}\">\n <div class=\"card-main-text\" [ngStyle]=\"{'color': getItemFontColor(item), 'font-weight': getItemFontWeight(item)}\">{{ getItemName(item) }}</div>\n </mat-card-content>\n </div>\n </ng-template>\n </div>\n </div>\n</div>\n", styles: [".height-100{height:100%;min-height:935px}.background-dashboard{background:#f2f2f2}.cards-container{max-width:1050px}.dashboard-card{width:300px;height:250px;background:#fff;margin:16px;box-shadow:0 1px 2px #0000001a,0 2px 6px 2px #0000001a;border-radius:8px;padding:20px;gap:16px;cursor:pointer}.card-content{text-align:center;margin-bottom:0!important}.card-icon{max-height:80px;max-width:80px;height:auto;width:auto;margin-bottom:20px;font-size:75px}.card-main-text{font-weight:400;font-size:44px;line-height:50px;letter-spacing:1px;text-align:center;margin-bottom:20px!important;margin-top:10px!important}\n"] }]
}], ctorParameters: () => [{ type: i1.CaseResourceService }, { type: i1.LoggerService }, { type: i1.PathService }, { type: i2.Router }, { type: i1.LanguageService }, { type: i1.DoubleDrawerNavigationService }] });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGFzaGJvYXJkLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25ldGdyaWYtY29tcG9uZW50cy9zcmMvbGliL25hdmlnYXRpb24vZGFzaGJvYXJkL2Rhc2hib2FyZC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZXRncmlmLWNvbXBvbmVudHMvc3JjL2xpYi9uYXZpZ2F0aW9uL2Rhc2hib2FyZC9kYXNoYm9hcmQuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFNBQVMsRUFBQyxNQUFNLGVBQWUsQ0FBQztBQUV4QyxPQUFPLEVBQ0gsMEJBQTBCLEdBSzdCLE1BQU0sMEJBQTBCLENBQUM7Ozs7Ozs7Ozs7O0FBUWxDLE1BQU0sT0FBTyxrQkFBbUIsU0FBUSwwQkFBMEI7SUFJaEQ7SUFDQTtJQUNBO0lBQ0E7SUFDQTtJQUNBO0lBTmQsWUFDYyxhQUFrQyxFQUNsQyxJQUFtQixFQUNuQixZQUF5QixFQUN6QixPQUFlLEVBQ2YsZ0JBQWlDLEVBQ2pDLDhCQUE2RDtRQUV2RSxLQUFLLENBQUMsYUFBYSxFQUFFLElBQUksRUFBRSxZQUFZLEVBQUUsT0FBTyxFQUFFLGdCQUFnQixFQUFFLDhCQUE4QixDQUFDLENBQUM7UUFQMUYsa0JBQWEsR0FBYixhQUFhLENBQXFCO1FBQ2xDLFNBQUksR0FBSixJQUFJLENBQWU7UUFDbkIsaUJBQVksR0FBWixZQUFZLENBQWE7UUFDekIsWUFBTyxHQUFQLE9BQU8sQ0FBUTtRQUNmLHFCQUFnQixHQUFoQixnQkFBZ0IsQ0FBaUI7UUFDakMsbUNBQThCLEdBQTlCLDhCQUE4QixDQUErQjtJQUczRSxDQUFDO3dHQVpRLGtCQUFrQjs0RkFBbEIsa0JBQWtCLDJFQ2hCL0IsOCtDQW1CQTs7NEZESGEsa0JBQWtCO2tCQUw5QixTQUFTOytCQUNJLGNBQWMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge0NvbXBvbmVudH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge1JvdXRlcn0gZnJvbSAnQGFuZ3VsYXIvcm91dGVyJztcbmltcG9ydCB7XG4gICAgQWJzdHJhY3REYXNoYm9hcmRDb21wb25lbnQsXG4gICAgQ2FzZVJlc291cmNlU2VydmljZSxcbiAgICBEb3VibGVEcmF3ZXJOYXZpZ2F0aW9uU2VydmljZSxcbiAgICBMYW5ndWFnZVNlcnZpY2UsXG4gICAgTG9nZ2VyU2VydmljZSwgUGF0aFNlcnZpY2UsXG59IGZyb20gJ0BuZXRncmlmL2NvbXBvbmVudHMtY29yZSc7XG5cblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICduYy1kYXNoYm9hcmQnLFxuICAgIHRlbXBsYXRlVXJsOiAnLi9kYXNoYm9hcmQuY29tcG9uZW50Lmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL2Rhc2hib2FyZC5jb21wb25lbnQuc2NzcyddXG59KVxuZXhwb3J0IGNsYXNzIERhc2hib2FyZENvbXBvbmVudCBleHRlbmRzIEFic3RyYWN0RGFzaGJvYXJkQ29tcG9uZW50IHtcblxuXG4gICAgY29uc3RydWN0b3IoXG4gICAgICAgIHByb3RlY3RlZCBfY2FzZVJlc291cmNlOiBDYXNlUmVzb3VyY2VTZXJ2aWNlLFxuICAgICAgICBwcm90ZWN0ZWQgX2xvZzogTG9nZ2VyU2VydmljZSxcbiAgICAgICAgcHJvdGVjdGVkIF9wYXRoU2VydmljZTogUGF0aFNlcnZpY2UsXG4gICAgICAgIHByb3RlY3RlZCBfcm91dGVyOiBSb3V0ZXIsXG4gICAgICAgIHByb3RlY3RlZCBfbGFuZ3VhZ2VTZXJ2aWNlOiBMYW5ndWFnZVNlcnZpY2UsXG4gICAgICAgIHByb3RlY3RlZCBfZG91YmxlRHJhd2VyTmF2aWdhdGlvblNlcnZpY2U6IERvdWJsZURyYXdlck5hdmlnYXRpb25TZXJ2aWNlXG4gICAgKSB7XG4gICAgICAgIHN1cGVyKF9jYXNlUmVzb3VyY2UsIF9sb2csIF9wYXRoU2VydmljZSwgX3JvdXRlciwgX2xhbmd1YWdlU2VydmljZSwgX2RvdWJsZURyYXdlck5hdmlnYXRpb25TZXJ2aWNlKTtcbiAgICB9XG59XG4iLCI8ZGl2IGNsYXNzPVwiaGVpZ2h0LTEwMFwiIGZ4TGF5b3V0PVwiY29sdW1uXCIgPlxuICAgIDxuYy10b29sYmFyIFt0b29sYmFyQ29uZmlnXT1cInRvb2xiYXJDb25maWdcIj48L25jLXRvb2xiYXI+XG4gICAgPGRpdiBmeExheW91dD1cImNvbHVtblwiIGZ4RmxleD1cIjEwMFwiIGZ4TGF5b3V0QWxpZ249XCJjZW50ZXIgY2VudGVyXCIgY2xhc3M9XCJiYWNrZ3JvdW5kLWRhc2hib2FyZFwiPlxuICAgICAgICA8ZGl2IGNsYXNzPVwiY2FyZHMtY29udGFpbmVyXCIgZnhMYXlvdXQ9XCJyb3cgd3JhcFwiIGZ4TGF5b3V0QWxpZ249XCJjZW50ZXIgY2VudGVyXCIgZnhGbGV4PVwiMTAwXCI+XG4gICAgICAgICAgICA8ZGl2ICpuZ0lmPVwibG9hZGluZyQgfCBhc3luY1wiIGZ4TGF5b3V0PVwiY29sdW1uXCIgZnhMYXlvdXRBbGlnbj1cImNlbnRlciBjZW50ZXJcIiBjbGFzcz1cIm1hcmdpbi10b3AtZGVmYXVsdFwiPlxuICAgICAgICAgICAgICAgIDxtYXQtc3Bpbm5lciBjb2xvcj1cInByaW1hcnlcIiBkaWFtZXRlcj1cIjYwXCIgbW9kZT1cImluZGV0ZXJtaW5hdGVcIj48L21hdC1zcGlubmVyPlxuICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICA8bmctdGVtcGxhdGUgbmdGb3IgbGV0LWl0ZW0gW25nRm9yT2ZdPVwiZGFzaGJvYXJkSXRlbXNcIj5cbiAgICAgICAgICAgICAgICA8ZGl2IGZ4TGF5b3V0PVwiY29sdW1uXCIgZnhMYXlvdXRBbGlnbj1cImVuZCBjZW50ZXJcIiBjbGFzcz1cImRhc2hib2FyZC1jYXJkXCIgKGNsaWNrKT1cIm5hdmlnYXRlKGl0ZW0pXCI+XG4gICAgICAgICAgICAgICAgICAgIDxtYXQtY2FyZC1jb250ZW50IGZ4TGF5b3V0PVwiY29sdW1uXCIgZnhMYXlvdXRBbGlnbj1cImNlbnRlciBjZW50ZXJcIiBjbGFzcz1cImNhcmQtY29udGVudFwiPlxuICAgICAgICAgICAgICAgICAgICAgICAgPG1hdC1pY29uICpuZ0lmPVwiIWdldEl0ZW1FeHRlcm5hbEljb24oaXRlbSlcIiBjbGFzcz1cImNhcmQtaWNvblwiIFtuZ1N0eWxlXT1cInsnY29sb3InOiBnZXRJdGVtSWNvbkNvbG9yKGl0ZW0pfVwiPnt7IGdldEl0ZW1JY29uKGl0ZW0pIH19PC9tYXQtaWNvbj5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxpbWcgKm5nSWY9XCJnZXRJdGVtRXh0ZXJuYWxJY29uKGl0ZW0pXCIgY2xhc3M9XCJjYXJkLWljb25cIiBzcmM9XCJ7e2dldEl0ZW1JY29uKGl0ZW0pfX1cIiBhbHQ9XCJ7e2dldEl0ZW1OYW1lKGl0ZW0pfX1cIj5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJjYXJkLW1haW4tdGV4dFwiIFtuZ1N0eWxlXT1cInsnY29sb3InOiBnZXRJdGVtRm9udENvbG9yKGl0ZW0pLCAnZm9udC13ZWlnaHQnOiBnZXRJdGVtRm9udFdlaWdodChpdGVtKX1cIj57eyBnZXRJdGVtTmFtZShpdGVtKSB9fTwvZGl2PlxuICAgICAgICAgICAgICAgICAgICA8L21hdC1jYXJkLWNvbnRlbnQ+XG4gICAgICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICA8L25nLXRlbXBsYXRlPlxuICAgICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbjwvZGl2PlxuIl19