diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/chart/time-series-chart-threshold-settings-panel.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/chart/time-series-chart-threshold-settings-panel.component.html
index 50b224765e..b36192e728 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/chart/time-series-chart-threshold-settings-panel.component.html
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/chart/time-series-chart-threshold-settings-panel.component.html
@@ -31,6 +31,7 @@
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/chart/time-series-chart-threshold-settings-panel.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/chart/time-series-chart-threshold-settings-panel.component.ts
index 47b6f98cbb..62bcba3cad 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/chart/time-series-chart-threshold-settings-panel.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/chart/time-series-chart-threshold-settings-panel.component.ts
@@ -28,12 +28,14 @@ import { WidgetConfig } from '@shared/models/widget.models';
import { formatValue, isDefinedAndNotNull } from '@core/utils';
import { coerceBoolean } from '@shared/decorators/coercion';
import {
- chartLineTypes, chartLineTypeTranslations,
+ chartLineTypes,
+ chartLineTypeTranslations,
ChartShape,
chartShapes,
chartShapeTranslations
} from '@home/components/widget/lib/chart/chart.models';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { getSourceTbUnitSymbol, isNotEmptyTbUnits, TbUnit } from '@shared/models/unit.models';
@Component({
selector: 'tb-time-series-chart-threshold-settings-panel',
@@ -163,11 +165,11 @@ export class TimeSeriesChartThresholdSettingsPanelComponent implements OnInit {
}
private _labelPreviewFn(): string {
- let units: string = this.thresholdSettingsFormGroup.get('units').value;
- units = units && units.length ? units : this.widgetConfig.units;
+ let units: TbUnit = this.thresholdSettingsFormGroup.get('units').value;
+ units = isNotEmptyTbUnits(units) ? units : this.widgetConfig.units;
let decimals: number = this.thresholdSettingsFormGroup.get('decimals').value;
decimals = isDefinedAndNotNull(decimals) ? decimals :
(isDefinedAndNotNull(this.widgetConfig.decimals) ? this.widgetConfig.decimals : 2);
- return formatValue(22, decimals, units, false);
+ return formatValue(22, decimals, getSourceTbUnitSymbol(units), false);
}
}
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/chart/time-series-chart-y-axis-row.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/chart/time-series-chart-y-axis-row.component.html
index 1b31ad2b59..bfa10c68d1 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/chart/time-series-chart-y-axis-row.component.html
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/chart/time-series-chart-y-axis-row.component.html
@@ -41,7 +41,7 @@
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/slider-widget-settings.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/slider-widget-settings.component.html
index cbbc6b8c59..3c48c86c10 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/slider-widget-settings.component.html
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/slider-widget-settings.component.html
@@ -89,7 +89,7 @@
{{ 'widgets.slider.value' | translate }}
-
+
widget-config.decimals-suffix
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/slider-widget-settings.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/slider-widget-settings.component.ts
index 40caf7a729..d9e8ca87fb 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/slider-widget-settings.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/slider-widget-settings.component.ts
@@ -28,6 +28,7 @@ import {
sliderWidgetDefaultSettings
} from '@home/components/widget/lib/rpc/slider-widget.models';
import { formatValue } from '@core/utils';
+import { getSourceTbUnitSymbol } from '@shared/models/unit.models';
@Component({
selector: 'tb-slider-widget-settings',
@@ -180,7 +181,7 @@ export class SliderWidgetSettingsComponent extends WidgetSettingsComponent {
}
private _valuePreviewFn(): string {
- const units: string = this.sliderWidgetSettingsForm.get('valueUnits').value;
+ const units: string = getSourceTbUnitSymbol(this.sliderWidgetSettingsForm.get('valueUnits').value);
const decimals: number = this.sliderWidgetSettingsForm.get('valueDecimals').value;
return formatValue(48, decimals, units, false);
}
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/value-stepper-widget-settings.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/value-stepper-widget-settings.component.html
index c908304651..311ad42110 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/value-stepper-widget-settings.component.html
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/value-stepper-widget-settings.component.html
@@ -104,7 +104,7 @@
{{ 'widgets.value-stepper.value' | translate }}
-
+
widget-config.decimals-suffix
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/value-stepper-widget-settings.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/value-stepper-widget-settings.component.ts
index c5bb26a2ec..a9065fca8d 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/value-stepper-widget-settings.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/value-stepper-widget-settings.component.ts
@@ -28,6 +28,7 @@ import {
valueStepperTypeTranslations
} from '@home/components/widget/lib/rpc/value-stepper-widget.models';
import { formatValue } from '@core/utils';
+import { getSourceTbUnitSymbol } from '@shared/models/unit.models';
type ButtonAppearanceType = 'left' | 'right';
@@ -184,7 +185,7 @@ export class ValueStepperWidgetSettingsComponent extends WidgetSettingsComponent
}
private _valuePreviewFn(): string {
- const units: string = this.valueStepperWidgetSettingsForm.get('appearance').get('valueUnits').value;
+ const units: string = getSourceTbUnitSymbol(this.valueStepperWidgetSettingsForm.get('appearance').get('valueUnits').value);
const decimals: number = this.valueStepperWidgetSettingsForm.get('appearance').get('valueDecimals').value;
return formatValue(48, decimals, units, false);
}
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/gauge/digital-gauge-widget-settings.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/settings/gauge/digital-gauge-widget-settings.component.ts
index 63f122cb15..7276c0e27d 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/gauge/digital-gauge-widget-settings.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/gauge/digital-gauge-widget-settings.component.ts
@@ -20,7 +20,8 @@ import {
AbstractControl,
UntypedFormArray,
UntypedFormBuilder,
- UntypedFormGroup, ValidationErrors,
+ UntypedFormGroup,
+ ValidationErrors,
ValidatorFn,
Validators
} from '@angular/forms';
@@ -45,6 +46,7 @@ import {
ValueSourceConfig,
ValueSourceType
} from '@shared/models/widget-settings.models';
+import { getSourceTbUnitSymbol } from '@shared/models/unit.models';
@Component({
selector: 'tb-digital-gauge-widget-settings',
@@ -412,6 +414,6 @@ export class DigitalGaugeWidgetSettingsComponent extends WidgetSettingsComponent
}
private _valuePreviewFn(units: boolean): string {
- return formatValue(22, 0, units ? this.widget.config.units : null, true);
+ return formatValue(22, 0, units ? getSourceTbUnitSymbol(this.widget.config.units) : null, true);
}
}
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/indicator/battery-level-widget-settings.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/settings/indicator/battery-level-widget-settings.component.ts
index a654d2270c..bf6b529d06 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/indicator/battery-level-widget-settings.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/indicator/battery-level-widget-settings.component.ts
@@ -27,6 +27,7 @@ import {
batteryLevelLayouts,
batteryLevelLayoutTranslations
} from '@home/components/widget/lib/indicator/battery-level-widget.models';
+import { getSourceTbUnitSymbol } from '@shared/models/unit.models';
@Component({
selector: 'tb-battery-level-widget-settings',
@@ -122,7 +123,7 @@ export class BatteryLevelWidgetSettingsComponent extends WidgetSettingsComponent
}
private _valuePreviewFn(): string {
- const units: string = this.widgetConfig.config.units;
+ const units: string = getSourceTbUnitSymbol(this.widgetConfig.config.units);
const decimals: number = this.widgetConfig.config.decimals;
return formatValue(22, decimals, units, true);
}
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/indicator/liquid-level-card-widget-settings.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/settings/indicator/liquid-level-card-widget-settings.component.html
index aff64a5e18..88f62477dd 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/indicator/liquid-level-card-widget-settings.component.html
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/indicator/liquid-level-card-widget-settings.component.html
@@ -99,6 +99,7 @@
@@ -239,6 +240,7 @@
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/indicator/liquid-level-card-widget-settings.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/settings/indicator/liquid-level-card-widget-settings.component.ts
index 59f8c177c6..843c4470b5 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/indicator/liquid-level-card-widget-settings.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/indicator/liquid-level-card-widget-settings.component.ts
@@ -44,7 +44,7 @@ import {
ShapesTranslations,
updatedFormSettingsValidators
} from '@home/components/widget/lib/indicator/liquid-level-widget.models';
-import { UnitsType } from '@shared/models/unit.models';
+import { getSourceTbUnitSymbol, UnitsType } from '@shared/models/unit.models';
import { ImageCardsSelectComponent } from '@home/components/widget/lib/settings/common/image-cards-select.component';
import { DomSanitizer, SafeUrl } from '@angular/platform-browser';
import { Observable, of, ReplaySubject } from 'rxjs';
@@ -230,13 +230,13 @@ export class LiquidLevelCardWidgetSettingsComponent extends WidgetSettingsCompon
}
private _valuePreviewFn(): string {
- const units: string = this.widgetConfig.config.units;
+ const units: string = getSourceTbUnitSymbol(this.widgetConfig.config.units);
const decimals: number = this.widgetConfig.config.decimals;
return formatValue(32, decimals, units, true);
}
private _tooltipValuePreviewFn() {
- const units: string = this.levelCardWidgetSettingsForm.get('tooltipUnits').value;
+ const units: string = getSourceTbUnitSymbol(this.levelCardWidgetSettingsForm.get('tooltipUnits').value);
const decimals: number = this.levelCardWidgetSettingsForm.get('tooltipLevelDecimals').value;
return formatValue(32, decimals, units, true);
}
@@ -245,7 +245,7 @@ export class LiquidLevelCardWidgetSettingsComponent extends WidgetSettingsCompon
const value = this.levelCardWidgetSettingsForm.get('volumeConstant').value;
const datasourceUnits = this.levelCardWidgetSettingsForm.get('datasourceUnits').value;
const decimals: number = this.widgetConfig.config.decimals;
- let units: string = this.widgetConfig.config.units;
+ let units: string = getSourceTbUnitSymbol(this.widgetConfig.config.units);
if (datasourceUnits !== CapacityUnits.percent) {
units = datasourceUnits;
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/indicator/signal-strength-widget-settings.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/settings/indicator/signal-strength-widget-settings.component.ts
index 74def6f08d..7b5b20e777 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/indicator/signal-strength-widget-settings.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/indicator/signal-strength-widget-settings.component.ts
@@ -27,6 +27,7 @@ import {
signalStrengthLayoutTranslations
} from '@home/components/widget/lib/indicator/signal-strength-widget.models';
import { DateFormatProcessor, DateFormatSettings } from '@shared/models/widget-settings.models';
+import { getSourceTbUnitSymbol } from '@shared/models/unit.models';
@Component({
selector: 'tb-signal-strength-widget-settings',
@@ -154,7 +155,7 @@ export class SignalStrengthWidgetSettingsComponent extends WidgetSettingsCompone
}
private _tooltipValuePreviewFn(): string {
- const units: string = this.widgetConfig.config.units;
+ const units: string = getSourceTbUnitSymbol(this.widgetConfig.config.units);
const decimals: number = this.widgetConfig.config.decimals;
return formatValue(-76, decimals, units, true);
}
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/weather/wind-speed-direction-widget-settings.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/settings/weather/wind-speed-direction-widget-settings.component.ts
index 1b48bfd7c2..f947369840 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/weather/wind-speed-direction-widget-settings.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/weather/wind-speed-direction-widget-settings.component.ts
@@ -14,7 +14,7 @@
/// limitations under the License.
///
-import { Component, Injector } from '@angular/core';
+import { Component } from '@angular/core';
import { WidgetSettings, WidgetSettingsComponent } from '@shared/models/widget.models';
import { UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
import { Store } from '@ngrx/store';
@@ -28,6 +28,7 @@ import {
windSpeedDirectionLayoutTranslations
} from '@home/components/widget/lib/weather/wind-speed-direction-widget.models';
import { getDataKey } from '@shared/models/widget-settings.models';
+import { getSourceTbUnitSymbol, TbUnit } from '@shared/models/unit.models';
@Component({
selector: 'tb-wind-speed-direction-widget-settings',
@@ -60,7 +61,6 @@ export class WindSpeedDirectionWidgetSettingsComponent extends WidgetSettingsCom
centerValuePreviewFn = this._centerValuePreviewFn.bind(this);
constructor(protected store: Store,
- private $injector: Injector,
private fb: UntypedFormBuilder) {
super(store);
}
@@ -122,7 +122,7 @@ export class WindSpeedDirectionWidgetSettingsComponent extends WidgetSettingsCom
private _centerValuePreviewFn(): string {
const centerValueDataKey = getDataKey(this.widgetConfig.config.datasources, 1);
if (centerValueDataKey) {
- let units: string = this.widgetConfig.config.units;
+ let units: TbUnit = this.widgetConfig.config.units;
let decimals: number = this.widgetConfig.config.decimals;
if (isDefinedAndNotNull(centerValueDataKey?.decimals)) {
decimals = centerValueDataKey.decimals;
@@ -130,7 +130,7 @@ export class WindSpeedDirectionWidgetSettingsComponent extends WidgetSettingsCom
if (centerValueDataKey?.units) {
units = centerValueDataKey.units;
}
- return formatValue(25, decimals, units, true);
+ return formatValue(25, decimals, getSourceTbUnitSymbol(units), true);
} else {
return '225°';
}
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/table-widget.models.ts b/ui-ngx/src/app/modules/home/components/widget/lib/table-widget.models.ts
index 8aadc62ee4..16361c4761 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/table-widget.models.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/table-widget.models.ts
@@ -34,6 +34,7 @@ import {
} from '@shared/models/js-function.models';
import { forkJoin, Observable, of, ReplaySubject } from 'rxjs';
import { catchError, map, share } from 'rxjs/operators';
+import type { ValueFormatProcessor } from '@shared/models/widget-settings.models';
type ColumnVisibilityOptions = 'visible' | 'hidden' | 'hidden-mobile';
@@ -106,8 +107,7 @@ export interface CellContentFunctionInfo {
export interface CellContentInfo {
contentFunction: Observable;
- units?: string;
- decimals?: number;
+ valueFormat?: ValueFormatProcessor
}
export type CellStyleFunction = (...args: any[]) => any;
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/timeseries-table-widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/timeseries-table-widget.component.ts
index 2653b79059..d523bfc522 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/timeseries-table-widget.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/timeseries-table-widget.component.ts
@@ -104,7 +104,7 @@ import {
import { ComponentPortal } from '@angular/cdk/portal';
import { FormBuilder } from '@angular/forms';
import { DEFAULT_OVERLAY_POSITIONS } from '@shared/models/overlay.models';
-import { DateFormatSettings } from '@shared/models/widget-settings.models';
+import { DateFormatSettings, ValueFormatProcessor } from '@shared/models/widget-settings.models';
export interface TimeseriesTableWidgetSettings extends TableWidgetSettings {
showTimestamp: boolean;
@@ -539,10 +539,12 @@ export class TimeseriesTableWidgetComponent extends PageComponent implements OnI
const contentFunctionInfo = getCellContentFunctionInfo(this.ctx, keySettings, 'value, rowData, ctx');
const columnDefaultVisibility = getColumnDefaultVisibility(keySettings, this.ctx);
const columnSelectionAvailability = getColumnSelectionAvailability(keySettings);
+ const decimals = (dataKey.decimals || dataKey.decimals === 0) ? dataKey.decimals : this.ctx.widgetConfig.decimals;
+ const units = dataKey.units || this.ctx.widgetConfig.units;
+ const valueFormat = ValueFormatProcessor.fromSettings(this.ctx.$injector, {units, decimals, showZeroDecimals: true});
const contentInfo: CellContentInfo = {
contentFunction: contentFunctionInfo,
- units: dataKey.units,
- decimals: dataKey.decimals
+ valueFormat
};
header.push({
index: index + 1,
@@ -565,10 +567,12 @@ export class TimeseriesTableWidgetComponent extends PageComponent implements OnI
const contentFunctionInfo = getCellContentFunctionInfo(this.ctx, keySettings, 'value, rowData, ctx');
const columnDefaultVisibility = getColumnDefaultVisibility(keySettings, this.ctx);
const columnSelectionAvailability = getColumnSelectionAvailability(keySettings);
+ const decimals = (dataKey.decimals || dataKey.decimals === 0) ? dataKey.decimals : this.ctx.widgetConfig.decimals;
+ const units = dataKey.units || this.ctx.widgetConfig.units;
+ const valueFormat = ValueFormatProcessor.fromSettings(this.ctx.$injector, {units, decimals, showZeroDecimals: true});
const contentInfo: CellContentInfo = {
contentFunction: contentFunctionInfo,
- units: dataKey.units,
- decimals: dataKey.decimals
+ valueFormat
};
header.push({
index: index + 1,
@@ -682,7 +686,7 @@ export class TimeseriesTableWidgetComponent extends PageComponent implements OnI
public rowStyle(source: TimeseriesTableSource, row: TimeseriesRow, index: number): Observable {
let style$: Observable;
- let res = this.rowStyleCache[index];
+ const res = this.rowStyleCache[index];
if (!res) {
style$ = this.rowStylesInfo.pipe(
map(styleInfo => {
@@ -725,7 +729,7 @@ export class TimeseriesTableWidgetComponent extends PageComponent implements OnI
index: number, row: TimeseriesRow, value: any, rowIndex: number): Observable {
let style$: Observable;
const cacheIndex = rowIndex * (source.header.length + 1) + index;
- let res = this.cellStyleCache[cacheIndex];
+ const res = this.cellStyleCache[cacheIndex];
if (!res) {
if (index > 0) {
style$ = header.styleInfo.pipe(
@@ -772,7 +776,7 @@ export class TimeseriesTableWidgetComponent extends PageComponent implements OnI
index: number, row: TimeseriesRow, value: any, rowIndex: number): Observable {
let content$: Observable;
const cacheIndex = rowIndex * (source.header.length + 1) + index ;
- let res = this.cellContentCache[cacheIndex];
+ const res = this.cellContentCache[cacheIndex];
if (isUndefined(res)) {
if (index === 0) {
content$ = of(row.formattedTs);
@@ -792,9 +796,7 @@ export class TimeseriesTableWidgetComponent extends PageComponent implements OnI
content = '' + value;
}
} else {
- const decimals = (header.contentInfo.decimals || header.contentInfo.decimals === 0) ? header.contentInfo.decimals : this.ctx.widgetConfig.decimals;
- const units = header.contentInfo.units || this.ctx.widgetConfig.units;
- content = this.ctx.utils.formatValue(value, decimals, units, true);
+ content = header.contentInfo.valueFormat.format(value);
}
if (isDefined(content)) {
content = this.utils.customTranslation(content, content);
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/weather/wind-speed-direction-widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/weather/wind-speed-direction-widget.component.ts
index cf6ac85538..f495c4b204 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/weather/wind-speed-direction-widget.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/weather/wind-speed-direction-widget.component.ts
@@ -40,7 +40,8 @@ import {
Font,
getDataKey,
getSingleTsValueByDataKey,
- overlayStyle
+ overlayStyle,
+ ValueFormatProcessor
} from '@shared/models/widget-settings.models';
import { formatValue, isDefinedAndNotNull, isNumeric } from '@core/utils';
import { Path, Svg, SVG, Text } from '@svgdotjs/svg.js';
@@ -48,6 +49,7 @@ import { DataKey } from '@shared/models/widget.models';
import { Observable } from 'rxjs';
import { ImagePipe } from '@shared/pipe/image.pipe';
import { DomSanitizer } from '@angular/platform-browser';
+import { UnitService } from '@core/services/unit.service';
const shapeSize = 180;
const cx = shapeSize / 2;
@@ -96,14 +98,14 @@ export class WindSpeedDirectionWidgetComponent implements OnInit, OnDestroy, Aft
hasCardClickAction = false;
- private decimals = 0;
- private units = '';
-
private drawSvgShapePending = false;
private svgShape: Svg;
private arrow: Path;
private centerValueTextNode: Text;
+ private units = ''
+ private valueFormat: ValueFormatProcessor;
+
private windDirectionDataKey: DataKey;
private centerValueDataKey: DataKey;
@@ -111,6 +113,7 @@ export class WindSpeedDirectionWidgetComponent implements OnInit, OnDestroy, Aft
private centerValueText = 'N/A';
constructor(private imagePipe: ImagePipe,
+ private unitService: UnitService,
private sanitizer: DomSanitizer,
private renderer: Renderer2,
private cd: ChangeDetectorRef) {
@@ -124,14 +127,16 @@ export class WindSpeedDirectionWidgetComponent implements OnInit, OnDestroy, Aft
this.centerValueDataKey = getDataKey(this.ctx.datasources, 1);
if (this.centerValueDataKey) {
- this.decimals = this.ctx.decimals;
- this.units = this.ctx.units;
+ let decimals = this.ctx.decimals;
+ let units = this.ctx.units;
if (isDefinedAndNotNull(this.centerValueDataKey.decimals)) {
- this.decimals = this.centerValueDataKey.decimals;
+ decimals = this.centerValueDataKey.decimals;
}
if (this.centerValueDataKey.units) {
- this.units = this.centerValueDataKey.units;
+ units = this.centerValueDataKey.units;
}
+ this.units = this.unitService.getTargetUnitSymbol(units);
+ this.valueFormat = ValueFormatProcessor.fromSettings(this.ctx.$injector, {units, decimals, ignoreUnitSymbol: true})
}
this.layout = this.settings.layout;
@@ -186,7 +191,7 @@ export class WindSpeedDirectionWidgetComponent implements OnInit, OnDestroy, Aft
const centerValueTsValue = getSingleTsValueByDataKey(this.ctx.data, this.centerValueDataKey);
if (centerValueTsValue && isDefinedAndNotNull(centerValueTsValue[1]) && isNumeric(centerValueTsValue[1])) {
value = centerValueTsValue[1];
- this.centerValueText = formatValue(value, this.decimals, '', false);
+ this.centerValueText = this.valueFormat.format(value);
}
}
this.centerValueColor.update(value);
diff --git a/ui-ngx/src/app/modules/home/components/widget/widget-config.component.html b/ui-ngx/src/app/modules/home/components/widget/widget-config.component.html
index 77764ba408..8d46ede134 100644
--- a/ui-ngx/src/app/modules/home/components/widget/widget-config.component.html
+++ b/ui-ngx/src/app/modules/home/components/widget/widget-config.component.html
@@ -291,7 +291,7 @@
diff --git a/ui-ngx/src/app/modules/home/components/widget/widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/widget.component.ts
index 9287b92d57..d5a0b78ce5 100644
--- a/ui-ngx/src/app/modules/home/components/widget/widget.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/widget.component.ts
@@ -342,6 +342,7 @@ export class WidgetComponent extends PageComponent implements OnInit, OnChanges,
this.subscriptionContext.dashboardUtils = this.dashboardUtils;
this.subscriptionContext.raf = this.raf;
this.subscriptionContext.widgetUtils = this.widgetContext.utils;
+ this.subscriptionContext.$injector = this.injector;
this.subscriptionContext.getServerTimeDiff = this.dashboardService.getServerTimeDiff.bind(this.dashboardService);
this.widgetComponentService.getWidgetInfo(this.widget.typeFullFqn).subscribe({
diff --git a/ui-ngx/src/app/modules/home/models/widget-component.models.ts b/ui-ngx/src/app/modules/home/models/widget-component.models.ts
index aee890a5b2..8d2622ebea 100644
--- a/ui-ngx/src/app/modules/home/models/widget-component.models.ts
+++ b/ui-ngx/src/app/modules/home/models/widget-component.models.ts
@@ -51,7 +51,8 @@ import {
ChangeDetectorRef,
InjectionToken,
Injector,
- NgZone, Renderer2,
+ NgZone,
+ Renderer2,
TemplateRef,
Type,
ViewContainerRef
@@ -116,6 +117,7 @@ import { UtilsService } from '@core/services/utils.service';
import { CompiledTbFunction } from '@shared/models/js-function.models';
import { FormProperty } from '@shared/models/dynamic-form.models';
import { ExportableEntity } from '@shared/models/base-data';
+import { TbUnit } from '@shared/models/unit.models';
export interface IWidgetAction {
name: string;
@@ -174,7 +176,7 @@ export class WidgetContext {
return this.widget.config.settings;
}
- get units(): string {
+ get units(): TbUnit {
return this.widget.config.units || '';
}
diff --git a/ui-ngx/src/app/shared/components/convert-unit-settings-panel.component.html b/ui-ngx/src/app/shared/components/convert-unit-settings-panel.component.html
index fb5e73aebc..7c935728a3 100644
--- a/ui-ngx/src/app/shared/components/convert-unit-settings-panel.component.html
+++ b/ui-ngx/src/app/shared/components/convert-unit-settings-panel.component.html
@@ -20,7 +20,8 @@