no message
This commit is contained in:
parent
cde1596c35
commit
67007c8d3d
|
@ -1,7 +1,8 @@
|
|||
<div *ngIf="visibilityRulesService.isElementVisible(pathName,compositeField.id)" [id]="compositeField.id" [formGroup]="form">
|
||||
|
||||
|
||||
<df-field *ngIf="compositeField.fields.length == 1" [field]="compositeField.fields[0]" [form]="form.get('fields').get(''+0)" [path]="path" [pathName]="pathName+'.fields.'+0"></df-field>
|
||||
<df-field *ngIf="compositeField.fields.length == 1" [field]="compositeField.fields[0]" [form]="form.get('fields').get(''+0)"
|
||||
[path]="path" [pathName]="pathName+'.fields.'+0"></df-field>
|
||||
|
||||
<div *ngIf="compositeField.fields.length > 1" class="fieldset-component">
|
||||
<h4 *ngIf="compositeField.title">{{compositeField.title}}</h4>
|
||||
|
@ -11,7 +12,16 @@
|
|||
<i>{{compositeField.extendedDescription}}</i>
|
||||
</h4>
|
||||
<div *ngFor="let field of compositeField.fields; let i = index;">
|
||||
<df-field [field]="field" [form]="form.get('fields').get(''+i)" [path]="path" [pathName]="pathName+'.fields.'+i"></df-field>
|
||||
<div *ngIf="(field?.multiplicity?.max - 1) > (field?.multiplicityItems?.length)">
|
||||
<a (click)="addMultipleField(i)" style="cursor: pointer">
|
||||
Add one more field +
|
||||
</a>
|
||||
</div>
|
||||
<df-field [field]="field" [form]="form.get('fields').get(''+i)" [path]="path" [pathName]="pathName+'.fields.'+i"></df-field>
|
||||
<div *ngFor="let multipleField of field.multiplicityItems; let j = index;">
|
||||
<df-field [field]="multipleField" [form]="form.get('fields').get(''+i).get('multiplicityItems').get(''+j)" [path]="path"
|
||||
[pathName]="pathName+'.fields.'+i+'.multiplicityItems.'+j"></df-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,26 +1,33 @@
|
|||
import { VisibilityRulesService } from '../../visibility-rules/visibility-rules.service';
|
||||
import { CompositeField } from '../../models/CompositeField';
|
||||
import { FormGroup } from '@angular/forms';
|
||||
import { FormGroup, FormArray } from '@angular/forms';
|
||||
import { Section } from '../../entities/model/section';
|
||||
import { Component, Input, OnInit, ViewEncapsulation } from '@angular/core';
|
||||
import { Field } from '../../models/Field';
|
||||
@Component({
|
||||
selector: 'df-composite-field',
|
||||
templateUrl: './dynamic-form-composite-field.html',
|
||||
styleUrls: [
|
||||
'./dynamic-form-composite-field.css'
|
||||
],
|
||||
encapsulation: ViewEncapsulation.None,
|
||||
})
|
||||
export class DynamicFormCompositeFieldComponent implements OnInit{
|
||||
selector: 'df-composite-field',
|
||||
templateUrl: './dynamic-form-composite-field.html',
|
||||
styleUrls: [
|
||||
'./dynamic-form-composite-field.css'
|
||||
],
|
||||
encapsulation: ViewEncapsulation.None,
|
||||
})
|
||||
export class DynamicFormCompositeFieldComponent implements OnInit {
|
||||
|
||||
@Input() compositeField: CompositeField
|
||||
@Input() form: FormGroup;
|
||||
@Input() pathName:string;
|
||||
@Input() path:string;
|
||||
|
||||
constructor(private visibilityRulesService:VisibilityRulesService){}
|
||||
@Input() compositeField: CompositeField
|
||||
@Input() form: FormGroup;
|
||||
@Input() pathName: string;
|
||||
@Input() path: string;
|
||||
|
||||
ngOnInit(){
|
||||
constructor(private visibilityRulesService: VisibilityRulesService) { }
|
||||
|
||||
}
|
||||
}
|
||||
ngOnInit() {
|
||||
|
||||
}
|
||||
|
||||
addMultipleField(fieldIndex: number) {
|
||||
let field: Field = this.compositeField.fields[fieldIndex].cloneForMultiplicity(fieldIndex);
|
||||
this.compositeField.fields[fieldIndex].multiplicityItems.push(field);
|
||||
(<FormArray>(this.form.get("fields").get('' + fieldIndex).get('multiplicityItems'))).push(field.buildForm());
|
||||
}
|
||||
}
|
|
@ -45,7 +45,7 @@ export class DynamicFormGroupComponent implements OnInit {
|
|||
|
||||
|
||||
addMultipleField(fieldsetIndex: number) {
|
||||
let compositeField: CompositeField = this.group.compositeFields[fieldsetIndex].cloneForMultiplicity();
|
||||
let compositeField: CompositeField = this.group.compositeFields[fieldsetIndex].cloneForMultiplicity(fieldsetIndex);
|
||||
this.group.compositeFields[fieldsetIndex].multiplicityItems.push(compositeField);
|
||||
(<FormArray>(this.form.get("compositeFields").get('' + fieldsetIndex).get('multiplicityItems'))).push(compositeField.buildForm());
|
||||
}
|
||||
|
|
|
@ -5,8 +5,8 @@
|
|||
</ng-sidebar>
|
||||
|
||||
<div class="ui-g" ng-sidebar-content>
|
||||
<button class="ui-g" pButton type="button" (click)="toggleSidebar()" icon="fa-arrow-left">Table Of Contents</button>
|
||||
<button type="button" class="btn btn-primary" (click)="submit();">Save and Finalize</button>
|
||||
<button type="button" style="margin: 15px;" class="btn btn-primary" (click)="toggleSidebar()" icon="fa-arrow-left">Table Of Contents</button>
|
||||
<button type="button" style="margin-top: 15px;margin-bottom: 15px;margin-right: 15px;" class="btn btn-primary" (click)="submit();">Save and Finalize</button>
|
||||
<progress-bar class="ui-g" *ngIf="progressbar" [formGroup]=form></progress-bar>
|
||||
<div class="ui-g-12">
|
||||
<p-steps [model]="stepperItems" [(activeIndex)]="this.currentPage" [readonly]="false"></p-steps>
|
||||
|
|
|
@ -7,7 +7,7 @@ import { Multiplicity } from './Multiplicity';
|
|||
export class CompositeField extends BaseModel implements Serializable<CompositeField> {
|
||||
public fields: Array<Field> = new Array<Field>();
|
||||
public ordinal: number
|
||||
public id: number
|
||||
public id: string
|
||||
public multiplicity: Multiplicity;
|
||||
public multiplicityItems: Array<CompositeField> = new Array<CompositeField>();
|
||||
|
||||
|
@ -45,10 +45,11 @@ export class CompositeField extends BaseModel implements Serializable<CompositeF
|
|||
return formGroup;
|
||||
}
|
||||
|
||||
cloneForMultiplicity(): CompositeField {
|
||||
cloneForMultiplicity(index: number): CompositeField {
|
||||
let newItem: CompositeField = new CompositeField();
|
||||
newItem.id = 'multiple_' + this.id + '_' + index;
|
||||
this.fields.forEach(field => {
|
||||
newItem.fields.push(field.cloneForMultiplicity());
|
||||
newItem.fields.push(field.cloneForMultiplicity(this.fields.indexOf(field)));
|
||||
});
|
||||
newItem.ordinal = this.ordinal;
|
||||
|
||||
|
|
|
@ -15,6 +15,7 @@ export class Field extends BaseModel implements Serializable<Field>, FormGenerat
|
|||
public defaultVisibility: boolean;
|
||||
public page: number;
|
||||
public multiplicity: Multiplicity;
|
||||
public multiplicityItems: Array<Field> = new Array<Field>();
|
||||
public data: any;
|
||||
fromJSONObject(item: any): Field {
|
||||
this.id = item.id;
|
||||
|
@ -25,7 +26,10 @@ export class Field extends BaseModel implements Serializable<Field>, FormGenerat
|
|||
this.viewStyle = item.viewStyle;
|
||||
this.defaultVisibility = item.defaultVisibility;
|
||||
this.page = item.page;
|
||||
this.multiplicity = new JsonSerializer<Multiplicity>().fromJSONObject(item.multiplicity, Multiplicity);
|
||||
//this.multiplicity = new JsonSerializer<Multiplicity>().fromJSONObject(item.multiplicity, Multiplicity);
|
||||
this.multiplicity = new Multiplicity();
|
||||
this.multiplicity.max = 2;
|
||||
this.multiplicityItems = new JsonSerializer<Field>().fromJSONArray(item.multiplicityItems, Field);
|
||||
this.data = item.data;
|
||||
return this;
|
||||
}
|
||||
|
@ -42,13 +46,21 @@ export class Field extends BaseModel implements Serializable<Field>, FormGenerat
|
|||
page:[this.page],
|
||||
data:[this.data] */
|
||||
});
|
||||
|
||||
let multiplicityItemsFormArray = new Array<FormGroup>();
|
||||
this.multiplicityItems.forEach(item => {
|
||||
let form: FormGroup = item.buildForm();
|
||||
multiplicityItemsFormArray.push(form)
|
||||
})
|
||||
formGroup.addControl('multiplicityItems', this.formBuilder.array(multiplicityItemsFormArray));
|
||||
|
||||
return formGroup;
|
||||
}
|
||||
|
||||
cloneForMultiplicity(): Field {
|
||||
cloneForMultiplicity(index: number): Field {
|
||||
let newItem: Field = new Field();
|
||||
|
||||
newItem.id = this.id;
|
||||
newItem.id = 'multiple_' + this.id + '_' + index;
|
||||
newItem.title = this.title;
|
||||
newItem.description = this.description;
|
||||
newItem.extendedDescription = this.extendedDescription;
|
||||
|
|
Loading…
Reference in New Issue