From f25b7eaf212eb494908747ba732ffabd2365fb91 Mon Sep 17 00:00:00 2001 From: Chantsova Ekaterina Date: Mon, 26 Aug 2024 18:23:02 +0300 Subject: [PATCH] UI: adjust hide interval timewindow options --- .../timewindow-config-dialog.component.ts | 58 ++++++++++++++++++ .../time/timewindow-panel.component.ts | 60 ++++++++++--------- 2 files changed, 89 insertions(+), 29 deletions(-) diff --git a/ui-ngx/src/app/shared/components/time/timewindow-config-dialog.component.ts b/ui-ngx/src/app/shared/components/time/timewindow-config-dialog.component.ts index b154b4140d..e7de899e48 100644 --- a/ui-ngx/src/app/shared/components/time/timewindow-config-dialog.component.ts +++ b/ui-ngx/src/app/shared/components/time/timewindow-config-dialog.component.ts @@ -199,6 +199,17 @@ export class TimewindowConfigDialogComponent extends PageComponent implements On this.timewindowForm.get('realtime.hideQuickInterval').enable(); } }); + this.timewindowForm.get('realtime.hideLastInterval').valueChanges.subscribe((hideLastInterval: boolean) => { + if (hideLastInterval && !this.timewindowForm.get('realtime.hideQuickInterval').value) { + this.timewindowForm.get('realtime.realtimeType').setValue(RealtimeWindowType.INTERVAL); + } + }); + this.timewindowForm.get('realtime.hideQuickInterval').valueChanges.subscribe((hideQuickInterval: boolean) => { + if (hideQuickInterval && !this.timewindowForm.get('realtime.hideLastInterval').value) { + this.timewindowForm.get('realtime.realtimeType').setValue(RealtimeWindowType.LAST_INTERVAL); + } + }); + this.timewindowForm.get('history.hideInterval').valueChanges.subscribe((value: boolean) => { if (value) { this.timewindowForm.get('history.hideLastInterval').disable(); @@ -210,6 +221,33 @@ export class TimewindowConfigDialogComponent extends PageComponent implements On this.timewindowForm.get('history.hideFixedInterval').enable(); } }); + this.timewindowForm.get('history.hideLastInterval').valueChanges.subscribe((hideLastInterval: boolean) => { + if (hideLastInterval) { + if (!this.timewindowForm.get('history.hideFixedInterval').value) { + this.timewindowForm.get('history.historyType').setValue(HistoryWindowType.FIXED); + } else if (!this.timewindowForm.get('history.hideQuickInterval').value) { + this.timewindowForm.get('history.historyType').setValue(HistoryWindowType.INTERVAL); + } + } + }); + this.timewindowForm.get('history.hideFixedInterval').valueChanges.subscribe((hideFixedInterval: boolean) => { + if (hideFixedInterval) { + if (!this.timewindowForm.get('history.hideLastInterval').value) { + this.timewindowForm.get('history.historyType').setValue(HistoryWindowType.LAST_INTERVAL); + } else if (!this.timewindowForm.get('history.hideQuickInterval').value) { + this.timewindowForm.get('history.historyType').setValue(HistoryWindowType.INTERVAL); + } + } + }); + this.timewindowForm.get('history.hideQuickInterval').valueChanges.subscribe((hideQuickInterval: boolean) => { + if (hideQuickInterval) { + if (!this.timewindowForm.get('history.hideLastInterval').value) { + this.timewindowForm.get('history.historyType').setValue(HistoryWindowType.LAST_INTERVAL); + } else if (!this.timewindowForm.get('history.hideFixedInterval').value) { + this.timewindowForm.get('history.historyType').setValue(HistoryWindowType.FIXED); + } + } + }); } private checkLimit(limit?: number): number { @@ -234,6 +272,26 @@ export class TimewindowConfigDialogComponent extends PageComponent implements On onTimewindowTypeChange() { this.timewindowForm.markAsDirty(); const timewindowFormValue = this.timewindowForm.getRawValue(); + if (this.timewindow.selectedTab === TimewindowType.REALTIME) { + if (timewindowFormValue.history.historyType !== HistoryWindowType.FIXED) { + this.timewindowForm.get('realtime').patchValue({ + realtimeType: Object.keys(RealtimeWindowType).includes(HistoryWindowType[timewindowFormValue.history.historyType]) ? + RealtimeWindowType[HistoryWindowType[timewindowFormValue.history.historyType]] : + timewindowFormValue.realtime.realtimeType, + timewindowMs: timewindowFormValue.history.timewindowMs, + quickInterval: timewindowFormValue.history.quickInterval.startsWith('CURRENT') ? + timewindowFormValue.history.quickInterval : timewindowFormValue.realtime.quickInterval + }); + setTimeout(() => this.timewindowForm.get('realtime.interval').patchValue(timewindowFormValue.history.interval)); + } + } else { + this.timewindowForm.get('history').patchValue({ + historyType: HistoryWindowType[RealtimeWindowType[timewindowFormValue.realtime.realtimeType]], + timewindowMs: timewindowFormValue.realtime.timewindowMs, + quickInterval: timewindowFormValue.realtime.quickInterval + }); + setTimeout(() => this.timewindowForm.get('history.interval').patchValue(timewindowFormValue.realtime.interval)); + } this.timewindowForm.patchValue({ aggregation: { type: timewindowFormValue.aggregation.type, diff --git a/ui-ngx/src/app/shared/components/time/timewindow-panel.component.ts b/ui-ngx/src/app/shared/components/time/timewindow-panel.component.ts index cc75725c74..c5bc43c91c 100644 --- a/ui-ngx/src/app/shared/components/time/timewindow-panel.component.ts +++ b/ui-ngx/src/app/shared/components/time/timewindow-panel.component.ts @@ -180,6 +180,37 @@ export class TimewindowPanelComponent extends PageComponent implements OnInit { const history = this.timewindow.history; const aggregation = this.timewindow.aggregation; + if (!this.isEdit) { + if (realtime.hideLastInterval && !realtime.hideQuickInterval) { + realtime.realtimeType = RealtimeWindowType.INTERVAL; + } + if (realtime.hideQuickInterval && !realtime.hideLastInterval) { + realtime.realtimeType = RealtimeWindowType.LAST_INTERVAL; + } + + if (history.hideLastInterval) { + if (!history.hideFixedInterval) { + history.historyType = HistoryWindowType.FIXED; + } else if (!history.hideQuickInterval) { + history.historyType = HistoryWindowType.INTERVAL; + } + } + if (history.hideFixedInterval) { + if (!history.hideLastInterval) { + history.historyType = HistoryWindowType.LAST_INTERVAL; + } else if (!history.hideQuickInterval) { + history.historyType = HistoryWindowType.INTERVAL; + } + } + if (history.hideQuickInterval) { + if (!history.hideLastInterval) { + history.historyType = HistoryWindowType.LAST_INTERVAL; + } else if (!history.hideFixedInterval) { + history.historyType = HistoryWindowType.FIXED; + } + } + } + this.timewindowForm = this.fb.group({ realtime: this.fb.group({ realtimeType: [{ @@ -448,35 +479,6 @@ export class TimewindowPanelComponent extends PageComponent implements OnInit { } } - // TODO: pay attention to selecting another option on hiding interval in config - // onHideLastIntervalChanged() { - // if (this.timewindow.realtime.hideLastInterval) { - // this.timewindowForm.get('realtime.timewindowMs').disable({emitEvent: false}); - // if (!this.timewindow.realtime.hideQuickInterval) { - // this.timewindowForm.get('realtime.realtimeType').setValue(RealtimeWindowType.INTERVAL); - // } - // } else { - // if (!this.timewindow.hideInterval) { - // this.timewindowForm.get('realtime.timewindowMs').enable({emitEvent: false}); - // } - // } - // this.timewindowForm.markAsDirty(); - // } - - // onHideQuickIntervalChanged() { - // if (this.timewindow.realtime.hideQuickInterval) { - // this.timewindowForm.get('realtime.quickInterval').disable({emitEvent: false}); - // if (!this.timewindow.realtime.hideLastInterval) { - // this.timewindowForm.get('realtime.realtimeType').setValue(RealtimeWindowType.LAST_INTERVAL); - // } - // } else { - // if (!this.timewindow.hideInterval) { - // this.timewindowForm.get('realtime.quickInterval').enable({emitEvent: false}); - // } - // } - // this.timewindowForm.markAsDirty(); - // } - openTimewindowConfig() { this.prepareTimewindowConfig(); this.dialog.open(