/*
 * Author: 黎永顺
 * name: 薪资基本信息
 * Description:
 * Date: 2023/9/25
 */
import React, { Component } from "react";
import { WeaBrowser, WeaHelpfulTip, WeaLocaleProvider, WeaSearchGroup } from "ecCom";
import cs from "classnames";
import { Col, Row } from "antd";
import "./index.less";

const getLabel = WeaLocaleProvider.getLabel;

class EditSalaryBaseInfo extends Component {
  componentWillReceiveProps(nextProps, nextContext) {
    if (this.props.visible !== nextProps.visible && nextProps.visible && !_.isEmpty(nextProps.baseInfo)) {
      nextProps.onChange(_.map(nextProps.baseInfo, it => {
        const { fieldValue, canEdit, fieldValueObj } = it;
        if (canEdit) {
          const { id: value, name: valueSpan } = fieldValueObj || fieldValue;
          return { ...it, fieldValue: value, fieldValueObj: { id: value, name: valueSpan } };
        }
        return { ...it };
      }));
    }
  }

  renderBrowser = (item) => {
    const { fieldType, fieldValue, fieldCode } = item;
    const { id: value, name: valueSpan } = fieldValue;
    let browserType = {};
    switch (fieldType) {
      case "subcompanyBrowser":
        browserType = { ...browserType, type: 164, title: getLabel(111, "选择分部") };
        break;
      case "departmentBrowser":
        browserType = { ...browserType, type: 4, title: getLabel(111, "选择部门") };
        break;
      case "jobtitleBrowser":
        browserType = { ...browserType, type: 24, title: getLabel(111, "选择岗位") };
        break;
      case "jobcallBrowser":
        browserType = { ...browserType, type: 260, title: getLabel(111, "选择职称") };
        break;
      default:
        break;
    }
    return <WeaBrowser {...browserType} viewAttr={this.props.viewAttr === 1 ? 1 : 3}
                       value={value} valueSpan={valueSpan} inputStyle={{ width: 200 }}
                       onChange={(value, valueSpan) => this.props.onChange(_.map(this.props.baseInfo, it => {
                         if (fieldCode === it.fieldCode) {
                           return { ...it, fieldValue: value, fieldValueObj: { id: value, name: valueSpan } };
                         }
                         return { ...it };
                       }))}/>;
  };

  render() {
    const { baseInfo } = this.props;
    return (
      <WeaSearchGroup
        needTigger showGroup className="esf-base-info-form"
        title={
          <div>
            <span>{getLabel(82743, "基础信息")}</span>
            <WeaHelpfulTip
              width={200} placement="topLeft"
              title={getLabel(111, "提示：基本信息根据账套设置显示")}
              style={{ marginLeft: 10 }}
            />
          </div>
        }
      >
        <Row type="flex" className="esf-form-content">
          {
            _.map(baseInfo, (item, index) => {
              const { fieldName, fieldType, fieldValue, fieldValueObj } = item;
              return (
                <Col span={(index === baseInfo.length - 1 && (index + 1) % 2 === 1) ? 24 : 12}>
                  <Row className={cs("esf-form-item", {
                    "esf-form-odd-item": index % 2 === 0,
                    "esf-form-last-item": (index === baseInfo.length - 1 && (index + 1) % 2 === 1)
                  })}>
                    <Col span={(index === baseInfo.length - 1 && (index + 1) % 2 === 1) ? 3 : 6}>
                      <span className="label" title={fieldName}>{fieldName}</span>
                    </Col>
                    <Col span={(index === baseInfo.length - 1 && (index + 1) % 2 === 1) ? 21 : 18}>
                      <span className="value" title={fieldValue}>
                        {
                          fieldType.indexOf("Browser") !== -1 ?
                            this.renderBrowser({ ...item, fieldValue: fieldValueObj || fieldValue }) :
                            fieldValue
                        }
                      </span>
                    </Col>
                  </Row>
                </Col>
              );
            })
          }
        </Row>
      </WeaSearchGroup>
    );
  }
}

export default EditSalaryBaseInfo;
