UI: Always visible action button in multiple input widgets

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

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,8 +142,9 @@
</div> </div>
</div> </div>
</fieldset> </fieldset>
</div>
<div class="mat-padding" fxLayout="row" fxLayoutAlign="end center" <div class="mat-padding" fxLayout="row" fxLayoutAlign="end center"
*ngIf="entityDetected && settings.showActionButtons"> *ngIf="entityDetected && isAllParametersValid && settings.showActionButtons">
<button mat-button color="primary" type="button" <button mat-button color="primary" type="button"
(click)="discardAll()" style="max-height: 50px; margin-right:20px;" (click)="discardAll()" style="max-height: 50px; margin-right:20px;"
[disabled]="!multipleInputFormGroup.dirty"> [disabled]="!multipleInputFormGroup.dirty">
@ -155,7 +156,6 @@
{{ saveButtonLabel }} {{ saveButtonLabel }}
</button> </button>
</div> </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">
<div style="text-align: center; font-size: 18px; color: #a0a0a0;" [fxHide]="entityDetected"> <div style="text-align: center; font-size: 18px; color: #a0a0a0;" [fxHide]="entityDetected">

View File

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