CommonShowTable.js 1.92 KB
import React, { Component } from 'react';
import { Table } from 'antd';
// import * as config from '../../utils/config';
import styles from '../../index.less';

class CommonShowTable extends Component {
  constructor(props) {
    super(props);
    this.state = {
      loadColumn: [],
      loadData: [],
      // ReturnFieldName:props.ReturnFieldName,
      currentKey: props.currentKey, /* 选中当前的行 */
    };
  }

  componentWillMount() {
    /* 获取表数据 */
    this.assignmentWillProps(this.props);
  }

  componentWillReceiveProps(nextProps) {
    this.assignmentWillProps(nextProps);
  }

  assignmentWillProps = (props) => {
    const { name } = props;
    const { [`${name}Column`]: headerColumn, [`${name}Data`]: returnData } = props;
    const showColumn = [];
    if (headerColumn !== undefined) {
      headerColumn.forEach((item) => {
        showColumn.push({
          title: item.showName,
          dataIndex: item.sName,
          key: item.sName,
        });
      });
    }
    this.setState({ loadColumn: headerColumn === undefined ? [] : showColumn, loadData: returnData === undefined ? [] : returnData });
  }

  handleClick = (record) => {
    /*  const { sReturnFieldName } = this.props;
    const key = record[sReturnFieldName];
    console.log('key: ', key); */
    this.props.onRowSelect(this.props.name, record);
  };

  render() {
    const { loadColumn, loadData, currentKey } = this.state;

    return (
      <Table
        bordered
        columns={loadColumn}
        dataSource={loadData}
        size="small"
        pagination={false}
        scroll={{ y: 220 }}
        onRow={(record) => {
          return { onClick: () => { this.handleClick(record); } };
        }}
        rowClassName={(record) => {
          if (record.key === currentKey) {
            return `${styles.clickRow}`;
          } else {
            return '';
          }
        }}
      />
    );
  }
}

export default CommonShowTable;