github/docker-registry-ui
1
0
Fork 0
mirror of https://github.com/Joxit/docker-registry-ui.git synced 2026-07-28 09:51:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(pagination): Identify the current page

Browse Source
This commit is contained in:
Joxit
2019-05-31 00:44:29 +02:00
parent 3399030e4e
commit 0199f87087
4 changed files with 12 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/scripts/utils.js
View File

@@ -88,7 +88,7 @@ registryUI.getPageLabels = function(page, nPages) {
pageLabels.push({'icon': 'chevron_left', page: page - 1});
}
for (var i = Math.max(1, page - maxItems); i <= Math.min(nPages, page + maxItems); i++) {
pageLabels.push({page: i});
pageLabels.push({page: i, current: i === page + 1});
}
if (page !== nPages && nPages >= maxItems) {
pageLabels.push({'icon': 'chevron_right', page: nPages});

4
src/style.css
View File

@@ -525,4 +525,8 @@ material-checkbox .checkbox.checked {
pagination material-button {
padding: 0.2em 0.75em;
}
pagination material-button.current {
border: 1px solid rgba(0, 0, 0, .12);
}

2
src/tags/pagination.tag
View File

@@ -18,7 +18,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
<!-- Begin of tag -->
<div class="conatianer">
<div class="pagination-centered">
<material-button waves-color="rgba(158,158,158,.4)" each="{p in this.opts.pages}">
<material-button waves-color="rgba(158,158,158,.4)" each="{p in this.opts.pages}" class="{ current: p.current }">
<i show="{ p.icon }" class="material-icons">{ p.icon }</i>
<div hide="{ p.icon }">{ p.page }</div>
</material-button>

9
src/tags/taglist.tag
View File

@@ -30,8 +30,11 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
<div hide="{ registryUI.taglist.loadend }" class="spinner-wrapper">
<material-spinner></material-spinner>
</div>
<pagination pages="{ registryUI.getPageLabels(this.page, registryUI.getNumPages(registryUI.taglist.tags))}"></pagination>
<material-card ref="taglist-tag" class="taglist" multi-delete={ this.multiDelete } tags={ registryUI.getPage(registryUI.taglist.tags, this.page) } show="{ registryUI.taglist.loadend }" >
<pagination pages="{ registryUI.getPageLabels(this.page, registryUI.getNumPages(registryUI.taglist.tags)) }"></pagination>
<material-card ref="taglist-tag" class="taglist"
multi-delete={ this.multiDelete }
tags={ registryUI.getPage(registryUI.taglist.tags, this.page) }
show="{ registryUI.taglist.loadend }">
<table show="{ registryUI.taglist.loadend }" style="border: none;">
<thead>
<tr>
@@ -77,7 +80,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
</tbody>
</table>
</material-card>
<pagination pages="{ registryUI.getPageLabels(this.page, registryUI.getNumPages(registryUI.taglist.tags))}"></pagination>
<pagination pages="{ registryUI.getPageLabels(this.page, registryUI.getNumPages(registryUI.taglist.tags)) }"></pagination>
<script>
var self = registryUI.taglist.instance = this;
self.page = 0;