diff --git a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-device-config-server.component.ts b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-device-config-server.component.ts index 29589d2388..fc766683f2 100644 --- a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-device-config-server.component.ts +++ b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-device-config-server.component.ts @@ -14,7 +14,7 @@ /// limitations under the License. /// -import { Component, forwardRef, Inject, Input, OnInit } from '@angular/core'; +import { Component, forwardRef, Inject, Input } from '@angular/core'; import { ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR, Validators } from '@angular/forms'; import { DEFAULT_CLIENT_HOLD_OFF_TIME, @@ -48,7 +48,7 @@ import { TranslateService } from '@ngx-translate/core'; ] }) -export class Lwm2mDeviceConfigServerComponent implements OnInit, ControlValueAccessor, Validators { +export class Lwm2mDeviceConfigServerComponent implements ControlValueAccessor { private requiredValue: boolean; @@ -82,7 +82,7 @@ export class Lwm2mDeviceConfigServerComponent implements OnInit, ControlValueAcc public fb: FormBuilder, private deviceProfileService: DeviceProfileService, @Inject(WINDOW) private window: Window) { - this.serverFormGroup = this.getServerGroup(); + this.serverFormGroup = this.initServerGroup(); this.serverFormGroup.get('securityMode').valueChanges.pipe( startWith(null), pairwise() @@ -101,9 +101,6 @@ export class Lwm2mDeviceConfigServerComponent implements OnInit, ControlValueAcc }); } - ngOnInit(): void { - } - private updateValueFields = (serverData: ServerSecurityConfig): void => { serverData.bootstrapServerIs = this.bootstrapServerIs; this.serverFormGroup.patchValue(serverData, {emitEvent: false}); @@ -187,17 +184,17 @@ export class Lwm2mDeviceConfigServerComponent implements OnInit, ControlValueAcc registerOnTouched(fn: any): void { } - private getServerGroup = (): FormGroup => { + private initServerGroup = (): FormGroup => { const port = this.bootstrapServerIs ? DEFAULT_PORT_BOOTSTRAP_NO_SEC : DEFAULT_PORT_SERVER_NO_SEC; return this.fb.group({ - host: [this.window.location.hostname, this.required ? [Validators.required] : []], - port: [port, this.required ? [Validators.required] : []], - bootstrapServerIs: [this.bootstrapServerIs, []], - securityMode: [this.fb.control(SECURITY_CONFIG_MODE.NO_SEC), []], - serverPublicKey: ['', this.required ? [Validators.required] : []], - clientHoldOffTime: [DEFAULT_CLIENT_HOLD_OFF_TIME, this.required ? [Validators.required] : []], - serverId: [DEFAULT_ID_SERVER, this.required ? [Validators.required] : []], - bootstrapServerAccountTimeout: ['', this.required ? [Validators.required] : []], + host: [this.window.location.hostname, this.required ? Validators.required : ''], + port: [port, this.required ? Validators.required : ''], + bootstrapServerIs: [this.bootstrapServerIs, ''], + securityMode: [this.fb.control(SECURITY_CONFIG_MODE.NO_SEC)], + serverPublicKey: ['', this.required ? Validators.required : ''], + clientHoldOffTime: [DEFAULT_CLIENT_HOLD_OFF_TIME, this.required ? Validators.required : ''], + serverId: [DEFAULT_ID_SERVER, this.required ? Validators.required : ''], + bootstrapServerAccountTimeout: ['', this.required ? Validators.required : ''], }); } diff --git a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-device-profile-transport-configuration.component.ts b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-device-profile-transport-configuration.component.ts index ea7da72966..feb248d5cc 100644 --- a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-device-profile-transport-configuration.component.ts +++ b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-device-profile-transport-configuration.component.ts @@ -15,7 +15,7 @@ /// import { DeviceProfileTransportConfiguration, DeviceTransportType } from '@shared/models/device.models'; -import { Component, forwardRef, Inject, Input, OnInit } from '@angular/core'; +import { Component, forwardRef, Inject, Input } from '@angular/core'; import { ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR, Validators } from '@angular/forms'; import { Store } from '@ngrx/store'; import { AppState } from '@app/core/core.state'; @@ -54,11 +54,11 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro private disabled = false; lwm2mDeviceProfileTransportConfFormGroup: FormGroup; - observeAttr = OBSERVE_ATTR as string; - observe = OBSERVE as string; - attribute = ATTR as string; - telemetry = TELEMETRY as string; - keyName = KEY_NAME as string; + observeAttr = OBSERVE_ATTR; + observe = OBSERVE; + attribute = ATTR; + telemetry = TELEMETRY; + keyName = KEY_NAME; bootstrapServers: string; bootstrapServer: string; lwm2mServer: string; @@ -73,7 +73,7 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro this.requiredValue = coerceBooleanProperty(value); } - private propagateChange = (v: any) => { }; + private propagateChange = (v: any) => { }; constructor(private store: Store, private fb: FormBuilder, @@ -81,7 +81,7 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro @Inject(WINDOW) private window: Window) { this.lwm2mDeviceProfileTransportConfFormGroup = this.fb.group({ objectIds: [{}, Validators.required], - observeAttrTelemetry: [{clientLwM2M: [] as ObjectLwM2M[]}, Validators.required], + observeAttrTelemetry: [{clientLwM2M: []}, Validators.required], shortId: [null, Validators.required], lifetime: [null, Validators.required], defaultMinPeriod: [null, Validators.required], @@ -116,12 +116,11 @@ export class Lwm2mDeviceProfileTransportConfigurationComponent implements Contro } writeValue(value: any | null): void { - value = (Object.keys(value).length === 0) ? getDefaultProfileConfig() : value; + this.configurationValue = (Object.keys(value).length === 0) ? getDefaultProfileConfig() : value; this.lwm2mDeviceProfileTransportConfFormGroup.patchValue({ - configurationJson: value + configurationJson: this.configurationValue }, {emitEvent: false}); - this.configurationValue = this.lwm2mDeviceProfileTransportConfFormGroup.getRawValue().configurationJson; this.initWriteValue(); } diff --git a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-add-instances-list.component.html b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-add-instances-list.component.html index cddc6f1ef5..5a03f3f54d 100644 --- a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-add-instances-list.component.html +++ b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-add-instances-list.component.html @@ -15,43 +15,46 @@ limitations under the License. --> - - {{ 'device-profile.lwm2m.instances-list' | translate }} - - - {{instanceIdInputFor}} - close - - - {{ 'device-profile.lwm2m.instances-input' | translate }} - - - {{ translate.get('device-profile.lwm2m.valid-id-instance-no-min', { - instance: instanceIdInput.value.toString(), min: instanceIdValueMin.toString() - }) | async }} - - - {{ translate.get('device-profile.lwm2m.valid-id-instance-no-max', { - instance: instanceIdInput.value.toString(), max: instanceIdValueMax.toString() - }) | async }} - - - {{ translate.get('device-profile.lwm2m.instances-input-holder', { - instance: instanceIdInput.value.toString(), max: instanceIdValueMax.toString() - }) | async }} - - - - +
+ + {{ 'device-profile.lwm2m.instances-list' | translate }} + + + {{instanceId}} + close + + + + + {{ 'device-profile.lwm2m.instances-input' | translate }} + + + + {{ translate.get('device-profile.lwm2m.valid-id-instance-no-min', { + instance: instanceId, min: instanceIdValueMin + }) | async }} + + + {{ translate.get('device-profile.lwm2m.valid-id-instance-no-max', { + instance: instanceId, max: instanceIdValueMax + }) | async }} + + + {{ translate.get('device-profile.lwm2m.instances-input-holder', { + instance: instanceId, max: instanceIdValueMax + }) | async }} + + +
diff --git a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-add-instances-list.component.scss b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-add-instances-list.component.scss deleted file mode 100644 index 45e601db09..0000000000 --- a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-add-instances-list.component.scss +++ /dev/null @@ -1,22 +0,0 @@ -/** - * Copyright © 2016-2020 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 ::ng-deep { - mat-form-field.lwm2m-instances-list { - & > .mat-form-field-wrapper > .mat-form-field-underline { - display: none; - } - } -} diff --git a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-add-instances-list.component.ts b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-add-instances-list.component.ts index 6e09a6d254..1375b49112 100644 --- a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-add-instances-list.component.ts +++ b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-add-instances-list.component.ts @@ -14,35 +14,18 @@ /// limitations under the License. /// -import { - Component, - forwardRef, - Input, - OnInit, - ViewChild, - ElementRef, -} from '@angular/core'; -import { - ControlValueAccessor, - FormBuilder, - FormGroup, - NG_VALUE_ACCESSOR, Validators -} from '@angular/forms'; -import { coerceBooleanProperty } from '@angular/cdk/coercion'; +import { Component, forwardRef, } from '@angular/core'; +import { ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR, Validators } from '@angular/forms'; import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; -import { MatChipList } from '@angular/material/chips'; -import { - INSTANCES_ID_VALUE_MAX, - INSTANCES_ID_VALUE_MIN -} from './profile-config.models'; +import { INSTANCES_ID_VALUE_MAX, INSTANCES_ID_VALUE_MIN, KEY_REGEXP_NUMBER } from './profile-config.models'; import { TranslateService } from '@ngx-translate/core'; import { DeviceProfileService } from '@core/http/device-profile.service'; @Component({ selector: 'tb-profile-lwm2m-object-add-instances-list', templateUrl: './lwm2m-object-add-instances-list.component.html', - styleUrls: ['./lwm2m-object-add-instances-list.component.scss'], + styleUrls: [], providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => Lwm2mObjectAddInstancesListComponent), @@ -51,31 +34,13 @@ import { DeviceProfileService } from '@core/http/device-profile.service'; }) export class Lwm2mObjectAddInstancesListComponent implements ControlValueAccessor { - private requiredValue: boolean; - private disabled = false as boolean; - private dirty = false as boolean; + private disabled = false; + private dirty = false; - lwm2mObjectListFormGroup: FormGroup; - instancesIdsList: Set | null; - filteredObjectsList: Array; - instanceIdValueMin = INSTANCES_ID_VALUE_MIN as number; - instanceIdValueMax = INSTANCES_ID_VALUE_MAX as number; - - get required(): boolean { - return this.requiredValue; - } - - @Input() - set required(value: boolean) { - const newVal = coerceBooleanProperty(value); - if (this.requiredValue !== newVal) { - this.requiredValue = newVal; - this.updateValidators(); - } - } - - @ViewChild('instanceIdInput') instanceIdInput: ElementRef; - @ViewChild('chipList', {static: true}) chipList: MatChipList; + instancesListFormGroup: FormGroup; + instancesId = new Set(); + instanceIdValueMin = INSTANCES_ID_VALUE_MIN; + instanceIdValueMax = INSTANCES_ID_VALUE_MAX; private propagateChange = (v: any) => { }; @@ -83,19 +48,14 @@ export class Lwm2mObjectAddInstancesListComponent implements ControlValueAccesso public translate: TranslateService, private deviceProfileService: DeviceProfileService, private fb: FormBuilder) { - this.lwm2mObjectListFormGroup = this.fb.group({ - instancesIdsList: [null], - instanceIdInput: [null] + this.instancesListFormGroup = this.fb.group({ + instanceIdInput: [null, [ + Validators.min(this.instanceIdValueMin), + Validators.max(this.instanceIdValueMax), + Validators.pattern(KEY_REGEXP_NUMBER)]] }); } - private updateValidators = (): void => { - this.lwm2mObjectListFormGroup.get('instanceIdInput').setValidators([ - Validators.min(this.instanceIdValueMin), - Validators.max(this.instanceIdValueMax)]); - this.lwm2mObjectListFormGroup.get('instanceIdInput').updateValueAndValidity(); - } - registerOnChange(fn: any): void { this.propagateChange = fn; } @@ -106,68 +66,35 @@ export class Lwm2mObjectAddInstancesListComponent implements ControlValueAccesso setDisabledState(isDisabled: boolean): void { this.disabled = isDisabled; if (isDisabled) { - this.lwm2mObjectListFormGroup.disable({emitEvent: false}); + this.instancesListFormGroup.disable({emitEvent: false}); } else { - this.lwm2mObjectListFormGroup.enable({emitEvent: false}); + this.instancesListFormGroup.enable({emitEvent: false}); } } writeValue(value: Set): void { - this.instancesIdsList = new Set(); if (value && value.size) { - value.forEach(item => this.instancesIdsList.add(item)); - this.lwm2mObjectListFormGroup.get('instancesIdsList').setValue(this.instancesIdsList); + this.instancesId = value; } - this.updateValidators(); this.dirty = false; } - add = (value: number): void => { - if (!isNaN(value) && this.lwm2mObjectListFormGroup.get('instanceIdInput').valid) { - this.instancesIdsList.add(value); - this.lwm2mObjectListFormGroup.get('instancesIdsList').setValue(this.instancesIdsList); - this.propagateChange(this.instancesIdsList); + add = (): void => { + if (this.instancesListFormGroup.get('instanceIdInput').valid) { + this.instancesId.add(this.instanceId); + this.instancesListFormGroup.get('instanceIdInput').setValue(null); + this.propagateChange(this.instancesId); this.dirty = true; } - this.clear(); } remove = (object: number): void => { - this.instancesIdsList.delete(object); - this.lwm2mObjectListFormGroup.get('instancesIdsList').setValue(this.instancesIdsList); - this.propagateChange(this.instancesIdsList); + this.instancesId.delete(object); + this.propagateChange(this.instancesId); this.dirty = true; - this.clear(); - } - // - // displayFn(object?: number): number | undefined { - // return object ? object : undefined; - // } - - private clear = (): void => { - this.lwm2mObjectListFormGroup.get('instanceIdInput').patchValue(null, {emitEvent: true}); - this.instanceIdInput.nativeElement.value = ''; - setTimeout(() => { - this.instanceIdInput.nativeElement.blur(); - this.instanceIdInput.nativeElement.focus(); - }, 0); } - onkeydown = (e: KeyboardEvent): boolean => { - if (e.keyCode === 189 || e.keyCode === 187 || e.keyCode === 109 || e.keyCode === 107) { - return false; - } else if (e.keyCode === 8) { - if (this.lwm2mObjectListFormGroup.get('instanceIdInput').value == null) { - this.clear(); - } - this.instanceIdInput.nativeElement.focus(); - } - } - - onFocus = (): void => { - if (this.dirty) { - this.lwm2mObjectListFormGroup.get('instanceIdInput').updateValueAndValidity({onlySelf: true, emitEvent: true}); - this.dirty = false; - } + get instanceId(): number { + return this.instancesListFormGroup.get('instanceIdInput').value; } } diff --git a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-add-instances.component.html b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-add-instances.component.html index 6c7706071f..303e38f180 100644 --- a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-add-instances.component.html +++ b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-add-instances.component.html @@ -30,11 +30,9 @@
-
- - -
+ +
diff --git a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-list.component.html b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-list.component.html index 7ad661752b..260f0016f5 100644 --- a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-list.component.html +++ b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-list.component.html @@ -16,7 +16,7 @@ --> - + - + {{ 'device-profile.lwm2m.object-list-empty' | translate }} diff --git a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-list.component.ts b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-list.component.ts index f5a84638ed..d0f6c3cc47 100644 --- a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-list.component.ts +++ b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-object-list.component.ts @@ -19,8 +19,6 @@ import { ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR, Valida import { coerceBooleanProperty } from '@angular/cdk/coercion'; import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; -import { MatChipList } from '@angular/material/chips'; -import { MatAutocomplete } from '@angular/material/autocomplete'; import { Observable } from 'rxjs'; import { filter, map, mergeMap, share, tap } from 'rxjs/operators'; import { ObjectLwM2M } from './profile-config.models'; @@ -43,9 +41,9 @@ import { Direction } from '@shared/models/page/sort-order'; export class Lwm2mObjectListComponent implements ControlValueAccessor, OnInit, Validators { private requiredValue: boolean; - private dirty = false as boolean; + private dirty = false; - lwm2mObjectListFormGroup: FormGroup; + lwm2mListFormGroup: FormGroup; modelValue: Array | null; objectsList: Array = []; filteredObjectsList: Observable>; @@ -72,8 +70,6 @@ export class Lwm2mObjectListComponent implements ControlValueAccessor, OnInit, V removeList = new EventEmitter(); @ViewChild('objectInput') objectInput: ElementRef; - @ViewChild('objectAutocomplete') matAutocomplete: MatAutocomplete; - @ViewChild('chipList', {static: true}) chipList: MatChipList; private propagateChange = (v: any) => { }; @@ -81,15 +77,15 @@ export class Lwm2mObjectListComponent implements ControlValueAccessor, OnInit, V public translate: TranslateService, private deviceProfileService: DeviceProfileService, private fb: FormBuilder) { - this.lwm2mObjectListFormGroup = this.fb.group({ + this.lwm2mListFormGroup = this.fb.group({ objectsList: [this.objectsList], objectLwm2m: [null, this.required ? [Validators.required] : []] }); } private updateValidators = (): void => { - this.lwm2mObjectListFormGroup.get('objectLwm2m').setValidators(this.required ? [Validators.required] : []); - this.lwm2mObjectListFormGroup.get('objectLwm2m').updateValueAndValidity(); + this.lwm2mListFormGroup.get('objectLwm2m').setValidators(this.required ? [Validators.required] : []); + this.lwm2mListFormGroup.get('objectLwm2m').updateValueAndValidity(); } registerOnChange(fn: any): void { @@ -100,7 +96,7 @@ export class Lwm2mObjectListComponent implements ControlValueAccessor, OnInit, V } ngOnInit() { - this.filteredObjectsList = this.lwm2mObjectListFormGroup.get('objectLwm2m').valueChanges + this.filteredObjectsList = this.lwm2mListFormGroup.get('objectLwm2m').valueChanges .pipe( tap((value) => { if (value && typeof value !== 'string') { @@ -110,21 +106,17 @@ export class Lwm2mObjectListComponent implements ControlValueAccessor, OnInit, V } }), filter((value) => typeof value === 'string'), - map((value) => value ? (typeof value === 'string' ? value : value.name) : ''), mergeMap(name => this.fetchListObjects(name)), share() ); } - ngAfterViewInit = (): void => { - } - setDisabledState(isDisabled: boolean): void { this.disabled = isDisabled; if (isDisabled) { - this.lwm2mObjectListFormGroup.disable({emitEvent: false}); + this.lwm2mListFormGroup.disable({emitEvent: false}); } else { - this.lwm2mObjectListFormGroup.enable({emitEvent: false}); + this.lwm2mListFormGroup.enable({emitEvent: false}); } } @@ -134,35 +126,22 @@ export class Lwm2mObjectListComponent implements ControlValueAccessor, OnInit, V if (value.hasOwnProperty(objectIds) && value[objectIds] != null && value[objectIds].length > 0) { this.modelValue = [...value[objectIds]]; this.objectsList = value.objectsList; - this.lwm2mObjectListFormGroup.get('objectsList').setValue(this.objectsList); } else { this.objectsList = []; - this.lwm2mObjectListFormGroup.get('objectsList').setValue(this.objectsList); this.modelValue = null; } + this.lwm2mListFormGroup.get('objectsList').setValue(this.objectsList); this.dirty = true; } - // reset() { - // this.objectsList = []; - // this.lwm2mObjectListFormGroup.get('objectsList').setValue(this.objectsList); - // this.modelValue = null; - // if (this.objectInput) { - // this.objectInput.nativeElement.value = ''; - // } - // this.lwm2mObjectListFormGroup.get('objectLwm2m').patchValue('', {emitEvent: false}); - // this.propagateChange(this.modelValue); - // this.dirty = true; - // } - - private add = (object: ObjectLwM2M): void => { + private add(object: ObjectLwM2M): void { if (!this.modelValue || this.modelValue.indexOf(object.id) === -1) { if (!this.modelValue) { this.modelValue = []; } this.modelValue.push(object.id); this.objectsList.push(object); - this.lwm2mObjectListFormGroup.get('objectsList').setValue(this.objectsList); + this.lwm2mListFormGroup.get('objectsList').setValue(this.objectsList); this.addList.next(this.objectsList); } this.propagateChange(this.modelValue); @@ -173,7 +152,7 @@ export class Lwm2mObjectListComponent implements ControlValueAccessor, OnInit, V let index = this.objectsList.indexOf(object); if (index >= 0) { this.objectsList.splice(index, 1); - this.lwm2mObjectListFormGroup.get('objectsList').setValue(this.objectsList); + this.lwm2mListFormGroup.get('objectsList').setValue(this.objectsList); index = this.modelValue.indexOf(object.id); this.modelValue.splice(index, 1); this.removeList.next(object); @@ -189,9 +168,11 @@ export class Lwm2mObjectListComponent implements ControlValueAccessor, OnInit, V return object ? object.name : undefined; } + // @TODO: add support page size + // @TODO: filter for id + name private fetchListObjects = (searchText?: string): Observable> => { this.searchText = searchText; - const pageLink = new PageLink(10, 0, searchText, { + const pageLink = new PageLink(50, 0, searchText, { property: 'name', direction: Direction.ASC }); @@ -202,14 +183,14 @@ export class Lwm2mObjectListComponent implements ControlValueAccessor, OnInit, V onFocus = (): void => { if (this.dirty) { - this.lwm2mObjectListFormGroup.get('objectLwm2m').updateValueAndValidity({onlySelf: true, emitEvent: true}); + this.lwm2mListFormGroup.get('objectLwm2m').updateValueAndValidity({onlySelf: true, emitEvent: true}); this.dirty = false; } } private clear = (value: string = ''): void => { this.objectInput.nativeElement.value = value; - this.lwm2mObjectListFormGroup.get('objectLwm2m').patchValue(value, {emitEvent: true}); + this.lwm2mListFormGroup.get('objectLwm2m').patchValue(value, {emitEvent: true}); setTimeout(() => { this.objectInput.nativeElement.blur(); this.objectInput.nativeElement.focus(); diff --git a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-observe-attr-telemetry.component.ts b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-observe-attr-telemetry.component.ts index 11ffdf0fe5..f6a600ae99 100644 --- a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-observe-attr-telemetry.component.ts +++ b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-observe-attr-telemetry.component.ts @@ -171,7 +171,7 @@ export class Lwm2mObserveAttrTelemetryComponent implements ControlValueAccessor } private updateValidators = (): void => { - this.observeAttrTelemetryFormGroup.get('clientLwM2M').setValidators(this.required ? [Validators.required] : []); + this.observeAttrTelemetryFormGroup.get('clientLwM2M').setValidators(this.required ? Validators.required : []); this.observeAttrTelemetryFormGroup.get('clientLwM2M').updateValueAndValidity(); } @@ -188,7 +188,6 @@ export class Lwm2mObserveAttrTelemetryComponent implements ControlValueAccessor return false; } - getChecked = (instance: AbstractControl, type: string): boolean => { const resources = instance.get('resources').value as ResourceLwM2M[]; return isDefinedAndNotNull(resources) && resources.every(resource => resource[type]); @@ -221,15 +220,11 @@ export class Lwm2mObserveAttrTelemetryComponent implements ControlValueAccessor $event.stopPropagation(); $event.preventDefault(); } - const instancesIds = new Set(); - object.instances.forEach(inst => { - instancesIds.add(inst.id); - }); this.dialog.open(Lwm2mObjectAddInstancesComponent, { disableClose: true, panelClass: ['tb-dialog', 'tb-fullscreen-dialog'], data: { - instancesIds: this.setInstancesIds(object.instances), + instancesIds: this.instancesToSetId(object.instances), objectName: object.name, objectId: object.id } @@ -243,21 +238,15 @@ export class Lwm2mObserveAttrTelemetryComponent implements ControlValueAccessor } private updateInstancesIds = (data: Lwm2mObjectAddInstancesData): void => { - const valueNew = new Set(); - const valueOld = new Set(); - data.instancesIds.forEach(value => { - valueNew.add(value); - }); - const oldInstances = (this.observeAttrTelemetryFormGroup.get('clientLwM2M').value as ObjectLwM2M []) - .find(e => e.id === data.objectId).instances; - oldInstances.forEach(inst => { - valueOld.add(inst.id); - }); - if (!isEqual(valueOld, valueNew)) { - const idsDel = this.diffBetweenSet(valueOld, valueNew); - const idsAdd = this.diffBetweenSet(valueNew, valueOld); + const instances = (this.observeAttrTelemetryFormGroup.get('clientLwM2M').value as ObjectLwM2M[]) + .find(objectLwM2M => objectLwM2M.id === data.objectId).instances; + const valueOld = this.instancesToSetId(instances); + + if (!isEqual(valueOld, data.instancesIds)) { + const idsDel = this.diffBetweenSet(valueOld, data.instancesIds); + const idsAdd = this.diffBetweenSet(data.instancesIds, valueOld); if (idsAdd.size) { - this.addInstancesNew(data.objectId, idsAdd); + this.addInstancesNew(data.objectId, idsAdd, instances.find(instance => instance.id === 0)); } if (idsDel.size) { this.deleteInstances(data.objectId, idsDel); @@ -276,13 +265,11 @@ export class Lwm2mObserveAttrTelemetryComponent implements ControlValueAccessor }); } - private addInstancesNew = (objectId: number, idsAdd: Set): void => { - const instancesValue = (this.observeAttrTelemetryFormGroup.get('clientLwM2M').value as ObjectLwM2M []) - .find(objectLwM2M => objectLwM2M.id === objectId).instances; + private addInstancesNew = (objectId: number, idsAdd: Set, instance: Instance): void => { const instancesFormArray = ((this.observeAttrTelemetryFormGroup.get('clientLwM2M') as FormArray).controls .find(e => e.value.id === objectId).get('instances') as FormArray) as FormArray; idsAdd.forEach(x => { - const instanceNew = deepClone(instancesValue[0]) as Instance; + const instanceNew = deepClone(instance); instanceNew.resources.forEach(r => { r.attribute = false; r.telemetry = false; @@ -296,17 +283,11 @@ export class Lwm2mObserveAttrTelemetryComponent implements ControlValueAccessor (instancesFormArray.controls as FormGroup[]).sort((a, b) => a.value.id - b.value.id); } - private diffBetweenSet = (firstSet: Set, secondSet: Set): Set => { + private diffBetweenSet(firstSet: Set, secondSet: Set): Set { return new Set([...Array.from(firstSet)].filter(x => !secondSet.has(x))); } - private setInstancesIds = (instances: Instance []): Set => { - const instancesIds = new Set(); - if (instances && instances.length) { - instances.forEach(inst => { - instancesIds.add(inst.id); - }); - } - return instancesIds; + private instancesToSetId = (instances: Instance[]): Set => { + return new Set(instances.map(x => x.id)); } } diff --git a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/profile-config.models.ts b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/profile-config.models.ts index 681e2fa295..1849fd3279 100644 --- a/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/profile-config.models.ts +++ b/ui-ngx/src/app/modules/home/components/profile/device/lwm2m/profile-config.models.ts @@ -33,6 +33,7 @@ export const DEFAULT_BOOTSTRAP_SERVER_ACCOUNT_TIME_OUT = 0; export const LEN_MAX_PUBLIC_KEY_RPK = 182; export const LEN_MAX_PUBLIC_KEY_X509 = 3000; export const KEY_REGEXP_HEX_DEC = /^[-+]?[0-9A-Fa-f]+\.?[0-9A-Fa-f]*?$/; +export const KEY_REGEXP_NUMBER = /^\d*$/; export const INSTANCES_ID_VALUE_MIN = 0; export const INSTANCES_ID_VALUE_MAX = 65535;