zarm-web/es/table/Head.js

基于 React 的桌面端UI库

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

import React, { Component } from 'react';
import Sorter from './Sorter';

class Head extends Component {
  constructor(...args) {
    super(...args);
    this.thead = void 0;
    this.leftCell = void 0;
    this.rightCell = void 0;
  }

  // 排序渲染
  renderSorter(column) {
    const {
      prefixCls,
      sort,
      onSort
    } = this.props;
    return React.createElement(Sorter, {
      prefixCls: prefixCls,
      sort: sort,
      onSort: onSort,
      column: column
    });
  } // 表头列渲染


  renderColumn(column, index, rowIndex, length) {
    const render = 'columnRender' in column ? column.columnRender(column, index) : column.title;
    const {
      dataIndex,
      width,
      rowSpan,
      colSpan,
      style = {}
    } = column;
    let refAttr = {};

    if (rowIndex === 0) {
      if (index === 0) {
        refAttr = {
          ref: leftCell => {
            this.leftCell = leftCell;
          }
        };
      } else if (index === length - 1) {
        refAttr = {
          ref: rightCell => {
            this.rightCell = rightCell;
          }
        };
      }
    }

    return React.createElement("th", _extends({
      key: dataIndex + index,
      rowSpan: rowSpan,
      colSpan: colSpan,
      style: _objectSpread({}, style, {
        width
      })
    }, refAttr), render, this.renderSorter(column));
  }

  renderExpandIconPlaceholder() {
    const {
      expandedRowRender
    } = this.props;

    if (expandedRowRender) {
      return React.createElement("th", {
        key: "expand-icon"
      }, React.createElement("span", null));
    }
  }

  render() {
    const {
      rows,
      renderSelectAll,
      rowSelection,
      dataSource
    } = this.props;
    const headRows = rows.map((row, index) => {
      return React.createElement("tr", {
        key: +index
      }, this.renderExpandIconPlaceholder(), rowSelection && index === 0 ? renderSelectAll(rowSelection, dataSource, rows.length) : null, row.map((column, columnIndex) => this.renderColumn(column, columnIndex, index, row.length)));
    });
    return React.createElement("thead", {
      ref: thead => {
        this.thead = thead;
      }
    }, headRows);
  }

}

export default Head;