Commit d0c39416b66b0f4ee68313abd6bad44a13f30232
Committed by
Andrew Shvayka
1 parent
71324536
UI: Added copied button device provision parameters in device profile
Showing
3 changed files
with
38 additions
and
1 deletions
ui-ngx/src/app/modules/home/components/profile/device-profile-provision-configuration.component.html
... | ... | @@ -31,6 +31,14 @@ |
31 | 31 | <mat-form-field fxFlex class="mat-block"> |
32 | 32 | <mat-label translate>device-profile.provision-device-key</mat-label> |
33 | 33 | <input matInput formControlName="provisionDeviceKey" required/> |
34 | + <button mat-button matSuffix mat-icon-button | |
35 | + ngxClipboard | |
36 | + [cbContent]="provisionConfigurationFormGroup.get('provisionDeviceKey').value" | |
37 | + (cbOnSuccess)="onProvisionCopied(true)" | |
38 | + matTooltip="{{ 'device-profile.copy-provision-key' | translate }}" | |
39 | + matTooltipPosition="above"> | |
40 | + <mat-icon svgIcon="mdi:clipboard-arrow-left" style="font-size: 20px;"></mat-icon> | |
41 | + </button> | |
34 | 42 | <mat-error *ngIf="provisionConfigurationFormGroup.get('provisionDeviceKey').hasError('required')"> |
35 | 43 | {{ 'device-profile.provision-device-key-required' | translate }} |
36 | 44 | </mat-error> |
... | ... | @@ -38,6 +46,14 @@ |
38 | 46 | <mat-form-field fxFlex class="mat-block"> |
39 | 47 | <mat-label translate>device-profile.provision-device-secret</mat-label> |
40 | 48 | <input matInput formControlName="provisionDeviceSecret" required/> |
49 | + <button mat-button matSuffix mat-icon-button | |
50 | + ngxClipboard | |
51 | + [cbContent]="provisionConfigurationFormGroup.get('provisionDeviceSecret').value" | |
52 | + (cbOnSuccess)="onProvisionCopied(false)" | |
53 | + matTooltip="{{ 'device-profile.copy-provision-secret' | translate }}" | |
54 | + matTooltipPosition="above"> | |
55 | + <mat-icon svgIcon="mdi:clipboard-arrow-left" style="font-size: 20px;"></mat-icon> | |
56 | + </button> | |
41 | 57 | <mat-error *ngIf="provisionConfigurationFormGroup.get('provisionDeviceSecret').hasError('required')"> |
42 | 58 | {{ 'device-profile.provision-device-secret-required' | translate }} |
43 | 59 | </mat-error> | ... | ... |
... | ... | @@ -33,6 +33,10 @@ import { |
33 | 33 | deviceProvisionTypeTranslationMap |
34 | 34 | } from '@shared/models/device.models'; |
35 | 35 | import { generateSecret, isDefinedAndNotNull } from '@core/utils'; |
36 | +import { ActionNotificationShow } from '@core/notification/notification.actions'; | |
37 | +import { Store } from '@ngrx/store'; | |
38 | +import { AppState } from '@core/core.state'; | |
39 | +import { TranslateService } from '@ngx-translate/core'; | |
36 | 40 | |
37 | 41 | @Component({ |
38 | 42 | selector: 'tb-device-profile-provision-configuration', |
... | ... | @@ -73,7 +77,9 @@ export class DeviceProfileProvisionConfigurationComponent implements ControlValu |
73 | 77 | |
74 | 78 | private propagateChange = (v: any) => { }; |
75 | 79 | |
76 | - constructor(private fb: FormBuilder) { | |
80 | + constructor(protected store: Store<AppState>, | |
81 | + private fb: FormBuilder, | |
82 | + private translate: TranslateService) { | |
77 | 83 | } |
78 | 84 | |
79 | 85 | ngOnInit(): void { |
... | ... | @@ -149,4 +155,15 @@ export class DeviceProfileProvisionConfigurationComponent implements ControlValu |
149 | 155 | } |
150 | 156 | this.propagateChange(deviceProvisionConfiguration); |
151 | 157 | } |
158 | + | |
159 | + onProvisionCopied(isKey: boolean) { | |
160 | + this.store.dispatch(new ActionNotificationShow( | |
161 | + { | |
162 | + message: this.translate.instant(isKey ? 'device-profile.provision-key-copied-message' : 'device-profile.provision-secret-copied-message'), | |
163 | + type: 'success', | |
164 | + duration: 1200, | |
165 | + verticalPosition: 'bottom', | |
166 | + horizontalPosition: 'right' | |
167 | + })); | |
168 | + } | |
152 | 169 | } | ... | ... |
... | ... | @@ -950,8 +950,12 @@ |
950 | 950 | "provision-strategy-check-pre-provisioned": "Check for pre-provisioned devices", |
951 | 951 | "provision-device-key": "Provision device key", |
952 | 952 | "provision-device-key-required": "Provision device key is required.", |
953 | + "copy-provision-key": "Copy provision key", | |
954 | + "provision-key-copied-message": "Provision key has been copied to clipboard", | |
953 | 955 | "provision-device-secret": "Provision device secret", |
954 | 956 | "provision-device-secret-required": "Provision device secret is required.", |
957 | + "copy-provision-secret": "Copy provision secret", | |
958 | + "provision-secret-copied-message": "Provision secret has been copied to clipboard", | |
955 | 959 | "condition": "Condition", |
956 | 960 | "condition-type": "Condition type", |
957 | 961 | "condition-type-simple": "Simple", | ... | ... |