Pagination.js 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. Object.defineProperty(exports, "__esModule", {
  4. value: true
  5. });
  6. exports.default = void 0;
  7. var _vue = require("vue");
  8. var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
  9. var _vueTypes = _interopRequireDefault(require("../_util/vue-types"));
  10. var _BaseMixin = _interopRequireDefault(require("../_util/BaseMixin"));
  11. var _propsUtil = require("../_util/props-util");
  12. var _Pager = _interopRequireDefault(require("./Pager"));
  13. var _Options = _interopRequireDefault(require("./Options"));
  14. var _zh_CN = _interopRequireDefault(require("./locale/zh_CN"));
  15. var _KeyCode = _interopRequireDefault(require("./KeyCode"));
  16. var _classNames = _interopRequireDefault(require("../_util/classNames"));
  17. var _vnode = require("../_util/vnode");
  18. var _firstNotUndefined = _interopRequireDefault(require("../_util/firstNotUndefined"));
  19. var _BaseInput = _interopRequireDefault(require("../_util/BaseInput"));
  20. var __rest = void 0 && (void 0).__rest || function (s, e) {
  21. var t = {};
  22. for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  23. if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
  24. if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  25. }
  26. return t;
  27. };
  28. // 是否是正整数
  29. function isInteger(value) {
  30. return typeof value === 'number' && isFinite(value) && Math.floor(value) === value;
  31. }
  32. function defaultItemRender(_ref) {
  33. let {
  34. originalElement
  35. } = _ref;
  36. return originalElement;
  37. }
  38. function calculatePage(p, state, props) {
  39. const pageSize = typeof p === 'undefined' ? state.statePageSize : p;
  40. return Math.floor((props.total - 1) / pageSize) + 1;
  41. }
  42. var _default = exports.default = (0, _vue.defineComponent)({
  43. compatConfig: {
  44. MODE: 3
  45. },
  46. name: 'Pagination',
  47. mixins: [_BaseMixin.default],
  48. inheritAttrs: false,
  49. props: {
  50. disabled: {
  51. type: Boolean,
  52. default: undefined
  53. },
  54. prefixCls: _vueTypes.default.string.def('rc-pagination'),
  55. selectPrefixCls: _vueTypes.default.string.def('rc-select'),
  56. current: Number,
  57. defaultCurrent: _vueTypes.default.number.def(1),
  58. total: _vueTypes.default.number.def(0),
  59. pageSize: Number,
  60. defaultPageSize: _vueTypes.default.number.def(10),
  61. hideOnSinglePage: {
  62. type: Boolean,
  63. default: false
  64. },
  65. showSizeChanger: {
  66. type: Boolean,
  67. default: undefined
  68. },
  69. showLessItems: {
  70. type: Boolean,
  71. default: false
  72. },
  73. // showSizeChange: PropTypes.func.def(noop),
  74. selectComponentClass: _vueTypes.default.any,
  75. showPrevNextJumpers: {
  76. type: Boolean,
  77. default: true
  78. },
  79. showQuickJumper: _vueTypes.default.oneOfType([_vueTypes.default.looseBool, _vueTypes.default.object]).def(false),
  80. showTitle: {
  81. type: Boolean,
  82. default: true
  83. },
  84. pageSizeOptions: _vueTypes.default.arrayOf(_vueTypes.default.oneOfType([_vueTypes.default.number, _vueTypes.default.string])),
  85. buildOptionText: Function,
  86. showTotal: Function,
  87. simple: {
  88. type: Boolean,
  89. default: undefined
  90. },
  91. locale: _vueTypes.default.object.def(_zh_CN.default),
  92. itemRender: _vueTypes.default.func.def(defaultItemRender),
  93. prevIcon: _vueTypes.default.any,
  94. nextIcon: _vueTypes.default.any,
  95. jumpPrevIcon: _vueTypes.default.any,
  96. jumpNextIcon: _vueTypes.default.any,
  97. totalBoundaryShowSizeChanger: _vueTypes.default.number.def(50)
  98. },
  99. data() {
  100. const props = this.$props;
  101. let current = (0, _firstNotUndefined.default)([this.current, this.defaultCurrent]);
  102. const pageSize = (0, _firstNotUndefined.default)([this.pageSize, this.defaultPageSize]);
  103. current = Math.min(current, calculatePage(pageSize, undefined, props));
  104. return {
  105. stateCurrent: current,
  106. stateCurrentInputValue: current,
  107. statePageSize: pageSize
  108. };
  109. },
  110. watch: {
  111. current(val) {
  112. this.setState({
  113. stateCurrent: val,
  114. stateCurrentInputValue: val
  115. });
  116. },
  117. pageSize(val) {
  118. const newState = {};
  119. let current = this.stateCurrent;
  120. const newCurrent = calculatePage(val, this.$data, this.$props);
  121. current = current > newCurrent ? newCurrent : current;
  122. if (!(0, _propsUtil.hasProp)(this, 'current')) {
  123. newState.stateCurrent = current;
  124. newState.stateCurrentInputValue = current;
  125. }
  126. newState.statePageSize = val;
  127. this.setState(newState);
  128. },
  129. stateCurrent(_val, oldValue) {
  130. // When current page change, fix focused style of prev item
  131. // A hacky solution of https://github.com/ant-design/ant-design/issues/8948
  132. this.$nextTick(() => {
  133. if (this.$refs.paginationNode) {
  134. const lastCurrentNode = this.$refs.paginationNode.querySelector(`.${this.prefixCls}-item-${oldValue}`);
  135. if (lastCurrentNode && document.activeElement === lastCurrentNode) {
  136. lastCurrentNode.blur();
  137. }
  138. }
  139. });
  140. },
  141. total() {
  142. const newState = {};
  143. const newCurrent = calculatePage(this.pageSize, this.$data, this.$props);
  144. if ((0, _propsUtil.hasProp)(this, 'current')) {
  145. const current = Math.min(this.current, newCurrent);
  146. newState.stateCurrent = current;
  147. newState.stateCurrentInputValue = current;
  148. } else {
  149. let current = this.stateCurrent;
  150. if (current === 0 && newCurrent > 0) {
  151. current = 1;
  152. } else {
  153. current = Math.min(this.stateCurrent, newCurrent);
  154. }
  155. newState.stateCurrent = current;
  156. }
  157. this.setState(newState);
  158. }
  159. },
  160. methods: {
  161. getJumpPrevPage() {
  162. return Math.max(1, this.stateCurrent - (this.showLessItems ? 3 : 5));
  163. },
  164. getJumpNextPage() {
  165. return Math.min(calculatePage(undefined, this.$data, this.$props), this.stateCurrent + (this.showLessItems ? 3 : 5));
  166. },
  167. getItemIcon(icon, label) {
  168. const {
  169. prefixCls
  170. } = this.$props;
  171. const iconNode = (0, _propsUtil.getComponent)(this, icon, this.$props) || (0, _vue.createVNode)("button", {
  172. "type": "button",
  173. "aria-label": label,
  174. "class": `${prefixCls}-item-link`
  175. }, null);
  176. return iconNode;
  177. },
  178. getValidValue(e) {
  179. const inputValue = e.target.value;
  180. const allPages = calculatePage(undefined, this.$data, this.$props);
  181. const {
  182. stateCurrentInputValue
  183. } = this.$data;
  184. let value;
  185. if (inputValue === '') {
  186. value = inputValue;
  187. } else if (isNaN(Number(inputValue))) {
  188. value = stateCurrentInputValue;
  189. } else if (inputValue >= allPages) {
  190. value = allPages;
  191. } else {
  192. value = Number(inputValue);
  193. }
  194. return value;
  195. },
  196. isValid(page) {
  197. return isInteger(page) && page !== this.stateCurrent;
  198. },
  199. shouldDisplayQuickJumper() {
  200. const {
  201. showQuickJumper,
  202. pageSize,
  203. total
  204. } = this.$props;
  205. if (total <= pageSize) {
  206. return false;
  207. }
  208. return showQuickJumper;
  209. },
  210. // calculatePage (p) {
  211. // let pageSize = p
  212. // if (typeof pageSize === 'undefined') {
  213. // pageSize = this.statePageSize
  214. // }
  215. // return Math.floor((this.total - 1) / pageSize) + 1
  216. // },
  217. handleKeyDown(event) {
  218. if (event.keyCode === _KeyCode.default.ARROW_UP || event.keyCode === _KeyCode.default.ARROW_DOWN) {
  219. event.preventDefault();
  220. }
  221. },
  222. handleKeyUp(e) {
  223. const value = this.getValidValue(e);
  224. const stateCurrentInputValue = this.stateCurrentInputValue;
  225. if (value !== stateCurrentInputValue) {
  226. this.setState({
  227. stateCurrentInputValue: value
  228. });
  229. }
  230. if (e.keyCode === _KeyCode.default.ENTER) {
  231. this.handleChange(value);
  232. } else if (e.keyCode === _KeyCode.default.ARROW_UP) {
  233. this.handleChange(value - 1);
  234. } else if (e.keyCode === _KeyCode.default.ARROW_DOWN) {
  235. this.handleChange(value + 1);
  236. }
  237. },
  238. changePageSize(size) {
  239. let current = this.stateCurrent;
  240. const preCurrent = current;
  241. const newCurrent = calculatePage(size, this.$data, this.$props);
  242. current = current > newCurrent ? newCurrent : current;
  243. // fix the issue:
  244. // Once 'total' is 0, 'current' in 'onShowSizeChange' is 0, which is not correct.
  245. if (newCurrent === 0) {
  246. current = this.stateCurrent;
  247. }
  248. if (typeof size === 'number') {
  249. if (!(0, _propsUtil.hasProp)(this, 'pageSize')) {
  250. this.setState({
  251. statePageSize: size
  252. });
  253. }
  254. if (!(0, _propsUtil.hasProp)(this, 'current')) {
  255. this.setState({
  256. stateCurrent: current,
  257. stateCurrentInputValue: current
  258. });
  259. }
  260. }
  261. this.__emit('update:pageSize', size);
  262. if (current !== preCurrent) {
  263. this.__emit('update:current', current);
  264. }
  265. this.__emit('showSizeChange', current, size);
  266. this.__emit('change', current, size);
  267. },
  268. handleChange(p) {
  269. const {
  270. disabled
  271. } = this.$props;
  272. let page = p;
  273. if (this.isValid(page) && !disabled) {
  274. const currentPage = calculatePage(undefined, this.$data, this.$props);
  275. if (page > currentPage) {
  276. page = currentPage;
  277. } else if (page < 1) {
  278. page = 1;
  279. }
  280. if (!(0, _propsUtil.hasProp)(this, 'current')) {
  281. this.setState({
  282. stateCurrent: page,
  283. stateCurrentInputValue: page
  284. });
  285. }
  286. // this.__emit('input', page)
  287. this.__emit('update:current', page);
  288. this.__emit('change', page, this.statePageSize);
  289. return page;
  290. }
  291. return this.stateCurrent;
  292. },
  293. prev() {
  294. if (this.hasPrev()) {
  295. this.handleChange(this.stateCurrent - 1);
  296. }
  297. },
  298. next() {
  299. if (this.hasNext()) {
  300. this.handleChange(this.stateCurrent + 1);
  301. }
  302. },
  303. jumpPrev() {
  304. this.handleChange(this.getJumpPrevPage());
  305. },
  306. jumpNext() {
  307. this.handleChange(this.getJumpNextPage());
  308. },
  309. hasPrev() {
  310. return this.stateCurrent > 1;
  311. },
  312. hasNext() {
  313. return this.stateCurrent < calculatePage(undefined, this.$data, this.$props);
  314. },
  315. getShowSizeChanger() {
  316. const {
  317. showSizeChanger,
  318. total,
  319. totalBoundaryShowSizeChanger
  320. } = this.$props;
  321. if (typeof showSizeChanger !== 'undefined') {
  322. return showSizeChanger;
  323. }
  324. return total > totalBoundaryShowSizeChanger;
  325. },
  326. runIfEnter(event, callback) {
  327. if (event.key === 'Enter' || event.charCode === 13) {
  328. event.preventDefault();
  329. for (var _len = arguments.length, restParams = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
  330. restParams[_key - 2] = arguments[_key];
  331. }
  332. callback(...restParams);
  333. }
  334. },
  335. runIfEnterPrev(event) {
  336. this.runIfEnter(event, this.prev);
  337. },
  338. runIfEnterNext(event) {
  339. this.runIfEnter(event, this.next);
  340. },
  341. runIfEnterJumpPrev(event) {
  342. this.runIfEnter(event, this.jumpPrev);
  343. },
  344. runIfEnterJumpNext(event) {
  345. this.runIfEnter(event, this.jumpNext);
  346. },
  347. handleGoTO(event) {
  348. if (event.keyCode === _KeyCode.default.ENTER || event.type === 'click') {
  349. this.handleChange(this.stateCurrentInputValue);
  350. }
  351. },
  352. renderPrev(prevPage) {
  353. const {
  354. itemRender
  355. } = this.$props;
  356. const prevButton = itemRender({
  357. page: prevPage,
  358. type: 'prev',
  359. originalElement: this.getItemIcon('prevIcon', 'prev page')
  360. });
  361. const disabled = !this.hasPrev();
  362. return (0, _propsUtil.isValidElement)(prevButton) ? (0, _vnode.cloneElement)(prevButton, disabled ? {
  363. disabled
  364. } : {}) : prevButton;
  365. },
  366. renderNext(nextPage) {
  367. const {
  368. itemRender
  369. } = this.$props;
  370. const nextButton = itemRender({
  371. page: nextPage,
  372. type: 'next',
  373. originalElement: this.getItemIcon('nextIcon', 'next page')
  374. });
  375. const disabled = !this.hasNext();
  376. return (0, _propsUtil.isValidElement)(nextButton) ? (0, _vnode.cloneElement)(nextButton, disabled ? {
  377. disabled
  378. } : {}) : nextButton;
  379. }
  380. },
  381. render() {
  382. const {
  383. prefixCls,
  384. disabled,
  385. hideOnSinglePage,
  386. total,
  387. locale,
  388. showQuickJumper,
  389. showLessItems,
  390. showTitle,
  391. showTotal,
  392. simple,
  393. itemRender,
  394. showPrevNextJumpers,
  395. jumpPrevIcon,
  396. jumpNextIcon,
  397. selectComponentClass,
  398. selectPrefixCls,
  399. pageSizeOptions
  400. } = this.$props;
  401. const {
  402. stateCurrent,
  403. statePageSize
  404. } = this;
  405. const _a = (0, _propsUtil.splitAttrs)(this.$attrs).extraAttrs,
  406. {
  407. class: className
  408. } = _a,
  409. restAttrs = __rest(_a, ["class"]);
  410. // When hideOnSinglePage is true and there is only 1 page, hide the pager
  411. if (hideOnSinglePage === true && this.total <= statePageSize) {
  412. return null;
  413. }
  414. const allPages = calculatePage(undefined, this.$data, this.$props);
  415. const pagerList = [];
  416. let jumpPrev = null;
  417. let jumpNext = null;
  418. let firstPager = null;
  419. let lastPager = null;
  420. let gotoButton = null;
  421. const goButton = showQuickJumper && showQuickJumper.goButton;
  422. const pageBufferSize = showLessItems ? 1 : 2;
  423. const prevPage = stateCurrent - 1 > 0 ? stateCurrent - 1 : 0;
  424. const nextPage = stateCurrent + 1 < allPages ? stateCurrent + 1 : allPages;
  425. const hasPrev = this.hasPrev();
  426. const hasNext = this.hasNext();
  427. if (simple) {
  428. if (goButton) {
  429. if (typeof goButton === 'boolean') {
  430. gotoButton = (0, _vue.createVNode)("button", {
  431. "type": "button",
  432. "onClick": this.handleGoTO,
  433. "onKeyup": this.handleGoTO
  434. }, [locale.jump_to_confirm]);
  435. } else {
  436. gotoButton = (0, _vue.createVNode)("span", {
  437. "onClick": this.handleGoTO,
  438. "onKeyup": this.handleGoTO
  439. }, [goButton]);
  440. }
  441. const _gotoButton = function () {
  442. return gotoButton;
  443. }();
  444. gotoButton = (0, _vue.createVNode)("li", {
  445. "title": showTitle ? `${locale.jump_to}${stateCurrent}/${allPages}` : null,
  446. "class": `${prefixCls}-simple-pager`
  447. }, [gotoButton]);
  448. }
  449. return (0, _vue.createVNode)("ul", (0, _objectSpread2.default)({
  450. "class": (0, _classNames.default)(`${prefixCls} ${prefixCls}-simple`, {
  451. [`${prefixCls}-disabled`]: disabled
  452. }, className)
  453. }, restAttrs), [(0, _vue.createVNode)("li", {
  454. "title": showTitle ? locale.prev_page : null,
  455. "onClick": this.prev,
  456. "tabindex": hasPrev ? 0 : null,
  457. "onKeypress": this.runIfEnterPrev,
  458. "class": (0, _classNames.default)(`${prefixCls}-prev`, {
  459. [`${prefixCls}-disabled`]: !hasPrev
  460. }),
  461. "aria-disabled": !hasPrev
  462. }, [this.renderPrev(prevPage)]), (0, _vue.createVNode)("li", {
  463. "title": showTitle ? `${stateCurrent}/${allPages}` : null,
  464. "class": `${prefixCls}-simple-pager`
  465. }, [(0, _vue.createVNode)(_BaseInput.default, {
  466. "type": "text",
  467. "value": this.stateCurrentInputValue,
  468. "disabled": disabled,
  469. "onKeydown": this.handleKeyDown,
  470. "onKeyup": this.handleKeyUp,
  471. "onInput": this.handleKeyUp,
  472. "onChange": this.handleKeyUp,
  473. "size": "3"
  474. }, null), (0, _vue.createVNode)("span", {
  475. "class": `${prefixCls}-slash`
  476. }, [(0, _vue.createTextVNode)("\uFF0F")]), allPages]), (0, _vue.createVNode)("li", {
  477. "title": showTitle ? locale.next_page : null,
  478. "onClick": this.next,
  479. "tabindex": hasNext ? 0 : null,
  480. "onKeypress": this.runIfEnterNext,
  481. "class": (0, _classNames.default)(`${prefixCls}-next`, {
  482. [`${prefixCls}-disabled`]: !hasNext
  483. }),
  484. "aria-disabled": !hasNext
  485. }, [this.renderNext(nextPage)]), gotoButton]);
  486. }
  487. if (allPages <= 3 + pageBufferSize * 2) {
  488. const pagerProps = {
  489. locale,
  490. rootPrefixCls: prefixCls,
  491. showTitle,
  492. itemRender,
  493. onClick: this.handleChange,
  494. onKeypress: this.runIfEnter
  495. };
  496. if (!allPages) {
  497. pagerList.push((0, _vue.createVNode)(_Pager.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, pagerProps), {}, {
  498. "key": "noPager",
  499. "page": 1,
  500. "class": `${prefixCls}-item-disabled`
  501. }), null));
  502. }
  503. for (let i = 1; i <= allPages; i += 1) {
  504. const active = stateCurrent === i;
  505. pagerList.push((0, _vue.createVNode)(_Pager.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, pagerProps), {}, {
  506. "key": i,
  507. "page": i,
  508. "active": active
  509. }), null));
  510. }
  511. } else {
  512. const prevItemTitle = showLessItems ? locale.prev_3 : locale.prev_5;
  513. const nextItemTitle = showLessItems ? locale.next_3 : locale.next_5;
  514. if (showPrevNextJumpers) {
  515. jumpPrev = (0, _vue.createVNode)("li", {
  516. "title": this.showTitle ? prevItemTitle : null,
  517. "key": "prev",
  518. "onClick": this.jumpPrev,
  519. "tabindex": "0",
  520. "onKeypress": this.runIfEnterJumpPrev,
  521. "class": (0, _classNames.default)(`${prefixCls}-jump-prev`, {
  522. [`${prefixCls}-jump-prev-custom-icon`]: !!jumpPrevIcon
  523. })
  524. }, [itemRender({
  525. page: this.getJumpPrevPage(),
  526. type: 'jump-prev',
  527. originalElement: this.getItemIcon('jumpPrevIcon', 'prev page')
  528. })]);
  529. jumpNext = (0, _vue.createVNode)("li", {
  530. "title": this.showTitle ? nextItemTitle : null,
  531. "key": "next",
  532. "tabindex": "0",
  533. "onClick": this.jumpNext,
  534. "onKeypress": this.runIfEnterJumpNext,
  535. "class": (0, _classNames.default)(`${prefixCls}-jump-next`, {
  536. [`${prefixCls}-jump-next-custom-icon`]: !!jumpNextIcon
  537. })
  538. }, [itemRender({
  539. page: this.getJumpNextPage(),
  540. type: 'jump-next',
  541. originalElement: this.getItemIcon('jumpNextIcon', 'next page')
  542. })]);
  543. }
  544. lastPager = (0, _vue.createVNode)(_Pager.default, {
  545. "locale": locale,
  546. "last": true,
  547. "rootPrefixCls": prefixCls,
  548. "onClick": this.handleChange,
  549. "onKeypress": this.runIfEnter,
  550. "key": allPages,
  551. "page": allPages,
  552. "active": false,
  553. "showTitle": showTitle,
  554. "itemRender": itemRender
  555. }, null);
  556. firstPager = (0, _vue.createVNode)(_Pager.default, {
  557. "locale": locale,
  558. "rootPrefixCls": prefixCls,
  559. "onClick": this.handleChange,
  560. "onKeypress": this.runIfEnter,
  561. "key": 1,
  562. "page": 1,
  563. "active": false,
  564. "showTitle": showTitle,
  565. "itemRender": itemRender
  566. }, null);
  567. let left = Math.max(1, stateCurrent - pageBufferSize);
  568. let right = Math.min(stateCurrent + pageBufferSize, allPages);
  569. if (stateCurrent - 1 <= pageBufferSize) {
  570. right = 1 + pageBufferSize * 2;
  571. }
  572. if (allPages - stateCurrent <= pageBufferSize) {
  573. left = allPages - pageBufferSize * 2;
  574. }
  575. for (let i = left; i <= right; i += 1) {
  576. const active = stateCurrent === i;
  577. pagerList.push((0, _vue.createVNode)(_Pager.default, {
  578. "locale": locale,
  579. "rootPrefixCls": prefixCls,
  580. "onClick": this.handleChange,
  581. "onKeypress": this.runIfEnter,
  582. "key": i,
  583. "page": i,
  584. "active": active,
  585. "showTitle": showTitle,
  586. "itemRender": itemRender
  587. }, null));
  588. }
  589. if (stateCurrent - 1 >= pageBufferSize * 2 && stateCurrent !== 1 + 2) {
  590. pagerList[0] = (0, _vue.createVNode)(_Pager.default, {
  591. "locale": locale,
  592. "rootPrefixCls": prefixCls,
  593. "onClick": this.handleChange,
  594. "onKeypress": this.runIfEnter,
  595. "key": left,
  596. "page": left,
  597. "class": `${prefixCls}-item-after-jump-prev`,
  598. "active": false,
  599. "showTitle": this.showTitle,
  600. "itemRender": itemRender
  601. }, null);
  602. pagerList.unshift(jumpPrev);
  603. }
  604. if (allPages - stateCurrent >= pageBufferSize * 2 && stateCurrent !== allPages - 2) {
  605. pagerList[pagerList.length - 1] = (0, _vue.createVNode)(_Pager.default, {
  606. "locale": locale,
  607. "rootPrefixCls": prefixCls,
  608. "onClick": this.handleChange,
  609. "onKeypress": this.runIfEnter,
  610. "key": right,
  611. "page": right,
  612. "class": `${prefixCls}-item-before-jump-next`,
  613. "active": false,
  614. "showTitle": this.showTitle,
  615. "itemRender": itemRender
  616. }, null);
  617. pagerList.push(jumpNext);
  618. }
  619. if (left !== 1) {
  620. pagerList.unshift(firstPager);
  621. }
  622. if (right !== allPages) {
  623. pagerList.push(lastPager);
  624. }
  625. }
  626. let totalText = null;
  627. if (showTotal) {
  628. totalText = (0, _vue.createVNode)("li", {
  629. "class": `${prefixCls}-total-text`
  630. }, [showTotal(total, [total === 0 ? 0 : (stateCurrent - 1) * statePageSize + 1, stateCurrent * statePageSize > total ? total : stateCurrent * statePageSize])]);
  631. }
  632. const prevDisabled = !hasPrev || !allPages;
  633. const nextDisabled = !hasNext || !allPages;
  634. const buildOptionText = this.buildOptionText || this.$slots.buildOptionText;
  635. return (0, _vue.createVNode)("ul", (0, _objectSpread2.default)((0, _objectSpread2.default)({
  636. "unselectable": "on",
  637. "ref": "paginationNode"
  638. }, restAttrs), {}, {
  639. "class": (0, _classNames.default)({
  640. [`${prefixCls}`]: true,
  641. [`${prefixCls}-disabled`]: disabled
  642. }, className)
  643. }), [totalText, (0, _vue.createVNode)("li", {
  644. "title": showTitle ? locale.prev_page : null,
  645. "onClick": this.prev,
  646. "tabindex": prevDisabled ? null : 0,
  647. "onKeypress": this.runIfEnterPrev,
  648. "class": (0, _classNames.default)(`${prefixCls}-prev`, {
  649. [`${prefixCls}-disabled`]: prevDisabled
  650. }),
  651. "aria-disabled": prevDisabled
  652. }, [this.renderPrev(prevPage)]), pagerList, (0, _vue.createVNode)("li", {
  653. "title": showTitle ? locale.next_page : null,
  654. "onClick": this.next,
  655. "tabindex": nextDisabled ? null : 0,
  656. "onKeypress": this.runIfEnterNext,
  657. "class": (0, _classNames.default)(`${prefixCls}-next`, {
  658. [`${prefixCls}-disabled`]: nextDisabled
  659. }),
  660. "aria-disabled": nextDisabled
  661. }, [this.renderNext(nextPage)]), (0, _vue.createVNode)(_Options.default, {
  662. "disabled": disabled,
  663. "locale": locale,
  664. "rootPrefixCls": prefixCls,
  665. "selectComponentClass": selectComponentClass,
  666. "selectPrefixCls": selectPrefixCls,
  667. "changeSize": this.getShowSizeChanger() ? this.changePageSize : null,
  668. "current": stateCurrent,
  669. "pageSize": statePageSize,
  670. "pageSizeOptions": pageSizeOptions,
  671. "buildOptionText": buildOptionText || null,
  672. "quickGo": this.shouldDisplayQuickJumper() ? this.handleChange : null,
  673. "goButton": goButton
  674. }, null)]);
  675. }
  676. });