UI: Fix timewindow panel form validation - disable aggregation limit check when aggregation is not none.

This commit is contained in:
Igor Kulikov 2022-02-08 13:35:49 +02:00
parent 423a9e2e04
commit 442bb83784
2 changed files with 27 additions and 3 deletions

View File

@ -130,7 +130,7 @@
</mat-form-field> </mat-form-field>
</section> </section>
</section> </section>
<section fxLayout="row" [fxShow]="timewindowForm.get('aggregation.type').value === aggregationTypes.NONE"> <section fxLayout="row" *ngIf="timewindowForm.get('aggregation.type').value === aggregationTypes.NONE">
<section fxLayout="column" [fxShow]="isEdit"> <section fxLayout="column" [fxShow]="isEdit">
<label class="tb-small hide-label" translate>timewindow.hide</label> <label class="tb-small hide-label" translate>timewindow.hide</label>
<mat-checkbox [ngModelOptions]="{standalone: true}" [(ngModel)]="timewindow.hideAggInterval" <mat-checkbox [ngModelOptions]="{standalone: true}" [(ngModel)]="timewindow.hideAggInterval"

View File

@ -155,9 +155,9 @@ export class TimewindowPanelComponent extends PageComponent implements OnInit {
}), }),
limit: this.fb.control({ limit: this.fb.control({
value: this.timewindow.aggregation && typeof this.timewindow.aggregation.limit !== 'undefined' value: this.timewindow.aggregation && typeof this.timewindow.aggregation.limit !== 'undefined'
? this.timewindow.aggregation.limit : null, ? this.checkLimit(this.timewindow.aggregation.limit) : null,
disabled: hideAggInterval disabled: hideAggInterval
}, [Validators.min(this.minDatapointsLimit()), Validators.max(this.maxDatapointsLimit())]) }, [])
} }
), ),
timezone: this.fb.control({ timezone: this.fb.control({
@ -166,6 +166,30 @@ export class TimewindowPanelComponent extends PageComponent implements OnInit {
disabled: hideTimezone disabled: hideTimezone
}) })
}); });
this.updateValidators();
this.timewindowForm.get('aggregation.type').valueChanges.subscribe(() => {
this.updateValidators();
});
}
private checkLimit(limit?: number): number {
if (!limit || limit < this.minDatapointsLimit()) {
return this.minDatapointsLimit();
} else if (limit > this.maxDatapointsLimit()) {
return this.maxDatapointsLimit();
}
return limit;
}
private updateValidators() {
const aggType = this.timewindowForm.get('aggregation.type').value;
if (aggType !== AggregationType.NONE) {
this.timewindowForm.get('aggregation.limit').clearValidators();
} else {
this.timewindowForm.get('aggregation.limit').setValidators([Validators.min(this.minDatapointsLimit()),
Validators.max(this.maxDatapointsLimit())]);
}
this.timewindowForm.get('aggregation.limit').updateValueAndValidity({emitEvent: false});
} }
update() { update() {