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

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

@ -16,14 +16,17 @@
-->
<section class="tb-form-panel no-border no-padding" [formGroup]="timeintervalFormGroup">
<mat-form-field fxFlex class="flex" [subscriptSizing]="subscriptSizing" [appearance]="appearance">
<mat-label *ngIf="predefinedName" translate>{{ predefinedName }}</mat-label>
<mat-select formControlName="interval">
<mat-option *ngFor="let interval of intervals" [value]="interval.value">
{{ interval.name | translate:interval.translateParams }}
</mat-option>
</mat-select>
</mat-form-field>
<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-label *ngIf="predefinedName" translate>{{ predefinedName }}</mat-label>
<mat-select formControlName="interval">
<mat-option *ngFor="let interval of intervals" [value]="interval.value">
{{ interval.name | translate:interval.translateParams }}
</mat-option>
</mat-select>
</mat-form-field>
</section>
<section class="tb-form-row column-xs no-border no-padding tb-standard-fields advanced-input"
formGroupName="customInterval"
[fxShow]="advanced">

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

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

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

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