managing credential fields
This commit is contained in:
parent
a881508435
commit
0f26bd2de3
|
@ -45,18 +45,47 @@
|
|||
<!-- PROPERTIES -->
|
||||
<div formGroupName ="props" >
|
||||
<div *ngFor="let prop of facetTemplate.value.guiProps">
|
||||
<div *ngIf="prop.type==='typeprop'; else singlefield" style="border: 1px solid rgb(202, 202, 202); padding: 10px; margin: 5px;">
|
||||
<div *ngIf="prop.type==='typeprop'; else singlefield" style="border: 1px solid rgb(202, 202, 202); padding: 10px; margin: 5px;">
|
||||
<p style="color: darkgrey;">{{prop.label}}</p>
|
||||
<mat-form-field>
|
||||
<mat-label>username</mat-label>
|
||||
<input matInput formControlName="schema" id="username"
|
||||
type="text"/>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-label>password</mat-label>
|
||||
<input matInput formControlName="value" id="password"
|
||||
type="password"/>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field>
|
||||
<mat-label for="credentials" >Choose:</mat-label>
|
||||
<mat-select formControlName="credentials" id="credentials" (selectionChange)="setCredentialType($event)">
|
||||
<mat-option *ngFor="let opt of credentialTypes" [value]="opt">
|
||||
{{opt}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<div *ngIf="selectedCredentialType === 'username/password'">
|
||||
<mat-form-field>
|
||||
<mat-label for="username">username</mat-label>
|
||||
<input matInput formControlName="username" type="text"/>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-label for="password">password</mat-label>
|
||||
<input matInput formControlName="password" type="password"/>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div *ngIf="selectedCredentialType === 'client-id/secret'">
|
||||
<mat-form-field>
|
||||
<mat-label for="client-id">client-id</mat-label>
|
||||
<input matInput formControlName="client-id" type="text"/>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-label for="secret">secret</mat-label>
|
||||
<input matInput formControlName="secret" type="password"/>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div *ngIf="selectedCredentialType === 'token/secret'">
|
||||
<mat-form-field>
|
||||
<mat-label for="token">token</mat-label>
|
||||
<input matInput formControlName="token" type="text"/>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-label for="secret">secret</mat-label>
|
||||
<input matInput formControlName="secret" type="password"/>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<ng-template #singlefield>
|
||||
<mat-form-field>
|
||||
|
@ -167,8 +196,7 @@
|
|||
(click)="addFacet(facetTemplate.key)" [disabled]="facetTemplate.value.max==='1'">
|
||||
<mat-icon>add</mat-icon>Add new </button>
|
||||
</div>
|
||||
|
||||
</div> <!-- ends the form -->
|
||||
</div> <!-- ends the form -->
|
||||
</mat-dialog-content>
|
||||
<mat-dialog-actions align="end">
|
||||
<button mat-button type="submit" (click)="onSubmit()">Submit</button>
|
||||
|
|
|
@ -11,6 +11,7 @@ import { IResource } from 'app/services/i-resource';
|
|||
import { FacetComposerService, ITypeSpecification } from './facet-composer.service';
|
||||
import { MatFormFieldModule } from '@angular/material/form-field';
|
||||
import { MatButtonModule } from '@angular/material/button';
|
||||
import {MatRadioModule} from "@angular/material/radio";
|
||||
import { MatInputModule } from '@angular/material/input';
|
||||
import { MatExpansionModule } from '@angular/material/expansion';
|
||||
import { IFacetComposer, IFacetProps } from './i-facet-composer';
|
||||
|
@ -23,7 +24,7 @@ import { MatSelectFilterModule } from 'mat-select-filter';
|
|||
templateUrl: './facet-composer.component.html',
|
||||
styleUrls: ['./facet-composer.component.scss'],
|
||||
imports:[CommonModule,MatFormFieldModule,SharedModule,
|
||||
ReactiveFormsModule,MatButtonModule,
|
||||
ReactiveFormsModule,MatButtonModule,MatRadioModule,
|
||||
MatDialogModule,MatInputModule,MatExpansionModule,MatSelectFilterModule],
|
||||
providers: [FacetComposerService]
|
||||
})
|
||||
|
@ -34,6 +35,7 @@ export class FacetComposerComponent implements OnInit {
|
|||
titlePath: string;
|
||||
selectedOption: string;
|
||||
selectedType: string;
|
||||
selectedCredentialType: string|any;
|
||||
|
||||
myForm: FormGroup; //form complessiva
|
||||
typeSpec: ITypeSpecification;
|
||||
|
@ -91,8 +93,9 @@ export class FacetComposerComponent implements OnInit {
|
|||
];
|
||||
|
||||
|
||||
|
||||
onOptionTypeSelected(): void {
|
||||
credentialTypes: string[] = ['username/password', 'client-id/secret', 'token/secret'];
|
||||
|
||||
onCredentialChoose(): void {
|
||||
console.debug('******onOptionsSelected?...'+this.selectedType);
|
||||
}
|
||||
|
||||
|
@ -122,6 +125,7 @@ export class FacetComposerComponent implements OnInit {
|
|||
deno: ['',Validators.required],
|
||||
val: ['',Validators.required],
|
||||
tipo:['String']
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
|
@ -131,6 +135,8 @@ export class FacetComposerComponent implements OnInit {
|
|||
}
|
||||
|
||||
|
||||
|
||||
|
||||
getPropsGroup(denoFacet:string, index:number):FormGroup{
|
||||
return (this.getSingleFacetArray(denoFacet).controls[index]).get('props') as FormGroup;
|
||||
}
|
||||
|
@ -183,7 +189,11 @@ export class FacetComposerComponent implements OnInit {
|
|||
|
||||
}
|
||||
|
||||
|
||||
setCredentialType(opt:any){
|
||||
this.selectedCredentialType = opt.value;
|
||||
console.debug("*******CAMBIATO: "+opt.value);
|
||||
}
|
||||
|
||||
|
||||
addPropertyControls(facetFg:FormGroup, props: IFacetProps[]):FormGroup{
|
||||
const propsFg = this.fb.group({});
|
||||
|
@ -214,12 +224,14 @@ export class FacetComposerComponent implements OnInit {
|
|||
}
|
||||
}
|
||||
}
|
||||
if(prop.type==="typeprop"){ //TODO: forse va messo il controllo anche sul tipo di facet
|
||||
let fc2:FormControl;
|
||||
propsFg.addControl("schema",fc);
|
||||
// eslint-disable-next-line prefer-const
|
||||
fc2 = this.fb.control('') //text or typeprop
|
||||
propsFg.addControl("value",fc2);
|
||||
if(prop.type==="typeprop"){
|
||||
propsFg.addControl("credentials",this.fb.control('',Validators.required));
|
||||
propsFg.addControl("username",this.fb.control('',Validators.required));
|
||||
propsFg.addControl("password",this.fb.control('',Validators.required));
|
||||
propsFg.addControl("client-id",this.fb.control('',Validators.required));
|
||||
propsFg.addControl("secret",this.fb.control('',Validators.required));
|
||||
propsFg.addControl("token",this.fb.control('',Validators.required));
|
||||
propsFg.addControl("secret",this.fb.control('',Validators.required));
|
||||
}else{
|
||||
propsFg.addControl(prop.name,fc); //formGroup.addControl(prop_'controlName', formControl);
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue