Verified Commit 202aba46 authored by João Capucho's avatar João Capucho
Browse files

Secret characteristics UI improvements

parent ac14fb79

src/app/shared/components/catalogManagement/characteristic-input/characteristic-input.component.html

+11 −0
Original line number Diff line number Diff line 
<!-- <mat-form-field> must be redefined for each case, because otherwise the

     material selectors don't function correctly -->

<ng-container [ngSwitch]="valueType">

    <ng-container *ngSwitchCase="'SECRET'">

        <mat-form-field [appearance]="appearance">

            <mat-label>{{ label }}</mat-label>



            <input matInput [formControl]="ngControl.control" [attr.type]="exposeSecret ? 'text' : 'password'">

            <button mat-icon-button matSuffix (click)="exposeSecret = !exposeSecret">

                <mat-icon>{{exposeSecret ? 'visibility_off' : 'visibility'}}</mat-icon>

            </button>

        </mat-form-field>

    </ng-container>



    <ng-container *ngSwitchCase="'LONGTEXT'">

        <mat-form-field [appearance]="appearance">

            <mat-label>{{ label }}</mat-label>

src/app/shared/components/catalogManagement/characteristic-input/characteristic-input.component.ts

+2 −0
Original line number Diff line number Diff line
@@ -12,5 +12,7 @@ export class CharacteristicInputComponent { 


  @Input() appearance: string;



  exposeSecret: boolean = false;



  constructor(public ngControl: NgControl) {}

}

src/app/shared/components/inventoryManagement/characteristic-value/characteristic-value.component.html

+3 −0
Original line number Diff line number Diff line 
<span>{{ this.valueRender() }}</span>

<button mat-icon-button (click)="exposeSecret = !exposeSecret" *ngIf="valueType === 'SECRET'">

    <mat-icon>{{exposeSecret ? 'visibility_off' : 'visibility'}}</mat-icon>

</button>

src/app/shared/components/inventoryManagement/characteristic-value/characteristic-value.component.ts

+4 −0
Original line number Diff line number Diff line
@@ -9,8 +9,12 @@ export class CharacteristicValueComponent { 
  @Input() value: string;

  @Input() valueType: string;



  exposeSecret: boolean = false;



  valueRender(): string {

    switch (this.valueType) {

      case "SECRET":

        return this.exposeSecret ? this.value : "********";

      default:

        return this.value;

    }