@alifd/meet-react
Version:
Fusion Mobile React UI System Component
186 lines (185 loc) • 9.36 kB
JavaScript
"use strict";
exports.__esModule = true;
exports.default = void 0;
var _babelRuntimeJsxStyleTransform = require("@alifd/babel-runtime-jsx-style-transform");
var _tslib = require("tslib");
var _react = _interopRequireWildcard(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _meetReactComponentOne = require("@alifd/meet-react-component-one");
var _view = _interopRequireDefault(require("../view"));
var _icon = _interopRequireDefault(require("../icon"));
var _picker = _interopRequireDefault(require("../picker"));
var _button = _interopRequireDefault(require("../button"));
var _selectDrawer = _interopRequireDefault(require("../select-drawer"));
var _locale = require("../locale");
var _zhCn = _interopRequireDefault(require("../locale/lang/zh-cn"));
var _utils = require("../utils");
var _hooks = require("../utils/hooks");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var getPageNumber = function (totalPage) {
var pageNumberList = [];
for (var i = 1; i <= totalPage; i++) {
pageNumberList.push({
label: i,
value: i
});
}
return [pageNumberList];
};
var getCurPageNum = function (current, totalPage, defaultValue) {
if (defaultValue === void 0) {
defaultValue = 1;
}
if ((0, _utils.isNumber)(current)) {
if (current >= 1 && current <= totalPage) {
return current;
} else if (current > totalPage) {
return totalPage;
} else if (current < 1) {
return defaultValue;
}
} else {
return defaultValue;
}
};
var selectedValue = 1;
var Pagination = function (props, ref) {
var _props$size = props.size,
size = _props$size === void 0 ? 'medium' : _props$size,
_props$type = props.type,
typeProp = _props$type === void 0 ? 'normal' : _props$type,
_props$current = props.current,
current = _props$current === void 0 ? 1 : _props$current,
defaultCurrent = props.defaultCurrent,
_props$total = props.total,
totalProp = _props$total === void 0 ? 100 : _props$total,
_props$pageSize = props.pageSize,
pageSizeProp = _props$pageSize === void 0 ? 10 : _props$pageSize,
_props$isOpenDisabled = props.isOpenDisabled,
isOpenDisabled = _props$isOpenDisabled === void 0 ? true : _props$isOpenDisabled,
_props$previousButton = props.previousButtonText,
previousButtonText = _props$previousButton === void 0 ? 'Previous' : _props$previousButton,
_props$nextButtonText = props.nextButtonText,
nextButtonText = _props$nextButtonText === void 0 ? 'Next' : _props$nextButtonText,
_props$onChange = props.onChange,
onChange = _props$onChange === void 0 ? function () {} : _props$onChange,
_props$style = props.style,
style = _props$style === void 0 ? {} : _props$style,
_props$prefix = props.prefix,
prefix = _props$prefix === void 0 ? 'mt-' : _props$prefix,
others = (0, _tslib.__rest)(props, ["size", "type", "current", "defaultCurrent", "total", "pageSize", "isOpenDisabled", "previousButtonText", "nextButtonText", "onChange", "style", "prefix"]);
var type = typeProp === 'simple' ? 'normal' : typeProp;
var locale = (0, _locale.useLocale)('Pagination', others, _zhCn.default.Pagination);
var pageSize = (0, _utils.isNumber)(pageSizeProp) && pageSizeProp > 0 ? pageSizeProp : 1;
var total = (0, _utils.isNumber)(totalProp) && totalProp > 0 ? totalProp : 1;
var totalPage = Math.ceil(total / pageSize) || 1;
var pageNumberData = getPageNumber(totalPage);
var _useValue = (0, _hooks.useValue)(props, 1, {
valueName: 'current',
fitValue: function fitValue(v) {
return getCurPageNum(v, totalPage);
}
}),
currentPageValue = _useValue[0],
setCurrentPageValue = _useValue[1],
isControlled = _useValue[2];
selectedValue = currentPageValue;
var previousButtonDisabled = currentPageValue === 1 && isOpenDisabled;
var nextButtonDisabled = currentPageValue === totalPage && isOpenDisabled;
var clsPrefix = prefix + "pagination";
var classNameObj = {
pagination: (0, _classnames.default)(clsPrefix, clsPrefix + "--" + size),
paginationTextMini: (0, _classnames.default)(clsPrefix + "--" + size + "-text-mini"),
paginationText: (0, _classnames.default)(clsPrefix + "-text", clsPrefix + "--" + size + "-text"),
paginationNumber: (0, _classnames.default)(clsPrefix + "--" + size + "-text-number"),
paginationTextCurrent: (0, _classnames.default)(clsPrefix + "-text-current", clsPrefix + "--" + size + "-text-number"),
paginationTextSelectDrawer: (0, _classnames.default)(clsPrefix + "-text-select-drawer"),
paginationIconFirst: (0, _classnames.default)(clsPrefix + "-icon", clsPrefix + "--" + size + "-icon", clsPrefix + "-icon--first", clsPrefix + "--" + size + "-icon--first", previousButtonDisabled ? clsPrefix + "-icon--disabled" : ''),
paginationIconLast: (0, _classnames.default)(clsPrefix + "-icon", clsPrefix + "--" + size + "-icon", clsPrefix + "-icon--last", clsPrefix + "--" + size + "-icon--last", nextButtonDisabled ? clsPrefix + "-icon--disabled" : '')
};
var handleOk = function handleOk() {
setCurrentPageValue(selectedValue);
if (onChange) {
onChange(selectedValue);
}
};
var handleCancel = function handleCancel() {
selectedValue = currentPageValue;
if (onChange) {
onChange(selectedValue);
}
};
return /*#__PURE__*/(0, _react.createElement)(_view.default, _extends({}, others, {
className: classNameObj.pagination,
ref: ref
}), /*#__PURE__*/(0, _react.createElement)(_button.default, {
size: size,
model: "outline",
disabled: previousButtonDisabled,
onClick: function handlePreviousButton(e) {
if (currentPageValue <= 1) {
return;
}
var prePageValue = currentPageValue - 1;
if (!isControlled) {
setCurrentPageValue(prePageValue);
}
if (onChange) {
onChange(prePageValue, e);
}
}
}, /*#__PURE__*/(0, _react.createElement)(_icon.default, {
name: "arrow-left",
className: classNameObj.paginationIconFirst
}), /*#__PURE__*/(0, _react.createElement)(_meetReactComponentOne.Text, null, locale.prev || previousButtonText)), type === 'normal' ? /*#__PURE__*/(0, _react.createElement)(_view.default, null, /*#__PURE__*/(0, _react.createElement)(_selectDrawer.default, {
content: /*#__PURE__*/(0, _react.createElement)(_view.default, {
className: classNameObj.paginationText
}, /*#__PURE__*/(0, _react.createElement)(_meetReactComponentOne.Text, {
className: classNameObj.paginationTextCurrent
}, currentPageValue), /*#__PURE__*/(0, _react.createElement)(_meetReactComponentOne.Text, {
className: classNameObj.paginationNumber
}, "/", totalPage)),
className: classNameObj.paginationTextSelectDrawer,
placeholder: "",
iconType: "",
size: "small",
drawerTitle: locale.tip,
onOk: handleOk,
onCancel: handleCancel,
style: (0, _babelRuntimeJsxStyleTransform.rpx2vw4style)({
width: '100%'
})
}, /*#__PURE__*/(0, _react.createElement)(_picker.default, {
data: pageNumberData,
defaultValue: [currentPageValue],
onChange: function changePageNumber(item) {
selectedValue = item[0];
}
}))) : /*#__PURE__*/(0, _react.createElement)(_view.default, {
className: classNameObj.paginationTextMini
}), /*#__PURE__*/(0, _react.createElement)(_button.default, {
size: size,
model: "outline",
disabled: nextButtonDisabled,
onClick: function handleNextButton(e) {
if (currentPageValue >= totalPage) {
return;
}
var nextPageValue = currentPageValue + 1;
if (!isControlled) {
setCurrentPageValue(nextPageValue);
}
if (onChange) {
onChange(nextPageValue, e);
}
}
}, /*#__PURE__*/(0, _react.createElement)(_meetReactComponentOne.Text, null, locale.next || nextButtonText), /*#__PURE__*/(0, _react.createElement)(_icon.default, {
name: "arrow-right",
className: classNameObj.paginationIconLast
})));
};
Pagination.displayName = 'Pagination';
var _default = exports.default = /*#__PURE__*/(0, _react.forwardRef)(Pagination);