@nutui/nutui-react-taro 1.5.2-beta.1 → 1.5.2

package/dist/esm/Pagination.js

@@ -1,11 +1,170 @@
-import { P as Pagination } from './pagination.taro-715a173b.js';
-import 'react';
-import './configprovider.taro-8d71eb49.js';
-import 'lodash.kebabcase';
-import './zh-CN-c779e6c1.js';
-import './bem-350c1702.js';
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+var _excluded = ["modelValue", "mode", "prevText", "nextText", "pageCount", "totalItems", "itemsPerPage", "showPageSize", "onChange", "updatecurrent", "forceEllipses", "pageNodeRender", "defaultValue", "className"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import React__default, { useState, useEffect } from 'react';
+import { useConfig } from './ConfigProvider.js';
+import { c as cn } from './bem-3b438e61.js';
 import '@bem-react/classname';
-
-
-
+var defaultProps = {
+  defaultValue: 1,
+  mode: 'multi',
+  prevText: '',
+  nextText: '',
+  pageCount: '',
+  totalItems: '0',
+  itemsPerPage: '10',
+  showPageSize: '5',
+  forceEllipses: false,
+  className: '',
+  pageNodeRender: function pageNodeRender(item) {
+    return item.text;
+  }
+};
+var Pagination = function Pagination(props) {
+  var _useConfig = useConfig(),
+    locale = _useConfig.locale;
+  _objectSpread(_objectSpread({}, defaultProps), props);
+  var modelValue = props.modelValue,
+    mode = props.mode,
+    prevText = props.prevText,
+    nextText = props.nextText,
+    pageCount = props.pageCount,
+    totalItems = props.totalItems,
+    itemsPerPage = props.itemsPerPage,
+    showPageSize = props.showPageSize,
+    onChange = props.onChange,
+    updatecurrent = props.updatecurrent,
+    forceEllipses = props.forceEllipses,
+    pageNodeRender = props.pageNodeRender,
+    defaultValue = props.defaultValue,
+    className = props.className,
+    rest = _objectWithoutProperties(props, _excluded);
+  var _useState = useState(1),
+    _useState2 = _slicedToArray(_useState, 2),
+    currentPage = _useState2[0],
+    setCurrent = _useState2[1];
+  var _useState3 = useState([]),
+    _useState4 = _slicedToArray(_useState3, 2),
+    pages = _useState4[0],
+    setPages = _useState4[1];
+  var _useState5 = useState(Number(pageCount)),
+    _useState6 = _slicedToArray(_useState5, 2),
+    countRef = _useState6[0],
+    setCountRef = _useState6[1];
+  var paginationBem = cn('pagination');
+  // 计算页面的数量
+  var computedCountRef = function computedCountRef() {
+    var num = Number(pageCount) || Math.ceil(Number(totalItems) / Number(itemsPerPage));
+    return Number.isNaN(num) ? 1 : Math.max(1, num);
+  };
+  // 生成pages数组，用来遍历
+  var computedPages = function computedPages(_currentPage, _countRef) {
+    if (mode === 'simple') return [];
+    var items = [];
+    var pageCount = _countRef || countRef; // 总的页面数量
+    var pageSize = Number(showPageSize); // 展示的页面个数
+    var _current = _currentPage || Number(currentPage); // 当前页
+    var startPage = 1;
+    var endPage = pageCount;
+    var partialShow = pageCount > pageSize;
+    if (partialShow) {
+      // 选中的page在展示的page中间
+      startPage = Math.max(_current - Math.floor(pageSize / 2), 1);
+      endPage = startPage + pageSize - 1;
+      if (endPage > pageCount) {
+        endPage = pageCount;
+        startPage = endPage - pageSize + 1;
+      }
+    }
+    // 遍历生成数组
+    for (var i = startPage; i <= endPage; i++) {
+      var page = setPage(i, i, _current === i);
+      items.push(page);
+    }
+    // 判断是否有折叠
+    if (partialShow && pageSize > 0 && forceEllipses) {
+      if (startPage > 1) {
+        var prevPage = setPage(startPage - 1, '...');
+        items.unshift(prevPage);
+      }
+      if (endPage < pageCount) {
+        var nextPage = setPage(endPage + 1, '...');
+        items.push(nextPage);
+      }
+    }
+    return items;
+  };
+  // 点击选择page
+  var selectPage = function selectPage(curPage, isSelect) {
+    if (curPage > countRef || curPage < 1) return;
+    // 是否传入modelValue
+    if (!('modelValue' in props)) {
+      setCurrent(Number(curPage));
+      if (curPage !== currentPage) {
+        setPages(computedPages(curPage));
+      }
+    }
+    if (curPage !== currentPage) {
+      updatecurrent && updatecurrent(curPage);
+    }
+    if (isSelect) onChange && onChange(curPage);
+  };
+  // set page 对象
+  var setPage = function setPage(number, text, active) {
+    return {
+      number: number,
+      text: text,
+      active: active
+    };
+  };
+  useEffect(function () {
+    // 初始化 判断是否传入值 计算 当前页，总页数，生成子节点
+    var currentValue = props.defaultValue || 1;
+    if ('modelValue' in props) {
+      currentValue = Number(props.modelValue);
+    }
+    var pageCount = computedCountRef();
+    setCountRef(pageCount);
+    setPages(computedPages(currentValue, pageCount));
+  }, []);
+  if ('modelValue' in props) {
+    var current = props.modelValue ? Number(props.modelValue) : 1;
+    if (current !== currentPage) {
+      setCurrent(current);
+      setPages(computedPages(Number(current)));
+    }
+  }
+  return React__default.createElement("div", _objectSpread({
+    className: "".concat(paginationBem(''), " ").concat(className)
+  }, rest), React__default.createElement("div", {
+    className: "".concat(paginationBem('prev'), "  ").concat(mode === 'multi' ? '' : 'simple-border', " ").concat(currentPage === 1 ? 'disabled' : ''),
+    onClick: function onClick(e) {
+      return selectPage(Number(currentPage) - 1, true);
+    }
+  }, prevText || locale.pagination.prev), mode === 'multi' ? React__default.createElement("div", {
+    className: "".concat(paginationBem('contain'))
+  }, pages.map(function (item, index) {
+    return React__default.createElement("div", {
+      key: "".concat(index, "pagination"),
+      className: "".concat(paginationBem('item'), " ").concat(item.active ? 'active' : ''),
+      onClick: function onClick(e) {
+        return !item.active ? selectPage(item.number, true) : '';
+      }
+    }, pageNodeRender ? pageNodeRender(item) : item.text);
+  })) : '', mode === 'simple' ? React__default.createElement("div", {
+    className: "".concat(paginationBem('contain'))
+  }, React__default.createElement("div", {
+    className: "".concat(paginationBem('simple'))
+  }, currentPage, "/", countRef)) : '', React__default.createElement("div", {
+    className: "".concat(paginationBem('next'), "  ").concat(Number(currentPage) >= countRef ? 'disabled' : ''),
+    onClick: function onClick(e) {
+      return selectPage(Number(currentPage) + 1, true);
+    }
+  }, nextText || locale.pagination.next));
+};
+Pagination.defaultProps = defaultProps;
+Pagination.displayName = 'NutPagination';
 export { Pagination as default };