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

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

import _extends from "@babel/runtime/helpers/extends";
import _typeof from "@babel/runtime/helpers/typeof";
import _objectSpread from "@babel/runtime/helpers/objectSpread2";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import React, { useContext, useMemo } from 'react';
import { observer } from 'mobx-react-lite';
import omit from 'lodash/omit';
import classNames from 'classnames';
import { pxToRem } from '../../../es/_util/UnitConvertor';
import TableContext from './TableContext';
import { getColumnLock, isStickySupport } from './utils';
import { ColumnAlign, ColumnLock } from './enum';
import TableCellInner from './TableCellInner';
import { groupedAggregationTree } from './AggregationTree';

var TableFooterCell = function TableFooterCell(props) {
  var _classNames;

  var columnGroup = props.columnGroup,
      style = props.style,
      className = props.className,
      colSpan = props.colSpan,
      right = props.right;

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

  var column = columnGroup.column;
  var autoFootHeight = tableStore.autoFootHeight,
      footerRowHeight = tableStore.footerRowHeight,
      aggregation = tableStore.aggregation;
  var footer = column.footer,
      footerClassName = column.footerClassName,
      _column$footerStyle = column.footerStyle,
      footerStyle = _column$footerStyle === void 0 ? {} : _column$footerStyle,
      align = column.align,
      name = column.name,
      command = column.command,
      lock = column.lock;
  var columnLock = isStickySupport() && tableStore.overflowX && getColumnLock(lock);
  var classString = classNames("".concat(prefixCls, "-cell"), (_classNames = {}, _defineProperty(_classNames, "".concat(prefixCls, "-cell-fix-").concat(columnLock), columnLock), _defineProperty(_classNames, "".concat(prefixCls, "-cell-no-transition"), !tableStore.tableColumnResizeTransition), _classNames), className, footerClassName);
  var innerClassNames = ["".concat(prefixCls, "-cell-inner")];
  var innerProps = {};

  if (!autoFootHeight) {
    var $rowHeight = footerRowHeight === undefined ? rowHeight : footerRowHeight;

    if ($rowHeight !== 'auto') {
      innerProps.style = {
        height: pxToRem($rowHeight)
      };
      innerClassNames.push("".concat(prefixCls, "-cell-inner-row-height-fixed"));
    }
  }

  var cellStyle = _objectSpread(_objectSpread({
    textAlign: align || (command ? ColumnAlign.center : tableStore.getConfig('tableColumnAlign')(column, dataSet.getField(name)))
  }, footerStyle), style);

  var aggregationTree = useMemo(function () {
    if (aggregation) {
      var $column = columnGroup.column,
          headerGroup = columnGroup.headerGroup;

      if (headerGroup) {
        var tableGroup = columnGroup.tableGroup;

        if (tableGroup) {
          var columnProps = tableGroup.columnProps;
          var totalRecords = headerGroup.totalRecords;

          if (columnProps && totalRecords.length) {
            var children = columnProps.children;

            if (children && children.length) {
              var renderer = function renderer(_ref) {
                var colGroup = _ref.colGroup,
                    style = _ref.style;
                return /*#__PURE__*/React.createElement(TableCellInner, {
                  record: totalRecords[0],
                  column: colGroup.column,
                  style: style,
                  inAggregation: true
                });
              };

              return groupedAggregationTree({
                columns: children,
                headerGroup: headerGroup,
                column: _objectSpread(_objectSpread({}, $column), columnProps),
                renderer: renderer
              });
            }
          }
        }
      }
    }
  }, [columnGroup, aggregation]);

  if (columnLock) {
    if (columnLock === ColumnLock.left) {
      cellStyle.left = pxToRem(columnGroup.left, true);
    } else if (columnLock === ColumnLock.right) {
      cellStyle.right = pxToRem(colSpan && colSpan > 1 ? right : columnGroup.right + right, true);
    }
  }

  var getFooter = function getFooter() {
    switch (_typeof(footer)) {
      case 'function':
        {
          var footerHookOptions = {
            dataSet: dataSet,
            name: name,
            aggregationTree: aggregationTree
          };

          try {
            return footer(footerHookOptions);
          } catch (e) {
            return footer(dataSet, name);
          }
        }

      case 'string':
        return /*#__PURE__*/React.createElement("span", null, footer);

      default:
        return footer;
    }
  };

  return /*#__PURE__*/React.createElement("th", {
    className: classString,
    style: omit(cellStyle, ['width', 'height']),
    colSpan: colSpan,
    scope: "col"
  }, /*#__PURE__*/React.createElement("div", _extends({}, innerProps, {
    className: innerClassNames.join(' ')
  }), getFooter()));
};

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