From d3fa7d912493ac7bba2dd167a2805a61d860067c Mon Sep 17 00:00:00 2001 From: mpetrov Date: Tue, 9 Jul 2024 14:43:25 +0300 Subject: [PATCH 01/51] OPC-UA UI fixes --- .../action-button-basic-config.component.html | 6 +- ...command-button-basic-config.component.html | 4 +- .../power-button-basic-config.component.html | 8 +- .../toggle-button-basic-config.component.html | 8 +- .../status-widget-basic-config.component.html | 4 +- .../single-switch-basic-config.component.html | 8 +- .../rpc/slider-basic-config.component.html | 6 +- .../mapping-data-keys-panel.component.html | 12 +- .../mapping-table.component.html | 6 +- .../mapping-table/mapping-table.component.ts | 3 +- .../server-config.component.html | 16 +-- .../server-config.component.scss | 8 -- .../workers-config-control.component.html | 8 +- .../dialog/mapping-dialog.component.html | 34 +++--- .../dialog/mapping-dialog.component.scss | 1 + .../dialog/mapping-dialog.component.ts | 7 +- .../lib/gateway/gateway-widget.models.ts | 8 ++ ...tion-button-widget-settings.component.html | 4 +- ...mand-button-widget-settings.component.html | 4 +- ...ower-button-widget-settings.component.html | 8 +- ...ggle-button-widget-settings.component.html | 8 +- ...value-action-settings-panel.component.html | 2 +- ...tatus-widget-state-settings.component.html | 8 +- ...ngle-switch-widget-settings.component.html | 8 +- .../slider-widget-settings.component.html | 6 +- .../status-widget-settings.component.html | 4 +- .../widget/widget-config.component.html | 4 +- .../hint-tooltip-icon.component.html | 14 ++- .../hint-tooltip-icon.component.scss | 34 +++--- .../src/app/shared/directives/public-api.ts | 17 +++ .../directives/tooltip/tooltip.directive.ts | 108 ++++++++++++++++++ ui-ngx/src/app/shared/shared.module.ts | 2 + 32 files changed, 259 insertions(+), 119 deletions(-) create mode 100644 ui-ngx/src/app/shared/directives/public-api.ts create mode 100644 ui-ngx/src/app/shared/directives/tooltip/tooltip.directive.ts diff --git a/ui-ngx/src/app/modules/home/components/widget/config/basic/button/action-button-basic-config.component.html b/ui-ngx/src/app/modules/home/components/widget/config/basic/button/action-button-basic-config.component.html index 6940cffc1f..a3030dec79 100644 --- a/ui-ngx/src/app/modules/home/components/widget/config/basic/button/action-button-basic-config.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/config/basic/button/action-button-basic-config.component.html @@ -27,7 +27,7 @@
widgets.action-button.behavior
-
widgets.action-button.on-click
+
{{ 'widgets.action-button.on-click' | translate}}
-
widgets.button-state.activated-state
+
{{ 'widgets.button-state.activated-state' | translate }}
-
widgets.button-state.disabled-state
+
{{ 'widgets.button-state.disabled-state' | translate }}
widgets.command-button.behavior
-
widgets.command-button.on-click
+
{{ 'widgets.command-button.on-click' | translate }}
-
widgets.button-state.disabled-state
+
{{ 'widgets.button-state.disabled-state' | translate }}
widgets.power-button.behavior
-
widgets.rpc-state.initial-state
+
{{ 'widgets.rpc-state.initial-state' | translate }}
-
widgets.power-button.power-on
+
{{ 'widgets.power-button.power-on' | translate }}
-
widgets.power-button.power-off
+
{{ 'widgets.power-button.power-off' | translate }}
-
widgets.rpc-state.disabled-state
+
{{ 'widgets.rpc-state.disabled-state' | translate }}
widgets.toggle-button.behavior
-
widgets.rpc-state.initial-state
+
{{ 'widgets.rpc-state.initial-state' | translate }}
-
widgets.toggle-button.check
+
{{ 'widgets.toggle-button.check' | translate }}
-
widgets.toggle-button.uncheck
+
{{ 'widgets.toggle-button.uncheck' | translate }}
-
widgets.rpc-state.disabled-state
+
{{ 'widgets.rpc-state.disabled-state' | translate }}
widgets.status-widget.behavior
-
widgets.rpc-state.initial-state
+
{{ 'widgets.rpc-state.initial-state' | translate }}
-
widgets.rpc-state.disabled-state
+
{{ 'widgets.rpc-state.disabled-state' | translate }}
widgets.single-switch.behavior
-
widgets.rpc-state.initial-state
+
{{ 'widgets.rpc-state.initial-state' | translate }}
-
widgets.rpc-state.turn-on
+
{{ 'widgets.rpc-state.turn-on' | translate }}
-
widgets.rpc-state.turn-off
+
{{ 'widgets.rpc-state.turn-off' | translate }}
-
widgets.rpc-state.disabled-state
+
{{ 'widgets.rpc-state.disabled-state' | translate }}
widgets.slider.behavior
-
widgets.slider.initial-value
+
{{ 'widgets.slider.initial-value' | translate }}
-
widgets.slider.on-value-change
+
{{ 'widgets.slider.on-value-change' | translate }}
-
widgets.rpc-state.disabled-state
+
{{ 'widgets.rpc-state.disabled-state' | translate }}
gateway.platform-side
- gateway.key + tb-hint-tooltip-icon="{{ 'gateway.JSONPath-hint' | translate }}"> + {{ 'gateway.key' | translate }}
@@ -97,8 +97,8 @@
- gateway.value + tb-hint-tooltip-icon="{{ 'gateway.JSONPath-hint' | translate }}"> + {{ 'gateway.value' | translate }}
-
- gateway.method-name +
+ {{ 'gateway.method-name' | translate }}
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.html index 48e280bc67..7ebfb700bf 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.html @@ -61,11 +61,11 @@ + [class.request-column]="mappingType === mappingTypeEnum.REQUESTS"> {{ column.title | translate }} - + {{ mapping[column.def] }} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts index 7042e5ae38..3e4ce09031 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts @@ -58,6 +58,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'; @Component({ selector: 'tb-mapping-table', @@ -77,7 +78,7 @@ import { CommonModule } from '@angular/common'; } ], standalone: true, - imports: [CommonModule, SharedModule] + imports: [CommonModule, SharedModule, TooltipDirective] }) export class MappingTableComponent implements ControlValueAccessor, Validator, AfterViewInit, OnInit, OnDestroy { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.html index 43b15de06c..5182fb108e 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.html @@ -18,7 +18,7 @@
-
gateway.server-url
+
gateway.server-url
@@ -35,8 +35,8 @@
-
- gateway.timeout +
+ {{ 'gateway.timeout' | translate }}
@@ -55,7 +55,7 @@
-
gateway.security
+
gateway.security
@@ -65,8 +65,8 @@
-
- gateway.scan-period +
+ {{ 'gateway.scan-period' | translate }}
@@ -86,8 +86,8 @@
-
- gateway.sub-check-period +
+ {{ 'gateway.sub-check-period' | translate }}
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.scss index 64e886ffef..416f368279 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.scss +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.scss @@ -17,12 +17,4 @@ width: 100%; height: 100%; display: block; - - .server-conf-field-title { - min-width: 250px; - width: 30%; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - } } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.html index 37f7b1422e..0062e476c2 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.html @@ -18,8 +18,8 @@
- gateway.max-number-of-workers + tb-hint-tooltip-icon="{{ 'gateway.max-number-of-workers-hint' | translate }}"> + {{ 'gateway.max-number-of-workers' | translate }}
@@ -40,8 +40,8 @@
- gateway.max-messages-queue-for-worker + tb-hint-tooltip-icon="{{ 'gateway.max-messages-queue-for-worker-hint' | translate }}"> + {{ 'gateway.max-messages-queue-for-worker' | translate }}
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.html index 35ac90f671..17c002115c 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.html @@ -19,7 +19,7 @@

{{ MappingTypeTranslationsMap.get(this.data?.mappingType) | translate}}

-
+
-
- gateway.mqtt-qos +
+ {{ 'gateway.mqtt-qos' | translate }}
@@ -140,8 +140,8 @@
- gateway.extension + tb-hint-tooltip-icon="{{ 'gateway.extension-hint' | translate }}"> + {{ 'gateway.extension' | translate }}
@@ -369,8 +369,8 @@
- gateway.device-name-filter + tb-hint-tooltip-icon="{{ 'gateway.device-name-filter-hint' | translate }}"> + {{ 'gateway.device-name-filter' | translate }}
@@ -388,8 +388,8 @@
-
- gateway.attribute-filter +
+ {{ 'gateway.attribute-filter' | translate }}
@@ -472,8 +472,8 @@
-
- gateway.device-name-filter +
+ {{ 'gateway.device-name-filter' | translate }}
@@ -491,8 +491,8 @@
-
- gateway.method-filter +
+ {{ 'gateway.method-filter' | translate }}
@@ -580,8 +580,8 @@
-
- gateway.response-topic-Qos +
+ {{ 'gateway.response-topic-Qos' | translate }}
@@ -618,8 +618,8 @@
-
- gateway.device-node +
+ {{ 'gateway.device-node' | translate }}
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.scss index 190422eeb0..4212e8f834 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.scss +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.scss @@ -47,6 +47,7 @@ .mdc-evolution-chip-set__chips { justify-content: flex-end; align-items: center; + flex-wrap: nowrap; } } } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.ts index 3812fa161e..0e177df527 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.ts @@ -28,6 +28,7 @@ import { ConvertorTypeTranslationsMap, DataConversionTranslationsMap, DeviceInfoType, + HelpLinkByMappingTypeMap, MappingHintTranslationsMap, MappingInfo, MappingKeysAddKeyTranslationsMap, @@ -97,6 +98,8 @@ export class MappingDialogComponent extends DialogComponent(); @@ -187,10 +190,6 @@ export class MappingDialogComponent extends DialogComponent( ] ); +export const HelpLinkByMappingTypeMap = new Map( + [ + [MappingType.DATA, 'https://thingsboard.io/docs/iot-gateway/config/mqtt/#section-mapping'], + [MappingType.OPCUA, 'https://thingsboard.io/docs/iot-gateway/config/opc-ua/#section-mapping'], + [MappingType.REQUESTS, 'https://thingsboard.io/docs/iot-gateway/config/mqtt/#section-mapping'] + ] +); + export const QualityTypes = [0, 1 ,2]; export const QualityTypeTranslationsMap = new Map( diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/button/action-button-widget-settings.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/settings/button/action-button-widget-settings.component.html index 265a9c2501..a8cdf55efc 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/button/action-button-widget-settings.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/button/action-button-widget-settings.component.html @@ -19,7 +19,7 @@
widgets.action-button.behavior
-
widgets.button-state.activated-state
+
{{ 'widgets.button-state.activated-state' | translate }}
-
widgets.button-state.disabled-state
+
{{ 'widgets.button-state.disabled-state' | translate }}
widgets.command-button.behavior
-
widgets.command-button.on-click
+
{{ 'widgets.command-button.on-click' | translate }}
-
widgets.button-state.disabled-state
+
{{ 'widgets.button-state.disabled-state' | translate }}
widgets.power-button.behavior
-
widgets.rpc-state.initial-state
+
{{ 'widgets.rpc-state.initial-state' | translate }}
-
widgets.power-button.power-on
+
{{ 'widgets.power-button.power-on' | translate }}
-
widgets.power-button.power-off
+
{{ 'widgets.power-button.power-off' | translate }}
-
widgets.rpc-state.disabled-state
+
{{ 'widgets.rpc-state.disabled-state' | translate }}
widgets.toggle-button.behavior
-
widgets.rpc-state.initial-state
+
{{ 'widgets.rpc-state.initial-state' | translate }}
-
widgets.toggle-button.check
+
{{ 'widgets.toggle-button.check' | translate }}
-
widgets.toggle-button.uncheck
+
{{ 'widgets.toggle-button.uncheck' | translate }}
-
widgets.rpc-state.disabled-state
+
{{ 'widgets.rpc-state.disabled-state' | translate }}
-
widgets.value-action.value
+
{{ 'widgets.value-action.value' | translate }}
-
widgets.status-widget.primary
+
{{ 'widgets.status-widget.primary' | translate }}
-
widgets.status-widget.secondary
+
{{ 'widgets.status-widget.secondary' | translate }}
@@ -88,14 +88,14 @@ [fxLayoutAlign.lt-md]="layout !== StatusWidgetLayout.icon ? 'space-between center': 'start center'" style="gap: 12px;">
-
widgets.status-widget.primary
+
{{ 'widgets.status-widget.primary' | translate }}
-
widgets.status-widget.secondary
+
{{ 'widgets.status-widget.secondary' | translate }}
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/single-switch-widget-settings.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/single-switch-widget-settings.component.html index 9208efd68a..d5b732b6bb 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/single-switch-widget-settings.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/single-switch-widget-settings.component.html @@ -19,7 +19,7 @@
widgets.single-switch.behavior
-
widgets.rpc-state.initial-state
+
{{ 'widgets.rpc-state.initial-state' | translate }}
-
widgets.rpc-state.turn-on
+
{{ 'widgets.rpc-state.turn-on' | translate }}
-
widgets.rpc-state.turn-off
+
{{ 'widgets.rpc-state.turn-off' | translate }}
-
widgets.rpc-state.disabled-state
+
{{ 'widgets.rpc-state.disabled-state' | translate }}
widgets.slider.behavior
-
widgets.slider.initial-value
+
{{ 'widgets.slider.initial-value' | translate }}
-
widgets.slider.on-value-change
+
{{ 'widgets.slider.on-value-change' | translate }}
-
widgets.rpc-state.disabled-state
+
{{ 'widgets.rpc-state.disabled-state' | translate }}
widgets.status-widget.behavior
-
widgets.rpc-state.initial-state
+
{{ 'widgets.rpc-state.initial-state' | translate }}
-
widgets.rpc-state.disabled-state
+
{{ 'widgets.rpc-state.disabled-state' | translate }}
widget-config.data-settings
-
widget-config.units-by-default
+
{{ 'widget-config.units-by-default' | translate }}
-
widget-config.decimals-by-default
+
{{ 'widget-config.decimals-by-default' | translate }}
diff --git a/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.html b/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.html index 32b66fd2b7..20593f042b 100644 --- a/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.html +++ b/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.html @@ -15,8 +15,12 @@ limitations under the License. --> - -{{ hintIcon }} +
+
+ +
+ {{ hintIcon }} +
diff --git a/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.scss b/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.scss index 7ed9925300..fb428e9fc3 100644 --- a/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.scss +++ b/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.scss @@ -13,21 +13,29 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -:host(.tb-hint-tooltip) { - display: flex; - flex-direction: row; - align-items: center; - gap: 4px; -} :host { - .tb-hint-tooltip-icon { - color: #E0E0E0; - overflow: visible; - order: 3; - margin-left: 4px; - &:hover { - color: #9E9E9E; + .tb-hint-tooltip { + display: flex; + flex-direction: row; + align-items: center; + gap: 4px; + + &-content { + flex: 1 1 auto; + min-width: 0; + } + + &-icon { + color: #E0E0E0; + overflow: visible; + order: 3; + margin-left: 4px; + flex-shrink: 0; + + &:hover { + color: #9E9E9E; + } } } } diff --git a/ui-ngx/src/app/shared/directives/public-api.ts b/ui-ngx/src/app/shared/directives/public-api.ts new file mode 100644 index 0000000000..a82428fc19 --- /dev/null +++ b/ui-ngx/src/app/shared/directives/public-api.ts @@ -0,0 +1,17 @@ +/// +/// 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'; diff --git a/ui-ngx/src/app/shared/directives/tooltip/tooltip.directive.ts b/ui-ngx/src/app/shared/directives/tooltip/tooltip.directive.ts new file mode 100644 index 0000000000..4d26c1388c --- /dev/null +++ b/ui-ngx/src/app/shared/directives/tooltip/tooltip.directive.ts @@ -0,0 +1,108 @@ +/// +/// 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. +/// + +import { + AfterViewInit, + Directive, + ElementRef, + inject, + Input, + OnDestroy, + OnInit, + Renderer2, +} from '@angular/core'; +import { fromEvent, Subject } from 'rxjs'; +import { filter, takeUntil, tap } from 'rxjs/operators'; +import { MatTooltip, TooltipPosition } from '@angular/material/tooltip'; + +@Directive({ + standalone: true, + selector: '[tbTruncateTooltip]', + providers: [MatTooltip], + +}) +export class TooltipDirective implements OnInit, AfterViewInit, OnDestroy { + @Input('tbTruncateTooltip') text: string; + @Input() tooltipEnabled = true; + @Input() position: TooltipPosition = 'above'; + + private elementRef = inject(ElementRef); + private renderer = inject(Renderer2); + private tooltip = inject(MatTooltip); + private destroy$ = new Subject(); + + ngOnInit(): void { + this.observeMouseEvents(); + } + + ngAfterViewInit(): void { + this.applyTruncationStyles(); + + if (!this.text) { + this.text = this.elementRef.nativeElement.innerText; + } + + this.tooltip.position = this.position; + } + + ngOnDestroy(): void { + if (this.tooltip._isTooltipVisible()) { + this.hideTooltip(); + } + this.destroy$.next(); + this.destroy$.complete(); + } + + private observeMouseEvents(): void { + fromEvent(this.elementRef.nativeElement, 'mouseenter') + .pipe( + filter(() => this.tooltipEnabled), + filter(() => this.isOverflown(this.elementRef.nativeElement)), + tap(() => this.showTooltip()), + takeUntil(this.destroy$), + ) + .subscribe(); + fromEvent(this.elementRef.nativeElement, 'mouseleave') + .pipe( + filter(() => this.tooltipEnabled), + filter(() => this.tooltip._isTooltipVisible()), + tap(() => this.hideTooltip()), + takeUntil(this.destroy$), + ) + .subscribe(); + } + + private applyTruncationStyles(): void { + this.renderer.setStyle(this.elementRef.nativeElement, 'white-space', 'nowrap'); + this.renderer.setStyle(this.elementRef.nativeElement, 'overflow', 'hidden'); + this.renderer.setStyle(this.elementRef.nativeElement, 'text-overflow', 'ellipsis'); + } + + private isOverflown(element: HTMLElement): boolean { + return element.clientWidth < element.scrollWidth; + } + + private showTooltip(): void { + this.tooltip.message = this.text; + + this.renderer.setAttribute(this.elementRef.nativeElement, 'matTooltip', this.text); + this.tooltip.show(); + } + + private hideTooltip(): void { + this.tooltip.hide(); + } +} diff --git a/ui-ngx/src/app/shared/shared.module.ts b/ui-ngx/src/app/shared/shared.module.ts index 567b80ed83..aa74c96f29 100644 --- a/ui-ngx/src/app/shared/shared.module.ts +++ b/ui-ngx/src/app/shared/shared.module.ts @@ -219,6 +219,7 @@ import { ImageGalleryDialogComponent } from '@shared/components/image/image-gall import { RuleChainSelectPanelComponent } from '@shared/components/rule-chain/rule-chain-select-panel.component'; import { WidgetButtonComponent } from '@shared/components/button/widget-button.component'; import { HexInputComponent } from '@shared/components/color-picker/hex-input.component'; +import { TooltipDirective } from '@shared/directives/public-api'; export function MarkedOptionsFactory(markedOptionsService: MarkedOptionsService) { return markedOptionsService; @@ -472,6 +473,7 @@ export function MarkedOptionsFactory(markedOptionsService: MarkedOptionsService) DndModule, NgxFlowModule, NgxFlowchartModule, + TooltipDirective, // ngx-markdown MarkdownModule.forRoot({ sanitize: SecurityContext.NONE, From 474162bb052b15687ef8ca479a785382978db6ab Mon Sep 17 00:00:00 2001 From: mpetrov Date: Tue, 9 Jul 2024 15:38:16 +0300 Subject: [PATCH 02/51] OPC-UA Data mapping crushing on creating empty connector fix --- .../mapping-table/mapping-table.component.ts | 16 +++++++++++++++- 1 file changed, 15 insertions(+), 1 deletion(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts index 7042e5ae38..51847d2c70 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts @@ -33,6 +33,7 @@ import { debounceTime, distinctUntilChanged, map, take, takeUntil } from 'rxjs/o import { ControlValueAccessor, FormBuilder, + FormGroup, NG_VALIDATORS, NG_VALUE_ACCESSOR, UntypedFormArray, @@ -206,13 +207,26 @@ export class MappingTableComponent implements ControlValueAccessor, Validator, A if (isDefinedAndNotNull(index)) { this.mappingFormGroup.at(index).patchValue(res); } else { - this.mappingFormGroup.push(this.fb.group(res)); + this.mappingFormGroup.push(this.getMappedDialogDataFormGroup(res)); } this.mappingFormGroup.markAsDirty(); } }); } + private getMappedDialogDataFormGroup(mappingValue: MappingValue): FormGroup { + Object.keys(mappingValue).forEach(key => { + if (Array.isArray(mappingValue[key])) { + mappingValue = { + ...mappingValue, + [key]: this.fb.control(mappingValue[key]), + }; + } + }); + + return this.fb.group(mappingValue); + } + private updateTableData(value: ConnectorMapping[], textSearch?: string): void { let tableValue = value.map(mappingValue => this.getMappingValue(mappingValue)); if (textSearch) { From d9807e797b3a21d77ffb6743c3713792d822c9be Mon Sep 17 00:00:00 2001 From: mpetrov Date: Wed, 10 Jul 2024 10:32:37 +0300 Subject: [PATCH 03/51] refactoring --- .../server-config/server-config.component.html | 12 ++++++------ .../server-config/server-config.component.ts | 2 ++ .../components/hint-tooltip-icon.component.html | 2 +- .../components/hint-tooltip-icon.component.scss | 1 + .../components/hint-tooltip-icon.component.ts | 3 +-- .../shared/directives/tooltip/tooltip.directive.ts | 13 +++++++------ ui-ngx/src/app/shared/shared.module.ts | 2 -- 7 files changed, 18 insertions(+), 17 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.html index 5182fb108e..dbabe3acf6 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.html @@ -18,7 +18,7 @@
-
gateway.server-url
+
gateway.server-url
@@ -36,7 +36,7 @@
- {{ 'gateway.timeout' | translate }} +
{{ 'gateway.timeout' | translate }}
@@ -55,7 +55,7 @@
-
gateway.security
+
gateway.security
@@ -66,7 +66,7 @@
- {{ 'gateway.scan-period' | translate }} +
{{ 'gateway.scan-period' | translate }}
@@ -87,7 +87,7 @@
- {{ 'gateway.sub-check-period' | translate }} +
{{ 'gateway.sub-check-period' | translate }}
@@ -110,7 +110,7 @@
- {{ 'gateway.enable-subscription' | translate }} +
{{ 'gateway.enable-subscription' | translate }}
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts index 98a36182a6..66af025267 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts @@ -36,6 +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'; @Component({ selector: 'tb-server-config', @@ -59,6 +60,7 @@ import { takeUntil } from 'rxjs/operators'; CommonModule, SharedModule, SecurityConfigComponent, + TooltipDirective, ] }) export class ServerConfigComponent implements ControlValueAccessor, Validator, OnDestroy { diff --git a/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.html b/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.html index 20593f042b..cb98fa4608 100644 --- a/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.html +++ b/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.html @@ -16,7 +16,7 @@ -->
-
+
(); + constructor( + private elementRef: ElementRef, + private renderer: Renderer2, + private tooltip: MatTooltip + ) {} + ngOnInit(): void { this.observeMouseEvents(); + this.applyTruncationStyles(); } ngAfterViewInit(): void { - this.applyTruncationStyles(); - if (!this.text) { this.text = this.elementRef.nativeElement.innerText; } diff --git a/ui-ngx/src/app/shared/shared.module.ts b/ui-ngx/src/app/shared/shared.module.ts index aa74c96f29..567b80ed83 100644 --- a/ui-ngx/src/app/shared/shared.module.ts +++ b/ui-ngx/src/app/shared/shared.module.ts @@ -219,7 +219,6 @@ import { ImageGalleryDialogComponent } from '@shared/components/image/image-gall import { RuleChainSelectPanelComponent } from '@shared/components/rule-chain/rule-chain-select-panel.component'; import { WidgetButtonComponent } from '@shared/components/button/widget-button.component'; import { HexInputComponent } from '@shared/components/color-picker/hex-input.component'; -import { TooltipDirective } from '@shared/directives/public-api'; export function MarkedOptionsFactory(markedOptionsService: MarkedOptionsService) { return markedOptionsService; @@ -473,7 +472,6 @@ export function MarkedOptionsFactory(markedOptionsService: MarkedOptionsService) DndModule, NgxFlowModule, NgxFlowchartModule, - TooltipDirective, // ngx-markdown MarkdownModule.forRoot({ sanitize: SecurityContext.NONE, From a1d26e29b3cf6681701ffc68a1b09e6fe659dfd8 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Wed, 10 Jul 2024 11:07:38 +0300 Subject: [PATCH 04/51] refactoring --- .../workers-config-control.component.html | 4 +- .../workers-config-control.component.ts | 2 + .../hint-tooltip-icon.component.html | 14 +++---- .../hint-tooltip-icon.component.scss | 39 +++++++++---------- .../components/hint-tooltip-icon.component.ts | 3 +- 5 files changed, 30 insertions(+), 32 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.html index 0062e476c2..b348b49252 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.html @@ -19,7 +19,7 @@
- {{ 'gateway.max-number-of-workers' | translate }} +
{{ 'gateway.max-number-of-workers' | translate }}
@@ -41,7 +41,7 @@
- {{ 'gateway.max-messages-queue-for-worker' | translate }} +
{{ 'gateway.max-messages-queue-for-worker' | translate }}
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts index 9a37bdb07c..c05b7c32b6 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts @@ -33,6 +33,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'; @Component({ selector: 'tb-workers-config-control', @@ -42,6 +43,7 @@ import { takeUntil } from 'rxjs/operators'; imports: [ CommonModule, SharedModule, + TooltipDirective, ], providers: [ { diff --git a/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.html b/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.html index cb98fa4608..f2413f0ad7 100644 --- a/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.html +++ b/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.html @@ -15,12 +15,8 @@ limitations under the License. --> -
-
- -
- {{ hintIcon }} -
+ +{{ hintIcon }} diff --git a/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.scss b/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.scss index 60bd53aa43..b83c2ff1b9 100644 --- a/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.scss +++ b/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.scss @@ -13,30 +13,29 @@ * See the License for the specific language governing permissions and * limitations under the License. */ +:host(.tb-hint-tooltip) { + display: flex; + flex-direction: row; + align-items: center; + gap: 4px; +} :host { - .tb-hint-tooltip { - display: flex; - flex-direction: row; - align-items: center; - gap: 4px; - - &-content { - flex: 1 1 auto; - min-width: 0; - max-width: fit-content; - } + .tb-hint-tooltip-content { + flex: 1 1 auto; + min-width: 0; + max-width: fit-content; + } - &-icon { - color: #E0E0E0; - overflow: visible; - order: 3; - margin-left: 4px; - flex-shrink: 0; + .tb-hint-tooltip-icon { + color: #E0E0E0; + overflow: visible; + order: 3; + margin-left: 4px; + flex-shrink: 0; - &:hover { - color: #9E9E9E; - } + &:hover { + color: #9E9E9E; } } } diff --git a/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.ts b/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.ts index 86a346012e..4518875bb6 100644 --- a/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.ts +++ b/ui-ngx/src/app/shared/components/hint-tooltip-icon.component.ts @@ -14,7 +14,7 @@ /// limitations under the License. /// -import { Component, Input } from '@angular/core'; +import { Component, HostBinding, Input } from '@angular/core'; import { TooltipPosition } from '@angular/material/tooltip'; @Component({ @@ -24,6 +24,7 @@ import { TooltipPosition } from '@angular/material/tooltip'; }) export class HintTooltipIconComponent { + @HostBinding('class.tb-hint-tooltip') @Input('tb-hint-tooltip-icon') tooltipText: string; @Input() From c65b5724f54622965b273946aa700c3e55af81fc Mon Sep 17 00:00:00 2001 From: mpetrov Date: Wed, 10 Jul 2024 12:27:40 +0300 Subject: [PATCH 05/51] refactoring --- .../mapping-table/mapping-table.component.ts | 18 ++----------- .../dialog/mapping-dialog.component.ts | 26 +++++++++++-------- .../lib/gateway/gateway-widget.models.ts | 22 ++++++++++++---- 3 files changed, 34 insertions(+), 32 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts index 51847d2c70..9c04a32296 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts @@ -33,7 +33,6 @@ import { debounceTime, distinctUntilChanged, map, take, takeUntil } from 'rxjs/o import { ControlValueAccessor, FormBuilder, - FormGroup, NG_VALIDATORS, NG_VALUE_ACCESSOR, UntypedFormArray, @@ -192,7 +191,7 @@ export class MappingTableComponent implements ControlValueAccessor, Validator, A $event.stopPropagation(); } const value = isDefinedAndNotNull(index) ? this.mappingFormGroup.at(index).value : {}; - this.dialog.open(MappingDialogComponent, { + this.dialog.open(MappingDialogComponent, { disableClose: true, panelClass: ['tb-dialog', 'tb-fullscreen-dialog'], data: { @@ -207,26 +206,13 @@ export class MappingTableComponent implements ControlValueAccessor, Validator, A if (isDefinedAndNotNull(index)) { this.mappingFormGroup.at(index).patchValue(res); } else { - this.mappingFormGroup.push(this.getMappedDialogDataFormGroup(res)); + this.pushDataAsFormArrays([res]); } this.mappingFormGroup.markAsDirty(); } }); } - private getMappedDialogDataFormGroup(mappingValue: MappingValue): FormGroup { - Object.keys(mappingValue).forEach(key => { - if (Array.isArray(mappingValue[key])) { - mappingValue = { - ...mappingValue, - [key]: this.fb.control(mappingValue[key]), - }; - } - }); - - return this.fb.group(mappingValue); - } - private updateTableData(value: ConnectorMapping[], textSearch?: string): void { let tableValue = value.map(mappingValue => this.getMappingValue(mappingValue)); if (textSearch) { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.ts index 3812fa161e..31a43314cc 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.ts @@ -24,9 +24,13 @@ import { Router } from '@angular/router'; import { Attribute, AttributesUpdate, + ConnectorMapping, + ConnectorMappingFormValue, + ConverterMappingFormValue, ConvertorType, ConvertorTypeTranslationsMap, DataConversionTranslationsMap, + DeviceConnectorMapping, DeviceInfoType, MappingHintTranslationsMap, MappingInfo, @@ -37,11 +41,11 @@ import { MappingKeysType, MappingType, MappingTypeTranslationsMap, - MappingValue, noLeadTrailSpacesRegex, OPCUaSourceTypes, QualityTypes, QualityTypeTranslationsMap, + RequestMappingFormValue, RequestType, RequestTypesTranslationsMap, RpcMethod, @@ -62,7 +66,7 @@ import { MappingDataKeysPanelComponent } from '@home/components/widget/lib/gatew templateUrl: './mapping-dialog.component.html', styleUrls: ['./mapping-dialog.component.scss'] }) -export class MappingDialogComponent extends DialogComponent implements OnDestroy { +export class MappingDialogComponent extends DialogComponent implements OnDestroy { mappingForm: UntypedFormGroup; @@ -104,7 +108,7 @@ export class MappingDialogComponent extends DialogComponent, protected router: Router, @Inject(MAT_DIALOG_DATA) public data: MappingInfo, - public dialogRef: MatDialogRef, + public dialogRef: MatDialogRef, private fb: FormBuilder, private popoverService: TbPopoverService, private renderer: Renderer2, @@ -247,7 +251,7 @@ export class MappingDialogComponent extends DialogComponent & { + converter: { + type: ConvertorType; + } & Record; +}; + export interface DeviceConnectorMapping { deviceNodePattern: string; deviceNodeSource: string; deviceInfo: DeviceInfo; - attributes: Attribute[]; - timeseries: Timeseries[]; - rpc_methods: RpcMethod[]; - attributes_updates: AttributesUpdate[]; + attributes?: Attribute[]; + timeseries?: Timeseries[]; + rpc_methods?: RpcMethod[]; + attributes_updates?: AttributesUpdate[]; } export enum ConnectorType { @@ -597,6 +605,10 @@ export interface RequestMappingData { requestValue: RequestDataItem; } +export type RequestMappingFormValue = Omit & { + requestValue: Record; +}; + export interface RequestDataItem { type: string; details: string; From 0805ee5de2acf14c216d10ed5dad917512bbaff6 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Wed, 10 Jul 2024 14:59:29 +0300 Subject: [PATCH 06/51] Added 'With Response' to MQTT templates and removed Response Time when With Response = false --- ...teway-service-rpc-connector.component.html | 6 ++--- ...gateway-service-rpc-connector.component.ts | 23 ++++++++++++------- .../shared/pipe/key-value-not-empty.pipe.ts | 2 +- 3 files changed, 19 insertions(+), 12 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector.component.html index 3b590e3872..eb428bebdc 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector.component.html @@ -31,15 +31,15 @@
- + {{ 'gateway.rpc.withResponse' | translate }} - + {{ 'gateway.rpc.responseTopicExpression' | translate }} - + {{ 'gateway.rpc.responseTimeout' | translate }} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector.component.ts index c515cbc201..e35061a611 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector.component.ts @@ -53,7 +53,7 @@ import { } from '@shared/components/dialog/json-object-edit-dialog.component'; import { jsonRequired } from '@shared/components/json-object-edit.component'; import { deepClone } from '@core/utils'; -import { takeUntil, tap } from "rxjs/operators"; +import { filter, takeUntil, tap } from "rxjs/operators"; import { Subject } from "rxjs"; @Component({ @@ -80,7 +80,6 @@ export class GatewayServiceRPCConnectorComponent implements OnInit, OnDestroy, C saveTemplate: EventEmitter = new EventEmitter(); commandForm: FormGroup; - isMQTTWithResponse: FormControl; codesArray: Array = [1, 2, 3, 4, 5, 6, 15, 16]; ConnectorType = ConnectorType; modbusCommandTypes = Object.values(ModbusCommandTypes) as ModbusCommandTypes[]; @@ -135,7 +134,6 @@ export class GatewayServiceRPCConnectorComponent implements OnInit, OnDestroy, C this.propagateChange({...this.commandForm.value, ...value}); } }); - this.isMQTTWithResponse = this.fb.control(false); this.observeMQTTWithResponse(); } @@ -153,9 +151,10 @@ export class GatewayServiceRPCConnectorComponent implements OnInit, OnDestroy, C methodFilter: [null, [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], requestTopicExpression: [null, [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], responseTopicExpression: [{ value: null, disabled: true }, [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], - responseTimeout: [null, [Validators.min(10), Validators.pattern(this.numbersOnlyPattern)]], + responseTimeout: [{ value: null, disabled: true }, [Validators.min(10), Validators.pattern(this.numbersOnlyPattern)]], valueExpression: [null, [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], - }) + withResponse: [false, []], + }); break; case ConnectorType.MODBUS: formGroup = this.fb.group({ @@ -407,10 +406,18 @@ export class GatewayServiceRPCConnectorComponent implements OnInit, OnDestroy, C } private observeMQTTWithResponse(): void { - this.isMQTTWithResponse.valueChanges.pipe( + this.commandForm.get('withResponse').valueChanges.pipe( + filter(() => this.connectorType === ConnectorType.MQTT), tap((isActive: boolean) => { - const responseControl = this.commandForm.get('responseTopicExpression'); - isActive ? responseControl.enable() : responseControl.disable(); + const responseTopicControl = this.commandForm.get('responseTopicExpression'); + const responseTimeoutControl = this.commandForm.get('responseTimeout'); + if (isActive) { + responseTopicControl.enable(); + responseTimeoutControl.enable(); + } else { + responseTopicControl.disable(); + responseTimeoutControl.disable(); + } }), takeUntil(this.destroy$), ).subscribe(); diff --git a/ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts b/ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts index 94eeced50e..08afba9d81 100644 --- a/ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts +++ b/ui-ngx/src/app/shared/pipe/key-value-not-empty.pipe.ts @@ -62,6 +62,6 @@ export class KeyValueIsNotEmptyPipe implements PipeTransform { } private makeKeyValuePair(key: string, value: unknown): KeyValue { - return {key: key, value: value}; + return {key, value}; } } From 78136e2734da9754580654677d0d30d80efb93f6 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Wed, 10 Jul 2024 15:04:55 +0300 Subject: [PATCH 07/51] refactoring --- ...gateway-service-rpc-connector.component.ts | 31 ++++++++++--------- 1 file changed, 16 insertions(+), 15 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector.component.ts index e35061a611..3027cafa8d 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector.component.ts @@ -406,20 +406,21 @@ export class GatewayServiceRPCConnectorComponent implements OnInit, OnDestroy, C } private observeMQTTWithResponse(): void { - this.commandForm.get('withResponse').valueChanges.pipe( - filter(() => this.connectorType === ConnectorType.MQTT), - tap((isActive: boolean) => { - const responseTopicControl = this.commandForm.get('responseTopicExpression'); - const responseTimeoutControl = this.commandForm.get('responseTimeout'); - if (isActive) { - responseTopicControl.enable(); - responseTimeoutControl.enable(); - } else { - responseTopicControl.disable(); - responseTimeoutControl.disable(); - } - }), - takeUntil(this.destroy$), - ).subscribe(); + if (this.connectorType === ConnectorType.MQTT) { + this.commandForm.get('withResponse').valueChanges.pipe( + tap((isActive: boolean) => { + const responseTopicControl = this.commandForm.get('responseTopicExpression'); + const responseTimeoutControl = this.commandForm.get('responseTimeout'); + if (isActive) { + responseTopicControl.enable(); + responseTimeoutControl.enable(); + } else { + responseTopicControl.disable(); + responseTimeoutControl.disable(); + } + }), + takeUntil(this.destroy$), + ).subscribe(); + } } } From 728042680fcbf5d1a0e472ba0a831513754d66c4 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Wed, 10 Jul 2024 15:45:26 +0300 Subject: [PATCH 08/51] Fixed spacing in OPC-UA server tab --- .../server-config.component.html | 168 +++++++++--------- 1 file changed, 83 insertions(+), 85 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.html index 43b15de06c..bb77cb4a65 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.html @@ -16,95 +16,93 @@ -->
-
-
-
gateway.server-url
-
- - - - warning - - -
+
+
gateway.server-url
+
+ + + + warning + +
-
-
- gateway.timeout -
-
- - - - warning - - -
+
+
+
+ gateway.timeout +
+
+ + + + warning + +
-
-
gateway.security
-
- - - {{ version.name }} - - -
+
+
+
gateway.security
+
+ + + {{ version.name }} + +
-
-
- gateway.scan-period -
-
- - - - warning - - -
+
+
+
+ gateway.scan-period +
+
+ + + + warning + + +
+
+
+
+ gateway.sub-check-period
-
-
- gateway.sub-check-period -
-
- - - - warning - - -
+
+ + + + warning + +
From 1804cb18e62c1ca4b3e3c17bcbe2c8efb7274ba7 Mon Sep 17 00:00:00 2001 From: ThingsBoard Date: Wed, 10 Jul 2024 16:50:19 +0300 Subject: [PATCH 09/51] test --- .../gateway/gateway-statistics.component.html | 16 +++++++++++----- .../gateway/gateway-statistics.component.scss | 5 +++++ .../lib/gateway/gateway-statistics.component.ts | 6 ++++++ .../src/assets/locale/locale.constant-en_US.json | 1 + ui-ngx/src/styles.scss | 3 +++ 5 files changed, 26 insertions(+), 5 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html index 4abf67a2d1..7866e8a1c5 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html @@ -30,8 +30,11 @@ - {{'gateway.statistics.statistic-commands-empty' | translate }} + {{ 'gateway.statistics.statistic-commands-empty' | translate }} + {{ 'gateway.statistics.command' | translate }} @@ -42,14 +45,17 @@
- - {{ 'widgets.gateway.created-time' | translate }} + test + {{ 'widgets.gateway.created-time' | translate }} + - {{row[0]| date:'yyyy-MM-dd HH:mm:ss' }} + {{ row[0]| date:'yyyy-MM-dd HH:mm:ss' }} - {{ 'widgets.gateway.message' | translate }} + {{ 'widgets.gateway.message' | translate }} + {{ row[1] }} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss index cd7722d12d..f4b06433b2 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss @@ -36,6 +36,11 @@ } } + .mat-mdc-icon-button { + height: 40px; + margin-top: 22px; + } + .chart-box, .chart-container { height: 100%; flex-grow: 1; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.ts index a3cb79e125..1caab7a462 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.ts @@ -32,6 +32,7 @@ import { Direction, SortOrder } from '@shared/models/page/sort-order'; import { MatTableDataSource } from '@angular/material/table'; import { MatSort } from '@angular/material/sort'; import { NULL_UUID } from '@shared/models/id/has-uuid'; +import {deepClone} from "@core/utils"; @Component({ selector: 'tb-gateway-statistics', @@ -135,6 +136,11 @@ export class GatewayStatisticsComponent implements AfterViewInit { } } + public navigateToStatistics() { + const params = deepClone(this.ctx.stateController.getStateParams()); + this.ctx.stateController.openState('configuration', params); + } + public sortData() { this.dataSource.sortData(this.dataSource.data, this.sort); } diff --git a/ui-ngx/src/assets/locale/locale.constant-en_US.json b/ui-ngx/src/assets/locale/locale.constant-en_US.json index 33c8d25652..d968219862 100644 --- a/ui-ngx/src/assets/locale/locale.constant-en_US.json +++ b/ui-ngx/src/assets/locale/locale.constant-en_US.json @@ -3152,6 +3152,7 @@ "statistic": "Statistic", "statistics": "Statistics", "statistic-commands-empty": "No configured statistic keys found. You can configure them in \"Statistics\" tab in general configuration.", + "statistics-button": "Go to configuration", "commands": "Commands", "send-period": "Statistic send period (in sec)", "send-period-required": "Statistic send period is required", diff --git a/ui-ngx/src/styles.scss b/ui-ngx/src/styles.scss index 4d5ae09a15..1e12eb4936 100644 --- a/ui-ngx/src/styles.scss +++ b/ui-ngx/src/styles.scss @@ -941,6 +941,9 @@ mat-icon { &.tb-mat-96 { @include tb-mat-icon-button-size(96); } + &.tb-mat-185 { + @include tb-mat-icon-button-size(185); + } } .mat-mdc-snack-bar-container { From 71a474bbf202626c367cc0b02ffb27812ccc0bd6 Mon Sep 17 00:00:00 2001 From: Anna Bondar <111653147+Aniutikm@users.noreply.github.com> Date: Wed, 10 Jul 2024 16:58:16 +0300 Subject: [PATCH 10/51] refactoring --- .../widget/lib/gateway/gateway-statistics.component.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html index 7866e8a1c5..896f94463c 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html @@ -45,7 +45,7 @@
- test + {{ 'widgets.gateway.created-time' | translate }} From e9967306b67a31778312059354457bb6adf92021 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Wed, 10 Jul 2024 18:14:38 +0300 Subject: [PATCH 11/51] Added emmition of default values on Connector with basic config creation --- .../broker-config-control.component.html | 2 +- .../broker-config-control.component.ts | 18 +++++++++++++----- .../mqtt-basic-config.component.ts | 10 ++++++---- .../security-config.component.ts | 11 ++++++++++- .../server-config/server-config.component.ts | 12 ++++++++++-- .../workers-config-control.component.ts | 15 +++++++++++++-- .../gateway/gateway-connectors.component.ts | 5 ----- 7 files changed, 53 insertions(+), 20 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.html index f70ed366e1..7e25033e84 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.html @@ -74,7 +74,7 @@ aria-label="Generate" matTooltip="{{ 'gateway.generate-client-id' | translate }}" matTooltipPosition="above" - (click)="generate('clientId')" + (click)="generate()" *ngIf="!brokerConfigFormGroup.get('clientId').value"> autorenew diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts index 13f5c7c77e..449d2ad1a5 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts @@ -14,7 +14,7 @@ /// limitations under the License. /// -import { ChangeDetectionStrategy, Component, forwardRef, OnDestroy } from '@angular/core'; +import { AfterViewInit, ChangeDetectionStrategy, Component, forwardRef, OnDestroy } from '@angular/core'; import { ControlValueAccessor, FormBuilder, @@ -61,7 +61,7 @@ import { Subject } from 'rxjs'; } ] }) -export class BrokerConfigControlComponent implements ControlValueAccessor, Validator, OnDestroy { +export class BrokerConfigControlComponent implements ControlValueAccessor, Validator, AfterViewInit, OnDestroy { brokerConfigFormGroup: UntypedFormGroup; mqttVersions = MqttVersions; portLimits = PortLimits; @@ -78,7 +78,7 @@ export class BrokerConfigControlComponent implements ControlValueAccessor, Valid host: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], port: [null, [Validators.required, Validators.min(PortLimits.MIN), Validators.max(PortLimits.MAX)]], version: [5, []], - clientId: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + clientId: ['tb_gw_' + generateSecret(5), [Validators.pattern(noLeadTrailSpacesRegex)]], security: [] }); @@ -101,13 +101,17 @@ export class BrokerConfigControlComponent implements ControlValueAccessor, Valid return ''; } + ngAfterViewInit(): void { + this.emitDefaultValue(); + } + ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); } - generate(formControlName: string): void { - this.brokerConfigFormGroup.get(formControlName)?.patchValue('tb_gw_' + generateSecret(5)); + generate(): void { + this.brokerConfigFormGroup.get('clientId').patchValue('tb_gw_' + generateSecret(5)); } registerOnChange(fn: (value: string) => void): void { @@ -127,4 +131,8 @@ export class BrokerConfigControlComponent implements ControlValueAccessor, Valid brokerConfigFormGroup: {valid: false} }; } + + private emitDefaultValue(): void { + this.onChange(this.brokerConfigFormGroup.value); + }; } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts index 650ecef68a..57436daafd 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts @@ -114,10 +114,12 @@ export class MqttBasicConfigComponent implements ControlValueAccessor, Validator writeValue(basicConfig: ConnectorBaseConfig): void { const editedBase = { - workers: { - maxNumberOfWorkers: basicConfig.broker?.maxNumberOfWorkers, - maxMessageNumberPerWorker: basicConfig.broker?.maxMessageNumberPerWorker, - }, + workers: basicConfig.broker + ? { + maxNumberOfWorkers: basicConfig.broker.maxNumberOfWorkers, + maxMessageNumberPerWorker: basicConfig.broker.maxMessageNumberPerWorker, + } + : {}, dataMapping: basicConfig.dataMapping || [], broker: basicConfig.broker || {}, requestsMapping: Array.isArray(basicConfig.requestsMapping) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component.ts index 38a66daafc..a6c147a3e7 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component.ts @@ -15,6 +15,7 @@ /// import { + AfterViewInit, ChangeDetectionStrategy, Component, forwardRef, @@ -67,7 +68,7 @@ import { CommonModule } from '@angular/common'; SharedModule, ] }) -export class SecurityConfigComponent implements ControlValueAccessor, OnInit, OnDestroy { +export class SecurityConfigComponent implements ControlValueAccessor, OnInit, AfterViewInit, OnDestroy { @Input() title = 'gateway.security'; @@ -112,6 +113,10 @@ export class SecurityConfigComponent implements ControlValueAccessor, OnInit, On ).subscribe((type) => this.updateValidators(type)); } + ngAfterViewInit(): void { + this.emitDefaultValue(); + } + ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); @@ -143,6 +148,10 @@ export class SecurityConfigComponent implements ControlValueAccessor, OnInit, On this.onTouched = fn; } + private emitDefaultValue(): void { + this.onChange(this.securityFormGroup.value); + }; + private updateValidators(type: SecurityType): void { if (type) { this.securityFormGroup.get('username').disable({emitEvent: false}); diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts index 98a36182a6..4f8e563d86 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts @@ -14,7 +14,7 @@ /// limitations under the License. /// -import { ChangeDetectionStrategy, Component, forwardRef, OnDestroy } from '@angular/core'; +import { AfterViewInit, ChangeDetectionStrategy, Component, forwardRef, OnDestroy } from '@angular/core'; import { ControlValueAccessor, FormBuilder, @@ -61,7 +61,7 @@ import { takeUntil } from 'rxjs/operators'; SecurityConfigComponent, ] }) -export class ServerConfigComponent implements ControlValueAccessor, Validator, OnDestroy { +export class ServerConfigComponent implements ControlValueAccessor, Validator, AfterViewInit, OnDestroy { securityPolicyTypes = SecurityPolicyTypes; serverConfigFormGroup: UntypedFormGroup; @@ -92,6 +92,10 @@ export class ServerConfigComponent implements ControlValueAccessor, Validator, O }); } + ngAfterViewInit(): void { + this.emitDefaultValue(); + } + ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); @@ -114,4 +118,8 @@ export class ServerConfigComponent implements ControlValueAccessor, Validator, O writeValue(serverConfig: ServerConfig): void { this.serverConfigFormGroup.patchValue(serverConfig, {emitEvent: false}); } + + private emitDefaultValue(): void { + this.onChange(this.serverConfigFormGroup.value); + }; } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts index 9a37bdb07c..be6542963f 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts @@ -15,6 +15,7 @@ /// import { + AfterViewInit, ChangeDetectionStrategy, Component, forwardRef, @@ -25,7 +26,9 @@ import { FormBuilder, NG_VALIDATORS, NG_VALUE_ACCESSOR, - UntypedFormGroup, ValidationErrors, Validator, + UntypedFormGroup, + ValidationErrors, + Validator, Validators } from '@angular/forms'; import { SharedModule } from '@shared/shared.module'; @@ -56,7 +59,7 @@ import { takeUntil } from 'rxjs/operators'; } ] }) -export class WorkersConfigControlComponent implements OnDestroy, ControlValueAccessor, Validator { +export class WorkersConfigControlComponent implements AfterViewInit, OnDestroy, ControlValueAccessor, Validator { workersConfigFormGroup: UntypedFormGroup; @@ -77,6 +80,10 @@ export class WorkersConfigControlComponent implements OnDestroy, ControlValueAcc }); } + ngAfterViewInit(): void { + this.emitDefaultValue(); + } + ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); @@ -99,4 +106,8 @@ export class WorkersConfigControlComponent implements OnDestroy, ControlValueAcc workersConfigFormGroup: {valid: false} }; } + + private emitDefaultValue(): void { + this.onChange(this.workersConfigFormGroup.value); + }; } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts index 14a8c15c00..5eeffd62cf 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts @@ -551,7 +551,6 @@ export class GatewayConnectorComponent extends PageComponent implements AfterVie } value.basicConfig = value.configurationJson; this.updateConnector(value); - this.generate('basicConfig.broker.clientId'); setTimeout(() => this.saveConnector()); } }); @@ -559,10 +558,6 @@ export class GatewayConnectorComponent extends PageComponent implements AfterVie }); } - generate(formControlName: string): void { - this.connectorForm.get(formControlName)?.patchValue('tb_gw_' + generateSecret(5)); - } - uniqNameRequired(): ValidatorFn { return (c: UntypedFormControl) => { const newName = c.value.trim().toLowerCase(); From 01fb50d73ac6592b8ff5d26c8f2d6b862511bd20 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Thu, 11 Jul 2024 11:57:41 +0300 Subject: [PATCH 12/51] Revert "Added emmition of default values on Connector with basic config creation" This reverts commit e9967306b67a31778312059354457bb6adf92021. --- .../broker-config-control.component.html | 2 +- .../broker-config-control.component.ts | 18 +++++------------- .../mqtt-basic-config.component.ts | 10 ++++------ .../security-config.component.ts | 11 +---------- .../server-config/server-config.component.ts | 12 ++---------- .../workers-config-control.component.ts | 15 ++------------- .../gateway/gateway-connectors.component.ts | 5 +++++ 7 files changed, 20 insertions(+), 53 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.html index 7e25033e84..f70ed366e1 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.html @@ -74,7 +74,7 @@ aria-label="Generate" matTooltip="{{ 'gateway.generate-client-id' | translate }}" matTooltipPosition="above" - (click)="generate()" + (click)="generate('clientId')" *ngIf="!brokerConfigFormGroup.get('clientId').value"> autorenew diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts index 449d2ad1a5..13f5c7c77e 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts @@ -14,7 +14,7 @@ /// limitations under the License. /// -import { AfterViewInit, ChangeDetectionStrategy, Component, forwardRef, OnDestroy } from '@angular/core'; +import { ChangeDetectionStrategy, Component, forwardRef, OnDestroy } from '@angular/core'; import { ControlValueAccessor, FormBuilder, @@ -61,7 +61,7 @@ import { Subject } from 'rxjs'; } ] }) -export class BrokerConfigControlComponent implements ControlValueAccessor, Validator, AfterViewInit, OnDestroy { +export class BrokerConfigControlComponent implements ControlValueAccessor, Validator, OnDestroy { brokerConfigFormGroup: UntypedFormGroup; mqttVersions = MqttVersions; portLimits = PortLimits; @@ -78,7 +78,7 @@ export class BrokerConfigControlComponent implements ControlValueAccessor, Valid host: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], port: [null, [Validators.required, Validators.min(PortLimits.MIN), Validators.max(PortLimits.MAX)]], version: [5, []], - clientId: ['tb_gw_' + generateSecret(5), [Validators.pattern(noLeadTrailSpacesRegex)]], + clientId: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], security: [] }); @@ -101,17 +101,13 @@ export class BrokerConfigControlComponent implements ControlValueAccessor, Valid return ''; } - ngAfterViewInit(): void { - this.emitDefaultValue(); - } - ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); } - generate(): void { - this.brokerConfigFormGroup.get('clientId').patchValue('tb_gw_' + generateSecret(5)); + generate(formControlName: string): void { + this.brokerConfigFormGroup.get(formControlName)?.patchValue('tb_gw_' + generateSecret(5)); } registerOnChange(fn: (value: string) => void): void { @@ -131,8 +127,4 @@ export class BrokerConfigControlComponent implements ControlValueAccessor, Valid brokerConfigFormGroup: {valid: false} }; } - - private emitDefaultValue(): void { - this.onChange(this.brokerConfigFormGroup.value); - }; } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts index 57436daafd..650ecef68a 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts @@ -114,12 +114,10 @@ export class MqttBasicConfigComponent implements ControlValueAccessor, Validator writeValue(basicConfig: ConnectorBaseConfig): void { const editedBase = { - workers: basicConfig.broker - ? { - maxNumberOfWorkers: basicConfig.broker.maxNumberOfWorkers, - maxMessageNumberPerWorker: basicConfig.broker.maxMessageNumberPerWorker, - } - : {}, + workers: { + maxNumberOfWorkers: basicConfig.broker?.maxNumberOfWorkers, + maxMessageNumberPerWorker: basicConfig.broker?.maxMessageNumberPerWorker, + }, dataMapping: basicConfig.dataMapping || [], broker: basicConfig.broker || {}, requestsMapping: Array.isArray(basicConfig.requestsMapping) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component.ts index a6c147a3e7..38a66daafc 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component.ts @@ -15,7 +15,6 @@ /// import { - AfterViewInit, ChangeDetectionStrategy, Component, forwardRef, @@ -68,7 +67,7 @@ import { CommonModule } from '@angular/common'; SharedModule, ] }) -export class SecurityConfigComponent implements ControlValueAccessor, OnInit, AfterViewInit, OnDestroy { +export class SecurityConfigComponent implements ControlValueAccessor, OnInit, OnDestroy { @Input() title = 'gateway.security'; @@ -113,10 +112,6 @@ export class SecurityConfigComponent implements ControlValueAccessor, OnInit, Af ).subscribe((type) => this.updateValidators(type)); } - ngAfterViewInit(): void { - this.emitDefaultValue(); - } - ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); @@ -148,10 +143,6 @@ export class SecurityConfigComponent implements ControlValueAccessor, OnInit, Af this.onTouched = fn; } - private emitDefaultValue(): void { - this.onChange(this.securityFormGroup.value); - }; - private updateValidators(type: SecurityType): void { if (type) { this.securityFormGroup.get('username').disable({emitEvent: false}); diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts index 4f8e563d86..98a36182a6 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts @@ -14,7 +14,7 @@ /// limitations under the License. /// -import { AfterViewInit, ChangeDetectionStrategy, Component, forwardRef, OnDestroy } from '@angular/core'; +import { ChangeDetectionStrategy, Component, forwardRef, OnDestroy } from '@angular/core'; import { ControlValueAccessor, FormBuilder, @@ -61,7 +61,7 @@ import { takeUntil } from 'rxjs/operators'; SecurityConfigComponent, ] }) -export class ServerConfigComponent implements ControlValueAccessor, Validator, AfterViewInit, OnDestroy { +export class ServerConfigComponent implements ControlValueAccessor, Validator, OnDestroy { securityPolicyTypes = SecurityPolicyTypes; serverConfigFormGroup: UntypedFormGroup; @@ -92,10 +92,6 @@ export class ServerConfigComponent implements ControlValueAccessor, Validator, A }); } - ngAfterViewInit(): void { - this.emitDefaultValue(); - } - ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); @@ -118,8 +114,4 @@ export class ServerConfigComponent implements ControlValueAccessor, Validator, A writeValue(serverConfig: ServerConfig): void { this.serverConfigFormGroup.patchValue(serverConfig, {emitEvent: false}); } - - private emitDefaultValue(): void { - this.onChange(this.serverConfigFormGroup.value); - }; } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts index be6542963f..9a37bdb07c 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts @@ -15,7 +15,6 @@ /// import { - AfterViewInit, ChangeDetectionStrategy, Component, forwardRef, @@ -26,9 +25,7 @@ import { FormBuilder, NG_VALIDATORS, NG_VALUE_ACCESSOR, - UntypedFormGroup, - ValidationErrors, - Validator, + UntypedFormGroup, ValidationErrors, Validator, Validators } from '@angular/forms'; import { SharedModule } from '@shared/shared.module'; @@ -59,7 +56,7 @@ import { takeUntil } from 'rxjs/operators'; } ] }) -export class WorkersConfigControlComponent implements AfterViewInit, OnDestroy, ControlValueAccessor, Validator { +export class WorkersConfigControlComponent implements OnDestroy, ControlValueAccessor, Validator { workersConfigFormGroup: UntypedFormGroup; @@ -80,10 +77,6 @@ export class WorkersConfigControlComponent implements AfterViewInit, OnDestroy, }); } - ngAfterViewInit(): void { - this.emitDefaultValue(); - } - ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); @@ -106,8 +99,4 @@ export class WorkersConfigControlComponent implements AfterViewInit, OnDestroy, workersConfigFormGroup: {valid: false} }; } - - private emitDefaultValue(): void { - this.onChange(this.workersConfigFormGroup.value); - }; } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts index 5eeffd62cf..14a8c15c00 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts @@ -551,6 +551,7 @@ export class GatewayConnectorComponent extends PageComponent implements AfterVie } value.basicConfig = value.configurationJson; this.updateConnector(value); + this.generate('basicConfig.broker.clientId'); setTimeout(() => this.saveConnector()); } }); @@ -558,6 +559,10 @@ export class GatewayConnectorComponent extends PageComponent implements AfterVie }); } + generate(formControlName: string): void { + this.connectorForm.get(formControlName)?.patchValue('tb_gw_' + generateSecret(5)); + } + uniqNameRequired(): ValidatorFn { return (c: UntypedFormControl) => { const newName = c.value.trim().toLowerCase(); From 4d69299ff619afc14493fffadb097076374714a7 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Thu, 11 Jul 2024 11:58:13 +0300 Subject: [PATCH 13/51] refactoring --- .../broker-config-control.component.ts | 2 +- .../mqtt-basic-config.component.ts | 20 ++++++++++--------- .../workers-config-control.component.ts | 4 +++- .../dialog/add-connector-dialog.component.ts | 2 +- 4 files changed, 16 insertions(+), 12 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts index 13f5c7c77e..83ece09cde 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts @@ -78,7 +78,7 @@ export class BrokerConfigControlComponent implements ControlValueAccessor, Valid host: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], port: [null, [Validators.required, Validators.min(PortLimits.MIN), Validators.max(PortLimits.MAX)]], version: [5, []], - clientId: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + clientId: ['tb_gw_' + generateSecret(5), [Validators.pattern(noLeadTrailSpacesRegex)]], security: [] }); diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts index 650ecef68a..557d218581 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts @@ -113,16 +113,18 @@ export class MqttBasicConfigComponent implements ControlValueAccessor, Validator } writeValue(basicConfig: ConnectorBaseConfig): void { + const { broker, dataMapping = [], requestsMapping } = basicConfig; + const editedBase = { - workers: { - maxNumberOfWorkers: basicConfig.broker?.maxNumberOfWorkers, - maxMessageNumberPerWorker: basicConfig.broker?.maxMessageNumberPerWorker, - }, - dataMapping: basicConfig.dataMapping || [], - broker: basicConfig.broker || {}, - requestsMapping: Array.isArray(basicConfig.requestsMapping) - ? basicConfig.requestsMapping - : this.getRequestDataArray(basicConfig.requestsMapping), + workers: broker ? { + maxNumberOfWorkers: broker.maxNumberOfWorkers, + maxMessageNumberPerWorker: broker.maxMessageNumberPerWorker, + } : {}, + dataMapping: dataMapping || [], + broker: broker || {}, + requestsMapping: Array.isArray(requestsMapping) + ? requestsMapping + : this.getRequestDataArray(requestsMapping), }; this.basicFormGroup.setValue(editedBase, {emitEvent: false}); diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts index 9a37bdb07c..988851f4d8 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts @@ -25,7 +25,9 @@ import { FormBuilder, NG_VALIDATORS, NG_VALUE_ACCESSOR, - UntypedFormGroup, ValidationErrors, Validator, + UntypedFormGroup, + ValidationErrors, + Validator, Validators } from '@angular/forms'; import { SharedModule } from '@shared/shared.module'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/add-connector-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/add-connector-dialog.component.ts index 7cdfbf5808..5a1b5d2a1b 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/add-connector-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/add-connector-dialog.component.ts @@ -33,7 +33,7 @@ import { } from '@home/components/widget/lib/gateway/gateway-widget.models'; import { Subject } from 'rxjs'; import { ResourcesService } from '@core/services/resources.service'; -import { takeUntil, tap } from "rxjs/operators"; +import { takeUntil, tap } from 'rxjs/operators'; @Component({ selector: 'tb-add-connector-dialog', From 82a6364c8be894e35d3d9bbc2426b82921fad50d Mon Sep 17 00:00:00 2001 From: mpetrov Date: Thu, 11 Jul 2024 12:04:08 +0300 Subject: [PATCH 14/51] refactoring --- .../mqtt-basic-config/mqtt-basic-config.component.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts index 557d218581..1b37ff5bf7 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts @@ -116,7 +116,7 @@ export class MqttBasicConfigComponent implements ControlValueAccessor, Validator const { broker, dataMapping = [], requestsMapping } = basicConfig; const editedBase = { - workers: broker ? { + workers: broker && (broker.maxNumberOfWorkers || broker.maxMessageNumberPerWorker) ? { maxNumberOfWorkers: broker.maxNumberOfWorkers, maxMessageNumberPerWorker: broker.maxMessageNumberPerWorker, } : {}, From 94ee43a3da95880449536e3bd5c5cf297010d20d Mon Sep 17 00:00:00 2001 From: mpetrov Date: Thu, 11 Jul 2024 16:09:26 +0300 Subject: [PATCH 15/51] Added view update for Connectors on switching active connector --- .../broker-config-control.component.ts | 11 +++++++++-- .../security-config/security-config.component.ts | 4 +++- .../server-config/server-config.component.ts | 12 +++++++++++- .../workers-config-control.component.ts | 6 +++++- .../lib/gateway/gateway-connectors.component.ts | 1 + 5 files changed, 29 insertions(+), 5 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts index 13f5c7c77e..e06409c116 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts @@ -14,7 +14,7 @@ /// limitations under the License. /// -import { ChangeDetectionStrategy, Component, forwardRef, OnDestroy } from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, forwardRef, OnDestroy } from '@angular/core'; import { ControlValueAccessor, FormBuilder, @@ -72,6 +72,7 @@ export class BrokerConfigControlComponent implements ControlValueAccessor, Valid private destroy$ = new Subject(); constructor(private fb: FormBuilder, + private cdr: ChangeDetectorRef, private translate: TranslateService) { this.brokerConfigFormGroup = this.fb.group({ name: ['', []], @@ -119,7 +120,13 @@ export class BrokerConfigControlComponent implements ControlValueAccessor, Valid } writeValue(brokerConfig: BrokerConfig): void { - this.brokerConfigFormGroup.patchValue(brokerConfig, {emitEvent: false}); + const brokerConfigState = { + ...brokerConfig, + version: brokerConfig.version || 5, + clientId: brokerConfig.clientId || 'tb_gw_' + generateSecret(5), + }; + this.brokerConfigFormGroup.reset(brokerConfigState, {emitEvent: false}); + this.cdr.markForCheck(); } validate(): ValidationErrors | null { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component.ts index 38a66daafc..18d1a96e38 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component.ts @@ -16,6 +16,7 @@ import { ChangeDetectionStrategy, + ChangeDetectorRef, Component, forwardRef, Input, @@ -87,7 +88,7 @@ export class SecurityConfigComponent implements ControlValueAccessor, OnInit, On private destroy$ = new Subject(); - constructor(private fb: FormBuilder) {} + constructor(private fb: FormBuilder, private cdr: ChangeDetectorRef) {} ngOnInit(): void { this.securityFormGroup = this.fb.group({ @@ -127,6 +128,7 @@ export class SecurityConfigComponent implements ControlValueAccessor, OnInit, On } this.securityFormGroup.reset(securityInfo, {emitEvent: false}); } + this.cdr.markForCheck(); } validate(): ValidationErrors | null { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts index 98a36182a6..41e72d3256 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts @@ -112,6 +112,16 @@ export class ServerConfigComponent implements ControlValueAccessor, Validator, O } writeValue(serverConfig: ServerConfig): void { - this.serverConfigFormGroup.patchValue(serverConfig, {emitEvent: false}); + const { timeoutInMillis, scanPeriodInMillis, enableSubscriptions, subCheckPeriodInMillis, showMap, security } = serverConfig; + const serverConfigState = { + ...serverConfig, + timeoutInMillis: timeoutInMillis || 1000, + scanPeriodInMillis: scanPeriodInMillis || 1000, + enableSubscriptions: enableSubscriptions || true, + subCheckPeriodInMillis: subCheckPeriodInMillis || 10, + showMap: showMap || false, + security: security || SecurityPolicy.BASIC128, + }; + this.serverConfigFormGroup.reset(serverConfigState, {emitEvent: false}); } } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts index 9a37bdb07c..45235ef8ee 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts @@ -91,7 +91,11 @@ export class WorkersConfigControlComponent implements OnDestroy, ControlValueAcc } writeValue(workersConfig: WorkersConfig): void { - this.workersConfigFormGroup.patchValue(workersConfig, {emitEvent: false}); + const { maxNumberOfWorkers, maxMessageNumberPerWorker } = workersConfig; + this.workersConfigFormGroup.reset({ + maxNumberOfWorkers: maxNumberOfWorkers || 100, + maxMessageNumberPerWorker: maxMessageNumberPerWorker || 10, + }, {emitEvent: false}); } validate(): ValidationErrors | null { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts index 14a8c15c00..e6a83aeed5 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts @@ -733,6 +733,7 @@ export class GatewayConnectorComponent extends PageComponent implements AfterVie case ConnectorType.MQTT: case ConnectorType.OPCUA: this.connectorForm.get('type').patchValue(connector.type, {emitValue: false, onlySelf: true}); + this.connectorForm.get('basicConfig').setValue({}, {emitEvent: false}); setTimeout(() => { this.connectorForm.patchValue({...connector, mode: connector.mode || ConnectorConfigurationModes.BASIC}); From cd62960ec392d55494f63c692baecede10b445da Mon Sep 17 00:00:00 2001 From: ThingsBoard Date: Thu, 11 Jul 2024 17:18:54 +0300 Subject: [PATCH 16/51] button improvements --- .../widget/lib/gateway/gateway-statistics.component.html | 2 +- .../widget/lib/gateway/gateway-statistics.component.scss | 4 ++-- ui-ngx/src/styles.scss | 3 --- 3 files changed, 3 insertions(+), 6 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html index 7866e8a1c5..42332f65b9 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html @@ -32,7 +32,7 @@ *ngIf="!statisticsKeys.length && !commands.length"> {{ 'gateway.statistics.statistic-commands-empty' | translate }} - diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss index f4b06433b2..c0c8e084b1 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss @@ -36,8 +36,8 @@ } } - .mat-mdc-icon-button { - height: 40px; + .mat-mdc-button { + width: 185px; margin-top: 22px; } diff --git a/ui-ngx/src/styles.scss b/ui-ngx/src/styles.scss index 1e12eb4936..4d5ae09a15 100644 --- a/ui-ngx/src/styles.scss +++ b/ui-ngx/src/styles.scss @@ -941,9 +941,6 @@ mat-icon { &.tb-mat-96 { @include tb-mat-icon-button-size(96); } - &.tb-mat-185 { - @include tb-mat-icon-button-size(185); - } } .mat-mdc-snack-bar-container { From a2ec97bf194f50897fee544941ca8d9d9ab574e3 Mon Sep 17 00:00:00 2001 From: ThingsBoard Date: Thu, 11 Jul 2024 17:50:50 +0300 Subject: [PATCH 17/51] final improvements --- .../lib/gateway/gateway-statistics.component.html | 10 ++++++---- .../lib/gateway/gateway-statistics.component.scss | 6 +----- .../widget/lib/gateway/gateway-statistics.component.ts | 2 +- 3 files changed, 8 insertions(+), 10 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html index 96770f9c12..5dbc0aee00 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html @@ -17,7 +17,7 @@ -->
- + {{ 'gateway.statistics.statistic' | translate }} @@ -32,9 +32,11 @@ *ngIf="!statisticsKeys.length && !commands.length"> {{ 'gateway.statistics.statistic-commands-empty' | translate }} - +
+ +
{{ 'gateway.statistics.command' | translate }} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss index c0c8e084b1..9f719807ca 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss @@ -28,6 +28,7 @@ height: 100%; margin-right: 35px; padding: 15px; + gap: 22px; } @media only screen and (max-width: 750px) { @@ -36,11 +37,6 @@ } } - .mat-mdc-button { - width: 185px; - margin-top: 22px; - } - .chart-box, .chart-container { height: 100%; flex-grow: 1; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.ts index 1caab7a462..b17b8ef28a 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.ts @@ -32,7 +32,7 @@ import { Direction, SortOrder } from '@shared/models/page/sort-order'; import { MatTableDataSource } from '@angular/material/table'; import { MatSort } from '@angular/material/sort'; import { NULL_UUID } from '@shared/models/id/has-uuid'; -import {deepClone} from "@core/utils"; +import { deepClone } from '@core/utils'; @Component({ selector: 'tb-gateway-statistics', From 828ac3e197c16a6b939c1c01fe611e8b5bcba3a3 Mon Sep 17 00:00:00 2001 From: ThingsBoard Date: Mon, 15 Jul 2024 15:24:54 +0300 Subject: [PATCH 18/51] UI: remove persisted data in connector for gateway dashboard --- .../widget/lib/gateway/gateway-service-rpc.component.ts | 3 --- 1 file changed, 3 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc.component.ts index dadd1a38d2..1f3327ec06 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc.component.ts @@ -206,9 +206,6 @@ export class GatewayServiceRPCComponent implements OnInit { private updateTemplates() { this.templates = this.subscription.data[0].data[0][1].length ? JSON.parse(this.subscription.data[0].data[0][1]) : []; - if (this.templates.length && this.commandForm.get('params').value == "{}") { - this.commandForm.get('params').patchValue(this.templates[0].config); - } this.cd.detectChanges(); } From ece8132c9001393ac78885eda8d99c6f18ce8d2a Mon Sep 17 00:00:00 2001 From: ThingsBoard Date: Wed, 17 Jul 2024 10:39:16 +0300 Subject: [PATCH 19/51] fixed updating credentials --- .../widget/lib/gateway/gateway-configuration.component.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-configuration.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-configuration.component.ts index 1c65920179..3b2e0e9fc6 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-configuration.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-configuration.component.ts @@ -619,6 +619,9 @@ export class GatewayConfigurationComponent implements OnInit { updateCredentials = true; } else { updateCredentials = this.initialCredentials.credentialsId !== securityConfig.accessToken; + if (updateCredentials) { + this.initialCredentials.credentialsId = securityConfig.accessToken; + } } if (updateCredentials) { newCredentials = { From f48fbc61b4228a838e5a9876699ddc462248ebbe Mon Sep 17 00:00:00 2001 From: mpetrov Date: Thu, 18 Jul 2024 18:18:31 +0300 Subject: [PATCH 20/51] Added extended functionality for building Modbus connector using UI --- .../broker-config-control.component.html | 2 +- .../broker-config-control.component.ts | 15 +- .../mapping-table/mapping-table.component.ts | 39 +-- .../connectors-configuration/modbus/index.ts | 7 + .../modbus-basic-config.component.html | 28 ++ .../modbus-basic-config.component.ts | 130 ++++++++ .../modbus-data-keys-panel.component.html | 147 +++++++++ .../modbus-data-keys-panel.component.scss | 44 +++ .../modbus-data-keys-panel.component.ts | 164 ++++++++++ .../modbus-master-table.component.html | 131 ++++++++ .../modbus-master-table.component.scss | 101 ++++++ .../modbus-master-table.component.ts | 231 +++++++++++++ .../modbus-security-config.component.html | 44 +++ .../modbus-security-config.component.ts | 126 +++++++ .../modbus-slave-config.component.html | 217 +++++++++++++ .../modbus-slave-config.component.ts | 185 +++++++++++ .../modbus-slave-dialog.component.html | 307 ++++++++++++++++++ .../modbus-slave-dialog.component.ts | 198 +++++++++++ .../modbus-values.component.html | 117 +++++++ .../modbus-values/modbus-values.component.ts | 204 ++++++++++++ .../modbus/public-api.ts | 7 + .../opc-server-config.component.html} | 0 .../opc-server-config.component.scss} | 0 .../opc-server-config.component.ts} | 12 +- .../opc-ua-basic-config.component.html | 2 +- .../opc-ua-basic-config.component.ts | 4 +- .../connectors-configuration/public-api.ts | 3 +- .../gateway/gateway-connectors.component.html | 4 + .../gateway/gateway-connectors.component.ts | 4 +- .../lib/gateway/gateway-widget.models.ts | 243 ++++++++++++++ .../widget/widget-components.module.ts | 42 +-- .../gateway-port-tooltip.pipe.ts | 42 +++ .../src/app/modules/home/pipes/public-api.ts | 1 + .../datasource/datasource.abstract.ts | 32 ++ ui-ngx/src/app/shared/abstract/public-api.ts | 1 + .../ellipsis-chip-list.directive.ts | 22 +- .../src/app/shared/directives/public-api.ts | 1 + .../assets/locale/locale.constant-en_US.json | 62 ++++ .../connector-default-configs/modbus.json | 111 +++---- 39 files changed, 2892 insertions(+), 138 deletions(-) create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/index.ts create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.html create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.scss create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.html create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.scss create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.html create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.html create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/public-api.ts rename ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/{server-config/server-config.component.html => opc-server-config/opc-server-config.component.html} (100%) rename ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/{server-config/server-config.component.scss => opc-server-config/opc-server-config.component.scss} (100%) rename ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/{server-config/server-config.component.ts => opc-server-config/opc-server-config.component.ts} (89%) create mode 100644 ui-ngx/src/app/modules/home/pipes/gateway-port-tooltip/gateway-port-tooltip.pipe.ts create mode 100644 ui-ngx/src/app/shared/abstract/datasource/datasource.abstract.ts create mode 100644 ui-ngx/src/app/shared/abstract/public-api.ts rename ui-ngx/src/app/{modules/home/components/widget/lib/gateway/connectors-configuration => shared/directives/ellipsis-chip-list}/ellipsis-chip-list.directive.ts (89%) create mode 100644 ui-ngx/src/app/shared/directives/public-api.ts diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.html index f70ed366e1..b5ef346300 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.html @@ -42,7 +42,7 @@ + + + + + + + + + + + diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts new file mode 100644 index 0000000000..d61d63edb8 --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts @@ -0,0 +1,130 @@ +/// +/// 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. +/// + +import { ChangeDetectionStrategy, Component, forwardRef, Input, OnDestroy, TemplateRef } from '@angular/core'; +import { + ControlValueAccessor, + FormBuilder, + FormGroup, + NG_VALIDATORS, + NG_VALUE_ACCESSOR, + ValidationErrors, + Validator, +} from '@angular/forms'; +import { + ConnectorBaseConfig, + ConnectorType, +} from '@home/components/widget/lib/gateway/gateway-widget.models'; +import { SharedModule } from '@shared/shared.module'; +import { CommonModule } from '@angular/common'; +import { takeUntil } from 'rxjs/operators'; +import { Subject } from 'rxjs'; +import { + ModbusMasterTableComponent, + ModbusSlaveConfigComponent, +} from '@home/components/widget/lib/gateway/connectors-configuration/modbus'; +import { EllipsisChipListDirective } from '@shared/directives/public-api'; + +@Component({ + selector: 'tb-modbus-basic-config', + templateUrl: './modbus-basic-config.component.html', + changeDetection: ChangeDetectionStrategy.OnPush, + providers: [ + { + provide: NG_VALUE_ACCESSOR, + useExisting: forwardRef(() => ModbusBasicConfigComponent), + multi: true + }, + { + provide: NG_VALIDATORS, + useExisting: forwardRef(() => ModbusBasicConfigComponent), + multi: true + } + ], + standalone: true, + imports: [ + CommonModule, + SharedModule, + ModbusSlaveConfigComponent, + ModbusMasterTableComponent, + EllipsisChipListDirective, + ], + styles: [` + :host { + height: 100%; + } + :host ::ng-deep { + .mat-mdc-tab-group, .mat-mdc-tab-body-wrapper { + height: 100%; + } + } + `] +}) + +export class ModbusBasicConfigComponent implements ControlValueAccessor, Validator, OnDestroy { + + @Input() generalTabContent: TemplateRef; + + basicFormGroup: FormGroup; + + onChange: (value: string) => void; + onTouched: () => void; + + protected readonly connectorType = ConnectorType; + private destroy$ = new Subject(); + + constructor(private fb: FormBuilder) { + this.basicFormGroup = this.fb.group({ + master: [], + slave: [], + }); + + this.basicFormGroup.valueChanges + .pipe(takeUntil(this.destroy$)) + .subscribe(value => { + this.onChange(value); + this.onTouched(); + }); + } + + ngOnDestroy(): void { + this.destroy$.next(); + this.destroy$.complete(); + } + + registerOnChange(fn: (value: string) => void): void { + this.onChange = fn; + } + + registerOnTouched(fn: () => void): void { + this.onTouched = fn; + } + + writeValue(basicConfig: ConnectorBaseConfig): void { + const editedBase = { + slave: basicConfig.slave || {}, + master: basicConfig.master || {}, + }; + + this.basicFormGroup.setValue(editedBase, {emitEvent: false}); + } + + validate(): ValidationErrors | null { + return this.basicFormGroup.valid ? null : { + basicFormGroup: {valid: false} + }; + } +} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html new file mode 100644 index 0000000000..08ef83eeb5 --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html @@ -0,0 +1,147 @@ + +
+
+
{{ panelTitle | translate }}{{' (' + keysListFormArray.controls.length + ')'}}
+
+
+
+ + + + +
+ {{ keyControl.get('tag').value }} +
+
+
+ +
+
+ gateway.key +
+
+ + + + warning + + +
+
+
+
+ gateway.type +
+
+ + + {{ type }} + + +
+
+
+
gateway.function-code
+
+ + + {{ ModbusFunctionCodeTranslationsMap.get(code) | translate }} + + +
+
+
+
gateway.objects-count
+
+ + + +
+
+
+
gateway.address
+
+ + + +
+
+
+
gateway.value
+
+ + + +
+
+
+
+
+
+ +
+
+
+ +
+
+ +
+ {{ noKeysText }} +
+
+
+ + +
+
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.scss new file mode 100644 index 0000000000..0e9f9a432f --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.scss @@ -0,0 +1,44 @@ +/** + * 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. + */ + +:host { + .tb-modbus-keys-panel { + width: 77vw; + max-width: 700px; + + .title-container { + max-width: 11vw; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap + } + + .key-panel { + height: 500px; + overflow: auto; + } + + .tb-form-panel { + .mat-mdc-icon-button { + width: 56px; + height: 56px; + padding: 16px; + color: rgba(0, 0, 0, 0.54); + } + } + } +} + diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts new file mode 100644 index 0000000000..a63b2e488e --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts @@ -0,0 +1,164 @@ +/// +/// 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. +/// + +import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'; +import { AbstractControl, FormGroup, UntypedFormArray, UntypedFormBuilder, Validators } from '@angular/forms'; +import { TbPopoverComponent } from '@shared/components/popover.component'; +import { + ModbusDataType, + ModbusFunctionCodeTranslationsMap, + ModbusObjectCountByDataType, + ModbusRegisterType, + ModbusValue, + ModbusValueKey, + noLeadTrailSpacesRegex, +} from '@home/components/widget/lib/gateway/gateway-widget.models'; +import { CommonModule } from '@angular/common'; +import { SharedModule } from '@shared/shared.module'; +import { GatewayHelpLinkPipe } from '@home/pipes/public-api'; + +@Component({ + selector: 'tb-modbus-data-keys-panel', + templateUrl: './modbus-data-keys-panel.component.html', + styleUrls: ['./modbus-data-keys-panel.component.scss'], + standalone: true, + imports: [ + CommonModule, + SharedModule, + GatewayHelpLinkPipe, + ] +}) +export class ModbusDataKeysPanelComponent implements OnInit { + + @Input() isMaster = false; + @Input() panelTitle: string; + @Input() addKeyTitle: string; + @Input() deleteKeyTitle: string; + @Input() noKeysText: string; + @Input() register: ModbusRegisterType; + @Input() keysType: ModbusValueKey; + @Input() values: ModbusValue[]; + @Input() popover: TbPopoverComponent; + + @Output() keysDataApplied = new EventEmitter>(); + + keysListFormArray: UntypedFormArray; + errorText = ''; + modbusDataTypes = Object.values(ModbusDataType); + withFunctionCode = true; + functionCodesMap = new Map(); + defaultFunctionCodes = []; + + readonly editableDataTypes = [ModbusDataType.BYTES, ModbusDataType.BITS, ModbusDataType.STRING]; + readonly ModbusFunctionCodeTranslationsMap = ModbusFunctionCodeTranslationsMap; + readonly defaultReadFunctionCodes = [3, 4]; + readonly defaultWriteFunctionCodes = [5, 6, 15, 16]; + + constructor(private fb: UntypedFormBuilder) {} + + ngOnInit(): void { + this.keysListFormArray = this.prepareKeysFormArray(this.values); + this.withFunctionCode = !this.isMaster || (this.keysType !== ModbusValueKey.ATTRIBUTES && this.keysType !== ModbusValueKey.TELEMENTRY); + this.defaultFunctionCodes = this.getDefaultFunctionCodes(); + } + + trackByKey(_: number, keyControl: AbstractControl): AbstractControl { + return keyControl; + } + + addKey(): void { + const dataKeyFormGroup = this.fb.group({ + tag: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], + value: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], + type: [ModbusDataType.STRING, [Validators.required]], + address: [0, [Validators.required]], + objectsCount: [1, [Validators.required]], + functionCode: [this.getDefaultFunctionCodes()[0]] + }); + this.observeKeyDataType(dataKeyFormGroup); + + this.keysListFormArray.push(dataKeyFormGroup); + } + + deleteKey($event: Event, index: number): void { + if ($event) { + $event.stopPropagation(); + } + this.keysListFormArray.removeAt(index); + this.keysListFormArray.markAsDirty(); + } + + cancel(): void { + this.popover?.hide(); + } + + applyKeysData(): void { + this.keysDataApplied.emit(this.keysListFormArray.value); + } + + private prepareKeysFormArray(values: ModbusValue[]): UntypedFormArray { + const keysControlGroups: Array = []; + if (values) { + values.forEach(keyData => { + const { tag, value, type, address, objectsCount, functionCode } = keyData; + const dataKeyFormGroup = this.fb.group({ + tag: [tag, [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], + value: [value, [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], + type: [type, [Validators.required]], + address: [address, [Validators.required]], + objectsCount: [objectsCount, [Validators.required]], + functionCode: [functionCode, []], + }); + this.observeKeyDataType(dataKeyFormGroup); + this.functionCodesMap.set(tag+address, this.getFunctionCodes(type)); + + keysControlGroups.push(dataKeyFormGroup); + }); + } + return this.fb.array(keysControlGroups); + } + + private observeKeyDataType(keyFormGroup: FormGroup): void { + keyFormGroup.get('type').valueChanges.subscribe(dataType => { + const objectsCountControl = keyFormGroup.get('objectsCount'); + if (!this.editableDataTypes.includes(dataType)) { + objectsCountControl.patchValue(ModbusObjectCountByDataType[dataType]); + } + const keyId = keyFormGroup.get('tag').value + keyFormGroup.get('address').value; + this.functionCodesMap.set(keyId, this.getFunctionCodes(dataType)); + }); + } + + private getFunctionCodes(dataType: ModbusDataType): number[] { + if (this.keysType === ModbusValueKey.ATTRIBUTES_UPDATES) { + return this.defaultWriteFunctionCodes; + } + const functionCodes = this.defaultReadFunctionCodes; + if (dataType === ModbusDataType.BITS) { + const bitsFunctionCodes = [1, 2]; + bitsFunctionCodes.forEach(code => functionCodes.push(code)); + functionCodes.sort(); + } + if (this.keysType === ModbusValueKey.RPC_REQUESTS) { + this.defaultWriteFunctionCodes.forEach(code => functionCodes.push(code)); + } + return functionCodes; + } + + private getDefaultFunctionCodes(): number[] { + return this.keysType === ModbusValueKey.ATTRIBUTES_UPDATES ? this.defaultWriteFunctionCodes : this.defaultReadFunctionCodes; + } +} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.html new file mode 100644 index 0000000000..ac5e6f3108 --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.html @@ -0,0 +1,131 @@ + +
+
+ +
+
+ {{ 'gateway.servers-slaves' | translate}} +
+ + + +
+
+ +
+ + +   + + + +
+
+
+
+ + + {{ 'gateway.name' | translate }} + + + {{ mapping['name'] }} + + + + + {{ 'gateway.client-communication-type' | translate }} + + + {{ ModbusClientTypeLabelsMap.get(mapping['type']) }} + + + + + + +
+ + +
+
+ + + + + +
+
+
+ + +
+
+ +
+
+ + widget.no-data-found + +
+
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.scss new file mode 100644 index 0000000000..82cead07a4 --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.scss @@ -0,0 +1,101 @@ +/** + * 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. + */ +@import '../scss/constants'; + +:host { + width: 100%; + height: 100%; + display: block; + .tb-master-table { + .tb-master-table-content { + width: 100%; + height: 100%; + background: #fff; + overflow: hidden; + + &.tb-outlined-border { + box-shadow: 0 0 0 0 rgb(0 0 0 / 20%), 0 0 0 0 rgb(0 0 0 / 14%), 0 0 0 0 rgb(0 0 0 / 12%); + border: solid 1px #e0e0e0; + border-radius: 4px; + } + + .mat-toolbar-tools{ + min-height: auto; + } + + .title-container{ + overflow: hidden; + } + + .tb-master-table-title { + padding-right: 20px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + + .table-container { + overflow: auto; + .mat-mdc-table { + table-layout: fixed; + min-width: 450px; + + .table-value-column { + padding: 0 12px; + width: 23%; + + &.request-column { + width: 38%; + } + } + } + } + + .ellipsis { + overflow: hidden; + text-overflow: ellipsis; + } + } + } + + .no-data-found { + height: calc(100% - 120px); + } + + @media #{$mat-xs} { + .mat-toolbar { + height: auto; + min-height: 100px; + + .tb-master-table-title{ + padding-bottom: 5px; + width: 100%; + } + } + } +} + +:host ::ng-deep { + mat-cell.tb-value-cell { + cursor: pointer; + .mat-icon { + height: 24px; + width: 24px; + font-size: 24px; + color: #757575 + } + } +} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts new file mode 100644 index 0000000000..b1f2c09689 --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts @@ -0,0 +1,231 @@ +/// +/// 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. +/// + +import { + AfterViewInit, + ChangeDetectionStrategy, + Component, + ElementRef, + forwardRef, + OnDestroy, + OnInit, + ViewChild, +} from '@angular/core'; +import { TranslateService } from '@ngx-translate/core'; +import { MatDialog } from '@angular/material/dialog'; +import { DialogService } from '@core/services/dialog.service'; +import { Subject } from 'rxjs'; +import { debounceTime, distinctUntilChanged, take, takeUntil } from 'rxjs/operators'; +import { + ControlValueAccessor, + FormArray, + FormBuilder, + NG_VALIDATORS, + NG_VALUE_ACCESSOR, + UntypedFormGroup, + ValidationErrors, + Validator, +} from '@angular/forms'; +import { + ModbusClientTypeLabelsMap, ModbusMasterConfig, SlaveConfig, +} from '@home/components/widget/lib/gateway/gateway-widget.models'; +import { isDefinedAndNotNull, isUndefinedOrNull } from '@core/utils'; +import { SharedModule } from '@shared/shared.module'; +import { CommonModule } from '@angular/common'; +import { TbDatasource } from '@shared/abstract/datasource/datasource.abstract'; +import { ModbusSlaveDialogComponent } from '@home/components/widget/lib/gateway/connectors-configuration/modbus'; + +@Component({ + selector: 'tb-modbus-master-table', + templateUrl: './modbus-master-table.component.html', + styleUrls: ['./modbus-master-table.component.scss'], + changeDetection: ChangeDetectionStrategy.OnPush, + providers: [ + { + provide: NG_VALUE_ACCESSOR, + useExisting: forwardRef(() => ModbusMasterTableComponent), + multi: true + }, + { + provide: NG_VALIDATORS, + useExisting: forwardRef(() => ModbusMasterTableComponent), + multi: true + } + ], + standalone: true, + imports: [CommonModule, SharedModule] +}) +export class ModbusMasterTableComponent implements ControlValueAccessor, Validator, AfterViewInit, OnInit, OnDestroy { + + @ViewChild('searchInput') searchInputField: ElementRef; + + textSearchMode = false; + dataSource: SlavesDatasource; + hidePageSize = false; + activeValue = false; + dirtyValue = false; + masterFormGroup: UntypedFormGroup; + textSearch = this.fb.control('', {nonNullable: true}); + + readonly ModbusClientTypeLabelsMap = ModbusClientTypeLabelsMap; + + private onChange: (value: string) => void = () => {}; + private onTouched: () => void = () => {}; + + private destroy$ = new Subject(); + + constructor( + public translate: TranslateService, + public dialog: MatDialog, + private dialogService: DialogService, + private fb: FormBuilder + ) { + this.masterFormGroup = this.fb.group({ slaves: this.fb.array([])}); + this.dirtyValue = !this.activeValue; + this.dataSource = new SlavesDatasource(); + } + + get slaves(): FormArray { + return this.masterFormGroup.get('slaves') as FormArray; + } + + ngOnInit(): void { + this.masterFormGroup.valueChanges.pipe( + takeUntil(this.destroy$) + ).subscribe((value) => { + this.updateTableData(value.slaves); + this.onChange(value); + this.onTouched(); + }); + } + + ngOnDestroy(): void { + this.destroy$.next(); + this.destroy$.complete(); + } + + ngAfterViewInit(): void { + this.textSearch.valueChanges.pipe( + debounceTime(150), + distinctUntilChanged((prev, current) => (prev ?? '') === current.trim()), + takeUntil(this.destroy$) + ).subscribe((text) => { + const searchText = text.trim(); + this.updateTableData(this.slaves.value, searchText.trim()); + }); + } + + registerOnChange(fn: (value: string) => void): void { + this.onChange = fn; + } + + registerOnTouched(fn: () => void): void { + this.onTouched = fn; + } + + writeValue(master: ModbusMasterConfig): void { + this.slaves.clear(); + this.pushDataAsFormArrays(master.slaves); + } + + validate(): ValidationErrors | null { + return this.slaves.controls.length ? null : { + slavesFormGroup: {valid: false} + }; + } + + enterFilterMode(): void { + this.textSearchMode = true; + setTimeout(() => { + this.searchInputField.nativeElement.focus(); + this.searchInputField.nativeElement.setSelectionRange(0, 0); + }, 10); + } + + exitFilterMode(): void { + this.updateTableData(this.slaves.value); + this.textSearchMode = false; + this.textSearch.reset(); + } + + manageSlave($event: Event, index?: number): void { + if ($event) { + $event.stopPropagation(); + } + const value = isDefinedAndNotNull(index) ? this.slaves.at(index).value : {}; + this.dialog.open(ModbusSlaveDialogComponent, { + disableClose: true, + panelClass: ['tb-dialog', 'tb-fullscreen-dialog'], + data: { + value, + buttonTitle: isUndefinedOrNull(index) ? 'action.add' : 'action.apply' + } + }).afterClosed() + .pipe(take(1), takeUntil(this.destroy$)) + .subscribe(res => { + if (res) { + if (isDefinedAndNotNull(index)) { + this.slaves.at(index).patchValue(res); + } else { + this.slaves.push(this.fb.control(res)); + } + this.masterFormGroup.markAsDirty(); + } + }); + } + + deleteMapping($event: Event, index: number): void { + if ($event) { + $event.stopPropagation(); + } + this.dialogService.confirm( + this.translate.instant('gateway.delete-slave-title'), + '', + this.translate.instant('action.no'), + this.translate.instant('action.yes'), + true + ).subscribe((result) => { + if (result) { + this.slaves.removeAt(index); + this.masterFormGroup.markAsDirty(); + } + }); + } + + private updateTableData(data: SlaveConfig[], textSearch?: string): void { + let tableValue = data; + if (textSearch) { + tableValue = tableValue.filter(value => + Object.values(value).some(val => + val.toString().toLowerCase().includes(textSearch.toLowerCase()) + ) + ); + } + this.dataSource.loadData(tableValue); + } + + private pushDataAsFormArrays(slaves: SlaveConfig[]): void { + if (slaves?.length) { + slaves.forEach((slave: SlaveConfig) => this.slaves.push(this.fb.control(slave))); + } + } +} + +export class SlavesDatasource extends TbDatasource { + constructor() { + super(); + } +} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.html new file mode 100644 index 0000000000..900973d327 --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.html @@ -0,0 +1,44 @@ +
+
+
gateway.client-cert-path
+
+ + + +
+
+
+
gateway.private-key-path
+
+ + + +
+
+
+
gateway.password
+
+ + +
+ +
+
+
+
+
+
gateway.server-hostname
+
+ + + +
+
+
+ + + {{ 'gateway.request-client-certificate' | translate }} + + +
+
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts new file mode 100644 index 0000000000..2f5786882b --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts @@ -0,0 +1,126 @@ +/// +/// 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. +/// + +import { ChangeDetectionStrategy, Component, forwardRef, Input, OnChanges, OnDestroy } from '@angular/core'; +import { + ControlValueAccessor, + FormBuilder, + NG_VALIDATORS, + NG_VALUE_ACCESSOR, + UntypedFormGroup, + ValidationErrors, + Validator, + Validators +} from '@angular/forms'; +import { + ModbusSecurity, + noLeadTrailSpacesRegex, +} from '@home/components/widget/lib/gateway/gateway-widget.models'; +import { SharedModule } from '@shared/shared.module'; +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'; + +@Component({ + selector: 'tb-modbus-security-config', + templateUrl: './modbus-security-config.component.html', + changeDetection: ChangeDetectionStrategy.OnPush, + providers: [ + { + provide: NG_VALUE_ACCESSOR, + useExisting: forwardRef(() => ModbusSecurityConfigComponent), + multi: true + }, + { + provide: NG_VALIDATORS, + useExisting: forwardRef(() => ModbusSecurityConfigComponent), + multi: true + } + ], + standalone: true, + imports: [ + CommonModule, + SharedModule, + SecurityConfigComponent, + ] +}) +export class ModbusSecurityConfigComponent implements ControlValueAccessor, Validator, OnChanges, OnDestroy { + + @Input() isMaster = false; + + securityConfigFormGroup: UntypedFormGroup; + + private onChange: (value: ModbusSecurity) => void; + private onTouched: () => void; + + private destroy$ = new Subject(); + + constructor(private fb: FormBuilder) { + this.securityConfigFormGroup = this.fb.group({ + certfile: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + keyfile: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + password: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + server_hostname: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + }); + + this.observeValueChanges(); + } + + ngOnChanges(): void { + if (this.isMaster) { + this.securityConfigFormGroup = this.fb.group({ + certfile: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + keyfile: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + password: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + reqclicert: [false, []], + }); + this.observeValueChanges(); + } + } + + ngOnDestroy(): void { + this.destroy$.next(); + this.destroy$.complete(); + } + + registerOnChange(fn: (value: ModbusSecurity) => void): void { + this.onChange = fn; + } + + registerOnTouched(fn: () => void): void { + this.onTouched = fn; + } + + validate(): ValidationErrors | null { + return this.securityConfigFormGroup.valid ? null : { + serverConfigFormGroup: { valid: false } + }; + } + + writeValue(securityConfig: ModbusSecurity): void { + this.securityConfigFormGroup.patchValue(securityConfig, {emitEvent: false}); + } + + private observeValueChanges(): void { + this.securityConfigFormGroup.valueChanges.pipe( + takeUntil(this.destroy$) + ).subscribe((value: ModbusSecurity) => { + this.onChange(value); + this.onTouched(); + }); + } +} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html new file mode 100644 index 0000000000..43c71958bf --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html @@ -0,0 +1,217 @@ + +
+
+
gateway.server-slave-config
+ + {{ ModbusProtocolLabelsMap.get(type) }} + +
+
+
+
gateway.host
+
+ + + + warning + + +
+
+
+
gateway.port
+
+ + + + warning + + +
+
+ +
+
gateway.port
+
+ + + +
+
+
+
+
+ gateway.method +
+
+ + + {{ ModbusMethodLabelsMap.get(method) }} + + +
+
+
+
+
gateway.unit-id
+
+ + + +
+
+
+
gateway.device-name
+
+ + + +
+
+
+
gateway.device-profile
+
+ + + +
+
+
+
gateway.poll-period
+
+ + + +
+
+
+
gateway.baudrate
+
+ + + +
+
+
+ + + {{ 'gateway.send-data-TB' | translate }} + + +
+ + + +
gateway.advanced-connection-settings
+
+
+
+
+
gateway.byte-order
+
+ + + {{ order }} + + +
+
+ + + + + + {{ 'gateway.tls-connection' | translate }} + + + + + + + +
+
gateway.vendor-name
+
+ + + +
+
+
+
gateway.product-code
+
+ + + +
+
+
+
gateway.vendor-url
+
+ + + +
+
+
+
gateway.product-name
+
+ + + +
+
+
+
gateway.model-name
+
+ + + +
+
+
+
+
+
+
gateway.values
+ +
+
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts new file mode 100644 index 0000000000..3bb21cd9d4 --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts @@ -0,0 +1,185 @@ +/// +/// 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. +/// + +import { ChangeDetectionStrategy, Component, forwardRef, OnDestroy } from '@angular/core'; +import { + ControlValueAccessor, + FormBuilder, + NG_VALIDATORS, + NG_VALUE_ACCESSOR, + UntypedFormControl, + UntypedFormGroup, + ValidationErrors, + Validator, Validators, +} from '@angular/forms'; +import { + ModbusMethodLabelsMap, + ModbusMethodType, + ModbusOrderType, + ModbusProtocolLabelsMap, + ModbusProtocolType, + noLeadTrailSpacesRegex, + PortLimits, SlaveConfig, +} from '@home/components/widget/lib/gateway/gateway-widget.models'; +import { SharedModule } from '@shared/shared.module'; +import { CommonModule } from '@angular/common'; +import { Subject } from 'rxjs'; +import { takeUntil } from 'rxjs/operators'; +import { + ModbusValuesComponent, + ModbusSecurityConfigComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/modbus'; +import { GatewayPortTooltipPipe } from '@home/pipes/public-api'; + +@Component({ + selector: 'tb-modbus-server-config', + templateUrl: './modbus-slave-config.component.html', + changeDetection: ChangeDetectionStrategy.OnPush, + providers: [ + { + provide: NG_VALUE_ACCESSOR, + useExisting: forwardRef(() => ModbusSlaveConfigComponent), + multi: true + }, + { + provide: NG_VALIDATORS, + useExisting: forwardRef(() => ModbusSlaveConfigComponent), + multi: true + } + ], + standalone: true, + imports: [ + CommonModule, + SharedModule, + ModbusValuesComponent, + ModbusSecurityConfigComponent, + GatewayPortTooltipPipe, + ], + styles: [` + :host { + .nested-expansion-header { + .mat-content { + height: 100%; + } + } + } + `], +}) +export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validator, OnDestroy { + + slaveConfigFormGroup: UntypedFormGroup; + showSecurityControl: UntypedFormControl; + ModbusProtocolLabelsMap = ModbusProtocolLabelsMap; + ModbusMethodLabelsMap = ModbusMethodLabelsMap; + portLimits = PortLimits; + + readonly modbusProtocolTypes = Object.values(ModbusProtocolType); + readonly modbusMethodTypes = Object.values(ModbusMethodType); + readonly modbusOrderType = Object.values(ModbusOrderType); + readonly ModbusProtocolType = ModbusProtocolType; + readonly serialSpecificControlKeys = ['serialPort', 'baudrate']; + readonly tcpUdpSpecificControlKeys = ['port', 'security', 'host']; + + private onChange: (value: SlaveConfig) => void; + private onTouched: () => void; + + private destroy$ = new Subject(); + + constructor(private fb: FormBuilder) { + this.showSecurityControl = this.fb.control(false); + this.slaveConfigFormGroup = this.fb.group({ + type: [ModbusProtocolType.TCP, []], + host: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], + port: [null, [Validators.required, Validators.min(PortLimits.MIN), Validators.max(PortLimits.MAX)]], + serialPort: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], + method: [ModbusMethodType.SOCKET, []], + unitId: [null, []], + baudrate: [null, []], + deviceName: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + deviceType: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + pollPeriod: [null, []], + sendDataToThingsBoard: [false, []], + byteOrder:[ModbusOrderType.BIG, []], + security: [], + identity: this.fb.group({ + vendorName: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + productCode: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + vendorUrl: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + productName: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + modelName: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + }), + values: [], + }); + + this.slaveConfigFormGroup.valueChanges.pipe( + takeUntil(this.destroy$) + ).subscribe((value: SlaveConfig) => { + if (value.type === ModbusProtocolType.Serial) { + value.port = value.serialPort; + delete value.serialPort; + } + this.onChange(value); + this.onTouched(); + }); + + this.observeTypeChange(); + } + + ngOnDestroy(): void { + this.destroy$.next(); + this.destroy$.complete(); + } + + registerOnChange(fn: (value: SlaveConfig) => void): void { + this.onChange = fn; + } + + registerOnTouched(fn: () => void): void { + this.onTouched = fn; + } + + validate(): ValidationErrors | null { + return this.slaveConfigFormGroup.valid ? null : { + serverConfigFormGroup: { valid: false } + }; + } + + writeValue(slaveConfig: SlaveConfig): void { + if (slaveConfig.type === ModbusProtocolType.Serial) { + slaveConfig.serialPort = slaveConfig.port as string; + delete slaveConfig.port; + } + this.slaveConfigFormGroup.patchValue(slaveConfig, {emitEvent: false}); + this.showSecurityControl.patchValue(!!slaveConfig.security); + this.updateControlsEnabling(slaveConfig.type); + } + + private observeTypeChange(): void { + this.slaveConfigFormGroup.get('type').valueChanges.pipe(takeUntil(this.destroy$)).subscribe(type => { + this.updateControlsEnabling(type); + }); + } + + private updateControlsEnabling(type: ModbusProtocolType): void { + if (type === ModbusProtocolType.Serial) { + this.serialSpecificControlKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.enable({emitEvent: false})); + this.tcpUdpSpecificControlKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.disable({emitEvent: false})); + } else { + this.serialSpecificControlKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.disable({emitEvent: false})); + this.tcpUdpSpecificControlKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.enable({emitEvent: false})); + } + }; +} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html new file mode 100644 index 0000000000..5c8fb4c397 --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html @@ -0,0 +1,307 @@ + +
+ +

{{ 'gateway.server-slave' | translate }}

+ +
+ +
+
+
+
gateway.name
+
+ + + +
+
+
+
+
+
gateway.server-connection
+ + {{ ModbusProtocolLabelsMap.get(type) }} + +
+
+
+
gateway.host
+
+ + + + warning + + +
+
+
+
gateway.port
+
+ + + + warning + + +
+
+ +
+
gateway.port
+
+ + + +
+
+
+
+
+ gateway.method +
+
+ + + {{ ModbusMethodLabelsMap.get(method) }} + + +
+
+
+ +
+
gateway.baudrate
+
+ + + +
+
+
+
gateway.bytesize
+
+ + + +
+
+
+
gateway.stopbits
+
+ + + +
+
+
+
gateway.parity
+
+ + + +
+
+
+ + + {{ 'gateway.strict' | translate }} + + +
+
+
+
gateway.unit-id
+
+ + + +
+
+
+
gateway.device-name
+
+ + + +
+
+
+
gateway.device-profile
+
+ + + +
+
+
+ + + {{ 'gateway.send-data-on-change' | translate }} + + +
+ + + +
gateway.advanced-connection-settings
+
+
+
+
+
gateway.connection-timeout
+
+ + + +
+
+
+
gateway.byte-order
+
+ + + {{ order }} + + +
+
+
+
gateway.word-order
+
+ + + {{ order }} + + +
+
+ + + + + + {{ 'gateway.tls-connection' | translate }} + + + + + + +
+ + + {{ 'gateway.retries' | translate }} + + +
+
+ + + {{ 'gateway.retries-on-empty' | translate }} + + +
+
+ + + {{ 'gateway.retries-on-invalid' | translate }} + + +
+
+
gateway.poll-period
+
+ + + +
+
+
+
gateway.connect-attempt-time
+
+ + + +
+
+
+
gateway.connect-attempt-count
+
+ + + +
+
+
+
gateway.wait-after-failed-attempts
+
+ + + +
+
+
+
+
+
gateway.values
+ +
+
+
+
+
+ + +
+
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts new file mode 100644 index 0000000000..202ef260c7 --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts @@ -0,0 +1,198 @@ +/// +/// 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. +/// + +import { ChangeDetectionStrategy, Component, forwardRef, Inject, OnDestroy } from '@angular/core'; +import { + FormBuilder, + NG_VALIDATORS, + NG_VALUE_ACCESSOR, + UntypedFormControl, + UntypedFormGroup, + Validators, +} from '@angular/forms'; +import { + MappingInfo, + ModbusMethodLabelsMap, + ModbusMethodType, + ModbusOrderType, + ModbusProtocolLabelsMap, + ModbusProtocolType, + noLeadTrailSpacesRegex, + PortLimits, SlaveConfig, +} from '@home/components/widget/lib/gateway/gateway-widget.models'; +import { SharedModule } from '@shared/shared.module'; +import { CommonModule } from '@angular/common'; +import { Subject } from 'rxjs'; +import { + ModbusValuesComponent, + ModbusSecurityConfigComponent, +} from '@home/components/widget/lib/gateway/connectors-configuration/modbus'; +import { DialogComponent } from '@shared/components/dialog.component'; +import { Store } from '@ngrx/store'; +import { AppState } from '@core/core.state'; +import { Router } from '@angular/router'; +import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; +import { GatewayPortTooltipPipe } from '@home/pipes/gateway-port-tooltip/gateway-port-tooltip.pipe'; +import { takeUntil } from 'rxjs/operators'; + +@Component({ + selector: 'tb-modbus-slave-dialog', + templateUrl: './modbus-slave-dialog.component.html', + changeDetection: ChangeDetectionStrategy.OnPush, + providers: [ + { + provide: NG_VALUE_ACCESSOR, + useExisting: forwardRef(() => ModbusSlaveDialogComponent), + multi: true + }, + { + provide: NG_VALIDATORS, + useExisting: forwardRef(() => ModbusSlaveDialogComponent), + multi: true + } + ], + standalone: true, + imports: [ + CommonModule, + SharedModule, + ModbusValuesComponent, + ModbusSecurityConfigComponent, + GatewayPortTooltipPipe, + ], + styles: [` + :host { + .slaves-config-container { + width: 900px; + } + .nested-expansion-header { + .mat-content { + height: 100%; + overflow: hidden; + } + } + } + `], +}) +export class ModbusSlaveDialogComponent extends DialogComponent implements OnDestroy { + + slaveConfigFormGroup: UntypedFormGroup; + showSecurityControl: UntypedFormControl; + portLimits = PortLimits; + + readonly modbusProtocolTypes = Object.values(ModbusProtocolType); + readonly modbusMethodTypes = Object.values(ModbusMethodType); + readonly modbusOrderType = Object.values(ModbusOrderType); + readonly ModbusProtocolType = ModbusProtocolType; + readonly ModbusProtocolLabelsMap = ModbusProtocolLabelsMap; + readonly ModbusMethodLabelsMap = ModbusMethodLabelsMap; + readonly modbusHelpLink = + 'https://thingsboard.io/docs/iot-gateway/config/modbus/#section-master-description-and-configuration-parameters'; + readonly serialSpecificControlKeys = ['serialPort', 'baudrate', 'stopbits', 'bytesize', 'parity', 'strict']; + readonly tcpUdpSpecificControlKeys = ['port', 'security', 'host']; + + private destroy$ = new Subject(); + + constructor( + private fb: FormBuilder, + protected store: Store, + protected router: Router, + @Inject(MAT_DIALOG_DATA) public data: MappingInfo, + public dialogRef: MatDialogRef, + ) { + super(store, router, dialogRef); + + this.showSecurityControl = this.fb.control(false); + this.slaveConfigFormGroup = this.fb.group({ + name: ['', [Validators.required]], + type: [ModbusProtocolType.TCP, [Validators.required]], + host: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], + port: [null, [Validators.required, Validators.min(PortLimits.MIN), Validators.max(PortLimits.MAX)]], + serialPort: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + method: [ModbusMethodType.SOCKET, []], + baudrate: [null, []], + stopbits: [null, []], + bytesize: [null, []], + parity: [null, []], + strict: [false, []], + unitId: [null, []], + deviceName: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + deviceType: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + sendDataOnlyOnChange: [false, []], + timeout: [], + byteOrder: [ModbusOrderType.BIG, []], + wordOrder: [ModbusOrderType.BIG, []], + retries: [false, []], + retryOnEmpty: [false, []], + retryOnInvalid: [false, []], + pollPeriod: [null, []], + connectAttemptTimeMs: [null, []], + connectAttemptCount: [null, []], + waitAfterFailedAttemptsMs: [null, []], + values: [{}, []], + security: [], + }); + + this.slaveConfigFormGroup.patchValue({ + ...this.data.value, + values: { + attributes: this.data.value.attributes ?? [], + timeseries: this.data.value.timeseries ?? [], + attributeUpdates: this.data.value.attributeUpdates ?? [], + rpc: this.data.value.rpc ?? [], + } + }); + this.showSecurityControl.patchValue(!!this.data.value.security); + this.updateControlsEnabling(this.data.value.type); + this.observeTypeChange(); + } + + ngOnDestroy(): void { + this.destroy$.next(); + this.destroy$.complete(); + } + + cancel(): void { + this.dialogRef.close(null); + } + + add(): void { + if (this.slaveConfigFormGroup.valid) { + const slaveResult = {...this.slaveConfigFormGroup.value, ...this.slaveConfigFormGroup.value.values}; + delete slaveResult.values; + if (slaveResult.type === ModbusProtocolType.Serial) { + slaveResult.port = slaveResult.serialPort; + delete slaveResult.serialPort; + } + this.dialogRef.close(slaveResult); + } + } + + private observeTypeChange(): void { + this.slaveConfigFormGroup.get('type').valueChanges.pipe(takeUntil(this.destroy$)).subscribe(type => { + this.updateControlsEnabling(type); + }); + } + + private updateControlsEnabling(type: ModbusProtocolType): void { + if (type === ModbusProtocolType.Serial) { + this.serialSpecificControlKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.enable({emitEvent: false})); + this.tcpUdpSpecificControlKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.disable({emitEvent: false})); + } else { + this.serialSpecificControlKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.disable({emitEvent: false})); + this.tcpUdpSpecificControlKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.enable({emitEvent: false})); + } + }; +} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.html new file mode 100644 index 0000000000..5b8077d77c --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.html @@ -0,0 +1,117 @@ + + + +
+ +
+
+ + + + +
+ +
+
+
+
+ + +
+
gateway.attributes
+
+ + + {{ attribute.tag }} + + + + + + +
+
+
+
gateway.telementry
+
+ + + {{ telemetry.tag }} + + + + + + +
+
+
+
gateway.attribute-updates
+
+ + + {{ attributeUpdate.tag }} + + + + + + +
+
+
+
gateway.rpc-requests
+
+ + + {{ rpcRequest.tag }} + + + + + + +
+
+
+ diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts new file mode 100644 index 0000000000..76b376fb1b --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts @@ -0,0 +1,204 @@ +/// +/// 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. +/// + +import { + ChangeDetectionStrategy, + ChangeDetectorRef, + Component, + forwardRef, + Input, + OnChanges, + OnDestroy, + Renderer2, + ViewContainerRef +} from '@angular/core'; +import { + ControlValueAccessor, + FormBuilder, + FormGroup, + NG_VALIDATORS, + NG_VALUE_ACCESSOR, + ValidationErrors, + Validator, +} from '@angular/forms'; +import { + ModbusKeysAddKeyTranslationsMap, + ModbusKeysDeleteKeyTranslationsMap, + ModbusKeysNoKeysTextTranslationsMap, + ModbusKeysPanelTitleTranslationsMap, + ModbusRegisterTranslationsMap, + ModbusRegisterType, + ModbusRegisterValues, + ModbusValueKey, +} from '@home/components/widget/lib/gateway/gateway-widget.models'; +import { SharedModule } from '@shared/shared.module'; +import { CommonModule } from '@angular/common'; +import { ModbusDataKeysPanelComponent } from '@home/components/widget/lib/gateway/connectors-configuration/public-api'; +import { takeUntil } from 'rxjs/operators'; +import { Subject } from 'rxjs'; +import { EllipsisChipListDirective } from '@shared/directives/public-api'; +import { MatButton } from '@angular/material/button'; +import { TbPopoverService } from '@shared/components/popover.service'; + +@Component({ + selector: 'tb-modbus-values', + templateUrl: './modbus-values.component.html', + changeDetection: ChangeDetectionStrategy.OnPush, + providers: [ + { + provide: NG_VALUE_ACCESSOR, + useExisting: forwardRef(() => ModbusValuesComponent), + multi: true + }, + { + provide: NG_VALIDATORS, + useExisting: forwardRef(() => ModbusValuesComponent), + multi: true + } + ], + standalone: true, + imports: [ + CommonModule, + SharedModule, + EllipsisChipListDirective, + ], + styles: [` + :host { + .mat-mdc-tab-body-wrapper { + min-height: 320px; + } + } + `] +}) + +export class ModbusValuesComponent implements ControlValueAccessor, Validator, OnChanges, OnDestroy { + + @Input() singleMode = false; + + modbusRegisterTypes: ModbusRegisterType[] = Object.values(ModbusRegisterType); + modbusValueKeys = Object.values(ModbusValueKey); + ModbusValuesTranslationsMap = ModbusRegisterTranslationsMap; + ModbusValueKey = ModbusValueKey; + valuesFormGroup: FormGroup; + + private onChange: (value: string) => void; + private onTouched: () => void; + + private destroy$ = new Subject(); + + constructor(private fb: FormBuilder, + private popoverService: TbPopoverService, + private renderer: Renderer2, + private viewContainerRef: ViewContainerRef, + private cdr: ChangeDetectorRef, + ) { + this.valuesFormGroup = this.fb.group(this.modbusRegisterTypes.reduce((registersAcc, register) => { + return { + ...registersAcc, + [register]: this.fb.group(this.modbusValueKeys.reduce((acc, key) => ({...acc, [key]: [[], []]}), {})), + }; + }, {})); + + this.observeValuesChanges(); + } + + ngOnChanges(): void { + if (this.singleMode) { + this.valuesFormGroup = this.fb.group(this.modbusValueKeys.reduce((acc, key) => ({...acc, [key]: [[], []]}), {})); + this.observeValuesChanges(); + } + } + + ngOnDestroy(): void { + this.destroy$.next(); + this.destroy$.complete(); + } + + registerOnChange(fn: (value: string) => void): void { + this.onChange = fn; + } + + registerOnTouched(fn: () => void): void { + this.onTouched = fn; + } + + writeValue(values: ModbusRegisterValues): void { + this.valuesFormGroup.patchValue(values, {emitEvent: false}); + } + + validate(): ValidationErrors | null { + return this.valuesFormGroup.valid ? null : { + valuesFormGroup: {valid: false} + }; + } + + getValueGroup(valueKey: ModbusValueKey, register?: ModbusRegisterType) { + return register ? this.valuesFormGroup.get(register).get(valueKey).value : this.valuesFormGroup.get(valueKey).value; + } + + manageKeys($event: Event, matButton: MatButton, keysType: ModbusValueKey, register?: ModbusRegisterType): void { + if ($event) { + $event.stopPropagation(); + } + const trigger = matButton._elementRef.nativeElement; + if (this.popoverService.hasPopover(trigger)) { + this.popoverService.hidePopover(trigger); + } else { + const group = this.valuesFormGroup; + + const keysControl = register ? group.get(register).get(keysType) : group.get(keysType); + const ctx = { + values: keysControl.value, + isMaster: !this.singleMode, + keysType, + panelTitle: ModbusKeysPanelTitleTranslationsMap.get(keysType), + addKeyTitle: ModbusKeysAddKeyTranslationsMap.get(keysType), + deleteKeyTitle: ModbusKeysDeleteKeyTranslationsMap.get(keysType), + noKeysText: ModbusKeysNoKeysTextTranslationsMap.get(keysType) + }; + const dataKeysPanelPopover = this.popoverService.displayPopover( + trigger, + this.renderer, + this.viewContainerRef, + ModbusDataKeysPanelComponent, + 'leftBottom', + false, + null, + ctx, + {}, + {}, + {}, + true + ); + dataKeysPanelPopover.tbComponentRef.instance.popover = dataKeysPanelPopover; + dataKeysPanelPopover.tbComponentRef.instance.keysDataApplied.pipe(takeUntil(this.destroy$)).subscribe((keysData) => { + dataKeysPanelPopover.hide(); + keysControl.patchValue(keysData); + keysControl.markAsDirty(); + this.cdr.markForCheck(); + }); + } + } + + private observeValuesChanges(): void { + this.valuesFormGroup.valueChanges + .pipe(takeUntil(this.destroy$)) + .subscribe(value => { + this.onChange(value); + this.onTouched(); + }); + } +} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/public-api.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/public-api.ts new file mode 100644 index 0000000000..803a8ff8dd --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/public-api.ts @@ -0,0 +1,7 @@ +export * from './modbus-basic-config/modbus-basic-config.component'; +export * from './modbus-values/modbus-values.component'; +export * from './modbus-data-keys-panel/modbus-data-keys-panel.component'; +export * from './modbus-slave-config/modbus-slave-config.component'; +export * from './modbus-master-table/modbus-master-table.component'; +export * from './modbus-slave-dialog/modbus-slave-dialog.component'; +export * from './modbus-security-config/modbus-security-config.component'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.html similarity index 100% rename from ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.html rename to ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.html diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.scss similarity index 100% rename from ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.scss rename to ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.scss diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.ts similarity index 89% rename from ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts rename to ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.ts index 98a36182a6..955e7e8145 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.ts @@ -38,19 +38,19 @@ import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; @Component({ - selector: 'tb-server-config', - templateUrl: './server-config.component.html', - styleUrls: ['./server-config.component.scss'], + selector: 'tb-opc-server-config', + templateUrl: './opc-server-config.component.html', + styleUrls: ['./opc-server-config.component.scss'], changeDetection: ChangeDetectionStrategy.OnPush, providers: [ { provide: NG_VALUE_ACCESSOR, - useExisting: forwardRef(() => ServerConfigComponent), + useExisting: forwardRef(() => OpcServerConfigComponent), multi: true }, { provide: NG_VALIDATORS, - useExisting: forwardRef(() => ServerConfigComponent), + useExisting: forwardRef(() => OpcServerConfigComponent), multi: true } ], @@ -61,7 +61,7 @@ import { takeUntil } from 'rxjs/operators'; SecurityConfigComponent, ] }) -export class ServerConfigComponent implements ControlValueAccessor, Validator, OnDestroy { +export class OpcServerConfigComponent implements ControlValueAccessor, Validator, OnDestroy { securityPolicyTypes = SecurityPolicyTypes; serverConfigFormGroup: UntypedFormGroup; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-ua-basic-config/opc-ua-basic-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-ua-basic-config/opc-ua-basic-config.component.html index 1089fd114c..5f8b25af9d 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-ua-basic-config/opc-ua-basic-config.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-ua-basic-config/opc-ua-basic-config.component.html @@ -20,7 +20,7 @@ - +
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-ua-basic-config/opc-ua-basic-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-ua-basic-config/opc-ua-basic-config.component.ts index 2c1dd7dd2b..67aa4d9bd3 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-ua-basic-config/opc-ua-basic-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-ua-basic-config/opc-ua-basic-config.component.ts @@ -35,7 +35,7 @@ import { BrokerConfigControlComponent, MappingTableComponent, SecurityConfigComponent, - ServerConfigComponent, + OpcServerConfigComponent, WorkersConfigControlComponent } from '@home/components/widget/lib/gateway/connectors-configuration/public-api'; import { takeUntil } from 'rxjs/operators'; @@ -65,7 +65,7 @@ import { Subject } from 'rxjs'; WorkersConfigControlComponent, BrokerConfigControlComponent, MappingTableComponent, - ServerConfigComponent, + OpcServerConfigComponent, ], styleUrls: ['./opc-ua-basic-config.component.scss'] }) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/public-api.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/public-api.ts index 5e185ddf0a..f98e6c569e 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/public-api.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/public-api.ts @@ -17,10 +17,11 @@ export * from './mapping-table/mapping-table.component'; export * from './device-info-table/device-info-table.component'; export * from './security-config/security-config.component'; -export * from './server-config/server-config.component'; +export * from './opc-server-config/opc-server-config.component'; export * from './mapping-data-keys-panel/mapping-data-keys-panel.component'; export * from './type-value-panel/type-value-panel.component'; export * from './broker-config-control/broker-config-control.component'; export * from './workers-config-control/workers-config-control.component'; export * from './opc-ua-basic-config/opc-ua-basic-config.component'; export * from './mqtt-basic-config/mqtt-basic-config.component'; +export * from './modbus/public-api'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.html index 7896ac2516..5fc5693bec 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.html @@ -182,6 +182,10 @@ formControlName="basicConfig" [generalTabContent]="generalTabContent"> + + diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts index 14a8c15c00..a3ededb498 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts @@ -92,7 +92,8 @@ export class GatewayConnectorComponent extends PageComponent implements AfterVie allowBasicConfig = new Set([ ConnectorType.MQTT, - ConnectorType.OPCUA + ConnectorType.OPCUA, + ConnectorType.MODBUS, ]); gatewayLogLevel = Object.values(GatewayLogLevel); @@ -732,6 +733,7 @@ export class GatewayConnectorComponent extends PageComponent implements AfterVie switch (connector.type) { case ConnectorType.MQTT: case ConnectorType.OPCUA: + case ConnectorType.MODBUS: this.connectorForm.get('type').patchValue(connector.type, {emitValue: false, onlySelf: true}); setTimeout(() => { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-widget.models.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-widget.models.ts index 9805008503..3e6471c0b1 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-widget.models.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-widget.models.ts @@ -181,6 +181,8 @@ export interface ConnectorBaseConfig { server?: ServerConfig; broker?: BrokerConfig; workers?: WorkersConfig; + master?: ModbusMasterConfig; + slave?: ModbusSlave; } export interface WorkersConfig { @@ -739,3 +741,244 @@ export const SecurityPolicyTypes = [ { value: SecurityPolicy.BASIC256, name: 'Basic256' }, { value: SecurityPolicy.BASIC256SHA, name: 'Basic256SHA256' } ]; + +export enum ModbusProtocolType { + TCP = 'tcp', + UDP = 'udp', + Serial = 'serial', +} + +export const ModbusProtocolLabelsMap = new Map( + [ + [ModbusProtocolType.TCP, 'TCP'], + [ModbusProtocolType.UDP, 'UDP'], + [ModbusProtocolType.Serial, 'Serial'], + ] +); + +export enum ModbusMethodType { + SOCKET = 'socket', + RTU = 'rtu', +} + +export const ModbusMethodLabelsMap = new Map( + [ + [ModbusMethodType.SOCKET, 'Socket'], + [ModbusMethodType.RTU, 'RTU'], + ] +); + +export enum ModbusOrderType { + BIG = 'BIG', + LITTLE = 'LITTLE', +} + +export enum ModbusRegisterType { + HoldingRegister = 'holding_registers', + CoilsInitializer = 'coils_initializer', + InputRegister = 'input_registers', + DiscreteInputs = 'discrete_inputs' +} + +export const ModbusRegisterTranslationsMap = new Map( + [ + [ModbusRegisterType.HoldingRegister, 'gateway.holding_registers'], + [ModbusRegisterType.CoilsInitializer, 'gateway.coils_initializer'], + [ModbusRegisterType.InputRegister, 'gateway.input_registers'], + [ModbusRegisterType.DiscreteInputs, 'gateway.discrete_inputs'] + ] +); + +export enum ModbusDataType { + STRING = 'string', + BYTES = 'bytes', + BITS = 'bits', + INT16 = '16int', + UINT16 = '16uint', + FLOAT16 = '16float', + INT32 = '32int', + UINT32 = '32uint', + FLOAT32 = '32float', + INT64 = '64int', + UINT64 = '64uint', + FLOAT64 = '64float' +} + +export enum ModbusObjectCountByDataType { + '16int' = 1, + '16uint' = 1, + '16float' = 1, + '32int' = 2, + '32uint' = 2, + '32float' = 2, + '64int' = 4, + '64uint' = 4, + '64float' = 4, +} + +export enum ModbusValueField { + Tag = 'tag', + Type = 'type', + ObjectsCount = 'objectsCount', + Address = 'address', + Value = 'value', +} + +export const ModbusFieldsTranslationsMap = new Map( + [ + [ModbusValueField.Tag, 'gateway.tag'], + [ModbusValueField.Type, 'gateway.type'], + [ModbusValueField.ObjectsCount, 'gateway.objects_count'], + [ModbusValueField.Address, 'gateway.address'], + [ModbusValueField.Value, 'gateway.value'] + ] +); + +export enum ModbusValueKey { + ATTRIBUTES = 'attributes', + TELEMENTRY = 'timeseries', + ATTRIBUTES_UPDATES = 'attributeUpdates', + RPC_REQUESTS = 'rpc', +} + +export const ModbusKeysPanelTitleTranslationsMap = new Map( + [ + [ModbusValueKey.ATTRIBUTES, 'gateway.attributes'], + [ModbusValueKey.TELEMENTRY, 'gateway.telementry'], + [ModbusValueKey.ATTRIBUTES_UPDATES, 'gateway.attribute-updates'], + [ModbusValueKey.RPC_REQUESTS, 'gateway.rpc-requests'] + ] +); + +export const ModbusKeysAddKeyTranslationsMap = new Map( + [ + [ModbusValueKey.ATTRIBUTES, 'gateway.add-attribute'], + [ModbusValueKey.TELEMENTRY, 'gateway.add-telementry'], + [ModbusValueKey.ATTRIBUTES_UPDATES, 'gateway.add-attribute-update'], + [ModbusValueKey.RPC_REQUESTS, 'gateway.add-rpc-request'] + ] +); + +export const ModbusKeysDeleteKeyTranslationsMap = new Map( + [ + [ModbusValueKey.ATTRIBUTES, 'gateway.delete-attribute'], + [ModbusValueKey.TELEMENTRY, 'gateway.delete-telementry'], + [ModbusValueKey.ATTRIBUTES_UPDATES, 'gateway.delete-attribute-update'], + [ModbusValueKey.RPC_REQUESTS, 'gateway.delete-rpc-requests'] + ] +); + +export const ModbusKeysNoKeysTextTranslationsMap = new Map( + [ + [ModbusValueKey.ATTRIBUTES, 'gateway.no-attributes'], + [ModbusValueKey.TELEMENTRY, 'gateway.no-telementry'], + [ModbusValueKey.ATTRIBUTES_UPDATES, 'gateway.no-attribute-updates'], + [ModbusValueKey.RPC_REQUESTS, 'gateway.no-rpc-requests'] + ] +); + +export const ModbusClientTypeLabelsMap = new Map( + [ + [ModbusProtocolType.TCP, 'TCP/UDP'], + [ModbusProtocolType.UDP, 'TCP/UDP'], + [ModbusProtocolType.Serial, 'Serial'], + ] +); + +export const ModbusFunctionCodeTranslationsMap = new Map( + [ + [1, 'gateway.read-coils'], + [2, 'gateway.read-discrete-inputs'], + [3, 'gateway.read-multiple-holding-registers'], + [4, 'gateway.read-input-registers'], + [5, 'gateway.write-coil'], + [6, 'gateway.write-register'], + [15, 'gateway.write-coils'], + [16, 'gateway.write-registers'], + ] +); + +export interface ModbusMasterConfig { + slaves: SlaveConfig[]; +} + +export interface SlaveConfig { + name: string; + host?: string; + port: string | number; + serialPort?: string; + type: ModbusProtocolType; + method: ModbusMethodType; + timeout: number; + byteOrder: ModbusOrderType; + wordOrder: ModbusOrderType; + retries: boolean; + retryOnEmpty: boolean; + retryOnInvalid: boolean; + pollPeriod: number; + unitId: number; + deviceName: string; + deviceType?: string; + sendDataOnlyOnChange: boolean; + connectAttemptTimeMs: number; + connectAttemptCount: number; + waitAfterFailedAttemptsMs: number; + attributes: ModbusValue[]; + timeseries: ModbusValue[]; + attributeUpdates: ModbusValue[]; + rpc: ModbusValue[]; + security?: ModbusSecurity; + baudrate?: number; + stopbits?: number; + bytesize?: number; + parity?: string; + strict?: boolean; +} + +export interface ModbusValue { + tag: string; + type: ModbusDataType; + functionCode?: number; + objectsCount: number; + address: number; + value?: string; +} + +export interface ModbusSecurity { + certfile?: string; + keyfile?: string; + password?: string; + server_hostname?: string; +} + +export interface ModbusSlave { + host?: string; + type: ModbusProtocolType; + method: ModbusMethodType; + unitId: number; + baudrate?: number; + deviceName: string; + deviceType: string; + pollPeriod: number; + sendDataToThingsBoard: boolean; + byteOrder: ModbusOrderType; + identity: ModbusIdentity; + values: ModbusRegisterValues; + port: string | number; + security: ModbusSecurity; +} + +export interface ModbusRegisterValues { + attributes: ModbusValue[]; + timeseries: ModbusValue[]; + attributeUpdates: ModbusValue[]; + rpc: ModbusValue[]; +} + +export interface ModbusIdentity { + vendorName?: string; + productCode?: string; + vendorUrl?: string; + productName?: string; + modelName?: string; +} diff --git a/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts b/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts index 1d28f139c0..3c2b7affc1 100644 --- a/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts +++ b/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts @@ -90,9 +90,6 @@ import { ToggleButtonWidgetComponent } from '@home/components/widget/lib/button/ import { TimeSeriesChartWidgetComponent } from '@home/components/widget/lib/chart/time-series-chart-widget.component'; import { AddConnectorDialogComponent } from '@home/components/widget/lib/gateway/dialog/add-connector-dialog.component'; import { MappingDialogComponent } from '@home/components/widget/lib/gateway/dialog/mapping-dialog.component'; -import { - EllipsisChipListDirective -} from '@home/components/widget/lib/gateway/connectors-configuration/ellipsis-chip-list.directive'; import { StatusWidgetComponent } from '@home/components/widget/lib/indicator/status-widget.component'; import { LatestChartComponent } from '@home/components/widget/lib/chart/latest-chart.component'; import { PieChartWidgetComponent } from '@home/components/widget/lib/chart/pie-chart-widget.component'; @@ -120,10 +117,12 @@ import { MappingTableComponent, MqttBasicConfigComponent, OpcUaBasicConfigComponent, - ServerConfigComponent, + OpcServerConfigComponent, TypeValuePanelComponent, WorkersConfigControlComponent, + ModbusBasicConfigComponent } from '@home/components/widget/lib/gateway/connectors-configuration/public-api'; +import { EllipsisChipListDirective } from '@shared/directives/public-api'; @NgModule({ declarations: [ @@ -163,7 +162,6 @@ import { GatewayConfigurationComponent, GatewayRemoteConfigurationDialogComponent, GatewayServiceRPCConnectorTemplateDialogComponent, - EllipsisChipListDirective, ValueCardWidgetComponent, AggregatedValueCardWidgetComponent, CountWidgetComponent, @@ -193,22 +191,24 @@ import { LabelValueCardWidgetComponent, UnreadNotificationWidgetComponent, NotificationTypeFilterPanelComponent], - imports: [ - CommonModule, - SharedModule, - RpcWidgetsModule, - HomePageWidgetsModule, - SharedHomeComponentsModule, - RestConnectorSecurityComponent, - GatewayHelpLinkPipe, - BrokerConfigControlComponent, - WorkersConfigControlComponent, - ServerConfigComponent, - MqttBasicConfigComponent, - MappingTableComponent, - OpcUaBasicConfigComponent, - KeyValueIsNotEmptyPipe - ], + imports: [ + CommonModule, + SharedModule, + RpcWidgetsModule, + HomePageWidgetsModule, + SharedHomeComponentsModule, + RestConnectorSecurityComponent, + GatewayHelpLinkPipe, + BrokerConfigControlComponent, + WorkersConfigControlComponent, + OpcServerConfigComponent, + MqttBasicConfigComponent, + MappingTableComponent, + OpcUaBasicConfigComponent, + KeyValueIsNotEmptyPipe, + ModbusBasicConfigComponent, + EllipsisChipListDirective, + ], exports: [ EntitiesTableWidgetComponent, AlarmsTableWidgetComponent, diff --git a/ui-ngx/src/app/modules/home/pipes/gateway-port-tooltip/gateway-port-tooltip.pipe.ts b/ui-ngx/src/app/modules/home/pipes/gateway-port-tooltip/gateway-port-tooltip.pipe.ts new file mode 100644 index 0000000000..9ff3e134c6 --- /dev/null +++ b/ui-ngx/src/app/modules/home/pipes/gateway-port-tooltip/gateway-port-tooltip.pipe.ts @@ -0,0 +1,42 @@ +/// +/// 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. +/// + +import { Pipe, PipeTransform } from '@angular/core'; +import { PortLimits, } from '@home/components/widget/lib/gateway/gateway-widget.models'; +import { AbstractControl } from '@angular/forms'; +import { TranslateService } from '@ngx-translate/core'; + +@Pipe({ + name: 'getGatewayPortTooltip', + standalone: true, +}) +export class GatewayPortTooltipPipe implements PipeTransform { + + constructor(private translate: TranslateService) {} + + transform(portControl: AbstractControl): string { + if (portControl.hasError('required')) { + return this.translate.instant('gateway.port-required'); + } else if ( + portControl.hasError('min') || + portControl.hasError('max') + ) { + return this.translate.instant('gateway.port-limits-error', + {min: PortLimits.MIN, max: PortLimits.MAX}); + } + return ''; + } +} diff --git a/ui-ngx/src/app/modules/home/pipes/public-api.ts b/ui-ngx/src/app/modules/home/pipes/public-api.ts index 1cb3ce312a..9db71f9a06 100644 --- a/ui-ngx/src/app/modules/home/pipes/public-api.ts +++ b/ui-ngx/src/app/modules/home/pipes/public-api.ts @@ -15,3 +15,4 @@ /// export * from './gateway-help-link/gateway-help-link.pipe'; +export * from './gateway-port-tooltip/gateway-port-tooltip.pipe'; diff --git a/ui-ngx/src/app/shared/abstract/datasource/datasource.abstract.ts b/ui-ngx/src/app/shared/abstract/datasource/datasource.abstract.ts new file mode 100644 index 0000000000..fd8808c9cf --- /dev/null +++ b/ui-ngx/src/app/shared/abstract/datasource/datasource.abstract.ts @@ -0,0 +1,32 @@ +import { DataSource } from '@angular/cdk/collections'; +import { BehaviorSubject, Observable } from 'rxjs'; +import { map } from 'rxjs/operators'; + +export abstract class TbDatasource implements DataSource { + + protected dataSubject = new BehaviorSubject>([]); + + connect(): Observable> { + return this.dataSubject.asObservable(); + } + + disconnect(): void { + this.dataSubject.complete(); + } + + loadData(data: Array): void { + this.dataSubject.next(data); + } + + isEmpty(): Observable { + return this.dataSubject.pipe( + map((data: DataType[]) => !data.length) + ); + } + + total(): Observable { + return this.dataSubject.pipe( + map((data: DataType[]) => data.length) + ); + } +} diff --git a/ui-ngx/src/app/shared/abstract/public-api.ts b/ui-ngx/src/app/shared/abstract/public-api.ts new file mode 100644 index 0000000000..4345e3f4f2 --- /dev/null +++ b/ui-ngx/src/app/shared/abstract/public-api.ts @@ -0,0 +1 @@ +export * from './datasource/datasource.abstract'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/ellipsis-chip-list.directive.ts b/ui-ngx/src/app/shared/directives/ellipsis-chip-list/ellipsis-chip-list.directive.ts similarity index 89% rename from ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/ellipsis-chip-list.directive.ts rename to ui-ngx/src/app/shared/directives/ellipsis-chip-list/ellipsis-chip-list.directive.ts index aa4738d707..4c44203b64 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/ellipsis-chip-list.directive.ts +++ b/ui-ngx/src/app/shared/directives/ellipsis-chip-list/ellipsis-chip-list.directive.ts @@ -20,7 +20,8 @@ import { Inject, Input, OnDestroy, - Renderer2 + Renderer2, + AfterViewInit, } from '@angular/core'; import { isEqual } from '@core/utils'; import { TranslateService } from '@ngx-translate/core'; @@ -30,13 +31,15 @@ import { takeUntil } from 'rxjs/operators'; @Directive({ // eslint-disable-next-line @angular-eslint/directive-selector - selector: '[tb-ellipsis-chip-list]' + selector: '[tb-ellipsis-chip-list]', + standalone: true, }) -export class EllipsisChipListDirective implements OnDestroy { +export class EllipsisChipListDirective implements OnDestroy, AfterViewInit { chipsValue: string[]; private destroy$ = new Subject(); + private intersectionObserver: IntersectionObserver; @Input('tb-ellipsis-chip-list') set chips(value: string[]) { @@ -59,6 +62,18 @@ export class EllipsisChipListDirective implements OnDestroy { ).subscribe(() => { this.adjustChips(); }); + + this.intersectionObserver = new IntersectionObserver((entries) => { + entries.forEach(entry => { + if (entry.isIntersecting) { + this.adjustChips(); + } + }); + }); + } + + ngAfterViewInit(): void { + this.intersectionObserver.observe(this.el.nativeElement); } private adjustChips(): void { @@ -124,5 +139,6 @@ export class EllipsisChipListDirective implements OnDestroy { ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); + this.intersectionObserver.disconnect(); } } diff --git a/ui-ngx/src/app/shared/directives/public-api.ts b/ui-ngx/src/app/shared/directives/public-api.ts new file mode 100644 index 0000000000..0e94de2a78 --- /dev/null +++ b/ui-ngx/src/app/shared/directives/public-api.ts @@ -0,0 +1 @@ +export * from './ellipsis-chip-list/ellipsis-chip-list.directive'; diff --git a/ui-ngx/src/assets/locale/locale.constant-en_US.json b/ui-ngx/src/assets/locale/locale.constant-en_US.json index 33c8d25652..6517f2214f 100644 --- a/ui-ngx/src/assets/locale/locale.constant-en_US.json +++ b/ui-ngx/src/assets/locale/locale.constant-en_US.json @@ -2755,19 +2755,27 @@ "function": "Function" }, "gateway": { + "address": "Address", "add-entry": "Add configuration", "add-attribute": "Add attribute", "add-attribute-update": "Add attribute update", "add-key": "Add key", "add-timeseries": "Add time series", + "add-telementry": "Add telementry", "add-mapping": "Add mapping", + "add-slave": "Add Slave", "arguments": "Arguments", "add-rpc-method": "Add method", + "add-rpc-request": "Add request", "add-value": "Add argument", + "baudrate": "Baudrate", + "bytesize": "Bytesize", "delete-value": "Delete value", "delete-rpc-method": "Delete method", + "delete-rpc-request": "Delete request", "delete-attribute-update": "Add attribute update", "advanced": "Advanced", + "advanced-connection-settings": "Advanced connection settings", "attributes": "Attributes", "attribute-updates": "Attribute updates", "attribute-filter": "Attribute filter", @@ -2777,6 +2785,8 @@ "attribute-name-expression-required": "Attribute name expression required.", "attribute-name-expression-hint": "Hint for Attribute name expression", "basic": "Basic", + "byte-order": "Byte order", + "word-order": "Word order", "broker": { "connection": "Connection to broker", "name": "Broker name", @@ -2811,6 +2821,9 @@ "connectors-table-actions": "Actions", "connectors-table-key": "Key", "connectors-table-class": "Class", + "connection-timeout": "Connection timeout (s)", + "connect-attempt-time": "Connect attempt time (s)", + "connect-attempt-count": "Connect attempt count", "copy-username": "Copy username", "copy-password": "Copy password", "copy-client-id": "Copy client ID", @@ -2840,6 +2853,7 @@ "device-name-filter-required": "Device name filter is required.", "details": "Details", "delete-mapping-title": "Delete mapping ?", + "delete-slave-title": "Delete slave ?", "download-configuration-file": "Download configuration file", "download-docker-compose": "Download docker-compose.yml for your gateway", "enable-remote-logging": "Enable remote logging", @@ -2858,6 +2872,7 @@ "configuration-delete-dialog-confirm": "Turn Off", "connector-duplicate-name": "Connector with such name already exists.", "connector-side": "Connector side", + "client-communication-type": "Client communication type", "payload-type": "Payload type", "platform-side": "Platform side", "JSON": "JSON", @@ -2877,6 +2892,7 @@ "delete-attribute": "Delete attribute", "delete-key": "Delete key", "delete-timeseries": "Delete time series", + "delete-telementry": "Delete telementry", "default": "Default", "device-node": "Device node", "device-node-required": "Device node required.", @@ -2895,6 +2911,7 @@ "fill-connector-defaults-hint": "This property allows to fill connector configuration with default values on it's creation.", "from-device-request-settings": "Input request parsing", "from-device-request-settings-hint": "These fields support JSONPath expressions to extract a name from incoming message.", + "function-code": "Function code", "to-device-response-settings": "Output request processing", "to-device-response-settings-hint": "For these fields you can use the following variables and they will be replaced with actual values: ${deviceName}, ${attributeKey}, ${attributeValue}", "gateway": "Gateway", @@ -2933,8 +2950,13 @@ "inactivity-timeout-seconds-required": "Inactivity timeout is required", "inactivity-timeout-seconds-min": "Inactivity timeout can not be less then 1", "inactivity-timeout-seconds-pattern": "Inactivity timeout is not valid", + "unit-id": "Unit ID", "host": "Host", "host-required": "Host is required.", + "holding_registers": "Holding register", + "coils_initializer": "Coils initializer", + "input_registers": "Input register", + "discrete_inputs": "Discrete input", "json-parse": "Not valid JSON.", "json-required": "Field cannot be empty.", "JSONPath-hint": "This field supports constants and JSONPath expressions.", @@ -2968,12 +2990,14 @@ "max-messages-queue-for-worker": "Max messages queue per worker", "max-messages-queue-for-worker-hint": "Maximal messages count that will be in the queue \nfor each converter worker.", "max-messages-queue-for-worker-required": "Max messages queue per worker is required.", + "method": "Method", "method-name": "Method name", "method-required": "Method name is required.", "min-pack-send-delay": "Min pack send delay (in ms)", "min-pack-send-delay-required": "Min pack send delay is required", "min-pack-send-delay-min": "Min pack send delay can not be less then 0", "mode": "Mode", + "model-name": "Model name", "mqtt-version": "MQTT version", "name": "Name", "name-required": "Name is required.", @@ -2984,20 +3008,26 @@ "no-gateway-found": "No gateway found.", "no-gateway-matching": " '{{item}}' not found.", "no-timeseries": "No time series", + "no-telementry": "No telementry", "no-keys": "No keys", "no-value": "No arguments", "no-rpc-methods": "No RPC methods", + "no-rpc-requests": "No RPC requests", "path-hint": "The path is local to the gateway file system", "path-logs": "Path to log files", "path-logs-required": "Path is required.", "password": "Password", "password-required": "Password is required.", "permit-without-calls": "Keep alive permit without calls", + "poll-period": "Poll period (s)", "port": "Port", "port-required": "Port is required.", "port-limits-error": "Port should be number from {{min}} to {{max}}.", "private-key-path": "Path to private key file", "path-to-private-key-required": "Path to private key file is required.", + "parity": "Parity", + "product-code": "Product code", + "product-name": "Product name", "raw": "Raw", "retain": "Retain", "retain-hint": "This flag tells the broker to store the message for a topic\nand ensures any new client subscribing to that topic\nwill receive the stored message.", @@ -3006,6 +3036,9 @@ "remove-entry": "Remove configuration", "remote-shell": "Remote shell", "remote-configuration": "Remote Configuration", + "retries": "Retries", + "retries-on-empty": "Retries on empty", + "retries-on-invalid": "Retries on invalid", "rpc": { "title": "{{type}} Connector RPC parameters", "templates-title": "Connector RPC Templates", @@ -3097,6 +3130,7 @@ "json-value-invalid": "JSON value has an invalid format" }, "rpc-methods": "RPC methods", + "rpc-requests": "RPC requests", "request" : { "connect-request": "Connect request", "disconnect-request": "Disconnect request", @@ -3108,6 +3142,7 @@ "requests-mapping": "Requests mapping", "requests-mapping-hint": "MQTT Connector requests allows you to connect, disconnect, process attribute requests from the device, handle attribute updates on the server and RPC processing configuration.", "request-topic-expression": "Request topic expression", + "request-client-certificate": "Request client certificate", "request-topic-expression-required": "Request topic expression is required.", "response-timeout": "Response timeout (ms)", "response-timeout-required": "Response timeout is required.", @@ -3118,7 +3153,10 @@ "response-topic-expression-required": "Response topic expression is required.", "response-value-expression": "Response value expression", "response-value-expression-required": "Response value expression is required.", + "vendor-name": "Vendor name", + "vendor-url": "Vendor URL", "value": "Value", + "values": "Values", "value-required": "Value is required.", "value-expression": "Value expression", "value-expression-required": "Value expression is required.", @@ -3141,11 +3179,21 @@ }, "select-connector": "Select connector to display config", "send-change-data": "Send data only on change", + "send-data-TB": "Send data to ThingsBoard", + "send-data-on-change": "Send data only on change", "send-change-data-hint": "The values will be saved to the database only if they are different from the corresponding values in the previous converted message. This functionality applies to both attributes and time series in the converter output.", "server": "Server", + "server-hostname": "Server hostname", + "server-slave": "Server (Slave)", + "servers-slaves": "Servers (Slaves)", "server-port": "Server port", "server-url": "Server endpoint url", + "server-connection": "Server Connection", + "server-config": "Server configuration", + "server-slave-config": "Server (Slave) configuration", "server-url-required": "Server endpoint url is required.", + "stopbits": "Stopbits", + "strict": "Strict", "set": "Set", "show-map": "Show map", "statistics": { @@ -3217,6 +3265,7 @@ "thingsboard": "ThingsBoard", "general": "General", "timeseries": "Time series", + "telementry": "Telementry", "key": "Key", "keys": "Keys", "key-required": "Key is required.", @@ -3237,6 +3286,8 @@ "topic-required": "Topic filter is required.", "tls-path-ca-certificate": "Path to CA certificate on gateway", "tls-path-client-certificate": "Path to client certificate on gateway", + "tls-connection": "TLS Connection", + "master-connections": "Master Connections", "method-filter": "Method filter", "method-filter-hint": "Regular expression to filter incoming RPC method from platform.", "method-filter-required": "Method filter is required.", @@ -3256,12 +3307,22 @@ "at-least-once": "1 - At least once", "exactly-once": "2 - Exactly once" }, + "objects-count": "Objects count", + "wait-after-failed-attempts": "Wait after failed attempts (s)", "tls-path-private-key": "Path to private key on gateway", "toggle-fullscreen": "Toggle fullscreen", "transformer-json-config": "Configuration JSON*", "update-config": "Add/update configuration JSON", "username": "Username", "username-required": "Username is required.", + "read-coils": "Read Coils", + "read-discrete-inputs": "Read Discrete Inputs", + "read-multiple-holding-registers": "Read Multiple Holding Register", + "read-input-registers": "Read Input Registers", + "write-coil": "Write Coil", + "write-coils": "Write Coils", + "write-register": "Write Register", + "write-registers": "Write Registers", "hints": { "remote-configuration": "Enables remote configuration and management of the gateway", "remote-shell": "Enables remote control of the operating system with the gateway from the Remote Shell widget", @@ -3302,6 +3363,7 @@ "grpc-min-ping-interval-without-data": "Minimum amount of time the server should wait between sending keepalive ping messages when there is no data being sent or received.", "permit-without-calls": "Allow server to keep the GRPC connection alive even when there are no active RPC calls.", "memory": "Your data will be stored in the in-memory queue, it is a fastest but no persistence guarantee.", + "framer-type": "Type of framer.", "file": "Your data will be stored in separated files and will be saved even after the gateway restart.", "sqlite": "Your data will be stored in file based database. And will be saved even after the gateway restart.", "opcua-timeout": "Timeout in seconds for connecting to OPC-UA server.", diff --git a/ui-ngx/src/assets/metadata/connector-default-configs/modbus.json b/ui-ngx/src/assets/metadata/connector-default-configs/modbus.json index 437a6abd95..fee4e745d6 100644 --- a/ui-ngx/src/assets/metadata/connector-default-configs/modbus.json +++ b/ui-ngx/src/assets/metadata/connector-default-configs/modbus.json @@ -2,6 +2,7 @@ "master": { "slaves": [ { + "name": "Slave 1", "host": "127.0.0.1", "port": 5021, "type": "tcp", @@ -185,64 +186,60 @@ "wordOrder": "LITTLE", "unitId": 0, "values": { - "holding_registers": [ - { - "attributes": [ - { - "address": 1, - "type": "string", - "tag": "sm", - "objectsCount": 1, - "value": "ON" - } - ], - "timeseries": [ - { - "address": 2, - "type": "int", - "tag": "smm", - "objectsCount": 1, - "value": "12334" - } - ], - "attributeUpdates": [ - { - "tag": "shared_attribute_write", - "type": "32int", - "functionCode": 6, - "objectsCount": 2, - "address": 29, - "value": 1243 - } - ], - "rpc": [ - { - "tag": "setValue", - "type": "bits", - "functionCode": 5, - "objectsCount": 1, - "address": 31, - "value": 22 - } - ] + "holding_registers": { + "attributes": [ + { + "address": 1, + "type": "string", + "tag": "sm", + "objectsCount": 1, + "value": "ON" + } + ], + "timeseries": [ + { + "address": 2, + "type": "int", + "tag": "smm", + "objectsCount": 1, + "value": "12334" + } + ], + "attributeUpdates": [ + { + "tag": "shared_attribute_write", + "type": "32int", + "functionCode": 6, + "objectsCount": 2, + "address": 29, + "value": 1243 + } + ], + "rpc": [ + { + "tag": "setValue", + "type": "bits", + "functionCode": 5, + "objectsCount": 1, + "address": 31, + "value": 22 + } + ] + }, + "coils_initializer": { + "attributes": [ + { + "address": 5, + "type": "string", + "tag": "sm", + "objectsCount": 1, + "value": "12" + } + ], + "timeseries": [], + "attributeUpdates": [], + "rpc": [] } - ], - "coils_initializer": [ - { - "attributes": [ - { - "address": 5, - "type": "string", - "tag": "sm", - "objectsCount": 1, - "value": "12" - } - ], - "timeseries": [], - "attributeUpdates": [], - "rpc": [] - } - ] } } } From 7ade2b20ed1e61bcb9bdfe6ec098cf24efcc814d Mon Sep 17 00:00:00 2001 From: mpetrov Date: Thu, 18 Jul 2024 18:41:05 +0300 Subject: [PATCH 21/51] refactoring --- .../connectors-configuration/modbus/index.ts | 7 ------- .../modbus-basic-config.component.ts | 7 +++---- .../modbus-master-table.component.ts | 2 +- .../modbus-security-config.component.html | 17 +++++++++++++++++ .../modbus-slave-config.component.ts | 6 ++---- .../modbus-slave-dialog.component.ts | 6 ++---- .../modbus-values/modbus-values.component.ts | 2 +- .../modbus/public-api.ts | 16 ++++++++++++++++ .../abstract/datasource/datasource.abstract.ts | 16 ++++++++++++++++ ui-ngx/src/app/shared/abstract/public-api.ts | 16 ++++++++++++++++ ui-ngx/src/app/shared/directives/public-api.ts | 16 ++++++++++++++++ 11 files changed, 90 insertions(+), 21 deletions(-) delete mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/index.ts diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/index.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/index.ts deleted file mode 100644 index 803a8ff8dd..0000000000 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/index.ts +++ /dev/null @@ -1,7 +0,0 @@ -export * from './modbus-basic-config/modbus-basic-config.component'; -export * from './modbus-values/modbus-values.component'; -export * from './modbus-data-keys-panel/modbus-data-keys-panel.component'; -export * from './modbus-slave-config/modbus-slave-config.component'; -export * from './modbus-master-table/modbus-master-table.component'; -export * from './modbus-slave-dialog/modbus-slave-dialog.component'; -export * from './modbus-security-config/modbus-security-config.component'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts index d61d63edb8..8499aa2512 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts @@ -32,11 +32,10 @@ import { SharedModule } from '@shared/shared.module'; import { CommonModule } from '@angular/common'; import { takeUntil } from 'rxjs/operators'; import { Subject } from 'rxjs'; -import { - ModbusMasterTableComponent, - ModbusSlaveConfigComponent, -} from '@home/components/widget/lib/gateway/connectors-configuration/modbus'; + import { EllipsisChipListDirective } from '@shared/directives/public-api'; +import { ModbusSlaveConfigComponent } from '../modbus-slave-config/modbus-slave-config.component'; +import { ModbusMasterTableComponent } from '../modbus-master-table/modbus-master-table.component'; @Component({ selector: 'tb-modbus-basic-config', diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts index b1f2c09689..69613b9207 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts @@ -46,7 +46,7 @@ import { isDefinedAndNotNull, isUndefinedOrNull } from '@core/utils'; import { SharedModule } from '@shared/shared.module'; import { CommonModule } from '@angular/common'; import { TbDatasource } from '@shared/abstract/datasource/datasource.abstract'; -import { ModbusSlaveDialogComponent } from '@home/components/widget/lib/gateway/connectors-configuration/modbus'; +import { ModbusSlaveDialogComponent } from '../modbus-slave-dialog/modbus-slave-dialog.component'; @Component({ selector: 'tb-modbus-master-table', diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.html index 900973d327..0f30dc4314 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.html @@ -1,3 +1,20 @@ +
gateway.client-cert-path
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts index 3bb21cd9d4..903e449d86 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts @@ -38,11 +38,9 @@ import { SharedModule } from '@shared/shared.module'; import { CommonModule } from '@angular/common'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; -import { - ModbusValuesComponent, - ModbusSecurityConfigComponent -} from '@home/components/widget/lib/gateway/connectors-configuration/modbus'; import { GatewayPortTooltipPipe } from '@home/pipes/public-api'; +import { ModbusSecurityConfigComponent } from '../modbus-security-config/modbus-security-config.component'; +import { ModbusValuesComponent, } from '../modbus-values/modbus-values.component'; @Component({ selector: 'tb-modbus-server-config', diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts index 202ef260c7..b4b95d8b72 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts @@ -36,10 +36,8 @@ import { import { SharedModule } from '@shared/shared.module'; import { CommonModule } from '@angular/common'; import { Subject } from 'rxjs'; -import { - ModbusValuesComponent, - ModbusSecurityConfigComponent, -} from '@home/components/widget/lib/gateway/connectors-configuration/modbus'; +import { ModbusValuesComponent } from '../modbus-values/modbus-values.component'; +import { ModbusSecurityConfigComponent } from '../modbus-security-config/modbus-security-config.component'; import { DialogComponent } from '@shared/components/dialog.component'; import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts index 76b376fb1b..57acf4a21c 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts @@ -46,12 +46,12 @@ import { } from '@home/components/widget/lib/gateway/gateway-widget.models'; import { SharedModule } from '@shared/shared.module'; import { CommonModule } from '@angular/common'; -import { ModbusDataKeysPanelComponent } from '@home/components/widget/lib/gateway/connectors-configuration/public-api'; import { takeUntil } from 'rxjs/operators'; import { Subject } from 'rxjs'; import { EllipsisChipListDirective } from '@shared/directives/public-api'; import { MatButton } from '@angular/material/button'; import { TbPopoverService } from '@shared/components/popover.service'; +import { ModbusDataKeysPanelComponent } from '../modbus-data-keys-panel/modbus-data-keys-panel.component'; @Component({ selector: 'tb-modbus-values', diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/public-api.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/public-api.ts index 803a8ff8dd..87a3ba5c2f 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/public-api.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/public-api.ts @@ -1,3 +1,19 @@ +/// +/// 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 './modbus-basic-config/modbus-basic-config.component'; export * from './modbus-values/modbus-values.component'; export * from './modbus-data-keys-panel/modbus-data-keys-panel.component'; diff --git a/ui-ngx/src/app/shared/abstract/datasource/datasource.abstract.ts b/ui-ngx/src/app/shared/abstract/datasource/datasource.abstract.ts index fd8808c9cf..2f1d9b1d78 100644 --- a/ui-ngx/src/app/shared/abstract/datasource/datasource.abstract.ts +++ b/ui-ngx/src/app/shared/abstract/datasource/datasource.abstract.ts @@ -1,3 +1,19 @@ +/// +/// 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. +/// + import { DataSource } from '@angular/cdk/collections'; import { BehaviorSubject, Observable } from 'rxjs'; import { map } from 'rxjs/operators'; diff --git a/ui-ngx/src/app/shared/abstract/public-api.ts b/ui-ngx/src/app/shared/abstract/public-api.ts index 4345e3f4f2..562011065a 100644 --- a/ui-ngx/src/app/shared/abstract/public-api.ts +++ b/ui-ngx/src/app/shared/abstract/public-api.ts @@ -1 +1,17 @@ +/// +/// 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 './datasource/datasource.abstract'; diff --git a/ui-ngx/src/app/shared/directives/public-api.ts b/ui-ngx/src/app/shared/directives/public-api.ts index 0e94de2a78..f1fae708d0 100644 --- a/ui-ngx/src/app/shared/directives/public-api.ts +++ b/ui-ngx/src/app/shared/directives/public-api.ts @@ -1 +1,17 @@ +/// +/// 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 './ellipsis-chip-list/ellipsis-chip-list.directive'; From e87f00957f8ec2f56947edd57c9c7e04f6e0fc07 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Fri, 19 Jul 2024 11:39:02 +0300 Subject: [PATCH 22/51] review comments adjustments --- .../modbus-basic-config.component.ts | 7 ++--- .../modbus-data-keys-panel.component.html | 13 ++++++++-- .../modbus-slave-config.component.html | 13 +++++++++- .../modbus-slave-dialog.component.html | 24 +++++++++++++++-- .../modbus-slave-dialog.component.ts | 2 +- .../mqtt-basic-config.component.ts | 4 +-- .../opc-ua-basic-config.component.ts | 4 +-- .../gateway/gateway-connectors.component.ts | 3 ++- .../lib/gateway/gateway-widget.models.ts | 26 ++++++++++++------- .../datasource/datasource.abstract.ts | 12 ++++----- .../ellipsis-chip-list.directive.ts | 5 +--- .../assets/locale/locale.constant-en_US.json | 4 +-- 12 files changed, 80 insertions(+), 37 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts index 8499aa2512..6f2d9aff02 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts @@ -24,10 +24,7 @@ import { ValidationErrors, Validator, } from '@angular/forms'; -import { - ConnectorBaseConfig, - ConnectorType, -} from '@home/components/widget/lib/gateway/gateway-widget.models'; +import { ConnectorType, ModbusBasicConfig } from '@home/components/widget/lib/gateway/gateway-widget.models'; import { SharedModule } from '@shared/shared.module'; import { CommonModule } from '@angular/common'; import { takeUntil } from 'rxjs/operators'; @@ -112,7 +109,7 @@ export class ModbusBasicConfigComponent implements ControlValueAccessor, Validat this.onTouched = fn; } - writeValue(basicConfig: ConnectorBaseConfig): void { + writeValue(basicConfig: ModbusBasicConfig): void { const editedBase = { slave: basicConfig.slave || {}, master: basicConfig.master || {}, diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html index 08ef83eeb5..1101565275 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html @@ -33,7 +33,7 @@
-
+
gateway.key
@@ -98,10 +98,19 @@
-
gateway.value
+
gateway.value
+ + warning +
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html index 43c71958bf..bfc45325e4 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html @@ -68,10 +68,21 @@
-
gateway.port
+
gateway.port
+ + warning +
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html index 5c8fb4c397..80d5d6115b 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html @@ -28,10 +28,19 @@
-
gateway.name
+
gateway.name
+ + warning +
@@ -89,10 +98,21 @@
-
gateway.port
+
gateway.port
+ + warning +
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts index b4b95d8b72..3f12692dcb 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts @@ -118,7 +118,7 @@ export class ModbusSlaveDialogComponent extends DialogComponent | RequestMappingData[]; - server?: ServerConfig; - broker?: BrokerConfig; - workers?: WorkersConfig; - master?: ModbusMasterConfig; - slave?: ModbusSlave; +export type ConnectorBaseConfig = MQTTBasicConfig | OPCBasicConfig | ModbusBasicConfig; + +export interface MQTTBasicConfig { + dataMapping: ConverterConnectorMapping[]; + requestsMapping: Record | RequestMappingData[]; + broker: BrokerConfig; + workers: WorkersConfig; +} + +export interface OPCBasicConfig { + mapping: DeviceConnectorMapping[]; + server: ServerConfig; +} + +export interface ModbusBasicConfig { + master: ModbusMasterConfig; + slave: ModbusSlave; } export interface WorkersConfig { diff --git a/ui-ngx/src/app/shared/abstract/datasource/datasource.abstract.ts b/ui-ngx/src/app/shared/abstract/datasource/datasource.abstract.ts index 2f1d9b1d78..43de3789a0 100644 --- a/ui-ngx/src/app/shared/abstract/datasource/datasource.abstract.ts +++ b/ui-ngx/src/app/shared/abstract/datasource/datasource.abstract.ts @@ -18,11 +18,11 @@ import { DataSource } from '@angular/cdk/collections'; import { BehaviorSubject, Observable } from 'rxjs'; import { map } from 'rxjs/operators'; -export abstract class TbDatasource implements DataSource { +export abstract class TbDatasource implements DataSource { - protected dataSubject = new BehaviorSubject>([]); + protected dataSubject = new BehaviorSubject>([]); - connect(): Observable> { + connect(): Observable> { return this.dataSubject.asObservable(); } @@ -30,19 +30,19 @@ export abstract class TbDatasource implements DataSource { this.dataSubject.complete(); } - loadData(data: Array): void { + loadData(data: Array): void { this.dataSubject.next(data); } isEmpty(): Observable { return this.dataSubject.pipe( - map((data: DataType[]) => !data.length) + map((data: T[]) => !data.length) ); } total(): Observable { return this.dataSubject.pipe( - map((data: DataType[]) => data.length) + map((data: T[]) => data.length) ); } } diff --git a/ui-ngx/src/app/shared/directives/ellipsis-chip-list/ellipsis-chip-list.directive.ts b/ui-ngx/src/app/shared/directives/ellipsis-chip-list/ellipsis-chip-list.directive.ts index 4c44203b64..bb2847aeee 100644 --- a/ui-ngx/src/app/shared/directives/ellipsis-chip-list/ellipsis-chip-list.directive.ts +++ b/ui-ngx/src/app/shared/directives/ellipsis-chip-list/ellipsis-chip-list.directive.ts @@ -21,7 +21,6 @@ import { Input, OnDestroy, Renderer2, - AfterViewInit, } from '@angular/core'; import { isEqual } from '@core/utils'; import { TranslateService } from '@ngx-translate/core'; @@ -34,7 +33,7 @@ import { takeUntil } from 'rxjs/operators'; selector: '[tb-ellipsis-chip-list]', standalone: true, }) -export class EllipsisChipListDirective implements OnDestroy, AfterViewInit { +export class EllipsisChipListDirective implements OnDestroy { chipsValue: string[]; @@ -70,9 +69,7 @@ export class EllipsisChipListDirective implements OnDestroy, AfterViewInit { } }); }); - } - ngAfterViewInit(): void { this.intersectionObserver.observe(this.el.nativeElement); } diff --git a/ui-ngx/src/assets/locale/locale.constant-en_US.json b/ui-ngx/src/assets/locale/locale.constant-en_US.json index 6517f2214f..2b89fd45ee 100644 --- a/ui-ngx/src/assets/locale/locale.constant-en_US.json +++ b/ui-ngx/src/assets/locale/locale.constant-en_US.json @@ -2852,8 +2852,8 @@ "device-name-filter-hint": "This field supports Regular expressions to filter incoming data by device name.", "device-name-filter-required": "Device name filter is required.", "details": "Details", - "delete-mapping-title": "Delete mapping ?", - "delete-slave-title": "Delete slave ?", + "delete-mapping-title": "Delete mapping?", + "delete-slave-title": "Delete slave?", "download-configuration-file": "Download configuration file", "download-docker-compose": "Download docker-compose.yml for your gateway", "enable-remote-logging": "Enable remote logging", From 8b0a2012eec75ae009df3429d94c1bc3f9fe2417 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Fri, 19 Jul 2024 12:32:48 +0300 Subject: [PATCH 23/51] minor adjustments --- .../modbus-data-keys-panel.component.html | 152 +++++++++--------- .../modbus-data-keys-panel.component.ts | 3 +- .../modbus-slave-config.component.html | 22 ++- .../modbus-slave-config.component.ts | 4 +- .../modbus-slave-dialog.component.html | 22 ++- .../modbus-slave-dialog.component.ts | 6 +- .../modbus-values.component.html | 8 +- .../lib/gateway/gateway-widget.models.ts | 10 +- .../assets/locale/locale.constant-en_US.json | 6 +- 9 files changed, 137 insertions(+), 96 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html index 1101565275..efa8e11019 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html @@ -27,91 +27,97 @@
- {{ keyControl.get('tag').value }} + {{ keyControl.get('tag').value }}{{ '-' }}{{ keyControl.get('value').value }}
-
-
- gateway.key -
-
- - - +
gateway.platform-side
+
+
+ gateway.key +
+
+ + + - warning - - + class="tb-error"> + warning + + +
-
-
- gateway.type -
-
- - - {{ type }} - - +
+
gateway.connector-side
+
+
+ gateway.type +
+
+ + + {{ type }} + + +
-
-
-
gateway.function-code
-
- - - {{ ModbusFunctionCodeTranslationsMap.get(code) | translate }} - - +
+
gateway.function-code
+
+ + + {{ ModbusFunctionCodeTranslationsMap.get(code) | translate }} + + +
-
-
-
gateway.objects-count
-
- - - +
+
gateway.objects-count
+
+ + + +
-
-
-
gateway.address
-
- - - +
+
gateway.address
+
+ + + +
-
-
-
gateway.value
-
- - - +
gateway.value
+
+ + + - warning - - + class="tb-error"> + warning + + +
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts index a63b2e488e..81e275b07c 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts @@ -18,6 +18,7 @@ import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'; import { AbstractControl, FormGroup, UntypedFormArray, UntypedFormBuilder, Validators } from '@angular/forms'; import { TbPopoverComponent } from '@shared/components/popover.component'; import { + MappingKeysType, ModbusDataType, ModbusFunctionCodeTranslationsMap, ModbusObjectCountByDataType, @@ -71,7 +72,7 @@ export class ModbusDataKeysPanelComponent implements OnInit { ngOnInit(): void { this.keysListFormArray = this.prepareKeysFormArray(this.values); - this.withFunctionCode = !this.isMaster || (this.keysType !== ModbusValueKey.ATTRIBUTES && this.keysType !== ModbusValueKey.TELEMENTRY); + this.withFunctionCode = !this.isMaster || (this.keysType !== ModbusValueKey.ATTRIBUTES && this.keysType !== ModbusValueKey.TIMESERIES); this.defaultFunctionCodes = this.getDefaultFunctionCodes(); } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html index bfc45325e4..5587cd09ee 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html @@ -109,18 +109,36 @@
-
gateway.device-name
+
gateway.device-name
+ + warning +
-
gateway.device-profile
+
gateway.device-profile
+ + warning +
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts index 903e449d86..4211b2b09c 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts @@ -106,8 +106,8 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat method: [ModbusMethodType.SOCKET, []], unitId: [null, []], baudrate: [null, []], - deviceName: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], - deviceType: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + deviceName: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], + deviceType: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], pollPeriod: [null, []], sendDataToThingsBoard: [false, []], byteOrder:[ModbusOrderType.BIG, []], diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html index 80d5d6115b..95e7700886 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html @@ -180,18 +180,36 @@
-
gateway.device-name
+
gateway.device-name
+ + warning +
-
gateway.device-profile
+
gateway.device-profile
+ + warning +
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts index 3f12692dcb..991c71c16b 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts @@ -114,7 +114,7 @@ export class ModbusSlaveDialogComponent extends DialogComponent
-
gateway.telementry
+
gateway.timeseries
- - + + {{ telemetry.tag }} @@ -68,7 +68,7 @@ mat-icon-button color="primary" #telemetryButton - (click)="manageKeys($event, telemetryButton, ModbusValueKey.TELEMENTRY, register)"> + (click)="manageKeys($event, telemetryButton, ModbusValueKey.TIMESERIES, register)"> edit
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-widget.models.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-widget.models.ts index 865f819315..42a58b784e 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-widget.models.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-widget.models.ts @@ -844,7 +844,7 @@ export const ModbusFieldsTranslationsMap = new Map( export enum ModbusValueKey { ATTRIBUTES = 'attributes', - TELEMENTRY = 'timeseries', + TIMESERIES = 'timeseries', ATTRIBUTES_UPDATES = 'attributeUpdates', RPC_REQUESTS = 'rpc', } @@ -852,7 +852,7 @@ export enum ModbusValueKey { export const ModbusKeysPanelTitleTranslationsMap = new Map( [ [ModbusValueKey.ATTRIBUTES, 'gateway.attributes'], - [ModbusValueKey.TELEMENTRY, 'gateway.telementry'], + [ModbusValueKey.TIMESERIES, 'gateway.timeseries'], [ModbusValueKey.ATTRIBUTES_UPDATES, 'gateway.attribute-updates'], [ModbusValueKey.RPC_REQUESTS, 'gateway.rpc-requests'] ] @@ -861,7 +861,7 @@ export const ModbusKeysPanelTitleTranslationsMap = new Map( [ [ModbusValueKey.ATTRIBUTES, 'gateway.add-attribute'], - [ModbusValueKey.TELEMENTRY, 'gateway.add-telementry'], + [ModbusValueKey.TIMESERIES, 'gateway.add-timeseries'], [ModbusValueKey.ATTRIBUTES_UPDATES, 'gateway.add-attribute-update'], [ModbusValueKey.RPC_REQUESTS, 'gateway.add-rpc-request'] ] @@ -870,7 +870,7 @@ export const ModbusKeysAddKeyTranslationsMap = new Map( export const ModbusKeysDeleteKeyTranslationsMap = new Map( [ [ModbusValueKey.ATTRIBUTES, 'gateway.delete-attribute'], - [ModbusValueKey.TELEMENTRY, 'gateway.delete-telementry'], + [ModbusValueKey.TIMESERIES, 'gateway.delete-timeseries'], [ModbusValueKey.ATTRIBUTES_UPDATES, 'gateway.delete-attribute-update'], [ModbusValueKey.RPC_REQUESTS, 'gateway.delete-rpc-requests'] ] @@ -879,7 +879,7 @@ export const ModbusKeysDeleteKeyTranslationsMap = new Map( [ [ModbusValueKey.ATTRIBUTES, 'gateway.no-attributes'], - [ModbusValueKey.TELEMENTRY, 'gateway.no-telementry'], + [ModbusValueKey.TIMESERIES, 'gateway.no-timeseries'], [ModbusValueKey.ATTRIBUTES_UPDATES, 'gateway.no-attribute-updates'], [ModbusValueKey.RPC_REQUESTS, 'gateway.no-rpc-requests'] ] diff --git a/ui-ngx/src/assets/locale/locale.constant-en_US.json b/ui-ngx/src/assets/locale/locale.constant-en_US.json index 2b89fd45ee..0475c771e6 100644 --- a/ui-ngx/src/assets/locale/locale.constant-en_US.json +++ b/ui-ngx/src/assets/locale/locale.constant-en_US.json @@ -2761,7 +2761,6 @@ "add-attribute-update": "Add attribute update", "add-key": "Add key", "add-timeseries": "Add time series", - "add-telementry": "Add telementry", "add-mapping": "Add mapping", "add-slave": "Add Slave", "arguments": "Arguments", @@ -2892,13 +2891,14 @@ "delete-attribute": "Delete attribute", "delete-key": "Delete key", "delete-timeseries": "Delete time series", - "delete-telementry": "Delete telementry", "default": "Default", "device-node": "Device node", "device-node-required": "Device node required.", "device-node-hint": "Path or identifier for device node on OPC UA server. Relative paths from it for attributes and time series can be used.", "device-name": "Device name", "device-profile": "Device profile", + "device-name-required": "Device name required", + "device-profile-required": "Device profile required", "download-tip": "Download configuration file", "drop-file": "Drop file here or", "enable-subscription": "Enable subscription", @@ -3008,7 +3008,6 @@ "no-gateway-found": "No gateway found.", "no-gateway-matching": " '{{item}}' not found.", "no-timeseries": "No time series", - "no-telementry": "No telementry", "no-keys": "No keys", "no-value": "No arguments", "no-rpc-methods": "No RPC methods", @@ -3265,7 +3264,6 @@ "thingsboard": "ThingsBoard", "general": "General", "timeseries": "Time series", - "telementry": "Telementry", "key": "Key", "keys": "Keys", "key-required": "Key is required.", From 62e2c8a6ad687f0ce033502aa317c27bb69590a5 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Fri, 19 Jul 2024 17:39:25 +0300 Subject: [PATCH 24/51] functionality adjustments --- .../modbus-data-keys-panel.component.html | 9 ++- .../modbus-data-keys-panel.component.ts | 25 +++++--- .../modbus-security-config.component.html | 3 +- .../modbus-security-config.component.ts | 15 ++++- .../modbus-slave-config.component.html | 10 +++ .../modbus-slave-config.component.ts | 64 ++++++++++++++++--- .../modbus-slave-dialog.component.html | 9 +++ .../modbus-slave-dialog.component.ts | 4 +- .../lib/gateway/gateway-widget.models.ts | 2 + .../assets/locale/locale.constant-en_US.json | 3 + 10 files changed, 119 insertions(+), 25 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html index efa8e11019..a38b7e4dda 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html @@ -27,7 +27,10 @@
- {{ keyControl.get('tag').value }}{{ '-' }}{{ keyControl.get('value').value }} + + {{ keyControl.get('tag').value }}{{ '-' }}{{ keyControl.get('value').value }} + + {{ keyControl.get('tag').value }}
@@ -73,7 +76,7 @@
- {{ ModbusFunctionCodeTranslationsMap.get(code) | translate }} + {{ ModbusFunctionCodeTranslationsMap.get(code) | translate }}
@@ -102,7 +105,7 @@
-
+
gateway.value
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts index 81e275b07c..ac448f703e 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts @@ -18,7 +18,6 @@ import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'; import { AbstractControl, FormGroup, UntypedFormArray, UntypedFormBuilder, Validators } from '@angular/forms'; import { TbPopoverComponent } from '@shared/components/popover.component'; import { - MappingKeysType, ModbusDataType, ModbusFunctionCodeTranslationsMap, ModbusObjectCountByDataType, @@ -30,6 +29,7 @@ import { import { CommonModule } from '@angular/common'; import { SharedModule } from '@shared/shared.module'; import { GatewayHelpLinkPipe } from '@home/pipes/public-api'; +import { generateSecret } from '@core/utils'; @Component({ selector: 'tb-modbus-data-keys-panel', @@ -83,11 +83,12 @@ export class ModbusDataKeysPanelComponent implements OnInit { addKey(): void { const dataKeyFormGroup = this.fb.group({ tag: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], - value: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], + value: [{value: '', disabled: !this.isMaster}, [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], type: [ModbusDataType.STRING, [Validators.required]], address: [0, [Validators.required]], objectsCount: [1, [Validators.required]], - functionCode: [this.getDefaultFunctionCodes()[0]] + functionCode: [this.getDefaultFunctionCodes()[0]], + id: [{value: generateSecret(5), disabled: true}], }); this.observeKeyDataType(dataKeyFormGroup); @@ -117,14 +118,15 @@ export class ModbusDataKeysPanelComponent implements OnInit { const { tag, value, type, address, objectsCount, functionCode } = keyData; const dataKeyFormGroup = this.fb.group({ tag: [tag, [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], - value: [value, [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], + value: [{value, disabled: !this.isMaster}, [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], type: [type, [Validators.required]], address: [address, [Validators.required]], objectsCount: [objectsCount, [Validators.required]], functionCode: [functionCode, []], + id: [{value: generateSecret(5), disabled: true}], }); this.observeKeyDataType(dataKeyFormGroup); - this.functionCodesMap.set(tag+address, this.getFunctionCodes(type)); + this.functionCodesMap.set(dataKeyFormGroup.get('id').value, this.getFunctionCodes(type)); keysControlGroups.push(dataKeyFormGroup); }); @@ -138,8 +140,7 @@ export class ModbusDataKeysPanelComponent implements OnInit { if (!this.editableDataTypes.includes(dataType)) { objectsCountControl.patchValue(ModbusObjectCountByDataType[dataType]); } - const keyId = keyFormGroup.get('tag').value + keyFormGroup.get('address').value; - this.functionCodesMap.set(keyId, this.getFunctionCodes(dataType)); + this.functionCodesMap.set(keyFormGroup.get('id').value, this.getFunctionCodes(dataType)); }); } @@ -147,7 +148,7 @@ export class ModbusDataKeysPanelComponent implements OnInit { if (this.keysType === ModbusValueKey.ATTRIBUTES_UPDATES) { return this.defaultWriteFunctionCodes; } - const functionCodes = this.defaultReadFunctionCodes; + const functionCodes = [...this.defaultReadFunctionCodes]; if (dataType === ModbusDataType.BITS) { const bitsFunctionCodes = [1, 2]; bitsFunctionCodes.forEach(code => functionCodes.push(code)); @@ -160,6 +161,12 @@ export class ModbusDataKeysPanelComponent implements OnInit { } private getDefaultFunctionCodes(): number[] { - return this.keysType === ModbusValueKey.ATTRIBUTES_UPDATES ? this.defaultWriteFunctionCodes : this.defaultReadFunctionCodes; + if (this.keysType === ModbusValueKey.ATTRIBUTES_UPDATES) { + return this.defaultWriteFunctionCodes; + } + if (this.keysType === ModbusValueKey.RPC_REQUESTS) { + return [...this.defaultReadFunctionCodes, ...this.defaultWriteFunctionCodes]; + } + return this.defaultReadFunctionCodes; } } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.html index 0f30dc4314..66db8c5018 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.html @@ -15,7 +15,8 @@ limitations under the License. --> -
+
+
{{ 'gateway.hints.path-in-os' | translate }}
gateway.client-cert-path
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts index 2f5786882b..bf926d3454 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts @@ -112,7 +112,20 @@ export class ModbusSecurityConfigComponent implements ControlValueAccessor, Vali } writeValue(securityConfig: ModbusSecurity): void { - this.securityConfigFormGroup.patchValue(securityConfig, {emitEvent: false}); + const { certfile, password, keyfile, server_hostname } = securityConfig; + let securityState = { + certfile: certfile ?? '', + password: password ?? '', + keyfile: keyfile ?? '', + server_hostname: server_hostname?? '', + reqclicert: !!securityConfig.reqclicert, + }; + if (this.isMaster) { + securityState = { ...securityState, reqclicert: !!securityConfig.reqclicert }; + } else { + securityState = { ...securityState, server_hostname: server_hostname ?? '' }; + } + this.securityConfigFormGroup.reset(securityState, {emitEvent: false}); } private observeValueChanges(): void { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html index 5587cd09ee..13f31bdda5 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html @@ -16,6 +16,7 @@ -->
+
{{ 'gateway.hints.modbus-server' | translate }}
gateway.server-slave-config
@@ -105,6 +106,15 @@
+ + warning +
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts index 4211b2b09c..27de908e11 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts @@ -23,7 +23,8 @@ import { UntypedFormControl, UntypedFormGroup, ValidationErrors, - Validator, Validators, + Validator, + Validators, } from '@angular/forms'; import { ModbusMethodLabelsMap, @@ -31,8 +32,11 @@ import { ModbusOrderType, ModbusProtocolLabelsMap, ModbusProtocolType, + ModbusRegisterValues, + ModbusSlave, noLeadTrailSpacesRegex, - PortLimits, SlaveConfig, + PortLimits, + SlaveConfig, } from '@home/components/widget/lib/gateway/gateway-widget.models'; import { SharedModule } from '@shared/shared.module'; import { CommonModule } from '@angular/common'; @@ -104,7 +108,7 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat port: [null, [Validators.required, Validators.min(PortLimits.MIN), Validators.max(PortLimits.MAX)]], serialPort: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], method: [ModbusMethodType.SOCKET, []], - unitId: [null, []], + unitId: [null, [Validators.required]], baudrate: [null, []], deviceName: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], deviceType: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], @@ -155,13 +159,9 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat }; } - writeValue(slaveConfig: SlaveConfig): void { - if (slaveConfig.type === ModbusProtocolType.Serial) { - slaveConfig.serialPort = slaveConfig.port as string; - delete slaveConfig.port; - } - this.slaveConfigFormGroup.patchValue(slaveConfig, {emitEvent: false}); + writeValue(slaveConfig: ModbusSlave): void { this.showSecurityControl.patchValue(!!slaveConfig.security); + this.updateSlaveConfig(slaveConfig); this.updateControlsEnabling(slaveConfig.type); } @@ -180,4 +180,50 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat this.tcpUdpSpecificControlKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.enable({emitEvent: false})); } }; + + private updateSlaveConfig(slaveConfig: ModbusSlave): void { + const { + type, + method, + unitId, + deviceName, + deviceType, + pollPeriod, + sendDataToThingsBoard, + byteOrder, + security, + identity, + values, + baudrate, + host, + port, + } = slaveConfig; + let slaveState: ModbusSlave = { + host: host ?? '', + type: type ?? ModbusProtocolType.TCP, + method: method ?? ModbusMethodType.SOCKET, + unitId: unitId ?? null, + deviceName: deviceName ?? '', + deviceType: deviceType ?? '', + pollPeriod: pollPeriod ?? null, + sendDataToThingsBoard: !!sendDataToThingsBoard, + byteOrder: byteOrder ?? ModbusOrderType.BIG, + security: security ?? {}, + identity: identity ?? { + vendorName: '', + productCode: '', + vendorUrl: '', + productName: '', + modelName: '', + }, + values: values ?? {} as ModbusRegisterValues, + port: port ?? null, + }; + if (slaveConfig.type === ModbusProtocolType.Serial) { + slaveState = { ...slaveState, baudrate, serialPort: port, host: '', port: null } as ModbusSlave; + } else { + slaveState = { ...slaveState, serialPort: '', baudrate: null } as ModbusSlave; + } + this.slaveConfigFormGroup.setValue(slaveState, {emitEvent: false}); + } } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html index 95e7700886..3ac441447c 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html @@ -176,6 +176,15 @@
+ + warning +
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts index 991c71c16b..d989478e98 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts @@ -125,7 +125,7 @@ export class ModbusSlaveDialogComponent extends DialogComponent Date: Fri, 19 Jul 2024 18:19:45 +0300 Subject: [PATCH 25/51] Removed table Add Connector button from page on no connectors displayed --- .../widget/lib/gateway/gateway-connectors.component.html | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.html index 7896ac2516..2dab86fb46 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.html @@ -20,7 +20,8 @@

{{ 'gateway.connectors' | translate }}

-
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts index f056c9c92f..1e58cb4a40 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts @@ -138,7 +138,7 @@ export class ModbusSecurityConfigComponent implements ControlValueAccessor, Vali this.securityConfigFormGroup.valueChanges.pipe( takeUntil(this.destroy$) ).subscribe((value: ModbusSecurity) => { - this.onChange(value); + this.onChange(this.disabled ? {} : value); this.onTouched(); }); } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html index 4b0789fb4c..41a7d2aee7 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html @@ -102,7 +102,8 @@
- {{ ModbusMethodLabelsMap.get(method) }} + {{ ModbusMethodLabelsMap.get(method) }}
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts index f1234ccfb1..d328a97baf 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts @@ -33,6 +33,7 @@ import { ModbusProtocolLabelsMap, ModbusProtocolType, ModbusRegisterValues, + ModbusSerialMethodType, ModbusSlave, noLeadTrailSpacesRegex, PortLimits, @@ -90,6 +91,7 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat readonly modbusProtocolTypes = Object.values(ModbusProtocolType); readonly modbusMethodTypes = Object.values(ModbusMethodType); + readonly modbusSerialMethodTypes = Object.values(ModbusSerialMethodType); readonly modbusOrderType = Object.values(ModbusOrderType); readonly ModbusProtocolType = ModbusProtocolType; readonly serialSpecificControlKeys = ['serialPort', 'baudrate']; @@ -107,7 +109,7 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat host: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], port: [null, [Validators.required, Validators.min(PortLimits.MIN), Validators.max(PortLimits.MAX)]], serialPort: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], - method: [ModbusMethodType.SOCKET, []], + method: [ModbusMethodType.RTU, []], unitId: [null, [Validators.required]], baudrate: [null, []], deviceName: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], @@ -133,7 +135,7 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat value.port = value.serialPort; delete value.serialPort; } - this.onChange(value); + this.onChange(this.slaveConfigFormGroup.get('sendDataToThingsBoard').value ? value : {} as SlaveConfig); this.onTouched(); }); @@ -226,7 +228,7 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat let slaveState: ModbusSlave = { host: host ?? '', type: type ?? ModbusProtocolType.TCP, - method: method ?? ModbusMethodType.SOCKET, + method: method ?? ModbusMethodType.RTU, unitId: unitId ?? null, deviceName: deviceName ?? '', deviceType: deviceType ?? '', diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html index 3ac441447c..d3c06aeb4b 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html @@ -124,7 +124,8 @@
- {{ ModbusMethodLabelsMap.get(method) }} + {{ ModbusMethodLabelsMap.get(method) }}
@@ -143,7 +144,9 @@
gateway.bytesize
- + + {{ size }} +
@@ -159,7 +162,9 @@
gateway.parity
- + + {{ ModbusParityLabelsMap.get(parity) }} +
@@ -274,7 +279,7 @@ - +
@@ -332,7 +337,6 @@
-
gateway.values
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts index 006ae7a482..f0c8c2bd45 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts @@ -25,11 +25,15 @@ import { } from '@angular/forms'; import { MappingInfo, + ModbusByteSizes, ModbusMethodLabelsMap, ModbusMethodType, ModbusOrderType, + ModbusParity, + ModbusParityLabelsMap, ModbusProtocolLabelsMap, ModbusProtocolType, + ModbusSerialMethodType, noLeadTrailSpacesRegex, PortLimits, SlaveConfig, } from '@home/components/widget/lib/gateway/gateway-widget.models'; @@ -92,8 +96,12 @@ export class ModbusSlaveDialogComponent extends DialogComponent( +export enum ModbusSerialMethodType { + RTU = 'rtu', + ASCII = 'ascii', +} + +export const ModbusMethodLabelsMap = new Map( [ [ModbusMethodType.SOCKET, 'Socket'], [ModbusMethodType.RTU, 'RTU'], + [ModbusSerialMethodType.ASCII, 'ASCII'], + ] +); + +export const ModbusByteSizes = [5, 6, 7 ,8]; + +export enum ModbusParity { + Even = 'E', + Odd = 'O', + None = 'N' +} + +export const ModbusParityLabelsMap = new Map( + [ + [ModbusParity.Even, 'Even'], + [ModbusParity.Odd, 'Odd'], + [ModbusParity.None, 'None'], ] ); @@ -872,7 +894,7 @@ export const ModbusKeysDeleteKeyTranslationsMap = new Map Date: Mon, 22 Jul 2024 19:16:27 +0300 Subject: [PATCH 28/51] refactoring --- .../table/table-datasource.abstract.ts} | 2 +- .../broker-config-control.component.ts | 6 ++- .../mapping-table/mapping-table.component.ts | 4 +- .../modbus-basic-config.component.ts | 2 +- .../modbus-data-keys-panel.component.ts | 2 +- .../modbus-master-table.component.ts | 4 +- .../modbus-security-config.component.ts | 4 +- .../modbus-slave-config.component.ts | 2 +- .../modbus-slave-dialog.component.ts | 2 +- .../modbus-values/modbus-values.component.ts | 2 +- .../modbus/public-api.ts | 23 ---------- .../mqtt-basic-config.component.ts | 18 +++++--- .../opc-server-config.component.ts | 4 +- .../opc-ua-basic-config.component.ts | 22 ++++++---- .../connectors-configuration/public-api.ts | 27 ------------ .../dialog/mapping-dialog.component.ts | 4 +- .../widget/widget-components.module.ts | 42 +++++++++++++------ .../gateway-help-link.pipe.ts | 0 .../gateway-port-tooltip.pipe.ts | 2 +- .../src/app/modules/home/pipes/public-api.ts | 18 -------- ui-ngx/src/app/shared/abstract/public-api.ts | 17 -------- .../ellipsis-chip-list.directive.ts | 0 .../src/app/shared/directives/public-api.ts | 17 -------- 23 files changed, 81 insertions(+), 143 deletions(-) rename ui-ngx/src/app/{shared/abstract/datasource/datasource.abstract.ts => modules/home/components/table/table-datasource.abstract.ts} (94%) delete mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/public-api.ts delete mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/public-api.ts rename ui-ngx/src/app/modules/home/pipes/{gateway-help-link => }/gateway-help-link.pipe.ts (100%) rename ui-ngx/src/app/modules/home/pipes/{gateway-port-tooltip => }/gateway-port-tooltip.pipe.ts (93%) delete mode 100644 ui-ngx/src/app/modules/home/pipes/public-api.ts delete mode 100644 ui-ngx/src/app/shared/abstract/public-api.ts rename ui-ngx/src/app/shared/directives/{ellipsis-chip-list => }/ellipsis-chip-list.directive.ts (100%) delete mode 100644 ui-ngx/src/app/shared/directives/public-api.ts diff --git a/ui-ngx/src/app/shared/abstract/datasource/datasource.abstract.ts b/ui-ngx/src/app/modules/home/components/table/table-datasource.abstract.ts similarity index 94% rename from ui-ngx/src/app/shared/abstract/datasource/datasource.abstract.ts rename to ui-ngx/src/app/modules/home/components/table/table-datasource.abstract.ts index 43de3789a0..6146b5ebec 100644 --- a/ui-ngx/src/app/shared/abstract/datasource/datasource.abstract.ts +++ b/ui-ngx/src/app/modules/home/components/table/table-datasource.abstract.ts @@ -18,7 +18,7 @@ import { DataSource } from '@angular/cdk/collections'; import { BehaviorSubject, Observable } from 'rxjs'; import { map } from 'rxjs/operators'; -export abstract class TbDatasource implements DataSource { +export abstract class TbTableDatasource implements DataSource { protected dataSubject = new BehaviorSubject>([]); diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts index 6de9c8b310..031388b502 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts @@ -35,9 +35,11 @@ import { SharedModule } from '@shared/shared.module'; import { CommonModule } from '@angular/common'; import { TranslateService } from '@ngx-translate/core'; import { generateSecret } from '@core/utils'; -import { SecurityConfigComponent } from '@home/components/widget/lib/gateway/connectors-configuration/public-api'; import { Subject } from 'rxjs'; -import { GatewayPortTooltipPipe } from '@home/pipes/public-api'; +import { GatewayPortTooltipPipe } from '@home/pipes/gateway-port-tooltip.pipe'; +import { + SecurityConfigComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component'; @Component({ selector: 'tb-broker-config-control', diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts index d0df9bc30d..292cb43b6e 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts @@ -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 { TbDatasource } from '@shared/abstract/public-api'; +import { TbTableDatasource } from '@home/components/table/table-datasource.abstract'; @Component({ selector: 'tb-mapping-table', @@ -310,7 +310,7 @@ export class MappingTableComponent implements ControlValueAccessor, Validator, A } } -export class MappingDatasource extends TbDatasource { +export class MappingDatasource extends TbTableDatasource { constructor() { super(); } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts index 6f2d9aff02..445cb39983 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts @@ -30,7 +30,7 @@ import { CommonModule } from '@angular/common'; import { takeUntil } from 'rxjs/operators'; import { Subject } from 'rxjs'; -import { EllipsisChipListDirective } from '@shared/directives/public-api'; +import { EllipsisChipListDirective } from '@shared/directives/ellipsis-chip-list.directive'; import { ModbusSlaveConfigComponent } from '../modbus-slave-config/modbus-slave-config.component'; import { ModbusMasterTableComponent } from '../modbus-master-table/modbus-master-table.component'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts index 3f57658443..1a696dd75f 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts @@ -28,7 +28,7 @@ import { } from '@home/components/widget/lib/gateway/gateway-widget.models'; import { CommonModule } from '@angular/common'; import { SharedModule } from '@shared/shared.module'; -import { GatewayHelpLinkPipe } from '@home/pipes/public-api'; +import { GatewayHelpLinkPipe } from '@home/pipes/gateway-help-link.pipe'; import { generateSecret } from '@core/utils'; @Component({ diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts index 69613b9207..6644fbfd5e 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts @@ -45,8 +45,8 @@ import { import { isDefinedAndNotNull, isUndefinedOrNull } from '@core/utils'; import { SharedModule } from '@shared/shared.module'; import { CommonModule } from '@angular/common'; -import { TbDatasource } from '@shared/abstract/datasource/datasource.abstract'; import { ModbusSlaveDialogComponent } from '../modbus-slave-dialog/modbus-slave-dialog.component'; +import { TbTableDatasource } from '@home/components/table/table-datasource.abstract'; @Component({ selector: 'tb-modbus-master-table', @@ -224,7 +224,7 @@ export class ModbusMasterTableComponent implements ControlValueAccessor, Validat } } -export class SlavesDatasource extends TbDatasource { +export class SlavesDatasource extends TbTableDatasource { constructor() { super(); } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts index 1e58cb4a40..7efcf095ee 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts @@ -31,9 +31,11 @@ import { } from '@home/components/widget/lib/gateway/gateway-widget.models'; import { SharedModule } from '@shared/shared.module'; 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 { + SecurityConfigComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component'; @Component({ selector: 'tb-modbus-security-config', diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts index d328a97baf..13a4eefb8c 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts @@ -43,7 +43,7 @@ import { SharedModule } from '@shared/shared.module'; import { CommonModule } from '@angular/common'; import { Subject } from 'rxjs'; import { startWith, takeUntil } from 'rxjs/operators'; -import { GatewayPortTooltipPipe } from '@home/pipes/public-api'; +import { GatewayPortTooltipPipe } from '@home/pipes/gateway-port-tooltip.pipe'; import { ModbusSecurityConfigComponent } from '../modbus-security-config/modbus-security-config.component'; import { ModbusValuesComponent, } from '../modbus-values/modbus-values.component'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts index f0c8c2bd45..5ac897b91a 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts @@ -47,7 +47,7 @@ import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; import { Router } from '@angular/router'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; -import { GatewayPortTooltipPipe } from '@home/pipes/gateway-port-tooltip/gateway-port-tooltip.pipe'; +import { GatewayPortTooltipPipe } from '@home/pipes/gateway-port-tooltip.pipe'; import { takeUntil } from 'rxjs/operators'; @Component({ diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts index f1df094e8b..f3e9a28bce 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts @@ -50,7 +50,7 @@ import { SharedModule } from '@shared/shared.module'; import { CommonModule } from '@angular/common'; import { takeUntil } from 'rxjs/operators'; import { Subject } from 'rxjs'; -import { EllipsisChipListDirective } from '@shared/directives/public-api'; +import { EllipsisChipListDirective } from '@shared/directives/ellipsis-chip-list.directive'; import { MatButton } from '@angular/material/button'; import { TbPopoverService } from '@shared/components/popover.service'; import { ModbusDataKeysPanelComponent } from '../modbus-data-keys-panel/modbus-data-keys-panel.component'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/public-api.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/public-api.ts deleted file mode 100644 index 87a3ba5c2f..0000000000 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/public-api.ts +++ /dev/null @@ -1,23 +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 './modbus-basic-config/modbus-basic-config.component'; -export * from './modbus-values/modbus-values.component'; -export * from './modbus-data-keys-panel/modbus-data-keys-panel.component'; -export * from './modbus-slave-config/modbus-slave-config.component'; -export * from './modbus-master-table/modbus-master-table.component'; -export * from './modbus-slave-dialog/modbus-slave-dialog.component'; -export * from './modbus-security-config/modbus-security-config.component'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts index 62613dc28c..f4296b5303 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component.ts @@ -32,15 +32,21 @@ import { } from '@home/components/widget/lib/gateway/gateway-widget.models'; import { SharedModule } from '@shared/shared.module'; import { CommonModule } from '@angular/common'; -import { - BrokerConfigControlComponent, - MappingTableComponent, - SecurityConfigComponent, - WorkersConfigControlComponent -} from '@home/components/widget/lib/gateway/connectors-configuration/public-api'; import { takeUntil } from 'rxjs/operators'; import { Subject } from 'rxjs'; import { isObject } from 'lodash'; +import { + SecurityConfigComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component'; +import { + WorkersConfigControlComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component'; +import { + BrokerConfigControlComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component'; +import { + MappingTableComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component'; @Component({ selector: 'tb-mqtt-basic-config', diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.ts index 955e7e8145..258f295bcb 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.ts @@ -33,9 +33,11 @@ import { } from '@home/components/widget/lib/gateway/gateway-widget.models'; import { SharedModule } from '@shared/shared.module'; 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 { + SecurityConfigComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component'; @Component({ selector: 'tb-opc-server-config', diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-ua-basic-config/opc-ua-basic-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-ua-basic-config/opc-ua-basic-config.component.ts index dfe5c5e51e..39198c9696 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-ua-basic-config/opc-ua-basic-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-ua-basic-config/opc-ua-basic-config.component.ts @@ -31,15 +31,23 @@ import { } from '@home/components/widget/lib/gateway/gateway-widget.models'; import { SharedModule } from '@shared/shared.module'; import { CommonModule } from '@angular/common'; -import { - BrokerConfigControlComponent, - MappingTableComponent, - SecurityConfigComponent, - OpcServerConfigComponent, - WorkersConfigControlComponent -} from '@home/components/widget/lib/gateway/connectors-configuration/public-api'; import { takeUntil } from 'rxjs/operators'; import { Subject } from 'rxjs'; +import { + SecurityConfigComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component'; +import { + WorkersConfigControlComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component'; +import { + BrokerConfigControlComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component'; +import { + MappingTableComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component'; +import { + OpcServerConfigComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component'; @Component({ selector: 'tb-opc-ua-basic-config', diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/public-api.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/public-api.ts deleted file mode 100644 index f98e6c569e..0000000000 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/public-api.ts +++ /dev/null @@ -1,27 +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 './mapping-table/mapping-table.component'; -export * from './device-info-table/device-info-table.component'; -export * from './security-config/security-config.component'; -export * from './opc-server-config/opc-server-config.component'; -export * from './mapping-data-keys-panel/mapping-data-keys-panel.component'; -export * from './type-value-panel/type-value-panel.component'; -export * from './broker-config-control/broker-config-control.component'; -export * from './workers-config-control/workers-config-control.component'; -export * from './opc-ua-basic-config/opc-ua-basic-config.component'; -export * from './mqtt-basic-config/mqtt-basic-config.component'; -export * from './modbus/public-api'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.ts index 3812fa161e..40bff51fb4 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.ts @@ -55,7 +55,9 @@ import { startWith, takeUntil } from 'rxjs/operators'; import { MatButton } from '@angular/material/button'; import { TbPopoverService } from '@shared/components/popover.service'; import { TranslateService } from '@ngx-translate/core'; -import { MappingDataKeysPanelComponent } from '@home/components/widget/lib/gateway/connectors-configuration/public-api'; +import { + MappingDataKeysPanelComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/mapping-data-keys-panel/mapping-data-keys-panel.component'; @Component({ selector: 'tb-mapping-dialog', diff --git a/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts b/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts index 3c2b7affc1..1e4093c22c 100644 --- a/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts +++ b/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts @@ -109,20 +109,38 @@ import { import { NotificationTypeFilterPanelComponent } from '@home/components/widget/lib/cards/notification-type-filter-panel.component'; -import { GatewayHelpLinkPipe } from '@home/pipes/public-api'; +import { GatewayHelpLinkPipe } from '@home/pipes/gateway-help-link.pipe'; +import { EllipsisChipListDirective } from '@shared/directives/ellipsis-chip-list.directive'; +import { + BrokerConfigControlComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component'; +import { + WorkersConfigControlComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component'; +import { + OpcServerConfigComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component'; +import { + MqttBasicConfigComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/mqtt-basic-config/mqtt-basic-config.component'; +import { + MappingTableComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component'; +import { + OpcUaBasicConfigComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/opc-ua-basic-config/opc-ua-basic-config.component'; import { - BrokerConfigControlComponent, - DeviceInfoTableComponent, - MappingDataKeysPanelComponent, - MappingTableComponent, - MqttBasicConfigComponent, - OpcUaBasicConfigComponent, - OpcServerConfigComponent, - TypeValuePanelComponent, - WorkersConfigControlComponent, ModbusBasicConfigComponent -} from '@home/components/widget/lib/gateway/connectors-configuration/public-api'; -import { EllipsisChipListDirective } from '@shared/directives/public-api'; +} from '@home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component'; +import { + DeviceInfoTableComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/device-info-table/device-info-table.component'; +import { + MappingDataKeysPanelComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/mapping-data-keys-panel/mapping-data-keys-panel.component'; +import { + TypeValuePanelComponent +} from '@home/components/widget/lib/gateway/connectors-configuration/type-value-panel/type-value-panel.component'; @NgModule({ declarations: [ diff --git a/ui-ngx/src/app/modules/home/pipes/gateway-help-link/gateway-help-link.pipe.ts b/ui-ngx/src/app/modules/home/pipes/gateway-help-link.pipe.ts similarity index 100% rename from ui-ngx/src/app/modules/home/pipes/gateway-help-link/gateway-help-link.pipe.ts rename to ui-ngx/src/app/modules/home/pipes/gateway-help-link.pipe.ts diff --git a/ui-ngx/src/app/modules/home/pipes/gateway-port-tooltip/gateway-port-tooltip.pipe.ts b/ui-ngx/src/app/modules/home/pipes/gateway-port-tooltip.pipe.ts similarity index 93% rename from ui-ngx/src/app/modules/home/pipes/gateway-port-tooltip/gateway-port-tooltip.pipe.ts rename to ui-ngx/src/app/modules/home/pipes/gateway-port-tooltip.pipe.ts index 9ff3e134c6..3981499a26 100644 --- a/ui-ngx/src/app/modules/home/pipes/gateway-port-tooltip/gateway-port-tooltip.pipe.ts +++ b/ui-ngx/src/app/modules/home/pipes/gateway-port-tooltip.pipe.ts @@ -15,7 +15,7 @@ /// import { Pipe, PipeTransform } from '@angular/core'; -import { PortLimits, } from '@home/components/widget/lib/gateway/gateway-widget.models'; +import { PortLimits } from '@home/components/widget/lib/gateway/gateway-widget.models'; import { AbstractControl } from '@angular/forms'; import { TranslateService } from '@ngx-translate/core'; diff --git a/ui-ngx/src/app/modules/home/pipes/public-api.ts b/ui-ngx/src/app/modules/home/pipes/public-api.ts deleted file mode 100644 index 9db71f9a06..0000000000 --- a/ui-ngx/src/app/modules/home/pipes/public-api.ts +++ /dev/null @@ -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 './gateway-help-link/gateway-help-link.pipe'; -export * from './gateway-port-tooltip/gateway-port-tooltip.pipe'; diff --git a/ui-ngx/src/app/shared/abstract/public-api.ts b/ui-ngx/src/app/shared/abstract/public-api.ts deleted file mode 100644 index 562011065a..0000000000 --- a/ui-ngx/src/app/shared/abstract/public-api.ts +++ /dev/null @@ -1,17 +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 './datasource/datasource.abstract'; diff --git a/ui-ngx/src/app/shared/directives/ellipsis-chip-list/ellipsis-chip-list.directive.ts b/ui-ngx/src/app/shared/directives/ellipsis-chip-list.directive.ts similarity index 100% rename from ui-ngx/src/app/shared/directives/ellipsis-chip-list/ellipsis-chip-list.directive.ts rename to ui-ngx/src/app/shared/directives/ellipsis-chip-list.directive.ts diff --git a/ui-ngx/src/app/shared/directives/public-api.ts b/ui-ngx/src/app/shared/directives/public-api.ts deleted file mode 100644 index f1fae708d0..0000000000 --- a/ui-ngx/src/app/shared/directives/public-api.ts +++ /dev/null @@ -1,17 +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 './ellipsis-chip-list/ellipsis-chip-list.directive'; From 6cc1d28f25f11e491082c51c54af535cce224bab Mon Sep 17 00:00:00 2001 From: mpetrov Date: Mon, 22 Jul 2024 19:25:56 +0300 Subject: [PATCH 29/51] refactoring --- .../modbus-slave-dialog/modbus-slave-dialog.component.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts index 5ac897b91a..941f6d49ee 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts @@ -35,7 +35,8 @@ import { ModbusProtocolType, ModbusSerialMethodType, noLeadTrailSpacesRegex, - PortLimits, SlaveConfig, + PortLimits, + SlaveConfig, } from '@home/components/widget/lib/gateway/gateway-widget.models'; import { SharedModule } from '@shared/shared.module'; import { CommonModule } from '@angular/common'; From 67f6e483e3f9e369b4b99cd24db25094892b3438 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Mon, 22 Jul 2024 19:32:42 +0300 Subject: [PATCH 30/51] refactoring --- .../mapping-table/mapping-table.component.ts | 4 ++-- .../server-config/server-config.component.ts | 4 ++-- .../workers-config-control.component.ts | 4 ++-- ui-ngx/src/app/shared/directives/public-api.ts | 17 ----------------- ...rective.ts => truncate-tooltip.directive.ts} | 2 +- 5 files changed, 7 insertions(+), 24 deletions(-) delete mode 100644 ui-ngx/src/app/shared/directives/public-api.ts rename ui-ngx/src/app/shared/directives/{tooltip/tooltip.directive.ts => truncate-tooltip.directive.ts} (97%) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts index 3e4ce09031..7df3c77be4 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts @@ -58,7 +58,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'; @Component({ selector: 'tb-mapping-table', @@ -78,7 +78,7 @@ import { TooltipDirective } from '@shared/directives/public-api'; } ], standalone: true, - imports: [CommonModule, SharedModule, TooltipDirective] + imports: [CommonModule, SharedModule, TruncateTooltipDirective] }) export class MappingTableComponent implements ControlValueAccessor, Validator, AfterViewInit, OnInit, OnDestroy { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts index 66af025267..40b9a10fc6 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/server-config/server-config.component.ts @@ -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-server-config', @@ -60,7 +60,7 @@ import { TooltipDirective } from '@shared/directives/public-api'; CommonModule, SharedModule, SecurityConfigComponent, - TooltipDirective, + TruncateTooltipDirective, ] }) export class ServerConfigComponent implements ControlValueAccessor, Validator, OnDestroy { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts index c05b7c32b6..8430c29ecd 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts @@ -33,7 +33,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', @@ -43,7 +43,7 @@ import { TooltipDirective } from '@shared/directives/tooltip/tooltip.directive'; imports: [ CommonModule, SharedModule, - TooltipDirective, + TruncateTooltipDirective, ], providers: [ { diff --git a/ui-ngx/src/app/shared/directives/public-api.ts b/ui-ngx/src/app/shared/directives/public-api.ts deleted file mode 100644 index a82428fc19..0000000000 --- a/ui-ngx/src/app/shared/directives/public-api.ts +++ /dev/null @@ -1,17 +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'; diff --git a/ui-ngx/src/app/shared/directives/tooltip/tooltip.directive.ts b/ui-ngx/src/app/shared/directives/truncate-tooltip.directive.ts similarity index 97% rename from ui-ngx/src/app/shared/directives/tooltip/tooltip.directive.ts rename to ui-ngx/src/app/shared/directives/truncate-tooltip.directive.ts index 448b7e52de..bf08780e11 100644 --- a/ui-ngx/src/app/shared/directives/tooltip/tooltip.directive.ts +++ b/ui-ngx/src/app/shared/directives/truncate-tooltip.directive.ts @@ -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'; From a0a24b17a8b341373583269f6876e06b62f00cd7 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Mon, 22 Jul 2024 19:35:02 +0300 Subject: [PATCH 31/51] refactoring --- .../workers-config-control.component.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts index 8430c29ecd..a5fff95a86 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts @@ -25,7 +25,9 @@ import { FormBuilder, NG_VALIDATORS, NG_VALUE_ACCESSOR, - UntypedFormGroup, ValidationErrors, Validator, + UntypedFormGroup, + ValidationErrors, + Validator, Validators } from '@angular/forms'; import { SharedModule } from '@shared/shared.module'; From a8f45560d0c0efb545e2bdb45a06df18ba605d06 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Mon, 22 Jul 2024 19:38:10 +0300 Subject: [PATCH 32/51] refactoring --- .../button/action-button-basic-config.component.html | 6 +++--- .../button/command-button-basic-config.component.html | 4 ++-- .../basic/button/power-button-basic-config.component.html | 8 ++++---- .../button/toggle-button-basic-config.component.html | 8 ++++---- .../indicator/status-widget-basic-config.component.html | 4 ++-- .../basic/rpc/single-switch-basic-config.component.html | 8 ++++---- .../config/basic/rpc/slider-basic-config.component.html | 6 +++--- .../home/components/widget/widget-config.component.html | 4 ++-- 8 files changed, 24 insertions(+), 24 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/config/basic/button/action-button-basic-config.component.html b/ui-ngx/src/app/modules/home/components/widget/config/basic/button/action-button-basic-config.component.html index a3030dec79..6940cffc1f 100644 --- a/ui-ngx/src/app/modules/home/components/widget/config/basic/button/action-button-basic-config.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/config/basic/button/action-button-basic-config.component.html @@ -27,7 +27,7 @@
widgets.action-button.behavior
-
{{ 'widgets.action-button.on-click' | translate}}
+
widgets.action-button.on-click
-
{{ 'widgets.button-state.activated-state' | translate }}
+
widgets.button-state.activated-state
-
{{ 'widgets.button-state.disabled-state' | translate }}
+
widgets.button-state.disabled-state
widgets.command-button.behavior
-
{{ 'widgets.command-button.on-click' | translate }}
+
widgets.command-button.on-click
-
{{ 'widgets.button-state.disabled-state' | translate }}
+
widgets.button-state.disabled-state
widgets.power-button.behavior
-
{{ 'widgets.rpc-state.initial-state' | translate }}
+
widgets.rpc-state.initial-state
-
{{ 'widgets.power-button.power-on' | translate }}
+
widgets.power-button.power-on
-
{{ 'widgets.power-button.power-off' | translate }}
+
widgets.power-button.power-off
-
{{ 'widgets.rpc-state.disabled-state' | translate }}
+
widgets.rpc-state.disabled-state
widgets.toggle-button.behavior
-
{{ 'widgets.rpc-state.initial-state' | translate }}
+
widgets.rpc-state.initial-state
-
{{ 'widgets.toggle-button.check' | translate }}
+
widgets.toggle-button.check
-
{{ 'widgets.toggle-button.uncheck' | translate }}
+
widgets.toggle-button.uncheck
-
{{ 'widgets.rpc-state.disabled-state' | translate }}
+
widgets.rpc-state.disabled-state
widgets.status-widget.behavior
-
{{ 'widgets.rpc-state.initial-state' | translate }}
+
widgets.rpc-state.initial-state
-
{{ 'widgets.rpc-state.disabled-state' | translate }}
+
widgets.rpc-state.disabled-state
widgets.single-switch.behavior
-
{{ 'widgets.rpc-state.initial-state' | translate }}
+
widgets.rpc-state.initial-state
-
{{ 'widgets.rpc-state.turn-on' | translate }}
+
widgets.rpc-state.turn-on
-
{{ 'widgets.rpc-state.turn-off' | translate }}
+
widgets.rpc-state.turn-off
-
{{ 'widgets.rpc-state.disabled-state' | translate }}
+
widgets.rpc-state.disabled-state
widgets.slider.behavior
-
{{ 'widgets.slider.initial-value' | translate }}
+
widgets.slider.initial-value
-
{{ 'widgets.slider.on-value-change' | translate }}
+
widgets.slider.on-value-change
-
{{ 'widgets.rpc-state.disabled-state' | translate }}
+
widgets.rpc-state.disabled-state
widget-config.data-settings
-
{{ 'widget-config.units-by-default' | translate }}
+
widget-config.units-by-default
-
{{ 'widget-config.decimals-by-default' | translate }}
+
widget-config.decimals-by-default
From 7a472f54f88b3952f64a9af8dbfbad28100c8468 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Mon, 22 Jul 2024 19:41:45 +0300 Subject: [PATCH 33/51] refactoring --- .../button/action-button-widget-settings.component.html | 4 ++-- .../button/command-button-widget-settings.component.html | 4 ++-- .../button/power-button-widget-settings.component.html | 8 ++++---- .../button/toggle-button-widget-settings.component.html | 8 ++++---- .../action/get-value-action-settings-panel.component.html | 2 +- .../indicator/status-widget-state-settings.component.html | 8 ++++---- .../control/single-switch-widget-settings.component.html | 8 ++++---- .../control/slider-widget-settings.component.html | 6 +++--- .../indicator/status-widget-settings.component.html | 4 ++-- 9 files changed, 26 insertions(+), 26 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/button/action-button-widget-settings.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/settings/button/action-button-widget-settings.component.html index a8cdf55efc..265a9c2501 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/button/action-button-widget-settings.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/button/action-button-widget-settings.component.html @@ -19,7 +19,7 @@
widgets.action-button.behavior
-
{{ 'widgets.button-state.activated-state' | translate }}
+
widgets.button-state.activated-state
-
{{ 'widgets.button-state.disabled-state' | translate }}
+
widgets.button-state.disabled-state
widgets.command-button.behavior
-
{{ 'widgets.command-button.on-click' | translate }}
+
widgets.command-button.on-click
-
{{ 'widgets.button-state.disabled-state' | translate }}
+
widgets.button-state.disabled-state
widgets.power-button.behavior
-
{{ 'widgets.rpc-state.initial-state' | translate }}
+
widgets.rpc-state.initial-state
-
{{ 'widgets.power-button.power-on' | translate }}
+
widgets.power-button.power-on
-
{{ 'widgets.power-button.power-off' | translate }}
+
widgets.power-button.power-off
-
{{ 'widgets.rpc-state.disabled-state' | translate }}
+
widgets.rpc-state.disabled-state
widgets.toggle-button.behavior
-
{{ 'widgets.rpc-state.initial-state' | translate }}
+
widgets.rpc-state.initial-state
-
{{ 'widgets.toggle-button.check' | translate }}
+
widgets.toggle-button.check
-
{{ 'widgets.toggle-button.uncheck' | translate }}
+
widgets.toggle-button.uncheck
-
{{ 'widgets.rpc-state.disabled-state' | translate }}
+
widgets.rpc-state.disabled-state
-
{{ 'widgets.value-action.value' | translate }}
+
widgets.value-action.value
-
{{ 'widgets.status-widget.primary' | translate }}
+
widgets.status-widget.primary
-
{{ 'widgets.status-widget.secondary' | translate }}
+
widgets.status-widget.secondary
@@ -88,14 +88,14 @@ [fxLayoutAlign.lt-md]="layout !== StatusWidgetLayout.icon ? 'space-between center': 'start center'" style="gap: 12px;">
-
{{ 'widgets.status-widget.primary' | translate }}
+
widgets.status-widget.primary
-
{{ 'widgets.status-widget.secondary' | translate }}
+
widgets.status-widget.secondary
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/single-switch-widget-settings.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/single-switch-widget-settings.component.html index d5b732b6bb..9208efd68a 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/single-switch-widget-settings.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/control/single-switch-widget-settings.component.html @@ -19,7 +19,7 @@
widgets.single-switch.behavior
-
{{ 'widgets.rpc-state.initial-state' | translate }}
+
widgets.rpc-state.initial-state
-
{{ 'widgets.rpc-state.turn-on' | translate }}
+
widgets.rpc-state.turn-on
-
{{ 'widgets.rpc-state.turn-off' | translate }}
+
widgets.rpc-state.turn-off
-
{{ 'widgets.rpc-state.disabled-state' | translate }}
+
widgets.rpc-state.disabled-state
widgets.slider.behavior
-
{{ 'widgets.slider.initial-value' | translate }}
+
widgets.slider.initial-value
-
{{ 'widgets.slider.on-value-change' | translate }}
+
widgets.slider.on-value-change
-
{{ 'widgets.rpc-state.disabled-state' | translate }}
+
widgets.rpc-state.disabled-state
widgets.status-widget.behavior
-
{{ 'widgets.rpc-state.initial-state' | translate }}
+
widgets.rpc-state.initial-state
-
{{ 'widgets.rpc-state.disabled-state' | translate }}
+
widgets.rpc-state.disabled-state
Date: Tue, 23 Jul 2024 11:41:01 +0300 Subject: [PATCH 34/51] added suggestions --- .../modbus-data-keys-panel.component.ts | 2 ++ .../modbus-security-config.component.ts | 16 ++++++++++++++-- .../modbus-slave-config.component.html | 4 ++-- .../modbus-slave-config.component.ts | 13 ++++++++++++- .../modbus-values/modbus-values.component.ts | 9 ++++++++- 5 files changed, 38 insertions(+), 6 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts index 1a696dd75f..d128e3c246 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts @@ -30,6 +30,7 @@ import { CommonModule } from '@angular/common'; import { SharedModule } from '@shared/shared.module'; import { GatewayHelpLinkPipe } from '@home/pipes/gateway-help-link.pipe'; import { generateSecret } from '@core/utils'; +import { coerceBoolean } from '@shared/decorators/coercion'; @Component({ selector: 'tb-modbus-data-keys-panel', @@ -44,6 +45,7 @@ import { generateSecret } from '@core/utils'; }) export class ModbusDataKeysPanelComponent implements OnInit { + @coerceBoolean() @Input() isMaster = false; @Input() panelTitle: string; @Input() addKeyTitle: string; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts index 7efcf095ee..caaff5ea40 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts @@ -36,6 +36,7 @@ import { takeUntil } from 'rxjs/operators'; import { SecurityConfigComponent } from '@home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component'; +import { coerceBoolean } from '@shared/decorators/coercion'; @Component({ selector: 'tb-modbus-security-config', @@ -62,8 +63,10 @@ import { }) export class ModbusSecurityConfigComponent implements ControlValueAccessor, Validator, OnChanges, OnDestroy { + @coerceBoolean() @Input() isMaster = false; - @Input() disabled = false; + + disabled = false; securityConfigFormGroup: UntypedFormGroup; @@ -113,8 +116,17 @@ export class ModbusSecurityConfigComponent implements ControlValueAccessor, Vali this.onTouched = fn; } + setDisabledState(isDisabled: boolean): void { + this.disabled = isDisabled; + if (this.disabled) { + this.securityConfigFormGroup.disable({emitEvent: false}); + } else { + this.securityConfigFormGroup.enable({emitEvent: false}); + } + } + validate(): ValidationErrors | null { - return this.securityConfigFormGroup.valid || this.disabled ? null : { + return this.securityConfigFormGroup.valid ? null : { securityConfigFormGroup: { valid: false } }; } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html index 41a7d2aee7..0ccbc734bf 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html @@ -204,7 +204,7 @@ - +
@@ -252,6 +252,6 @@
gateway.values
- +
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts index 13a4eefb8c..1d34914b8b 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts @@ -135,12 +135,13 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat value.port = value.serialPort; delete value.serialPort; } - this.onChange(this.slaveConfigFormGroup.get('sendDataToThingsBoard').value ? value : {} as SlaveConfig); + this.onChange(value); this.onTouched(); }); this.observeTypeChange(); this.observeFormEnable(); + this.observeShowSecurity(); } ngOnDestroy(): void { @@ -194,6 +195,16 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat this.updateEnablingByProtocol(this.slaveConfigFormGroup.get('type').value); } + private observeShowSecurity(): void { + this.showSecurityControl.valueChanges.pipe(takeUntil(this.destroy$)).subscribe(value => { + if (value && this.slaveConfigFormGroup.get('sendDataToThingsBoard').value) { + this.slaveConfigFormGroup.get('security').enable({emitEvent: false}); + } else { + this.slaveConfigFormGroup.get('security').disable({emitEvent: false}); + } + }); + } + private updateEnablingByProtocol(type: ModbusProtocolType): void { if (type === ModbusProtocolType.Serial) { if (this.slaveConfigFormGroup.get('sendDataToThingsBoard').value) { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts index f3e9a28bce..fee7e72616 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts @@ -54,6 +54,7 @@ import { EllipsisChipListDirective } from '@shared/directives/ellipsis-chip-list import { MatButton } from '@angular/material/button'; import { TbPopoverService } from '@shared/components/popover.service'; import { ModbusDataKeysPanelComponent } from '../modbus-data-keys-panel/modbus-data-keys-panel.component'; +import { coerceBoolean } from '@shared/decorators/coercion'; @Component({ selector: 'tb-modbus-values', @@ -88,9 +89,10 @@ import { ModbusDataKeysPanelComponent } from '../modbus-data-keys-panel/modbus-d export class ModbusValuesComponent implements ControlValueAccessor, Validator, OnChanges, OnDestroy { + @coerceBoolean() @Input() singleMode = false; - @Input() disabled = false; + disabled = false; modbusRegisterTypes: ModbusRegisterType[] = Object.values(ModbusRegisterType); modbusValueKeys = Object.values(ModbusValueKey); ModbusValuesTranslationsMap = ModbusRegisterTranslationsMap; @@ -159,6 +161,11 @@ export class ModbusValuesComponent implements ControlValueAccessor, Validator, O }; } + setDisabledState(isDisabled: boolean): void { + this.disabled = isDisabled; + this.cdr.markForCheck(); + } + getValueGroup(valueKey: ModbusValueKey, register?: ModbusRegisterType) { return register ? this.valuesFormGroup.get(register).get(valueKey).value : this.valuesFormGroup.get(valueKey).value; } From 30f57ecd5a12fbc8faeaad5f8d208ed915e59672 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Tue, 23 Jul 2024 11:43:45 +0300 Subject: [PATCH 35/51] added suggestions --- .../modbus-security-config.component.ts | 7 +------ 1 file changed, 1 insertion(+), 6 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts index caaff5ea40..9c7cad5f83 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts @@ -96,11 +96,6 @@ export class ModbusSecurityConfigComponent implements ControlValueAccessor, Vali }); this.observeValueChanges(); } - if (this.disabled) { - this.securityConfigFormGroup.disable({emitEvent:false}); - } else { - this.securityConfigFormGroup.enable({emitEvent:false}); - } } ngOnDestroy(): void { @@ -152,7 +147,7 @@ export class ModbusSecurityConfigComponent implements ControlValueAccessor, Vali this.securityConfigFormGroup.valueChanges.pipe( takeUntil(this.destroy$) ).subscribe((value: ModbusSecurity) => { - this.onChange(this.disabled ? {} : value); + this.onChange(value); this.onTouched(); }); } From 3a9a654fd298c77c7445c47edc35892d968caabb Mon Sep 17 00:00:00 2001 From: mpetrov Date: Tue, 23 Jul 2024 17:59:18 +0300 Subject: [PATCH 36/51] functionality adjustments --- .../modbus-basic-config.component.ts | 7 + .../modbus-slave-config.component.html | 408 +++++++++--------- .../modbus-slave-config.component.scss | 18 + .../modbus-slave-config.component.ts | 27 +- .../modbus-slave-dialog.component.html | 6 +- .../modbus-slave-dialog.component.ts | 22 +- .../modbus-values/modbus-values.component.ts | 4 + .../lib/gateway/gateway-widget.models.ts | 10 +- .../assets/locale/locale.constant-en_US.json | 14 +- 9 files changed, 277 insertions(+), 239 deletions(-) create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.scss diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts index 445cb39983..35e0ee6e61 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts @@ -62,6 +62,13 @@ import { ModbusMasterTableComponent } from '../modbus-master-table/modbus-master :host { height: 100%; } + + :host ::ng-deep { + .mat-mdc-tab-body-content { + overflow: hidden !important; + } + } + :host ::ng-deep { .mat-mdc-tab-group, .mat-mdc-tab-body-wrapper { height: 100%; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html index 0ccbc734bf..1c1b55e6c2 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html @@ -15,243 +15,251 @@ limitations under the License. --> -
-
{{ 'gateway.hints.modbus-server' | translate }}
-
- - - {{ 'gateway.enable' | translate }} - - -
-
-
gateway.server-slave-config
- - {{ ModbusProtocolLabelsMap.get(type) }} - -
+
-
-
gateway.host
+
{{ 'gateway.hints.modbus-server' | translate }}
+
+ + + {{ 'gateway.enable' | translate }} + + +
+
+
+
+
gateway.server-slave-config
+ + {{ ModbusProtocolLabelsMap.get(type) }} + +
+
+
+
gateway.host
+
+ + + + warning + + +
+
+
+
gateway.port
+
+ + + + warning + + +
+
+ +
+
gateway.port
+
+ + + + warning + + +
+
+
+
+
+ gateway.method +
+
+ + + {{ ModbusMethodLabelsMap.get(method) }} + + +
+
+
+
+
gateway.unit-id
- + warning
-
-
gateway.port
+
+
gateway.device-name
- + warning
- -
-
gateway.port
-
- - - - warning - - -
+
+
gateway.device-profile
+
+ + + + warning + +
- +
-
- gateway.method +
gateway.poll-period
+
+ + +
+
+
+
gateway.baudrate
- - {{ ModbusMethodLabelsMap.get(method) }} + + {{ rate }}
-
-
-
gateway.unit-id
-
- - - - warning - - -
-
-
-
gateway.device-name
-
- - - - warning - - -
-
-
-
gateway.device-profile
-
- - - - warning - - -
-
-
-
gateway.poll-period
-
- - - -
-
-
-
gateway.baudrate
-
- - - -
-
- - - -
gateway.advanced-connection-settings
-
-
-
-
-
gateway.byte-order
-
- - - {{ order }} - - -
-
- - +
+ + - - - {{ 'gateway.tls-connection' | translate }} - - +
gateway.advanced-connection-settings
- -
- -
-
gateway.vendor-name
-
- - - -
-
-
-
gateway.product-code
-
- - - -
-
-
-
gateway.vendor-url
-
- - - -
-
-
-
gateway.product-name
-
- - - +
+
+
gateway.byte-order
+
+ + + {{ order }} + + +
+ + + + + + {{ 'gateway.tls-connection' | translate }} + + + + + + + +
+
gateway.vendor-name
+
+ + + +
+
+
+
gateway.product-code
+
+ + + +
+
+
+
gateway.vendor-url
+
+ + + +
+
+
+
gateway.product-name
+
+ + + +
+
+
+
gateway.model-name
+
+ + + +
+
+
-
-
gateway.model-name
-
- - - -
-
- + +
+
+
gateway.values
+
- -
-
gateway.values
-
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.scss new file mode 100644 index 0000000000..f41241f63a --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.scss @@ -0,0 +1,18 @@ +$server-config-header-height: 132px; + +:host { + .nested-expansion-header { + ::ng-deep .mat-content { + height: 100%; + } + } + + .slave-content { + height: calc(100% - #{$server-config-header-height}); + overflow: auto; + } + + .slave-container { + display: inherit; + } +} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts index 1d34914b8b..33a18ebbb7 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts @@ -27,6 +27,7 @@ import { Validators, } from '@angular/forms'; import { + ModbusBaudrates, ModbusMethodLabelsMap, ModbusMethodType, ModbusOrderType, @@ -71,15 +72,7 @@ import { ModbusValuesComponent, } from '../modbus-values/modbus-values.component ModbusSecurityConfigComponent, GatewayPortTooltipPipe, ], - styles: [` - :host { - .nested-expansion-header { - .mat-content { - height: 100%; - } - } - } - `], + styleUrls: ['modbus-slave-config.component.scss'], }) export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validator, OnDestroy { @@ -94,6 +87,7 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat readonly modbusSerialMethodTypes = Object.values(ModbusSerialMethodType); readonly modbusOrderType = Object.values(ModbusOrderType); readonly ModbusProtocolType = ModbusProtocolType; + readonly modbusBaudrates = ModbusBaudrates; readonly serialSpecificControlKeys = ['serialPort', 'baudrate']; readonly tcpUdpSpecificControlKeys = ['port', 'security', 'host']; @@ -110,11 +104,11 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat port: [null, [Validators.required, Validators.min(PortLimits.MIN), Validators.max(PortLimits.MAX)]], serialPort: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], method: [ModbusMethodType.RTU, []], - unitId: [null, [Validators.required]], - baudrate: [null, []], + unitId: [0, [Validators.required]], + baudrate: [this.ModbusProtocolType[0], []], deviceName: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], deviceType: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], - pollPeriod: [null, []], + pollPeriod: [5000, []], sendDataToThingsBoard: [false, []], byteOrder:[ModbusOrderType.BIG, []], security: [], @@ -240,10 +234,10 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat host: host ?? '', type: type ?? ModbusProtocolType.TCP, method: method ?? ModbusMethodType.RTU, - unitId: unitId ?? null, + unitId: unitId ?? 0, deviceName: deviceName ?? '', deviceType: deviceType ?? '', - pollPeriod: pollPeriod ?? null, + pollPeriod: pollPeriod ?? 5000, sendDataToThingsBoard: !!sendDataToThingsBoard, byteOrder: byteOrder ?? ModbusOrderType.BIG, security: security ?? {}, @@ -256,11 +250,12 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat }, values: values ?? {} as ModbusRegisterValues, port: port ?? null, + baudrate: baudrate ?? this.modbusBaudrates[0], }; if (slaveConfig.type === ModbusProtocolType.Serial) { - slaveState = { ...slaveState, baudrate, serialPort: port, host: '', port: null } as ModbusSlave; + slaveState = { ...slaveState, serialPort: port, host: '', port: null } as ModbusSlave; } else { - slaveState = { ...slaveState, serialPort: '', baudrate: null } as ModbusSlave; + slaveState = { ...slaveState, serialPort: '' } as ModbusSlave; } this.slaveConfigFormGroup.setValue(slaveState, {emitEvent: false}); } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html index d3c06aeb4b..026d1eef32 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html @@ -136,7 +136,9 @@
gateway.baudrate
- + + {{ rate }} +
@@ -162,7 +164,7 @@
gateway.parity
- + {{ ModbusParityLabelsMap.get(parity) }} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts index 941f6d49ee..8f78372e0f 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts @@ -25,6 +25,7 @@ import { } from '@angular/forms'; import { MappingInfo, + ModbusBaudrates, ModbusByteSizes, ModbusMethodLabelsMap, ModbusMethodType, @@ -100,6 +101,7 @@ export class ModbusSlaveDialogComponent extends DialogComponent( [ - [ModbusRegisterType.HoldingRegister, 'gateway.holding_registers'], + [ModbusRegisterType.HoldingRegisters, 'gateway.holding_registers'], [ModbusRegisterType.CoilsInitializer, 'gateway.coils_initializer'], - [ModbusRegisterType.InputRegister, 'gateway.input_registers'], + [ModbusRegisterType.InputRegisters, 'gateway.input_registers'], [ModbusRegisterType.DiscreteInputs, 'gateway.discrete_inputs'] ] ); @@ -1023,3 +1023,5 @@ export interface ModbusIdentity { productName?: string; modelName?: string; } + +export const ModbusBaudrates = [4800, 9600, 19200, 38400, 57600, 115200, 230400, 460800, 921600]; diff --git a/ui-ngx/src/assets/locale/locale.constant-en_US.json b/ui-ngx/src/assets/locale/locale.constant-en_US.json index 15583665b7..fb8f695619 100644 --- a/ui-ngx/src/assets/locale/locale.constant-en_US.json +++ b/ui-ngx/src/assets/locale/locale.constant-en_US.json @@ -2772,7 +2772,7 @@ "delete-value": "Delete value", "delete-rpc-method": "Delete method", "delete-rpc-request": "Delete request", - "delete-attribute-update": "Add attribute update", + "delete-attribute-update": "Delete attribute update", "advanced": "Advanced", "advanced-connection-settings": "Advanced connection settings", "attributes": "Attributes", @@ -2821,7 +2821,7 @@ "connectors-table-key": "Key", "connectors-table-class": "Class", "connection-timeout": "Connection timeout (s)", - "connect-attempt-time": "Connect attempt time (s)", + "connect-attempt-time": "Connect attempt time (ms)", "connect-attempt-count": "Connect attempt count", "copy-username": "Copy username", "copy-password": "Copy password", @@ -2954,10 +2954,10 @@ "unit-id": "Unit ID", "host": "Host", "host-required": "Host is required.", - "holding_registers": "Holding register", + "holding_registers": "Holding registers", "coils_initializer": "Coils initializer", - "input_registers": "Input register", - "discrete_inputs": "Discrete input", + "input_registers": "Input registers", + "discrete_inputs": "Discrete inputs", "json-parse": "Not valid JSON.", "json-required": "Field cannot be empty.", "JSONPath-hint": "This field supports constants and JSONPath expressions.", @@ -3019,7 +3019,7 @@ "password": "Password", "password-required": "Password is required.", "permit-without-calls": "Keep alive permit without calls", - "poll-period": "Poll period (s)", + "poll-period": "Poll period (ms)", "port": "Port", "port-required": "Port is required.", "port-limits-error": "Port should be number from {{min}} to {{max}}.", @@ -3307,7 +3307,7 @@ "exactly-once": "2 - Exactly once" }, "objects-count": "Objects count", - "wait-after-failed-attempts": "Wait after failed attempts (s)", + "wait-after-failed-attempts": "Wait after failed attempts (ms)", "tls-path-private-key": "Path to private key on gateway", "toggle-fullscreen": "Toggle fullscreen", "transformer-json-config": "Configuration JSON*", From 2382badc121751f0cff695079e1fc87ea4f812a7 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Tue, 23 Jul 2024 18:03:32 +0300 Subject: [PATCH 37/51] added license --- .../modbus-slave-config.component.scss | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.scss index f41241f63a..f3b39e3508 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.scss +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.scss @@ -1,3 +1,18 @@ +/** + * 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. + */ $server-config-header-height: 132px; :host { From 4d264d30a24833974658415dc52af2329f5a352d Mon Sep 17 00:00:00 2001 From: mpetrov Date: Tue, 23 Jul 2024 19:33:56 +0300 Subject: [PATCH 38/51] security for slaves disable state fix --- .../modbus-security-config.component.ts | 13 +++++++++++-- .../modbus-slave-dialog.component.html | 2 +- .../modbus-slave-dialog.component.ts | 11 +++++++++++ 3 files changed, 23 insertions(+), 3 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts index 9c7cad5f83..362edbee29 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts @@ -14,7 +14,15 @@ /// limitations under the License. /// -import { ChangeDetectionStrategy, Component, forwardRef, Input, OnChanges, OnDestroy } from '@angular/core'; +import { + ChangeDetectionStrategy, + ChangeDetectorRef, + Component, + forwardRef, + Input, + OnChanges, + OnDestroy +} from '@angular/core'; import { ControlValueAccessor, FormBuilder, @@ -75,7 +83,7 @@ export class ModbusSecurityConfigComponent implements ControlValueAccessor, Vali private destroy$ = new Subject(); - constructor(private fb: FormBuilder) { + constructor(private fb: FormBuilder, private cdr: ChangeDetectorRef) { this.securityConfigFormGroup = this.fb.group({ certfile: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], keyfile: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], @@ -118,6 +126,7 @@ export class ModbusSecurityConfigComponent implements ControlValueAccessor, Vali } else { this.securityConfigFormGroup.enable({emitEvent: false}); } + this.cdr.markForCheck(); } validate(): ValidationErrors | null { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html index 026d1eef32..caa1af4029 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html @@ -281,7 +281,7 @@ - +
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts index 8f78372e0f..40a4459221 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts @@ -172,6 +172,7 @@ export class ModbusSlaveDialogComponent extends DialogComponent this.slaveConfigFormGroup.get(key)?.enable({emitEvent: false})); } }; + + private observeShowSecurity(): void { + this.showSecurityControl.valueChanges.pipe(takeUntil(this.destroy$)).subscribe(value => { + if (value) { + this.slaveConfigFormGroup.get('security').enable({emitEvent: false}); + } else { + this.slaveConfigFormGroup.get('security').disable({emitEvent: false}); + } + }); + } } From 38f07984c41d55a1f31a09183638531a3211a55a Mon Sep 17 00:00:00 2001 From: mpetrov Date: Wed, 24 Jul 2024 15:53:22 +0300 Subject: [PATCH 39/51] functionality fixes --- .../broker-config-control.component.ts | 4 +- .../modbus-master-table.component.html | 2 +- .../modbus-master-table.component.ts | 6 +- .../modbus-security-config.component.ts | 40 ++-- .../modbus-slave-config.component.html | 31 +-- .../modbus-slave-config.component.ts | 20 +- .../modbus-slave-dialog.component.html | 192 +++++++++--------- .../modbus-slave-dialog.component.ts | 10 +- .../modbus-values/modbus-values.component.ts | 43 ++-- .../lib/gateway/gateway-widget.models.ts | 14 +- 10 files changed, 187 insertions(+), 175 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts index 031388b502..da67296869 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts @@ -37,9 +37,7 @@ import { TranslateService } from '@ngx-translate/core'; import { generateSecret } from '@core/utils'; import { Subject } from 'rxjs'; import { GatewayPortTooltipPipe } from '@home/pipes/gateway-port-tooltip.pipe'; -import { - SecurityConfigComponent -} from '@home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component'; +import { SecurityConfigComponent } from '../security-config/security-config.component'; @Component({ selector: 'tb-broker-config-control', diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.html index ac5e6f3108..2e92d80c9f 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.html @@ -72,7 +72,7 @@ {{ 'gateway.client-communication-type' | translate }} - {{ ModbusClientTypeLabelsMap.get(mapping['type']) }} + {{ ModbusProtocolLabelsMap.get(mapping['type']) }} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts index 6644fbfd5e..10b1e5bbbe 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts @@ -40,7 +40,9 @@ import { Validator, } from '@angular/forms'; import { - ModbusClientTypeLabelsMap, ModbusMasterConfig, SlaveConfig, + ModbusMasterConfig, + ModbusProtocolLabelsMap, + SlaveConfig } from '@home/components/widget/lib/gateway/gateway-widget.models'; import { isDefinedAndNotNull, isUndefinedOrNull } from '@core/utils'; import { SharedModule } from '@shared/shared.module'; @@ -80,7 +82,7 @@ export class ModbusMasterTableComponent implements ControlValueAccessor, Validat masterFormGroup: UntypedFormGroup; textSearch = this.fb.control('', {nonNullable: true}); - readonly ModbusClientTypeLabelsMap = ModbusClientTypeLabelsMap; + readonly ModbusProtocolLabelsMap = ModbusProtocolLabelsMap; private onChange: (value: string) => void = () => {}; private onTouched: () => void = () => {}; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts index 362edbee29..75328d1264 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts @@ -41,9 +41,6 @@ import { SharedModule } from '@shared/shared.module'; import { CommonModule } from '@angular/common'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; -import { - SecurityConfigComponent -} from '@home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component'; import { coerceBoolean } from '@shared/decorators/coercion'; @Component({ @@ -66,7 +63,6 @@ import { coerceBoolean } from '@shared/decorators/coercion'; imports: [ CommonModule, SharedModule, - SecurityConfigComponent, ] }) export class ModbusSecurityConfigComponent implements ControlValueAccessor, Validator, OnChanges, OnDestroy { @@ -74,10 +70,10 @@ export class ModbusSecurityConfigComponent implements ControlValueAccessor, Vali @coerceBoolean() @Input() isMaster = false; - disabled = false; - securityConfigFormGroup: UntypedFormGroup; + private disabled = false; + private onChange: (value: ModbusSecurity) => void; private onTouched: () => void; @@ -89,21 +85,14 @@ export class ModbusSecurityConfigComponent implements ControlValueAccessor, Vali keyfile: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], password: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], server_hostname: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], + reqclicert: [{value: false, disabled: true}, []], }); this.observeValueChanges(); } ngOnChanges(): void { - if (this.isMaster) { - this.securityConfigFormGroup = this.fb.group({ - certfile: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], - keyfile: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], - password: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], - reqclicert: [false, []], - }); - this.observeValueChanges(); - } + this.updateMasterEnabling(); } ngOnDestroy(): void { @@ -126,6 +115,7 @@ export class ModbusSecurityConfigComponent implements ControlValueAccessor, Vali } else { this.securityConfigFormGroup.enable({emitEvent: false}); } + this.updateMasterEnabling(); this.cdr.markForCheck(); } @@ -137,19 +127,29 @@ export class ModbusSecurityConfigComponent implements ControlValueAccessor, Vali writeValue(securityConfig: ModbusSecurity): void { const { certfile, password, keyfile, server_hostname } = securityConfig; - let securityState = { + const securityState = { certfile: certfile ?? '', password: password ?? '', keyfile: keyfile ?? '', - server_hostname: server_hostname?? '', + server_hostname: server_hostname ?? '', reqclicert: !!securityConfig.reqclicert, }; + + this.securityConfigFormGroup.reset(securityState, {emitEvent: false}); + } + + private updateMasterEnabling(): void { if (this.isMaster) { - securityState = { ...securityState, reqclicert: !!securityConfig.reqclicert }; + if (!this.disabled) { + this.securityConfigFormGroup.get('reqclicert').enable({emitEvent: false}); + } + this.securityConfigFormGroup.get('server_hostname').disable({emitEvent: false}); } else { - securityState = { ...securityState, server_hostname: server_hostname ?? '' }; + if (!this.disabled) { + this.securityConfigFormGroup.get('server_hostname').enable({emitEvent: false}); + } + this.securityConfigFormGroup.get('reqclicert').disable({emitEvent: false}); } - this.securityConfigFormGroup.reset(securityState, {emitEvent: false}); } private observeValueChanges(): void { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html index 1c1b55e6c2..25a07ccfa5 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html @@ -181,8 +181,8 @@
-
- +
+
gateway.advanced-connection-settings
@@ -199,19 +199,20 @@
- - - - - - {{ 'gateway.tls-connection' | translate }} - - - - - - +
+ + + + + + {{ 'gateway.tls-connection' | translate }} + + + + + + +
gateway.vendor-name
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts index 33a18ebbb7..189ca75762 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts @@ -47,6 +47,7 @@ import { startWith, takeUntil } from 'rxjs/operators'; import { GatewayPortTooltipPipe } from '@home/pipes/gateway-port-tooltip.pipe'; import { ModbusSecurityConfigComponent } from '../modbus-security-config/modbus-security-config.component'; import { ModbusValuesComponent, } from '../modbus-values/modbus-values.component'; +import { isEqual } from '@core/utils'; @Component({ selector: 'tb-modbus-slave-config', @@ -158,7 +159,7 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat } writeValue(slaveConfig: ModbusSlave): void { - this.showSecurityControl.patchValue(!!slaveConfig.security); + this.showSecurityControl.patchValue(!!slaveConfig.security && !isEqual(slaveConfig.security, {})); this.updateSlaveConfig(slaveConfig); this.updateFormEnableState(slaveConfig.sendDataToThingsBoard); } @@ -187,16 +188,19 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat this.slaveConfigFormGroup.get('sendDataToThingsBoard').enable({emitEvent: false}); } this.updateEnablingByProtocol(this.slaveConfigFormGroup.get('type').value); + this.updateSecurityEnable(this.showSecurityControl.value); } private observeShowSecurity(): void { - this.showSecurityControl.valueChanges.pipe(takeUntil(this.destroy$)).subscribe(value => { - if (value && this.slaveConfigFormGroup.get('sendDataToThingsBoard').value) { - this.slaveConfigFormGroup.get('security').enable({emitEvent: false}); - } else { - this.slaveConfigFormGroup.get('security').disable({emitEvent: false}); - } - }); + this.showSecurityControl.valueChanges.pipe(takeUntil(this.destroy$)).subscribe(value => this.updateSecurityEnable(value)); + } + + private updateSecurityEnable(isEnabled: boolean): void { + if (isEnabled && this.slaveConfigFormGroup.get('sendDataToThingsBoard').value) { + this.slaveConfigFormGroup.get('security').enable({emitEvent: false}); + } else { + this.slaveConfigFormGroup.get('security').disable({emitEvent: false}); + } } private updateEnablingByProtocol(type: ModbusProtocolType): void { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html index caa1af4029..a8aa70c878 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html @@ -236,108 +236,112 @@
- - - -
gateway.advanced-connection-settings
-
-
-
-
-
gateway.connection-timeout
-
- - - +
+ + + +
gateway.advanced-connection-settings
+
+
+
+
+
gateway.connection-timeout
+
+ + + +
-
-
-
gateway.byte-order
-
- - - {{ order }} - - +
+
gateway.byte-order
+
+ + + {{ order }} + + +
-
-
-
gateway.word-order
-
- - - {{ order }} - - +
+
gateway.word-order
+
+ + + {{ order }} + + +
-
- - - - - - {{ 'gateway.tls-connection' | translate }} - - - - - - -
- - - {{ 'gateway.retries' | translate }} - - -
-
- - - {{ 'gateway.retries-on-empty' | translate }} - - -
-
- - - {{ 'gateway.retries-on-invalid' | translate }} - - -
-
-
gateway.poll-period
-
- - - +
+ + + + + + {{ 'gateway.tls-connection' | translate }} + + + + + +
-
-
-
gateway.connect-attempt-time
-
- - - +
+ + + {{ 'gateway.retries' | translate }} + +
-
-
-
gateway.connect-attempt-count
-
- - - +
+ + + {{ 'gateway.retries-on-empty' | translate }} + +
-
-
-
gateway.wait-after-failed-attempts
-
- - - +
+ + + {{ 'gateway.retries-on-invalid' | translate }} + + +
+
+
gateway.poll-period
+
+ + + +
+
+
+
gateway.connect-attempt-time
+
+ + + +
+
+
+
gateway.connect-attempt-count
+
+ + + +
+
+
+
gateway.wait-after-failed-attempts
+
+ + + +
-
- + +
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts index 40a4459221..f01bbf7618 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts @@ -51,6 +51,7 @@ import { Router } from '@angular/router'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; import { GatewayPortTooltipPipe } from '@home/pipes/gateway-port-tooltip.pipe'; import { takeUntil } from 'rxjs/operators'; +import { isEqual } from '@core/utils'; @Component({ selector: 'tb-modbus-slave-dialog', @@ -81,12 +82,6 @@ import { takeUntil } from 'rxjs/operators'; .slaves-config-container { width: 900px; } - .nested-expansion-header { - .mat-content { - height: 100%; - overflow: hidden; - } - } } `], }) @@ -169,10 +164,10 @@ export class ModbusSlaveDialogComponent extends DialogComponent { - return { - ...registersAcc, - [register]: this.fb.group(this.modbusValueKeys.reduce((acc, key) => ({...acc, [key]: [[], []]}), {})), - }; - }, {})); + ) {} + ngOnInit() { + this.initializeValuesFormGroup(); this.observeValuesChanges(); } - ngOnChanges(): void { - if (this.singleMode) { - this.valuesFormGroup = this.fb.group(this.modbusValueKeys.reduce((acc, key) => ({...acc, [key]: [[], []]}), {})); - this.observeValuesChanges(); - } - } - ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); @@ -218,6 +207,28 @@ export class ModbusValuesComponent implements ControlValueAccessor, Validator, O } } + private initializeValuesFormGroup(): void { + if (this.singleMode) { + this.valuesFormGroup = this.fb.group(this.modbusValueKeys.reduce((acc, key) => { + acc[key] = this.fb.control([[], []]); + return acc; + }, {})); + } else { + this.valuesFormGroup = this.fb.group( + this.modbusRegisterTypes.reduce((registersAcc, register) => { + + registersAcc[register] = this.fb.group(this.modbusValueKeys.reduce((acc, key) => { + acc[key] = this.fb.control([[], []]); + return acc; + }, {})); + + return registersAcc; + }, {}) + ); + } + } + + private observeValuesChanges(): void { this.valuesFormGroup.valueChanges .pipe(takeUntil(this.destroy$)) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-widget.models.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-widget.models.ts index 3c041cd005..2db6d9d2fe 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-widget.models.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-widget.models.ts @@ -823,6 +823,9 @@ export enum ModbusDataType { STRING = 'string', BYTES = 'bytes', BITS = 'bits', + INT8 = '8int', + UINT8 = '8uint', + FLOAT8 = '8float', INT16 = '16int', UINT16 = '16uint', FLOAT16 = '16float', @@ -835,6 +838,9 @@ export enum ModbusDataType { } export enum ModbusObjectCountByDataType { + '8int' = 1, + '8uint' = 1, + '8float' = 1, '16int' = 1, '16uint' = 1, '16float' = 1, @@ -907,14 +913,6 @@ export const ModbusKeysNoKeysTextTranslationsMap = new Map( - [ - [ModbusProtocolType.TCP, 'TCP/UDP'], - [ModbusProtocolType.UDP, 'TCP/UDP'], - [ModbusProtocolType.Serial, 'Serial'], - ] -); - export const ModbusFunctionCodeTranslationsMap = new Map( [ [1, 'gateway.read-coils'], From e9d58525bc26ddca5a4de4061c5b0bd09fa1d359 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Wed, 24 Jul 2024 16:26:51 +0300 Subject: [PATCH 40/51] dialog word order for serial fix --- .../modbus-slave-dialog/modbus-slave-dialog.component.html | 2 +- .../modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html index a8aa70c878..60ef25f875 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html @@ -262,7 +262,7 @@
-
+
gateway.word-order
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts index f01bbf7618..8c6fb87e11 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts @@ -105,7 +105,7 @@ export class ModbusSlaveDialogComponent extends DialogComponent(); From 7b9d8e0a5528e07344cd829267e55c3821b144a7 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Thu, 25 Jul 2024 12:09:26 +0300 Subject: [PATCH 41/51] major refactoring --- .../modbus-basic-config.component.ts | 15 +- .../modbus-data-keys-panel.component.html | 13 +- .../modbus-data-keys-panel.component.ts | 92 +++++++---- .../modbus-master-table.component.html | 10 +- .../modbus-master-table.component.scss | 21 +-- .../modbus-master-table.component.ts | 45 +++--- .../modbus-security-config.component.ts | 2 +- .../modbus-slave-config.component.html | 9 +- .../modbus-slave-config.component.scss | 5 - .../modbus-slave-config.component.ts | 151 +++++++++--------- .../modbus-slave-dialog.component.html | 6 +- .../modbus-slave-dialog.component.ts | 122 +++++++------- .../modbus-values/modbus-values.component.ts | 109 ++++++------- .../lib/gateway/gateway-widget.models.ts | 27 +--- .../widget/widget-components.module.ts | 39 ++--- .../home/pipes/gateway-port-tooltip.pipe.ts | 12 +- .../ellipsis-chip-list.directive.ts | 5 +- .../assets/locale/locale.constant-en_US.json | 1 + .../connector-default-configs/modbus.json | 1 + 19 files changed, 340 insertions(+), 345 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts index 35e0ee6e61..12143fb6db 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts @@ -68,12 +68,6 @@ import { ModbusMasterTableComponent } from '../modbus-master-table/modbus-master overflow: hidden !important; } } - - :host ::ng-deep { - .mat-mdc-tab-group, .mat-mdc-tab-body-wrapper { - height: 100%; - } - } `] }) @@ -83,10 +77,9 @@ export class ModbusBasicConfigComponent implements ControlValueAccessor, Validat basicFormGroup: FormGroup; - onChange: (value: string) => void; + onChange: (value: ModbusBasicConfig) => void; onTouched: () => void; - protected readonly connectorType = ConnectorType; private destroy$ = new Subject(); constructor(private fb: FormBuilder) { @@ -108,7 +101,7 @@ export class ModbusBasicConfigComponent implements ControlValueAccessor, Validat this.destroy$.complete(); } - registerOnChange(fn: (value: string) => void): void { + registerOnChange(fn: (value: ModbusBasicConfig) => void): void { this.onChange = fn; } @@ -118,8 +111,8 @@ export class ModbusBasicConfigComponent implements ControlValueAccessor, Validat writeValue(basicConfig: ModbusBasicConfig): void { const editedBase = { - slave: basicConfig.slave || {}, - master: basicConfig.master || {}, + slave: basicConfig.slave ?? {}, + master: basicConfig.master ?? {}, }; this.basicFormGroup.setValue(editedBase, {emitEvent: false}); diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html index 048ee94553..5285422bd6 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html @@ -20,7 +20,7 @@
{{ panelTitle | translate }}{{' (' + keysListFormArray.controls.length + ')'}}
+ *ngFor="let keyControl of keysListFormArray.controls; trackBy: trackByControlId; let $index = index; let last = last;">
@@ -99,10 +99,19 @@
-
gateway.address
+
gateway.address
+ + warning +
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts index d128e3c246..d0bfcf1e76 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts @@ -14,14 +14,21 @@ /// limitations under the License. /// -import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'; -import { AbstractControl, FormGroup, UntypedFormArray, UntypedFormBuilder, Validators } from '@angular/forms'; +import { Component, EventEmitter, Input, OnDestroy, OnInit, Output } from '@angular/core'; +import { + AbstractControl, + FormArray, + FormGroup, + UntypedFormArray, + UntypedFormBuilder, + UntypedFormGroup, + Validators +} from '@angular/forms'; import { TbPopoverComponent } from '@shared/components/popover.component'; import { ModbusDataType, ModbusFunctionCodeTranslationsMap, ModbusObjectCountByDataType, - ModbusRegisterType, ModbusValue, ModbusValueKey, noLeadTrailSpacesRegex, @@ -31,6 +38,8 @@ import { SharedModule } from '@shared/shared.module'; import { GatewayHelpLinkPipe } from '@home/pipes/gateway-help-link.pipe'; import { generateSecret } from '@core/utils'; import { coerceBoolean } from '@shared/decorators/coercion'; +import { takeUntil } from 'rxjs/operators'; +import { Subject } from 'rxjs'; @Component({ selector: 'tb-modbus-data-keys-panel', @@ -43,7 +52,7 @@ import { coerceBoolean } from '@shared/decorators/coercion'; GatewayHelpLinkPipe, ] }) -export class ModbusDataKeysPanelComponent implements OnInit { +export class ModbusDataKeysPanelComponent implements OnInit, OnDestroy { @coerceBoolean() @Input() isMaster = false; @@ -51,15 +60,13 @@ export class ModbusDataKeysPanelComponent implements OnInit { @Input() addKeyTitle: string; @Input() deleteKeyTitle: string; @Input() noKeysText: string; - @Input() register: ModbusRegisterType; @Input() keysType: ModbusValueKey; @Input() values: ModbusValue[]; @Input() popover: TbPopoverComponent; @Output() keysDataApplied = new EventEmitter>(); - keysListFormArray: UntypedFormArray; - errorText = ''; + keysListFormArray: FormArray; modbusDataTypes = Object.values(ModbusDataType); withFunctionCode = true; functionCodesMap = new Map(); @@ -67,9 +74,12 @@ export class ModbusDataKeysPanelComponent implements OnInit { readonly editableDataTypes = [ModbusDataType.BYTES, ModbusDataType.BITS, ModbusDataType.STRING]; readonly ModbusFunctionCodeTranslationsMap = ModbusFunctionCodeTranslationsMap; - readonly defaultReadFunctionCodes = [3, 4]; - readonly defaultWriteFunctionCodes = [5, 6, 15, 16]; - readonly stringAttrUpdatesWriteFunctionCodes = [6, 16]; + + private destroy$ = new Subject(); + + private readonly defaultReadFunctionCodes = [3, 4]; + private readonly defaultWriteFunctionCodes = [5, 6, 15, 16]; + private readonly stringAttrUpdatesWriteFunctionCodes = [6, 16]; constructor(private fb: UntypedFormBuilder) {} @@ -79,8 +89,13 @@ export class ModbusDataKeysPanelComponent implements OnInit { this.defaultFunctionCodes = this.getDefaultFunctionCodes(); } - trackByKey(_: number, keyControl: AbstractControl): AbstractControl { - return keyControl; + ngOnDestroy(): void { + this.destroy$.next(); + this.destroy$.complete(); + } + + trackByControlId(_: number, keyControl: AbstractControl): string { + return keyControl.value.id; } addKey(): void { @@ -88,7 +103,7 @@ export class ModbusDataKeysPanelComponent implements OnInit { tag: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], value: [{value: '', disabled: !this.isMaster}, [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], type: [ModbusDataType.BYTES, [Validators.required]], - address: [0, [Validators.required]], + address: [null, [Validators.required]], objectsCount: [1, [Validators.required]], functionCode: [this.getDefaultFunctionCodes()[0]], id: [{value: generateSecret(5), disabled: true}], @@ -107,7 +122,7 @@ export class ModbusDataKeysPanelComponent implements OnInit { } cancel(): void { - this.popover?.hide(); + this.popover.hide(); } applyKeysData(): void { @@ -116,32 +131,38 @@ export class ModbusDataKeysPanelComponent implements OnInit { private prepareKeysFormArray(values: ModbusValue[]): UntypedFormArray { const keysControlGroups: Array = []; + if (values) { - values.forEach(keyData => { - const { tag, value, type, address, objectsCount, functionCode } = keyData; - const dataKeyFormGroup = this.fb.group({ - tag: [tag, [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], - value: [{value, disabled: !this.isMaster}, [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], - type: [type, [Validators.required]], - address: [address, [Validators.required]], - objectsCount: [objectsCount, [Validators.required]], - functionCode: [functionCode, []], - id: [{value: generateSecret(5), disabled: true}], - }); + values.forEach(value => { + const dataKeyFormGroup = this.createDataKeyFormGroup(value); this.observeKeyDataType(dataKeyFormGroup); - this.functionCodesMap.set(dataKeyFormGroup.get('id').value, this.getFunctionCodes(type)); + this.functionCodesMap.set(dataKeyFormGroup.get('id').value, this.getFunctionCodes(value.type)); keysControlGroups.push(dataKeyFormGroup); }); } + return this.fb.array(keysControlGroups); } + private createDataKeyFormGroup(modbusValue: ModbusValue): FormGroup { + const { tag, value, type, address, objectsCount, functionCode } = modbusValue; + + return this.fb.group({ + tag: [tag, [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], + value: [{ value, disabled: !this.isMaster }, [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], + type: [type, [Validators.required]], + address: [address, [Validators.required]], + objectsCount: [objectsCount, [Validators.required]], + functionCode: [functionCode, [Validators.required]], + id: [{ value: generateSecret(5), disabled: true }], + }); + } + private observeKeyDataType(keyFormGroup: FormGroup): void { - keyFormGroup.get('type').valueChanges.subscribe(dataType => { - const objectsCountControl = keyFormGroup.get('objectsCount'); + keyFormGroup.get('type').valueChanges.pipe(takeUntil(this.destroy$)).subscribe(dataType => { if (!this.editableDataTypes.includes(dataType)) { - objectsCountControl.patchValue(ModbusObjectCountByDataType[dataType]); + keyFormGroup.get('objectsCount').patchValue(ModbusObjectCountByDataType[dataType], {emitEvent: false}); } this.functionCodesMap.set(keyFormGroup.get('id').value, this.getFunctionCodes(dataType)); }); @@ -149,20 +170,21 @@ export class ModbusDataKeysPanelComponent implements OnInit { private getFunctionCodes(dataType: ModbusDataType): number[] { if (this.keysType === ModbusValueKey.ATTRIBUTES_UPDATES) { - if (dataType === ModbusDataType.STRING) { - return this.stringAttrUpdatesWriteFunctionCodes; - } - return this.defaultWriteFunctionCodes; + return dataType === ModbusDataType.STRING + ? this.stringAttrUpdatesWriteFunctionCodes + : this.defaultWriteFunctionCodes; } + const functionCodes = [...this.defaultReadFunctionCodes]; if (dataType === ModbusDataType.BITS) { const bitsFunctionCodes = [1, 2]; - bitsFunctionCodes.forEach(code => functionCodes.push(code)); + functionCodes.push(...bitsFunctionCodes); functionCodes.sort(); } if (this.keysType === ModbusValueKey.RPC_REQUESTS) { - this.defaultWriteFunctionCodes.forEach(code => functionCodes.push(code)); + functionCodes.push(...this.defaultWriteFunctionCodes); } + return functionCodes; } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.html index 2e92d80c9f..e16aa0c51f 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.html @@ -60,18 +60,18 @@
- + {{ 'gateway.name' | translate }} - + {{ mapping['name'] }} - + {{ 'gateway.client-communication-type' | translate }} - + {{ ModbusProtocolLabelsMap.get(mapping['type']) }} @@ -111,7 +111,7 @@ - +
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.scss index 82cead07a4..e9a5d3ebcd 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.scss +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.scss @@ -19,19 +19,15 @@ width: 100%; height: 100%; display: block; + .tb-master-table { + .tb-master-table-content { width: 100%; height: 100%; background: #fff; overflow: hidden; - &.tb-outlined-border { - box-shadow: 0 0 0 0 rgb(0 0 0 / 20%), 0 0 0 0 rgb(0 0 0 / 14%), 0 0 0 0 rgb(0 0 0 / 12%); - border: solid 1px #e0e0e0; - border-radius: 4px; - } - .mat-toolbar-tools{ min-height: auto; } @@ -49,25 +45,17 @@ .table-container { overflow: auto; + .mat-mdc-table { table-layout: fixed; min-width: 450px; .table-value-column { padding: 0 12px; - width: 23%; - - &.request-column { - width: 38%; - } + width: 38%; } } } - - .ellipsis { - overflow: hidden; - text-overflow: ellipsis; - } } } @@ -91,6 +79,7 @@ :host ::ng-deep { mat-cell.tb-value-cell { cursor: pointer; + .mat-icon { height: 24px; width: 24px; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts index 10b1e5bbbe..7ca5c8a7fa 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts @@ -17,6 +17,7 @@ import { AfterViewInit, ChangeDetectionStrategy, + ChangeDetectorRef, Component, ElementRef, forwardRef, @@ -76,15 +77,12 @@ export class ModbusMasterTableComponent implements ControlValueAccessor, Validat textSearchMode = false; dataSource: SlavesDatasource; - hidePageSize = false; - activeValue = false; - dirtyValue = false; masterFormGroup: UntypedFormGroup; textSearch = this.fb.control('', {nonNullable: true}); readonly ModbusProtocolLabelsMap = ModbusProtocolLabelsMap; - private onChange: (value: string) => void = () => {}; + private onChange: (value: ModbusMasterConfig) => void = () => {}; private onTouched: () => void = () => {}; private destroy$ = new Subject(); @@ -93,10 +91,10 @@ export class ModbusMasterTableComponent implements ControlValueAccessor, Validat public translate: TranslateService, public dialog: MatDialog, private dialogService: DialogService, - private fb: FormBuilder + private fb: FormBuilder, + private cdr: ChangeDetectorRef, ) { - this.masterFormGroup = this.fb.group({ slaves: this.fb.array([])}); - this.dirtyValue = !this.activeValue; + this.masterFormGroup = this.fb.group({ slaves: this.fb.array([]) }); this.dataSource = new SlavesDatasource(); } @@ -124,13 +122,10 @@ export class ModbusMasterTableComponent implements ControlValueAccessor, Validat debounceTime(150), distinctUntilChanged((prev, current) => (prev ?? '') === current.trim()), takeUntil(this.destroy$) - ).subscribe((text) => { - const searchText = text.trim(); - this.updateTableData(this.slaves.value, searchText.trim()); - }); + ).subscribe(text => this.updateTableData(this.slaves.value, text.trim())); } - registerOnChange(fn: (value: string) => void): void { + registerOnChange(fn: (value: ModbusMasterConfig) => void): void { this.onChange = fn; } @@ -151,10 +146,10 @@ export class ModbusMasterTableComponent implements ControlValueAccessor, Validat enterFilterMode(): void { this.textSearchMode = true; - setTimeout(() => { - this.searchInputField.nativeElement.focus(); - this.searchInputField.nativeElement.setSelectionRange(0, 0); - }, 10); + this.cdr.detectChanges(); + const searchInput = this.searchInputField.nativeElement; + searchInput.focus(); + searchInput.setSelectionRange(0, 0); } exitFilterMode(): void { @@ -167,19 +162,20 @@ export class ModbusMasterTableComponent implements ControlValueAccessor, Validat if ($event) { $event.stopPropagation(); } - const value = isDefinedAndNotNull(index) ? this.slaves.at(index).value : {}; + const withIndex = isDefinedAndNotNull(index); + const value = withIndex ? this.slaves.at(index).value : {}; this.dialog.open(ModbusSlaveDialogComponent, { disableClose: true, panelClass: ['tb-dialog', 'tb-fullscreen-dialog'], data: { value, - buttonTitle: isUndefinedOrNull(index) ? 'action.add' : 'action.apply' + buttonTitle: withIndex ? 'action.add' : 'action.apply' } }).afterClosed() .pipe(take(1), takeUntil(this.destroy$)) .subscribe(res => { if (res) { - if (isDefinedAndNotNull(index)) { + if (withIndex) { this.slaves.at(index).patchValue(res); } else { this.slaves.push(this.fb.control(res)); @@ -199,7 +195,7 @@ export class ModbusMasterTableComponent implements ControlValueAccessor, Validat this.translate.instant('action.no'), this.translate.instant('action.yes'), true - ).subscribe((result) => { + ).pipe(take(1), takeUntil(this.destroy$)).subscribe((result) => { if (result) { this.slaves.removeAt(index); this.masterFormGroup.markAsDirty(); @@ -208,15 +204,14 @@ export class ModbusMasterTableComponent implements ControlValueAccessor, Validat } private updateTableData(data: SlaveConfig[], textSearch?: string): void { - let tableValue = data; if (textSearch) { - tableValue = tableValue.filter(value => - Object.values(value).some(val => - val.toString().toLowerCase().includes(textSearch.toLowerCase()) + data = data.filter(item => + Object.values(item).some(value => + value.toString().toLowerCase().includes(textSearch.toLowerCase()) ) ); } - this.dataSource.loadData(tableValue); + this.dataSource.loadData(data); } private pushDataAsFormArrays(slaves: SlaveConfig[]): void { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts index 75328d1264..bc40727b55 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-security-config/modbus-security-config.component.ts @@ -85,7 +85,7 @@ export class ModbusSecurityConfigComponent implements ControlValueAccessor, Vali keyfile: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], password: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], server_hostname: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], - reqclicert: [{value: false, disabled: true}, []], + reqclicert: [{value: false, disabled: true}], }); this.observeValueChanges(); diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html index 25a07ccfa5..56fc579361 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html @@ -86,11 +86,8 @@ warning @@ -188,7 +185,7 @@
gateway.advanced-connection-settings
-
+
gateway.byte-order
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.scss index f3b39e3508..0c2f9240be 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.scss +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.scss @@ -16,11 +16,6 @@ $server-config-header-height: 132px; :host { - .nested-expansion-header { - ::ng-deep .mat-content { - height: 100%; - } - } .slave-content { height: calc(100% - #{$server-config-header-height}); diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts index 189ca75762..d44272734d 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts @@ -18,9 +18,9 @@ import { ChangeDetectionStrategy, Component, forwardRef, OnDestroy } from '@angu import { ControlValueAccessor, FormBuilder, + FormControl, NG_VALIDATORS, NG_VALUE_ACCESSOR, - UntypedFormControl, UntypedFormGroup, ValidationErrors, Validator, @@ -78,7 +78,7 @@ import { isEqual } from '@core/utils'; export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validator, OnDestroy { slaveConfigFormGroup: UntypedFormGroup; - showSecurityControl: UntypedFormControl; + showSecurityControl: FormControl; ModbusProtocolLabelsMap = ModbusProtocolLabelsMap; ModbusMethodLabelsMap = ModbusMethodLabelsMap; portLimits = PortLimits; @@ -89,8 +89,9 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat readonly modbusOrderType = Object.values(ModbusOrderType); readonly ModbusProtocolType = ModbusProtocolType; readonly modbusBaudrates = ModbusBaudrates; - readonly serialSpecificControlKeys = ['serialPort', 'baudrate']; - readonly tcpUdpSpecificControlKeys = ['port', 'security', 'host']; + + private readonly serialSpecificControlKeys = ['serialPort', 'baudrate']; + private readonly tcpUdpSpecificControlKeys = ['port', 'security', 'host']; private onChange: (value: SlaveConfig) => void; private onTouched: () => void; @@ -100,18 +101,18 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat constructor(private fb: FormBuilder) { this.showSecurityControl = this.fb.control(false); this.slaveConfigFormGroup = this.fb.group({ - type: [ModbusProtocolType.TCP, []], + type: [ModbusProtocolType.TCP], host: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], port: [null, [Validators.required, Validators.min(PortLimits.MIN), Validators.max(PortLimits.MAX)]], serialPort: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], - method: [ModbusMethodType.RTU, []], + method: [ModbusMethodType.SOCKET], unitId: [0, [Validators.required]], - baudrate: [this.ModbusProtocolType[0], []], + baudrate: [this.modbusBaudrates[0]], deviceName: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], deviceType: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]], - pollPeriod: [5000, []], - sendDataToThingsBoard: [false, []], - byteOrder:[ModbusOrderType.BIG, []], + pollPeriod: [5000], + sendDataToThingsBoard: [false], + byteOrder:[ModbusOrderType.BIG], security: [], identity: this.fb.group({ vendorName: ['', [Validators.pattern(noLeadTrailSpacesRegex)]], @@ -123,22 +124,16 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat values: [], }); - this.slaveConfigFormGroup.valueChanges.pipe( - takeUntil(this.destroy$) - ).subscribe((value: SlaveConfig) => { - if (value.type === ModbusProtocolType.Serial) { - value.port = value.serialPort; - delete value.serialPort; - } - this.onChange(value); - this.onTouched(); - }); - + this.observeValueChanges(); this.observeTypeChange(); this.observeFormEnable(); this.observeShowSecurity(); } + get isSlaveEnabled(): boolean { + return this.slaveConfigFormGroup.get('sendDataToThingsBoard').value; + } + ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); @@ -154,7 +149,7 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat validate(): ValidationErrors | null { return this.slaveConfigFormGroup.valid ? null : { - serverConfigFormGroup: { valid: false } + slaveConfigFormGroup: { valid: false } }; } @@ -164,18 +159,29 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat this.updateFormEnableState(slaveConfig.sendDataToThingsBoard); } - private observeTypeChange(): void { - this.slaveConfigFormGroup.get('type').valueChanges.pipe(takeUntil(this.destroy$)).subscribe(type => { - this.updateFormEnableState(this.slaveConfigFormGroup.get('sendDataToThingsBoard').value); + private observeValueChanges(): void { + this.slaveConfigFormGroup.valueChanges.pipe( + takeUntil(this.destroy$) + ).subscribe((value: SlaveConfig) => { + if (value.type === ModbusProtocolType.Serial) { + value.port = value.serialPort; + delete value.serialPort; + } + this.onChange(value); + this.onTouched(); }); } + private observeTypeChange(): void { + this.slaveConfigFormGroup.get('type').valueChanges + .pipe(takeUntil(this.destroy$)) + .subscribe(() => this.updateFormEnableState(this.isSlaveEnabled)); + } + private observeFormEnable(): void { this.slaveConfigFormGroup.get('sendDataToThingsBoard').valueChanges - .pipe(startWith(this.slaveConfigFormGroup.get('sendDataToThingsBoard').value), takeUntil(this.destroy$)) - .subscribe(value => { - this.updateFormEnableState(value); - }); + .pipe(startWith(this.isSlaveEnabled), takeUntil(this.destroy$)) + .subscribe(value => this.updateFormEnableState(value)); } private updateFormEnableState(enabled: boolean): void { @@ -192,11 +198,13 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat } private observeShowSecurity(): void { - this.showSecurityControl.valueChanges.pipe(takeUntil(this.destroy$)).subscribe(value => this.updateSecurityEnable(value)); + this.showSecurityControl.valueChanges + .pipe(takeUntil(this.destroy$)) + .subscribe(value => this.updateSecurityEnable(value)); } - private updateSecurityEnable(isEnabled: boolean): void { - if (isEnabled && this.slaveConfigFormGroup.get('sendDataToThingsBoard').value) { + private updateSecurityEnable(securityEnabled: boolean): void { + if (securityEnabled && this.isSlaveEnabled) { this.slaveConfigFormGroup.get('security').enable({emitEvent: false}); } else { this.slaveConfigFormGroup.get('security').disable({emitEvent: false}); @@ -204,63 +212,58 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat } private updateEnablingByProtocol(type: ModbusProtocolType): void { - if (type === ModbusProtocolType.Serial) { - if (this.slaveConfigFormGroup.get('sendDataToThingsBoard').value) { - this.serialSpecificControlKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.enable({emitEvent: false})); - } - this.tcpUdpSpecificControlKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.disable({emitEvent: false})); - } else { - this.serialSpecificControlKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.disable({emitEvent: false})); - if (this.slaveConfigFormGroup.get('sendDataToThingsBoard').value) { - this.tcpUdpSpecificControlKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.enable({emitEvent: false})); - } + const enableKeys = type === ModbusProtocolType.Serial ? this.serialSpecificControlKeys : this.tcpUdpSpecificControlKeys; + const disableKeys = type === ModbusProtocolType.Serial ? this.tcpUdpSpecificControlKeys : this.serialSpecificControlKeys; + + if (this.isSlaveEnabled) { + enableKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.enable({ emitEvent: false })); } - }; + + disableKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.disable({ emitEvent: false })); + } private updateSlaveConfig(slaveConfig: ModbusSlave): void { const { + type = ModbusProtocolType.TCP, + method = ModbusMethodType.RTU, + unitId = 0, + deviceName = '', + deviceType = '', + pollPeriod = 5000, + sendDataToThingsBoard = false, + byteOrder = ModbusOrderType.BIG, + security = {}, + identity = { + vendorName: '', + productCode: '', + vendorUrl: '', + productName: '', + modelName: '', + }, + values = {} as ModbusRegisterValues, + baudrate = this.modbusBaudrates[0], + host = '', + port = null, + } = slaveConfig; + + const slaveState: ModbusSlave = { type, method, unitId, deviceName, deviceType, pollPeriod, - sendDataToThingsBoard, + sendDataToThingsBoard: !!sendDataToThingsBoard, byteOrder, security, identity, values, baudrate, - host, - port, - } = slaveConfig; - let slaveState: ModbusSlave = { - host: host ?? '', - type: type ?? ModbusProtocolType.TCP, - method: method ?? ModbusMethodType.RTU, - unitId: unitId ?? 0, - deviceName: deviceName ?? '', - deviceType: deviceType ?? '', - pollPeriod: pollPeriod ?? 5000, - sendDataToThingsBoard: !!sendDataToThingsBoard, - byteOrder: byteOrder ?? ModbusOrderType.BIG, - security: security ?? {}, - identity: identity ?? { - vendorName: '', - productCode: '', - vendorUrl: '', - productName: '', - modelName: '', - }, - values: values ?? {} as ModbusRegisterValues, - port: port ?? null, - baudrate: baudrate ?? this.modbusBaudrates[0], + host: type === ModbusProtocolType.Serial ? '' : host, + port: type === ModbusProtocolType.Serial ? null : port, + serialPort: (type === ModbusProtocolType.Serial ? port : '') as string, }; - if (slaveConfig.type === ModbusProtocolType.Serial) { - slaveState = { ...slaveState, serialPort: port, host: '', port: null } as ModbusSlave; - } else { - slaveState = { ...slaveState, serialPort: '' } as ModbusSlave; - } - this.slaveConfigFormGroup.setValue(slaveState, {emitEvent: false}); + + this.slaveConfigFormGroup.setValue(slaveState, { emitEvent: false }); } } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html index 60ef25f875..31d2202fcb 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html @@ -105,10 +105,8 @@ warning diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts index 8c6fb87e11..aae327ee6f 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts @@ -17,14 +17,13 @@ import { ChangeDetectionStrategy, Component, forwardRef, Inject, OnDestroy } from '@angular/core'; import { FormBuilder, + FormControl, NG_VALIDATORS, NG_VALUE_ACCESSOR, - UntypedFormControl, UntypedFormGroup, Validators, } from '@angular/forms'; import { - MappingInfo, ModbusBaudrates, ModbusByteSizes, ModbusMethodLabelsMap, @@ -35,6 +34,7 @@ import { ModbusProtocolLabelsMap, ModbusProtocolType, ModbusSerialMethodType, + ModbusSlaveInfo, noLeadTrailSpacesRegex, PortLimits, SlaveConfig, @@ -80,15 +80,15 @@ import { isEqual } from '@core/utils'; styles: [` :host { .slaves-config-container { - width: 900px; - } + width: 80vw; + max-width: 900px; } } `], }) export class ModbusSlaveDialogComponent extends DialogComponent implements OnDestroy { slaveConfigFormGroup: UntypedFormGroup; - showSecurityControl: UntypedFormControl; + showSecurityControl: FormControl; portLimits = PortLimits; readonly modbusProtocolTypes = Object.values(ModbusProtocolType); @@ -104,8 +104,9 @@ export class ModbusSlaveDialogComponent extends DialogComponent(); @@ -113,7 +114,7 @@ export class ModbusSlaveDialogComponent extends DialogComponent, protected router: Router, - @Inject(MAT_DIALOG_DATA) public data: MappingInfo, + @Inject(MAT_DIALOG_DATA) public data: ModbusSlaveInfo, public dialogRef: MatDialogRef, ) { super(store, router, dialogRef); @@ -121,42 +122,38 @@ export class ModbusSlaveDialogComponent extends DialogComponent { - this.updateControlsEnabling(type); - }); + this.slaveConfigFormGroup.get('type').valueChanges + .pipe(takeUntil(this.destroy$)) + .subscribe(type => this.updateControlsEnabling(type)); } private updateControlsEnabling(type: ModbusProtocolType): void { - if (type === ModbusProtocolType.Serial) { - this.serialSpecificControlKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.enable({emitEvent: false})); - this.tcpUdpSpecificControlKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.disable({emitEvent: false})); - } else { - this.serialSpecificControlKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.disable({emitEvent: false})); - this.tcpUdpSpecificControlKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.enable({emitEvent: false})); - } - }; + const [enableKeys, disableKeys] = type === ModbusProtocolType.Serial + ? [this.serialSpecificControlKeys, this.tcpUdpSpecificControlKeys] + : [this.tcpUdpSpecificControlKeys, this.serialSpecificControlKeys]; + + enableKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.enable({ emitEvent: false })); + disableKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.disable({ emitEvent: false })); + + this.updateSecurityEnabling(this.showSecurityControl.value); + } private observeShowSecurity(): void { - this.showSecurityControl.valueChanges.pipe(takeUntil(this.destroy$)).subscribe(value => { - if (value) { - this.slaveConfigFormGroup.get('security').enable({emitEvent: false}); - } else { - this.slaveConfigFormGroup.get('security').disable({emitEvent: false}); - } - }); + this.showSecurityControl.valueChanges + .pipe(takeUntil(this.destroy$)) + .subscribe(value => this.updateSecurityEnabling(value)); + } + + private updateSecurityEnabling(isEnabled: boolean): void { + if (isEnabled) { + this.slaveConfigFormGroup.get('security').enable({emitEvent: false}); + } else { + this.slaveConfigFormGroup.get('security').disable({emitEvent: false}); + } } } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts index 0e57d06d85..e111fee7b1 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts @@ -42,6 +42,7 @@ import { ModbusRegisterTranslationsMap, ModbusRegisterType, ModbusRegisterValues, + ModbusValue, ModbusValueKey, ModbusValues, ModbusValuesState, @@ -103,7 +104,7 @@ export class ModbusValuesComponent implements ControlValueAccessor, Validator, O ModbusValueKey = ModbusValueKey; valuesFormGroup: FormGroup; - private onChange: (value: string) => void; + private onChange: (value: ModbusValuesState) => void; private onTouched: () => void; private destroy$ = new Subject(); @@ -125,7 +126,7 @@ export class ModbusValuesComponent implements ControlValueAccessor, Validator, O this.destroy$.complete(); } - registerOnChange(fn: (value: string) => void): void { + registerOnChange(fn: (value: ModbusValuesState) => void): void { this.onChange = fn; } @@ -135,15 +136,15 @@ export class ModbusValuesComponent implements ControlValueAccessor, Validator, O writeValue(values: ModbusValuesState): void { if (this.singleMode) { - this.valuesFormGroup.setValue(this.getSingleRegisterState(values as ModbusValues), {emitEvent: false}); + this.valuesFormGroup.setValue(this.getSingleRegisterState(values as ModbusValues), { emitEvent: false }); } else { - const registers = values as ModbusRegisterValues; + const { holding_registers, coils_initializer, input_registers, discrete_inputs } = values as ModbusRegisterValues; this.valuesFormGroup.setValue({ - holding_registers: this.getSingleRegisterState(registers.holding_registers), - coils_initializer: this.getSingleRegisterState(registers.coils_initializer), - input_registers: this.getSingleRegisterState(registers.input_registers), - discrete_inputs: this.getSingleRegisterState(registers.discrete_inputs), - }, {emitEvent: false}); + holding_registers: this.getSingleRegisterState(holding_registers), + coils_initializer: this.getSingleRegisterState(coils_initializer), + input_registers: this.getSingleRegisterState(input_registers), + discrete_inputs: this.getSingleRegisterState(discrete_inputs), + }, { emitEvent: false }); } this.cdr.markForCheck(); } @@ -159,69 +160,63 @@ export class ModbusValuesComponent implements ControlValueAccessor, Validator, O this.cdr.markForCheck(); } - getValueGroup(valueKey: ModbusValueKey, register?: ModbusRegisterType) { + getValueGroup(valueKey: ModbusValueKey, register?: ModbusRegisterType): FormGroup { return register ? this.valuesFormGroup.get(register).get(valueKey).value : this.valuesFormGroup.get(valueKey).value; } manageKeys($event: Event, matButton: MatButton, keysType: ModbusValueKey, register?: ModbusRegisterType): void { - if ($event) { - $event.stopPropagation(); - } + $event.stopPropagation(); const trigger = matButton._elementRef.nativeElement; if (this.popoverService.hasPopover(trigger)) { this.popoverService.hidePopover(trigger); - } else { - const group = this.valuesFormGroup; - - const keysControl = register ? group.get(register).get(keysType) : group.get(keysType); - const ctx = { - values: keysControl.value, - isMaster: !this.singleMode, - keysType, - panelTitle: ModbusKeysPanelTitleTranslationsMap.get(keysType), - addKeyTitle: ModbusKeysAddKeyTranslationsMap.get(keysType), - deleteKeyTitle: ModbusKeysDeleteKeyTranslationsMap.get(keysType), - noKeysText: ModbusKeysNoKeysTextTranslationsMap.get(keysType) - }; - const dataKeysPanelPopover = this.popoverService.displayPopover( - trigger, - this.renderer, - this.viewContainerRef, - ModbusDataKeysPanelComponent, - 'leftBottom', - false, - null, - ctx, - {}, - {}, - {}, - true - ); - dataKeysPanelPopover.tbComponentRef.instance.popover = dataKeysPanelPopover; - dataKeysPanelPopover.tbComponentRef.instance.keysDataApplied.pipe(takeUntil(this.destroy$)).subscribe((keysData) => { - dataKeysPanelPopover.hide(); - keysControl.patchValue(keysData); - keysControl.markAsDirty(); - this.cdr.markForCheck(); - }); + return; } + + const keysControl = this.getValueGroup(keysType, register); + const ctx = { + values: keysControl.value, + isMaster: !this.singleMode, + keysType, + panelTitle: ModbusKeysPanelTitleTranslationsMap.get(keysType), + addKeyTitle: ModbusKeysAddKeyTranslationsMap.get(keysType), + deleteKeyTitle: ModbusKeysDeleteKeyTranslationsMap.get(keysType), + noKeysText: ModbusKeysNoKeysTextTranslationsMap.get(keysType) + }; + const dataKeysPanelPopover = this.popoverService.displayPopover( + trigger, + this.renderer, + this.viewContainerRef, + ModbusDataKeysPanelComponent, + 'leftBottom', + false, + null, + ctx, + {}, + {}, + {}, + true + ); + dataKeysPanelPopover.tbComponentRef.instance.popover = dataKeysPanelPopover; + dataKeysPanelPopover.tbComponentRef.instance.keysDataApplied.pipe(takeUntil(this.destroy$)).subscribe((keysData: ModbusValue[]) => { + dataKeysPanelPopover.hide(); + keysControl.patchValue(keysData); + keysControl.markAsDirty(); + this.cdr.markForCheck(); + }); } private initializeValuesFormGroup(): void { + const getValuesFormGroup = () => this.fb.group(this.modbusValueKeys.reduce((acc, key) => { + acc[key] = this.fb.control([[], []]); + return acc; + }, {})); + if (this.singleMode) { - this.valuesFormGroup = this.fb.group(this.modbusValueKeys.reduce((acc, key) => { - acc[key] = this.fb.control([[], []]); - return acc; - }, {})); + this.valuesFormGroup = getValuesFormGroup(); } else { this.valuesFormGroup = this.fb.group( this.modbusRegisterTypes.reduce((registersAcc, register) => { - - registersAcc[register] = this.fb.group(this.modbusValueKeys.reduce((acc, key) => { - acc[key] = this.fb.control([[], []]); - return acc; - }, {})); - + registersAcc[register] = getValuesFormGroup(); return registersAcc; }, {}) ); diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-widget.models.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-widget.models.ts index 2db6d9d2fe..3bdb67069a 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-widget.models.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-widget.models.ts @@ -485,6 +485,11 @@ export interface MappingInfo { buttonTitle: string; } +export interface ModbusSlaveInfo { + value: SlaveConfig; + buttonTitle: string; +} + export enum ConnectorConfigurationModes { BASIC = 'basic', ADVANCED = 'advanced' @@ -852,24 +857,6 @@ export enum ModbusObjectCountByDataType { '64float' = 4, } -export enum ModbusValueField { - Tag = 'tag', - Type = 'type', - ObjectsCount = 'objectsCount', - Address = 'address', - Value = 'value', -} - -export const ModbusFieldsTranslationsMap = new Map( - [ - [ModbusValueField.Tag, 'gateway.tag'], - [ModbusValueField.Type, 'gateway.type'], - [ModbusValueField.ObjectsCount, 'gateway.objects_count'], - [ModbusValueField.Address, 'gateway.address'], - [ModbusValueField.Value, 'gateway.value'] - ] -); - export enum ModbusValueKey { ATTRIBUTES = 'attributes', TIMESERIES = 'timeseries', @@ -946,7 +933,7 @@ export interface SlaveConfig { pollPeriod: number; unitId: number; deviceName: string; - deviceType?: string; + deviceType: string; sendDataOnlyOnChange: boolean; connectAttemptTimeMs: number; connectAttemptCount: number; @@ -959,7 +946,7 @@ export interface SlaveConfig { baudrate?: number; stopbits?: number; bytesize?: number; - parity?: string; + parity?: ModbusParity; strict?: boolean; } diff --git a/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts b/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts index 1e4093c22c..504f98420e 100644 --- a/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts +++ b/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts @@ -208,25 +208,26 @@ import { LabelCardWidgetComponent, LabelValueCardWidgetComponent, UnreadNotificationWidgetComponent, - NotificationTypeFilterPanelComponent], - imports: [ - CommonModule, - SharedModule, - RpcWidgetsModule, - HomePageWidgetsModule, - SharedHomeComponentsModule, - RestConnectorSecurityComponent, - GatewayHelpLinkPipe, - BrokerConfigControlComponent, - WorkersConfigControlComponent, - OpcServerConfigComponent, - MqttBasicConfigComponent, - MappingTableComponent, - OpcUaBasicConfigComponent, - KeyValueIsNotEmptyPipe, - ModbusBasicConfigComponent, - EllipsisChipListDirective, - ], + NotificationTypeFilterPanelComponent + ], + imports: [ + CommonModule, + SharedModule, + RpcWidgetsModule, + HomePageWidgetsModule, + SharedHomeComponentsModule, + RestConnectorSecurityComponent, + GatewayHelpLinkPipe, + BrokerConfigControlComponent, + WorkersConfigControlComponent, + OpcServerConfigComponent, + MqttBasicConfigComponent, + MappingTableComponent, + OpcUaBasicConfigComponent, + KeyValueIsNotEmptyPipe, + ModbusBasicConfigComponent, + EllipsisChipListDirective, + ], exports: [ EntitiesTableWidgetComponent, AlarmsTableWidgetComponent, diff --git a/ui-ngx/src/app/modules/home/pipes/gateway-port-tooltip.pipe.ts b/ui-ngx/src/app/modules/home/pipes/gateway-port-tooltip.pipe.ts index 3981499a26..fcf5766c05 100644 --- a/ui-ngx/src/app/modules/home/pipes/gateway-port-tooltip.pipe.ts +++ b/ui-ngx/src/app/modules/home/pipes/gateway-port-tooltip.pipe.ts @@ -30,12 +30,12 @@ export class GatewayPortTooltipPipe implements PipeTransform { transform(portControl: AbstractControl): string { if (portControl.hasError('required')) { return this.translate.instant('gateway.port-required'); - } else if ( - portControl.hasError('min') || - portControl.hasError('max') - ) { - return this.translate.instant('gateway.port-limits-error', - {min: PortLimits.MIN, max: PortLimits.MAX}); + } + if (portControl.hasError('min') || portControl.hasError('max')) { + return this.translate.instant('gateway.port-limits-error', { + min: PortLimits.MIN, + max: PortLimits.MAX, + }); } return ''; } diff --git a/ui-ngx/src/app/shared/directives/ellipsis-chip-list.directive.ts b/ui-ngx/src/app/shared/directives/ellipsis-chip-list.directive.ts index bb2847aeee..c320a2f78a 100644 --- a/ui-ngx/src/app/shared/directives/ellipsis-chip-list.directive.ts +++ b/ui-ngx/src/app/shared/directives/ellipsis-chip-list.directive.ts @@ -61,8 +61,11 @@ export class EllipsisChipListDirective implements OnDestroy { ).subscribe(() => { this.adjustChips(); }); + this.observeIntersection(); + } - this.intersectionObserver = new IntersectionObserver((entries) => { + private observeIntersection(): void { + this.intersectionObserver = new IntersectionObserver(entries => { entries.forEach(entry => { if (entry.isIntersecting) { this.adjustChips(); diff --git a/ui-ngx/src/assets/locale/locale.constant-en_US.json b/ui-ngx/src/assets/locale/locale.constant-en_US.json index fb8f695619..967e6a0122 100644 --- a/ui-ngx/src/assets/locale/locale.constant-en_US.json +++ b/ui-ngx/src/assets/locale/locale.constant-en_US.json @@ -2756,6 +2756,7 @@ }, "gateway": { "address": "Address", + "address-required": "Address required", "add-entry": "Add configuration", "add-attribute": "Add attribute", "add-attribute-update": "Add attribute update", diff --git a/ui-ngx/src/assets/metadata/connector-default-configs/modbus.json b/ui-ngx/src/assets/metadata/connector-default-configs/modbus.json index fee4e745d6..c84a2278b9 100644 --- a/ui-ngx/src/assets/metadata/connector-default-configs/modbus.json +++ b/ui-ngx/src/assets/metadata/connector-default-configs/modbus.json @@ -16,6 +16,7 @@ "pollPeriod": 5000, "unitId": 1, "deviceName": "Temp Sensor", + "deviceType": "default", "sendDataOnlyOnChange": true, "connectAttemptTimeMs": 5000, "connectAttemptCount": 5, From 0b8c122f0ac079a703d827d7fee02f8664896910 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Thu, 25 Jul 2024 12:11:19 +0300 Subject: [PATCH 42/51] refactoring --- .../modbus-data-keys-panel.component.html | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html index 5285422bd6..02d2d1491d 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.html @@ -76,7 +76,12 @@
- {{ ModbusFunctionCodeTranslationsMap.get(code) | translate }} + + {{ ModbusFunctionCodeTranslationsMap.get(code) | translate }} +
From 7624517a5e7673ef056712d0d18b7c74c9852985 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Thu, 25 Jul 2024 12:17:08 +0300 Subject: [PATCH 43/51] refactoring --- .../modbus-slave-dialog.component.ts | 64 ++++++++++--------- 1 file changed, 35 insertions(+), 29 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts index aae327ee6f..44f093e06e 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts @@ -120,6 +120,39 @@ export class ModbusSlaveDialogComponent extends DialogComponent Date: Thu, 25 Jul 2024 12:44:57 +0300 Subject: [PATCH 44/51] minor fix --- .../modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts index 44f093e06e..0aa4174c25 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts @@ -143,7 +143,7 @@ export class ModbusSlaveDialogComponent extends DialogComponent Date: Thu, 25 Jul 2024 15:30:07 +0300 Subject: [PATCH 45/51] method type switch fix and data keys crash fix --- .../modbus-data-keys-panel.component.ts | 14 +++++++++++--- .../modbus-slave-config.component.ts | 16 +++++++++++++++- .../modbus-slave-dialog.component.ts | 16 +++++++++++++++- .../modbus-values/modbus-values.component.html | 16 ++++++++-------- .../modbus-values/modbus-values.component.ts | 4 +++- 5 files changed, 52 insertions(+), 14 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts index d0bfcf1e76..c68bd8086e 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts @@ -105,7 +105,7 @@ export class ModbusDataKeysPanelComponent implements OnInit, OnDestroy { type: [ModbusDataType.BYTES, [Validators.required]], address: [null, [Validators.required]], objectsCount: [1, [Validators.required]], - functionCode: [this.getDefaultFunctionCodes()[0]], + functionCode: [{ value: this.getDefaultFunctionCodes()[0], disabled: !this.withFunctionCode }, [Validators.required]], id: [{value: generateSecret(5), disabled: true}], }); this.observeKeyDataType(dataKeyFormGroup); @@ -154,7 +154,7 @@ export class ModbusDataKeysPanelComponent implements OnInit, OnDestroy { type: [type, [Validators.required]], address: [address, [Validators.required]], objectsCount: [objectsCount, [Validators.required]], - functionCode: [functionCode, [Validators.required]], + functionCode: [{ value: functionCode, disabled: !this.withFunctionCode }, [Validators.required]], id: [{ value: generateSecret(5), disabled: true }], }); } @@ -164,10 +164,18 @@ export class ModbusDataKeysPanelComponent implements OnInit, OnDestroy { if (!this.editableDataTypes.includes(dataType)) { keyFormGroup.get('objectsCount').patchValue(ModbusObjectCountByDataType[dataType], {emitEvent: false}); } - this.functionCodesMap.set(keyFormGroup.get('id').value, this.getFunctionCodes(dataType)); + this.updateFunctionCodes(keyFormGroup, dataType); }); } + private updateFunctionCodes(keyFormGroup: FormGroup, dataType: ModbusDataType): void { + const functionCodes = this.getFunctionCodes(dataType); + this.functionCodesMap.set(keyFormGroup.get('id').value, functionCodes); + if (!functionCodes.includes(keyFormGroup.get('functionCode').value)) { + keyFormGroup.get('functionCode').patchValue(functionCodes[0], {emitEvent: false}); + } + } + private getFunctionCodes(dataType: ModbusDataType): number[] { if (this.keysType === ModbusValueKey.ATTRIBUTES_UPDATES) { return dataType === ModbusDataType.STRING diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts index d44272734d..3ff9e929ed 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts @@ -175,7 +175,21 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat private observeTypeChange(): void { this.slaveConfigFormGroup.get('type').valueChanges .pipe(takeUntil(this.destroy$)) - .subscribe(() => this.updateFormEnableState(this.isSlaveEnabled)); + .subscribe(type => { + this.updateFormEnableState(this.isSlaveEnabled); + this.updateMethodType(type); + }); + } + + private updateMethodType(type: ModbusProtocolType): void { + if (this.slaveConfigFormGroup.get('method').value !== ModbusMethodType.RTU) { + this.slaveConfigFormGroup.get('method').patchValue( + type === ModbusProtocolType.Serial + ? ModbusSerialMethodType.ASCII + : ModbusMethodType.SOCKET, + {emitEvent: false} + ); + } } private observeFormEnable(): void { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts index 0aa4174c25..38a77ac587 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts @@ -201,7 +201,21 @@ export class ModbusSlaveDialogComponent extends DialogComponent this.updateControlsEnabling(type)); + .subscribe(type => { + this.updateControlsEnabling(type); + this.updateMethodType(type); + }); + } + + private updateMethodType(type: ModbusProtocolType): void { + if (this.slaveConfigFormGroup.get('method').value !== ModbusMethodType.RTU) { + this.slaveConfigFormGroup.get('method').patchValue( + type === ModbusProtocolType.Serial + ? ModbusSerialMethodType.ASCII + : ModbusMethodType.SOCKET, + {emitEvent: false} + ); + } } private updateControlsEnabling(type: ModbusProtocolType): void { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.html index 5e0b4d7649..a6b4382638 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.html @@ -36,8 +36,8 @@
gateway.attributes
- - + + {{ attribute.tag }} @@ -57,8 +57,8 @@
gateway.timeseries
- - + + {{ telemetry.tag }} @@ -78,8 +78,8 @@
gateway.attribute-updates
- - + + {{ attributeUpdate.tag }} @@ -99,8 +99,8 @@
gateway.rpc-requests
- - + + {{ rpcRequest.tag }} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts index e111fee7b1..caff181b6a 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts @@ -161,7 +161,9 @@ export class ModbusValuesComponent implements ControlValueAccessor, Validator, O } getValueGroup(valueKey: ModbusValueKey, register?: ModbusRegisterType): FormGroup { - return register ? this.valuesFormGroup.get(register).get(valueKey).value : this.valuesFormGroup.get(valueKey).value; + return register + ? this.valuesFormGroup.get(register).get(valueKey) as FormGroup + : this.valuesFormGroup.get(valueKey) as FormGroup; } manageKeys($event: Event, matButton: MatButton, keysType: ModbusValueKey, register?: ModbusRegisterType): void { From 2ff3d0bafc883e4e650e2b0de4ed436c03ca3737 Mon Sep 17 00:00:00 2001 From: mpetrov Date: Thu, 25 Jul 2024 15:58:48 +0300 Subject: [PATCH 46/51] server register values fix --- .../modbus-data-keys-panel/modbus-data-keys-panel.component.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts index c68bd8086e..f1919e7a57 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts @@ -84,8 +84,8 @@ export class ModbusDataKeysPanelComponent implements OnInit, OnDestroy { constructor(private fb: UntypedFormBuilder) {} ngOnInit(): void { - this.keysListFormArray = this.prepareKeysFormArray(this.values); this.withFunctionCode = !this.isMaster || (this.keysType !== ModbusValueKey.ATTRIBUTES && this.keysType !== ModbusValueKey.TIMESERIES); + this.keysListFormArray = this.prepareKeysFormArray(this.values); this.defaultFunctionCodes = this.getDefaultFunctionCodes(); } From 2837edbbd1f6a90059164324c3a8f907c8a9746a Mon Sep 17 00:00:00 2001 From: mpetrov Date: Thu, 25 Jul 2024 16:31:58 +0300 Subject: [PATCH 47/51] refactoring --- .../modbus-slave-config.component.html | 10 +++++----- .../modbus-slave-config.component.ts | 8 ++++++-- .../modbus-slave-dialog.component.html | 14 +++++++------- .../modbus-slave-dialog.component.ts | 6 +++++- .../metadata/connector-default-configs/modbus.json | 2 +- 5 files changed, 24 insertions(+), 16 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html index 56fc579361..d37c8cc9ee 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html @@ -34,7 +34,7 @@
-
@@ -54,7 +54,7 @@
-
@@ -102,7 +102,7 @@
- {{ ModbusMethodLabelsMap.get(method) }} @@ -168,7 +168,7 @@
-
+
gateway.baudrate
@@ -196,7 +196,7 @@
-
+
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts index 3ff9e929ed..05083a087d 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts @@ -134,6 +134,10 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat return this.slaveConfigFormGroup.get('sendDataToThingsBoard').value; } + get protocolType(): ModbusProtocolType { + return this.slaveConfigFormGroup.get('type').value; + } + ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); @@ -207,7 +211,7 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat this.showSecurityControl.disable({emitEvent: false}); this.slaveConfigFormGroup.get('sendDataToThingsBoard').enable({emitEvent: false}); } - this.updateEnablingByProtocol(this.slaveConfigFormGroup.get('type').value); + this.updateEnablingByProtocol(this.protocolType); this.updateSecurityEnable(this.showSecurityControl.value); } @@ -218,7 +222,7 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat } private updateSecurityEnable(securityEnabled: boolean): void { - if (securityEnabled && this.isSlaveEnabled) { + if (securityEnabled && this.isSlaveEnabled && this.protocolType !== ModbusProtocolType.Serial) { this.slaveConfigFormGroup.get('security').enable({emitEvent: false}); } else { this.slaveConfigFormGroup.get('security').disable({emitEvent: false}); diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html index 31d2202fcb..1e47479f03 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.html @@ -53,7 +53,7 @@
-
@@ -73,7 +73,7 @@
-
@@ -122,14 +122,14 @@
- {{ ModbusMethodLabelsMap.get(method) }}
- +
gateway.baudrate
@@ -260,7 +260,7 @@
-
+
gateway.word-order
@@ -270,7 +270,7 @@
-
+
@@ -356,7 +356,7 @@
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts index 38a77ac587..cbfc7cc8c2 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts @@ -128,6 +128,10 @@ export class ModbusSlaveDialogComponent extends DialogComponent Date: Thu, 25 Jul 2024 19:30:59 +0300 Subject: [PATCH 48/51] Fixed Connector Form state after connector with basic config removal --- .../widget/lib/gateway/gateway-connectors.component.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts index 14a8c15c00..802ff6b1d4 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts @@ -397,7 +397,6 @@ export class GatewayConnectorComponent extends PageComponent implements AfterVie private clearOutConnectorForm(): void { this.initialConnector = null; - this.connectorForm.setControl('basicConfig', this.fb.group({}), {emitEvent: false}); this.connectorForm.setValue({ mode: ConnectorConfigurationModes.BASIC, name: '', From 05558d291ad2386e279aa353084d3cf3cdc0bd0a Mon Sep 17 00:00:00 2001 From: mpetrov Date: Fri, 26 Jul 2024 13:19:18 +0300 Subject: [PATCH 49/51] tb-datasource to shared --- .../mapping-table/mapping-table.component.ts | 2 +- .../modbus/modbus-master-table/modbus-master-table.component.ts | 2 +- .../components/table/table-datasource.abstract.ts | 0 3 files changed, 2 insertions(+), 2 deletions(-) rename ui-ngx/src/app/{modules/home => shared}/components/table/table-datasource.abstract.ts (100%) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts index 292cb43b6e..29dd89c59f 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts @@ -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 { TbTableDatasource } from '@home/components/table/table-datasource.abstract'; +import { TbTableDatasource } from '@shared/components/table/table-datasource.abstract'; @Component({ selector: 'tb-mapping-table', diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts index 7ca5c8a7fa..2cb66f6062 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts @@ -49,7 +49,7 @@ import { isDefinedAndNotNull, isUndefinedOrNull } from '@core/utils'; import { SharedModule } from '@shared/shared.module'; import { CommonModule } from '@angular/common'; import { ModbusSlaveDialogComponent } from '../modbus-slave-dialog/modbus-slave-dialog.component'; -import { TbTableDatasource } from '@home/components/table/table-datasource.abstract'; +import { TbTableDatasource } from '@shared/components/table/table-datasource.abstract'; @Component({ selector: 'tb-modbus-master-table', diff --git a/ui-ngx/src/app/modules/home/components/table/table-datasource.abstract.ts b/ui-ngx/src/app/shared/components/table/table-datasource.abstract.ts similarity index 100% rename from ui-ngx/src/app/modules/home/components/table/table-datasource.abstract.ts rename to ui-ngx/src/app/shared/components/table/table-datasource.abstract.ts From 2d11bb3af88025a43918a8319a1063ea038853be Mon Sep 17 00:00:00 2001 From: Vladyslav_Prykhodko Date: Fri, 26 Jul 2024 17:32:22 +0300 Subject: [PATCH 50/51] UI: Refactoring gateway components --- .../broker-config-control.component.ts | 2 +- .../mapping-table.component.html | 2 +- .../modbus-basic-config.component.scss | 24 +++++++++++++++++++ .../modbus-basic-config.component.ts | 12 +--------- .../modbus-data-keys-panel.component.ts | 2 +- .../modbus-slave-config.component.scss | 1 - .../modbus-slave-config.component.ts | 4 ++-- .../modbus-slave-dialog.component.scss | 21 ++++++++++++++++ .../modbus-slave-dialog.component.ts | 10 ++------ .../modbus-values.component.scss | 24 +++++++++++++++++++ .../modbus-values/modbus-values.component.ts | 12 +--------- .../opc-server-config.component.html | 12 +++++----- .../workers-config-control.component.html | 4 ++-- .../gateway}/pipes/gateway-help-link.pipe.ts | 0 .../pipes/gateway-port-tooltip.pipe.ts | 0 .../widget/widget-components.module.ts | 2 +- .../directives/truncate-tooltip.directive.ts | 17 +++++++++---- 17 files changed, 99 insertions(+), 50 deletions(-) create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.scss create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.scss create mode 100644 ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.scss rename ui-ngx/src/app/modules/home/{ => components/widget/lib/gateway}/pipes/gateway-help-link.pipe.ts (100%) rename ui-ngx/src/app/modules/home/{ => components/widget/lib/gateway}/pipes/gateway-port-tooltip.pipe.ts (100%) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts index 13cf1f4f13..f7d37b167e 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/broker-config-control/broker-config-control.component.ts @@ -36,7 +36,7 @@ import { CommonModule } from '@angular/common'; import { TranslateService } from '@ngx-translate/core'; import { generateSecret } from '@core/utils'; import { Subject } from 'rxjs'; -import { GatewayPortTooltipPipe } from '@home/pipes/gateway-port-tooltip.pipe'; +import { GatewayPortTooltipPipe } from '@home/components/widget/lib/gateway/pipes/gateway-port-tooltip.pipe'; import { SecurityConfigComponent } from '../security-config/security-config.component'; @Component({ diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.html index 7ebfb700bf..9f0566b566 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.html @@ -64,7 +64,7 @@ [class.request-column]="mappingType === mappingTypeEnum.REQUESTS"> {{ column.title | translate }} - {{ mapping[column.def] }} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.scss new file mode 100644 index 0000000000..b70fe42401 --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.scss @@ -0,0 +1,24 @@ +/** + * 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. + */ +:host { + height: 100%; +} + +:host ::ng-deep { + .mat-mdc-tab-body-content { + overflow: hidden !important; + } +} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts index 12143fb6db..1fca768980 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts @@ -58,17 +58,7 @@ import { ModbusMasterTableComponent } from '../modbus-master-table/modbus-master ModbusMasterTableComponent, EllipsisChipListDirective, ], - styles: [` - :host { - height: 100%; - } - - :host ::ng-deep { - .mat-mdc-tab-body-content { - overflow: hidden !important; - } - } - `] + styleUrls: ['./modbus-basic-config.component.scss'], }) export class ModbusBasicConfigComponent implements ControlValueAccessor, Validator, OnDestroy { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts index f1919e7a57..5b312f52c8 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-data-keys-panel/modbus-data-keys-panel.component.ts @@ -35,7 +35,7 @@ import { } from '@home/components/widget/lib/gateway/gateway-widget.models'; import { CommonModule } from '@angular/common'; import { SharedModule } from '@shared/shared.module'; -import { GatewayHelpLinkPipe } from '@home/pipes/gateway-help-link.pipe'; +import { GatewayHelpLinkPipe } from '@home/components/widget/lib/gateway/pipes/gateway-help-link.pipe'; import { generateSecret } from '@core/utils'; import { coerceBoolean } from '@shared/decorators/coercion'; import { takeUntil } from 'rxjs/operators'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.scss index 0c2f9240be..a464832202 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.scss +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.scss @@ -16,7 +16,6 @@ $server-config-header-height: 132px; :host { - .slave-content { height: calc(100% - #{$server-config-header-height}); overflow: auto; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts index 05083a087d..2a8488a2d4 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts @@ -44,7 +44,7 @@ import { SharedModule } from '@shared/shared.module'; import { CommonModule } from '@angular/common'; import { Subject } from 'rxjs'; import { startWith, takeUntil } from 'rxjs/operators'; -import { GatewayPortTooltipPipe } from '@home/pipes/gateway-port-tooltip.pipe'; +import { GatewayPortTooltipPipe } from '@home/components/widget/lib/gateway/pipes/gateway-port-tooltip.pipe'; import { ModbusSecurityConfigComponent } from '../modbus-security-config/modbus-security-config.component'; import { ModbusValuesComponent, } from '../modbus-values/modbus-values.component'; import { isEqual } from '@core/utils'; @@ -73,7 +73,7 @@ import { isEqual } from '@core/utils'; ModbusSecurityConfigComponent, GatewayPortTooltipPipe, ], - styleUrls: ['modbus-slave-config.component.scss'], + styleUrls: ['./modbus-slave-config.component.scss'], }) export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validator, OnDestroy { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.scss new file mode 100644 index 0000000000..8cea184957 --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.scss @@ -0,0 +1,21 @@ +/** + * 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. + */ +:host { + .slaves-config-container { + width: 80vw; + max-width: 900px; + } +} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts index cbfc7cc8c2..a00a488aa0 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-dialog/modbus-slave-dialog.component.ts @@ -49,7 +49,7 @@ import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; import { Router } from '@angular/router'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; -import { GatewayPortTooltipPipe } from '@home/pipes/gateway-port-tooltip.pipe'; +import { GatewayPortTooltipPipe } from '@home/components/widget/lib/gateway/pipes/gateway-port-tooltip.pipe'; import { takeUntil } from 'rxjs/operators'; import { isEqual } from '@core/utils'; @@ -77,13 +77,7 @@ import { isEqual } from '@core/utils'; ModbusSecurityConfigComponent, GatewayPortTooltipPipe, ], - styles: [` - :host { - .slaves-config-container { - width: 80vw; - max-width: 900px; } - } - `], + styleUrls: ['./modbus-slave-dialog.component.scss'], }) export class ModbusSlaveDialogComponent extends DialogComponent implements OnDestroy { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.scss new file mode 100644 index 0000000000..2d0782e6a5 --- /dev/null +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.scss @@ -0,0 +1,24 @@ +/** + * 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. + */ +:host { + .mat-mdc-tab-body-wrapper { + min-height: 320px; + } +} + +::ng-deep .mdc-evolution-chip-set__chips { + align-items: center; +} diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts index caff181b6a..6bfc07c130 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-values/modbus-values.component.ts @@ -79,17 +79,7 @@ import { coerceBoolean } from '@shared/decorators/coercion'; SharedModule, EllipsisChipListDirective, ], - styles: [` - :host { - .mat-mdc-tab-body-wrapper { - min-height: 320px; - } - } - - ::ng-deep .mdc-evolution-chip-set__chips { - align-items: center; - } - `] + styleUrls: ['./modbus-values.component.scss'] }) export class ModbusValuesComponent implements ControlValueAccessor, Validator, OnInit, OnDestroy { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.html index ddff8f4945..4c992c0e21 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.html @@ -17,7 +17,7 @@ -->
-
gateway.server-url
+
gateway.server-url
@@ -35,7 +35,7 @@
-
{{ 'gateway.timeout' | translate }}
+
{{ 'gateway.timeout' | translate }}
@@ -54,7 +54,7 @@
-
gateway.security
+
gateway.security
@@ -65,7 +65,7 @@
-
{{ 'gateway.scan-period' | translate }}
+
{{ 'gateway.scan-period' | translate }}
@@ -86,7 +86,7 @@
-
{{ 'gateway.sub-check-period' | translate }}
+
{{ 'gateway.sub-check-period' | translate }}
@@ -108,7 +108,7 @@
-
{{ 'gateway.enable-subscription' | translate }}
+
{{ 'gateway.enable-subscription' | translate }}
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.html index b348b49252..0a3bd4e6f3 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.html @@ -19,7 +19,7 @@
-
{{ 'gateway.max-number-of-workers' | translate }}
+
{{ 'gateway.max-number-of-workers' | translate }}
@@ -41,7 +41,7 @@
-
{{ 'gateway.max-messages-queue-for-worker' | translate }}
+
{{ 'gateway.max-messages-queue-for-worker' | translate }}
diff --git a/ui-ngx/src/app/modules/home/pipes/gateway-help-link.pipe.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/pipes/gateway-help-link.pipe.ts similarity index 100% rename from ui-ngx/src/app/modules/home/pipes/gateway-help-link.pipe.ts rename to ui-ngx/src/app/modules/home/components/widget/lib/gateway/pipes/gateway-help-link.pipe.ts diff --git a/ui-ngx/src/app/modules/home/pipes/gateway-port-tooltip.pipe.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/pipes/gateway-port-tooltip.pipe.ts similarity index 100% rename from ui-ngx/src/app/modules/home/pipes/gateway-port-tooltip.pipe.ts rename to ui-ngx/src/app/modules/home/components/widget/lib/gateway/pipes/gateway-port-tooltip.pipe.ts diff --git a/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts b/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts index 504f98420e..51d82dece9 100644 --- a/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts +++ b/ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts @@ -109,7 +109,7 @@ import { import { NotificationTypeFilterPanelComponent } from '@home/components/widget/lib/cards/notification-type-filter-panel.component'; -import { GatewayHelpLinkPipe } from '@home/pipes/gateway-help-link.pipe'; +import { GatewayHelpLinkPipe } from '@home/components/widget/lib/gateway/pipes/gateway-help-link.pipe'; import { EllipsisChipListDirective } from '@shared/directives/ellipsis-chip-list.directive'; import { BrokerConfigControlComponent diff --git a/ui-ngx/src/app/shared/directives/truncate-tooltip.directive.ts b/ui-ngx/src/app/shared/directives/truncate-tooltip.directive.ts index bf08780e11..95ec9fcf63 100644 --- a/ui-ngx/src/app/shared/directives/truncate-tooltip.directive.ts +++ b/ui-ngx/src/app/shared/directives/truncate-tooltip.directive.ts @@ -26,17 +26,24 @@ import { import { fromEvent, Subject } from 'rxjs'; import { filter, takeUntil, tap } from 'rxjs/operators'; import { MatTooltip, TooltipPosition } from '@angular/material/tooltip'; +import { coerceBoolean } from '@shared/decorators/coercion'; @Directive({ standalone: true, - selector: '[tbTruncateTooltip]', + selector: '[tbTruncateWithTooltip]', providers: [MatTooltip], - }) export class TruncateTooltipDirective implements OnInit, AfterViewInit, OnDestroy { - @Input('tbTruncateTooltip') text: string; - @Input() tooltipEnabled = true; - @Input() position: TooltipPosition = 'above'; + + @Input('tbTruncateWithTooltip') + text: string; + + @Input() + @coerceBoolean() + tooltipEnabled = true; + + @Input() + position: TooltipPosition = 'above'; private destroy$ = new Subject(); From 4acc32e6a9100a4d02ba7f598bc8fd5055e299e5 Mon Sep 17 00:00:00 2001 From: Vladyslav_Prykhodko Date: Fri, 26 Jul 2024 17:37:34 +0300 Subject: [PATCH 51/51] UI: Change name class from TruncateTooltipDirective to TruncateWithTooltipDirective --- .../mapping-table/mapping-table.component.ts | 4 ++-- .../opc-server-config/opc-server-config.component.ts | 4 ++-- .../workers-config-control.component.ts | 4 ++-- ...ooltip.directive.ts => truncate-with-tooltip.directive.ts} | 2 +- 4 files changed, 7 insertions(+), 7 deletions(-) rename ui-ngx/src/app/shared/directives/{truncate-tooltip.directive.ts => truncate-with-tooltip.directive.ts} (97%) diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts index abaeb1a4ab..2652f032b8 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts @@ -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 { TruncateTooltipDirective } from '@shared/directives/truncate-tooltip.directive'; +import { TruncateWithTooltipDirective } from '@shared/directives/truncate-with-tooltip.directive'; import { TbTableDatasource } from '@shared/components/table/table-datasource.abstract'; @Component({ @@ -78,7 +78,7 @@ import { TbTableDatasource } from '@shared/components/table/table-datasource.abs } ], standalone: true, - imports: [CommonModule, SharedModule, TruncateTooltipDirective] + imports: [CommonModule, SharedModule, TruncateWithTooltipDirective] }) export class MappingTableComponent implements ControlValueAccessor, Validator, AfterViewInit, OnInit, OnDestroy { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.ts index 35e144a6c7..eddad255a3 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/opc-server-config/opc-server-config.component.ts @@ -35,7 +35,7 @@ import { SharedModule } from '@shared/shared.module'; import { CommonModule } from '@angular/common'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; -import { TruncateTooltipDirective } from '@shared/directives/truncate-tooltip.directive'; +import { TruncateWithTooltipDirective } from '@shared/directives/truncate-with-tooltip.directive'; import { SecurityConfigComponent } from '@home/components/widget/lib/gateway/connectors-configuration/security-config/security-config.component'; @@ -62,7 +62,7 @@ import { CommonModule, SharedModule, SecurityConfigComponent, - TruncateTooltipDirective, + TruncateWithTooltipDirective, ] }) export class OpcServerConfigComponent implements ControlValueAccessor, Validator, OnDestroy { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts index db7f74555c..ad13b921bc 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/workers-config-control/workers-config-control.component.ts @@ -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 { TruncateTooltipDirective } from '@shared/directives/truncate-tooltip.directive'; +import { TruncateWithTooltipDirective } from '@shared/directives/truncate-with-tooltip.directive'; @Component({ selector: 'tb-workers-config-control', @@ -45,7 +45,7 @@ import { TruncateTooltipDirective } from '@shared/directives/truncate-tooltip.di imports: [ CommonModule, SharedModule, - TruncateTooltipDirective, + TruncateWithTooltipDirective, ], providers: [ { diff --git a/ui-ngx/src/app/shared/directives/truncate-tooltip.directive.ts b/ui-ngx/src/app/shared/directives/truncate-with-tooltip.directive.ts similarity index 97% rename from ui-ngx/src/app/shared/directives/truncate-tooltip.directive.ts rename to ui-ngx/src/app/shared/directives/truncate-with-tooltip.directive.ts index 95ec9fcf63..1281b86040 100644 --- a/ui-ngx/src/app/shared/directives/truncate-tooltip.directive.ts +++ b/ui-ngx/src/app/shared/directives/truncate-with-tooltip.directive.ts @@ -33,7 +33,7 @@ import { coerceBoolean } from '@shared/decorators/coercion'; selector: '[tbTruncateWithTooltip]', providers: [MatTooltip], }) -export class TruncateTooltipDirective implements OnInit, AfterViewInit, OnDestroy { +export class TruncateWithTooltipDirective implements OnInit, AfterViewInit, OnDestroy { @Input('tbTruncateWithTooltip') text: string;