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

UI: new hide options implementation

Browse Source
This commit is contained in:
Chantsova Ekaterina 2024-08-19 18:35:37 +03:00
parent 1284ad0aad
commit d06d31c09a
6 changed files with 240 additions and 191 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
ui-ngx/src/app/shared/components/time/timewindow-config-dialog.component.ts
View File

@ -20,8 +20,10 @@ import {
AggregationType,
DAY,
HistoryWindowType,
historyWindowTypeTranslations,
quickTimeIntervalPeriod,
RealtimeWindowType,
realtimeWindowTypeTranslations,
Timewindow,
TimewindowType
} from '@shared/models/time/time.models';
@ -72,22 +74,22 @@ export class TimewindowConfigDialogComponent extends PageComponent implements On
realtimeTimewindowOptions: ToggleHeaderOption[] = [
{
name: this.translate.instant('timewindow.relative'),
name: this.translate.instant(realtimeWindowTypeTranslations.get(RealtimeWindowType.INTERVAL)),
value: this.realtimeTypes.INTERVAL
}
];
historyTimewindowOptions: ToggleHeaderOption[] = [
{
name: this.translate.instant('timewindow.last'),
name: this.translate.instant(historyWindowTypeTranslations.get(HistoryWindowType.LAST_INTERVAL)),
value: this.historyTypes.LAST_INTERVAL
},
{
name: this.translate.instant('timewindow.fixed'),
name: this.translate.instant(historyWindowTypeTranslations.get(HistoryWindowType.FIXED)),
value: this.historyTypes.FIXED
},
{
name: this.translate.instant('timewindow.relative'),
name: this.translate.instant(historyWindowTypeTranslations.get(HistoryWindowType.INTERVAL)),
value: this.historyTypes.INTERVAL
}
];
@ -107,7 +109,7 @@ export class TimewindowConfigDialogComponent extends PageComponent implements On
if (!this.quickIntervalOnly) {
this.realtimeTimewindowOptions.unshift({
name: this.translate.instant('timewindow.last'),
name: this.translate.instant(realtimeWindowTypeTranslations.get(RealtimeWindowType.LAST_INTERVAL)),
value: this.realtimeTypes.LAST_INTERVAL
});
}
@ -176,18 +178,6 @@ export class TimewindowConfigDialogComponent extends PageComponent implements On
limit: [ isDefined(aggregation?.limit) ? this.checkLimit(this.timewindow.aggregation.limit) : null ]
}),
timezone: [ isDefined(this.timewindow.timezone) ? this.timewindow.timezone : null ],
hideInterval: [ isDefinedAndNotNull(this.timewindow.hideInterval)
? this.timewindow.hideInterval : false ],
hideLastInterval: [{
value: isDefinedAndNotNull(this.timewindow.hideLastInterval)
? this.timewindow.hideLastInterval : false,
disabled: this.timewindow.hideInterval
}],
hideQuickInterval: [{
value: isDefinedAndNotNull(this.timewindow.hideQuickInterval)
? this.timewindow.hideQuickInterval : false,
disabled: this.timewindow.hideInterval
}],
hideAggregation: [ isDefinedAndNotNull(this.timewindow.hideAggregation)
? this.timewindow.hideAggregation : false ],
hideAggInterval: [ isDefinedAndNotNull(this.timewindow.hideAggInterval)

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

@ -131,7 +131,7 @@
</mat-tab>
</mat-tab-group>
<ng-template #aggregationConfig>
<div *ngIf="aggregation" class="tb-flex column">
<div *ngIf="aggregationOptionsAvailable" class="tb-flex column">
<ng-container formGroupName="aggregation">
<section class="tb-form-panel stroked" *ngIf="isEdit || !timewindow.hideAggregation">
<div class="tb-form-panel-title">{{ 'aggregation.aggregation' | translate }}</div>

299
ui-ngx/src/app/shared/components/time/timewindow-panel.component.ts
View File

@ -20,8 +20,10 @@ import {
AggregationType,
DAY,
HistoryWindowType,
historyWindowTypeTranslations,
quickTimeIntervalPeriod,
RealtimeWindowType,
realtimeWindowTypeTranslations,
Timewindow,
TimewindowType
} from '@shared/models/time/time.models';
@ -30,7 +32,7 @@ import { Store } from '@ngrx/store';
import { AppState } from '@core/core.state';
import { UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms';
import { TimeService } from '@core/services/time.service';
import { isDefined, isDefinedAndNotNull } from '@core/utils';
import { isDefined } from '@core/utils';
import { OverlayRef } from '@angular/cdk/overlay';
import { ToggleHeaderOption } from '@shared/components/toggle-header.component';
import { TranslateService } from '@ngx-translate/core';
@ -91,25 +93,13 @@ export class TimewindowPanelComponent extends PageComponent implements OnInit {
realtimeTimewindowOptions: ToggleHeaderOption[] = [];
historyTimewindowOptions: ToggleHeaderOption[] = [
{
name: this.translate.instant('timewindow.last'),
value: this.historyTypes.LAST_INTERVAL
},
{
name: this.translate.instant('timewindow.fixed'),
value: this.historyTypes.FIXED
},
{
name: this.translate.instant('timewindow.relative'),
value: this.historyTypes.INTERVAL
}
];
historyTimewindowOptions: ToggleHeaderOption[] = [];
realtimeTypeSelectionAvailable: boolean;
realtimeIntervalSelectionAvailable: boolean;
historyTypeSelectionAvailable: boolean;
historyIntervalSelectionAvailable: boolean;
aggregationOptionsAvailable: boolean;
constructor(@Inject(TIMEWINDOW_PANEL_DATA) public data: TimewindowPanelData,
public overlayRef: OverlayRef,
@ -128,53 +118,60 @@ export class TimewindowPanelComponent extends PageComponent implements OnInit {
this.timezone = data.timezone;
this.isEdit = data.isEdit;
// for backward compatibility
if (isDefinedAndNotNull(this.timewindow.hideInterval)) {
this.timewindow.realtime.hideInterval = this.timewindow.hideInterval;
this.timewindow.history.hideInterval = this.timewindow.hideInterval;
// delete this.timewindow.hideInterval;
}
if (isDefinedAndNotNull(this.timewindow.hideLastInterval)) {
this.timewindow.realtime.hideLastInterval = this.timewindow.hideLastInterval;
// delete this.timewindow.hideLastInterval;
}
if (isDefinedAndNotNull(this.timewindow.hideQuickInterval)) {
this.timewindow.realtime.hideQuickInterval = this.timewindow.hideQuickInterval;
// delete this.timewindow.hideQuickInterval;
}
if (this.forAllTimeEnabled) {
this.historyTimewindowOptions.unshift({
name: this.translate.instant('timewindow.for-all-time'),
value: this.historyTypes.FOR_ALL_TIME
});
}
if ((this.isEdit || !this.timewindow.realtime.hideLastInterval) && !this.quickIntervalOnly) {
this.realtimeTimewindowOptions.push({
name: this.translate.instant('timewindow.last'),
name: this.translate.instant(realtimeWindowTypeTranslations.get(RealtimeWindowType.LAST_INTERVAL)),
value: this.realtimeTypes.LAST_INTERVAL
});
}
if (this.isEdit || !this.timewindow.realtime.hideQuickInterval || this.quickIntervalOnly) {
this.realtimeTimewindowOptions.push({
name: this.translate.instant('timewindow.relative'),
name: this.translate.instant(realtimeWindowTypeTranslations.get(RealtimeWindowType.INTERVAL)),
value: this.realtimeTypes.INTERVAL
});
}
if (this.forAllTimeEnabled) {
this.historyTimewindowOptions.push({
name: this.translate.instant(historyWindowTypeTranslations.get(HistoryWindowType.FOR_ALL_TIME)),
value: this.historyTypes.FOR_ALL_TIME
});
}
if (this.isEdit || !this.timewindow.history.hideLastInterval) {
this.historyTimewindowOptions.push({
name: this.translate.instant(historyWindowTypeTranslations.get(HistoryWindowType.LAST_INTERVAL)),
value: this.historyTypes.LAST_INTERVAL
});
}
if (this.isEdit || !this.timewindow.history.hideFixedInterval) {
this.historyTimewindowOptions.push({
name: this.translate.instant(historyWindowTypeTranslations.get(HistoryWindowType.FIXED)),
value: this.historyTypes.FIXED
});
}
if (this.isEdit || !this.timewindow.history.hideQuickInterval) {
this.historyTimewindowOptions.push({
name: this.translate.instant(historyWindowTypeTranslations.get(HistoryWindowType.INTERVAL)),
value: this.historyTypes.INTERVAL
});
}
this.realtimeTypeSelectionAvailable = this.realtimeTimewindowOptions.length > 1;
this.historyTypeSelectionAvailable = this.historyTimewindowOptions.length > 1;
this.realtimeIntervalSelectionAvailable = this.isEdit || !(this.timewindow.realtime.hideInterval ||
(this.timewindow.realtime.hideLastInterval && this.timewindow.realtime.hideQuickInterval));
this.historyIntervalSelectionAvailable = this.isEdit || !this.timewindow.hideInterval;
this.historyIntervalSelectionAvailable = this.isEdit || !(this.timewindow.history.hideInterval ||
(this.timewindow.history.hideLastInterval && this.timewindow.history.hideQuickInterval && this.timewindow.history.hideFixedInterval));
this.aggregationOptionsAvailable = this.aggregation && (this.isEdit ||
!(this.timewindow.hideAggregation && this.timewindow.hideAggInterval));
}
ngOnInit(): void {
const hideInterval = this.timewindow.hideInterval || false;
const hideLastInterval = this.timewindow.realtime.hideLastInterval || false;
const hideQuickInterval = this.timewindow.realtime.hideQuickInterval || false;
const hideAggregation = this.timewindow.hideAggregation || false;
const hideAggInterval = this.timewindow.hideAggInterval || false;
const hideTimezone = this.timewindow.hideTimezone || false;
@ -186,51 +183,51 @@ export class TimewindowPanelComponent extends PageComponent implements OnInit {
this.timewindowForm = this.fb.group({
realtime: this.fb.group({
realtimeType: [{
value: isDefined(realtime?.realtimeType) ? this.timewindow.realtime.realtimeType : RealtimeWindowType.LAST_INTERVAL,
disabled: hideInterval
value: isDefined(realtime?.realtimeType) ? realtime.realtimeType : RealtimeWindowType.LAST_INTERVAL,
disabled: realtime.hideInterval
}],
timewindowMs: [{
value: isDefined(realtime?.timewindowMs) ? this.timewindow.realtime.timewindowMs : null,
disabled: hideInterval || hideLastInterval
value: isDefined(realtime?.timewindowMs) ? realtime.timewindowMs : null,
disabled: realtime.hideInterval || realtime.hideLastInterval
}],
interval: [{
value:isDefined(realtime?.interval) ? this.timewindow.realtime.interval : null,
value:isDefined(realtime?.interval) ? realtime.interval : null,
disabled: hideAggInterval
}],
quickInterval: [{
value: isDefined(realtime?.quickInterval) ? this.timewindow.realtime.quickInterval : null,
disabled: hideInterval || hideQuickInterval
value: isDefined(realtime?.quickInterval) ? realtime.quickInterval : null,
disabled: realtime.hideInterval || realtime.hideQuickInterval
}]
}),
history: this.fb.group({
historyType: [{
value: isDefined(history?.historyType) ? this.timewindow.history.historyType : HistoryWindowType.LAST_INTERVAL,
disabled: hideInterval
value: isDefined(history?.historyType) ? history.historyType : HistoryWindowType.LAST_INTERVAL,
disabled: history.hideInterval
}],
timewindowMs: [{
value: isDefined(history?.timewindowMs) ? this.timewindow.history.timewindowMs : null,
disabled: hideInterval
value: isDefined(history?.timewindowMs) ? history.timewindowMs : null,
disabled: history.hideInterval || history.hideLastInterval
}],
interval: [{
value:isDefined(history?.interval) ? this.timewindow.history.interval : null,
value:isDefined(history?.interval) ? history.interval : null,
disabled: hideAggInterval
}],
fixedTimewindow: [{
value: isDefined(history?.fixedTimewindow) ? this.timewindow.history.fixedTimewindow : null,
disabled: hideInterval
value: isDefined(history?.fixedTimewindow) ? history.fixedTimewindow : null,
disabled: history.hideInterval || history.hideFixedInterval
}],
quickInterval: [{
value: isDefined(history?.quickInterval) ? this.timewindow.history.quickInterval : null,
disabled: hideInterval
value: isDefined(history?.quickInterval) ? history.quickInterval : null,
disabled: history.hideInterval || history.hideQuickInterval
}]
}),
aggregation: this.fb.group({
type: [{
value: isDefined(aggregation?.type) ? this.timewindow.aggregation.type : null,
value: isDefined(aggregation?.type) ? aggregation.type : null,
disabled: hideAggregation
}],
limit: [{
value: isDefined(aggregation?.limit) ? this.checkLimit(this.timewindow.aggregation.limit) : null,
value: isDefined(aggregation?.limit) ? this.checkLimit(aggregation.limit) : null,
disabled: hideAggInterval
}, []]
}),
@ -330,12 +327,71 @@ export class TimewindowPanelComponent extends PageComponent implements OnInit {
private updateTimewindowForm() {
this.timewindowForm.patchValue(this.timewindow);
this.onHideIntervalChanged();
this.onHideLastIntervalChanged();
this.onHideQuickIntervalChanged();
this.onHideAggregationChanged();
this.onHideAggIntervalChanged();
this.onHideTimezoneChanged();
if (this.timewindow.realtime.hideInterval) {
this.timewindowForm.get('realtime.realtimeType').disable({emitEvent: false});
this.timewindowForm.get('realtime.timewindowMs').disable({emitEvent: false});
this.timewindowForm.get('realtime.quickInterval').disable({emitEvent: false});
} else {
this.timewindowForm.get('realtime.realtimeType').enable({emitEvent: false});
if (this.timewindow.realtime.hideLastInterval) {
this.timewindowForm.get('realtime.timewindowMs').disable({emitEvent: false});
} else {
this.timewindowForm.get('realtime.timewindowMs').enable({emitEvent: false});
}
if (this.timewindow.realtime.hideQuickInterval) {
this.timewindowForm.get('realtime.quickInterval').disable({emitEvent: false});
} else {
this.timewindowForm.get('realtime.quickInterval').enable({emitEvent: false});
}
}
if (this.timewindow.history.hideInterval) {
this.timewindowForm.get('history.historyType').disable({emitEvent: false});
this.timewindowForm.get('history.timewindowMs').disable({emitEvent: false});
this.timewindowForm.get('history.fixedTimewindow').disable({emitEvent: false});
this.timewindowForm.get('history.quickInterval').disable({emitEvent: false});
} else {
this.timewindowForm.get('history.historyType').enable({emitEvent: false});
if (this.timewindow.history.hideLastInterval) {
this.timewindowForm.get('history.timewindowMs').disable({emitEvent: false});
} else {
this.timewindowForm.get('history.timewindowMs').enable({emitEvent: false});
}
if (this.timewindow.history.hideFixedInterval) {
this.timewindowForm.get('history.fixedTimewindow').disable({emitEvent: false});
} else {
this.timewindowForm.get('history.fixedTimewindow').enable({emitEvent: false});
}
if (this.timewindow.history.hideQuickInterval) {
this.timewindowForm.get('history.quickInterval').disable({emitEvent: false});
} else {
this.timewindowForm.get('history.quickInterval').enable({emitEvent: false});
}
}
if (this.timewindow.hideAggregation) {
this.timewindowForm.get('aggregation.type').disable({emitEvent: false});
} else {
this.timewindowForm.get('aggregation.type').enable({emitEvent: false});
}
if (this.timewindow.hideAggInterval) {
this.timewindowForm.get('aggregation.limit').disable({emitEvent: false});
this.timewindowForm.get('realtime.interval').disable({emitEvent: false});
this.timewindowForm.get('history.interval').disable({emitEvent: false});
} else {
this.timewindowForm.get('aggregation.limit').enable({emitEvent: false});
this.timewindowForm.get('realtime.interval').enable({emitEvent: false});
this.timewindowForm.get('history.interval').enable({emitEvent: false});
}
if (this.timewindow.hideTimezone) {
this.timewindowForm.get('timezone').disable({emitEvent: false});
} else {
this.timewindowForm.get('timezone').enable({emitEvent: false});
}
this.timewindowForm.markAsDirty();
}
cancel() {
@ -392,89 +448,34 @@ export class TimewindowPanelComponent extends PageComponent implements OnInit {
}
}
onHideIntervalChanged() {
if (this.timewindow.hideInterval) {
this.timewindowForm.get('history.historyType').disable({emitEvent: false});
this.timewindowForm.get('history.timewindowMs').disable({emitEvent: false});
this.timewindowForm.get('history.fixedTimewindow').disable({emitEvent: false});
this.timewindowForm.get('history.quickInterval').disable({emitEvent: false});
this.timewindowForm.get('realtime.realtimeType').disable({emitEvent: false});
this.timewindowForm.get('realtime.timewindowMs').disable({emitEvent: false});
this.timewindowForm.get('realtime.quickInterval').disable({emitEvent: false});
} else {
this.timewindowForm.get('history.historyType').enable({emitEvent: false});
this.timewindowForm.get('history.timewindowMs').enable({emitEvent: false});
this.timewindowForm.get('history.fixedTimewindow').enable({emitEvent: false});
this.timewindowForm.get('history.quickInterval').enable({emitEvent: false});
this.timewindowForm.get('realtime.realtimeType').enable({emitEvent: false});
if (!this.timewindow.realtime.hideLastInterval) {
this.timewindowForm.get('realtime.timewindowMs').enable({emitEvent: false});
}
if (!this.timewindow.realtime.hideQuickInterval) {
this.timewindowForm.get('realtime.quickInterval').enable({emitEvent: false});
}
}
this.timewindowForm.markAsDirty();
}
// 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();
// }
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();
}
onHideAggregationChanged() {
if (this.timewindow.hideAggregation) {
this.timewindowForm.get('aggregation.type').disable({emitEvent: false});
} else {
this.timewindowForm.get('aggregation.type').enable({emitEvent: false});
}
this.timewindowForm.markAsDirty();
}
onHideAggIntervalChanged() {
if (this.timewindow.hideAggInterval) {
this.timewindowForm.get('aggregation.limit').disable({emitEvent: false});
this.timewindowForm.get('realtime.interval').disable({emitEvent: false});
this.timewindowForm.get('history.interval').disable({emitEvent: false});
} else {
this.timewindowForm.get('aggregation.limit').enable({emitEvent: false});
this.timewindowForm.get('realtime.interval').enable({emitEvent: false});
this.timewindowForm.get('history.interval').enable({emitEvent: false});
}
this.timewindowForm.markAsDirty();
}
onHideTimezoneChanged() {
if (this.timewindow.hideTimezone) {
this.timewindowForm.get('timezone').disable({emitEvent: false});
} else {
this.timewindowForm.get('timezone').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();

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

@ -44,6 +44,7 @@
[class]="{'no-padding': noPadding}"
matTooltip="{{ 'timewindow.edit' | translate }}"
[matTooltipPosition]="tooltipPosition"
[matTooltipDisabled]="timewindowDisabled"
[style]="timewindowComponentStyle"
(click)="toggleTimewindow($event)">
<tb-icon *ngIf="computedTimewindowStyle.showIcon && computedTimewindowStyle.iconPosition === 'left'"

12
ui-ngx/src/app/shared/components/time/timewindow.component.ts
View File

@ -220,7 +220,7 @@ export class TimewindowComponent implements ControlValueAccessor, OnInit, OnChan
if ($event) {
$event.stopPropagation();
}
if (this.disablePanel) {
if (this.disablePanel || this.timewindowDisabled) {
return;
}
const config = new OverlayConfig({
@ -363,8 +363,14 @@ export class TimewindowComponent implements ControlValueAccessor, OnInit, OnChan
private isTimewindowDisabled(): boolean {
return this.disabled ||
(!this.isEdit && (!this.innerValue || this.innerValue.hideInterval &&
(!this.aggregation || this.innerValue.hideAggregation && this.innerValue.hideAggInterval)));
(!this.isEdit && (!this.innerValue || (
((this.innerValue.realtime?.hideInterval && this.innerValue.history?.hideInterval) ||
(this.innerValue.realtime?.hideLastInterval && this.innerValue.realtime?.hideQuickInterval &&
this.innerValue.history?.hideLastInterval && this.innerValue.history?.hideFixedInterval &&
this.innerValue.history?.hideQuickInterval)) &&
(!this.aggregation || this.innerValue.hideAggregation && this.innerValue.hideAggInterval) &&
(!this.timezone || this.innerValue.hideTimezone)
)));
}
}

93
ui-ngx/src/app/shared/models/time/time.models.ts
View File

@ -15,7 +15,7 @@
///
import { TimeService } from '@core/services/time.service';
import { deepClone, isDefined, isNumeric, isUndefined } from '@app/core/utils';
import { deepClone, isDefined, isDefinedAndNotNull, isNumeric, isUndefined } from '@app/core/utils';
import * as moment_ from 'moment';
import * as momentTz from 'moment-timezone';
import { IntervalType } from '@shared/models/telemetry/telemetry.models';
@ -53,6 +53,17 @@ export enum HistoryWindowType {
FOR_ALL_TIME
}
export const realtimeWindowTypeTranslations = new Map<RealtimeWindowType, string>([
[RealtimeWindowType.LAST_INTERVAL, 'timewindow.last'],
[RealtimeWindowType.INTERVAL, 'timewindow.relative']
]);
export const historyWindowTypeTranslations = new Map<HistoryWindowType, string>([
[HistoryWindowType.LAST_INTERVAL, 'timewindow.last'],
[HistoryWindowType.FIXED, 'timewindow.fixed'],
[HistoryWindowType.INTERVAL, 'timewindow.relative'],
[HistoryWindowType.FOR_ALL_TIME, 'timewindow.for-all-time']
]);
export type Interval = number | IntervalType;
export class IntervalMath {
@ -128,8 +139,17 @@ export interface Aggregation {
export interface Timewindow {
displayValue?: string;
displayTimezoneAbbr?: string;
/**
* @deprecated
*/
hideInterval?: boolean;
/**
* @deprecated
*/
hideQuickInterval?: boolean;
/**
* @deprecated
*/
hideLastInterval?: boolean;
hideAggregation?: boolean;
hideAggInterval?: boolean;
@ -247,9 +267,6 @@ export const defaultTimewindow = (timeService: TimeService): Timewindow => {
const currentTime = moment().valueOf();
return {
displayValue: '',
hideInterval: false,
hideLastInterval: false,
hideQuickInterval: false,
hideAggregation: false,
hideAggInterval: false,
hideTimezone: false,
@ -258,7 +275,10 @@ export const defaultTimewindow = (timeService: TimeService): Timewindow => {
realtimeType: RealtimeWindowType.LAST_INTERVAL,
interval: SECOND,
timewindowMs: MINUTE,
quickInterval: QuickTimeInterval.CURRENT_DAY
quickInterval: QuickTimeInterval.CURRENT_DAY,
hideInterval: false,
hideLastInterval: false,
hideQuickInterval: false
},
history: {
historyType: HistoryWindowType.LAST_INTERVAL,
@ -268,7 +288,11 @@ export const defaultTimewindow = (timeService: TimeService): Timewindow => {
startTimeMs: currentTime - DAY,
endTimeMs: currentTime
},
quickInterval: QuickTimeInterval.CURRENT_DAY
quickInterval: QuickTimeInterval.CURRENT_DAY,
hideInterval: false,
hideLastInterval: false,
hideFixedInterval: false,
hideQuickInterval: false
},
aggregation: {
type: AggregationType.AVG,
@ -289,14 +313,34 @@ export const initModelFromDefaultTimewindow = (value: Timewindow, quickIntervalO
historyOnly: boolean, timeService: TimeService): Timewindow => {
const model = defaultTimewindow(timeService);
if (value) {
model.hideInterval = value.hideInterval;
model.hideLastInterval = value.hideLastInterval;
model.hideQuickInterval = value.hideQuickInterval;
model.hideAggregation = value.hideAggregation;
model.hideAggInterval = value.hideAggInterval;
model.hideTimezone = value.hideTimezone;
model.selectedTab = getTimewindowType(value);
// for backward compatibility
if (isDefinedAndNotNull(value.hideInterval)) {
model.realtime.hideInterval = value.hideInterval;
model.history.hideInterval = value.hideInterval;
}
if (isDefinedAndNotNull(value.hideLastInterval)) {
model.realtime.hideLastInterval = value.hideLastInterval;
}
if (isDefinedAndNotNull(value.hideQuickInterval)) {
model.realtime.hideQuickInterval = value.hideQuickInterval;
}
if (isDefined(value.realtime)) {
if (isDefinedAndNotNull(value.realtime.hideInterval)) {
model.realtime.hideInterval = value.realtime.hideInterval;
}
if (isDefinedAndNotNull(value.realtime.hideLastInterval)) {
model.realtime.hideLastInterval = value.realtime.hideLastInterval;
}
if (isDefinedAndNotNull(value.realtime.hideQuickInterval)) {
model.realtime.hideQuickInterval = value.realtime.hideQuickInterval;
}
if (isDefined(value.realtime.interval)) {
model.realtime.interval = value.realtime.interval;
}
@ -317,6 +361,19 @@ export const initModelFromDefaultTimewindow = (value: Timewindow, quickIntervalO
}
}
if (isDefined(value.history)) {
if (isDefinedAndNotNull(value.history.hideInterval)) {
model.history.hideInterval = value.history.hideInterval;
}
if (isDefinedAndNotNull(value.history.hideLastInterval)) {
model.history.hideLastInterval = value.history.hideLastInterval;
}
if (isDefinedAndNotNull(value.history.hideFixedInterval)) {
model.history.hideFixedInterval = value.history.hideFixedInterval;
}
if (isDefinedAndNotNull(value.history.hideQuickInterval)) {
model.history.hideQuickInterval = value.history.hideQuickInterval;
}
if (isDefined(value.history.interval)) {
model.history.interval = value.history.interval;
}
@ -382,9 +439,6 @@ export const toHistoryTimewindow = (timewindow: Timewindow, startTimeMs: number,
limit = timeService.getMaxDatapointsLimit();
}
return {
hideInterval: timewindow.hideInterval || false,
hideLastInterval: timewindow.hideLastInterval || false,
hideQuickInterval: timewindow.hideQuickInterval || false,
hideAggregation: timewindow.hideAggregation || false,
hideAggInterval: timewindow.hideAggInterval || false,
hideTimezone: timewindow.hideTimezone || false,
@ -395,7 +449,10 @@ export const toHistoryTimewindow = (timewindow: Timewindow, startTimeMs: number,
startTimeMs,
endTimeMs
},
interval: timeService.boundIntervalToTimewindow(endTimeMs - startTimeMs, interval, AggregationType.AVG)
interval: timeService.boundIntervalToTimewindow(endTimeMs - startTimeMs, interval, AggregationType.AVG),
hideInterval: timewindow.history?.hideInterval || false,
hideLastInterval: timewindow.history?.hideLastInterval || false,
hideQuickInterval: timewindow.history?.hideQuickInterval || false,
},
aggregation: {
type: aggType,
@ -850,20 +907,14 @@ export const createTimewindowForComparison = (subscriptionTimewindow: Subscripti
export const cloneSelectedTimewindow = (timewindow: Timewindow): Timewindow => {
const cloned: Timewindow = {};
cloned.hideInterval = timewindow.hideInterval || false;
cloned.hideLastInterval = timewindow.hideLastInterval || false;
cloned.hideQuickInterval = timewindow.hideQuickInterval || false;
cloned.hideAggregation = timewindow.hideAggregation || false;
cloned.hideAggInterval = timewindow.hideAggInterval || false;
cloned.hideTimezone = timewindow.hideTimezone || false;
if (isDefined(timewindow.selectedTab)) {
cloned.selectedTab = timewindow.selectedTab;
if (timewindow.selectedTab === TimewindowType.REALTIME) {
cloned.realtime = deepClone(timewindow.realtime);
} else if (timewindow.selectedTab === TimewindowType.HISTORY) {
cloned.history = deepClone(timewindow.history);
}
}
cloned.realtime = deepClone(timewindow.realtime);
cloned.history = deepClone(timewindow.history);
cloned.aggregation = deepClone(timewindow.aggregation);
cloned.timezone = timewindow.timezone;
return cloned;