import React, { Component } from 'react';
import { Card, Table } from 'antd';
import { renderProductType } from '../../utils/utils';
import styles from './CourseItem.less';

class PackageItem extends Component {
  render() {
    const { products } = this.props;
    const packageColumns = [{
      title: '产品编号',
      dataIndex: 'code',
      key: 1,
      width: '40%',
    }, {
      title: '产品名称',
      dataIndex: 'name',
      key: 2,
      width: '40%',
    }, {
      title: '产品类型',
      dataIndex: 'type',
      key: 3,
      width: '20%',
      render: text => renderProductType(text),
    }];
    return (
      <Card title="套餐包内容" style={{ height: 450, marginBottom: 16 }}>
        <Table
          pagination={false}
          rowKey={record => record.id}
          dataSource={products}
          columns={packageColumns}
          scroll={{ y: 300 }}
          className={styles.dataTable}
        />
      </Card>
    );
  }
}
export default PackageItem;