Browse Source

Improve dashboard edit button appearence depending on multiple conditions.

pull/5333/head
Igor Kulikov 5 years ago
parent
commit
68fc5b996b
  1. 12
      ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.html
  2. 4
      ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.ts

12
ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.html

@ -196,14 +196,13 @@
</tb-dashboard-layout> </tb-dashboard-layout>
</mat-drawer-content> </mat-drawer-content>
</mat-drawer-container> </mat-drawer-container>
<section data-html2canvas-ignore fxLayout="row" class="layout-wrap tb-footer-buttons" fxLayoutAlign="start end"> <section data-html2canvas-ignore fxLayout="row" class="layout-wrap tb-footer-buttons" fxLayoutAlign="start end"
<tb-footer-fab-buttons *ngIf="!embedded && !isMobileApp" *ngIf="!readonly">
[fxShow]="!isAddingWidget && isEdit && !widgetEditMode" <tb-footer-fab-buttons [fxShow]="!isAddingWidget && isEdit && !widgetEditMode"
relative relative
[footerFabButtons]="addWidgetFabButtons"> [footerFabButtons]="addWidgetFabButtons">
</tb-footer-fab-buttons> </tb-footer-fab-buttons>
<button *ngIf="(isTenantAdmin() || isSystemAdmin()) && !forceFullscreen && !embedded && !isMobileApp" <button mat-fab color="accent" class="tb-btn-footer"
mat-fab color="accent" class="tb-btn-footer"
[ngClass]="{'tb-hide': !isEdit || isAddingWidget}" [ngClass]="{'tb-hide': !isEdit || isAddingWidget}"
[disabled]="isLoading$ | async" [disabled]="isLoading$ | async"
(click)="saveDashboard()" (click)="saveDashboard()"
@ -211,8 +210,7 @@
matTooltipPosition="above"> matTooltipPosition="above">
<mat-icon>done</mat-icon> <mat-icon>done</mat-icon>
</button> </button>
<button *ngIf="(isTenantAdmin() || isSystemAdmin()) && !forceFullscreen && !embedded && !isMobileApp" <button mat-fab color="accent" class="tb-btn-footer"
mat-fab color="accent" class="tb-btn-footer"
[ngClass]="{'tb-hide': isAddingWidget || (isLoading$ | async)}" [ngClass]="{'tb-hide': isAddingWidget || (isLoading$ | async)}"
[disabled]="isLoading$ | async" [disabled]="isLoading$ | async"
(click)="toggleDashboardEditMode()" (click)="toggleDashboardEditMode()"

4
ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.ts

@ -183,6 +183,7 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC
singlePageMode: boolean; singlePageMode: boolean;
forceFullscreen = this.authState.forceFullscreen; forceFullscreen = this.authState.forceFullscreen;
readonly = false;
isMobileApp = this.mobileService.isMobileApp(); isMobileApp = this.mobileService.isMobileApp();
isFullscreen = false; isFullscreen = false;
isEdit = false; isEdit = false;
@ -403,6 +404,9 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC
this.widgetEditMode = data.widgetEditMode; this.widgetEditMode = data.widgetEditMode;
this.singlePageMode = data.singlePageMode; this.singlePageMode = data.singlePageMode;
this.readonly = this.embedded || (this.singlePageMode && !this.widgetEditMode && !this.route.snapshot.queryParamMap.get('edit'))
|| this.forceFullscreen || this.isMobileApp || this.authUser.authority === Authority.CUSTOMER_USER;
this.dashboardCtx.aliasController = new AliasController(this.utils, this.dashboardCtx.aliasController = new AliasController(this.utils,
this.entityService, this.entityService,
this.translate, this.translate,

Loading…
Cancel
Save