Options.js 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133
  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 _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
  8. var _KeyCode = _interopRequireDefault(require("rc-util/lib/KeyCode"));
  9. var _react = _interopRequireDefault(require("react"));
  10. var defaultPageSizeOptions = [10, 20, 50, 100];
  11. var Options = function Options(props) {
  12. var _props$pageSizeOption = props.pageSizeOptions,
  13. pageSizeOptions = _props$pageSizeOption === void 0 ? defaultPageSizeOptions : _props$pageSizeOption,
  14. locale = props.locale,
  15. changeSize = props.changeSize,
  16. pageSize = props.pageSize,
  17. goButton = props.goButton,
  18. quickGo = props.quickGo,
  19. rootPrefixCls = props.rootPrefixCls,
  20. disabled = props.disabled,
  21. buildOptionText = props.buildOptionText,
  22. showSizeChanger = props.showSizeChanger,
  23. sizeChangerRender = props.sizeChangerRender;
  24. var _React$useState = _react.default.useState(''),
  25. _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
  26. goInputText = _React$useState2[0],
  27. setGoInputText = _React$useState2[1];
  28. var getValidValue = function getValidValue() {
  29. return !goInputText || Number.isNaN(goInputText) ? undefined : Number(goInputText);
  30. };
  31. var mergeBuildOptionText = typeof buildOptionText === 'function' ? buildOptionText : function (value) {
  32. return "".concat(value, " ").concat(locale.items_per_page);
  33. };
  34. var handleChange = function handleChange(e) {
  35. setGoInputText(e.target.value);
  36. };
  37. var handleBlur = function handleBlur(e) {
  38. if (goButton || goInputText === '') {
  39. return;
  40. }
  41. setGoInputText('');
  42. if (e.relatedTarget && (e.relatedTarget.className.indexOf("".concat(rootPrefixCls, "-item-link")) >= 0 || e.relatedTarget.className.indexOf("".concat(rootPrefixCls, "-item")) >= 0)) {
  43. return;
  44. }
  45. quickGo === null || quickGo === void 0 || quickGo(getValidValue());
  46. };
  47. var go = function go(e) {
  48. if (goInputText === '') {
  49. return;
  50. }
  51. if (e.keyCode === _KeyCode.default.ENTER || e.type === 'click') {
  52. setGoInputText('');
  53. quickGo === null || quickGo === void 0 || quickGo(getValidValue());
  54. }
  55. };
  56. var getPageSizeOptions = function getPageSizeOptions() {
  57. if (pageSizeOptions.some(function (option) {
  58. return option.toString() === pageSize.toString();
  59. })) {
  60. return pageSizeOptions;
  61. }
  62. return pageSizeOptions.concat([pageSize]).sort(function (a, b) {
  63. var numberA = Number.isNaN(Number(a)) ? 0 : Number(a);
  64. var numberB = Number.isNaN(Number(b)) ? 0 : Number(b);
  65. return numberA - numberB;
  66. });
  67. };
  68. // ============== cls ==============
  69. var prefixCls = "".concat(rootPrefixCls, "-options");
  70. // ============== render ==============
  71. if (!showSizeChanger && !quickGo) {
  72. return null;
  73. }
  74. var changeSelect = null;
  75. var goInput = null;
  76. var gotoButton = null;
  77. // >>>>> Size Changer
  78. if (showSizeChanger && sizeChangerRender) {
  79. changeSelect = sizeChangerRender({
  80. disabled: disabled,
  81. size: pageSize,
  82. onSizeChange: function onSizeChange(nextValue) {
  83. changeSize === null || changeSize === void 0 || changeSize(Number(nextValue));
  84. },
  85. 'aria-label': locale.page_size,
  86. className: "".concat(prefixCls, "-size-changer"),
  87. options: getPageSizeOptions().map(function (opt) {
  88. return {
  89. label: mergeBuildOptionText(opt),
  90. value: opt
  91. };
  92. })
  93. });
  94. }
  95. // >>>>> Quick Go
  96. if (quickGo) {
  97. if (goButton) {
  98. gotoButton = typeof goButton === 'boolean' ? /*#__PURE__*/_react.default.createElement("button", {
  99. type: "button",
  100. onClick: go,
  101. onKeyUp: go,
  102. disabled: disabled,
  103. className: "".concat(prefixCls, "-quick-jumper-button")
  104. }, locale.jump_to_confirm) : /*#__PURE__*/_react.default.createElement("span", {
  105. onClick: go,
  106. onKeyUp: go
  107. }, goButton);
  108. }
  109. goInput = /*#__PURE__*/_react.default.createElement("div", {
  110. className: "".concat(prefixCls, "-quick-jumper")
  111. }, locale.jump_to, /*#__PURE__*/_react.default.createElement("input", {
  112. disabled: disabled,
  113. type: "text",
  114. value: goInputText,
  115. onChange: handleChange,
  116. onKeyUp: go,
  117. onBlur: handleBlur,
  118. "aria-label": locale.page
  119. }), locale.page, gotoButton);
  120. }
  121. return /*#__PURE__*/_react.default.createElement("li", {
  122. className: prefixCls
  123. }, changeSelect, goInput);
  124. };
  125. if (process.env.NODE_ENV !== 'production') {
  126. Options.displayName = 'Options';
  127. }
  128. var _default = exports.default = Options;