client/paging: refactor manual pager
This commit is contained in:
parent
0ddbc64320
commit
ef3dc1fa75
1 changed files with 41 additions and 33 deletions
|
@ -10,6 +10,45 @@ function removeConsecutiveDuplicates(a) {
|
|||
});
|
||||
}
|
||||
|
||||
function getVisiblePageNumbers(currentPage, totalPages) {
|
||||
const threshold = 2;
|
||||
let pagesVisible = [];
|
||||
for (let i = 1; i <= threshold; i++) {
|
||||
pagesVisible.push(i);
|
||||
}
|
||||
for (let i = totalPages - threshold; i <= totalPages; i++) {
|
||||
pagesVisible.push(i);
|
||||
}
|
||||
for (let i = currentPage - threshold;
|
||||
i <= currentPage + threshold;
|
||||
i++) {
|
||||
pagesVisible.push(i);
|
||||
}
|
||||
pagesVisible = pagesVisible.filter((item, pos, ary) => {
|
||||
return item >= 1 && item <= totalPages;
|
||||
});
|
||||
pagesVisible = pagesVisible.sort((a, b) => { return a - b; });
|
||||
pagesVisible = removeConsecutiveDuplicates(pagesVisible);
|
||||
return pagesVisible;
|
||||
}
|
||||
|
||||
function getPages(currentPage, pageNumbers, clientUrl) {
|
||||
const pages = [];
|
||||
let lastPage = 0;
|
||||
for (let page of pageNumbers) {
|
||||
if (page !== lastPage + 1) {
|
||||
pages.push({ellipsis: true});
|
||||
}
|
||||
pages.push({
|
||||
number: page,
|
||||
link: clientUrl.format({page: page}),
|
||||
active: currentPage === page,
|
||||
});
|
||||
lastPage = page;
|
||||
}
|
||||
return pages;
|
||||
}
|
||||
|
||||
class ManualPageView {
|
||||
constructor() {
|
||||
this.holderTemplate = views.getTemplate('manual-pager');
|
||||
|
@ -34,39 +73,8 @@ class ManualPageView {
|
|||
ctx.pageRenderer.render(pageRendererCtx);
|
||||
|
||||
const totalPages = Math.ceil(response.total / response.pageSize);
|
||||
const threshold = 2;
|
||||
|
||||
let pagesVisible = [];
|
||||
for (let i = 1; i <= threshold; i++) {
|
||||
pagesVisible.push(i);
|
||||
}
|
||||
for (let i = totalPages - threshold; i <= totalPages; i++) {
|
||||
pagesVisible.push(i);
|
||||
}
|
||||
for (let i = currentPage - threshold;
|
||||
i <= currentPage + threshold;
|
||||
i++) {
|
||||
pagesVisible.push(i);
|
||||
}
|
||||
pagesVisible = pagesVisible.filter((item, pos, ary) => {
|
||||
return item >= 1 && item <= totalPages;
|
||||
});
|
||||
pagesVisible = pagesVisible.sort((a, b) => { return a - b; });
|
||||
pagesVisible = removeConsecutiveDuplicates(pagesVisible);
|
||||
|
||||
const pages = [];
|
||||
let lastPage = 0;
|
||||
for (let page of pagesVisible) {
|
||||
if (page !== lastPage + 1) {
|
||||
pages.push({ellipsis: true});
|
||||
}
|
||||
pages.push({
|
||||
number: page,
|
||||
link: ctx.clientUrl.format({page: page}),
|
||||
active: currentPage === page,
|
||||
});
|
||||
lastPage = page;
|
||||
}
|
||||
const pageNumbers = getVisiblePageNumbers(currentPage, totalPages);
|
||||
const pages = getPages(currentPage, pageNumbers, ctx.clientUrl);
|
||||
|
||||
if (response.total) {
|
||||
views.showView(pageNav, this.navTemplate({
|
||||
|
|
Loading…
Reference in a new issue