Commit d0c39416b66b0f4ee68313abd6bad44a13f30232

Authored by Vladyslav_Prykhodko
Committed by Andrew Shvayka
1 parent 71324536

UI: Added copied button device provision parameters in device profile

... ... @@ -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",
... ...