AddModal.jsx 2.91 KB
Newer Older
1 2 3
import React, { useState, useEffect } from 'react';
import { Form, Modal, Input, Select, AutoComplete, Button, notification } from 'antd';
import {
shaoan123's avatar
shaoan123 committed
4
  SetServiceConfig
5 6 7 8 9
} from '@/services/webConfig/api';


const { Option } = Select;
const AddModal = props => {
10
  const { callBackSubmit = () => { }, type, formObj, visible, listData } = props;
11 12 13 14 15 16 17 18 19
  const [loading, setLoading] = useState(false);
  const [form] = Form.useForm();
  const { Item } = Form;
  // 提交
  const onSubmit = () => {
    form.validateFields().then(validate => {
      if (validate) {
        setLoading(true);
        let obj = form.getFieldsValue();
20 21 22 23 24 25 26 27
        SetServiceConfig({
          schemename: obj.schemename,
          terminalType: type === 'add' ? 'web' : 'phone',
          isBaseMap: 'false',
          jsonCfg: type === 'add' ? JSON.stringify({ type: 'dynamic' }) : JSON.stringify({ isDefault: false })
        })
          .then(res => {
            setLoading(false);
shaoan123's avatar
shaoan123 committed
28
            if (res.msg === "Ok") {
29 30 31 32 33 34 35 36 37
              form.resetFields();
              callBackSubmit();
              notification.success({
                message: '提示',
                duration: 3,
                description: '新增成功',
              });

            } else {
38 39 40
              notification.error({
                message: '提示',
                duration: 3,
41
                description: '新增失败',
42
              });
43 44 45 46 47 48 49
            }
          })
          .catch(err => {
            notification.error({
              message: '提示',
              duration: 3,
              description: '新增失败',
50
            });
51 52 53
            setLoading(false);
          });

54 55 56 57 58 59 60
      }
    });
  };


  const onFinish = value => { };
  useEffect(() => {
61 62 63 64
    if(type!=''){
      form.setFieldsValue({ schemename: listData[0] });
    }

65 66 67 68 69 70 71 72 73 74 75 76 77
  }, [visible]);


  const layout = {
    layout: 'horizontal',
    labelCol: {
      span: 4,
    },
    wrapperCol: {
      span: 16,
    },
  };

78 79
  const handleChange = (value) => {
    form.setFieldsValue({ schemename: value});
80
  }
81

82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100
  return (
    <Modal
      title={`${type === 'add' ? '元数据发布' : '编辑'}`}
      bodyStyle={{ width: '100%', minHeight: '100px' }}
      style={{ top: '150px' }}
      width="700px"
      destroyOnClose
      maskClosable={false}
      cancelText="取消"
      okText="确认"
      {...props}
      onOk={() => onSubmit()}
      confirmLoading={loading}
      forceRender={true}
      getContainer={false}
    >
      {visible && (
        <Form form={form} {...layout} onFinish={onFinish}>
          <Item
101 102
            label="方案名"
            name="schemename"
103 104
            rules={[{ required: true, message: '请选择服务名' }]}
          >
105 106 107
            <Select onChange={handleChange}>
              {listData.map((item, index) => { return <Option value={item} key={index}>{item}</Option> }) }
            </Select>
108 109 110 111 112 113 114
          </Item>
        </Form>
      )}
    </Modal>
  );
};
export default AddModal;