/*
 * Author: 黎永顺
 * name: 薪资项目表格
 * Description:
 * Date: 2023/5/16
 */
import React, { Component } from "react";
import { WeaHelpfulTip, WeaInput, WeaInputNumber, WeaLocaleProvider, WeaSearchGroup, WeaTable } from "ecCom";

const { getLabel } = WeaLocaleProvider;

class PayrollItemsTable extends Component {
  render() {
    const {
      salarySobItemGroupId,
      salarySobItemGroupName,
      salaryItems: dataSource,
      onChangeIssueReissueValue
    } = this.props;
    const columns = [
      {
        dataIndex: "salaryItemName",
        title: getLabel(111, "薪资项目"),
        width: "15%",
        render: (text) => {
          return <span className="tdEllipsis" title={text}>{text}</span>;
        }
      },
      {
        dataIndex: "resultValue",
        title: <span>
          <span style={{ marginRight: 8 }}>{getLabel(111, "项目值")}</span>
          <WeaHelpfulTip
            title={getLabel(111, "1.若薪资项目有公式，手动编辑项目值后，则默认将手动编辑的项目值锁定；点击锁定图标，解锁手动编辑的项目值，公式生效，点击保存按照公式重新核算；重新核算后，不显示解锁图标。")}
            placement="top" width={250}
          />
        </span>,
        width: "20%",
        render: (text, record) => {
          const { canEdit, dataType, pattern } = record;
          return dataType === "number" ? <WeaInputNumber
            disabled={!canEdit}
            precision={pattern || 2}
            value={text || 0}
            onChange={(value) => onChangeIssueReissueValue(record.salaryItemId, value, "itemsByGroup", salarySobItemGroupId)}
          /> : <WeaInput
            disabled={!canEdit}
            value={text}
            onChange={(value) => onChangeIssueReissueValue(record.salaryItemId, value, "itemsByGroup", salarySobItemGroupId)}
          />;
        }
      },
      {
        dataIndex: "itemFormulaContent",
        title: <span>
          <span style={{ marginRight: 8 }}>{getLabel(111, "核算公式")}</span>
          <WeaHelpfulTip
            title={getLabel(111, "若薪资项目有公式，且项目值手动编辑修改过并点击锁定图标，则公式失效；若解除锁定，则项目公式重新生效；")}
            placement="top" width={250}
          />
        </span>,
        width: "65%",
        render: (text, record) => {
          return <span className="tdEllipsis" title={text}>{_.isNil(text) ? "输入" : text}</span>;
        }
      }
    ];
    return (
      <WeaSearchGroup title={salarySobItemGroupName} showGroup needTigger>
        <WeaTable
          rowKey="salaryItemId"
          dataSource={dataSource}
          columns={columns}
          bordered
          pagination={false}
        />
      </WeaSearchGroup>
    );
  }
}

export default PayrollItemsTable;