choerodon-ui/es/rc-components/table/BaseTable.js

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

import _extends from "@babel/runtime/helpers/extends";
import _objectSpread from "@babel/runtime/helpers/objectSpread2";
import React, { useCallback, useContext } from 'react';
import { connect } from 'mini-store';
import classNames from 'classnames';
import ColGroup from './ColGroup';
import TableHeader from './TableHeader';
import TableFooter from './TableFooter';
import TableRow from './TableRow';
import ExpandableRow from './ExpandableRow';
import TableContext from './TableContext';

var BaseTable = function BaseTable(props) {
  var table = useContext(TableContext);
  var columnManager = table.columnManager,
      components = table.components;
  var _table$props = table.props,
      prefixCls = _table$props.prefixCls,
      scroll = _table$props.scroll,
      data = _table$props.data,
      getBodyWrapper = _table$props.getBodyWrapper,
      childrenColumnName = _table$props.childrenColumnName,
      rowClassName = _table$props.rowClassName,
      rowRef = _table$props.rowRef,
      onRowClick = _table$props.onRowClick,
      onRowDoubleClick = _table$props.onRowDoubleClick,
      onRowContextMenu = _table$props.onRowContextMenu,
      onRowMouseEnter = _table$props.onRowMouseEnter,
      onRowMouseLeave = _table$props.onRowMouseLeave,
      onRow = _table$props.onRow;
  var store = props.store,
      expander = props.expander,
      tableClassName = props.tableClassName,
      hasHead = props.hasHead,
      hasBody = props.hasBody,
      hasFoot = props.hasFoot,
      fixed = props.fixed,
      getRowKey = props.getRowKey,
      isAnyColumnsFixed = props.isAnyColumnsFixed;
  var tableStyle = {};

  var getColumns = function getColumns() {
    var cols = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : props.columns || [];
    return cols.map(function (column) {
      return _objectSpread(_objectSpread({}, column), {}, {
        className: !!column.fixed && !fixed ? classNames("".concat(prefixCls, "-fixed-columns-in-body"), column.className) : column.className
      });
    });
  };

  var handleRowHover = useCallback(function (isHover, key) {
    store.setState({
      currentHoverKey: isHover ? key : null
    });
  }, [store]);

  var renderRows = function renderRows(renderData, indent) {
    var rows = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
    var ancestorKeys = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : [];

    var _loop = function _loop(i) {
      var record = renderData[i];
      var key = getRowKey(record, i);
      var className = typeof rowClassName === 'string' ? rowClassName : rowClassName(record, i, indent);
      var onHoverProps = {};

      if (columnManager.isAnyColumnsFixed()) {
        onHoverProps.onHover = handleRowHover;
      }

      var leafColumns = void 0;

      if (fixed === 'left') {
        leafColumns = columnManager.leftLeafColumns();
      } else if (fixed === 'right') {
        leafColumns = columnManager.rightLeafColumns();
      } else {
        leafColumns = getColumns(columnManager.leafColumns());
      }

      var rowPrefixCls = "".concat(prefixCls, "-row");
      var rowIndex = rows.filter(function (row) {
        return !row.props.expandedRow;
      }).length;
      var row = /*#__PURE__*/React.createElement(ExpandableRow, _extends({}, expander.props, {
        fixed: fixed,
        index: rowIndex,
        prefixCls: rowPrefixCls,
        record: record,
        key: key,
        rowKey: key,
        onRowClick: onRowClick,
        needIndentSpaced: expander.needIndentSpaced,
        onExpandedChange: expander.handleExpandChange
      }), function (expandableRow) {
        return (
          /*#__PURE__*/
          // eslint-disable-line
          React.createElement(TableRow, _extends({
            fixed: fixed,
            indent: indent,
            className: className,
            record: record,
            index: rowIndex,
            prefixCls: rowPrefixCls,
            childrenColumnName: childrenColumnName,
            columns: leafColumns,
            onRow: onRow,
            onRowDoubleClick: onRowDoubleClick,
            onRowContextMenu: onRowContextMenu,
            onRowMouseEnter: onRowMouseEnter,
            onRowMouseLeave: onRowMouseLeave
          }, onHoverProps, {
            rowKey: key,
            ancestorKeys: ancestorKeys,
            ref: rowRef(record, i, indent),
            components: components,
            isAnyColumnsFixed: isAnyColumnsFixed
          }, expandableRow))
        );
      });
      rows.push(row);
      expander.renderRows(renderRows, rows, record, i, indent, fixed, key, ancestorKeys);
    };

    for (var i = 0; i < renderData.length; i++) {
      _loop(i);
    }

    return rows;
  };

  if (!fixed && scroll.x) {
    // not set width, then use content fixed width
    if (scroll.x === true) {
      tableStyle.tableLayout = 'fixed';
    } else {
      tableStyle.width = scroll.x;
    }
  }

  var Table = hasBody ? components.table : 'table';
  var BodyWrapper = components.body.wrapper;
  var body;

  if (hasBody) {
    body = /*#__PURE__*/React.createElement(BodyWrapper, {
      className: "".concat(prefixCls, "-tbody")
    }, renderRows(data, 0));

    if (getBodyWrapper) {
      body = getBodyWrapper(body);
    }
  }

  var columns = getColumns();
  return /*#__PURE__*/React.createElement(Table, {
    className: tableClassName,
    style: tableStyle,
    key: "table"
  }, /*#__PURE__*/React.createElement(ColGroup, {
    columns: columns,
    fixed: fixed
  }), hasHead && /*#__PURE__*/React.createElement(TableHeader, {
    expander: expander,
    columns: columns,
    fixed: fixed
  }), body, hasFoot && /*#__PURE__*/React.createElement(TableFooter, {
    onHover: handleRowHover,
    columns: columns,
    fixed: fixed
  }));
};

export default connect()(BaseTable);
//# sourceMappingURL=BaseTable.js.map