choerodon-ui/pro/lib/table/Table.js

An enterprise-class UI design language and React-based implementation

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.instance = exports["default"] = void 0;

var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));

var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));

var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));

var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));

var _get2 = _interopRequireDefault(require("@babel/runtime/helpers/get"));

var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));

var _tslib = require("tslib");

var _react = _interopRequireDefault(require("react"));

var _classnames = _interopRequireDefault(require("classnames"));

var _resizeObserverPolyfill = _interopRequireDefault(require("resize-observer-polyfill"));

var _raf = _interopRequireDefault(require("raf"));

var _mobxReact = require("mobx-react");

var _pick = _interopRequireDefault(require("lodash/pick"));

var _omit = _interopRequireDefault(require("lodash/omit"));

var _isString = _interopRequireDefault(require("lodash/isString"));

var _isNil = _interopRequireDefault(require("lodash/isNil"));

var _isUndefined = _interopRequireDefault(require("lodash/isUndefined"));

var _noop = _interopRequireDefault(require("lodash/noop"));

var _mobx = require("mobx");

var _reactBeautifulDnd = require("react-beautiful-dnd");

var _warning = _interopRequireDefault(require("../../../lib/_util/warning"));

var _UnitConvertor = require("../../../lib/_util/UnitConvertor");

var _measureScrollbar = _interopRequireDefault(require("../../../lib/_util/measureScrollbar"));

var _KeyCode = _interopRequireDefault(require("../../../lib/_util/KeyCode"));

var _resizeObserver = _interopRequireDefault(require("../../../lib/_util/resizeObserver"));

var _Column = _interopRequireDefault(require("./Column"));

var _TableRow = _interopRequireDefault(require("./TableRow"));

var _TableHeaderCell = _interopRequireDefault(require("./TableHeaderCell"));

var _TableStore = _interopRequireDefault(require("./TableStore"));

var _TableHeader = _interopRequireDefault(require("./TableHeader"));

var _autobind = _interopRequireDefault(require("../_util/autobind"));

var _Pagination = _interopRequireDefault(require("../pagination/Pagination"));

var _spin = _interopRequireDefault(require("../spin"));

var _DataSetComponent2 = _interopRequireDefault(require("../data-set/DataSetComponent"));

var _TableContext = require("./TableContext");

var _TableWrapper = _interopRequireDefault(require("./TableWrapper"));

var _Profiler = _interopRequireDefault(require("./Profiler"));

var _TableTBody = _interopRequireDefault(require("./TableTBody"));

var _ExpandableTableTBody = _interopRequireDefault(require("./ExpandableTableTBody"));

var _TableFooter = _interopRequireDefault(require("./TableFooter"));

var _enum = require("./enum");

var _queryBar = _interopRequireDefault(require("./query-bar"));

var _TableToolBar = _interopRequireDefault(require("./query-bar/TableToolBar"));

var _TableFilterBar = _interopRequireDefault(require("./query-bar/TableFilterBar"));

var _TableAdvancedQueryBar = _interopRequireDefault(require("./query-bar/TableAdvancedQueryBar"));

var _TableProfessionalBar = _interopRequireDefault(require("./query-bar/TableProfessionalBar"));

var _TableComboBar = _interopRequireDefault(require("./query-bar/TableComboBar"));

var _TableDynamicFilterBar = _interopRequireDefault(require("./query-bar/TableDynamicFilterBar"));

var _FilterSelect = _interopRequireDefault(require("./query-bar/FilterSelect"));

var _utils = require("./utils");

var _TableBody = _interopRequireDefault(require("./TableBody"));

var _VirtualWrapper = _interopRequireDefault(require("./VirtualWrapper"));

var _SelectionTips = _interopRequireDefault(require("./SelectionTips"));

var _enum2 = require("../data-set/enum");

var _enum3 = require("../core/enum");

var _StickyShadow = _interopRequireDefault(require("./StickyShadow"));

var _utils2 = require("../data-set/utils");

var _mergeProps = _interopRequireDefault(require("../_util/mergeProps"));

var _ErrorBar = _interopRequireDefault(require("./ErrorBar"));

var _instance; // 构造一个单例table来防止body下不能有table元素的报错


var instance = function instance(wrapperClassName, prefixCls) {
  // Using a table as the portal so that we do not get react
  // warnings when mounting a tr element
  var _tableContain = function _tableContain() {
    var table = document.createElement('table');

    if (wrapperClassName) {
      table.className = wrapperClassName;
    }

    var thead = document.createElement('thead');
    thead.className = "".concat(prefixCls, "-thead");
    table.appendChild(thead);
    var headtr = document.createElement('tr');
    thead.appendChild(headtr);
    var tbody = document.createElement('tbody');
    tbody.className = "".concat(prefixCls, "-tbody");
    table.appendChild(tbody);

    if (!document.body) {
      throw new Error('document.body required a body to append');
    }

    document.body.appendChild(table);
    return {
      tbody: tbody,
      headtr: headtr
    };
  };

  if (_instance) {
    return _instance;
  }

  return _instance = _tableContain();
};

exports.instance = instance;

var Table = /*#__PURE__*/function (_DataSetComponent) {
  (0, _inherits2["default"])(Table, _DataSetComponent);

  var _super = (0, _createSuper2["default"])(Table);

  function Table() {
    var _this;

    (0, _classCallCheck2["default"])(this, Table);
    _this = _super.apply(this, arguments);
    _this.tableStore = new _TableStore["default"]((0, _assertThisInitialized2["default"])(_this));
    _this.wrapperWidth = [];
    return _this;
  }

  (0, _createClass2["default"])(Table, [{
    key: "currentRow",
    get: function get() {
      var prefixCls = this.prefixCls;
      return this.element.querySelector(".".concat(prefixCls, "-row-current"));
    }
  }, {
    key: "firstRow",
    get: function get() {
      var prefixCls = this.prefixCls;
      return this.element.querySelector(".".concat(prefixCls, "-row:first-child"));
    }
  }, {
    key: "lastRow",
    get: function get() {
      var prefixCls = this.prefixCls;
      return this.element.querySelector(".".concat(prefixCls, "-row:last-child"));
    }
  }, {
    key: "saveResizeRef",
    value: function saveResizeRef(node) {
      this.resizeLine = node;
    }
  }, {
    key: "saveContentRef",
    value: function saveContentRef(node) {
      this.tableContentWrap = node;
    }
  }, {
    key: "useFocusedClassName",
    value: function useFocusedClassName() {
      return false;
    }
  }, {
    key: "setCode",
    value: function setCode(props) {
      var customizedCode = props.customizedCode;

      if (customizedCode) {
        this.code = customizedCode;
      } else {
        (0, _get2["default"])((0, _getPrototypeOf2["default"])(Table.prototype), "setCode", this).call(this, props);
      }
    }
  }, {
    key: "handleResize",
    value: function handleResize(width) {
      var element = this.element,
          tableStore = this.tableStore,
          wrapperWidth = this.wrapperWidth;

      if (width !== undefined) {
        var duplicate = wrapperWidth.includes(width);
        wrapperWidth.unshift(width);
        window.clearTimeout(this.wrapperWidthTimer);
        this.wrapperWidthTimer = window.setTimeout(function () {
          wrapperWidth.pop();
        }, 500);

        if (wrapperWidth.length > 2) {
          wrapperWidth.pop();
        }

        if (duplicate) {
          return;
        }
      }

      if (!element.offsetParent) {
        tableStore.styledHidden = true;
      } else if (!tableStore.hidden) {
        this.syncSizeInFrame(width);
      } else {
        tableStore.styledHidden = false;
      }
    }
  }, {
    key: "handleWindowResize",
    value: function handleWindowResize() {
      this.handleResize();
    }
  }, {
    key: "handleDataSetLoad",
    value: function handleDataSetLoad() {
      var tableStore = this.tableStore;

      if (tableStore.performanceEnabled) {
        tableStore.performanceOn = true;
      }

      this.initDefaultExpandedRows();
    }
  }, {
    key: "handleDataSetCreate",
    value: function handleDataSetCreate(_ref) {
      var record = _ref.record,
          dataSet = _ref.dataSet;
      var tableStore = this.tableStore;

      if (tableStore.inlineEdit) {
        if (tableStore.currentEditRecord) {
          tableStore.currentEditRecord.reset();
          dataSet.remove(record);
        } else {
          tableStore.currentEditRecord = record;
        }
      }
    }
  }, {
    key: "handleDataSetValidateSelf",
    value: function handleDataSetValidateSelf(props) {
      var onValidateSelf = this.getContextConfig('onValidateSelf');

      if (onValidateSelf) {
        onValidateSelf(props);
      }
    }
  }, {
    key: "handleDataSetValidate",
    value: function handleDataSetValidate(props) {
      var valid = props.valid,
          dataSet = props.dataSet,
          validationErrors = props.errors,
          noLocate = props.noLocate;
      var autoValidationLocate = this.props.autoValidationLocate;
      var onValidate = this.getContextConfig('onValidate');

      if (onValidate) {
        onValidate(props);
      }

      if (autoValidationLocate !== false && !noLocate && !valid) {
        var tableStore = this.tableStore;

        var _validationErrors = (0, _slicedToArray2["default"])(validationErrors, 1),
            firstInvalidRecord = _validationErrors[0];

        if (firstInvalidRecord) {
          var errors = firstInvalidRecord.errors,
              record = firstInvalidRecord.record;

          if (errors.length) {
            if (!tableStore.showCachedSelection) {
              if (dataSet.cachedRecords.includes(record)) {
                (0, _mobx.runInAction)(function () {
                  tableStore.showCachedSelection = true;
                });
              }
            }

            var _errors = (0, _slicedToArray2["default"])(errors, 1),
                name = _errors[0].field.name;

            if (tableStore.virtual && !(0, _utils.findRow)(tableStore, record)) {
              var tableBodyWrap = this.tableBodyWrap;

              if (tableBodyWrap) {
                var rowMetaData = tableStore.rowMetaData;

                if (rowMetaData) {
                  var metaData = rowMetaData.find(function (m) {
                    return m.record === record;
                  });

                  if (metaData) {
                    tableBodyWrap.scrollTop = metaData.offset;
                  }
                } else {
                  tableBodyWrap.scrollTop = record.index * tableStore.virtualRowHeight;
                }
              }
            }

            (0, _raf["default"])(function () {
              var cell = (0, _utils.findCell)(tableStore, name, undefined, record);

              if (cell) {
                cell.focus();
              }
            });
          }
        }
      }
    }
  }, {
    key: "handleKeyDown",
    value: function handleKeyDown(e) {
      var tableStore = this.tableStore;
      var keyboard = tableStore.keyboard;

      if (!tableStore.editing) {
        try {
          var dataSet = this.props.dataSet;
          var ctrlKey = e.ctrlKey || e.metaKey;
          var altKey = e.altKey;
          var shiftKey = e.shiftKey;

          switch (e.keyCode) {
            case _KeyCode["default"].UP:
              if (shiftKey && keyboard) {
                this.handleKeyDownUpShift(e);
              } else {
                this.handleKeyDownUp(e);
              }

              break;

            case _KeyCode["default"].DOWN:
              if (shiftKey && keyboard) {
                this.handleKeyDownDownShift(e);
              } else {
                this.handleKeyDownDown(e);
              }

              break;

            case _KeyCode["default"].RIGHT:
              this.handleKeyDownRight(e);
              break;

            case _KeyCode["default"].LEFT:
              this.handleKeyDownLeft(e);
              break;

            case _KeyCode["default"].PAGE_UP:
              e.preventDefault();
              dataSet.prePage();
              break;

            case _KeyCode["default"].PAGE_DOWN:
              e.preventDefault();
              dataSet.nextPage();
              break;

            case _KeyCode["default"].HOME:
              this.handleKeyDownHome(e);
              break;

            case _KeyCode["default"].END:
              this.handleKeyDownEnd(e);
              break;

            case _KeyCode["default"].S:
              if (ctrlKey === true && keyboard) this.handleKeyDownCTRLS(e);
              break;

            case _KeyCode["default"].N:
              if (altKey === true && keyboard) this.handleKeyDownCTRLN(e);
              break;

            case _KeyCode["default"].D:
              if (ctrlKey === true && keyboard) this.handleKeyDownCTRLD(e);
              break;

            case _KeyCode["default"].DELETE:
              if (altKey === true && keyboard) this.handleKeyDownCTRLDELETE(e);
              break;

            default:
          }
        } catch (error) {
          (0, _warning["default"])(false, error.message);
        }
      }

      var _this$props$onKeyDown = this.props.onKeyDown,
          onKeyDown = _this$props$onKeyDown === void 0 ? _noop["default"] : _this$props$onKeyDown;
      onKeyDown(e);
    }
  }, {
    key: "focusRow",
    value: function focusRow(row) {
      if (row) {
        var index = row.dataset.index;

        if (index) {
          var dataSet = this.props.dataSet;
          var record = dataSet.findRecordById(index);

          if (record) {
            dataSet.current = record;
            return record;
          }
        }
      }
    }
  }, {
    key: "handleKeyDownHome",
    value: function () {
      var _handleKeyDownHome = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(e) {
        var dataSet;
        return _regenerator["default"].wrap(function _callee$(_context) {
          while (1) {
            switch (_context.prev = _context.next) {
              case 0:
                e.preventDefault();
                dataSet = this.props.dataSet;

                if (this.tableStore.isTree) {
                  _context.next = 5;
                  break;
                }

                _context.next = 5;
                return dataSet.first();

              case 5:
                this.focusRow(this.firstRow);

              case 6:
              case "end":
                return _context.stop();
            }
          }
        }, _callee, this);
      }));

      function handleKeyDownHome(_x) {
        return _handleKeyDownHome.apply(this, arguments);
      }

      return handleKeyDownHome;
    }()
  }, {
    key: "handleKeyDownEnd",
    value: function () {
      var _handleKeyDownEnd = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(e) {
        var dataSet;
        return _regenerator["default"].wrap(function _callee2$(_context2) {
          while (1) {
            switch (_context2.prev = _context2.next) {
              case 0:
                e.preventDefault();
                dataSet = this.props.dataSet;

                if (this.tableStore.isTree) {
                  _context2.next = 5;
                  break;
                }

                _context2.next = 5;
                return dataSet.last();

              case 5:
                this.focusRow(this.lastRow);

              case 6:
              case "end":
                return _context2.stop();
            }
          }
        }, _callee2, this);
      }));

      function handleKeyDownEnd(_x2) {
        return _handleKeyDownEnd.apply(this, arguments);
      }

      return handleKeyDownEnd;
    }()
  }, {
    key: "handleKeyDownCTRLS",
    value: function () {
      var _handleKeyDownCTRLS = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3(e) {
        var dataSet;
        return _regenerator["default"].wrap(function _callee3$(_context3) {
          while (1) {
            switch (_context3.prev = _context3.next) {
              case 0:
                e.preventDefault();
                dataSet = this.tableStore.dataSet;
                dataSet.submit();

              case 3:
              case "end":
                return _context3.stop();
            }
          }
        }, _callee3, this);
      }));

      function handleKeyDownCTRLS(_x3) {
        return _handleKeyDownCTRLS.apply(this, arguments);
      }

      return handleKeyDownCTRLS;
    }()
  }, {
    key: "handleKeyDownCTRLN",
    value: function () {
      var _handleKeyDownCTRLN = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee4(e) {
        var _this$tableStore, dataSet, editors;

        return _regenerator["default"].wrap(function _callee4$(_context4) {
          while (1) {
            switch (_context4.prev = _context4.next) {
              case 0:
                _this$tableStore = this.tableStore, dataSet = _this$tableStore.dataSet, editors = _this$tableStore.editors;

                if (editors.size) {
                  e.preventDefault();
                  dataSet.create({}, 0);
                }

              case 2:
              case "end":
                return _context4.stop();
            }
          }
        }, _callee4, this);
      }));

      function handleKeyDownCTRLN(_x4) {
        return _handleKeyDownCTRLN.apply(this, arguments);
      }

      return handleKeyDownCTRLN;
    }() // TODO: To be optimized

  }, {
    key: "handleKeyDownCTRLD",
    value: function () {
      var _handleKeyDownCTRLD = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee5(e) {
        var currentRow, tableStore, dataSet, currentElementSibling, previousElementSibling, index, currentIndex, record, currentRecord, cloneRecodData, dealCloneRecodData, editeColumn, uniqueFieldNames;
        return _regenerator["default"].wrap(function _callee5$(_context5) {
          while (1) {
            switch (_context5.prev = _context5.next) {
              case 0:
                e.preventDefault();
                currentRow = this.currentRow, tableStore = this.tableStore;
                dataSet = tableStore.dataSet;
                currentElementSibling = null; // to justice it can be change or standards compliant

                if ((0, _utils.isCanEdictingRow)(currentRow)) {
                  currentElementSibling = currentRow;
                }

                if (currentElementSibling && tableStore && dataSet) {
                  previousElementSibling = (0, _utils.findIndexedSibling)(currentElementSibling, -1);

                  if (previousElementSibling) {
                    index = previousElementSibling.dataset.index;
                    currentIndex = currentElementSibling.dataset.index;

                    if (index && currentIndex) {
                      record = dataSet.findRecordById(index);
                      currentRecord = dataSet.findRecordById(currentIndex); // exculde the primery key and merge has columns which has edictor

                      if (record && currentRecord && tableStore) {
                        cloneRecodData = record.clone().toData() || {};
                        dealCloneRecodData = {};
                        editeColumn = tableStore.columns.filter(function (column) {
                          return !!column.editor;
                        }).reduce(function (accumulator, nowValue) {
                          return [].concat((0, _toConsumableArray2["default"])(accumulator), [nowValue.name]);
                        }, []).filter(function (v) {
                          return !(v === null || v === undefined || v === '');
                        });

                        if (editeColumn && editeColumn.length > 0) {
                          editeColumn.forEach(function (element) {
                            if (element) {
                              dealCloneRecodData[element] = cloneRecodData[element];
                            }
                          });
                        } // remove the unique name of fields


                        uniqueFieldNames = (0, _utils2.getUniqueFieldNames)(dataSet);

                        if (uniqueFieldNames && uniqueFieldNames.length > 0) {
                          uniqueFieldNames.forEach(function (element) {
                            if (element) {
                              delete dealCloneRecodData[element];
                            }
                          });
                        }

                        currentRecord.set(dealCloneRecodData);
                      }
                    }
                  }
                }

              case 6:
              case "end":
                return _context5.stop();
            }
          }
        }, _callee5, this);
      }));

      function handleKeyDownCTRLD(_x5) {
        return _handleKeyDownCTRLD.apply(this, arguments);
      }

      return handleKeyDownCTRLD;
    }()
  }, {
    key: "handleKeyDownCTRLDELETE",
    value: function () {
      var _handleKeyDownCTRLDELETE = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee6(e) {
        var dataSet;
        return _regenerator["default"].wrap(function _callee6$(_context6) {
          while (1) {
            switch (_context6.prev = _context6.next) {
              case 0:
                e.preventDefault();
                dataSet = this.tableStore.dataSet;
                dataSet["delete"](dataSet.selected);

              case 3:
              case "end":
                return _context6.stop();
            }
          }
        }, _callee6, this);
      }));

      function handleKeyDownCTRLDELETE(_x6) {
        return _handleKeyDownCTRLDELETE.apply(this, arguments);
      }

      return handleKeyDownCTRLDELETE;
    }()
  }, {
    key: "handleKeyDownUp",
    value: function () {
      var _handleKeyDownUp = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee7(e) {
        var currentRow, returnRecod, previousElementSibling, dataSet;
        return _regenerator["default"].wrap(function _callee7$(_context7) {
          while (1) {
            switch (_context7.prev = _context7.next) {
              case 0:
                e.preventDefault();
                currentRow = this.currentRow;

                if (!currentRow) {
                  _context7.next = 14;
                  break;
                }

                previousElementSibling = (0, _utils.findIndexedSibling)(currentRow, -1);

                if (!previousElementSibling) {
                  _context7.next = 8;
                  break;
                }

                returnRecod = this.focusRow(previousElementSibling);
                _context7.next = 12;
                break;

              case 8:
                dataSet = this.props.dataSet;
                _context7.next = 11;
                return dataSet.prePage();

              case 11:
                returnRecod = this.focusRow(this.lastRow);

              case 12:
                if (!returnRecod) {
                  _context7.next = 14;
                  break;
                }

                return _context7.abrupt("return", Promise.resolve(returnRecod));

              case 14:
                return _context7.abrupt("return", Promise.reject());

              case 15:
              case "end":
                return _context7.stop();
            }
          }
        }, _callee7, this);
      }));

      function handleKeyDownUp(_x7) {
        return _handleKeyDownUp.apply(this, arguments);
      }

      return handleKeyDownUp;
    }()
  }, {
    key: "handleKeyDownDown",
    value: function () {
      var _handleKeyDownDown = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee8(e) {
        var currentRow, returnRecod, nextElementSibling, dataSet;
        return _regenerator["default"].wrap(function _callee8$(_context8) {
          while (1) {
            switch (_context8.prev = _context8.next) {
              case 0:
                e.preventDefault();
                currentRow = this.currentRow;

                if (!currentRow) {
                  _context8.next = 14;
                  break;
                }

                nextElementSibling = (0, _utils.findIndexedSibling)(currentRow, 1);

                if (!nextElementSibling) {
                  _context8.next = 8;
                  break;
                }

                returnRecod = this.focusRow(nextElementSibling);
                _context8.next = 12;
                break;

              case 8:
                dataSet = this.props.dataSet;
                _context8.next = 11;
                return dataSet.nextPage();

              case 11:
                returnRecod = this.focusRow(this.firstRow);

              case 12:
                if (!returnRecod) {
                  _context8.next = 14;
                  break;
                }

                return _context8.abrupt("return", Promise.resolve(returnRecod));

              case 14:
                return _context8.abrupt("return", Promise.reject());

              case 15:
              case "end":
                return _context8.stop();
            }
          }
        }, _callee8, this);
      }));

      function handleKeyDownDown(_x8) {
        return _handleKeyDownDown.apply(this, arguments);
      }

      return handleKeyDownDown;
    }()
  }, {
    key: "handleKeyDownDownShift",
    value: function () {
      var _handleKeyDownDownShift = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee9(e) {
        var dataSet, currentRow, index, record, currentRecord;
        return _regenerator["default"].wrap(function _callee9$(_context9) {
          while (1) {
            switch (_context9.prev = _context9.next) {
              case 0:
                e.preventDefault();
                dataSet = this.tableStore.dataSet;
                currentRow = this.currentRow;

                if (!(currentRow && (0, _utils.isCanEdictingRow)(currentRow))) {
                  _context9.next = 22;
                  break;
                }

                index = currentRow.dataset.index;

                if (!index) {
                  _context9.next = 20;
                  break;
                }

                record = dataSet.findRecordById(index);

                if (!record) {
                  _context9.next = 20;
                  break;
                }

                if (record.selectable) {
                  _context9.next = 12;
                  break;
                }

                this.handleKeyDownDown(e);
                _context9.next = 20;
                break;

              case 12:
                if (record.isSelected) {
                  _context9.next = 16;
                  break;
                }

                dataSet.select(record);
                _context9.next = 20;
                break;

              case 16:
                _context9.next = 18;
                return this.handleKeyDownDown(e);

              case 18:
                currentRecord = _context9.sent;

                if (currentRecord && dataSet) {
                  dataSet.select(currentRecord);
                }

              case 20:
                _context9.next = 23;
                break;

              case 22:
                this.handleKeyDownDown(e);

              case 23:
              case "end":
                return _context9.stop();
            }
          }
        }, _callee9, this);
      }));

      function handleKeyDownDownShift(_x9) {
        return _handleKeyDownDownShift.apply(this, arguments);
      }

      return handleKeyDownDownShift;
    }()
  }, {
    key: "handleKeyDownUpShift",
    value: function () {
      var _handleKeyDownUpShift = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee10(e) {
        var dataSet, currentRow, index, record, currentRecord;
        return _regenerator["default"].wrap(function _callee10$(_context10) {
          while (1) {
            switch (_context10.prev = _context10.next) {
              case 0:
                e.preventDefault();
                dataSet = this.tableStore.dataSet;
                currentRow = this.currentRow;

                if (!(currentRow && (0, _utils.isCanEdictingRow)(currentRow))) {
                  _context10.next = 22;
                  break;
                }

                index = currentRow.dataset.index;

                if (!index) {
                  _context10.next = 20;
                  break;
                }

                record = dataSet.findRecordById(index);

                if (!record) {
                  _context10.next = 20;
                  break;
                }

                if (record.selectable) {
                  _context10.next = 12;
                  break;
                }

                this.handleKeyDownUp(e);
                _context10.next = 20;
                break;

              case 12:
                if (record.isSelected) {
                  _context10.next = 16;
                  break;
                }

                dataSet.select(record);
                _context10.next = 20;
                break;

              case 16:
                _context10.next = 18;
                return this.handleKeyDownUp(e);

              case 18:
                currentRecord = _context10.sent;

                if (currentRecord) {
                  dataSet.select(currentRecord);
                }

              case 20:
                _context10.next = 23;
                break;

              case 22:
                this.handleKeyDownUp(e);

              case 23:
              case "end":
                return _context10.stop();
            }
          }
        }, _callee10, this);
      }));

      function handleKeyDownUpShift(_x10) {
        return _handleKeyDownUpShift.apply(this, arguments);
      }

      return handleKeyDownUpShift;
    }()
  }, {
    key: "handleKeyDownRight",
    value: function handleKeyDownRight(e) {
      var tableStore = this.tableStore,
          _this$props = this.props,
          expandedRowRenderer = _this$props.expandedRowRenderer,
          dataSet = _this$props.dataSet;

      if (tableStore.isTree || expandedRowRenderer) {
        var current = dataSet.current;

        if (current) {
          e.preventDefault();
          tableStore.setRowExpanded(current, true);
        }
      }
    }
  }, {
    key: "handleKeyDownLeft",
    value: function handleKeyDownLeft(e) {
      var tableStore = this.tableStore,
          _this$props2 = this.props,
          expandedRowRenderer = _this$props2.expandedRowRenderer,
          dataSet = _this$props2.dataSet;

      if (tableStore.isTree || expandedRowRenderer) {
        var current = dataSet.current;

        if (current) {
          e.preventDefault();
          tableStore.setRowExpanded(current, false);
        }
      }
    }
  }, {
    key: "getOmitPropsKeys",
    value: function getOmitPropsKeys() {
      return (0, _get2["default"])((0, _getPrototypeOf2["default"])(Table.prototype), "getOmitPropsKeys", this).call(this).concat(['columns', 'header', 'showHeader', 'footer', 'border', 'columnEditorBorder', 'selectionMode', 'rowBoxPlacement', 'alwaysShowRowBox', 'showSelectionTips', 'showSelectionCachedButton', 'showCachedSelection', 'onShowCachedSelectionChange', 'showAllPageSelectionButton', 'onRow', 'onColumnResize', 'rowRenderer', 'buttons', 'buttonsLimit', 'rowHeight', 'headerRowHeight', 'footerRowHeight', 'queryFields', 'queryFieldsLimit', 'summaryFieldsLimit', 'summaryBarFieldWidth', 'queryBar', 'queryBarProps', 'autoFocus', 'summaryBar', 'defaultRowExpanded', 'expandRowByClick', 'expandedRowRenderer', 'expandIconColumnIndex', 'indentSize', 'filter', 'mode', 'editMode', 'filterBarFieldName', 'filterBarPlaceholder', 'pagination', 'highLightRow', 'selectedHighLightRow', 'columnResizable', 'columnTitleEditable', 'pristine', 'expandIcon', 'spin', 'virtual', 'virtualCell', 'virtualSpin', 'autoWidth', 'autoHeight', 'autoFootHeight', 'useMouseBatchChoose', 'autoMaxWidth', 'dragColumnAlign', 'columnDraggable', 'rowDraggable', 'onDragEnd', 'rowDragRender', 'columnsDragRender', 'editorNextKeyEnterDown', 'onDragEndBefore', 'keyboard', 'dynamicFilterBar', 'parityRow', 'rowNumber', 'treeAsync', 'treeLoadData', 'customizable', 'customizedCode', 'dragColumn', 'dragRow', 'clientExportQuantity', 'treeQueryExpanded', 'summary', 'aggregation', 'onAggregationChange', 'showRemovedRow', 'searchCode', 'groups', 'onScrollLeft', 'onScrollTop', 'bodyExpandable', 'defaultBodyExpanded', 'bodyExpanded', 'onBodyExpanded']);
    }
  }, {
    key: "getWrapperProps",
    value: function getWrapperProps() {
      var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
      var autoWidth = this.props.autoWidth;
      var wrapperProps = (0, _objectSpread2["default"])({}, props);

      if (autoWidth) {
        var _this$tableStore2 = this.tableStore,
            columnGroups = _this$tableStore2.columnGroups,
            overflowY = _this$tableStore2.overflowY,
            border = _this$tableStore2.border;
        wrapperProps.style = {
          width: columnGroups.width + (overflowY ? (0, _measureScrollbar["default"])() : 0) + (border ? 2 : 0)
        };
      }

      return (0, _get2["default"])((0, _getPrototypeOf2["default"])(Table.prototype), "getWrapperProps", this).call(this, wrapperProps);
    }
  }, {
    key: "getOtherProps",
    value: function getOtherProps() {
      var otherProps = (0, _get2["default"])((0, _getPrototypeOf2["default"])(Table.prototype), "getOtherProps", this).call(this);
      otherProps.onKeyDown = this.handleKeyDown;
      var rowHeight = this.tableStore.rowHeight;

      if (rowHeight === 'auto') {
        delete otherProps.style;
      } else {
        otherProps.style = {
          lineHeight: (0, _UnitConvertor.pxToRem)(rowHeight)
        };
      }

      return otherProps;
    }
  }, {
    key: "getClassName",
    value: function getClassName() {
      var _get$call;

      var _this$tableStore3 = this.tableStore,
          border = _this$tableStore3.border,
          parityRow = _this$tableStore3.parityRow,
          aggregation = _this$tableStore3.aggregation,
          size = _this$tableStore3.size,
          prefixCls = this.prefixCls;
      return (0, _get2["default"])((0, _getPrototypeOf2["default"])(Table.prototype), "getClassName", this).call(this, (_get$call = {}, (0, _defineProperty2["default"])(_get$call, "".concat(prefixCls, "-").concat(size), size !== _enum3.Size["default"]), (0, _defineProperty2["default"])(_get$call, "".concat(prefixCls, "-bordered"), border), (0, _defineProperty2["default"])(_get$call, "".concat(prefixCls, "-parity-row"), parityRow), (0, _defineProperty2["default"])(_get$call, "".concat(prefixCls, "-aggregation"), aggregation), _get$call));
    }
    /**
     * 获取传入的 Spin props
     */

  }, {
    key: "getSpinProps",
    value: function getSpinProps() {
      var _this$props3 = this.props,
          spin = _this$props3.spin,
          dataSet = _this$props3.dataSet;
      if (spin && !(0, _isUndefined["default"])(spin.spinning)) return (0, _objectSpread2["default"])({}, spin);
      var loading = this.tableStore.loading;

      if (loading) {
        return (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, spin), {}, {
          spinning: true
        });
      }

      return (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, spin), {}, {
        dataSet: dataSet
      });
    }
  }, {
    key: "componentWillMount",
    value: function componentWillMount() {
      this.initDefaultExpandedRows();
    }
  }, {
    key: "componentDidMount",
    value: function componentDidMount() {
      (0, _get2["default"])((0, _getPrototypeOf2["default"])(Table.prototype), "componentDidMount", this).call(this);
      this.connect();
      this.syncSize();
      this.syncSizeInFrame();
    }
  }, {
    key: "componentDidUpdate",
    value: function componentDidUpdate() {
      var tableStore = this.tableStore;
      var currentEditorName = tableStore.currentEditorName;

      if (currentEditorName) {
        var length = tableStore.columns.length;
        var currentEditor = tableStore.editors.get(currentEditorName);

        if (currentEditor && length !== this.columnsSize) {
          this.columnsSize = length;
          currentEditor.alignEditor();
        }
      }
    }
  }, {
    key: "componentWillReceiveProps",
    value: function componentWillReceiveProps(nextProps, nextContext) {
      (0, _get2["default"])((0, _getPrototypeOf2["default"])(Table.prototype), "componentWillReceiveProps", this).call(this, nextProps, nextContext);
      this.disconnect();
      this.columnsSize = this.tableStore.columns.length;
      this.tableStore.updateProps(nextProps);
      this.connect();
    }
  }, {
    key: "componentWillUnmount",
    value: function componentWillUnmount() {
      this.disconnect();

      if (this.scrollId !== undefined) {
        _raf["default"].cancel(this.scrollId);
      }
    }
  }, {
    key: "syncParentSize",
    value: function syncParentSize(entries) {
      var _entries = (0, _slicedToArray2["default"])(entries, 1),
          entry = _entries[0];

      var height = entry.contentRect.height;
      var tableStore = this.tableStore,
          element = this.element,
          wrapper = this.wrapper;
      var wrapperHeight = wrapper.getBoundingClientRect().height;

      if (wrapperHeight !== height) {
        tableStore.parentHeight = height;
        tableStore.parentPaddingTop = element.getBoundingClientRect().top - entry.target.getBoundingClientRect().top;
      }
    }
  }, {
    key: "connect",
    value: function connect() {
      this.processDataSetListener(true);
      var _this$tableStore4 = this.tableStore,
          styleMaxHeight = _this$tableStore4.styleMaxHeight,
          styleMinHeight = _this$tableStore4.styleMinHeight,
          styleHeight = _this$tableStore4.styleHeight,
          heightType = _this$tableStore4.heightType;

      if ((0, _isString["default"])(styleHeight) && (0, _UnitConvertor.isPercentSize)(styleHeight) || (0, _isString["default"])(styleMaxHeight) && (0, _UnitConvertor.isPercentSize)(styleMaxHeight) || (0, _isString["default"])(styleMinHeight) && (0, _UnitConvertor.isPercentSize)(styleMinHeight)) {
        var wrapper = this.wrapper;

        if (wrapper) {
          var parentNode = wrapper.parentNode;

          if (parentNode) {
            var resizeObserver = new _resizeObserverPolyfill["default"](this.syncParentSize);
            resizeObserver.observe(parentNode);
            this.resizeObserver = resizeObserver;
          }
        }
      }

      if (heightType === _enum.TableHeightType.flex || (0, _isString["default"])(styleMaxHeight) && (0, _UnitConvertor.isCalcSize)(styleMaxHeight) || (0, _isString["default"])(styleMinHeight) && (0, _UnitConvertor.isCalcSize)(styleMinHeight)) {
        window.addEventListener('resize', this.handleWindowResize, false);
      }
    }
  }, {
    key: "disconnect",
    value: function disconnect() {
      var resizeObserver = this.resizeObserver;

      if (resizeObserver) {
        resizeObserver.disconnect();
        delete this.resizeObserver;
      }

      this.processDataSetListener(false);
      window.removeEventListener('resize', this.handleWindowResize, false);
    }
  }, {
    key: "processDataSetListener",
    value: function processDataSetListener(flag) {
      var _this$tableStore5 = this.tableStore,
          dataSet = _this$tableStore5.dataSet,
          inlineEdit = _this$tableStore5.inlineEdit;

      if (dataSet) {
        var handler = flag ? dataSet.addEventListener : dataSet.removeEventListener;
        handler.call(dataSet, _enum2.DataSetEvents.load, this.handleDataSetLoad);

        if (inlineEdit) {
          handler.call(dataSet, _enum2.DataSetEvents.create, this.handleDataSetCreate);
        }

        handler.call(dataSet, _enum2.DataSetEvents.validate, this.handleDataSetValidate);
        handler.call(dataSet, _enum2.DataSetEvents.validateSelf, this.handleDataSetValidateSelf);
      }
    }
  }, {
    key: "render",
    value: function render() {
      var _this$tableStore6 = this.tableStore,
          overflowX = _this$tableStore6.overflowX,
          overflowY = _this$tableStore6.overflowY,
          isAnyColumnsLeftLock = _this$tableStore6.isAnyColumnsLeftLock,
          isAnyColumnsRightLock = _this$tableStore6.isAnyColumnsRightLock,
          isFold = _this$tableStore6.isFold,
          _this$props4 = this.props,
          dataSet = _this$props4.dataSet,
          treeQueryExpanded = _this$props4.treeQueryExpanded,
          virtualSpin = _this$props4.virtualSpin,
          buttons = _this$props4.buttons,
          buttonsLimit = _this$props4.buttonsLimit,
          queryFields = _this$props4.queryFields,
          queryFieldsLimit = _this$props4.queryFieldsLimit,
          summaryFieldsLimit = _this$props4.summaryFieldsLimit,
          summaryBarFieldWidth = _this$props4.summaryBarFieldWidth,
          filterBarFieldName = _this$props4.filterBarFieldName,
          filterBarPlaceholder = _this$props4.filterBarPlaceholder,
          summaryBar = _this$props4.summaryBar,
          dynamicFilterBar = _this$props4.dynamicFilterBar,
          clientExportQuantity = _this$props4.clientExportQuantity,
          indentSize = _this$props4.indentSize,
          selectionMode = _this$props4.selectionMode,
          rowRenderer = _this$props4.rowRenderer,
          onRow = _this$props4.onRow,
          onColumnResize = _this$props4.onColumnResize,
          expandedRowRenderer = _this$props4.expandedRowRenderer,
          expandRowByClick = _this$props4.expandRowByClick,
          rowDragRender = _this$props4.rowDragRender,
          columnsDragRender = _this$props4.columnsDragRender,
          mode = _this$props4.mode,
          pristine = _this$props4.pristine,
          showSelectionCachedButton = _this$props4.showSelectionCachedButton,
          onShowCachedSelectionChange = _this$props4.onShowCachedSelectionChange,
          autoMaxWidth = _this$props4.autoMaxWidth,
          summary = _this$props4.summary,
          searchCode = _this$props4.searchCode,
          tableStore = this.tableStore,
          prefixCls = this.prefixCls;
      var content = this.getTable();
      var pagination = this.getPagination(_enum.TablePaginationPosition.top);
      var tableSpinProps = (0, _mergeProps["default"])(this.getContextConfig('tableSpinProps'), this.getSpinProps());
      var tableButtonsLimit = (0, _isNil["default"])(buttonsLimit) ? this.getContextConfig('tableButtonsLimit') : buttonsLimit;
      return /*#__PURE__*/_react["default"].createElement(_resizeObserver["default"], {
        resizeProp: "width",
        onResize: this.handleResize
      }, /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({}, this.getWrapperProps()), /*#__PURE__*/_react["default"].createElement(_TableContext.TableContextProvider, {
        code: this.code,
        prefixCls: prefixCls,
        dataSet: dataSet,
        tableStore: tableStore,
        indentSize: indentSize,
        selectionMode: selectionMode,
        onRow: onRow,
        onColumnResize: onColumnResize,
        rowRenderer: rowRenderer,
        expandedRowRenderer: expandedRowRenderer,
        expandRowByClick: expandRowByClick,
        rowDragRender: rowDragRender,
        columnsDragRender: columnsDragRender,
        showSelectionCachedButton: showSelectionCachedButton,
        onShowCachedSelectionChange: onShowCachedSelectionChange,
        autoMaxWidth: autoMaxWidth,
        pristine: pristine,
        summary: summary,
        virtualSpin: virtualSpin,
        spinProps: tableSpinProps,
        isTree: mode === _enum.TableMode.tree
      }, !isFold && this.getHeader(), /*#__PURE__*/_react["default"].createElement(_queryBar["default"], {
        buttons: buttons,
        buttonsLimit: tableButtonsLimit,
        pagination: pagination,
        queryFields: queryFields,
        clientExportQuantity: clientExportQuantity,
        summaryBar: summaryBar,
        dynamicFilterBar: dynamicFilterBar,
        queryFieldsLimit: queryFieldsLimit,
        summaryBarFieldWidth: summaryBarFieldWidth,
        summaryFieldsLimit: summaryFieldsLimit,
        filterBarFieldName: filterBarFieldName,
        filterBarPlaceholder: filterBarPlaceholder,
        treeQueryExpanded: treeQueryExpanded,
        searchCode: searchCode
      }), !isFold && /*#__PURE__*/_react["default"].createElement(_ErrorBar["default"], {
        dataSet: dataSet,
        prefixCls: prefixCls
      }), !isFold && /*#__PURE__*/_react["default"].createElement(_spin["default"], (0, _extends2["default"])({}, tableSpinProps, {
        key: "content"
      }), /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({}, this.getOtherProps()), /*#__PURE__*/_react["default"].createElement("div", {
        className: (0, _classnames["default"])("".concat(prefixCls, "-content"), (0, _defineProperty2["default"])({}, "".concat(prefixCls, "-content-overflow"), (0, _utils.isStickySupport)() && overflowX && !overflowY)),
        ref: this.saveContentRef,
        onScroll: this.handleBodyScroll
      }, !(0, _utils.isStickySupport)() && isAnyColumnsLeftLock && overflowX && this.getLeftFixedTable(), content, !(0, _utils.isStickySupport)() && isAnyColumnsRightLock && overflowX && this.getRightFixedTable()), (0, _utils.isStickySupport)() && overflowX && /*#__PURE__*/_react["default"].createElement(_StickyShadow["default"], {
        position: "left"
      }), (0, _utils.isStickySupport)() && overflowX && /*#__PURE__*/_react["default"].createElement(_StickyShadow["default"], {
        position: "right"
      }), /*#__PURE__*/_react["default"].createElement("div", {
        ref: this.saveResizeRef,
        className: "".concat(prefixCls, "-split-line")
      }))), !isFold && this.getFooter(), !isFold && this.getPagination(_enum.TablePaginationPosition.bottom))));
    }
  }, {
    key: "reorderDataSet",
    value: function reorderDataSet(startIndex, endIndex) {
      var dataSet = this.tableStore.dataSet;
      dataSet.move(startIndex, endIndex);
    }
    /**
     * 触发组合或拖拽排序, 移除原纪录
     * @param currentRecord
     */

  }, {
    key: "removeSourceRecord",
    value: function removeSourceRecord(currentRecord) {
      var parent = currentRecord.parent;

      if (parent) {
        var children = parent.children;

        if (children) {
          var index = children.indexOf(currentRecord);

          if (index !== -1) {
            children.splice(index, 1);
          }

          if (!children.length) {
            parent.children = undefined;
          }
        }
      }
    }
  }, {
    key: "handleDragStart",
    value: function handleDragStart(initial, provided) {
      var dragDropContextProps = this.props.dragDropContextProps;
      var _this$tableStore7 = this.tableStore,
          rowMetaData = _this$tableStore7.rowMetaData,
          isTree = _this$tableStore7.isTree;

      if (isTree && rowMetaData) {
        var source = initial.source;
        var currentRecord = rowMetaData[source.index].record;

        if (currentRecord.children && currentRecord.children.length) {
          currentRecord.isExpanded = false;
        }
      }

      if (dragDropContextProps && dragDropContextProps.onDragStart) {
        dragDropContextProps.onDragStart(initial, provided);
      }
    }
  }, {
    key: "handleDragEnd",
    value: function handleDragEnd(resultDrag, provided) {
      var _this$tableStore8 = this.tableStore,
          dataSet = _this$tableStore8.dataSet,
          rowMetaData = _this$tableStore8.rowMetaData,
          isTree = _this$tableStore8.isTree;
      var _dataSet$props = dataSet.props,
          parentField = _dataSet$props.parentField,
          idField = _dataSet$props.idField,
          childrenField = _dataSet$props.childrenField;
      var _this$props5 = this.props,
          onDragEnd = _this$props5.onDragEnd,
          onDragEndBefore = _this$props5.onDragEndBefore,
          dragDropContextProps = _this$props5.dragDropContextProps;
      var resultBefore = resultDrag;

      if (onDragEndBefore) {
        var result = onDragEndBefore(this.tableStore.dataSet, (0, _mobx.toJS)(this.tableStore.columns), resultDrag, provided);

        if (result === false) {
          return;
        }

        if ((0, _utils.isDropresult)(result)) {
          resultBefore = result;
        }