Working on JSON compliance with backend APIs

This commit is contained in:
Maria Teresa Paratore 2024-04-11 18:08:48 +02:00
parent 1e493b7d6b
commit 5dfb5ffa3b
3 changed files with 39 additions and 49 deletions

View File

@ -43,7 +43,15 @@
</mat-form-field>
<!-- PROPERTIES -->
<div formGroupName ="props">
<!-- myForm.get([facetTemplate.key,ind,'isAdded'])!.value" -->
<div formGroupName ="props" >
<mat-form-field>
<mat-label>{{facetTemplate.value.guiProps[ind].name}}</mat-label>
<input matInput formControlName="{{facetTemplate.value.guiProps[ind].name}}" id="{{facetTemplate.value.guiProps[ind].name}}"
type="{{facetTemplate.value.guiProps[ind].type}}"/>
</mat-form-field>
</div>
<!--
<div *ngFor="let prop of facetTemplate.value.guiProps">
<mat-form-field>
<mat-label>{{prop.label}}</mat-label>
@ -51,22 +59,22 @@
type="{{prop.type}}"/>
</mat-form-field>
</div>
</div>
-->
<!-- ADDITIONAL PROPERTIES -->
<div formArrayName ="extraProps" style="border: 2px solid rgb(176, 206, 230); padding: 10px; margin: 5px;">
<span [style.width.px]="350" [style.font-weight]="900">Custom Properties</span>
<div [formGroupName] ="i" *ngFor="let x of getExtraPropsArray(facetTemplate.key,ind).controls; let i=index;">
<mat-form-field>
<mat-label for="prop_deno">name</mat-label>
<input matInput formControlName="prop_deno" type="text"/>
<mat-label for="deno">name</mat-label>
<input matInput formControlName="deno" type="text"/>
</mat-form-field>
<mat-form-field>
<mat-label for="prop_val">value</mat-label>
<input matInput formControlName="prop_val" type="text"/>
<mat-label for="val">value</mat-label>
<input matInput formControlName="val" type="text"/>
</mat-form-field>
<mat-form-field>
<mat-label for="prop_tipo" >type</mat-label>
<mat-select formControlName="prop_tipo" id="tipo">
<mat-label for="tipo" >type</mat-label>
<mat-select formControlName="tipo" id="tipo">
<mat-option *ngFor="let tp of optionTypes" [value]="tp.value" >
{{tp.value}}
</mat-option>

View File

@ -122,16 +122,31 @@ export class FacetComposerComponent implements OnInit {
get extraProp():FormGroup{
return this.fb.group({
prop_deno: ['',Validators.required],
prop_val: ['',Validators.required],
prop_tipo:['String']
deno: ['',Validators.required],
val: ['',Validators.required],
tipo:['String']
})
}
get props():FormGroup{
return this.fb.group({
})
}
getPropsGroup(denoFacet:string):FormGroup{
console.debug("òòòòòòòòòòòòòòò");
//console.debug((this.getSingleFacetArray(denoFacet)).controls);
return this.myForm.get(denoFacet)!.get('props') as FormGroup;
}
getExtraPropsArray(denoFacet:string, index:number):FormArray{
return (this.getSingleFacetArray(denoFacet).controls[index]).get('extraProps') as FormArray;
}
addExtraProp(denoFacet:string, index:number):void{
this.getExtraPropsArray(denoFacet, index).push(this.extraProp);
}
@ -150,6 +165,7 @@ export class FacetComposerComponent implements OnInit {
createFacetGroup(item: IFacetComposer,isAdded: boolean):FormGroup{
const facetFg: FormGroup = this.fb.group({});
const nameFc = this.fb.control(item.name);
facetFg.addControl('facetName', nameFc);
@ -173,13 +189,13 @@ export class FacetComposerComponent implements OnInit {
//1. creo group con le properties
//2. aggiungo formgroup delle properties ai controls per la facet
// facetFg.addControl('properties',this.createPropertyControls(item.guiProps));
return this.addPropertyControls(facetFg,item.guiProps);
}
addPropertyControls(facetFg:FormGroup, props: IFacetProps[]){
addPropertyControls(facetFg:FormGroup, props: IFacetProps[]):FormGroup{
const propsFg = this.fb.group({});
let fc:FormControl;
@ -207,8 +223,8 @@ export class FacetComposerComponent implements OnInit {
}
}
}
propsFg.addControl("prop_"+prop.name,fc); //formGroup.addControl(prop_'controlName', formControl);
//facetFg.addControl("prop_"+prop.name,fc); //formGroup.addControl(prop_'controlName', formControl);
propsFg.addControl(prop.name,fc); //formGroup.addControl(prop_'controlName', formControl);
// facetFg.addControl("prop_"+prop.name,fc); //formGroup.addControl(prop_'controlName', formControl);
}
facetFg.addControl('props',propsFg);
return facetFg;
@ -227,46 +243,12 @@ export class FacetComposerComponent implements OnInit {
console.log(JSON.stringify(error));
});
/*
this.guiService.createResource(this.titleType, this.testData).subscribe((res => {
dummy = res;
//TODO: QUI TRASFORMA OGGETTO
console.log("-------- DUMMY -----------");
console.log(dummy);
})
);
*/
//parto con una facet per tipo
//this.createForm(res);
/* this.guiService.getFormStructure(this.titlePath,this.titleType).subscribe(res => {
this.typeSpec = res;
this.fieldsMap = new Map(res.facetSpecs.map((obj) => [obj.name+'_'+obj.relation, obj]));
//parto con una facet per tipo
this.createForm(res);
});
*/
}
onSubmit2() {
const formData = this.testData;
const jsonString = JSON.stringify(formData)
//console.log("***** FORMDATA *****");
//console.log(this.testData);
// const tobesaved = new Map<string,any>();
/*
const tobesaved = {
'type':'',
'consistsOf':[{
'type':'',
'target':{}
}]
};
*/
const tobesaved = {
'type':'',
'consistsOf':[{}]