import React, { useState, } from 'react';
import { Modal, Form, Input, } from 'antd';
import Upload from 'military/components/Upload';
import { uploadAgreePaper } from "../../api";
import '../../index.scss';


export default Form.create()(props => {
  const { visible, setVisible, checkedItem, form, showNotification ,reloadList } = props;
  const { getFieldDecorator, validateFields, setFieldsValue, } = form;

  const [fileList, setFileList] = useState([]);


  // 上传附件后得到的文件数组
  function uploadFunc(fileList, files) {
    setFileList(fileList);
    setFieldsValue({
      files,
    });
  }

  function uploadAgree() {
    validateFields((err, values) => {
      if (!err) {
        uploadAgreePaper({
          paperId: checkedItem.id,
          params: {
            files: values.files,
          }
        }).then(res => {
          if (res.message === 'success') {
            setFieldsValue({
              files: '',
            });
            setVisible(false);
            showNotification("上传协议成功！");
            reloadList();
          } else {
            showNotification(res.message || "上传协议失败")
          }
        })
      }
    })
  }

  return (
    <Modal
      title="签订协议"
      visible={visible}
      onOk={uploadAgree}
      onCancel={() => { setVisible(false) }}
      className="form-edit-modal"
    >
      <div className="task-popup-content">
        {/* paperAuditing */}
        {checkedItem.paperAuditing && <p className=" mb10 color-orange task_tip">审核意见：{checkedItem.paperAuditing.message}</p>}
        <a href="https://task.osredm.com/busiAttachments/download/121" className="icon icon-attachment font-13 color-blue" length="32">协议样板.word</a>
        <Form.Item className="upload-form" label="附件上传" required={true}>
          <Upload
            load={uploadFunc}
            size={50}
            showNotification={showNotification}
            fileList={fileList}
          />
          {getFieldDecorator('files', {
            rules: [{ required: visible, message: "请上传文件" }],
            validateFirst: true
          })(<Input style={{ display: 'none' }} />)}
        </Form.Item>
      </div>
    </Modal>
  )
}
)