MaDgiK-CITE
/
argos
13
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

Changes to page handling

This commit is contained in:
krommydas kyriakos 2017-12-11 16:21:49 +02:00
parent e069a14b55
commit ed88e8a125
2 changed files with 31 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
dmp-frontend/src/app/form/dynamic-form.component.html
View File

@ -9,7 +9,7 @@
<button type="button" 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>
<p-steps [model]="stepperItems" [activeIndex]="this.currentPageIndex" (activeIndexChange)="changePageIndex($event)" [readonly]="false"></p-steps>
</div>
<div class="ui-g-12">
<progress-bar *ngIf="form" [formGroup]="form"></progress-bar>

46
dmp-frontend/src/app/form/dynamic-form.component.ts
View File

@ -61,13 +61,13 @@ export class DynamicFormComponent implements OnInit {
id: string;
datasetId: string;
pathName: string;
pages: Set<number>;
pages: Array<number>;
stepperItems: MenuItem[] = new Array<MenuItem>();
activeStepperIndex: number = 1;
visibleSidebar: boolean = false;
private progressbar: boolean = false;
private currentPage: number = 0;
private currentPageIndex: number = 0;
private fragment: string;
constructor(private serverService: ServerService, private router: Router, private pdfService: PDFService,
@ -86,8 +86,8 @@ export class DynamicFormComponent implements OnInit {
this.serverService.getSingleDataset(this.datasetId).subscribe(
response => {
this.dataModel = new JsonSerializer<DatasetModel>().fromJSONObject(response, DatasetModel);
this.pages = this.getPages(this.dataModel);
this.dataModel = new JsonSerializer<DatasetModel>().fromJSONObject(response, DatasetModel);
this.pages = this.getPages(this.dataModel);
this.createPagination();
this.form = this.dataModel.buildForm();
this.visibilityRulesService.formGroup = this.form;
@ -96,15 +96,18 @@ export class DynamicFormComponent implements OnInit {
this.progressbar = true;
this.route.fragment.subscribe((fragment: string) => {
if (fragment && document.querySelector('#' + fragment)) {
document.querySelector('#' + fragment).scrollIntoView();
this.visibleSidebar = true;
if (fragment && document.querySelector('#' + fragment)) {
;//this.adjustScrolling(<HTMLElement>document.querySelector('#' + fragment));
// this.visibleSidebar = true;
}
});
this.route.queryParams.subscribe((params) => {
if (params && "page" in params && !isNaN(params["page"]))
this.currentPage = Number.parseInt(params["page"]);
if (params && "page" in params && !isNaN(params["page"]))
{
var page = Number.parseInt(params["page"]);
this.currentPageIndex = this.pages.indexOf(page);
}
//this.visibleSidebar = true;
});
},
@ -132,16 +135,18 @@ export class DynamicFormComponent implements OnInit {
this.visibleSidebar = !this.visibleSidebar;
}
getPages(model: DatasetModel): Set<number> {
let pageSet = new Set<number>();
model.sections.forEach(section => {
pageSet.add(section.page);
})
return pageSet;
getPages(model: DatasetModel): Array<number> {
let pageSet = new Set<number>();
model.sections.forEach(section => {
pageSet.add(section.page);
});
return Array.from(pageSet).sort((a, b) => a - b);
}
shouldDisplaySection(section: Section): Boolean {
return (section.page - 1) == this.currentPage;
return (section.page) == this.pages[this.currentPageIndex];
}
createPagination() {
@ -151,6 +156,15 @@ export class DynamicFormComponent implements OnInit {
})
});
}
changePageIndex(index: any) {
this.router.navigate([this.route.snapshot.url[0] + "/" + this.route.snapshot.url[1]], { queryParams: { page: this.pages[index] } });
}
adjustScrolling(topElement: HTMLElement) {
var scrollElement = document.querySelector('#scrollContainer').parentElement;
scrollElement.scrollTop = topElement.offsetTop;
}
/* scrollToElemID(elemID) {
scroll("#" + elemID);
}