page.ejs 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. <nav aria-label="Page navigation example">
  2. <ul class="pagination pagination-sm"></ul>
  3. </nav>
  4. <script type="text/javascript" src="/public/js/bootstrap/bootstrap-paginator.js"></script>
  5. <script type="text/javascript">
  6. let options = {
  7. bootstrapMajorVersion: 4,
  8. currentPage: "<%= pageInfo.page %>",
  9. totalPages: "<%= pageInfo.total %>",
  10. numberOfPages: 5,
  11. size: "small",
  12. itemContainerClass: function(type, page, current) {
  13. let className = 'page-item';
  14. this.currentPage = parseInt(this.currentPage);
  15. this.totalPages = parseInt(this.totalPages);
  16. switch (type) {
  17. case "first":
  18. className = this.currentPage === 1 ? className + ' disabled' : className;
  19. break;
  20. case "prev":
  21. className = this.currentPage === 1 ? className + ' disabled' : className;
  22. break;
  23. case "next":
  24. className = this.currentPage === this.totalPages ? className + ' disabled' : className;
  25. break;
  26. case "last":
  27. className = this.currentPage === this.totalPages ? className + ' disabled' : className;
  28. break;
  29. case "page":
  30. className = page === this.currentPage ? className + ' active' : className;
  31. break;
  32. }
  33. return className;
  34. },
  35. itemContentClass: function(type, page, current) {
  36. return 'page-link';
  37. },
  38. itemTexts: function(type, page, current) {
  39. switch (type) {
  40. case "first":
  41. return '<i class="fa fa-caret-left"></i>';
  42. case "prev":
  43. return '<i class="fa fa-angle-left"></i>';
  44. case "next":
  45. return '<i class="fa fa-angle-right"></i>';
  46. case "last":
  47. return '<i class="fa fa-caret-right"></i>';
  48. case "page":
  49. return page;
  50. case "more":
  51. return '...';
  52. }
  53. },
  54. shouldShowPage: function (type, page, current) {
  55. let result = true;
  56. switch (type) {
  57. case "first":
  58. break;
  59. case "prev":
  60. break;
  61. case "next":
  62. break;
  63. case "last":
  64. break;
  65. case "page":
  66. break;
  67. case "more":
  68. result = (page !== this.totalPages);
  69. break;
  70. }
  71. return result;
  72. },
  73. pageUrl: function(type, page, current){
  74. let queryData = JSON.parse('<%- pageInfo.queryData %>');
  75. // 如果没有附带查询条件则直接返回
  76. if (Object.keys(queryData).length <= 0) {
  77. return "?page=" + page;
  78. }
  79. // 有其它数据则重新赋值page,然后组合字符串
  80. queryData.page = page;
  81. let queryArray = [];
  82. for(let tmp in queryData) {
  83. let tempString = tmp + '=' + queryData[tmp];
  84. queryArray.push(tempString);
  85. }
  86. let firstQuery = queryArray.shift();
  87. let queryString = queryArray.join('&');
  88. return queryString === '' ? '?' + firstQuery : '?' + firstQuery + '&' + queryString;
  89. }
  90. };
  91. if (options.totalPages > 1) {
  92. $(".pagination").bootstrapPaginator(options);
  93. } else {
  94. $(".pagination").hide();
  95. }
  96. </script>