@c8y/ngx-components 1023.14.196 → 1023.14.201
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/branding/shared/data/index.d.ts +22 -1
- package/branding/shared/data/index.d.ts.map +1 -1
- package/ecosystem/application-plugins/index.d.ts.map +1 -1
- package/ecosystem/index.d.ts.map +1 -1
- package/ecosystem/shared/index.d.ts +4 -1
- package/ecosystem/shared/index.d.ts.map +1 -1
- package/fesm2022/c8y-ngx-components-branding-shared-data.mjs +2 -0
- package/fesm2022/c8y-ngx-components-branding-shared-data.mjs.map +1 -1
- package/fesm2022/c8y-ngx-components-echart.mjs +38 -25
- package/fesm2022/c8y-ngx-components-echart.mjs.map +1 -1
- package/fesm2022/c8y-ngx-components-ecosystem-application-plugins.mjs +22 -14
- package/fesm2022/c8y-ngx-components-ecosystem-application-plugins.mjs.map +1 -1
- package/fesm2022/c8y-ngx-components-ecosystem-shared.mjs +32 -10
- package/fesm2022/c8y-ngx-components-ecosystem-shared.mjs.map +1 -1
- package/fesm2022/c8y-ngx-components-ecosystem.mjs +1 -0
- package/fesm2022/c8y-ngx-components-ecosystem.mjs.map +1 -1
- package/fesm2022/c8y-ngx-components.mjs +2 -0
- package/fesm2022/c8y-ngx-components.mjs.map +1 -1
- package/index.d.ts +2 -0
- package/index.d.ts.map +1 -1
- package/locales/de.po +26 -5
- package/locales/es.po +26 -5
- package/locales/fr.po +26 -5
- package/locales/ja_JP.po +26 -5
- package/locales/ko.po +26 -5
- package/locales/locales.pot +21 -3
- package/locales/nl.po +26 -5
- package/locales/pl.po +26 -5
- package/locales/pt_BR.po +26 -5
- package/locales/zh_CN.po +26 -5
- package/locales/zh_TW.po +26 -5
- package/package.json +1 -1
|
@@ -3,22 +3,22 @@ import { Injectable, inject, SecurityContext, ViewChild, Input, Component, Event
|
|
|
3
3
|
import { gettext } from '@c8y/ngx-components/gettext';
|
|
4
4
|
import { from, merge, interval, BehaviorSubject, of, lastValueFrom, defer, forkJoin } from 'rxjs';
|
|
5
5
|
import { mergeMap, map, tap, throttleTime, buffer, switchMap } from 'rxjs/operators';
|
|
6
|
-
import * as i1 from '@c8y/ngx-components';
|
|
6
|
+
import * as i1$1 from '@c8y/ngx-components';
|
|
7
7
|
import { CommonModule, FormsModule, IconDirective, C8yTranslatePipe, WidgetTimeContextMediatorService, WidgetTimeContextDateRangeService, ThemeSwitcherService, DismissAlertStrategy, DynamicComponentAlert, CoreModule, MeasurementRealtimeService, AlarmRealtimeService, EventRealtimeService } from '@c8y/ngx-components';
|
|
8
8
|
import * as echarts from 'echarts';
|
|
9
|
-
import * as i1
|
|
9
|
+
import * as i1 from '@ngx-translate/core';
|
|
10
|
+
import * as i1$3 from '@c8y/client';
|
|
10
11
|
import { AlarmStatus, aggregationType, MeasurementService } from '@c8y/client';
|
|
11
12
|
import * as i6 from '@angular/router';
|
|
12
13
|
import * as i4 from '@c8y/ngx-components/alarms';
|
|
13
14
|
import { AlarmsModule, AlarmSeverityToIconPipe, AlarmSeverityToLabelPipe } from '@c8y/ngx-components/alarms';
|
|
14
15
|
import { INTERVALS } from '@c8y/ngx-components/interval-picker';
|
|
15
|
-
import * as
|
|
16
|
-
import * as i1$1 from '@angular/common';
|
|
16
|
+
import * as i1$2 from '@angular/common';
|
|
17
17
|
import { NgIf, NgForOf, CommonModule as CommonModule$1 } from '@angular/common';
|
|
18
18
|
import * as i2$1 from 'ngx-echarts';
|
|
19
19
|
import { NgxEchartsModule, NGX_ECHARTS_CONFIG } from 'ngx-echarts';
|
|
20
20
|
import { TooltipModule } from 'ngx-bootstrap/tooltip';
|
|
21
|
-
import * as i1$
|
|
21
|
+
import * as i1$4 from 'ngx-bootstrap/popover';
|
|
22
22
|
import { PopoverModule } from 'ngx-bootstrap/popover';
|
|
23
23
|
import { DomSanitizer } from '@angular/platform-browser';
|
|
24
24
|
import * as i2 from 'ngx-bootstrap/dropdown';
|
|
@@ -91,15 +91,16 @@ const ICONS_MAP = {
|
|
|
91
91
|
};
|
|
92
92
|
|
|
93
93
|
class YAxisService {
|
|
94
|
-
constructor(
|
|
95
|
-
this.
|
|
94
|
+
constructor(translate) {
|
|
95
|
+
this.translate = translate;
|
|
96
96
|
this.Y_AXIS_OFFSET = 48;
|
|
97
|
-
this.intlNumberFormatCompliantLocale = this.appStateService.state.lang.replace('_', '-');
|
|
98
97
|
}
|
|
99
98
|
getYAxis(datapointsWithValues, YAxisOptions) {
|
|
100
99
|
const YAxisPlacement = this.getYAxisPlacement(datapointsWithValues, YAxisOptions);
|
|
101
100
|
const hasValues = datapointsWithValues.some(dp => dp.values && Object.keys(dp.values).length > 0);
|
|
102
101
|
const nameGap = hasValues ? 22 : 15;
|
|
102
|
+
const selectedLanguage = this.translate.currentLang;
|
|
103
|
+
const locale = selectedLanguage?.replace('_', '-');
|
|
103
104
|
if (YAxisOptions.forceMergeDatapoints) {
|
|
104
105
|
return {
|
|
105
106
|
name: Array.from(datapointsWithValues)
|
|
@@ -119,7 +120,12 @@ class YAxisService {
|
|
|
119
120
|
axisLabel: {
|
|
120
121
|
fontSize: 10,
|
|
121
122
|
show: true,
|
|
122
|
-
color: YAxisOptions.axisColor
|
|
123
|
+
color: YAxisOptions.axisColor,
|
|
124
|
+
formatter: (val) => new Intl.NumberFormat(locale, {
|
|
125
|
+
notation: 'compact',
|
|
126
|
+
compactDisplay: 'short',
|
|
127
|
+
maximumFractionDigits: 3
|
|
128
|
+
}).format(val)
|
|
123
129
|
},
|
|
124
130
|
axisLine: {
|
|
125
131
|
show: true,
|
|
@@ -196,10 +202,17 @@ class YAxisService {
|
|
|
196
202
|
formatter: val => {
|
|
197
203
|
if (this.isDefined(dp.min) && this.isDefined(dp.max)) {
|
|
198
204
|
const range = dp.max - dp.min;
|
|
199
|
-
const
|
|
200
|
-
|
|
205
|
+
const cleanRange = parseFloat(range.toPrecision(10));
|
|
206
|
+
const magnitudeDecimalPlaces = cleanRange > 0 ? Math.max(0, 1 - Math.floor(Math.log10(cleanRange))) : 0;
|
|
207
|
+
const decimalPlaces = Math.max(this.getDecimalPlaces(cleanRange), magnitudeDecimalPlaces);
|
|
208
|
+
return new Intl.NumberFormat(locale, {
|
|
209
|
+
notation: 'compact',
|
|
210
|
+
compactDisplay: 'short',
|
|
211
|
+
minimumFractionDigits: decimalPlaces,
|
|
212
|
+
maximumFractionDigits: decimalPlaces
|
|
213
|
+
}).format(val);
|
|
201
214
|
}
|
|
202
|
-
return new Intl.NumberFormat(
|
|
215
|
+
return new Intl.NumberFormat(locale, {
|
|
203
216
|
notation: 'compact',
|
|
204
217
|
compactDisplay: 'short',
|
|
205
218
|
maximumFractionDigits: 3
|
|
@@ -318,12 +331,12 @@ class YAxisService {
|
|
|
318
331
|
}
|
|
319
332
|
return !dps.some((dp2, index2) => this.isMatchingDp(dp, dp2) && index2 < index);
|
|
320
333
|
}
|
|
321
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: YAxisService, deps: [{ token: i1.
|
|
334
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: YAxisService, deps: [{ token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
322
335
|
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: YAxisService }); }
|
|
323
336
|
}
|
|
324
337
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: YAxisService, decorators: [{
|
|
325
338
|
type: Injectable
|
|
326
|
-
}], ctorParameters: () => [{ type: i1.
|
|
339
|
+
}], ctorParameters: () => [{ type: i1.TranslateService }] });
|
|
327
340
|
|
|
328
341
|
function assertUnreachable(_) {
|
|
329
342
|
throw new Error('Case unreachable.');
|
|
@@ -1548,12 +1561,12 @@ class EchartsOptionsService {
|
|
|
1548
1561
|
return acc;
|
|
1549
1562
|
}, null);
|
|
1550
1563
|
}
|
|
1551
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: EchartsOptionsService, deps: [{ token: i1.DatePipe }, { token: YAxisService }, { token: ChartTypesService }, { token: i4.AlarmSeverityToIconPipe }, { token: i4.AlarmSeverityToLabelPipe }, { token:
|
|
1564
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: EchartsOptionsService, deps: [{ token: i1$1.DatePipe }, { token: YAxisService }, { token: ChartTypesService }, { token: i4.AlarmSeverityToIconPipe }, { token: i4.AlarmSeverityToLabelPipe }, { token: i1.TranslateService }, { token: i6.Router }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1552
1565
|
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: EchartsOptionsService }); }
|
|
1553
1566
|
}
|
|
1554
1567
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: EchartsOptionsService, decorators: [{
|
|
1555
1568
|
type: Injectable
|
|
1556
|
-
}], ctorParameters: () => [{ type: i1.DatePipe }, { type: YAxisService }, { type: ChartTypesService }, { type: i4.AlarmSeverityToIconPipe }, { type: i4.AlarmSeverityToLabelPipe }, { type:
|
|
1569
|
+
}], ctorParameters: () => [{ type: i1$1.DatePipe }, { type: YAxisService }, { type: ChartTypesService }, { type: i4.AlarmSeverityToIconPipe }, { type: i4.AlarmSeverityToLabelPipe }, { type: i1.TranslateService }, { type: i6.Router }] });
|
|
1557
1570
|
|
|
1558
1571
|
class ChartRealtimeService {
|
|
1559
1572
|
constructor(measurementRealtime, alarmRealtimeService, eventRealtimeService, echartsOptionsService) {
|
|
@@ -1886,12 +1899,12 @@ class ChartRealtimeService {
|
|
|
1886
1899
|
datapointBackInSyncCallback(datapoint);
|
|
1887
1900
|
}
|
|
1888
1901
|
}
|
|
1889
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChartRealtimeService, deps: [{ token: i1.MeasurementRealtimeService }, { token: i1.AlarmRealtimeService }, { token: i1.EventRealtimeService }, { token: EchartsOptionsService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1902
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChartRealtimeService, deps: [{ token: i1$1.MeasurementRealtimeService }, { token: i1$1.AlarmRealtimeService }, { token: i1$1.EventRealtimeService }, { token: EchartsOptionsService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1890
1903
|
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChartRealtimeService }); }
|
|
1891
1904
|
}
|
|
1892
1905
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChartRealtimeService, decorators: [{
|
|
1893
1906
|
type: Injectable
|
|
1894
|
-
}], ctorParameters: () => [{ type: i1.MeasurementRealtimeService }, { type: i1.AlarmRealtimeService }, { type: i1.EventRealtimeService }, { type: EchartsOptionsService }] });
|
|
1907
|
+
}], ctorParameters: () => [{ type: i1$1.MeasurementRealtimeService }, { type: i1$1.AlarmRealtimeService }, { type: i1$1.EventRealtimeService }, { type: EchartsOptionsService }] });
|
|
1895
1908
|
|
|
1896
1909
|
class ChartAlertsComponent {
|
|
1897
1910
|
constructor() {
|
|
@@ -1904,7 +1917,7 @@ class ChartAlertsComponent {
|
|
|
1904
1917
|
return text;
|
|
1905
1918
|
}
|
|
1906
1919
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChartAlertsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1907
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: ChartAlertsComponent, isStandalone: true, selector: "c8y-chart-alerts", inputs: { alerts: "alerts" }, viewQueries: [{ propertyName: "dismissPermanently", first: true, predicate: ["dismissPermanently"], descendants: true }], ngImport: i0, template: "@if (alerts?.anyAlertExists$ | async) {\n <div class=\"overlay-center-vertically d-col p-16 p-r-24 p-l-24\">\n @for (alertGroup of alerts?.alertGroups; track alertGroup) {\n @if (alertGroup.value.alerts.length) {\n <div\n class=\"alert\"\n role=\"alert\"\n [ngClass]=\"'alert-' + alertGroup.type\"\n >\n @if (alertGroup.value.alertDismissal.dismissStrategy !== 'none') {\n <button\n class=\"close\"\n type=\"button\"\n (click)=\"\n alerts.dismissAlertGroup(alertGroup.type, dismissPermanently.nativeElement.checked)\n \"\n >\n <span aria-hidden=\"true\">\u00D7</span>\n <span class=\"sr-only\">{{ 'Close' | translate }}</span>\n </button>\n }\n\n @for (alertItem of alertGroup.value.alerts; track alertItem) {\n <p [innerHTML]=\"sanitizeAlertText(alertItem.text)\"></p>\n }\n\n @if (alertGroup.value.alertDismissal.dismissStrategy !== 'none') {\n <label\n class=\"c8y-checkbox m-t-16\"\n title=\"{{ 'Don\\'t show again' | translate }}\"\n >\n <input\n type=\"checkbox\"\n #dismissPermanently\n />\n <span></span>\n <span>{{ \"Don't show again\" | translate }}</span>\n </label>\n }\n </div>\n }\n }\n </div>\n}\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$
|
|
1920
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: ChartAlertsComponent, isStandalone: true, selector: "c8y-chart-alerts", inputs: { alerts: "alerts" }, viewQueries: [{ propertyName: "dismissPermanently", first: true, predicate: ["dismissPermanently"], descendants: true }], ngImport: i0, template: "@if (alerts?.anyAlertExists$ | async) {\n <div class=\"overlay-center-vertically d-col p-16 p-r-24 p-l-24\">\n @for (alertGroup of alerts?.alertGroups; track alertGroup) {\n @if (alertGroup.value.alerts.length) {\n <div\n class=\"alert\"\n role=\"alert\"\n [ngClass]=\"'alert-' + alertGroup.type\"\n >\n @if (alertGroup.value.alertDismissal.dismissStrategy !== 'none') {\n <button\n class=\"close\"\n type=\"button\"\n (click)=\"\n alerts.dismissAlertGroup(alertGroup.type, dismissPermanently.nativeElement.checked)\n \"\n >\n <span aria-hidden=\"true\">\u00D7</span>\n <span class=\"sr-only\">{{ 'Close' | translate }}</span>\n </button>\n }\n\n @for (alertItem of alertGroup.value.alerts; track alertItem) {\n <p [innerHTML]=\"sanitizeAlertText(alertItem.text)\"></p>\n }\n\n @if (alertGroup.value.alertDismissal.dismissStrategy !== 'none') {\n <label\n class=\"c8y-checkbox m-t-16\"\n title=\"{{ 'Don\\'t show again' | translate }}\"\n >\n <input\n type=\"checkbox\"\n #dismissPermanently\n />\n <span></span>\n <span>{{ \"Don't show again\" | translate }}</span>\n </label>\n }\n </div>\n }\n }\n </div>\n}\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1$1.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }] }); }
|
|
1908
1921
|
}
|
|
1909
1922
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChartAlertsComponent, decorators: [{
|
|
1910
1923
|
type: Component,
|
|
@@ -1949,12 +1962,12 @@ class ChartEventsService {
|
|
|
1949
1962
|
const result = await Promise.all(promises);
|
|
1950
1963
|
return result.flat();
|
|
1951
1964
|
}
|
|
1952
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChartEventsService, deps: [{ token: i1$
|
|
1965
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChartEventsService, deps: [{ token: i1$3.EventService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1953
1966
|
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChartEventsService }); }
|
|
1954
1967
|
}
|
|
1955
1968
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChartEventsService, decorators: [{
|
|
1956
1969
|
type: Injectable
|
|
1957
|
-
}], ctorParameters: () => [{ type: i1$
|
|
1970
|
+
}], ctorParameters: () => [{ type: i1$3.EventService }] });
|
|
1958
1971
|
|
|
1959
1972
|
class ChartAlarmsService {
|
|
1960
1973
|
constructor(alarmService) {
|
|
@@ -2003,12 +2016,12 @@ class ChartAlarmsService {
|
|
|
2003
2016
|
const result = await Promise.all(promises);
|
|
2004
2017
|
return result.flat();
|
|
2005
2018
|
}
|
|
2006
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChartAlarmsService, deps: [{ token: i1$
|
|
2019
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChartAlarmsService, deps: [{ token: i1$3.AlarmService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
2007
2020
|
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChartAlarmsService }); }
|
|
2008
2021
|
}
|
|
2009
2022
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChartAlarmsService, decorators: [{
|
|
2010
2023
|
type: Injectable
|
|
2011
|
-
}], ctorParameters: () => [{ type: i1$
|
|
2024
|
+
}], ctorParameters: () => [{ type: i1$3.AlarmService }] });
|
|
2012
2025
|
|
|
2013
2026
|
class ChartHelpersService {
|
|
2014
2027
|
/**
|
|
@@ -2081,7 +2094,7 @@ class SelectAggregatedDatapointComponent {
|
|
|
2081
2094
|
this.selectedDatapointColor = found?.color || '';
|
|
2082
2095
|
}
|
|
2083
2096
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SelectAggregatedDatapointComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2084
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: SelectAggregatedDatapointComponent, isStandalone: true, selector: "c8y-select-aggregated-datapoint", inputs: { activeDatapoints: "activeDatapoints", value: "value" }, outputs: { valueChange: "valueChange" }, host: { classAttribute: "d-contents" }, usesOnChanges: true, ngImport: i0, template: "<div\n class=\"dropdown dropup\"\n dropdown\n #datapointDropdown=\"bs-dropdown\"\n [cdkTrapFocus]=\"datapointDropdown.isOpen\"\n *ngIf=\"activeDatapoints?.length > 0\"\n>\n <ng-template #selectedDatapoint>\n <div class=\"text-left\">\n <strong>{{ selectedDatapointLabel }}</strong>\n <br />\n {{ 'Click to change' | translate }}\n </div>\n </ng-template>\n <button\n class=\"btn btn-default d-flex a-i-center dropdown-toggle c8y-dropdown\"\n title=\"{{'Select a data point to view its aggregated values in the time slider.' | translate }}\"\n type=\"button\"\n dropdownToggle\n >\n <span\n [style.background-color]=\"selectedDatapointColor\"\n style=\"display: inline-block; width: 16px; height: 16px; border-radius: 50%\"\n ></span>\n <span class=\"caret\"></span>\n </button>\n <ul\n class=\"dropdown-menu dropdown-menu-right\"\n *dropdownMenu\n >\n <li *ngFor=\"let datapoint of activeDatapoints\">\n <button\n class=\"p-r-8\"\n type=\"button\"\n (click)=\"changeDatapointSelection(datapoint)\"\n >\n <span\n class=\"d-inline-block m-r-4\"\n [style.background-color]=\"datapoint?.color\"\n style=\"width: 16px; height: 16px; border-radius: 50%\"\n ></span>\n <span class=\"text-truncate\" style=\"max-width:220px!important\" title=\"{{ datapoint?.label || `${datapoint?.fragment}-${datapoint?.series}` }}\">\n {{ datapoint?.label || `${datapoint?.fragment}-${datapoint?.series}` }}\n </span>\n <span\n class=\"m-l-auto flex-no-shrink\"\n *ngIf=\"\n datapoint.__target.id === value?.__target.id &&\n datapoint.fragment === value?.fragment &&\n datapoint.series === value?.series\n \"\n >\n <i\n class=\"text-success h4\"\n [c8yIcon]=\"'check'\"\n ></i>\n </span>\n </button>\n </li>\n </ul>\n</div>\n<button\n class=\"btn-help\"\n [attr.aria-label]=\"'Help' | translate\"\n popover=\"{{\n 'Select a data point to view its aggregated values in the time slider.' | translate\n }}\"\n placement=\"left\"\n triggers=\"focus\"\n container=\"body\"\n></button>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: PopoverModule }, { kind: "directive", type: i1$
|
|
2097
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: SelectAggregatedDatapointComponent, isStandalone: true, selector: "c8y-select-aggregated-datapoint", inputs: { activeDatapoints: "activeDatapoints", value: "value" }, outputs: { valueChange: "valueChange" }, host: { classAttribute: "d-contents" }, usesOnChanges: true, ngImport: i0, template: "<div\n class=\"dropdown dropup\"\n dropdown\n #datapointDropdown=\"bs-dropdown\"\n [cdkTrapFocus]=\"datapointDropdown.isOpen\"\n *ngIf=\"activeDatapoints?.length > 0\"\n>\n <ng-template #selectedDatapoint>\n <div class=\"text-left\">\n <strong>{{ selectedDatapointLabel }}</strong>\n <br />\n {{ 'Click to change' | translate }}\n </div>\n </ng-template>\n <button\n class=\"btn btn-default d-flex a-i-center dropdown-toggle c8y-dropdown\"\n title=\"{{'Select a data point to view its aggregated values in the time slider.' | translate }}\"\n type=\"button\"\n dropdownToggle\n >\n <span\n [style.background-color]=\"selectedDatapointColor\"\n style=\"display: inline-block; width: 16px; height: 16px; border-radius: 50%\"\n ></span>\n <span class=\"caret\"></span>\n </button>\n <ul\n class=\"dropdown-menu dropdown-menu-right\"\n *dropdownMenu\n >\n <li *ngFor=\"let datapoint of activeDatapoints\">\n <button\n class=\"p-r-8\"\n type=\"button\"\n (click)=\"changeDatapointSelection(datapoint)\"\n >\n <span\n class=\"d-inline-block m-r-4\"\n [style.background-color]=\"datapoint?.color\"\n style=\"width: 16px; height: 16px; border-radius: 50%\"\n ></span>\n <span class=\"text-truncate\" style=\"max-width:220px!important\" title=\"{{ datapoint?.label || `${datapoint?.fragment}-${datapoint?.series}` }}\">\n {{ datapoint?.label || `${datapoint?.fragment}-${datapoint?.series}` }}\n </span>\n <span\n class=\"m-l-auto flex-no-shrink\"\n *ngIf=\"\n datapoint.__target.id === value?.__target.id &&\n datapoint.fragment === value?.fragment &&\n datapoint.series === value?.series\n \"\n >\n <i\n class=\"text-success h4\"\n [c8yIcon]=\"'check'\"\n ></i>\n </span>\n </button>\n </li>\n </ul>\n</div>\n<button\n class=\"btn-help\"\n [attr.aria-label]=\"'Help' | translate\"\n popover=\"{{\n 'Select a data point to view its aggregated values in the time slider.' | translate\n }}\"\n placement=\"left\"\n triggers=\"focus\"\n container=\"body\"\n></button>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: PopoverModule }, { kind: "directive", type: i1$4.PopoverDirective, selector: "[popover]", inputs: ["adaptivePosition", "boundariesElement", "popover", "popoverContext", "popoverTitle", "placement", "outsideClick", "triggers", "container", "containerClass", "isOpen", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: BsDropdownModule }, { kind: "directive", type: i2.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { kind: "directive", type: i2.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { kind: "directive", type: i2.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i3.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
|
|
2085
2098
|
}
|
|
2086
2099
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SelectAggregatedDatapointComponent, decorators: [{
|
|
2087
2100
|
type: Component,
|
|
@@ -2900,7 +2913,7 @@ class ChartsComponent {
|
|
|
2900
2913
|
YAxisService,
|
|
2901
2914
|
AlarmSeverityToIconPipe,
|
|
2902
2915
|
AlarmSeverityToLabelPipe
|
|
2903
|
-
], viewQueries: [{ propertyName: "chart", first: true, predicate: ["chart"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"p-relative fit-h chart-container\">\n <div\n class=\"fit-w fit-h\"\n #chart\n echarts\n [options]=\"chartOption$ | async\"\n (chartInit)=\"onChartInit($event)\"\n ></div>\n\n <c8y-chart-alerts [alerts]=\"alerts\"></c8y-chart-alerts>\n\n @if (showLoadMore) {\n <div class=\"chart-load-more\">\n <button\n class=\"btn btn-primary btn-block\"\n [disabled]=\"isFetching\"\n (click)=\"loadMoreData()\"\n >\n <i c8yIcon=\"restore\"></i>\n {{ 'Load more' | translate }}\n </button>\n </div>\n }\n\n @if (\n activeDatapoints.length > 1 &&\n config?.showSlider &&\n chartViewContext !== CHART_VIEW_CONTEXT.WIDGET_VIEW\n ) {\n <div class=\"e-charts--aggregated-datapoint\">\n <c8y-select-aggregated-datapoint\n [value]=\"config?.aggregatedDatapoint || activeDatapoints[0]\"\n (valueChange)=\"updateAggregatedSliderDatapoint.emit($event)\"\n [activeDatapoints]=\"activeDatapoints\"\n ></c8y-select-aggregated-datapoint>\n </div>\n }\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule$1 }, { kind: "ngmodule", type: CoreModule }, { kind: "directive", type: i1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "ngmodule", type: NgxEchartsModule }, { kind: "directive", type: i2$1.NgxEchartsDirective, selector: "echarts, [echarts]", inputs: ["options", "theme", "initOpts", "merge", "autoResize", "loading", "loadingType", "loadingOpts"], outputs: ["chartInit", "optionsError", "chartClick", "chartDblClick", "chartMouseDown", "chartMouseMove", "chartMouseUp", "chartMouseOver", "chartMouseOut", "chartGlobalOut", "chartContextMenu", "chartHighlight", "chartDownplay", "chartSelectChanged", "chartLegendSelectChanged", "chartLegendSelected", "chartLegendUnselected", "chartLegendLegendSelectAll", "chartLegendLegendInverseSelect", "chartLegendScroll", "chartDataZoom", "chartDataRangeSelected", "chartGraphRoam", "chartGeoRoam", "chartTreeRoam", "chartTimelineChanged", "chartTimelinePlayChanged", "chartRestore", "chartDataViewChanged", "chartMagicTypeChanged", "chartGeoSelectChanged", "chartGeoSelected", "chartGeoUnselected", "chartAxisAreaSelected", "chartBrush", "chartBrushEnd", "chartBrushSelected", "chartGlobalCursorTaken", "chartRendered", "chartFinished"], exportAs: ["echarts"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: PopoverModule }, { kind: "component", type: ChartAlertsComponent, selector: "c8y-chart-alerts", inputs: ["alerts"] }, { kind: "ngmodule", type: AlarmsModule }, { kind: "component", type: SelectAggregatedDatapointComponent, selector: "c8y-select-aggregated-datapoint", inputs: ["activeDatapoints", "value"], outputs: ["valueChange"] }, { kind: "pipe", type: i1$
|
|
2916
|
+
], viewQueries: [{ propertyName: "chart", first: true, predicate: ["chart"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"p-relative fit-h chart-container\">\n <div\n class=\"fit-w fit-h\"\n #chart\n echarts\n [options]=\"chartOption$ | async\"\n (chartInit)=\"onChartInit($event)\"\n ></div>\n\n <c8y-chart-alerts [alerts]=\"alerts\"></c8y-chart-alerts>\n\n @if (showLoadMore) {\n <div class=\"chart-load-more\">\n <button\n class=\"btn btn-primary btn-block\"\n [disabled]=\"isFetching\"\n (click)=\"loadMoreData()\"\n >\n <i c8yIcon=\"restore\"></i>\n {{ 'Load more' | translate }}\n </button>\n </div>\n }\n\n @if (\n activeDatapoints.length > 1 &&\n config?.showSlider &&\n chartViewContext !== CHART_VIEW_CONTEXT.WIDGET_VIEW\n ) {\n <div class=\"e-charts--aggregated-datapoint\">\n <c8y-select-aggregated-datapoint\n [value]=\"config?.aggregatedDatapoint || activeDatapoints[0]\"\n (valueChange)=\"updateAggregatedSliderDatapoint.emit($event)\"\n [activeDatapoints]=\"activeDatapoints\"\n ></c8y-select-aggregated-datapoint>\n </div>\n }\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule$1 }, { kind: "ngmodule", type: CoreModule }, { kind: "directive", type: i1$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "ngmodule", type: NgxEchartsModule }, { kind: "directive", type: i2$1.NgxEchartsDirective, selector: "echarts, [echarts]", inputs: ["options", "theme", "initOpts", "merge", "autoResize", "loading", "loadingType", "loadingOpts"], outputs: ["chartInit", "optionsError", "chartClick", "chartDblClick", "chartMouseDown", "chartMouseMove", "chartMouseUp", "chartMouseOver", "chartMouseOut", "chartGlobalOut", "chartContextMenu", "chartHighlight", "chartDownplay", "chartSelectChanged", "chartLegendSelectChanged", "chartLegendSelected", "chartLegendUnselected", "chartLegendLegendSelectAll", "chartLegendLegendInverseSelect", "chartLegendScroll", "chartDataZoom", "chartDataRangeSelected", "chartGraphRoam", "chartGeoRoam", "chartTreeRoam", "chartTimelineChanged", "chartTimelinePlayChanged", "chartRestore", "chartDataViewChanged", "chartMagicTypeChanged", "chartGeoSelectChanged", "chartGeoSelected", "chartGeoUnselected", "chartAxisAreaSelected", "chartBrush", "chartBrushEnd", "chartBrushSelected", "chartGlobalCursorTaken", "chartRendered", "chartFinished"], exportAs: ["echarts"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: PopoverModule }, { kind: "component", type: ChartAlertsComponent, selector: "c8y-chart-alerts", inputs: ["alerts"] }, { kind: "ngmodule", type: AlarmsModule }, { kind: "component", type: SelectAggregatedDatapointComponent, selector: "c8y-select-aggregated-datapoint", inputs: ["activeDatapoints", "value"], outputs: ["valueChange"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.C8yTranslatePipe, name: "translate" }] }); }
|
|
2904
2917
|
}
|
|
2905
2918
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChartsComponent, decorators: [{
|
|
2906
2919
|
type: Component,
|