Merge branch 'fix/3806-opc-ua-extesion-fixes' of github.com:maxunbearable/thingsboard into improvement/gateway-dashboard
This commit is contained in:
commit
9d45deb7f8
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -456,6 +456,10 @@ export class UtilsService {
|
||||
return isDefined(value);
|
||||
}
|
||||
|
||||
public isDefinedAndNotNull(value: any): boolean {
|
||||
return isDefinedAndNotNull(value);
|
||||
}
|
||||
|
||||
public defaultValue(value: any, defaultValue: any): any {
|
||||
if (isDefinedAndNotNull(value)) {
|
||||
return value;
|
||||
|
||||
@ -27,7 +27,7 @@
|
||||
<div class="tb-form-panel">
|
||||
<div class="tb-form-panel-title" translate>widgets.action-button.behavior</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.action-button.on-click-hint' | translate}}">{{ 'widgets.action-button.on-click' | translate}}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.action-button.on-click-hint' | translate}}" translate>widgets.action-button.on-click</div>
|
||||
<tb-widget-action-settings fxFlex
|
||||
panelTitle="widgets.action-button.on-click"
|
||||
[callbacks]="callbacks"
|
||||
@ -36,7 +36,7 @@
|
||||
</tb-widget-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.button-state.activated-state-hint' | translate}}">{{ 'widgets.button-state.activated-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.button-state.activated-state-hint' | translate}}" translate>widgets.button-state.activated-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.button-state.activated-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
@ -47,7 +47,7 @@
|
||||
formControlName="activatedState"></tb-get-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.button-state.disabled-state-hint' | translate}}">{{ 'widgets.button-state.disabled-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.button-state.disabled-state-hint' | translate}}" translate>widgets.button-state.disabled-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.button-state.disabled-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
<div class="tb-form-panel">
|
||||
<div class="tb-form-panel-title" translate>widgets.command-button.behavior</div>
|
||||
<div class="tb-form-row space-between">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.command-button.on-click-hint' | translate}}">{{ 'widgets.command-button.on-click' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.command-button.on-click-hint' | translate}}" translate>widgets.command-button.on-click</div>
|
||||
<tb-set-value-action-settings fxFlex
|
||||
panelTitle="widgets.command-button.on-click"
|
||||
[aliasController]="aliasController"
|
||||
@ -29,7 +29,7 @@
|
||||
formControlName="onClickState"></tb-set-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.button-state.disabled-state-hint' | translate}}">{{ 'widgets.button-state.disabled-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.button-state.disabled-state-hint' | translate}}" translate>widgets.button-state.disabled-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.button-state.disabled-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
<div class="tb-form-panel">
|
||||
<div class="tb-form-panel-title" translate>widgets.power-button.behavior</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.initial-state-hint' | translate}}">{{ 'widgets.rpc-state.initial-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.initial-state-hint' | translate}}" translate>widgets.rpc-state.initial-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.initial-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
@ -33,7 +33,7 @@
|
||||
formControlName="initialState"></tb-get-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row space-between">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.power-button.power-on-hint' | translate}}">{{ 'widgets.power-button.power-on' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.power-button.power-on-hint' | translate}}" translate>widgets.power-button.power-on</div>
|
||||
<tb-set-value-action-settings fxFlex
|
||||
panelTitle="widgets.power-button.power-on"
|
||||
[aliasController]="aliasController"
|
||||
@ -42,7 +42,7 @@
|
||||
formControlName="onUpdateState"></tb-set-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row space-between">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.power-button.power-off-hint' | translate}}">{{ 'widgets.power-button.power-off' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.power-button.power-off-hint' | translate}}" translate>widgets.power-button.power-off</div>
|
||||
<tb-set-value-action-settings fxFlex
|
||||
panelTitle="widgets.power-button.power-off"
|
||||
[aliasController]="aliasController"
|
||||
@ -51,7 +51,7 @@
|
||||
formControlName="offUpdateState"></tb-set-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}">{{ 'widgets.rpc-state.disabled-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}" translate>widgets.rpc-state.disabled-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.disabled-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
<div class="tb-form-panel">
|
||||
<div class="tb-form-panel-title" translate>widgets.toggle-button.behavior</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.initial-state-hint' | translate}}">{{ 'widgets.rpc-state.initial-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.initial-state-hint' | translate}}" translate>widgets.rpc-state.initial-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.initial-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
@ -33,7 +33,7 @@
|
||||
formControlName="initialState"></tb-get-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row space-between">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.toggle-button.check-hint' | translate}}">{{ 'widgets.toggle-button.check' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.toggle-button.check-hint' | translate}}" translate>widgets.toggle-button.check</div>
|
||||
<tb-set-value-action-settings fxFlex
|
||||
panelTitle="widgets.toggle-button.check"
|
||||
[aliasController]="aliasController"
|
||||
@ -42,7 +42,7 @@
|
||||
formControlName="checkState"></tb-set-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row space-between">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.toggle-button.uncheck-hint' | translate}}">{{ 'widgets.toggle-button.uncheck' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.toggle-button.uncheck-hint' | translate}}" translate>widgets.toggle-button.uncheck</div>
|
||||
<tb-set-value-action-settings fxFlex
|
||||
panelTitle="widgets.toggle-button.uncheck"
|
||||
[aliasController]="aliasController"
|
||||
@ -51,7 +51,7 @@
|
||||
formControlName="uncheckState"></tb-set-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}">{{ 'widgets.rpc-state.disabled-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}" translate>widgets.rpc-state.disabled-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.disabled-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
|
||||
@ -160,7 +160,7 @@
|
||||
</div>
|
||||
<tb-chart-fill-settings
|
||||
formControlName="barBackgroundSettings"
|
||||
title="widgets.chart.background"
|
||||
titleText="widgets.chart.background"
|
||||
fillNoneTitle="widgets.chart.fill-type-solid">
|
||||
</tb-chart-fill-settings>
|
||||
<tb-time-series-no-aggregation-bar-width-settings
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
<div class="tb-form-panel">
|
||||
<div class="tb-form-panel-title" translate>widgets.status-widget.behavior</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.initial-state-hint' | translate}}">{{ 'widgets.rpc-state.initial-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.initial-state-hint' | translate}}" translate>widgets.rpc-state.initial-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.initial-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
@ -33,7 +33,7 @@
|
||||
formControlName="initialState"></tb-get-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}">{{ 'widgets.rpc-state.disabled-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}" translate>widgets.rpc-state.disabled-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.disabled-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
<div class="tb-form-panel">
|
||||
<div class="tb-form-panel-title" translate>widgets.single-switch.behavior</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.initial-state-hint' | translate}}">{{ 'widgets.rpc-state.initial-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.initial-state-hint' | translate}}" translate>widgets.rpc-state.initial-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.initial-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
@ -33,7 +33,7 @@
|
||||
formControlName="initialState"></tb-get-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row space-between">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.turn-on-hint' | translate}}">{{ 'widgets.rpc-state.turn-on' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.turn-on-hint' | translate}}" translate>widgets.rpc-state.turn-on</div>
|
||||
<tb-set-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.turn-on"
|
||||
[aliasController]="aliasController"
|
||||
@ -42,7 +42,7 @@
|
||||
formControlName="onUpdateState"></tb-set-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row space-between">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.turn-off-hint' | translate}}">{{ 'widgets.rpc-state.turn-off' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.turn-off-hint' | translate}}" translate>widgets.rpc-state.turn-off</div>
|
||||
<tb-set-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.turn-off"
|
||||
[aliasController]="aliasController"
|
||||
@ -51,7 +51,7 @@
|
||||
formControlName="offUpdateState"></tb-set-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}">{{ 'widgets.rpc-state.disabled-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}" translate>widgets.rpc-state.disabled-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.disabled-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
<div class="tb-form-panel">
|
||||
<div class="tb-form-panel-title" translate>widgets.slider.behavior</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.slider.initial-value-hint' | translate}}">{{ 'widgets.slider.initial-value' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.slider.initial-value-hint' | translate}}" translate>widgets.slider.initial-value</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.slider.initial-value"
|
||||
[valueType]="valueType.DOUBLE"
|
||||
@ -30,7 +30,7 @@
|
||||
formControlName="initialState"></tb-get-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row space-between">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.slider.on-value-change-hint' | translate}}">{{ 'widgets.slider.on-value-change' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.slider.on-value-change-hint' | translate}}" translate>widgets.slider.on-value-change</div>
|
||||
<tb-set-value-action-settings fxFlex
|
||||
panelTitle="widgets.slider.on-value-change"
|
||||
[valueType]="valueType.DOUBLE"
|
||||
@ -40,7 +40,7 @@
|
||||
formControlName="valueChange"></tb-set-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}">{{ 'widgets.rpc-state.disabled-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}" translate>widgets.rpc-state.disabled-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.disabled-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
|
||||
@ -203,24 +203,30 @@ export class UnreadNotificationWidgetComponent implements OnInit, OnDestroy {
|
||||
}
|
||||
|
||||
markAsRead(id: string) {
|
||||
if (!this.ctx.isEdit && !this.ctx.isPreview) {
|
||||
const cmd = NotificationSubscriber.createMarkAsReadCommand(this.notificationWsService, [id]);
|
||||
cmd.subscribe();
|
||||
}
|
||||
}
|
||||
|
||||
markAsAllRead($event: Event) {
|
||||
if (!this.ctx.isEdit && !this.ctx.isPreview) {
|
||||
if ($event) {
|
||||
$event.stopPropagation();
|
||||
}
|
||||
const cmd = NotificationSubscriber.createMarkAllAsReadCommand(this.notificationWsService);
|
||||
cmd.subscribe();
|
||||
}
|
||||
}
|
||||
|
||||
viewAll($event: Event) {
|
||||
if (!this.ctx.isEdit && !this.ctx.isPreview) {
|
||||
if ($event) {
|
||||
$event.stopPropagation();
|
||||
}
|
||||
this.router.navigateByUrl(this.router.parseUrl('/notification/inbox')).then(() => {});
|
||||
}
|
||||
}
|
||||
|
||||
trackById(index: number, item: NotificationRequest): string {
|
||||
return item.id.id;
|
||||
|
||||
@ -169,6 +169,6 @@ export class TimeSeriesChartWidgetComponent implements OnInit, OnDestroy, AfterV
|
||||
}
|
||||
|
||||
public toggleLegendKey(legendKey: LegendKey) {
|
||||
this.timeSeriesChart.toggleKey(legendKey.dataKey);
|
||||
this.timeSeriesChart.toggleKey(legendKey.dataKey, legendKey.dataIndex);
|
||||
}
|
||||
}
|
||||
|
||||
@ -56,7 +56,14 @@ import {
|
||||
measureAxisNameSize
|
||||
} from '@home/components/widget/lib/chart/echarts-widget.models';
|
||||
import { DateFormatProcessor, ValueSourceType } from '@shared/models/widget-settings.models';
|
||||
import { formattedDataFormDatasourceData, formatValue, isDefinedAndNotNull, isEqual, mergeDeep } from '@core/utils';
|
||||
import {
|
||||
formattedDataFormDatasourceData,
|
||||
formatValue,
|
||||
isDefined,
|
||||
isDefinedAndNotNull,
|
||||
isEqual,
|
||||
mergeDeep
|
||||
} from '@core/utils';
|
||||
import { DataKey, Datasource, DatasourceType, FormattedData, widgetType } from '@shared/models/widget.models';
|
||||
import * as echarts from 'echarts/core';
|
||||
import { CallbackDataParams, PiecewiseVisualMapOption } from 'echarts/types/dist/shared';
|
||||
@ -300,7 +307,7 @@ export class TbTimeSeriesChart {
|
||||
}
|
||||
}
|
||||
|
||||
public toggleKey(dataKey: DataKey): void {
|
||||
public toggleKey(dataKey: DataKey, dataIndex?: number): void {
|
||||
const enable = dataKey.hidden;
|
||||
const dataItem = this.dataItems.find(d => d.dataKey === dataKey);
|
||||
if (dataItem) {
|
||||
@ -320,6 +327,9 @@ export class TbTimeSeriesChart {
|
||||
this.timeSeriesChart.setOption(this.timeSeriesChartOptions, this.stackMode ? {notMerge: true} : {replaceMerge: mergeList});
|
||||
this.updateAxes();
|
||||
dataKey.hidden = !enable;
|
||||
if (isDefined(dataIndex)) {
|
||||
this.ctx.defaultSubscription.updateDataVisibility(dataIndex);
|
||||
}
|
||||
if (enable) {
|
||||
this.timeSeriesChart.dispatchAction({
|
||||
type: 'highlight',
|
||||
|
||||
@ -57,7 +57,7 @@ import { isDefinedAndNotNull, isUndefinedOrNull } from '@core/utils';
|
||||
import { coerceBoolean } from '@shared/decorators/coercion';
|
||||
import { SharedModule } from '@shared/shared.module';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { TooltipDirective } from '@shared/directives/public-api';
|
||||
import { TruncateTooltipDirective } from '@shared/directives/truncate-tooltip.directive';
|
||||
import { TbDatasource } from '@shared/abstract/public-api';
|
||||
|
||||
@Component({
|
||||
@ -78,7 +78,7 @@ import { TbDatasource } from '@shared/abstract/public-api';
|
||||
}
|
||||
],
|
||||
standalone: true,
|
||||
imports: [CommonModule, SharedModule, TooltipDirective]
|
||||
imports: [CommonModule, SharedModule, TruncateTooltipDirective]
|
||||
})
|
||||
export class MappingTableComponent implements ControlValueAccessor, Validator, AfterViewInit, OnInit, OnDestroy {
|
||||
|
||||
|
||||
@ -36,7 +36,7 @@ import { CommonModule } from '@angular/common';
|
||||
import { SecurityConfigComponent } from '@home/components/widget/lib/gateway/connectors-configuration/public-api';
|
||||
import { Subject } from 'rxjs';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
import { TooltipDirective } from '@shared/directives/public-api';
|
||||
import { TruncateTooltipDirective } from '@shared/directives/truncate-tooltip.directive';
|
||||
|
||||
@Component({
|
||||
selector: 'tb-opc-server-config',
|
||||
@ -60,7 +60,7 @@ import { TooltipDirective } from '@shared/directives/public-api';
|
||||
CommonModule,
|
||||
SharedModule,
|
||||
SecurityConfigComponent,
|
||||
TooltipDirective,
|
||||
TruncateTooltipDirective,
|
||||
]
|
||||
})
|
||||
export class OpcServerConfigComponent implements ControlValueAccessor, Validator, OnDestroy {
|
||||
|
||||
@ -35,7 +35,7 @@ import { CommonModule } from '@angular/common';
|
||||
import { WorkersConfig } from '@home/components/widget/lib/gateway/gateway-widget.models';
|
||||
import { Subject } from 'rxjs';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
import { TooltipDirective } from '@shared/directives/tooltip/tooltip.directive';
|
||||
import { TruncateTooltipDirective } from '@shared/directives/truncate-tooltip.directive';
|
||||
|
||||
@Component({
|
||||
selector: 'tb-workers-config-control',
|
||||
@ -45,7 +45,7 @@ import { TooltipDirective } from '@shared/directives/tooltip/tooltip.directive';
|
||||
imports: [
|
||||
CommonModule,
|
||||
SharedModule,
|
||||
TooltipDirective,
|
||||
TruncateTooltipDirective,
|
||||
],
|
||||
providers: [
|
||||
{
|
||||
|
||||
@ -19,7 +19,7 @@
|
||||
<div class="tb-form-panel">
|
||||
<div class="tb-form-panel-title" translate>widgets.action-button.behavior</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.button-state.activated-state-hint' | translate}}">{{ 'widgets.button-state.activated-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.button-state.activated-state-hint' | translate}}" translate>widgets.button-state.activated-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.button-state.activated-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
@ -30,7 +30,7 @@
|
||||
formControlName="activatedState"></tb-get-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.button-state.disabled-state-hint' | translate}}">{{ 'widgets.button-state.disabled-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.button-state.disabled-state-hint' | translate}}" translate>widgets.button-state.disabled-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.button-state.disabled-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
|
||||
@ -19,7 +19,7 @@
|
||||
<div class="tb-form-panel">
|
||||
<div class="tb-form-panel-title" translate>widgets.command-button.behavior</div>
|
||||
<div class="tb-form-row space-between">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.command-button.on-click-hint' | translate}}">{{ 'widgets.command-button.on-click' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.command-button.on-click-hint' | translate}}" translate>widgets.command-button.on-click</div>
|
||||
<tb-set-value-action-settings fxFlex
|
||||
panelTitle="widgets.command-button.on-click"
|
||||
[aliasController]="aliasController"
|
||||
@ -28,7 +28,7 @@
|
||||
formControlName="onClickState"></tb-set-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.button-state.disabled-state-hint' | translate}}">{{ 'widgets.button-state.disabled-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.button-state.disabled-state-hint' | translate}}" translate>widgets.button-state.disabled-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.button-state.disabled-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
|
||||
@ -19,7 +19,7 @@
|
||||
<div class="tb-form-panel">
|
||||
<div class="tb-form-panel-title" translate>widgets.power-button.behavior</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.initial-state-hint' | translate}}">{{ 'widgets.rpc-state.initial-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.initial-state-hint' | translate}}" translate>widgets.rpc-state.initial-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.initial-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
@ -32,7 +32,7 @@
|
||||
formControlName="initialState"></tb-get-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row space-between">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.power-button.power-on-hint' | translate}}">{{ 'widgets.power-button.power-on' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.power-button.power-on-hint' | translate}}" translate>widgets.power-button.power-on</div>
|
||||
<tb-set-value-action-settings fxFlex
|
||||
panelTitle="widgets.power-button.power-on "
|
||||
[aliasController]="aliasController"
|
||||
@ -41,7 +41,7 @@
|
||||
formControlName="onUpdateState"></tb-set-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row space-between">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.power-button.power-off-hint' | translate}}">{{ 'widgets.power-button.power-off' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.power-button.power-off-hint' | translate}}" translate>widgets.power-button.power-off</div>
|
||||
<tb-set-value-action-settings fxFlex
|
||||
panelTitle="widgets.power-button.power-off"
|
||||
[aliasController]="aliasController"
|
||||
@ -50,7 +50,7 @@
|
||||
formControlName="offUpdateState"></tb-set-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}">{{ 'widgets.rpc-state.disabled-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}" translate>widgets.rpc-state.disabled-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.disabled-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
|
||||
@ -19,7 +19,7 @@
|
||||
<div class="tb-form-panel">
|
||||
<div class="tb-form-panel-title" translate>widgets.toggle-button.behavior</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.initial-state-hint' | translate}}">{{ 'widgets.rpc-state.initial-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.initial-state-hint' | translate}}" translate>widgets.rpc-state.initial-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.initial-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
@ -32,7 +32,7 @@
|
||||
formControlName="initialState"></tb-get-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row space-between">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.toggle-button.check-hint' | translate}}">{{ 'widgets.toggle-button.check' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.toggle-button.check-hint' | translate}}" translate>widgets.toggle-button.check</div>
|
||||
<tb-set-value-action-settings fxFlex
|
||||
panelTitle="widgets.toggle-button.check"
|
||||
[aliasController]="aliasController"
|
||||
@ -41,7 +41,7 @@
|
||||
formControlName="checkState"></tb-set-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row space-between">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.toggle-button.uncheck-hint' | translate}}">{{ 'widgets.toggle-button.uncheck' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.toggle-button.uncheck-hint' | translate}}" translate>widgets.toggle-button.uncheck</div>
|
||||
<tb-set-value-action-settings fxFlex
|
||||
panelTitle="widgets.toggle-button.uncheck"
|
||||
[aliasController]="aliasController"
|
||||
@ -50,7 +50,7 @@
|
||||
formControlName="uncheckState"></tb-set-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}">{{ 'widgets.rpc-state.disabled-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}" translate>widgets.rpc-state.disabled-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.disabled-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
|
||||
@ -79,7 +79,7 @@
|
||||
</div>
|
||||
<tb-chart-fill-settings
|
||||
formControlName="barBackgroundSettings"
|
||||
title="widgets.chart.background"
|
||||
titleText="widgets.chart.background"
|
||||
fillNoneTitle="widgets.chart.fill-type-solid">
|
||||
</tb-chart-fill-settings>
|
||||
<tb-time-series-no-aggregation-bar-width-settings
|
||||
|
||||
@ -31,7 +31,7 @@
|
||||
<ng-container [ngSwitch]="getValueSettingsFormGroup.get('action').value">
|
||||
<ng-template [ngSwitchCase]="getValueAction.DO_NOTHING">
|
||||
<div class="tb-form-row space-between">
|
||||
<div tb-hint-tooltip-icon="{{'widgets.value-action.init-value-hint' | translate}}">{{ 'widgets.value-action.value' | translate }}</div>
|
||||
<div tb-hint-tooltip-icon="{{'widgets.value-action.init-value-hint' | translate}}" translate>widgets.value-action.value</div>
|
||||
<tb-value-input [valueType]="valueType"
|
||||
[trueLabel]="trueLabel"
|
||||
[falseLabel]="falseLabel"
|
||||
|
||||
@ -77,7 +77,7 @@
|
||||
</div>
|
||||
<tb-chart-fill-settings
|
||||
formControlName="backgroundSettings"
|
||||
title="widgets.chart.background"
|
||||
titleText="widgets.chart.background"
|
||||
fillNoneTitle="widgets.chart.fill-type-solid">
|
||||
</tb-chart-fill-settings>
|
||||
</ng-container>
|
||||
|
||||
@ -18,7 +18,7 @@
|
||||
<ng-container [formGroup]="fillSettingsFormGroup">
|
||||
<div class="tb-form-row column">
|
||||
<div class="tb-form-row no-border no-padding space-between">
|
||||
<div>{{ title | translate }}</div>
|
||||
<div>{{ titleText | translate }}</div>
|
||||
<tb-toggle-select formControlName="type">
|
||||
<tb-toggle-option *ngFor="let type of chartFillTypes" [value]="type">{{ chartFillTypeTranslationMap.get(type) | translate }}</tb-toggle-option>
|
||||
</tb-toggle-select>
|
||||
|
||||
@ -55,7 +55,7 @@ export class ChartFillSettingsComponent implements OnInit, ControlValueAccessor
|
||||
disabled: boolean;
|
||||
|
||||
@Input()
|
||||
title = 'widgets.chart.fill';
|
||||
titleText = 'widgets.chart.fill';
|
||||
|
||||
@Input()
|
||||
fillNoneTitle = 'widgets.chart.fill-type-none';
|
||||
|
||||
@ -62,14 +62,14 @@
|
||||
[fxLayoutAlign.lt-md]="layout !== StatusWidgetLayout.icon ? 'space-between center': 'start center'"
|
||||
style="gap: 12px;">
|
||||
<div fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px">
|
||||
<div tb-hint-tooltip-icon="{{'widgets.status-widget.primary-color-hint' | translate}}">{{ 'widgets.status-widget.primary' | translate }}</div>
|
||||
<div tb-hint-tooltip-icon="{{'widgets.status-widget.primary-color-hint' | translate}}" translate>widgets.status-widget.primary</div>
|
||||
<tb-color-input asBoxInput
|
||||
formControlName="primaryColor">
|
||||
</tb-color-input>
|
||||
</div>
|
||||
<mat-divider *ngIf="layout !== StatusWidgetLayout.icon" vertical fxHide.lt-md></mat-divider>
|
||||
<div *ngIf="layout !== StatusWidgetLayout.icon" fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px">
|
||||
<div tb-hint-tooltip-icon="{{'widgets.status-widget.secondary-color-hint' | translate}}">{{ 'widgets.status-widget.secondary' | translate }}</div>
|
||||
<div tb-hint-tooltip-icon="{{'widgets.status-widget.secondary-color-hint' | translate}}" translate>widgets.status-widget.secondary</div>
|
||||
<tb-color-input asBoxInput
|
||||
formControlName="secondaryColor">
|
||||
</tb-color-input>
|
||||
@ -88,14 +88,14 @@
|
||||
[fxLayoutAlign.lt-md]="layout !== StatusWidgetLayout.icon ? 'space-between center': 'start center'"
|
||||
style="gap: 12px;">
|
||||
<div fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px">
|
||||
<div tb-hint-tooltip-icon="{{'widgets.status-widget.primary-color-hint' | translate}}">{{ 'widgets.status-widget.primary' | translate }}</div>
|
||||
<div tb-hint-tooltip-icon="{{'widgets.status-widget.primary-color-hint' | translate}}" translate>widgets.status-widget.primary</div>
|
||||
<tb-color-input asBoxInput
|
||||
formControlName="primaryColorDisabled">
|
||||
</tb-color-input>
|
||||
</div>
|
||||
<mat-divider *ngIf="layout !== StatusWidgetLayout.icon" vertical fxHide.lt-md></mat-divider>
|
||||
<div *ngIf="layout !== StatusWidgetLayout.icon" fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px">
|
||||
<div tb-hint-tooltip-icon="{{'widgets.status-widget.secondary-color-hint' | translate}}">{{ 'widgets.status-widget.secondary' | translate }}</div>
|
||||
<div tb-hint-tooltip-icon="{{'widgets.status-widget.secondary-color-hint' | translate}}" translate>widgets.status-widget.secondary</div>
|
||||
<tb-color-input asBoxInput
|
||||
formControlName="secondaryColorDisabled">
|
||||
</tb-color-input>
|
||||
|
||||
@ -19,7 +19,7 @@
|
||||
<div class="tb-form-panel">
|
||||
<div class="tb-form-panel-title" translate>widgets.single-switch.behavior</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.initial-state-hint' | translate}}">{{ 'widgets.rpc-state.initial-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.initial-state-hint' | translate}}" translate>widgets.rpc-state.initial-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.initial-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
@ -32,7 +32,7 @@
|
||||
formControlName="initialState"></tb-get-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row space-between">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.turn-on-hint' | translate}}">{{ 'widgets.rpc-state.turn-on' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.turn-on-hint' | translate}}" translate>widgets.rpc-state.turn-on</div>
|
||||
<tb-set-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.turn-on"
|
||||
[aliasController]="aliasController"
|
||||
@ -41,7 +41,7 @@
|
||||
formControlName="onUpdateState"></tb-set-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row space-between">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.turn-off-hint' | translate}}">{{ 'widgets.rpc-state.turn-off' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.turn-off-hint' | translate}}" translate>widgets.rpc-state.turn-off</div>
|
||||
<tb-set-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.turn-off"
|
||||
[aliasController]="aliasController"
|
||||
@ -50,7 +50,7 @@
|
||||
formControlName="offUpdateState"></tb-set-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}">{{ 'widgets.rpc-state.disabled-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}" translate>widgets.rpc-state.disabled-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.disabled-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
|
||||
@ -19,7 +19,7 @@
|
||||
<div class="tb-form-panel">
|
||||
<div class="tb-form-panel-title" translate>widgets.slider.behavior</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.slider.initial-value-hint' | translate}}">{{ 'widgets.slider.initial-value' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.slider.initial-value-hint' | translate}}" translate>widgets.slider.initial-value</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.slider.initial-value"
|
||||
[valueType]="valueType.DOUBLE"
|
||||
@ -29,7 +29,7 @@
|
||||
formControlName="initialState"></tb-get-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row space-between">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.slider.on-value-change-hint' | translate}}">{{ 'widgets.slider.on-value-change' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.slider.on-value-change-hint' | translate}}" translate>widgets.slider.on-value-change</div>
|
||||
<tb-set-value-action-settings fxFlex
|
||||
panelTitle="widgets.slider.on-value-change"
|
||||
[valueType]="valueType.DOUBLE"
|
||||
@ -39,7 +39,7 @@
|
||||
formControlName="valueChange"></tb-set-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}">{{ 'widgets.rpc-state.disabled-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}" translate>widgets.rpc-state.disabled-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.disabled-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
|
||||
@ -19,7 +19,7 @@
|
||||
<div class="tb-form-panel">
|
||||
<div class="tb-form-panel-title" translate>widgets.status-widget.behavior</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.initial-state-hint' | translate}}">{{ 'widgets.rpc-state.initial-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.initial-state-hint' | translate}}" translate>widgets.rpc-state.initial-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.initial-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
@ -32,7 +32,7 @@
|
||||
formControlName="initialState"></tb-get-value-action-settings>
|
||||
</div>
|
||||
<div class="tb-form-row">
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}">{{ 'widgets.rpc-state.disabled-state' | translate }}</div>
|
||||
<div class="fixed-title-width" tb-hint-tooltip-icon="{{'widgets.rpc-state.disabled-state-hint' | translate}}" translate>widgets.rpc-state.disabled-state</div>
|
||||
<tb-get-value-action-settings fxFlex
|
||||
panelTitle="widgets.rpc-state.disabled-state"
|
||||
[valueType]="valueType.BOOLEAN"
|
||||
|
||||
@ -267,13 +267,13 @@
|
||||
<div *ngIf="displayAppearanceDataSettings" class="tb-form-panel" [formGroup]="widgetSettings">
|
||||
<div class="tb-form-panel-title" translate>widget-config.data-settings</div>
|
||||
<div *ngIf="displayUnitsConfig" class="tb-form-row space-between">
|
||||
<div tb-hint-tooltip-icon="{{'widget-config.default-data-key-parameter-hint' | translate}}">{{ 'widget-config.units-by-default' | translate }}</div>
|
||||
<div tb-hint-tooltip-icon="{{'widget-config.default-data-key-parameter-hint' | translate}}" translate>widget-config.units-by-default</div>
|
||||
<tb-unit-input
|
||||
formControlName="units">
|
||||
</tb-unit-input>
|
||||
</div>
|
||||
<div *ngIf="displayUnitsConfig" class="tb-form-row space-between">
|
||||
<div tb-hint-tooltip-icon="{{'widget-config.default-data-key-parameter-hint' | translate}}">{{ 'widget-config.decimals-by-default' | translate }}</div>
|
||||
<div tb-hint-tooltip-icon="{{'widget-config.default-data-key-parameter-hint' | translate}}" translate>widget-config.decimals-by-default</div>
|
||||
<mat-form-field appearance="outline" class="number" subscriptSizing="dynamic">
|
||||
<input matInput formControlName="decimals" type="number" min="0" max="15" step="1" placeholder="{{ 'widget-config.set' | translate }}">
|
||||
</mat-form-field>
|
||||
|
||||
@ -487,6 +487,7 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI
|
||||
}
|
||||
if (!this.widgetContext.inited && this.isReady()) {
|
||||
this.widgetContext.inited = true;
|
||||
this.widgetContext.destroyed = false;
|
||||
this.dashboardWidget.updateWidgetParams();
|
||||
this.widgetContext.detectContainerChanges();
|
||||
if (this.cafs.init) {
|
||||
|
||||
@ -449,6 +449,8 @@ export class WidgetContext {
|
||||
labelPattern.destroy();
|
||||
}
|
||||
this.labelPatterns.clear();
|
||||
this.width = undefined;
|
||||
this.height = undefined;
|
||||
this.destroyed = true;
|
||||
}
|
||||
|
||||
|
||||
@ -25,11 +25,17 @@ import {
|
||||
SimpleChanges,
|
||||
ViewChild
|
||||
} from '@angular/core';
|
||||
import { ControlValueAccessor, UntypedFormBuilder, UntypedFormGroup, NG_VALUE_ACCESSOR, Validators } from '@angular/forms';
|
||||
import {
|
||||
ControlValueAccessor,
|
||||
NG_VALIDATORS,
|
||||
NG_VALUE_ACCESSOR,
|
||||
UntypedFormBuilder,
|
||||
UntypedFormGroup,
|
||||
ValidationErrors,
|
||||
Validators
|
||||
} from '@angular/forms';
|
||||
import { Observable } from 'rxjs';
|
||||
import { filter, map, mergeMap, share, tap } from 'rxjs/operators';
|
||||
import { Store } from '@ngrx/store';
|
||||
import { AppState } from '@app/core/core.state';
|
||||
import { TranslateService } from '@ngx-translate/core';
|
||||
import { EntityType } from '@shared/models/entity-type.models';
|
||||
import { BaseData } from '@shared/models/base-data';
|
||||
@ -49,6 +55,11 @@ import { SubscriptSizing } from '@angular/material/form-field';
|
||||
provide: NG_VALUE_ACCESSOR,
|
||||
useExisting: forwardRef(() => EntityListComponent),
|
||||
multi: true
|
||||
},
|
||||
{
|
||||
provide: NG_VALIDATORS,
|
||||
useExisting: forwardRef(() => EntityListComponent),
|
||||
multi: true
|
||||
}
|
||||
]
|
||||
})
|
||||
@ -56,7 +67,7 @@ export class EntityListComponent implements ControlValueAccessor, OnInit, AfterV
|
||||
|
||||
entityListFormGroup: UntypedFormGroup;
|
||||
|
||||
modelValue: Array<string> | null;
|
||||
private modelValue: Array<string> | null;
|
||||
|
||||
@Input()
|
||||
entityType: EntityType;
|
||||
@ -108,17 +119,16 @@ export class EntityListComponent implements ControlValueAccessor, OnInit, AfterV
|
||||
|
||||
private propagateChange = (v: any) => { };
|
||||
|
||||
constructor(private store: Store<AppState>,
|
||||
public translate: TranslateService,
|
||||
constructor(public translate: TranslateService,
|
||||
private entityService: EntityService,
|
||||
private fb: UntypedFormBuilder) {
|
||||
this.entityListFormGroup = this.fb.group({
|
||||
entities: [this.entities, this.required ? [Validators.required] : []],
|
||||
entities: [this.entities],
|
||||
entity: [null]
|
||||
});
|
||||
}
|
||||
|
||||
updateValidators() {
|
||||
private updateValidators() {
|
||||
this.entityListFormGroup.get('entities').setValidators(this.required ? [Validators.required] : []);
|
||||
this.entityListFormGroup.get('entities').updateValueAndValidity();
|
||||
}
|
||||
@ -189,7 +199,13 @@ export class EntityListComponent implements ControlValueAccessor, OnInit, AfterV
|
||||
this.dirty = true;
|
||||
}
|
||||
|
||||
reset() {
|
||||
validate(): ValidationErrors | null {
|
||||
return this.entityListFormGroup.valid ? null : {
|
||||
entities: {valid: false}
|
||||
};
|
||||
}
|
||||
|
||||
private reset() {
|
||||
this.entities = [];
|
||||
this.entityListFormGroup.get('entities').setValue(this.entities);
|
||||
this.modelValue = null;
|
||||
@ -201,7 +217,7 @@ export class EntityListComponent implements ControlValueAccessor, OnInit, AfterV
|
||||
this.dirty = true;
|
||||
}
|
||||
|
||||
add(entity: BaseData<EntityId>): void {
|
||||
private add(entity: BaseData<EntityId>): void {
|
||||
if (!this.modelValue || this.modelValue.indexOf(entity.id.id) === -1) {
|
||||
if (!this.modelValue) {
|
||||
this.modelValue = [];
|
||||
@ -214,7 +230,7 @@ export class EntityListComponent implements ControlValueAccessor, OnInit, AfterV
|
||||
this.clear();
|
||||
}
|
||||
|
||||
remove(entity: BaseData<EntityId>) {
|
||||
public remove(entity: BaseData<EntityId>) {
|
||||
let index = this.entities.indexOf(entity);
|
||||
if (index >= 0) {
|
||||
this.entities.splice(index, 1);
|
||||
@ -229,11 +245,11 @@ export class EntityListComponent implements ControlValueAccessor, OnInit, AfterV
|
||||
}
|
||||
}
|
||||
|
||||
displayEntityFn(entity?: BaseData<EntityId>): string | undefined {
|
||||
public displayEntityFn(entity?: BaseData<EntityId>): string | undefined {
|
||||
return entity ? entity.name : undefined;
|
||||
}
|
||||
|
||||
fetchEntities(searchText?: string): Observable<Array<BaseData<EntityId>>> {
|
||||
private fetchEntities(searchText?: string): Observable<Array<BaseData<EntityId>>> {
|
||||
this.searchText = searchText;
|
||||
|
||||
return this.entityService.getEntitiesByNameFilter(this.entityType, searchText,
|
||||
@ -241,14 +257,14 @@ export class EntityListComponent implements ControlValueAccessor, OnInit, AfterV
|
||||
map((data) => data ? data : []));
|
||||
}
|
||||
|
||||
onFocus() {
|
||||
public onFocus() {
|
||||
if (this.dirty) {
|
||||
this.entityListFormGroup.get('entity').updateValueAndValidity({onlySelf: true, emitEvent: true});
|
||||
this.dirty = false;
|
||||
}
|
||||
}
|
||||
|
||||
clear(value: string = '') {
|
||||
private clear(value: string = '') {
|
||||
this.entityInput.nativeElement.value = value;
|
||||
this.entityListFormGroup.get('entity').patchValue(value, {emitEvent: true});
|
||||
setTimeout(() => {
|
||||
@ -257,8 +273,7 @@ export class EntityListComponent implements ControlValueAccessor, OnInit, AfterV
|
||||
}, 0);
|
||||
}
|
||||
|
||||
textIsNotEmpty(text: string): boolean {
|
||||
public textIsNotEmpty(text: string): boolean {
|
||||
return (text && text.length > 0);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@ -1,18 +0,0 @@
|
||||
///
|
||||
/// Copyright © 2016-2024 The Thingsboard Authors
|
||||
///
|
||||
/// Licensed under the Apache License, Version 2.0 (the "License");
|
||||
/// you may not use this file except in compliance with the License.
|
||||
/// You may obtain a copy of the License at
|
||||
///
|
||||
/// http://www.apache.org/licenses/LICENSE-2.0
|
||||
///
|
||||
/// Unless required by applicable law or agreed to in writing, software
|
||||
/// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
/// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
/// See the License for the specific language governing permissions and
|
||||
/// limitations under the License.
|
||||
///
|
||||
|
||||
export * from './tooltip/tooltip.directive';
|
||||
export * from './ellipsis-chip-list/ellipsis-chip-list.directive';
|
||||
@ -33,7 +33,7 @@ import { MatTooltip, TooltipPosition } from '@angular/material/tooltip';
|
||||
providers: [MatTooltip],
|
||||
|
||||
})
|
||||
export class TooltipDirective implements OnInit, AfterViewInit, OnDestroy {
|
||||
export class TruncateTooltipDirective implements OnInit, AfterViewInit, OnDestroy {
|
||||
@Input('tbTruncateTooltip') text: string;
|
||||
@Input() tooltipEnabled = true;
|
||||
@Input() position: TooltipPosition = 'above';
|
||||
Loading…
x
Reference in New Issue
Block a user