choerodon-ui/lib/rc-components/table/BodyTable.js

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

"use strict";

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

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

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

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

var _propTypes = _interopRequireDefault(require("prop-types"));

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

var _BaseTable = _interopRequireDefault(require("./BaseTable"));

function BodyTable(props, _ref) {
  var table = _ref.table;
  var _table$props = table.props,
      prefixCls = _table$props.prefixCls,
      scroll = _table$props.scroll;
  var columns = props.columns,
      fixed = props.fixed,
      tableClassName = props.tableClassName,
      getRowKey = props.getRowKey,
      handleBodyScroll = props.handleBodyScroll,
      expander = props.expander,
      isAnyColumnsFixed = props.isAnyColumnsFixed;
  var saveRef = table.saveRef,
      columnManager = table.columnManager;
  var useFixedHeader = table.props.useFixedHeader;
  var bodyStyle = (0, _objectSpread2["default"])({}, table.props.bodyStyle);
  var innerBodyStyle = {};

  if (scroll.x || fixed) {
    bodyStyle.overflowX = bodyStyle.overflowX || 'auto'; // Fix weired webkit render bug

    bodyStyle.WebkitTransform = 'translate3d (0, 0, 0)';
  }

  if (scroll.y) {
    // maxHeight will make fixed-Table scrolling not working
    // so we only set maxHeight to body-Table here
    if (fixed) {
      innerBodyStyle.maxHeight = bodyStyle.maxHeight || scroll.y;
      innerBodyStyle.overflowY = bodyStyle.overflowY || 'scroll';
    } else {
      bodyStyle.maxHeight = bodyStyle.maxHeight || scroll.y;
    }

    bodyStyle.overflowY = bodyStyle.overflowY || 'scroll';
    useFixedHeader = true; // Add negative margin bottom for scroll bar overflow bug

    var scrollbarWidth = (0, _measureScrollbar["default"])();

    if (scrollbarWidth > 0 && fixed) {
      bodyStyle.marginBottom = "-".concat(scrollbarWidth, "px");
      bodyStyle.paddingBottom = '0px';
    }
  }

  var hasFoot = !useFixedHeader && columnManager.hasFooter();

  var baseTable = _react["default"].createElement(_BaseTable["default"], {
    tableClassName: tableClassName,
    hasHead: !useFixedHeader,
    hasBody: true,
    hasFoot: hasFoot,
    fixed: fixed,
    columns: columns,
    expander: expander,
    getRowKey: getRowKey,
    isAnyColumnsFixed: isAnyColumnsFixed
  });

  if (fixed && columns.length) {
    var refName;

    if (columns[0].fixed === 'left' || columns[0].fixed === true) {
      refName = 'fixedColumnsBodyLeft';
    } else if (columns[0].fixed === 'right') {
      refName = 'fixedColumnsBodyRight';
    }

    delete bodyStyle.overflowX;
    delete bodyStyle.overflowY;
    return _react["default"].createElement("div", {
      key: "bodyTable",
      className: "".concat(prefixCls, "-body-outer"),
      style: (0, _objectSpread2["default"])({}, bodyStyle)
    }, _react["default"].createElement("div", {
      className: "".concat(prefixCls, "-body-inner"),
      style: innerBodyStyle,
      ref: saveRef(refName),
      onScroll: handleBodyScroll
    }, baseTable));
  }

  return _react["default"].createElement("div", {
    key: "bodyTable",
    className: "".concat(prefixCls, "-body"),
    style: bodyStyle,
    ref: saveRef('bodyTable'),
    onScroll: handleBodyScroll
  }, baseTable);
}

BodyTable.propTypes = {
  fixed: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].bool]),
  columns: _propTypes["default"].array.isRequired,
  tableClassName: _propTypes["default"].string.isRequired,
  handleBodyScroll: _propTypes["default"].func.isRequired,
  getRowKey: _propTypes["default"].func.isRequired,
  expander: _propTypes["default"].object.isRequired,
  isAnyColumnsFixed: _propTypes["default"].bool
};
BodyTable.contextTypes = {
  table: _propTypes["default"].any
};
//# sourceMappingURL=BodyTable.js.map