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

Merge pull request #4958 from ChantsovaEkaterina/feature/charts-comparison-custom-interval

Browse Source 
[3.3.1] UI: add custom interval option to charts comparison
This commit is contained in:
Igor Kulikov 2021-08-25 12:32:23 +03:00 committed by GitHub
commit 6e8f6fd701
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 35 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
ui-ngx/src/app/core/api/widget-api.models.ts
View File

@ -243,6 +243,7 @@ export interface WidgetSubscriptionOptions {
legendConfig?: LegendConfig;
comparisonEnabled?: boolean;
timeForComparison?: moment_.unitOfTime.DurationConstructor;
comparisonCustomIntervalValue?: number;
decimals?: number;
units?: string;
callbacks?: WidgetSubscriptionCallbacks;

5
ui-ngx/src/app/core/api/widget-subscription.ts
View File

@ -110,6 +110,7 @@ export class WidgetSubscription implements IWidgetSubscription {
units: string;
comparisonEnabled: boolean;
timeForComparison: ComparisonDuration;
comparisonCustomIntervalValue: number;
comparisonTimeWindow: WidgetTimewindow;
timewindowForComparison: SubscriptionTimewindow;
@ -234,6 +235,7 @@ export class WidgetSubscription implements IWidgetSubscription {
this.comparisonEnabled = options.comparisonEnabled && isHistoryTypeTimewindow(this.timeWindowConfig);
if (this.comparisonEnabled) {
this.timeForComparison = options.timeForComparison;
this.comparisonCustomIntervalValue = options.comparisonCustomIntervalValue;
this.comparisonTimeWindow = {};
this.timewindowForComparison = null;
@ -1183,7 +1185,8 @@ export class WidgetSubscription implements IWidgetSubscription {
}
private updateSubscriptionForComparison(): SubscriptionTimewindow {
this.timewindowForComparison = createTimewindowForComparison(this.subscriptionTimewindow, this.timeForComparison);
this.timewindowForComparison = createTimewindowForComparison(this.subscriptionTimewindow, this.timeForComparison,
this.comparisonCustomIntervalValue);
this.updateComparisonTimewindow();
return this.timewindowForComparison;
}

14
ui-ngx/src/app/modules/home/components/widget/lib/flot-widget.models.ts
View File

@ -145,6 +145,7 @@ export interface TbFlotComparisonSettings {
comparisonEnabled: boolean;
timeForComparison: ComparisonDuration;
xaxisSecond: TbFlotSecondXAxisSettings;
comparisonCustomIntervalValue?: number;
}
export interface TbFlotThresholdsSettings {
@ -546,6 +547,11 @@ const chartSettingsSchemaForComparison: JsonSettingsSchema = {
type: 'string',
default: 'previousInterval'
},
comparisonCustomIntervalValue: {
title: 'Custom interval value (ms)',
type: 'number',
default: 7200000
},
xaxisSecond: {
title: 'Second X axis',
type: 'object',
@ -596,9 +602,17 @@ const chartSettingsSchemaForComparison: JsonSettingsSchema = {
{
value: 'years',
label: 'Year ago'
},
{
value: 'customInterval',
label: 'Custom interval'
}
]
},
{
key: 'comparisonCustomIntervalValue',
condition: 'model.timeForComparison === "customInterval"'
},
{
key: 'xaxisSecond',
items: [

3
ui-ngx/src/app/modules/home/components/widget/widget.component.ts
View File

@ -908,7 +908,8 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI
warnOnPageDataOverflow: this.typeParameters.warnOnPageDataOverflow,
ignoreDataUpdateOnIntervalTick: this.typeParameters.ignoreDataUpdateOnIntervalTick,
comparisonEnabled: comparisonSettings.comparisonEnabled,
timeForComparison: comparisonSettings.timeForComparison
timeForComparison: comparisonSettings.timeForComparison,
comparisonCustomIntervalValue: comparisonSettings.comparisonCustomIntervalValue
};
if (this.widget.type === widgetType.alarm) {
options.alarmSource = deepClone(this.widget.config.alarmSource);

15
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, isUndefined } from '@app/core/utils';
import { deepClone, isDefined, isNumeric, isUndefined } from '@app/core/utils';
import * as moment_ from 'moment';
import * as momentTz from 'moment-timezone';
@ -28,7 +28,7 @@ export const DAY = 24 * HOUR;
export const WEEK = 7 * DAY;
export const YEAR = DAY * 365;
export type ComparisonDuration = moment_.unitOfTime.DurationConstructor | 'previousInterval';
export type ComparisonDuration = moment_.unitOfTime.DurationConstructor | 'previousInterval' | 'customInterval';
export enum TimewindowType {
REALTIME,
@ -640,7 +640,7 @@ export function calculateIntervalComparisonEndTime(interval: QuickTimeInterval,
}
export function createTimewindowForComparison(subscriptionTimewindow: SubscriptionTimewindow,
timeUnit: ComparisonDuration): SubscriptionTimewindow {
timeUnit: ComparisonDuration, customIntervalValue: number): SubscriptionTimewindow {
const timewindowForComparison: SubscriptionTimewindow = {
fixedWindow: null,
realtimeWindowMs: null,
@ -667,6 +667,15 @@ export function createTimewindowForComparison(subscriptionTimewindow: Subscripti
endTimeMs = subscriptionTimewindow.fixedWindow.startTimeMs;
startTimeMs = endTimeMs - timeInterval;
}
} else if (timeUnit === 'customInterval') {
if (isNumeric(customIntervalValue) && isFinite(customIntervalValue) && customIntervalValue > 0) {
const timeInterval = subscriptionTimewindow.fixedWindow.endTimeMs - subscriptionTimewindow.fixedWindow.startTimeMs;
endTimeMs = subscriptionTimewindow.fixedWindow.endTimeMs - Math.round(customIntervalValue);
startTimeMs = endTimeMs - timeInterval;
} else {
endTimeMs = subscriptionTimewindow.fixedWindow.endTimeMs;
startTimeMs = subscriptionTimewindow.fixedWindow.startTimeMs;
}
} else {
const timeInterval = subscriptionTimewindow.fixedWindow.endTimeMs - subscriptionTimewindow.fixedWindow.startTimeMs;
endTimeMs = moment(subscriptionTimewindow.fixedWindow.endTimeMs).subtract(1, timeUnit).valueOf();

1
ui-ngx/src/app/shared/models/widget.models.ts
View File

@ -467,6 +467,7 @@ export interface WidgetActionDescriptor extends CustomActionDescriptor {
export interface WidgetComparisonSettings {
comparisonEnabled?: boolean;
timeForComparison?: moment_.unitOfTime.DurationConstructor;
comparisonCustomIntervalValue?: number;
}
export interface WidgetConfig {

1
ui-ngx/src/assets/locale/locale.constant-en_US.json
View File

@ -2263,6 +2263,7 @@
"total": "total",
"comparison-time-ago": {
"previousInterval": "(previous interval)",
"customInterval": "(custom interval)",
"days": "(day ago)",
"weeks": "(week ago)",
"months": "(month ago)",