/*
 * Author: 黎永顺
 * name: 回算薪资项目
 * Description:
 * Date: 2022/12/13
 */
import React, { Component } from "react";
import { WeaHelpfulTip, WeaSearchGroup } from "ecCom";
import LedgerBackCalculatedSalaryItemTable from "./LedgerBackCalculatedSalaryItemTable";
import { getAggregate } from "../../../apis/ledger";
import "./index.less";

class LedgerBackCalculatedSalaryItem extends Component {
  constructor(props) {
    super(props);
    this.state = {
      backCalcItems: [
        {
          key: "issuedItems",
          label: "已发项目设置",
          dataSource: [],
          helpContent: [
            "核算时，已发项目的公式中各项目值均取该项目在该账套核算中的最后一次核算值；",
            "已发项目的公式设置，只可在【取最后一次核算值的项目】中选择；"
          ]
        },
        {
          key: "reissueItems",
          label: "补发项目设置",
          dataSource: [],
          helpContent: [
            "系统内置补发项目【补发薪资合计】，可新增其他的项目，如【补发备注】等；",
            "公式取值为当次回算的核算值。"
          ]
        }
      ]
    };
  }

  componentDidMount() {
    this.getAggregate();
  }

  getAggregate = () => {
    const { editId: salarySobId, saveSalarySobId } = this.props;
    const { backCalcItems } = this.state;
    getAggregate({ salarySobId: salarySobId || saveSalarySobId }).then(({ status, data }) => {
      if (status) {
        this.setState({
          backCalcItems: _.map(backCalcItems, item => {
            const { key } = item;
            return {
              ...item,
              dataSource: data[key]
            };
          })
        });
      }
    });
  };

  render() {
    const { backCalcItems } = this.state;
    return (
      <div className="ledgerBackCalculatedSalaryItemWrapper">
        {
          _.map(backCalcItems, item => {
            const { key, label, helpContent, dataSource } = item;
            return (
              <WeaSearchGroup
                key={key}
                needTigger
                title={
                  <TitleComp title={label} helpContent={helpContent}/>
                }
                showGroup
              >
                <LedgerBackCalculatedSalaryItemTable
                  {...this.props} dataSource={dataSource}
                  key={key} onRefresh={this.getAggregate}
                />
              </WeaSearchGroup>);
          })
        }
      </div>
    );
  }
}

export default LedgerBackCalculatedSalaryItem;

const TitleComp = (props) => {
  const helpContent = _.map(props.helpContent, (it, idx) => {
    return <div>{`${idx + 1}、${it}`}</div>;
  });
  return <div className="titleWrapper">
    <span>{props.title}</span>
    <WeaHelpfulTip
      width={300}
      title={helpContent}
      placement="topLeft"
    />
  </div>;
};