UI: Implement edit buttons for widget edit mode.

This commit is contained in:
Igor Kulikov 2023-05-15 16:58:28 +03:00
parent eb7ecca827
commit d340fab9db
2 changed files with 21 additions and 4 deletions

View File

@ -316,15 +316,32 @@
</tb-dashboard-layout>
</mat-drawer-content>
</mat-drawer-container>
<section data-html2canvas-ignore fxLayout="row" class="layout-wrap tb-header-buttons tb-enter-edit-mode" fxLayoutAlign="start end" *ngIf="!readonly && hideToolbar">
<button color="primary"
<section data-html2canvas-ignore fxLayout="row" class="layout-wrap tb-header-buttons tb-enter-edit-mode" fxLayoutAlign="start end" *ngIf="!readonly && (hideToolbar || widgetEditMode)">
<button [fxShow]="!isEdit"
color="primary"
mat-mini-fab
class="tb-btn-header tb-btn-enter-edit-mode"
class="tb-btn-header tb-btn-edit"
(click)="toggleDashboardEditMode()"
matTooltip="{{ 'action.enter-edit-mode' | translate }}"
matTooltipPosition="above">
<mat-icon>edit</mat-icon>
</button>
<button [fxShow]="isEdit"
color="primary"
mat-mini-fab
class="tb-btn-header tb-btn-edit"
(click)="saveDashboard()"
matTooltip="{{'action.save' | translate}}"
matTooltipPosition="below">
<mat-icon>done</mat-icon></button>
<button [fxShow]="isEdit"
color="primary"
mat-mini-fab
class="tb-btn-header tb-btn-edit"
(click)="toggleDashboardEditMode()"
matTooltip="{{'action.cancel' | translate}}"
matTooltipPosition="below">
<mat-icon>close</mat-icon></button>
</section>
<section *ngIf="!embedded" data-html2canvas-ignore class="tb-powered-by-footer" [ngStyle]="{'color': dashboard.configuration.settings.titleColor}">
<span>Powered by <a href="https://thingsboard.io" target="_blank">Thingsboard v.{{ thingsboardVersion }}</a></span>

View File

@ -146,7 +146,7 @@ div.tb-dashboard-page {
section.tb-header-buttons.tb-enter-edit-mode {
top: 2px;
.mdc-fab.tb-btn-enter-edit-mode {
.mdc-fab.tb-btn-edit {
opacity: .5;
}
}