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

UI: Always visible action button in multiple input widgets

Browse Source
This commit is contained in:
Vladyslav_Prykhodko 2022-12-14 13:14:58 +02:00
parent 3a3771db64
commit 93fb9754ef
2 changed files with 23 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
ui-ngx/src/app/modules/home/components/widget/lib/multiple-input-widget.component.html
View File

@ -19,7 +19,7 @@
[formGroup]="multipleInputFormGroup" [formGroup]="multipleInputFormGroup"
tb-toast toastTarget="{{ toastTargetId }}" tb-toast toastTarget="{{ toastTargetId }}"
(ngSubmit)="saveForm()" novalidate autocomplete="off"> (ngSubmit)="saveForm()" novalidate autocomplete="off">
<div style="padding: 0 8px;" *ngIf="entityDetected && isAllParametersValid"> <div class="tb-multiple-input-container" *ngIf="entityDetected && isAllParametersValid">
<fieldset *ngFor="let source of sources" [ngClass]="{'fields-group': settings.showGroupTitle}"> <fieldset *ngFor="let source of sources" [ngClass]="{'fields-group': settings.showGroupTitle}">
<legend class="group-title" *ngIf="settings.showGroupTitle">{{ getGroupTitle(source.datasource) }} <legend class="group-title" *ngIf="settings.showGroupTitle">{{ getGroupTitle(source.datasource) }}
</legend> </legend>
@ -142,19 +142,19 @@
</div> </div>
</div> </div>
</fieldset> </fieldset>
<div class="mat-padding" fxLayout="row" fxLayoutAlign="end center" </div>
*ngIf="entityDetected && settings.showActionButtons"> <div class="mat-padding" fxLayout="row" fxLayoutAlign="end center"
<button mat-button color="primary" type="button" *ngIf="entityDetected && isAllParametersValid && settings.showActionButtons">
(click)="discardAll()" style="max-height: 50px; margin-right:20px;" <button mat-button color="primary" type="button"
[disabled]="!multipleInputFormGroup.dirty"> (click)="discardAll()" style="max-height: 50px; margin-right:20px;"
{{ resetButtonLabel }} [disabled]="!multipleInputFormGroup.dirty">
</button> {{ resetButtonLabel }}
<button mat-button mat-raised-button color="primary" type="submit" </button>
style="max-height: 50px; margin-right:20px;" <button mat-button mat-raised-button color="primary" type="submit"
[disabled]="!multipleInputFormGroup.dirty || multipleInputFormGroup.invalid"> style="max-height: 50px; margin-right:20px;"
{{ saveButtonLabel }} [disabled]="!multipleInputFormGroup.dirty || multipleInputFormGroup.invalid">
</button> {{ saveButtonLabel }}
</div> </button>
</div> </div>
<div class="tb-multiple-input__errors" fxLayout="column" fxLayoutAlign="center center" style="height: 100%;" <div class="tb-multiple-input__errors" fxLayout="column" fxLayoutAlign="center center" style="height: 100%;"
*ngIf="(!entityDetected || !isAllParametersValid) && datasourceDetected"> *ngIf="(!entityDetected || !isAllParametersValid) && datasourceDetected">

11
ui-ngx/src/app/modules/home/components/widget/lib/multiple-input-widget.component.scss
View File

@ -17,8 +17,15 @@
.tb-multiple-input { .tb-multiple-input {
height: 100%; height: 100%;
overflow-x: hidden; display: flex;
overflow-y: auto; flex-direction: column;
.tb-multiple-input-container {
padding: 0 8px;
flex: 1 1 100%;
overflow-x: hidden;
overflow-y: auto;
}
.fields-group { .fields-group {
padding: 0 8px; padding: 0 8px;