/*
 * Author: 黎永顺
 * name: 复制账套
 * Description:
 * Date: 2022/12/8
 */
import React, { Component } from "react";
import { inject, observer } from "mobx-react";
import { categoryConditions } from "../config";
import { WeaDialog } from "ecCom";
import { Button } from "antd";
import { getSearchs } from "../../../util";

@inject("ledgerStore")
@observer
class CategoryAddModal extends Component {
  constructor(props) {
    super(props);
    this.state = {
      loading: false
    };
  }

  componentDidMount() {
    this.getFormFields();
  }

  componentWillReceiveProps(nextProps, nextContext) {
    if (nextProps.visible !== this.props.visible && nextProps.visible) {
      const { ledgerStore, name = "" } = nextProps;
      const { categoryForm: form } = ledgerStore;
      form.updateFields({
        name: { value: name }
      });
    }
  }

  getFormFields = () => {
    const { ledgerStore } = this.props;
    const { categoryForm: form } = ledgerStore;
    form.initFormFields(categoryConditions);
  };
  handleSubmit = () => {
    const { ledgerStore, id, onSaveCategory, onCancel } = this.props;
    const { categoryForm: form } = ledgerStore;
    form.validateForm().then(f => {
      if (f.isValid) {
        const payload = form.getFormParams();
        onSaveCategory({ ...payload, id });
        onCancel();
      } else {
        f.showErrors();
      }
    });
  };


  render() {
    const { onCancel, ledgerStore, ...extra } = this.props;
    const { loading } = this.state;
    const { categoryForm: form } = ledgerStore;
    const buttons = [
      <Button type="primary" onClick={this.handleSubmit} loading={loading}>保存</Button>,
      <Button type="ghost" onClick={onCancel}> 取消 </Button>
    ];
    return (
      <WeaDialog
        {...extra}
        style={{ width: 600 }}
        buttons={buttons}
        onCancel={onCancel}
      >
        {getSearchs(form, categoryConditions, 1)}
      </WeaDialog>
    );
  }
}

export default CategoryAddModal;