gCubeSystem
/
information-system-gui
15
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

debugging controllers...

This commit is contained in:
Maria Teresa Paratore 2024-03-07 17:26:01 +01:00
parent 39e8d5ded1
commit 038368257a
2 changed files with 87 additions and 131 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

78
src/main/webapp/app/facet-composer/facet-composer.component.html
View File

@ -16,55 +16,39 @@
</mat-expansion-panel> </mat-expansion-panel>
<div [formGroup]="myForm"> <div [formGroup]="myForm">
<div formArrayName="facets">
<div *ngFor="let fct of typeSpec.facetSpecs; let ind=index;"> <div formArrayName="facetBlocks">
<mat-expansion-panel> <div [formGroupName] ="ind" *ngFor="let fct of typeSpec.facetSpecs; let ind=index;" >
<mat-expansion-panel-header> <mat-expansion-panel>
<mat-panel-title> <mat-expansion-panel-header>
<!--TODO: vedi quando si possono rendere editabili le relazioni--> <mat-panel-title>
<input formControlName="relation" type="text" value="{{typeSpec.facetSpecs[ind].relation}}" [disabled]="true"/> <!--TODO: vedi quando si possono rendere editabili le relazioni-->
</mat-panel-title> <input formControlName="relation" type="text" value="{{typeSpec.facetSpecs[ind].relation}}" />
<mat-panel-description> </mat-panel-title>
{{typeSpec.facetSpecs[ind].name}} <mat-panel-description>
</mat-panel-description> {{typeSpec.facetSpecs[ind].name}}
</mat-expansion-panel-header> </mat-panel-description>
<p>{{typeSpec.facetSpecs[ind].description}}</p> </mat-expansion-panel-header>
<p>{{typeSpec.facetSpecs[ind].description}}</p>
<!-- OK SO FAR -->
<!-- OK SO FAR -->
<p>group {{ind}}</p> <div formArrayName="facetPropsBlock" style="border: 1px solid rgb(84, 193, 255); padding: 10px; margin: 5px;">
<div formArrayName="facetProps" style="border: 1px solid rgb(84, 193, 255); padding: 10px; margin: 5px;"> <div [formGroupName] ="i" *ngFor="let prop of typeSpec.facetSpecs[ind].guiProps; let i=index" >
<div formGroupName="ind"> <label for="{{prop.name}}">{{i}}.{{prop.label}}</label>
<!-- <input formControlName="{{prop.name}}" id="{{prop.name}}" type="{{prop.type}}"/>
<div *ngFor="let student of studentsArray.controls; let i = index" [formGroupName]="i">
<input formControlName="firstName" placeholder="First Name"> </div>
<input formControlName="lastName" placeholder="Last Name">
<input formControlName="dob" placeholder="Date of Birth">
</div>
-->
<div *ngFor="let prop of typeSpec.facetSpecs[ind].guiProps; let i=index" >
<p> control {{i}} - <label>{{prop.label}}</label>
<input formControlName="i" type="{{prop.type}}"/>
</p>
</div>
</div> </div>
</div>
</mat-expansion-panel>
</mat-expansion-panel> </div>
</div> </div>
</div> </div>
</div>
<!-- <button mat-button (click)="doAction()">Save Form</button> --> <!-- <button mat-button (click)="doAction()">Save Form</button> -->
<!--</form>--> <!--</form>-->
<!--fine form esterna--> <!--fine form esterna-->

140
src/main/webapp/app/facet-composer/facet-composer.component.ts
View File

@ -33,7 +33,6 @@ export class FacetComposerComponent implements OnInit {
myForm: FormGroup ; //form complessiva myForm: FormGroup ; //form complessiva
typeSpec: ITypeSpecification; typeSpec: ITypeSpecification;
// eslint-disable-next-line @typescript-eslint/member-ordering // eslint-disable-next-line @typescript-eslint/member-ordering
@ -43,107 +42,80 @@ export class FacetComposerComponent implements OnInit {
this.titleType = data.type.name; this.titleType = data.type.name;
this.titlePath = data.context.path; this.titlePath = data.context.path;
this.typeSpec = {} as ITypeSpecification; this.typeSpec = {} as ITypeSpecification;
/* this.myForm = this.fb.group({
this.myForm = this.fb.group({ 'facetBlocks': this.fb.array([
'facets': this.fb.array([]),
'facetPropsArray':this.fb.array([]),
});
*/
this.myForm = this.fb.group({
'facets': this.fb.array([
this.fb.group({ this.fb.group({
'relation':'', 'relation':'',
'facetPropsArray':this.fb.array([]), 'facetPropsBlock':this.fb.array([]),
//TODO: PROVA-> 'facetPropsBlock':this.fb.array([this.fb.group({}]),
}) })
]), ]),
}); });
/*
segmentRows3: this.fb.array([
this.fb.group({
segmentId3: '',
segmentTime3: '',
personRows3: this.fb.array([
this.fb.group({
personR3: '',
personI3: ''
})
])
})
]),
*/
} }
/* get facetBlocks() {
Cannot find control with path return this.myForm.get('facetBlocks') as FormArray;
*/ }
get Facets(): FormArray {
return this.myForm.get('facets') as FormArray;
}
get FacetPropsArray(): FormArray {
return this.myForm.get('facetPropsArray') as FormArray;
}
addFacets() { get facetPropsBlock(): FormArray {
return this.myForm.get('facetPropsBlock') as FormArray;
}
/*
addFacetBlocks() {
const fc = {} as IFacetComposer; const fc = {} as IFacetComposer;
this.facets.push(this.fb.group(fc)); this.facetBlocks.push(this.fb.group(fc));
} }
addFacetProps() { addFacetProps() {
const fp = {} as IFacetProps; const fp = {} as IFacetProps;
this.facetPropsArray.push(this.fb.group(fp)); this.facetPropsBlock.push(this.fb.control(fp));
} }
*/
ngOnInit(): void { ngOnInit(): void {
this.guiService.getFormStructure(this.titlePath,this.titleType).subscribe(res => { alert("facetPropsBlock");
this.typeSpec = res; alert(this.facetPropsBlock);
this.prepareEnvironment(res);
}); this.guiService.getFormStructure(this.titlePath,this.titleType).subscribe(res => {
} this.typeSpec = res;
this.prepareControls(res);
});
}
prepareEnvironment(spec:ITypeSpecification){ prepareControls(spec:ITypeSpecification){
for (let ind = 0; ind < spec.facetSpecs.length; ind++) { for (let i=0; i<spec.facetSpecs.length; i++){
//TODO: metti a posto validazione this.facetBlocks.push(this.fb.group({
//this.fb.group() 'relation': [spec.facetSpecs[i].relation,Validators.required]
const itemExt = this.fb.control({ }));
relation: [spec.facetSpecs[ind].relation,null]
}); for(let j=0; j<spec.facetSpecs[i].guiProps.length; j++){
const props = spec.facetSpecs[i].guiProps[j];
const fGroup: FormGroup = new FormGroup({}); alert(this.facetPropsBlock);
let ctrl: FormControl|undefined; //const name = props.name;
for(let j=0; j<spec.facetSpecs[ind].guiProps.length; j++){ if(props.validations.length===0){
const item = spec.facetSpecs[ind].guiProps[j]; this.facetPropsBlock.push(
if(item.validations.length===0){ this.fb.control({
ctrl = this.fb.control({ j : ['',null]
name: ['',null] })
}); );
}else{ }else{
ctrl = this.fb.control({ this.facetPropsBlock.push(
name: ['',Validators.required] this.fb.control({
}); j : ['',Validators.required],
} })
fGroup.addControl('',ctrl); //AGGIUNGO FORMCONTROL AL FORMGROUP );
} }
this.FacetPropsArray.push(fGroup); //AGGIUNGO FORMGROUP PER LA FACET
} }
this.facetBlocks.push(this.facetPropsBlock);
}
} }
get facets() {
return this.myForm.get('facets') as FormArray;
}
// eslint-disable-next-line @typescript-eslint/adjacent-overload-signatures
get facetPropsArray(){
return this.myForm.get('facetPropsArray') as FormArray;
}
close():void { close():void {
this.dialogRef.close({event:'cancel'}); this.dialogRef.close({event:'cancel'});
} }