@ttk/component/lib/pagination/index.js

ttk组件库

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var _extends = require('../extends-63327b06.js');
var defineProperty = require('../defineProperty-ad97b418.js');
var slicedToArray = require('../slicedToArray-b256d11b.js');
var getPrototypeOf = require('../getPrototypeOf-3a7a3df9.js');
var React = require('react');
var ReactDOM = require('react-dom');
var antd = require('antd');
var Button = require('../button');
var classNames = require('classnames');
var isequal = require('lodash.isequal');
var Message = require('../message');
var zh_CN = require('../zh_CN-7310bed4.js');
require('../_commonjsHelpers-badc9712.js');
require('../unsupportedIterableToArray-94a305c4.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
var isequal__default = /*#__PURE__*/_interopDefaultLegacy(isequal);
var Message__default = /*#__PURE__*/_interopDefaultLegacy(Message);

function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = getPrototypeOf._getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = getPrototypeOf._getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return getPrototypeOf._possibleConstructorReturn(this, result); }; }

function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }

var PaginationComponent = /*#__PURE__*/function (_Component) {
  getPrototypeOf._inherits(PaginationComponent, _Component);

  var _super = _createSuper(PaginationComponent);

  function PaginationComponent(_props) {
    var _this;

    getPrototypeOf._classCallCheck(this, PaginationComponent);

    _this = _super.call(this);

    _this.assitShouldComponent = function (target) {
      var obj = {};

      for (var _i = 0, _Object$entries = Object.entries(target); _i < _Object$entries.length; _i++) {
        var _Object$entries$_i = slicedToArray._slicedToArray(_Object$entries[_i], 2),
            key = _Object$entries$_i[0],
            value = _Object$entries$_i[1];

        if (typeof value != 'function' && key != 'store') {
          obj[key] = value;
        }
      }

      return obj;
    };

    _this.handleClick = function () {
      var props = _this.props;

      if (!props.total) {
        return;
      }

      _this.setState({
        isJumper: true
      });

      var thisDom = ReactDOM__default["default"].findDOMNode(getPrototypeOf._assertThisInitialized(_this));
      var jumperContaienr = thisDom.getElementsByClassName('ant-pagination-options-quick-jumper')[0];
      if (!jumperContaienr) return;
      var dom = jumperContaienr.getElementsByTagName('input')[0];
      if (!dom) return;
      var num = parseInt(dom.value);
      var total = props.total,
          pageSize = props.pageSize;
      var size = Math.ceil(total / pageSize);

      if (!isNaN(num) && num > 0 && num <= size) {
        props.onChange && props.onChange(num, null);
      } else {
        Message__default["default"].warn('输入的页面不存在');
      }
    };

    _this.isCalJumper = function () {
      var _this$props = _this.props,
          showQuickJumper = _this$props.showQuickJumper,
          total = _this$props.total,
          pageSize = _this$props.pageSize;

      if (showQuickJumper != false && total > pageSize) {
        _this.calJumperInputValue();
      }
    };

    _this.calJumperInputValue = function () {
      try {
        var props = _this.props;
        var me = ReactDOM__default["default"].findDOMNode(getPrototypeOf._assertThisInitialized(_this));

        if (!me) {
          setTimeout(function () {
            return _this.calJumperInputValue();
          }, 10);
          return;
        }

        var jumperContaienr = me.getElementsByClassName('ant-pagination-options-quick-jumper')[0];
        if (!jumperContaienr) return setTimeout(function () {
          return _this.calJumperInputValue();
        }, 10);
        var dom = jumperContaienr.getElementsByTagName('input')[0];
        if (!dom) return setTimeout(function () {
          return _this.calJumperInputValue();
        }, 10);

        if (parseInt(dom.value) == parseInt(props.current)) {
          return;
        }

        if (props.current || props.current == 0) {
          // setTimeout(() => {
          dom.value = props.current; // }, 16)
        }
      } catch (err) {
        console.log(err);
      }
    };

    _this.showTotal = function (total) {
      return "\u5171 ".concat(total, " \u6761");
    };

    _this.state = {
      isJumper: false
    };
    return _this;
  }

  getPrototypeOf._createClass(PaginationComponent, [{
    key: "shouldComponentUpdate",
    value: function shouldComponentUpdate(nextProps, nextState) {
      // console.log((isequal(this.props, nextProps) && isequal(this.state, nextState)))		
      var isJumper = this.state.isJumper;

      if (isJumper) {
        return true;
      } else {
        return !(isequal__default["default"](this.assitShouldComponent(this.props), this.assitShouldComponent(nextProps)) && isequal__default["default"](this.state, nextState));
      }
    }
  }, {
    key: "componentDidMount",
    value: function componentDidMount() {
      this.isCalJumper();
    }
  }, {
    key: "componentDidUpdate",
    value: function componentDidUpdate() {
      this.isCalJumper();
    }
  }, {
    key: "render",
    value: function render() {
      var _this2 = this;

      var props = this.props;
      var className = classNames__default["default"](defineProperty._defineProperty({
        'mk-pagination': true
      }, props.className, !!props.className)); // rc-pagination在'pageSize' in props 且pageSize为undefined时报错，默认给pageSize赋值

      var overwrite = {};

      if (!props.pageSize) {
        overwrite.pageSize = props.defaultPageSize || 50;
      }

      return /*#__PURE__*/React__default["default"].createElement("div", {
        className: className
      }, /*#__PURE__*/React__default["default"].createElement(antd.Pagination, _extends._extends({
        showTotal: this.showTotal,
        pageSizeOptions: ['50', '100', '150', '200'],
        locale: zh_CN.zhCN,
        showQuickJumper: true,
        showSizeChanger: true
      }, props, overwrite)), props.showQuickJumper != false && props.total > props.pageSize ? /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
        onClick: function onClick() {
          return _this2.handleClick();
        },
        disabled: this.props.total ? false : true,
        className: "mk-pagination-goto-btn"
      }, "\u8DF3\u8F6C") : null);
    }
  }]);

  return PaginationComponent;
}(React.Component);

exports["default"] = PaginationComponent;