-
-
+
+
+
+ device.access-token
+
+
+ {{ 'device.access-token-required' | translate }}
+
+
+ {{ 'device.access-token-invalid' | translate }}
+
+
+
+
+
+ device.rsa-key
+
+
+ {{ 'device.rsa-key-required' | translate }}
+
+
+
+
+
+
+
+
+
+
+
diff --git a/ui-ngx/src/app/modules/home/components/device/device-credentials.component.ts b/ui-ngx/src/app/modules/home/components/device/device-credentials.component.ts
index 21c8d40a42..3617ecbcf4 100644
--- a/ui-ngx/src/app/modules/home/components/device/device-credentials.component.ts
+++ b/ui-ngx/src/app/modules/home/components/device/device-credentials.component.ts
@@ -22,16 +22,15 @@ import {
FormGroup,
NG_VALIDATORS,
NG_VALUE_ACCESSOR,
- ValidationErrors,
Validator,
- ValidatorFn,
Validators
} from '@angular/forms';
import {
credentialTypeNames,
- DeviceCredentialMQTTBasic,
+ credentialTypesByTransportType,
DeviceCredentials,
- DeviceCredentialsType
+ DeviceCredentialsType,
+ DeviceTransportType
} from '@shared/models/device.models';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
@@ -58,32 +57,40 @@ export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit,
@Input()
disabled: boolean;
+ private deviceTransportTypeValue = DeviceTransportType.DEFAULT;
+ get deviceTransportType(): DeviceTransportType {
+ return this.deviceTransportTypeValue;
+ }
+ @Input()
+ set deviceTransportType(type: DeviceTransportType) {
+ if (type) {
+ this.deviceTransportTypeValue = type;
+ this.credentialsTypes = credentialTypesByTransportType.get(type);
+ const currentType = this.deviceCredentialsFormGroup.get('credentialsType').value;
+ if (!this.credentialsTypes.includes(currentType)) {
+ this.deviceCredentialsFormGroup.get('credentialsType').patchValue(this.credentialsTypes[0], {onlySelf: true});
+ }
+ }
+ }
+
private destroy$ = new Subject();
deviceCredentialsFormGroup: FormGroup;
deviceCredentialsType = DeviceCredentialsType;
- credentialsTypes = Object.values(DeviceCredentialsType);
+ credentialsTypes = credentialTypesByTransportType.get(DeviceTransportType.DEFAULT);
credentialTypeNamesMap = credentialTypeNames;
- hidePassword = true;
-
private propagateChange = (v: any) => {};
constructor(public fb: FormBuilder) {
this.deviceCredentialsFormGroup = this.fb.group({
credentialsType: [DeviceCredentialsType.ACCESS_TOKEN],
credentialsId: [null],
- credentialsValue: [null],
- credentialsBasic: this.fb.group({
- clientId: [null, [Validators.pattern(/^[A-Za-z0-9]+$/)]],
- userName: [null],
- password: [null]
- }, {validators: this.atLeastOne(Validators.required, ['clientId', 'userName'])})
+ credentialsValue: [null]
});
- this.deviceCredentialsFormGroup.get('credentialsBasic').disable();
this.deviceCredentialsFormGroup.valueChanges.pipe(
takeUntil(this.destroy$)
).subscribe(() => {
@@ -109,18 +116,11 @@ export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit,
writeValue(value: DeviceCredentials | null): void {
if (isDefinedAndNotNull(value)) {
- let credentialsBasic = {clientId: null, userName: null, password: null};
- let credentialsValue = null;
- if (value.credentialsType === DeviceCredentialsType.MQTT_BASIC) {
- credentialsBasic = JSON.parse(value.credentialsValue) as DeviceCredentialMQTTBasic;
- } else {
- credentialsValue = value.credentialsValue;
- }
+ const credentialsType = this.credentialsTypes.includes(value.credentialsType) ? value.credentialsType : this.credentialsTypes[0];
this.deviceCredentialsFormGroup.patchValue({
- credentialsType: value.credentialsType,
+ credentialsType,
credentialsId: value.credentialsId,
- credentialsValue,
- credentialsBasic
+ credentialsValue: value.credentialsValue
}, {emitEvent: false});
this.updateValidators();
}
@@ -128,10 +128,6 @@ export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit,
updateView() {
const deviceCredentialsValue = this.deviceCredentialsFormGroup.value;
- if (deviceCredentialsValue.credentialsType === DeviceCredentialsType.MQTT_BASIC) {
- deviceCredentialsValue.credentialsValue = JSON.stringify(deviceCredentialsValue.credentialsBasic);
- }
- delete deviceCredentialsValue.credentialsBasic;
this.propagateChange(deviceCredentialsValue);
}
@@ -163,14 +159,12 @@ export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit,
credentialsTypeChanged(): void {
this.deviceCredentialsFormGroup.patchValue({
credentialsId: null,
- credentialsValue: null,
- credentialsBasic: {clientId: '', userName: '', password: ''}
+ credentialsValue: null
});
this.updateValidators();
}
updateValidators(): void {
- this.hidePassword = true;
const credentialsType = this.deviceCredentialsFormGroup.get('credentialsType').value as DeviceCredentialsType;
switch (credentialsType) {
case DeviceCredentialsType.ACCESS_TOKEN:
@@ -178,48 +172,13 @@ export class DeviceCredentialsComponent implements ControlValueAccessor, OnInit,
this.deviceCredentialsFormGroup.get('credentialsId').updateValueAndValidity({emitEvent: false});
this.deviceCredentialsFormGroup.get('credentialsValue').setValidators([]);
this.deviceCredentialsFormGroup.get('credentialsValue').updateValueAndValidity({emitEvent: false});
- this.deviceCredentialsFormGroup.get('credentialsBasic').disable({emitEvent: false});
break;
- case DeviceCredentialsType.X509_CERTIFICATE:
- case DeviceCredentialsType.LWM2M_CREDENTIALS:
+ default:
this.deviceCredentialsFormGroup.get('credentialsValue').setValidators([Validators.required]);
this.deviceCredentialsFormGroup.get('credentialsValue').updateValueAndValidity({emitEvent: false});
this.deviceCredentialsFormGroup.get('credentialsId').setValidators([]);
this.deviceCredentialsFormGroup.get('credentialsId').updateValueAndValidity({emitEvent: false});
- this.deviceCredentialsFormGroup.get('credentialsBasic').disable({emitEvent: false});
- break;
- case DeviceCredentialsType.MQTT_BASIC:
- this.deviceCredentialsFormGroup.get('credentialsBasic').enable({emitEvent: false});
- this.deviceCredentialsFormGroup.get('credentialsBasic').updateValueAndValidity({emitEvent: false});
- this.deviceCredentialsFormGroup.get('credentialsId').setValidators([]);
- this.deviceCredentialsFormGroup.get('credentialsId').updateValueAndValidity({emitEvent: false});
- this.deviceCredentialsFormGroup.get('credentialsValue').setValidators([]);
- this.deviceCredentialsFormGroup.get('credentialsValue').updateValueAndValidity({emitEvent: false});
break;
}
}
-
- private atLeastOne(validator: ValidatorFn, controls: string[] = null) {
- return (group: FormGroup): ValidationErrors | null => {
- if (!controls) {
- controls = Object.keys(group.controls);
- }
- const hasAtLeastOne = group?.controls && controls.some(k => !validator(group.controls[k]));
-
- return hasAtLeastOne ? null : {atLeastOne: true};
- };
- }
-
- passwordChanged() {
- const value = this.deviceCredentialsFormGroup.get('credentialsBasic.password').value;
- if (value !== '') {
- this.deviceCredentialsFormGroup.get('credentialsBasic.userName').setValidators([Validators.required]);
- } else {
- this.deviceCredentialsFormGroup.get('credentialsBasic.userName').setValidators([]);
- }
- this.deviceCredentialsFormGroup.get('credentialsBasic.userName').updateValueAndValidity({
- emitEvent: false,
- onlySelf: true
- });
- }
}
diff --git a/ui-ngx/src/app/modules/home/components/device/device-credentials.module.ts b/ui-ngx/src/app/modules/home/components/device/device-credentials.module.ts
new file mode 100644
index 0000000000..49f1c2c097
--- /dev/null
+++ b/ui-ngx/src/app/modules/home/components/device/device-credentials.module.ts
@@ -0,0 +1,46 @@
+///
+/// Copyright © 2016-2021 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 { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { SharedModule } from '@shared/shared.module';
+import { CopyDeviceCredentialsComponent } from './copy-device-credentials.component';
+import { DeviceCredentialsComponent } from './device-credentials.component';
+import { DeviceCredentialsLwm2mComponent } from './device-credentials-lwm2m.component';
+import { DeviceCredentialsLwm2mServerComponent } from './device-credentials-lwm2m-server.component';
+import { DeviceCredentialsMqttBasicComponent } from './device-credentials-mqtt-basic.component';
+
+@NgModule({
+ declarations: [
+ CopyDeviceCredentialsComponent,
+ DeviceCredentialsComponent,
+ DeviceCredentialsLwm2mComponent,
+ DeviceCredentialsLwm2mServerComponent,
+ DeviceCredentialsMqttBasicComponent
+ ],
+ imports: [
+ CommonModule,
+ SharedModule
+ ],
+ exports: [
+ CopyDeviceCredentialsComponent,
+ DeviceCredentialsComponent,
+ DeviceCredentialsLwm2mComponent,
+ DeviceCredentialsLwm2mServerComponent,
+ DeviceCredentialsMqttBasicComponent
+ ]
+})
+export class DeviceCredentialsModule { }
diff --git a/ui-ngx/src/app/modules/home/components/home-components.module.ts b/ui-ngx/src/app/modules/home/components/home-components.module.ts
index 1ea914f939..3cfb4c19dc 100644
--- a/ui-ngx/src/app/modules/home/components/home-components.module.ts
+++ b/ui-ngx/src/app/modules/home/components/home-components.module.ts
@@ -110,7 +110,6 @@ import { RuleChainAutocompleteComponent } from '@home/components/rule-chain/rule
import { DeviceProfileProvisionConfigurationComponent } from '@home/components/profile/device-profile-provision-configuration.component';
import { AlarmScheduleComponent } from '@home/components/profile/alarm/alarm-schedule.component';
import { DeviceWizardDialogComponent } from '@home/components/wizard/device-wizard-dialog.component';
-import { DeviceCredentialsComponent } from '@home/components/device/device-credentials.component';
import { AlarmScheduleInfoComponent } from '@home/components/profile/alarm/alarm-schedule-info.component';
import { AlarmScheduleDialogComponent } from '@home/components/profile/alarm/alarm-schedule-dialog.component';
import { EditAlarmDetailsDialogComponent } from '@home/components/profile/alarm/edit-alarm-details-dialog.component';
@@ -120,7 +119,6 @@ import { TenantProfileConfigurationComponent } from '@home/components/profile/te
import { SmsProviderConfigurationComponent } from '@home/components/sms/sms-provider-configuration.component';
import { AwsSnsProviderConfigurationComponent } from '@home/components/sms/aws-sns-provider-configuration.component';
import { TwilioSmsProviderConfigurationComponent } from '@home/components/sms/twilio-sms-provider-configuration.component';
-import { CopyDeviceCredentialsComponent } from '@home/components/device/copy-device-credentials.component';
import { Lwm2mProfileComponentsModule } from '@home/components/profile/device/lwm2m/lwm2m-profile-components.module';
import { DashboardPageComponent } from '@home/components/dashboard-page/dashboard-page.component';
import { DashboardToolbarComponent } from '@home/components/dashboard-page/dashboard-toolbar.component';
@@ -139,11 +137,10 @@ import { EdgeDownlinkTableComponent } from '@home/components/edge/edge-downlink-
import { EdgeDownlinkTableHeaderComponent } from '@home/components/edge/edge-downlink-table-header.component';
import { DisplayWidgetTypesPanelComponent } from '@home/components/dashboard-page/widget-types-panel.component';
import { AlarmDurationPredicateValueComponent } from '@home/components/profile/alarm/alarm-duration-predicate-value.component';
-import { SecurityConfigLwm2mComponent } from '@home/components/device/security-config-lwm2m.component';
-import { SecurityConfigLwm2mServerComponent } from '@home/components/device/security-config-lwm2m-server.component';
import { DashboardImageDialogComponent } from '@home/components/dashboard-page/dashboard-image-dialog.component';
import { WidgetContainerComponent } from '@home/components/widget/widget-container.component';
import { SnmpDeviceProfileTransportModule } from '@home/components/profile/device/snpm/snmp-device-profile-transport.module';
+import { DeviceCredentialsModule } from '@home/components/device/device-credentials.module';
@NgModule({
declarations:
@@ -245,10 +242,6 @@ import { SnmpDeviceProfileTransportModule } from '@home/components/profile/devic
AlarmScheduleComponent,
AlarmDurationPredicateValueComponent,
DeviceWizardDialogComponent,
- DeviceCredentialsComponent,
- CopyDeviceCredentialsComponent,
- SecurityConfigLwm2mComponent,
- SecurityConfigLwm2mServerComponent,
AlarmScheduleDialogComponent,
EditAlarmDetailsDialogComponent,
SmsProviderConfigurationComponent,
@@ -274,7 +267,8 @@ import { SnmpDeviceProfileTransportModule } from '@home/components/profile/devic
SharedHomeComponentsModule,
Lwm2mProfileComponentsModule,
SnmpDeviceProfileTransportModule,
- StatesControllerModule
+ StatesControllerModule,
+ DeviceCredentialsModule
],
exports: [
EntitiesTableComponent,
@@ -353,10 +347,6 @@ import { SnmpDeviceProfileTransportModule } from '@home/components/profile/devic
AddDeviceProfileDialogComponent,
RuleChainAutocompleteComponent,
DeviceWizardDialogComponent,
- DeviceCredentialsComponent,
- CopyDeviceCredentialsComponent,
- SecurityConfigLwm2mComponent,
- SecurityConfigLwm2mServerComponent,
AlarmScheduleInfoComponent,
AlarmScheduleComponent,
AlarmScheduleDialogComponent,
diff --git a/ui-ngx/src/app/modules/home/components/profile/add-device-profile-dialog.component.html b/ui-ngx/src/app/modules/home/components/profile/add-device-profile-dialog.component.html
index c546cc8912..b91613955d 100644
--- a/ui-ngx/src/app/modules/home/components/profile/add-device-profile-dialog.component.html
+++ b/ui-ngx/src/app/modules/home/components/profile/add-device-profile-dialog.component.html
@@ -19,6 +19,7 @@
device-profile.add
+