From ce004c2e58b7123ea27115ab8efbc88e621e420f Mon Sep 17 00:00:00 2001
From: Giuseppe Digilio <giuseppe.digilio@4science.it>
Date: Mon, 23 Dec 2019 15:10:08 +0100
Subject: [PATCH] Resolve conflict occurred when two or more pagination
components are present in the same page
---
.../shared/pagination/pagination.component.ts | 49 +++++++++++--------
1 file changed, 28 insertions(+), 21 deletions(-)
diff --git a/src/app/shared/pagination/pagination.component.ts b/src/app/shared/pagination/pagination.component.ts
index 014f01f152..9c378d1aff 100644
--- a/src/app/shared/pagination/pagination.component.ts
+++ b/src/app/shared/pagination/pagination.component.ts
@@ -225,10 +225,14 @@ export class PaginationComponent implements OnDestroy, OnInit {
}
/**
+ * @param cdRef
+ * ChangeDetectorRef is a singleton service provided by Angular.
* @param route
* Route is a singleton service provided by Angular.
* @param router
* Router is a singleton service provided by Angular.
+ * @param hostWindowService
+ * the HostWindowService singleton.
*/
constructor(private cdRef: ChangeDetectorRef,
private route: ActivatedRoute,
@@ -243,7 +247,7 @@ export class PaginationComponent implements OnDestroy, OnInit {
* The page being navigated to.
*/
public doPageChange(page: number) {
- this.updateRoute({ page: page.toString() });
+ this.updateRoute({ pageId: this.id, page: page.toString() });
}
/**
@@ -253,7 +257,7 @@ export class PaginationComponent implements OnDestroy, OnInit {
* The page size being navigated to.
*/
public doPageSizeChange(pageSize: number) {
- this.updateRoute({ page: 1, pageSize: pageSize });
+ this.updateRoute({ pageId: this.id, page: 1, pageSize: pageSize });
}
/**
@@ -263,7 +267,7 @@ export class PaginationComponent implements OnDestroy, OnInit {
* The sort direction being navigated to.
*/
public doSortDirectionChange(sortDirection: SortDirection) {
- this.updateRoute({ page: 1, sortDirection: sortDirection });
+ this.updateRoute({ pageId: this.id, page: 1, sortDirection: sortDirection });
}
/**
@@ -273,7 +277,7 @@ export class PaginationComponent implements OnDestroy, OnInit {
* The sort field being navigated to.
*/
public doSortFieldChange(field: string) {
- this.updateRoute({ page: 1, sortField: field });
+ this.updateRoute({ pageId: this.id, page: 1, sortField: field });
}
/**
@@ -413,27 +417,30 @@ export class PaginationComponent implements OnDestroy, OnInit {
* Method to update all pagination variables to the current query parameters
*/
private setFields() {
- // (+) converts string to a number
- const page = this.currentQueryParams.page;
- if (this.currentPage !== +page) {
- this.setPage(+page);
- }
+ // set fields only when page id is the one configured for this pagination instance
+ if (this.currentQueryParams.pageId === this.id) {
+ // (+) converts string to a number
+ const page = this.currentQueryParams.page;
+ if (this.currentPage !== +page) {
+ this.setPage(+page);
+ }
- const pageSize = this.currentQueryParams.pageSize;
- if (this.pageSize !== +pageSize) {
- this.setPageSize(+pageSize);
- }
+ const pageSize = this.currentQueryParams.pageSize;
+ if (this.pageSize !== +pageSize) {
+ this.setPageSize(+pageSize);
+ }
- const sortDirection = this.currentQueryParams.sortDirection;
- if (this.sortDirection !== sortDirection) {
- this.setSortDirection(sortDirection);
- }
+ const sortDirection = this.currentQueryParams.sortDirection;
+ if (this.sortDirection !== sortDirection) {
+ this.setSortDirection(sortDirection);
+ }
- const sortField = this.currentQueryParams.sortField;
- if (this.sortField !== sortField) {
- this.setSortField(sortField);
+ const sortField = this.currentQueryParams.sortField;
+ if (this.sortField !== sortField) {
+ this.setSortField(sortField);
+ }
+ this.cdRef.detectChanges();
}
- this.cdRef.detectChanges();
}
/**
--
GitLab