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

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

import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _extends from "@babel/runtime/helpers/extends";
import React, { useCallback, useContext } from 'react';
import { observer } from 'mobx-react-lite';
import { action, get, set } from 'mobx';
import classNames from 'classnames';
import measureScrollbar from '../../../es/_util/measureScrollbar';
import { pxToRem } from '../../../es/_util/UnitConvertor';
import TableContext from './TableContext';
import { ColumnLock, DragColumnAlign } from './enum';
import TableFooterCell from './TableFooterCell';
import { isStickySupport } from './utils';
import ResizeObservedRow from './ResizeObservedRow';
import { CUSTOMIZED_KEY } from './TableStore';

var TableFooter = function TableFooter(props) {
  var lock = props.lock,
      columnGroups = props.columnGroups;

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

  var overflowX = tableStore.overflowX;
  var handleResize = useCallback(action(function (index, height) {
    set(tableStore.lockColumnsFootRowsHeight, index, height);
  }), [tableStore]);

  var getTds = function getTds() {
    var customizable = tableStore.customizable,
        rowDraggable = tableStore.rowDraggable,
        dragColumnAlign = tableStore.dragColumnAlign;
    var hasPlaceholder = lock !== ColumnLock.left && tableStore.overflowY;
    var right = hasPlaceholder ? measureScrollbar() : 0;
    var tds = columnGroups.leafs.map(function (columnGroup, index, cols) {
      var key = columnGroup.key;

      if (key !== CUSTOMIZED_KEY) {
        var colSpan = customizable && lock !== ColumnLock.left && (!rowDraggable || dragColumnAlign !== DragColumnAlign.right) && index === cols.length - 2 ? 2 : 1;
        var cellProps = {};

        if (colSpan > 1) {
          cellProps.colSpan = colSpan;
        }

        return /*#__PURE__*/React.createElement(TableFooterCell, _extends({
          key: key,
          columnGroup: columnGroup,
          right: right
        }, cellProps));
      }

      return undefined;
    });
    var useEmptyColumn = !fullColumnWidth && lock !== ColumnLock.left && !tableStore.overflowX && !tableStore.hasEmptyWidthColumn;

    if (useEmptyColumn) {
      tds.push( /*#__PURE__*/React.createElement("th", {
        key: "empty-column",
        className: "".concat(prefixCls, "-cell"),
        style: {
          lineHeight: 1
        }
      }));
    }

    if (hasPlaceholder) {
      var placeHolderProps = {
        key: 'fixed-column',
        style: {
          lineHeight: 1
        }
      };
      var classList = ["".concat(prefixCls, "-cell")];

      if (isStickySupport() && overflowX) {
        placeHolderProps.style = {
          right: 0
        };
        classList.push("".concat(prefixCls, "-cell-fix-right"));
      }

      placeHolderProps.className = classList.join(' ');
      tds.push( /*#__PURE__*/React.createElement("th", _extends({}, placeHolderProps), "\xA0"));
    }

    return tds;
  };

  var style = !isStickySupport() && lock && (rowHeight === 'auto' || tableStore.autoFootHeight) ? {
    height: pxToRem(get(tableStore.lockColumnsFootRowsHeight, 0), true)
  } : undefined;
  var tr = /*#__PURE__*/React.createElement("tr", {
    style: style
  }, getTds());
  var classString = classNames("".concat(prefixCls, "-tfoot"), _defineProperty({}, "".concat(prefixCls, "-tfoot-bordered"), overflowX));
  return /*#__PURE__*/React.createElement("tfoot", {
    className: classString
  }, !isStickySupport() && !lock && (rowHeight === 'auto' || tableStore.autoFootHeight) ? /*#__PURE__*/React.createElement(ResizeObservedRow, {
    onResize: handleResize,
    rowIndex: 0
  }, tr) : tr);
};

TableFooter.displayName = 'TableFooter';
export default observer(TableFooter);
//# sourceMappingURL=TableFooter.js.map