|
|
|
@ -44,6 +44,7 @@ import { |
|
|
|
barChartWithLabelsDefaultSettings, |
|
|
|
BarChartWithLabelsWidgetSettings |
|
|
|
} from '@home/components/widget/lib/chart/bar-chart-with-labels-widget.models'; |
|
|
|
import { TimeSeriesChartType } from '@home/components/widget/lib/chart/time-series-chart.models'; |
|
|
|
|
|
|
|
@Component({ |
|
|
|
selector: 'tb-bar-chart-with-labels-basic-config', |
|
|
|
@ -105,16 +106,30 @@ export class BarChartWithLabelsBasicConfigComponent extends BasicWidgetConfigCom |
|
|
|
icon: [configData.config.titleIcon, []], |
|
|
|
iconColor: [configData.config.iconColor, []], |
|
|
|
|
|
|
|
dataZoom: [settings.dataZoom, []], |
|
|
|
|
|
|
|
showBarLabel: [settings.showBarLabel, []], |
|
|
|
barLabelFont: [settings.barLabelFont, []], |
|
|
|
barLabelColor: [settings.barLabelColor, []], |
|
|
|
showBarValue: [settings.showBarValue, []], |
|
|
|
barValueFont: [settings.barValueFont, []], |
|
|
|
barValueColor: [settings.barValueColor, []], |
|
|
|
showBarBorder: [settings.showBarBorder, []], |
|
|
|
barBorderWidth: [settings.barBorderWidth, []], |
|
|
|
barBorderRadius: [settings.barBorderRadius, []], |
|
|
|
barBackgroundSettings: [settings.barBackgroundSettings, []], |
|
|
|
noAggregationBarWidthSettings: [settings.noAggregationBarWidthSettings, []], |
|
|
|
|
|
|
|
units: [configData.config.units, []], |
|
|
|
decimals: [configData.config.decimals, []], |
|
|
|
|
|
|
|
yAxis: [settings.yAxis, []], |
|
|
|
xAxis: [settings.xAxis, []], |
|
|
|
|
|
|
|
thresholds: [settings.thresholds, []], |
|
|
|
|
|
|
|
animation: [settings.animation, []], |
|
|
|
|
|
|
|
showLegend: [settings.showLegend, []], |
|
|
|
legendPosition: [settings.legendPosition, []], |
|
|
|
legendLabelFont: [settings.legendLabelFont, []], |
|
|
|
@ -159,6 +174,8 @@ export class BarChartWithLabelsBasicConfigComponent extends BasicWidgetConfigCom |
|
|
|
|
|
|
|
this.widgetConfig.config.settings = this.widgetConfig.config.settings || {}; |
|
|
|
|
|
|
|
this.widgetConfig.config.settings.dataZoom = config.dataZoom; |
|
|
|
|
|
|
|
this.widgetConfig.config.settings.showBarLabel = config.showBarLabel; |
|
|
|
this.widgetConfig.config.settings.barLabelFont = config.barLabelFont; |
|
|
|
this.widgetConfig.config.settings.barLabelColor = config.barLabelColor; |
|
|
|
@ -166,9 +183,22 @@ export class BarChartWithLabelsBasicConfigComponent extends BasicWidgetConfigCom |
|
|
|
this.widgetConfig.config.settings.barValueFont = config.barValueFont; |
|
|
|
this.widgetConfig.config.settings.barValueColor = config.barValueColor; |
|
|
|
|
|
|
|
this.widgetConfig.config.settings.showBarBorder = config.showBarBorder; |
|
|
|
this.widgetConfig.config.settings.barBorderWidth = config.barBorderWidth; |
|
|
|
this.widgetConfig.config.settings.barBorderRadius = config.barBorderRadius; |
|
|
|
this.widgetConfig.config.settings.barBackgroundSettings = config.barBackgroundSettings; |
|
|
|
this.widgetConfig.config.settings.noAggregationBarWidthSettings = config.noAggregationBarWidthSettings; |
|
|
|
|
|
|
|
this.widgetConfig.config.units = config.units; |
|
|
|
this.widgetConfig.config.decimals = config.decimals; |
|
|
|
|
|
|
|
this.widgetConfig.config.settings.yAxis = config.yAxis; |
|
|
|
this.widgetConfig.config.settings.xAxis = config.xAxis; |
|
|
|
|
|
|
|
this.widgetConfig.config.settings.thresholds = config.thresholds; |
|
|
|
|
|
|
|
this.widgetConfig.config.settings.animation = config.animation; |
|
|
|
|
|
|
|
this.widgetConfig.config.settings.showLegend = config.showLegend; |
|
|
|
this.widgetConfig.config.settings.legendPosition = config.legendPosition; |
|
|
|
this.widgetConfig.config.settings.legendLabelFont = config.legendLabelFont; |
|
|
|
@ -196,7 +226,7 @@ export class BarChartWithLabelsBasicConfigComponent extends BasicWidgetConfigCom |
|
|
|
} |
|
|
|
|
|
|
|
protected validatorTriggers(): string[] { |
|
|
|
return ['showTitle', 'showIcon', 'showBarLabel', 'showBarValue', 'showLegend', 'showTooltip', 'tooltipShowDate']; |
|
|
|
return ['showTitle', 'showIcon', 'showBarLabel', 'showBarValue', 'showBarBorder', 'showLegend', 'showTooltip', 'tooltipShowDate']; |
|
|
|
} |
|
|
|
|
|
|
|
protected updateValidators(emitEvent: boolean, trigger?: string) { |
|
|
|
@ -204,6 +234,7 @@ export class BarChartWithLabelsBasicConfigComponent extends BasicWidgetConfigCom |
|
|
|
const showIcon: boolean = this.barChartWidgetConfigForm.get('showIcon').value; |
|
|
|
const showBarLabel: boolean = this.barChartWidgetConfigForm.get('showBarLabel').value; |
|
|
|
const showBarValue: boolean = this.barChartWidgetConfigForm.get('showBarValue').value; |
|
|
|
const showBarBorder: boolean = this.barChartWidgetConfigForm.get('showBarBorder').value; |
|
|
|
const showLegend: boolean = this.barChartWidgetConfigForm.get('showLegend').value; |
|
|
|
const showTooltip: boolean = this.barChartWidgetConfigForm.get('showTooltip').value; |
|
|
|
const tooltipShowDate: boolean = this.barChartWidgetConfigForm.get('tooltipShowDate').value; |
|
|
|
@ -250,7 +281,11 @@ export class BarChartWithLabelsBasicConfigComponent extends BasicWidgetConfigCom |
|
|
|
this.barChartWidgetConfigForm.get('barValueFont').disable(); |
|
|
|
this.barChartWidgetConfigForm.get('barValueColor').disable(); |
|
|
|
} |
|
|
|
|
|
|
|
if (showBarBorder) { |
|
|
|
this.barChartWidgetConfigForm.get('barBorderWidth').enable(); |
|
|
|
} else { |
|
|
|
this.barChartWidgetConfigForm.get('barBorderWidth').disable(); |
|
|
|
} |
|
|
|
if (showLegend) { |
|
|
|
this.barChartWidgetConfigForm.get('legendPosition').enable(); |
|
|
|
this.barChartWidgetConfigForm.get('legendLabelFont').enable(); |
|
|
|
@ -328,4 +363,6 @@ export class BarChartWithLabelsBasicConfigComponent extends BasicWidgetConfigCom |
|
|
|
processor.update(Date.now()); |
|
|
|
return processor.formatted; |
|
|
|
} |
|
|
|
|
|
|
|
protected readonly TimeSeriesChartType = TimeSeriesChartType; |
|
|
|
} |
|
|
|
|