refactoring

ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.html

@@ -23,16 +23,6 @@
     <tb-modbus-master-table formControlName="master"></tb-modbus-master-table>
   </mat-tab>
   <mat-tab label="{{ 'gateway.server-config' | translate }}">
-    <div class="tb-form-panel no-border no-padding padding-top">
-      <div class="tb-form-hint tb-primary-fill tb-flex center">{{ 'gateway.hints.modbus-server' | translate }}</div>
-      <div class="tb-form-row" fxLayoutAlign="space-between center">
-        <mat-slide-toggle class="mat-slide" [formControl]="enableSlaveControl">
-          <mat-label>
-            {{ 'gateway.enable' | translate }}
-          </mat-label>
-        </mat-slide-toggle>
-      </div>
-    </div>
     <tb-modbus-slave-config formControlName="slave"></tb-modbus-slave-config>
   </mat-tab>
 </mat-tab-group>

ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-basic-config/modbus-basic-config.component.ts

@@ -18,10 +18,10 @@ import { ChangeDetectionStrategy, Component, forwardRef, Input, OnDestroy, Templ
 import {
   ControlValueAccessor,
   FormBuilder,
-  FormControl,
   FormGroup,
   NG_VALIDATORS,
   NG_VALUE_ACCESSOR,
+  UntypedFormControl,
   ValidationErrors,
   Validator,
 } from '@angular/forms';
@@ -68,7 +68,6 @@ export class ModbusBasicConfigComponent implements ControlValueAccessor, Validat
   @Input() generalTabContent: TemplateRef<any>;
 
   basicFormGroup: FormGroup;
-  enableSlaveControl: FormControl<boolean>;
 
   onChange: (value: ModbusBasicConfig) => void;
   onTouched: () => void;
@@ -80,7 +79,6 @@ export class ModbusBasicConfigComponent implements ControlValueAccessor, Validat
       master: [],
       slave: [],
     });
-    this.enableSlaveControl = new FormControl(false);
 
     this.basicFormGroup.valueChanges
       .pipe(takeUntil(this.destroy$))
@@ -88,14 +86,6 @@ export class ModbusBasicConfigComponent implements ControlValueAccessor, Validat
         this.onChange(value);
         this.onTouched();
       });
-
-    this.enableSlaveControl.valueChanges
-      .pipe(takeUntil(this.destroy$))
-      .subscribe(enable => {
-        this.updateSlaveEnabling(enable);
-        this.basicFormGroup.get('slave').updateValueAndValidity({emitEvent: !!this.onChange});
-        this.basicFormGroup.get('master').updateValueAndValidity({emitEvent: !!this.onChange});
-      });
   }
 
   ngOnDestroy(): void {
@@ -118,20 +108,16 @@ export class ModbusBasicConfigComponent implements ControlValueAccessor, Validat
     };
 
     this.basicFormGroup.setValue(editedBase, {emitEvent: false});
-    this.enableSlaveControl.setValue(!!basicConfig.slave && !isEqual(basicConfig.slave, {}));
   }
 
-  validate(): ValidationErrors | null {
+  validate(basicFormControl: UntypedFormControl): ValidationErrors | null {
-    return this.basicFormGroup.valid ? null : {
+    const { master, slave } = basicFormControl.value;
+    const isEmpty = !master?.slaves?.length && (isEqual(slave, {}) || !slave);
+    if (!this.basicFormGroup.valid || isEmpty) {
+      return {
         basicFormGroup: {valid: false}
       };
     }
-
+    return null;
-  private updateSlaveEnabling(isEnabled: boolean): void {
-    if (isEnabled) {
-      this.basicFormGroup.get('slave').enable({emitEvent: false});
-    } else {
-      this.basicFormGroup.get('slave').disable({emitEvent: false});
-    }
   }
 }

ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-master-table/modbus-master-table.component.ts

@@ -34,12 +34,8 @@ import {
   ControlValueAccessor,
   FormArray,
   FormBuilder,
-  NG_VALIDATORS,
   NG_VALUE_ACCESSOR,
-  UntypedFormControl,
   UntypedFormGroup,
-  ValidationErrors,
-  Validator,
 } from '@angular/forms';
 import {
   ModbusMasterConfig,
@@ -63,16 +59,11 @@ import { TbTableDatasource } from '@shared/components/table/table-datasource.abs
       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 {
+export class ModbusMasterTableComponent implements ControlValueAccessor, AfterViewInit, OnInit, OnDestroy {
 
   @ViewChild('searchInput') searchInputField: ElementRef;
 
@@ -139,12 +130,6 @@ export class ModbusMasterTableComponent implements ControlValueAccessor, Validat
     this.pushDataAsFormArrays(master.slaves);
   }
 
-  validate(masterControl: UntypedFormControl): ValidationErrors | null {
-    return masterControl.parent.get('slave').enabled || this.slaves.controls.length ? null : {
-      slavesFormGroup: {valid: false}
-    };
-  }
-
   enterFilterMode(): void {
     this.textSearchMode = true;
     this.cdr.detectChanges();

ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.html

@@ -16,6 +16,16 @@
 
 -->
 <div [formGroup]="slaveConfigFormGroup" class="slave-container">
+  <div class="tb-form-panel no-border no-padding padding-top">
+    <div class="tb-form-hint tb-primary-fill tb-flex center">{{ 'gateway.hints.modbus-server' | translate }}</div>
+    <div class="tb-form-row" fxLayoutAlign="space-between center">
+      <mat-slide-toggle class="mat-slide" [formControl]="enableSlaveControl">
+        <mat-label>
+          {{ 'gateway.enable' | translate }}
+        </mat-label>
+      </mat-slide-toggle>
+    </div>
+  </div>
   <div class="slave-content tb-form-panel no-border no-padding padding-top" >
     <div class="tb-flex row space-between align-center no-gap fill-width">
       <div class="fixed-title-width" translate>gateway.server-slave-config</div>

ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/modbus/modbus-slave-config/modbus-slave-config.component.ts

@@ -77,6 +77,7 @@ import { isEqual } from '@core/utils';
 export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validator, OnDestroy {
 
   slaveConfigFormGroup: UntypedFormGroup;
+  enableSlaveControl: FormControl<boolean>;
   showSecurityControl: FormControl<boolean>;
   ModbusProtocolLabelsMap = ModbusProtocolLabelsMap;
   ModbusMethodLabelsMap = ModbusMethodLabelsMap;
@@ -89,7 +90,6 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat
   readonly ModbusProtocolType = ModbusProtocolType;
   readonly modbusBaudrates = ModbusBaudrates;
 
-  private isSlaveEnabled = false;
   private readonly serialSpecificControlKeys = ['serialPort', 'baudrate'];
   private readonly tcpUdpSpecificControlKeys = ['port', 'security', 'host'];
 
@@ -100,6 +100,7 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat
 
   constructor(private fb: FormBuilder) {
     this.showSecurityControl = this.fb.control(false);
+    this.enableSlaveControl = this.fb.control(false);
     this.slaveConfigFormGroup = this.fb.group({
       type: [ModbusProtocolType.TCP],
       host: ['', [Validators.required, Validators.pattern(noLeadTrailSpacesRegex)]],
@@ -127,6 +128,7 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat
     this.observeValueChanges();
     this.observeTypeChange();
     this.observeShowSecurity();
+    this.observeFormEnable();
   }
 
   get protocolType(): ModbusProtocolType {
@@ -153,15 +155,11 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat
   }
 
   writeValue(slaveConfig: ModbusSlave): void {
+    this.enableSlaveControl.patchValue(!!slaveConfig && !isEqual(slaveConfig, {}));
     this.showSecurityControl.patchValue(!!slaveConfig.security && !isEqual(slaveConfig.security, {}));
     this.updateSlaveConfig(slaveConfig);
   }
 
-  setDisabledState(isDisabled: boolean): void {
-    this.isSlaveEnabled = !isDisabled;
-    this.updateFormEnableState();
-  }
-
   private observeValueChanges(): void {
     this.slaveConfigFormGroup.valueChanges.pipe(
       takeUntil(this.destroy$)
@@ -175,11 +173,20 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat
     });
   }
 
+  private observeFormEnable(): void {
+    this.enableSlaveControl.valueChanges
+      .pipe(takeUntil(this.destroy$))
+      .subscribe(value => {
+        this.updateFormEnableState(value);
+        this.slaveConfigFormGroup.updateValueAndValidity({emitEvent: !!this.onChange});
+      });
+  }
+
   private observeTypeChange(): void {
     this.slaveConfigFormGroup.get('type').valueChanges
       .pipe(takeUntil(this.destroy$))
       .subscribe(type => {
-        this.updateFormEnableState();
+        this.updateFormEnableState(this.enableSlaveControl.value);
         this.updateMethodType(type);
       });
   }
@@ -195,8 +202,8 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat
     }
   }
 
-  private updateFormEnableState(): void {
+  private updateFormEnableState(enabled: boolean): void {
-    if (this.isSlaveEnabled) {
+    if (enabled) {
       this.slaveConfigFormGroup.enable({emitEvent: false});
       this.showSecurityControl.enable({emitEvent: false});
     } else {
@@ -214,7 +221,7 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat
   }
 
   private updateSecurityEnable(securityEnabled: boolean): void {
-    if (securityEnabled && this.isSlaveEnabled && this.protocolType !== ModbusProtocolType.Serial) {
+    if (securityEnabled && this.enableSlaveControl.value && this.protocolType !== ModbusProtocolType.Serial) {
       this.slaveConfigFormGroup.get('security').enable({emitEvent: false});
     } else {
       this.slaveConfigFormGroup.get('security').disable({emitEvent: false});
@@ -226,7 +233,7 @@ export class ModbusSlaveConfigComponent implements ControlValueAccessor, Validat
     const enableKeys = isSerial ? this.serialSpecificControlKeys : this.tcpUdpSpecificControlKeys;
     const disableKeys = isSerial ? this.tcpUdpSpecificControlKeys : this.serialSpecificControlKeys;
 
-    if (this.isSlaveEnabled) {
+    if (this.enableSlaveControl.value) {
       enableKeys.forEach(key => this.slaveConfigFormGroup.get(key)?.enable({ emitEvent: false }));
     }