/*
 * Author: 黎永顺
 * name: 社保方案重构-方案设置列表
 * Description:
 * Date: 2024/2/5
 */
import React, { Component } from "react";
import { WeaCheckbox, WeaHelpfulTip, WeaInputNumber, WeaLocaleProvider, WeaSelect, WeaTableEdit } from "ecCom";
import PaymentPeriodModal from "../../../programme/paymentPeriodModal";

const getLabel = WeaLocaleProvider.getLabel;

class PlanSetTable extends Component {
  constructor(props) {
    super(props);
    this.state = {
      datas: [], paymentPeriodModal: {
        visible: false, record: {}, cycleSetting: "000000000000"
      }
    };
  }

  componentWillReceiveProps(nextProps, nextContext) {
    if (nextProps.selectedKey !== this.props.selectedKey || nextProps.dataSource !== this.props.dataSource) {
      this.setState({ datas: _.filter(nextProps.dataSource, o => String(o.paymentScopeValue) === nextProps.selectedKey) });
    }
  }

  /*
   * Author: 黎永顺
   * Description: 缴纳周期-自定义设置
   * Params:
   * Date: 2024/2/6
   */
  handleSetPaymentPeriod = (cycleSetting) => {
    const { datas, paymentPeriodModal } = this.state;
    const { record: { id } } = paymentPeriodModal;
    let cycleObj = {
      1: "0",
      2: "0",
      3: "0",
      4: "0",
      5: "0",
      6: "0",
      7: "0",
      8: "0",
      9: "0",
      10: "0",
      11: "0",
      12: "0"
    };
    if (!_.isEmpty(cycleSetting)) {
      _.forEach(cycleSetting, item => {
        _.assign(cycleObj, { [item]: "1" });
      });
    } else {
      _.forEach(Object.keys(cycleObj), item => {
        _.assign(cycleObj, { [item]: "0" });
      });
    }
    const tmpVStr = _.reduce(Object.values(cycleObj), (pre, cur) => {
      return pre + cur;
    }, "");
    this.setState({
      datas: _.map(datas, o => {
        if (id === o.id) {
          return { ...o, cycleSetting: tmpVStr };
        } else {
          return o;
        }
      })
    }, () => this.props.onPlanSet(this.state.datas));
  };

  render() {
    const { datas, paymentPeriodModal } = this.state;
    const { showOperateBtn } = this.props;
    const columns = [
      {
        title: getLabel(15795, "类型名称"),
        dataIndex: "insuranceName",
        key: "insuranceName",
        width: 120, fixed: "left",
        com: [{
          type: "custom",
          key: "custom",
          render: text => (<span>{text}</span>)
        }]
      },
      {
        title: getLabel(543168, "是否缴费"),
        dataIndex: "isPayment",
        key: "isPayment",
        width: 120,
        com: [{
          type: "custom",
          key: "custom",
          render: (text, record, index, onEdit) => (
            <WeaCheckbox value={(!_.isNil(text) && text) ? "1" : "0"} display="switch" viewAttr={showOperateBtn ? 2 : 1}
                         onChange={isPayment => onEdit({
                           record: { ...record, isPayment: isPayment === "1" },
                           index, key: "custom"
                         })}/>
          )
        }]
      },
      {
        title: getLabel(543169, "缴纳对象"),
        dataIndex: "paymentScope",
        key: "paymentScope",
        width: 120,
        com: [{
          type: "custom",
          key: "custom",
          render: text => (<span>{text}</span>)
        }]
      },
      {
        title: <PaymentCycleTitle/>,
        dataIndex: "paymentCycle",
        key: "paymentCycle",
        width: 200,
        com: [{
          type: "custom",
          key: "custom",
          render: (text, record, index, onEdit) => (<div className="flex-center">
            <WeaSelect value={text} options={[
              { key: "0", showname: getLabel(543159, "月缴") },
              { key: "1", showname: getLabel(111, "自定义") }
            ]} viewAttr={showOperateBtn ? 2 : 1}
                       onChange={paymentCycle => onEdit({
                         record: { ...record, paymentCycle, accountType: paymentCycle },
                         index, key: "custom"
                       })}/>
            {
              showOperateBtn && text === "1" &&
              <a href="javascript:void(0);" onClick={() => this.setState({
                paymentPeriodModal: {
                  record: record, visible: true,
                  cycleSetting: record.cycleSetting || "000000000000"
                }
              })}>{getLabel(30747, "设置")}</a>
            }
          </div>)
        }]
      },
      {
        title: getLabel(543170, "核算方式"),
        dataIndex: "accountType",
        key: "accountType",
        width: 200,
        com: [{
          type: "custom",
          key: "custom",
          render: (text, record, index, onEdit) => (
            <WeaSelect viewAttr={(record.paymentCycle === "1" && showOperateBtn) ? 2 : 1} value={text} options={[
              { key: "0", showname: getLabel(543160, "基数*比例+固定费用"), disabled: record.paymentCycle === "1" },
              { key: "1", showname: getLabel(543161, "∑基数*比例+∑固定费用") },
              { key: "2", showname: getLabel(543162, "∑(基数*比例+固定费用)") }
            ]} onChange={accountType => onEdit({
              record: { ...record, accountType },
              index, key: "custom"
            })}/>)
        }]
      },
      {
        title: getLabel(543171, "基数下限"),
        dataIndex: "lowerLimit",
        key: "lowerLimit",
        width: 120,
        com: [{
          type: "custom",
          key: "custom",
          render: (text, record, index, onEdit) => (
            <WeaInputNumber value={text} min={0} max={record.upperLimit || 99999999999} precision={2}
                            viewAttr={showOperateBtn ? 2 : 1}
                            onChange={lowerLimit => onEdit({
                              record: { ...record, lowerLimit },
                              index, key: "custom"
                            })}/>)
        }]
      },
      {
        title: getLabel(543172, "基数上限"),
        dataIndex: "upperLimit",
        key: "upperLimit",
        width: 120,
        com: [{
          type: "custom",
          key: "custom",
          render: (text, record, index, onEdit) => (
            <WeaInputNumber value={text} min={record.lowerLimit || 0} precision={2} viewAttr={showOperateBtn ? 2 : 1}
                            onChange={upperLimit => onEdit({
                              record: { ...record, upperLimit },
                              index, key: "custom"
                            })}/>)
        }]
      },
      {
        title: getLabel(543173, "缴纳比例%"),
        dataIndex: "paymentProportion",
        key: "paymentProportion",
        width: 120,
        com: [{
          type: "custom",
          key: "custom",
          render: (text, record, index, onEdit) => (
            <WeaInputNumber value={text} min={0} precision={4} viewAttr={showOperateBtn ? 2 : 1}
                            onChange={paymentProportion => onEdit({
                              record: { ...record, paymentProportion },
                              index, key: "custom"
                            })}/>)
        }]
      },
      {
        title: getLabel(543174, "固定费用"),
        dataIndex: "fixedCost",
        key: "fixedCost",
        width: 120,
        com: [{
          type: "custom",
          key: "custom",
          render: (text, record, index, onEdit) => (
            <WeaInputNumber value={text} min={0} precision={2} viewAttr={showOperateBtn ? 2 : 1}
                            onChange={fixedCost => onEdit({
                              record: { ...record, fixedCost },
                              index, key: "custom"
                            })}/>)
        }]
      },
      {
        title: getLabel(543175, "有效小数位"),
        dataIndex: "validNum",
        key: "validNum",
        width: 120,
        com: [{
          type: "custom",
          key: "custom",
          render: (text, record, index, onEdit) => (
            <WeaSelect value={_.isNil(text) ? "2" : String(text)} options={[
              { key: "0", showname: "0" },
              { key: "1", showname: "1" },
              { key: "2", showname: "2" },
              { key: "3", showname: "3" },
              { key: "4", showname: "4" },
              { key: "5", showname: "5" },
              { key: "6", showname: "6" },
              { key: "7", showname: "7" },
              { key: "8", showname: "8" },
              { key: "9", showname: "9" },
              { key: "10", showname: "10" }
            ]} viewAttr={showOperateBtn ? 2 : 1}
                       onChange={validNum => onEdit({
                         record: { ...record, validNum },
                         index, key: "custom"
                       })}/>)
        }]
      },
      {
        title: getLabel(543176, "进位规则"),
        dataIndex: "rententionRule",
        key: "rententionRule",
        width: 120,
        com: [{
          type: "custom",
          key: "custom",
          render: (text, record, index, onEdit) => (
            <WeaSelect value={_.isNil(text) ? "2" : text} viewAttr={showOperateBtn ? 2 : 1}
                       options={[
                         { key: "1", showname: getLabel(19766, "原始数据") },
                         { key: "2", showname: getLabel(389654, "四舍五入") },
                         { key: "3", showname: getLabel(542722, "向上舍入") },
                         { key: "4", showname: getLabel(542723, "向下舍入") },
                         { key: "5", showname: getLabel(542724, "见分进角") },
                         { key: "6", showname: getLabel(543157, "向上取偶") }
                       ]} onChange={rententionRule => onEdit({
              record: { ...record, rententionRule },
              index, key: "custom"
            })}/>)
        }]
      }
    ];
    return (
      <React.Fragment>
        <WeaTableEdit
          columns={columns} datas={datas}
          showDelete={false} showAdd={false} showCopy={false} showTitle={false}
          tableProps={{ scroll: { x: 800 }, bordered: true }}
          onChange={datas => this.setState({ datas }, () => this.props.onPlanSet(this.state.datas))}
        />
        <PaymentPeriodModal
          {...paymentPeriodModal}
          onCancel={() => this.setState({
            paymentPeriodModal: {
              visible: false, record: {}, cycleSetting: "000000000000"
            }
          })}
          onSetPaymentPeriod={this.handleSetPaymentPeriod}
        />
      </React.Fragment>
    );
  }
}

export default PlanSetTable;

const PaymentCycleTitle = () => (<div>
  <span>{getLabel(543158, "缴纳周期")}</span>
  <WeaHelpfulTip
    style={{ paddingLeft: 8 }}
    width={480}
    title={
      <div>
        <div>{getLabel(544738, "例：养老保险缴纳周期选择3/6/9/12；")}</div>
        <br/>
        <div>
          {
            getLabel(544739, "若：核算方式选择基数求和*比例；则数据核算逻辑为：\n" +
              "          账单月1月2月时，养老保险不会被核算；\n" +
              "          账单月3月时，养老保险核算金额为：养老保险月缴纳基数*3*缴纳比例+固定费用*3\n" +
              "          （3代表1月2月3月 3个月，*3代表3个月基数相加和固定费用相加）")
          }
        </div>
        <br/>
        <div>
          {
            getLabel(544740, "若：核算方式选择基数*比例再求和；则数据核算逻辑为：\n" +
              "          账单月1月2月时，养老保险不会被核算；\n" +
              "          账单月3月时，养老保险核算金额为：\n" +
              "          将1~3月算出来的【养老保险月缴纳基数*缴纳比例+固定费用】求和")
          }
        </div>
        <br/>
        <div>{getLabel(544741, "若：缴纳周期选择选择月缴，则核算方式默认为【基数*比例+固定费用】，不可修改")}</div>
      </div>
    }
    placement="topLeft"
  />
</div>);