dendi-wang/thingsboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI: Implement edit buttons for widget edit mode.

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.html
View File

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

2
ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.scss
View File

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