get form data, pagination

This commit is contained in:
annampak 2017-11-03 19:14:32 +02:00
parent c7f1a24077
commit b49e7e8970
9 changed files with 192 additions and 161 deletions

View File

@ -2,12 +2,12 @@
<div class="col-md-8 col-sm-9"> <div class="col-md-8 col-sm-9">
<form [formGroup]="form" (ngSubmit)="onSubmit()" novalidate> <form [formGroup]="form" (ngSubmit)="onSubmit()" novalidate>
<div *ngFor = "let section of dataModel.sections"> <div *ngFor = "let section of dataModel.sections; let i = index;">
<div *ngIf="section.groupFields.length>0 else sectionHeader"> <div *ngIf="section.groupFields.length>0 else sectionHeader">
<h3>{{section.title}}</h3> <h3>{{section.title}}</h3>
<div *ngFor="let group of section.groupFields"> <div *ngFor="let group of section.groupFields">
<df-group [group]="group" [dataModel]="dataModel" [form]="getSubForm(group.key)"></df-group> <df-group [group]="group" [dataModel]="dataModel" [form]="getSubForm(group.key)"></df-group>
</div> </div>
</div> </div>
<ng-template #sectionHeader> <ng-template #sectionHeader>
<h2>{{section.title}}</h2> <h2>{{section.title}}</h2>
@ -25,7 +25,8 @@
</div> --> </div> -->
<div> <div>
<button type="submit" class="btn btn-default" [disabled]="!form.valid">Save</button> <button type="submit" class="btn btn-default btncustom" [disabled]="!form.valid">Save</button>
<button type="submit" class="btn btn-default btncustom" [disabled]="!form.valid">Finalize</button>
</div> </div>
<div *ngIf="payLoad" class="form-row"> <div *ngIf="payLoad" class="form-row">
@ -44,7 +45,7 @@
</div> </div>
<div class="panel-body" id="collapse-panel" class="panel-collapse"> <div class="panel-body" id="collapse-panel" class="panel-collapse">
<div *ngIf="dataModel.groups.length"> <div *ngIf="dataModel.groups.length">
<toc [dataModel]="dataModel" (setPage)="setPage(page)"></toc> <toc [dataModel]="dataModel" (setPage)="setPage(2)"></toc>
</div> </div>
</div> </div>
</div> </div>

View File

@ -32,6 +32,7 @@ import * as scroll from '../../assets/jquery.scrollTo.min.js';
@Component({ @Component({
selector: 'dynamic-form', selector: 'dynamic-form',
templateUrl: './dynamic-form.component.html', templateUrl: './dynamic-form.component.html',
styleUrls: ['./dynamic-form.css'],
providers: [FieldControlService, ServerService, dataModelBuilder] providers: [FieldControlService, ServerService, dataModelBuilder]
}) })
export class DynamicFormComponent implements OnInit { export class DynamicFormComponent implements OnInit {
@ -42,18 +43,18 @@ export class DynamicFormComponent implements OnInit {
@Input() dirtyValues: number = 0; @Input() dirtyValues: number = 0;
// pagination object // pagination object
@Input() pagination: any = {}; @Input() pagination: any = {};
id:string; id: string;
datasetId:string; datasetId: string;
//datasetProperties:string; //datasetProperties:string;
private fragment: string; private fragment: string;
xml2jsonOBJ: any; xml2jsonOBJ: any;
constructor(private qcs: FieldControlService, private serverService: ServerService, private dataModelService: dataModelBuilder, private router: Router, constructor(private qcs: FieldControlService, private serverService: ServerService, private dataModelService: dataModelBuilder, private router: Router,
private route: ActivatedRoute, private pagerService: PaginationService, private tokenService : TokenService) { private route: ActivatedRoute, private pagerService: PaginationService, private tokenService: TokenService) {
this.form = this.qcs.toFormGroup(new Array(), new Array()); this.form = this.qcs.toFormGroup(new Array(), new Array());
this.xml2jsonOBJ = new X2JS(); this.xml2jsonOBJ = new X2JS();
} }
@ -70,18 +71,18 @@ export class DynamicFormComponent implements OnInit {
//let id = this.route.snapshot.paramMap.get('id'); //get the project id //let id = this.route.snapshot.paramMap.get('id'); //get the project id
let sub = this.route.params.subscribe(params => { let sub = this.route.params.subscribe(params => {
this.id = params.id; this.id = params.id;
this.datasetId = params.datasetId; this.datasetId = params.datasetId;
//this.datasetProperties = params.datasetProperties //this.datasetProperties = params.datasetProperties
}); });
this.serverService.getDatasetByID(this.datasetId).subscribe(
this.serverService.getDatasetByID(this.datasetId).subscribe(
(data) => { (data) => {
var flatList; var flatList;
var formValues; var formValues = "";
if(data.properties){ if (data.properties) {
console.log("Found already submitted form, loading that one!"); console.log("Found already submitted form, loading that one!");
//console.log(data.properties) //console.log(data.properties)
@ -94,101 +95,115 @@ export class DynamicFormComponent implements OnInit {
//this.patchForm(flatList); //this.patchForm(flatList);
} }
//η κληση για το dataset profile pou htan prin pio panw anexarthth //η κληση για το dataset profile pou htan prin pio panw anexarthth
this.serverService.getDatasetProfileByID(this.id).subscribe( this.serverService.getDatasetProfileByID(this.id).subscribe(
response => { response => {
console.log("response"); console.log("response");
console.log(response); console.log(response);
const data = response; const data = response;
//replace the xmls {model,view,rule} definitions with json -- https://github.com/abdmob/x2js library //replace the xmls {model,view,rule} definitions with json -- https://github.com/abdmob/x2js library
data.definition = this.xml2jsonOBJ.xml_str2json(data.definition); data.definition = this.xml2jsonOBJ.xml_str2json(data.definition);
data.ruleset.definition = this.xml2jsonOBJ.xml_str2json(data.ruleset.definition); data.ruleset.definition = this.xml2jsonOBJ.xml_str2json(data.ruleset.definition);
data.viewstyle.definition = this.xml2jsonOBJ.xml_str2json(data.viewstyle.definition); data.viewstyle.definition = this.xml2jsonOBJ.xml_str2json(data.viewstyle.definition);
//can be converted back to xml (which shouldn't be needed) with this.xml2jsonOBJ.json2xml_str //can be converted back to xml (which shouldn't be needed) with this.xml2jsonOBJ.json2xml_str
console.log("this.serverService.getFields"); console.log("this.serverService.getFields");
console.log("data.dataset") console.log("data.dataset")
console.log(data.definition) console.log(data.definition)
console.log(data.ruleset.definition) console.log(data.ruleset.definition)
console.log(data.viewstyle.definition) console.log(data.viewstyle.definition)
this.dataModel = new DataModel(); this.dataModel = new DataModel();
this.dataModel = this.dataModelService.getDataModel(data, formValues);debugger; this.dataModel = this.dataModelService.getDataModel(data, formValues); debugger;
this.form = this.qcs.toFormGroup(this.dataModel.fields, this.dataModel.groups); this.form = this.qcs.toFormGroup(this.dataModel.fields, this.dataModel.groups);
this.form.valueChanges.subscribe(data => { this.form.valueChanges.subscribe(data => {
// console.log('Form changes', data); // console.log('Form changes', data);
let dirtyValuesArray: Array<any> = []; let dirtyValuesArray: Array<any> = [];
let count = 0; let count = 0;
let countDirtyValues = 0; let countDirtyValues = 0;
Object.keys(this.form.controls).forEach((c) => { let percentage = 0;
//count++; Object.keys(this.form.controls).forEach((c) => {
let currentControl = this.form.controls[c]; //count++;
if (currentControl.dirty) let currentControl = this.form.controls[c];
dirtyValuesArray.push(currentControl.value); if (currentControl.dirty)
dirtyValuesArray.push(currentControl.value);
});
Object.keys(this.form.value).forEach((c) => {
//count++;
Object.keys(this.form.value[c]).forEach((item) => {
let value = this.form.value[c][item]
if (value != undefined && value != "" && value != " ") countDirtyValues++; //TODO REMOVE SPACES FROM EMPTY STRING
}); });
this.dataModel.groups.forEach(grp => {
grp.groupFields.forEach((fld) => {
if (fld.visible == true || fld.visible == "true") });
count++;
if (fld.value != undefined && fld.value !=" ")
countDirtyValues++; this.dataModel.groups.forEach(grp => {
}); grp.groupFields.forEach((fld) => {
if (fld.visible == true || fld.visible == "true")
count++;
// if (fld.value != undefined && fld.value != " ")
// countDirtyValues++;
}); });
//console.log(count); });
// var percentage = Math.floor(dirtyValuesArray.length * 100 / count); //console.log(count);
var percentage = Math.floor(countDirtyValues * 100 / count); // var percentage = Math.floor(dirtyValuesArray.length * 100 / count);
this.dirtyValues = percentage; percentage = Math.floor(countDirtyValues * 100 / count);
}) this.dirtyValues = percentage;
})
//this.form = this.qcs.toFormGroup(this.fields);
//this.form = this.qcs.toFormGroup(this.fields);
console.log("SUMMARY: ======>");
console.log(this.dataModel); console.log("SUMMARY: ======>");
console.log(this.form); console.log(this.dataModel);
console.log(this.form);
this.route.paramMap //this is how i get the projects's id
this.route.paramMap //this is how i get the projects's id
// initialize to page 1
this.setPage(1); // initialize to page 1
this.setPage(1);
},
err => { },
console.log("There was an error fetching the data from server"); err => {
console.log(err); console.log("There was an error fetching the data from server");
} console.log(err);
); }
);
//end- klhsh gia to dataset profiel
//end- klhsh gia to dataset profiel
}, },
(err) => { (err) => {
}); });
} }
scrollToElemID(elemID){ scrollToElemID(elemID) {
scroll("#"+elemID); scroll("#" + elemID);
} }
private patchForm(flatList : any){ private patchForm(flatList: any) {
debugger; debugger;
for (var prop in flatList) { for (var prop in flatList) {
if (flatList.hasOwnProperty(prop)) { if (flatList.hasOwnProperty(prop)) {
if(prop.endsWith('.id')||prop.endsWith('.answer')||prop.endsWith('.value')) continue; if (prop.endsWith('.id') || prop.endsWith('.answer') || prop.endsWith('.value')) continue;
//console.log("updating value of "+prop +" to "+flatList[prop].valueOf()) //console.log("updating value of "+prop +" to "+flatList[prop].valueOf())
this.form.get(prop).setValue(flatList[prop].valueOf()); this.form.get(prop).setValue(flatList[prop].valueOf());
} }
@ -207,23 +222,23 @@ export class DynamicFormComponent implements OnInit {
onSubmit() { onSubmit() {
this.serverService.getDatasetByID(this.datasetId).subscribe( this.serverService.getDatasetByID(this.datasetId).subscribe(
(data) => { (data) => {
//is xml, so transform them to xml (it's json) //is xml, so transform them to xml (it's json)
//data.properties = this.xml2jsonOBJ.json2xml_str(JSON.stringify(this.form.value)); //data.properties = this.xml2jsonOBJ.json2xml_str(JSON.stringify(this.form.value));
data.properties = JSON.stringify(this.form.value); data.properties = JSON.stringify(this.form.value);
this.serverService.setDataset(data).subscribe( (data) => { this.serverService.setDataset(data).subscribe((data) => {
console.log("Updated dataset"); console.log("Updated dataset");
//VALE EDW NA SE PIGAINEI PISW KAI NA SOU VGAZEI ENA MHNYMA SUCCESS... (to success tha to valw egw an thes) //VALE EDW NA SE PIGAINEI PISW KAI NA SOU VGAZEI ENA MHNYMA SUCCESS... (to success tha to valw egw an thes)
}, },
(err) => { (err) => {
}); });
}, },
(err) => { (err) => {
@ -233,6 +248,20 @@ export class DynamicFormComponent implements OnInit {
this.payLoad = JSON.stringify(this.form.value); this.payLoad = JSON.stringify(this.form.value);
} }
shouldIShow(groupFields) {
debugger;
if (this.pagination.currentPage == groupFields[0].page){
return true;
}
return false;
// if (i > this.pagination.startIndex && this.pagination.endIndex) {
// return true;
// }
// return false;
}
buildForm(): void { buildForm(): void {
//this.form = this.qcs.toFormGroup(this.fields. //this.form = this.qcs.toFormGroup(this.fields.
@ -244,33 +273,34 @@ export class DynamicFormComponent implements OnInit {
} }
setPage(page: number) { setPage(page: number) {
if (page < 1 || page > this.pagination.totalPages) { if (page < 1 || page > this.pagination.totalPages) {
return; return;
} }
var pagesize = 3; var pagesize = 3;
// get pagination object from service // get pagination object from service
this.pagination = this.pagerService.getPagination(this.dataModel.groups,this.dataModel.groups.length, page, pagesize); this.pagination = this.pagerService.getPagination(this.dataModel.groups, this.dataModel.groups.length, page, pagesize);
// get current page of items
this.dataModel.sections.forEach(section => { //get current page of items
if(section.groupFields.length > 0){ // this.dataModel.sections.forEach(section => {
section.groupFields = this.dataModel.groups.slice(this.pagination.startIndex, this.pagination.endIndex + 1); // if (section.groupFields.length > 0) {
} // section.groupFields = this.dataModel.groups.slice(this.pagination.startIndex, this.pagination.endIndex + 1);
// }
// });
//this.dataModel.groups = this.dataModel.groups.slice(this.pagination.startIndex, this.pagination.endIndex + 1);
}
signOut2() {
var auth2 = gapi.auth2.getAuthInstance();
auth2.signOut().then(function () {
console.log('User signed out.');
localStorage.removeItem('currentUser');
}); });
//this.dataModel.groups = this.dataModel.groups.slice(this.pager.startIndex, this.pager.endIndex + 1); this.tokenService.setToken(null); //kanonika prepei na mpei mesa sthn function.....
} }
signOut2() { onValueChanged(data?: any) {
    var auth2 = gapi.auth2.getAuthInstance();
    auth2.signOut().then(function () {
      console.log('User signed out.');
localStorage.removeItem('currentUser');
    });
this.tokenService.setToken(null); //kanonika prepei na mpei mesa sthn function.....
  }
onValueChanged(data?: any) {
if (!this.form) { return; } if (!this.form) { return; }
const form = this.form; const form = this.form;

View File

@ -0,0 +1,5 @@
.btncustom{
background-color:#337ab7;
color:white;
margin-top:15px;
}

View File

@ -33,16 +33,16 @@
<div>{{field.description}}</div> <div>{{field.description}}</div>
<input *ngSwitchCase="'textbox'" class="form-control" [formControlName]="field.key" [id]="field.key" [type]="field.type" <input *ngSwitchCase="'textbox'" class="form-control" [formControlName]="field.key" [id]="field.key" [type]="field.type"
[required]="field.required" [pattern] = "field.regex" (ngModelChange) = "toggleVisibility($event, field)"> <!--input or change event [required]="field.required" [pattern] = "field.regex" (ngModelChange) = "toggleVisibility($event, field,false)"> <!--input or change event
on change event the listener is triggered on blur --> on change event the listener is triggered on blur -->
<select *ngSwitchCase="'dropdown'" class="form-control" [id]="field.key" [formControlName]="field.key" [required]="field.required"> <select *ngSwitchCase="'dropdown'" class="form-control" [id]="field.key" [formControlName]="field.key" [required]="field.required">
<option *ngFor="let opt of field.options" [value]="opt.key">{{opt.value}}</option> <option *ngFor="let opt of field.options" [value]="opt.key">{{opt.value}}</option>
</select> </select>
<input *ngSwitchCase="'checkbox'" class="form-check" [formControlName]="field.key" [id]="field.key" [type]="field.type" <input *ngSwitchCase="'checkbox'" class="form-check" [formControlName]="field.key" [type]="field.type"
(change)="toggleVisibility($event, field, ckb)" #ckb [required]="field.required" [checked] = "field.value"> <!--(change)="field.value = ckb.checked" has moved into the toggleVisibility (change)="toggleVisibility($event, field, true)" [required]="field.required" [checked]="form.get(field.key).value"> <!--(change)="field.value = ckb.checked" has moved into the toggleVisibility
// without property [checked] as pages change the checkboxes of the previous pages lose the checked pro --> // without property [checked] as pages change the checkboxes of the previous pages lose the checked pro [checked] = "field.value" #ckb -->
@ -50,7 +50,7 @@
<ng-container *ngFor="let answrBase of field.answers"> <ng-container *ngFor="let answrBase of field.answers">
<div style="display: inline-block;margin-right:10px;" [id]="field.key"> <div style="display: inline-block;margin-right:10px;" [id]="field.key">
<label for="{{answrBase.id}}" style="padding: 8px 10px; padding-right:5px;">{{answrBase.answer}}</label> <label for="{{answrBase.id}}" style="padding: 8px 10px; padding-right:5px;">{{answrBase.answer}}</label>
<input type="radio" [formControlName]="field.key" [id]= "answrBase.id" [value]= "answrBase" [(ngModel)]="field.value" (change) = "toggleVisibility($event, field)" [required]="field.required"/> <input type="radio" [formControlName]="field.key" [id]= "answrBase.id" [value]= "answrBase.value" [(ngModel)]="field.value" (change) = "toggleVisibility($event, field,false)" [required]="field.required"/>
</div> </div>
</ng-container> </ng-container>
</div> </div>

View File

@ -23,9 +23,9 @@ export class DynamicFormFieldComponent {
constructor(private route: ActivatedRoute) { } constructor(private route: ActivatedRoute) { }
ngOnChanges(changeRecord) { ngOnChanges(changeRecord) {
} }
get isValid() { get isValid() {
return this.form.controls[this.field.key].valid; return this.form.controls[this.field.key].valid;
@ -43,13 +43,14 @@ export class DynamicFormFieldComponent {
public ngOnInit() { //dropdown lists take only one of the available sources public ngOnInit() { //dropdown lists take only one of the available sources
for (var i = 0, len = this.dataModel.groups.length; i < len; i++) { for (var i = 0, len = this.dataModel.groups.length; i < len; i++) {
let dropdownField: any; let dropdownField: any;
dropdownField = this.dataModel.groups[i].groupFields.find(x => x.controlType == "dropdown"); dropdownField = this.dataModel.groups[i].groupFields.find(x => x.controlType == "dropdown");
if (dropdownField != undefined) { if (dropdownField != undefined) {
if (dropdownField.attributes.sources != undefined) if (dropdownField.attributes.sources != undefined)
dropdownField.options = dropdownField.attributes.sources[0].params; dropdownField.options = dropdownField.attributes.sources[0].params;
} }
// this.toggleVisibility(null,this.field, null) to do
} }
this.toggleVisibility(null, this.field, this.field.controlType == "checkbox")
this.route.fragment.subscribe(fragment => { this.fragment = fragment; }); //navigate to certain section of the page this.route.fragment.subscribe(fragment => { this.fragment = fragment; }); //navigate to certain section of the page
} }
@ -70,6 +71,7 @@ export class DynamicFormFieldComponent {
} }
FieldValueRuleMethod(field, rule) { //fieldValue rule -- checks the value of target and apply rules, at the same time when the field becomes visible FieldValueRuleMethod(field, rule) { //fieldValue rule -- checks the value of target and apply rules, at the same time when the field becomes visible
var targetField = this.dataModel.getFieldByKey(rule._target); //calling the AddvalidationRules we apply the validation rules for the new field var targetField = this.dataModel.getFieldByKey(rule._target); //calling the AddvalidationRules we apply the validation rules for the new field
var fieldValue = this.form.get(field.key).value;//to do: change field.value
if (rule._ruleStyle == "range") { if (rule._ruleStyle == "range") {
if (parseInt(rule._from) < parseInt(field.value) && parseInt(field.value) < parseInt(rule._to)) { if (parseInt(rule._from) < parseInt(field.value) && parseInt(field.value) < parseInt(rule._to)) {
console.log("visible" + field.value) console.log("visible" + field.value)
@ -80,9 +82,9 @@ export class DynamicFormFieldComponent {
} }
} }
if (rule._ruleStyle == "boolean") { //boolean Decision field if (rule._ruleStyle == "boolean" && field.value !== undefined) { //boolean Decision field
let ruleValue = rule.value.__text; let ruleValue = rule.value.__text;
if (field.value.value.toString() == ruleValue) { if (field.value.toString() == ruleValue) { //field.value.value.toString() == ruleValue
targetField.visible = true; targetField.visible = true;
this.AddvalidationRules(rule._target); this.AddvalidationRules(rule._target);
} else { } else {
@ -121,12 +123,14 @@ export class DynamicFormFieldComponent {
if (this.form.controls[rule._target].hasError("pattern")) if (this.form.controls[rule._target].hasError("pattern"))
this.form.controls[rule._target].reset(); //the regex error message didn't remove without field reset this.form.controls[rule._target].reset(); //the regex error message didn't remove without field reset
this.form.controls[rule._target].clearValidators(); // when a field is hidden must clear the validators and the errors this.form.controls[rule._target].clearValidators(); // when a field is hidden must clear the validators and the errors
this.form.controls[rule._target].updateValueAndValidity(); this.form.controls[rule._target].updateValueAndValidity();
} }
toggleVisibility(e, field, ckb) { //ckb the checkbox only send this parameter, it's essential to change the field value toggleVisibility(e, field, ckb) { //ckb the checkbox only send this parameter, it's essential to change the field value
if (ckb) if (ckb){
field.value = ckb.checked; if(e) this.form.get(field.key).patchValue(e.target.checked)
field.value = this.form.get(field.key).value;
}
if (field.rules.length != undefined && field.rules.length > 1) if (field.rules.length != undefined && field.rules.length > 1)
field.rules.forEach(rule => { field.rules.forEach(rule => {
if (rule._type == "fieldValue") { if (rule._type == "fieldValue") {
@ -169,5 +173,5 @@ export class DynamicFormFieldComponent {
}; };
} }
} }

View File

@ -5,7 +5,7 @@
<div *ngFor="let group of dataModel.groups"> <!-- All contents in the first page --> <div *ngFor="let group of dataModel.groups"> <!-- All contents in the first page -->
<ul> <ul>
<li> <li>
<a (click)='scrollToElemID(group.key, group.page)'>{{group.title}} {{group.page}}</a> <a (click)='scrollToElemID(group.key, group.page)'>{{group.title}}</a>
<ul *ngFor="let field of group.groupFields"> <ul *ngFor="let field of group.groupFields">
<li *ngIf="field.visible == 'true'"> <li *ngIf="field.visible == 'true'">
<a (click)='scrollToElemID(field.key)'>{{field.label}}</a> <a (click)='scrollToElemID(field.key)'>{{field.label}}</a>

View File

@ -16,7 +16,7 @@ export class TocComponent implements OnInit{
private headers = new Array(); private headers = new Array();
@Output() @Output()
setPage:EventEmitter<string> = new EventEmitter(); setPage:EventEmitter<number> = new EventEmitter();
ngOnInit(){ ngOnInit(){
var len = this.dataModel.groups.length; // I don't use headers , I use datamodel.groupfields var len = this.dataModel.groups.length; // I don't use headers , I use datamodel.groupfields
@ -28,7 +28,7 @@ export class TocComponent implements OnInit{
scrollToElemID(elemID, page){ scrollToElemID(elemID, page){
console.log("going to id:"+elemID) console.log("going to id:"+elemID)
this.setPage.emit(page); // this.setPage.emit(2);
scroll("#"+elemID); scroll("#"+elemID);
} }

View File

@ -122,15 +122,16 @@ export class dataModelBuilder {
private getGroups(fieldGroups: any, fields: any[] , dataValues) { private getGroups(fieldGroups: any, fields: any[] , dataValues) {
let groups: GroupBase<any>[] = []; let groups: GroupBase<any>[] = [];
if (fieldGroups.length > 1) { if (fieldGroups.length > 1) {
fieldGroups.forEach(fieldGroup => { // each fiedgroup fills with its fields from json fieldGroups.forEach(fieldGroup => { // each fiedgroup fills with its fields from json
let newfldGroup = new GroupBase(); let newfldGroup = new GroupBase();
newfldGroup.groupFields = new Array(); newfldGroup.groupFields = new Array();
fields.forEach(field => { fields.forEach(field => {
if (fieldGroup._id == field.group) { if (fieldGroup._id == field.group) {
//if(dataValues[fieldGroup._id][field.key] != undefined) if(dataValues!="")
//field.value = dataValues[fieldGroup._id][field.key].value == undefined ? dataValues[fieldGroup._id][field.key] : dataValues[fieldGroup._id][field.key].value; if(dataValues[fieldGroup._id][field.key] != undefined) // to put values in fields
field.value = dataValues[fieldGroup._id][field.key].value == undefined ? dataValues[fieldGroup._id][field.key] : dataValues[fieldGroup._id][field.key].value;
newfldGroup.groupFields.push(field); newfldGroup.groupFields.push(field);
} else { } else {
//this.dataModel.fields.push(field); //this.dataModel.fields.push(field);
@ -142,6 +143,7 @@ export class dataModelBuilder {
newfldGroup.section = fieldGroup._section; newfldGroup.section = fieldGroup._section;
newfldGroup.style = fieldGroup.visible._style; newfldGroup.style = fieldGroup.visible._style;
newfldGroup.class = fieldGroup.visible._cssclass; newfldGroup.class = fieldGroup.visible._cssclass;
newfldGroup.page = fieldGroup._page;
groups.push(newfldGroup) groups.push(newfldGroup)
}); });
} }

View File

@ -1,18 +1,7 @@
export class PaginationService { export class PaginationService {
getPagination(groups, totalGroups: number, currentPage: number = 1, pageSize: number = 3) { getPagination(groups, totalGroups: number, currentPage: number = 1, pageSize: number = 3) {
// calculate total pages // calculate total pages
let totalPages = Math.ceil(totalGroups / pageSize); let totalPages = Math.ceil(totalGroups / pageSize);
//each group get the number of its page for toc linking
for (var x = 0; x < totalPages ; x++) {
for (var i = 0; i < pageSize; i++) {
if (x==0)
groups[i].page = x+1;
else
groups[i+pageSize].page = x+1;
};
}
let startPage: number, endPage: number; let startPage: number, endPage: number;