diff --git a/ui-ngx/src/app/shared/components/time/aggregation/aggregation-options-config-panel.component.ts b/ui-ngx/src/app/shared/components/time/aggregation/aggregation-options-config-panel.component.ts
index bddbe3fba3..c206f712b9 100644
--- a/ui-ngx/src/app/shared/components/time/aggregation/aggregation-options-config-panel.component.ts
+++ b/ui-ngx/src/app/shared/components/time/aggregation/aggregation-options-config-panel.component.ts
@@ -47,7 +47,7 @@ export class AggregationOptionsConfigPanelComponent implements OnInit {
ngOnInit(): void {
this.aggregationOptionsConfigForm = this.fb.group({
- allowedAggregationTypes: [this.allowedAggregationTypes]
+ allowedAggregationTypes: [this.allowedAggregationTypes?.length ? this.allowedAggregationTypes : this.allAggregationTypes]
});
}
diff --git a/ui-ngx/src/app/shared/components/time/interval-options-config-panel.component.html b/ui-ngx/src/app/shared/components/time/interval-options-config-panel.component.html
index afeaf2b2a2..b99da0d5af 100644
--- a/ui-ngx/src/app/shared/components/time/interval-options-config-panel.component.html
+++ b/ui-ngx/src/app/shared/components/time/interval-options-config-panel.component.html
@@ -24,13 +24,40 @@
diff --git a/ui-ngx/src/app/shared/components/time/interval-options-config-panel.component.ts b/ui-ngx/src/app/shared/components/time/interval-options-config-panel.component.ts
index 88e8303480..818138afe0 100644
--- a/ui-ngx/src/app/shared/components/time/interval-options-config-panel.component.ts
+++ b/ui-ngx/src/app/shared/components/time/interval-options-config-panel.component.ts
@@ -17,16 +17,20 @@
import { Component, Input, OnInit } from '@angular/core';
import {
HistoryWindowType,
- QuickTimeInterval,
+ QuickTimeInterval, quickTimeIntervalPeriod,
QuickTimeIntervalTranslationMap,
RealtimeWindowType,
+ TimewindowAllowedAggIntervalOption,
+ TimewindowAllowedAggIntervalsConfig,
+ TimewindowInterval,
TimewindowIntervalOption,
TimewindowType
} from '@shared/models/time/time.models';
-import { FormBuilder, FormGroup } from '@angular/forms';
+import { AbstractControl, FormBuilder, FormGroup, UntypedFormArray } from '@angular/forms';
import { TbPopoverComponent } from '@shared/components/popover.component';
import { TimeService } from '@core/services/time.service';
import { coerceBoolean } from '@shared/decorators/coercion';
+import { TranslateService } from '@ngx-translate/core';
@Component({
selector: 'tb-interval-options-config-panel',
@@ -40,7 +44,10 @@ export class IntervalOptionsConfigPanelComponent implements OnInit {
aggregation = false;
@Input()
- allowedIntervals: Array
;
+ allowedIntervals: Array;
+
+ @Input()
+ allowedAggIntervals: TimewindowAllowedAggIntervalsConfig;
@Input()
intervalType: RealtimeWindowType | HistoryWindowType;
@@ -57,27 +64,72 @@ export class IntervalOptionsConfigPanelComponent implements OnInit {
intervalOptionsConfigForm: FormGroup;
allIntervals: Array;
+ allIntervalValues: Array
private timeIntervalTranslationMap = QuickTimeIntervalTranslationMap;
constructor(private fb: FormBuilder,
- private timeService: TimeService) {}
+ private timeService: TimeService,
+ private translate: TranslateService) {}
ngOnInit(): void {
if (this.intervalType === RealtimeWindowType.LAST_INTERVAL ||
this.intervalType === HistoryWindowType.LAST_INTERVAL) {
this.allIntervals = this.timeService.getIntervals(undefined, undefined, false);
+ this.allIntervalValues = this.allIntervals.map(interval => interval.value);
} else {
- const quickIntervals = this.getQuickIntervals();
- this.allIntervals = quickIntervals.map(interval => ({
- name: this.timeIntervalTranslationMap.get(interval),
+ this.allIntervalValues = this.getQuickIntervals();
+ this.allIntervals = this.allIntervalValues.map(interval => ({
+ name: this.timeIntervalTranslationMap.get(interval as QuickTimeInterval),
value: interval
}));
}
this.intervalOptionsConfigForm = this.fb.group({
- allowedIntervals: [this.allowedIntervals]
+ allowedIntervals: [this.allowedIntervals?.length ? this.allowedIntervals : this.allIntervalValues],
+ intervals: this.fb.array([])
});
+
+ if (this.aggregation) {
+ const intervalControls: Array = [];
+ for (const interval of this.allIntervals) {
+ const intervalConfig: TimewindowAllowedAggIntervalOption = this.allowedAggIntervals?.hasOwnProperty(interval.value)
+ ? this.allIntervalValues[interval.value]
+ : null;
+ intervalControls.push(this.fb.group({
+ name: [this.translate.instant(interval.name, interval.translateParams)],
+ value: [interval.value],
+ enabled: [this.allowedIntervals?.length ? this.allowedIntervals.includes(interval.value) : true],
+ aggIntervals: [intervalConfig ? intervalConfig.aggIntervals : []],
+ preferredAggInterval: [intervalConfig ? intervalConfig.preferredAggInterval : null]
+ }));
+ }
+ this.intervalOptionsConfigForm.setControl('intervals', this.fb.array(intervalControls), {emitEvent: false});
+ }
+ }
+
+ get intervalsFormArray(): UntypedFormArray {
+ return this.intervalOptionsConfigForm.get('intervals') as UntypedFormArray;
+ }
+
+ minAggInterval(interval: TimewindowInterval) {
+ return this.timeService.minIntervalLimit(this.getIntervalMs(interval));
+ }
+
+ maxAggInterval(interval: TimewindowInterval) {
+ return this.timeService.maxIntervalLimit(this.getIntervalMs(interval));
+ }
+
+ private getIntervalMs(interval: TimewindowInterval): number {
+ if (this.intervalType === RealtimeWindowType.INTERVAL ||
+ this.intervalType === HistoryWindowType.INTERVAL) {
+ return quickTimeIntervalPeriod(interval as QuickTimeInterval);
+ }
+ return interval as number;
+ }
+
+ trackByElement(i: number, item: any) {
+ return item;
}
update() {
diff --git a/ui-ngx/src/app/shared/models/time/time.models.ts b/ui-ngx/src/app/shared/models/time/time.models.ts
index 3b556c8ba9..65121f9486 100644
--- a/ui-ngx/src/app/shared/models/time/time.models.ts
+++ b/ui-ngx/src/app/shared/models/time/time.models.ts
@@ -90,6 +90,17 @@ export interface TimewindowAdvancedParams {
allowedQuickIntervals? : Array;
}
+export type TimewindowInterval = Interval | QuickTimeInterval;
+
+export interface TimewindowAllowedAggIntervalsConfig {
+ [key: string]: TimewindowAllowedAggIntervalOption;
+}
+
+export interface TimewindowAllowedAggIntervalOption {
+ aggIntervals: Array;
+ preferredAggInterval: TimewindowInterval;
+}
+
export interface IntervalWindow {
interval?: Interval;
timewindowMs?: number;
@@ -186,7 +197,7 @@ export interface WidgetTimewindow {
export interface TimewindowIntervalOption {
name: string;
translateParams?: {[key: string]: any};
- value: Interval | QuickTimeInterval;
+ value: TimewindowInterval;
}
export enum QuickTimeInterval {
diff --git a/ui-ngx/src/assets/locale/locale.constant-en_US.json b/ui-ngx/src/assets/locale/locale.constant-en_US.json
index c59622a245..20b67af14b 100644
--- a/ui-ngx/src/assets/locale/locale.constant-en_US.json
+++ b/ui-ngx/src/assets/locale/locale.constant-en_US.json
@@ -4548,6 +4548,8 @@
"edit-aggregation-functions-list-hint": "List of available options can be specified.",
"allowed-aggregation-functions": "Allowed aggregation functions",
"edit-intervals-list": "Edit intervals list",
+ "allowed-agg-intervals": "Allowed aggregation intervals",
+ "preferred-agg-interval": "Preferred intervals",
"edit-intervals-list-hint": "List of available interval options can be specified.",
"edit-grouping-intervals-list-hint": "It is possible to configure the grouping intervals list and default grouping interval."
},