new-is-app-angular2 #12

Merged
michele.artini merged 43 commits from new-is-app-angular2 into new-is-app 2023-02-06 11:30:14 +01:00
2 changed files with 31 additions and 23 deletions
Showing only changes of commit f776c2ca68 - Show all commits

View File

@ -10,7 +10,7 @@
<mat-error *ngIf="addApiForm.get('protocol')?.invalid">This field is <strong>required</strong></mat-error> <mat-error *ngIf="addApiForm.get('protocol')?.invalid">This field is <strong>required</strong></mat-error>
</mat-form-field> </mat-form-field>
<mat-card style="margin-top: 10px;" *ngIf="addApiForm.get('protocol')?.value"> <mat-card style="margin-top: 10px;" *ngIf="selectedProtocol">
<mat-card-header> <mat-card-header>
<mat-card-title>API Description</mat-card-title> <mat-card-title>API Description</mat-card-title>
</mat-card-header> </mat-card-header>
@ -27,7 +27,7 @@
<mat-form-field appearance="fill" floatLabel="always" style="width: 70%;"> <mat-form-field appearance="fill" floatLabel="always" style="width: 70%;">
<mat-label>Api ID (suffix)</mat-label> <mat-label>Api ID (suffix)</mat-label>
<input matInput formControlName="apiId" required placeholder="example: {{addApiForm.get('protocol')?.value}}_01" /> <input matInput formControlName="apiId" required placeholder="example: {{selectedProtocol}}_01" />
<mat-error *ngIf="addApiForm.get('apiId')?.invalid">This field is <strong>required</strong></mat-error> <mat-error *ngIf="addApiForm.get('apiId')?.invalid">This field is <strong>required</strong></mat-error>
</mat-form-field> </mat-form-field>
@ -49,7 +49,7 @@
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>
<mat-card style="margin-top: 10px;" *ngIf="addApiForm.get('protocol')?.value"> <mat-card style="margin-top: 10px;" *ngIf="selectedProtocol">
<mat-card-header> <mat-card-header>
<mat-card-title>Configuration Parameters</mat-card-title> <mat-card-title>Configuration Parameters</mat-card-title>
</mat-card-header> </mat-card-header>
@ -61,8 +61,9 @@
</mat-form-field> </mat-form-field>
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;" *ngFor="let p of selProtParams"> <mat-form-field appearance="fill" floatLabel="always" style="width: 100%;" *ngFor="let p of selProtParams">
<mat-label>Protocol: {{addApiForm.get('protocol')?.value}} - Parameter: {{p.name}}</mat-label> <mat-label>Protocol: {{selectedProtocol}} - Parameter: {{p.label}}</mat-label>
<input matInput required /> <input matInput [formControlName]="paramPrefix + p.name" required />
<mat-error *ngIf="addApiForm.get(paramPrefix + p.name)?.invalid">Invalid value</mat-error>
</mat-form-field> </mat-form-field>
<mat-form-field appearance="fill" floatLabel="always" style="width: 100%;"> <mat-form-field appearance="fill" floatLabel="always" style="width: 100%;">

View File

@ -8,7 +8,7 @@ import { MatSort } from '@angular/material/sort';
import { combineLatest } from 'rxjs'; import { combineLatest } from 'rxjs';
import { Router } from '@angular/router'; import { Router } from '@angular/router';
import { PageEvent } from '@angular/material/paginator'; import { PageEvent } from '@angular/material/paginator';
import { FormControl, FormGroup, Validators } from '@angular/forms'; import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
import { MatSelectChange } from '@angular/material/select'; import { MatSelectChange } from '@angular/material/select';
@Component({ @Component({
@ -162,27 +162,27 @@ export class DsmBrowseDialog implements OnInit {
styleUrls: ['./dsm.component.css'] styleUrls: ['./dsm.component.css']
}) })
export class DsmAddApiDialog { export class DsmAddApiDialog {
selectedProtocol:string = '';
apiPrefix:string = ''; apiPrefix:string = '';
apiIdControl = new FormControl('');
addApiForm = new FormGroup({
apiId: this.apiIdControl,
compatibility : new FormControl(''),
contentdescription : new FormControl(''),
protocol : new FormControl(''),
baseurl : new FormControl(''),
metadataIdentifierPath : new FormControl('')
});
protocols:string[] = []; protocols:string[] = [];
compatibilityLevels:string[] = []; compatibilityLevels:string[] = [];
contentDescTypes:string[] = []; contentDescTypes:string[] = [];
protocolsMap:any = {}; protocolsMap:any = {};
selProtParams:ProtocolParam[] = []; selProtParams:ProtocolParam[] = [];
paramPrefix:string = '__PARAM_';
apiIdControl = new FormControl('', [Validators.required]);
addApiForm:FormGroup = new FormGroup({
apiId: this.apiIdControl,
compatibility : new FormControl(''),
contentdescription : new FormControl(''),
protocol : new FormControl(''),
baseurl : new FormControl(''),
metadataIdentifierPath : new FormControl('')
});
constructor(public dialogRef: MatDialogRef<DsmAddApiDialog>, @Inject(MAT_DIALOG_DATA) public data: any, public service: ISService) { constructor(public dialogRef: MatDialogRef<DsmAddApiDialog>, @Inject(MAT_DIALOG_DATA) public data: any, public service: ISService) {
this.apiPrefix = 'api_________::' + data.dsId + '::'; this.apiPrefix = 'api_________::' + data.dsId + '::';
@ -197,20 +197,27 @@ export class DsmAddApiDialog {
} }
onChangeProtocol(e:MatSelectChange):void { onChangeProtocol(e:MatSelectChange):void {
this.selectedProtocol = e.value;
Object.keys(this.addApiForm.controls).forEach(k => {
if (k.startsWith(this.paramPrefix)) {
this.addApiForm.removeControl(k);
}
});
if (this.protocolsMap[e.value]) { if (this.protocolsMap[e.value]) {
this.selProtParams = this.protocolsMap[e.value]; this.selProtParams = this.protocolsMap[e.value];
this.selProtParams.forEach(p => this.addApiForm.addControl(this.paramPrefix + p.name, new FormControl('')));
} else { } else {
this.selProtParams = this.protocolsMap[e.value]; this.selProtParams = [];
} }
} }
onSubmit():void { onSubmit():void {
//const api = DsmAddApiDialog.value; //const api = this.addApiForm.value;
//api.apiId = this.apiPrefix + api.apiId; IMPORTANT //api.apiId = this.apiPrefix + api.apiId; IMPORTANT
//this.service.dsmAddApi(api, (data: void) => this.dialogRef.close(1), this.metadataForm); //this.service.dsmAddApi(api, (data: void) => this.dialogRef.close(1), this.metadataForm);
console.log(this.addApiForm.value);
} }
onNoClick(): void { onNoClick(): void {