UI: Improve timewindow configuration for aggregation comparison

ui-ngx/src/app/core/api/entity-data-subscription.ts

@@ -1033,7 +1033,7 @@ export class EntityDataSubscription {
       isLatestDataAgg,
       subsTw,
       this.utils,
-      this.entityDataSubscriptionOptions.ignoreDataUpdateOnIntervalTick
+      this.entityDataSubscriptionOptions.ignoreDataUpdateOnIntervalTick || isLatestDataAgg
     );
   }
 

ui-ngx/src/app/modules/home/components/widget/widget-config.component.html

@@ -34,6 +34,8 @@
                 style="padding-right: 8px;">widget-config.timewindow</span>
           <tb-timewindow asButton="true"
                          isEdit="true"
+                         alwaysDisplayTypePrefix
+                         [historyOnly]="onlyHistoryTimewindow()"
                          quickIntervalOnly="{{ widgetType === widgetTypes.latest }}"
                          aggregation="{{ widgetType === widgetTypes.timeseries }}"
                          fxFlex formControlName="timewindow"></tb-timewindow>

ui-ngx/src/app/modules/home/components/widget/widget-config.component.ts

@@ -20,7 +20,7 @@ import { Store } from '@ngrx/store';
 import { AppState } from '@core/core.state';
 import {
   DataKey,
-  Datasource, datasourcesHasAggregation,
+  Datasource, datasourcesHasAggregation, datasourcesHasOnlyComparisonAggregation,
   DatasourceType,
   datasourceTypeTranslationMap,
   defaultLegendConfig,
@@ -743,6 +743,15 @@ export class WidgetConfigComponent extends PageComponent implements OnInit, Cont
     }
   }
 
+  public onlyHistoryTimewindow(): boolean {
+    if (this.widgetType === widgetType.latest) {
+      const datasources = this.dataSettings.get('datasources').value;
+      return datasourcesHasOnlyComparisonAggregation(datasources);
+    } else {
+      return false;
+    }
+  }
+
   public onDatasourceDrop(event: CdkDragDrop<string[]>) {
     const datasourcesFormArray = this.datasourcesFormArray();
     const datasourceForm = datasourcesFormArray.at(event.previousIndex);

ui-ngx/src/app/modules/home/components/widget/widget-container.component.html

@@ -47,6 +47,8 @@
       <tb-timewindow *ngIf="widget.hasTimewindow"
                      aggregation="{{widget.hasAggregation}}"
                      quickIntervalOnly="{{widget.onlyQuickInterval}}"
+                     historyOnly="{{widget.onlyHistoryTimewindow}}"
+                     alwaysDisplayTypePrefix
                      timezone="true"
                      [isEdit]="isEdit"
                      [(ngModel)]="widgetComponent.widget.config.timewindow"

ui-ngx/src/app/modules/home/models/dashboard-component.models.ts

@@ -17,7 +17,7 @@
 import { GridsterComponent, GridsterConfig, GridsterItem, GridsterItemComponentInterface } from 'angular-gridster2';
 import {
   Datasource,
-  datasourcesHasAggregation,
+  datasourcesHasAggregation, datasourcesHasOnlyComparisonAggregation,
   FormattedData,
   Widget,
   WidgetPosition,
@@ -335,6 +335,8 @@ export class DashboardWidget implements GridsterItem, IDashboardWidget {
 
   onlyQuickInterval: boolean;
 
+  onlyHistoryTimewindow: boolean;
+
   style: {[klass: string]: any};
 
   showWidgetTitlePanel: boolean;
@@ -432,11 +434,15 @@ export class DashboardWidget implements GridsterItem, IDashboardWidget {
 
     let canHaveTimewindow = false;
     let onlyQuickInterval = false;
+    let onlyHistoryTimewindow = false;
     if (this.widget.type === widgetType.timeseries || this.widget.type === widgetType.alarm) {
       canHaveTimewindow = true;
     } else if (this.widget.type === widgetType.latest) {
       canHaveTimewindow = datasourcesHasAggregation(this.widget.config.datasources);
       onlyQuickInterval = canHaveTimewindow;
+      if (canHaveTimewindow) {
+        onlyHistoryTimewindow = datasourcesHasOnlyComparisonAggregation(this.widget.config.datasources);
+      }
     }
 
     this.hasTimewindow = canHaveTimewindow ?
@@ -446,6 +452,7 @@ export class DashboardWidget implements GridsterItem, IDashboardWidget {
       : false;
 
     this.onlyQuickInterval = onlyQuickInterval;
+    this.onlyHistoryTimewindow = onlyHistoryTimewindow;
 
     this.hasAggregation = this.widget.type === widgetType.timeseries;
 

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

@@ -75,13 +75,30 @@ export class TimewindowComponent implements OnInit, OnDestroy, ControlValueAcces
 
   @Input()
   set historyOnly(val) {
-    this.historyOnlyValue = coerceBooleanProperty(val);
+    const newHistoryOnlyValue = coerceBooleanProperty(val);
+    if (this.historyOnlyValue !== newHistoryOnlyValue) {
+      this.historyOnlyValue = newHistoryOnlyValue;
+      if (this.onHistoryOnlyChanged()) {
+        this.notifyChanged();
+      }
+    }
   }
 
   get historyOnly() {
     return this.historyOnlyValue;
   }
 
+  alwaysDisplayTypePrefixValue = false;
+
+  @Input()
+  set alwaysDisplayTypePrefix(val) {
+    this.alwaysDisplayTypePrefixValue = coerceBooleanProperty(val);
+  }
+
+  get alwaysDisplayTypePrefix() {
+    return this.alwaysDisplayTypePrefixValue;
+  }
+
   quickIntervalOnlyValue = false;
 
   @Input()
@@ -277,6 +294,17 @@ export class TimewindowComponent implements OnInit, OnDestroy, ControlValueAcces
     return Injector.create({parent: this.viewContainerRef.injector, providers});
   }
 
+  private onHistoryOnlyChanged(): boolean {
+    if (this.historyOnlyValue && this.innerValue) {
+      if (this.innerValue.selectedTab !== TimewindowType.HISTORY) {
+        this.innerValue.selectedTab = TimewindowType.HISTORY;
+        this.updateDisplayValue();
+        return true;
+      }
+    }
+    return false;
+  }
+
   registerOnChange(fn: any): void {
     this.propagateChange = fn;
   }
@@ -292,7 +320,13 @@ export class TimewindowComponent implements OnInit, OnDestroy, ControlValueAcces
   writeValue(obj: Timewindow): void {
     this.innerValue = initModelFromDefaultTimewindow(obj, this.quickIntervalOnly, this.timeService);
     this.timewindowDisabled = this.isTimewindowDisabled();
-    this.updateDisplayValue();
+    if (this.onHistoryOnlyChanged()) {
+      setTimeout(() => {
+        this.notifyChanged();
+      });
+    } else {
+      this.updateDisplayValue();
+    }
   }
 
   notifyChanged() {
@@ -309,7 +343,7 @@ export class TimewindowComponent implements OnInit, OnDestroy, ControlValueAcces
           this.millisecondsToTimeStringPipe.transform(this.innerValue.realtime.timewindowMs);
       }
     } else {
-      this.innerValue.displayValue = !this.historyOnly ? (this.translate.instant('timewindow.history') + ' - ') : '';
+      this.innerValue.displayValue = (!this.historyOnly || this.alwaysDisplayTypePrefix) ? (this.translate.instant('timewindow.history') + ' - ') : '';
       if (this.innerValue.history.historyType === HistoryWindowType.LAST_INTERVAL) {
         this.innerValue.displayValue += this.translate.instant('timewindow.last-prefix') + ' ' +
           this.millisecondsToTimeStringPipe.transform(this.innerValue.history.timewindowMs);

ui-ngx/src/app/shared/models/widget.models.ts

@@ -367,6 +367,23 @@ export function datasourcesHasAggregation(datasources?: Array<Datasource>): bool
   return false;
 }
 
+export function datasourcesHasOnlyComparisonAggregation(datasources?: Array<Datasource>): boolean {
+  if (!datasourcesHasAggregation(datasources)) {
+    return false;
+  }
+  if (datasources) {
+    const foundDatasource = datasources.find(datasource => {
+      const found = datasource.dataKeys && datasource.dataKeys.find(key => key.type === DataKeyType.timeseries &&
+        key.aggregationType && key.aggregationType !== AggregationType.NONE && !key.comparisonEnabled);
+      return !!found;
+    });
+    if (foundDatasource) {
+      return false;
+    }
+  }
+  return true;
+}
+
 export interface FormattedData {
   $datasource: Datasource;
   entityName: string;