ImportModal.jsx 2.63 KB
Newer Older
皮倩雯's avatar
皮倩雯 committed
1 2 3 4
/*
 * @Description:
 * @Author: leizhe
 * @Date: 2022-04-11 18:12:39
5
 * @LastEditTime: 2022-05-19 17:28:25
皮倩雯's avatar
皮倩雯 committed
6 7 8 9 10 11 12 13 14 15
 * @LastEditors: leizhe
 */
import React, { useEffect, useState } from 'react';
import { Modal, Form, Input, notification, message, Button, Col, Row, Upload } from 'antd';
import { Import } from '@/services/drawBoardManage/api';

const ImportModal = props => {
  const { visible, onCancel, callBackSubmit = () => {} } = props;
  const [addForm] = Form.useForm();
  const [file, setFile] = useState('');
16
  const [load, setLoad] = useState(false); // 提交加载
皮倩雯's avatar
皮倩雯 committed
17 18

  useEffect(() => {
19
    setLoad(false);
皮倩雯's avatar
皮倩雯 committed
20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36
    addForm.resetFields();
  }, [visible]);

  const aa = {
    beforeUpload: file => {
      console.log(file);
      addForm.setFieldsValue({
        ModelFile: file.name,
      });
      setFile(file);
      return false;
    },
  };

  const importData = () => {
    addForm.validateFields().then(validate => {
      if (validate) {
37
        setLoad(true);
皮倩雯's avatar
皮倩雯 committed
38 39 40
        const formData = new FormData();
        formData.append('file', file);
        Import(formData).then(res => {
41 42
          setLoad(false);
          if (res.code === 0) {
皮倩雯's avatar
皮倩雯 committed
43 44 45 46 47
            callBackSubmit();
            addForm.resetFields();
            notification.success({
              message: '提示',
              duration: 3,
48
              description: res.msg,
皮倩雯's avatar
皮倩雯 committed
49 50 51 52 53
            });
          } else {
            notification.error({
              message: '提示',
              duration: 3,
54
              description: res.msg,
皮倩雯's avatar
皮倩雯 committed
55 56 57 58 59 60 61 62 63 64 65 66 67
            });
          }
        });
      }
    });
  };
  return (
    <Modal
      title="导入数据"
      visible={visible}
      onCancel={onCancel}
      destroyOnClose
      onOk={importData}
68
      confirmLoading={load}
皮倩雯's avatar
皮倩雯 committed
69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105
      afterClose={() => {
        addForm.resetFields();
      }}
      maskClosable={false}
      okText="确认"
      cancelText="取消"
    >
      <Form form={addForm} labelCol={{ span: 5 }}>
        <Row>
          <Col span={17}>
            <Form.Item
              label="模型文件"
              name="ModelFile"
              labelCol={{ span: 7 }}
              rules={[
                {
                  required: true,
                  message: '请选择压缩文件',
                },
              ]}
            >
              <Input placeholder="请选择压缩文件" />
            </Form.Item>
          </Col>
          <Col span={7}>
            <Form.Item>
              <Upload {...aa} accept=".zip">
                <Button style={{ width: '130px' }}>上传文件</Button>
              </Upload>
            </Form.Item>
          </Col>
        </Row>
      </Form>
    </Modal>
  );
};
export default ImportModal;