/*
 * Author: 黎永顺
 * name: 应用设置
 * Description:
 * Date: 2022-09-27 18:17:02
 */
import React, { Component } from "react";
import { WeaCheckbox, WeaDatePicker, WeaFormItem, WeaInput, WeaSearchGroup, WeaTop } from "ecCom";
import * as API from "../../apis/ruleconfig";
import { Button, message } from "antd";
import "./index.less";

const Input = (props) => {
  const { label, value } = props;
  return (
    <WeaFormItem label={label} labelCol={{ span: 8 }} wrapperCol={{ span: 16 }}>
      <WeaInput viewAttr={1} value={value}/>
    </WeaFormItem>
  );
};

class AppConfig extends Component {
  constructor(props) {
    super(props);
    this.state = {
      openAcctResultSum: "0",
      displayEmpInfoReport: "0",
      isLog: "0",
      openFormulaForcedEditing: "0",
      version: "",
      loading: false
    };
  }

  componentDidMount() {
    this.queryAppsetting();
  }

  queryAppsetting = () => {
    API.queryAppsetting().then(({ status, data }) => {
      if (status) {
        const { openAcctResultSum, displayEmpInfoReport, isLog, openFormulaForcedEditing, version } = data;
        this.setState({
          openAcctResultSum, displayEmpInfoReport,
          isLog: isLog === "true" ? "1" : "0",
          openFormulaForcedEditing: openFormulaForcedEditing === "true" ? "1" : "0",
          version
        });
      }
    });
  };
  appSettingSave = () => {
    const { openAcctResultSum, displayEmpInfoReport } = this.state;
    this.setState({ loading: true });
    API.appSettingSave({ openAcctResultSum, displayEmpInfoReport }).then(({ status, errormsg }) => {
      this.setState({ loading: false });
      if (status) {
        message.success("设置成功!");
        this.queryAppsetting();
      } else {
        message.error(errormsg || "设置失败!");
      }
    });
  };

  render() {
    const { openAcctResultSum, displayEmpInfoReport, loading, openFormulaForcedEditing, isLog, version } = this.state;
    const btns = [<Button type="primary" loading={loading} onClick={this.appSettingSave}>保存</Button>];
    const items = [
      {
        com: Input({
          label: "版本号",
          value: version
        })
      },
      {
        com: CheckBox({
          label: "显示薪资核算结果合计列",
          value: openAcctResultSum,
          onChange: (openAcctResultSum) => {
            this.setState({ openAcctResultSum });
          }
        })
      },
      {
        com: CheckBox({
          label: "是否显示脱敏表人员信息",
          value: displayEmpInfoReport,
          onChange: (displayEmpInfoReport) => {
            this.setState({ displayEmpInfoReport });
          }
        })
      },
      {
        com: CheckBox({
          label: "是否输出日志",
          disabled: true,
          value: isLog
        })
      },
      {
        com: CheckBox({
          label: "是否可编辑系统公式",
          disabled: true,
          value: openFormulaForcedEditing
        })
      }
    ];
    return (
      <div className="appConfigWrapper">
        <WeaTop
          title={<span>应用设置</span>}
          icon={<i className="icon-coms-Flow-setting"/>}
          iconBgcolor="#F14A2D"
          buttons={btns}
        />
        <WeaSearchGroup title="" showGroup center items={items}/>
      </div>
    );
  }
}

export default AppConfig;

export const CheckBox = payload => {
  const { label, onChange, value, disabled = false } = payload;
  return (
    <WeaFormItem label={label} labelCol={{ span: 8 }} wrapperCol={{ span: 16 }}>
      <WeaCheckbox display="switch" disabled={disabled} value={value} onChange={onChange}/>
    </WeaFormItem>
  );
};

export const PickDate = payload => {
  const { label, onChange, value, viewAttr, format, labelCol = { span: 8 }, wrapperCol = { span: 16 } } = payload;
  return (
    <WeaFormItem label={label} labelCol={labelCol} wrapperCol={wrapperCol}>
      <WeaDatePicker
        value={value}
        viewAttr={viewAttr}
        format={format}
        onChange={(date) => onChange({ type: label, date })}/>
    </WeaFormItem>
  );
};