choerodon-ui/pro/es/table/TableBody.js

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

import _objectSpread from "@babel/runtime/helpers/objectSpread2";
import React, { useContext } from 'react';
import { observer } from 'mobx-react-lite';
import { pxToRem } from '../../../es/_util/UnitConvertor';
import measureScrollbar from '../../../es/_util/measureScrollbar';
import TableContext from './TableContext';
import { ColumnLock, TableAutoHeightType } from './enum';
var TableBody = observer(function TableBody(props) {
  var children = props.children,
      lock = props.lock,
      onScroll = props.onScroll,
      style = props.style,
      getRef = props.getRef;

  var _useContext = useContext(TableContext),
      prefixCls = _useContext.prefixCls,
      tableStore = _useContext.tableStore;

  var hasFooter = tableStore.hasFooter,
      overflowY = tableStore.overflowY,
      overflowX = tableStore.overflowX; // const saveRef = useCallback((node: HTMLDivElement | null) => {
  //   const { getRef } = this.props;
  //   if (getRef) {
  //     getRef(node);
  //   }
  //   // this.element = node;
  // },[getRef])
  //   componentDidUpdate(): void {
  //     const { element } = this;
  //   if (element) {
  //     const { scrollHeight, clientHeight } = element;
  //     // Fixed vertical scrollbar not displayed in Chrome when scrollHeight - clientHeight < scrollbarHeight
  //     if (scrollHeight > clientHeight && scrollHeight - clientHeight < measureScrollbar()) {
  //       const { overflow } = element.style;
  //       element.style.overflow = 'scroll';
  //       raf(() => {
  //         element.style.overflow = overflow;
  //       });
  //     }
  //   }
  // }

  var getHeightStyle = function getHeightStyle() {
    if (!tableStore.customized.heightType) {
      var autoHeight = tableStore.autoHeight;

      if (autoHeight && autoHeight.type === TableAutoHeightType.maxHeight) {
        return undefined;
      }
    }

    return tableStore.height;
  };

  var fixedLeft = lock === true || lock === ColumnLock.left;
  var scrollbar = measureScrollbar();
  var hasFooterAndNotLock = !lock && hasFooter && overflowX && scrollbar;
  var height = getHeightStyle();
  var hasLockAndNoFooter = lock && !hasFooter && overflowX && height !== undefined && scrollbar;
  var tableBody = React.createElement("div", {
    ref: getRef,
    className: "".concat(prefixCls, "-body"),
    style: _objectSpread({}, height === undefined ? style : {}, {
      height: pxToRem(hasFooterAndNotLock && height !== undefined ? height + scrollbar : hasLockAndNoFooter && height !== undefined ? height - scrollbar : height),
      marginBottom: hasFooterAndNotLock ? pxToRem(-scrollbar) : undefined,
      width: fixedLeft ? pxToRem(tableStore.leftColumnGroups.width + (scrollbar || 20)) : lock === ColumnLock.right ? pxToRem(tableStore.rightColumnGroups.width - 1 + (overflowY ? scrollbar : 0)) : undefined,
      marginLeft: lock === ColumnLock.right ? pxToRem(1) : undefined
    }),
    onScroll: onScroll
  }, children);

  if (fixedLeft) {
    return React.createElement("div", {
      className: "".concat(prefixCls, "-body-wrapper"),
      style: {
        width: pxToRem(tableStore.leftColumnGroups.width)
      }
    }, tableBody);
  }

  return tableBody;
});
TableBody.displayName = 'TableBody';
export default TableBody;
//# sourceMappingURL=TableBody.js.map