mirror of
https://github.com/goharbor/harbor.git
synced 2024-12-23 09:08:26 +01:00
updates paginator with following the restriction mode
This commit is contained in:
parent
d4035e0ec3
commit
066d108012
@ -48,7 +48,7 @@
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<paginator class="pull-right" total-count="//vm.totalCount//" page-size="//vm.pageSize//" page="vm.page" display-count="3"></paginator>
|
||||
<paginator class="pull-right" total-count="//vm.totalCount//" page-size="//vm.pageSize//" page="vm.page" display-count="2"></paginator>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -53,7 +53,7 @@
|
||||
};
|
||||
|
||||
vm.page = 1;
|
||||
vm.pageSize = 2;
|
||||
vm.pageSize = 1;
|
||||
|
||||
$scope.$watch('vm.totalCount', function(current) {
|
||||
if(current) {
|
||||
|
@ -32,7 +32,7 @@
|
||||
return directive;
|
||||
|
||||
function link(scope, element, attrs, ctrl) {
|
||||
|
||||
|
||||
scope.$watch('vm.totalCount', function(current) {
|
||||
if(current) {
|
||||
var totalCount = current;
|
||||
@ -40,54 +40,10 @@
|
||||
var displayCount = parseInt(ctrl.displayCount);
|
||||
|
||||
console.log('Total Count:' + totalCount + ', Page Size:' + pageSize + ', Display Count:' + displayCount);
|
||||
|
||||
var TimeCounter = function() {
|
||||
this.time = 0;
|
||||
this.minimum = 0;
|
||||
this.maximum = 0;
|
||||
}
|
||||
|
||||
TimeCounter.prototype.setMaximum = function(maximum) {
|
||||
this.maximum = maximum;
|
||||
}
|
||||
|
||||
TimeCounter.prototype.increment = function() {
|
||||
if(this.time < this.maximum) {
|
||||
++this.time;
|
||||
++ctrl.page;
|
||||
}
|
||||
scope.$apply();
|
||||
}
|
||||
|
||||
TimeCounter.prototype.canIncrement = function() {
|
||||
if(this.time < this.maximum) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
TimeCounter.prototype.decrement = function() {
|
||||
if(this.time > this.minimum) {
|
||||
--this.time;
|
||||
--ctrl.page;
|
||||
}
|
||||
scope.$apply();
|
||||
}
|
||||
|
||||
TimeCounter.prototype.canDecrement = function() {
|
||||
if(this.time > this.minimum) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
TimeCounter.prototype.getTime = function() {
|
||||
return this.time;
|
||||
}
|
||||
|
||||
|
||||
var buttonCount = Math.ceil(totalCount / pageSize);
|
||||
var tc = new TimeCounter();
|
||||
|
||||
ctrl.buttonCount = buttonCount;
|
||||
|
||||
if(buttonCount <= displayCount) {
|
||||
tc.setMaximum(0);
|
||||
}else{
|
||||
@ -97,20 +53,6 @@
|
||||
element.find('ul li:first a').on('click', previous);
|
||||
element.find('ul li:last a').on('click', next);
|
||||
|
||||
var drawButtons = function(time) {
|
||||
element.find('li[tag="pagination-button"]').remove();
|
||||
var buttons = [];
|
||||
for(var i = 1; i <= displayCount; i++) {
|
||||
var displayNumber = displayCount * time + i;
|
||||
if(displayNumber <= buttonCount) {
|
||||
buttons.push('<li tag="pagination-button"><a href="javascript:void(0)" page="' + displayNumber + '">' + displayNumber + '</a></li>');
|
||||
}
|
||||
}
|
||||
$(buttons.join(''))
|
||||
.insertAfter(element.find('ul li:eq(0)')).end()
|
||||
.on('click', buttonClickHandler);
|
||||
}
|
||||
|
||||
drawButtons(tc.getTime());
|
||||
|
||||
togglePrevious(tc.canDecrement());
|
||||
@ -118,54 +60,115 @@
|
||||
|
||||
togglePageButton();
|
||||
|
||||
function togglePrevious(status) {
|
||||
if(status){
|
||||
element.find('ul li:first').removeClass('disabled');
|
||||
}else{
|
||||
element.find('ul li:first').addClass('disabled');
|
||||
}
|
||||
}
|
||||
|
||||
function toggleNext(status) {
|
||||
if(status) {
|
||||
element.find('ul li:last').removeClass('disabled');
|
||||
}else{
|
||||
element.find('ul li:last').addClass('disabled');
|
||||
}
|
||||
}
|
||||
|
||||
function buttonClickHandler(e) {
|
||||
ctrl.page = $(e.target).attr('page');
|
||||
togglePageButton();
|
||||
togglePrevious(tc.canDecrement());
|
||||
toggleNext(tc.canIncrement());
|
||||
scope.$apply();
|
||||
}
|
||||
|
||||
function togglePageButton() {
|
||||
element.find('li[tag="pagination-button"]').removeClass('active');
|
||||
element.find('li[tag="pagination-button"] a[page="' + ctrl.page + '"]').parent().addClass('active');
|
||||
}
|
||||
|
||||
function previous() {
|
||||
if(tc.canDecrement()) {
|
||||
tc.decrement();
|
||||
drawButtons(tc.getTime());
|
||||
element.find('li[tag="pagination-button"] a[page="' + ctrl.page + '"]').trigger('click');
|
||||
}
|
||||
scope.$apply();
|
||||
}
|
||||
|
||||
function next() {
|
||||
if(tc.canIncrement()) {
|
||||
tc.increment();
|
||||
drawButtons(tc.getTime());
|
||||
element.find('li[tag="pagination-button"] a[page="' + ctrl.page + '"]').trigger('click');
|
||||
}
|
||||
scope.$apply();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
var TimeCounter = function() {
|
||||
this.time = 0;
|
||||
this.minimum = 0;
|
||||
this.maximum = 0;
|
||||
}
|
||||
|
||||
TimeCounter.prototype.setMaximum = function(maximum) {
|
||||
this.maximum = maximum;
|
||||
}
|
||||
|
||||
TimeCounter.prototype.increment = function() {
|
||||
if(this.time < this.maximum) {
|
||||
++this.time;
|
||||
++ctrl.page;
|
||||
}
|
||||
scope.$apply();
|
||||
}
|
||||
|
||||
TimeCounter.prototype.canIncrement = function() {
|
||||
if(this.time < this.maximum) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
TimeCounter.prototype.decrement = function() {
|
||||
if(this.time > this.minimum) {
|
||||
--this.time;
|
||||
--ctrl.page;
|
||||
}
|
||||
scope.$apply();
|
||||
}
|
||||
|
||||
TimeCounter.prototype.canDecrement = function() {
|
||||
if(this.time > this.minimum) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
TimeCounter.prototype.getTime = function() {
|
||||
return this.time;
|
||||
}
|
||||
|
||||
var tc = new TimeCounter();
|
||||
|
||||
function drawButtons(time, displayCount, buttonCount) {
|
||||
element.find('li[tag="pagination-button"]').remove();
|
||||
var buttons = [];
|
||||
for(var i = 1; i <= ctrl.displayCount; i++) {
|
||||
var displayNumber = ctrl.displayCount * time + i;
|
||||
if(displayNumber <= ctrl.buttonCount) {
|
||||
buttons.push('<li tag="pagination-button"><a href="javascript:void(0)" page="' + displayNumber + '">' + displayNumber + '<span class="sr-only"></span></a></li>');
|
||||
}
|
||||
}
|
||||
$(buttons.join(''))
|
||||
.insertAfter(element.find('ul li:eq(0)')).end()
|
||||
.on('click', buttonClickHandler);
|
||||
}
|
||||
|
||||
function togglePrevious(status) {
|
||||
if(status){
|
||||
element.find('ul li:first').removeClass('disabled');
|
||||
}else{
|
||||
element.find('ul li:first').addClass('disabled');
|
||||
}
|
||||
}
|
||||
|
||||
function toggleNext(status) {
|
||||
if(status) {
|
||||
element.find('ul li:last').removeClass('disabled');
|
||||
}else{
|
||||
element.find('ul li:last').addClass('disabled');
|
||||
}
|
||||
}
|
||||
|
||||
function buttonClickHandler(e) {
|
||||
ctrl.page = $(e.target).attr('page');
|
||||
togglePageButton();
|
||||
togglePrevious(tc.canDecrement());
|
||||
toggleNext(tc.canIncrement());
|
||||
scope.$apply();
|
||||
}
|
||||
|
||||
function togglePageButton() {
|
||||
element.find('li[tag="pagination-button"]').removeClass('active');
|
||||
element.find('li[tag="pagination-button"] a[page="' + ctrl.page + '"]').parent().addClass('active');
|
||||
}
|
||||
|
||||
function previous() {
|
||||
if(tc.canDecrement()) {
|
||||
tc.decrement();
|
||||
drawButtons(tc.getTime());
|
||||
element.find('li[tag="pagination-button"] a[page="' + ctrl.page + '"]').trigger('click');
|
||||
}
|
||||
scope.$apply();
|
||||
}
|
||||
|
||||
function next() {
|
||||
if(tc.canIncrement()) {
|
||||
tc.increment();
|
||||
drawButtons(tc.getTime());
|
||||
element.find('li[tag="pagination-button"] a[page="' + ctrl.page + '"]').trigger('click');
|
||||
}
|
||||
scope.$apply();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user