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

Timewindow: group interval component style change

Browse Source
This commit is contained in:
Chantsova Ekaterina 2024-09-10 16:54:17 +03:00
parent ffb4a44193
commit 1b61916f4e
4 changed files with 21 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
ui-ngx/src/app/shared/components/time/timeinterval.component.html
View File

@ -16,6 +16,8 @@
--> -->
<section class="tb-form-panel no-border no-padding" [formGroup]="timeintervalFormGroup"> <section class="tb-form-panel no-border no-padding" [formGroup]="timeintervalFormGroup">
<section class="tb-form-row column-xs no-border no-padding tb-standard-fields">
<ng-content></ng-content>
<mat-form-field fxFlex class="flex" [subscriptSizing]="subscriptSizing" [appearance]="appearance"> <mat-form-field fxFlex class="flex" [subscriptSizing]="subscriptSizing" [appearance]="appearance">
<mat-label *ngIf="predefinedName" translate>{{ predefinedName }}</mat-label> <mat-label *ngIf="predefinedName" translate>{{ predefinedName }}</mat-label>
<mat-select formControlName="interval"> <mat-select formControlName="interval">
@ -24,6 +26,7 @@
</mat-option> </mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
</section>
<section class="tb-form-row column-xs no-border no-padding tb-standard-fields advanced-input" <section class="tb-form-row column-xs no-border no-padding tb-standard-fields advanced-input"
formGroupName="customInterval" formGroupName="customInterval"
[fxShow]="advanced"> [fxShow]="advanced">

3
ui-ngx/src/app/shared/components/time/timewindow-form.scss
View File

@ -28,7 +28,8 @@
} }
&-content { &-content {
overflow: auto; overflow-x: hidden;
overflow-y: auto;
tb-timeinterval, tb-timeinterval,
tb-quick-time-interval, tb-quick-time-interval,

7
ui-ngx/src/app/shared/components/time/timewindow-panel.component.html
View File

@ -124,8 +124,8 @@
<ng-container *ngIf="aggregationOptionsAvailable"> <ng-container *ngIf="aggregationOptionsAvailable">
<ng-container formGroupName="aggregation"> <ng-container formGroupName="aggregation">
<section class="tb-form-row column-xs space-between same-padding" *ngIf="isEdit || !timewindow.hideAggregation"> <section class="tb-form-row column-xs space-between same-padding" *ngIf="isEdit || !timewindow.hideAggregation">
<div>{{ 'aggregation.aggregation' | translate }}</div> <div class="fixed-title-width-180">{{ 'aggregation.aggregation' | translate }}</div>
<mat-form-field subscriptSizing="dynamic" appearance="outline"> <mat-form-field class="flex" subscriptSizing="dynamic" appearance="outline">
<mat-select formControlName="type"> <mat-select formControlName="type">
<mat-option *ngFor="let aggregation of aggregations" [value]="aggregation"> <mat-option *ngFor="let aggregation of aggregations" [value]="aggregation">
{{ aggregationTypesTranslations.get(aggregationTypes[aggregation]) | translate }} {{ aggregationTypesTranslations.get(aggregationTypes[aggregation]) | translate }}
@ -155,7 +155,6 @@
<section class="tb-form-row column same-padding" [fxShow]="(isEdit || !timewindow.hideAggInterval) <section class="tb-form-row column same-padding" [fxShow]="(isEdit || !timewindow.hideAggInterval)
&& timewindowForm.get('aggregation.type').value !== aggregationTypes.NONE"> && timewindowForm.get('aggregation.type').value !== aggregationTypes.NONE">
<div>{{ 'aggregation.group-interval' | translate }}</div>
<ng-container formGroupName="realtime" *ngIf="timewindow.selectedTab === timewindowTypes.REALTIME"> <ng-container formGroupName="realtime" *ngIf="timewindow.selectedTab === timewindowTypes.REALTIME">
<tb-timeinterval <tb-timeinterval
formControlName="interval" formControlName="interval"
@ -164,6 +163,7 @@
subscriptSizing="dynamic" subscriptSizing="dynamic"
appearance="outline" appearance="outline"
[disabledAdvanced]="timewindow.realtime.disableCustomGroupInterval"> [disabledAdvanced]="timewindow.realtime.disableCustomGroupInterval">
<div class="fixed-title-width-180">{{ 'aggregation.group-interval' | translate }}</div>
</tb-timeinterval> </tb-timeinterval>
</ng-container> </ng-container>
<ng-container formGroupName="history" *ngIf="timewindow.selectedTab === timewindowTypes.HISTORY"> <ng-container formGroupName="history" *ngIf="timewindow.selectedTab === timewindowTypes.HISTORY">
@ -174,6 +174,7 @@
subscriptSizing="dynamic" subscriptSizing="dynamic"
appearance="outline" appearance="outline"
[disabledAdvanced]="timewindow.history.disableCustomGroupInterval"> [disabledAdvanced]="timewindow.history.disableCustomGroupInterval">
<div class="fixed-title-width-180">{{ 'aggregation.group-interval' | translate }}</div>
</tb-timeinterval> </tb-timeinterval>
</ng-container> </ng-container>
</section> </section>

4
ui-ngx/src/form.scss
View File

@ -235,6 +235,10 @@
.fixed-title-width { .fixed-title-width {
min-width: 200px; min-width: 200px;
&-180 {
min-width: 180px;
}
&-230 { &-230 {
min-width: 230px; min-width: 230px;
} }