import React from "react";
import { WeaDialog, WeaTable } from "ecCom";

export default class LedgerSalaryItemPreviewModal extends React.Component {
  getColumns = () => {
    const { empFields, itemGroups } = this.props;
    let columns = [];
    let length = 0;
    empFields.map(item => {
      columns.push({
        title: item.fieldName,
        key: item.fieldId,
        width: 150
      });
      length++;
    });

    itemGroups.map(item => {
      if (item.id !== "default") {
        let columnItem = {
          title: item.name,
          children: item.items.map(i => {
            return {
              title: i.name,
              key: i.id,
              width: 150
            };
            length++;
          })
        };
        columns.push(columnItem);
      }
    });

    itemGroups.map(item => {
      if (item.id === "default") {
        item.items.map(i => {
          columns.push({
            title: i.name,
            key: i.id,
            width: 150
          });
          length++;
        });
      }
    });
    return { columns, length };
  };

  render() {
    const { onCancel, visible } = this.props;
    return (
      <WeaDialog
        visible={visible}
        title="预览"
        style={{ width: "80vw", height: 200 }}
        onCancel={onCancel}
      >
        <WeaTable columns={this.getColumns().columns} dataSource={[]} scroll={{ x: this.getColumns().length * 150 }}/>
      </WeaDialog>
    );
  }
}