/* eslint-disable global-require */ import React, { useEffect, useState } from 'react'; import { Form, Divider, Button, Input, message, Modal, Space } from 'antd'; import { InfoCircleFilled } from '@ant-design/icons'; import { SaveETLConfig, GetETLConfig, GetGateWay } from '@/services/hostmanager/hostmanager'; import styles from './index.less'; const ETCConfig = props => { const { setActiveKey } = props; const [form] = Form.useForm(); const [flag, setFlag] = useState(0); const [getWayVisible, setGetWayVisible] = useState(false); useEffect(() => { GetGateWay().then(res => { if (res.code === 0) { if (res.data === false) { setGetWayVisible(true); } } }); GetETLConfig().then(res => { if (res.code === 0) { console.log(res.data, 'res.data'); form.setFieldsValue({ url: res.data }); } else { message.error(res.msg); } }); return () => { form.resetFields(); }; }, []); const onFinish = () => { form.validateFields().then(values => { if (values) { SaveETLConfig({ url: values.url }).then(res => { if (res.code === 0) { message.success('保存成功'); } else { message.error(res.msg); } }); } }); }; return ( <div className={styles.pageContent}> <div className={styles.header}> <img className={styles.icon} src={require('../../../../assets/images/icons/数据中台.svg')} alt="" /> <div className={styles.title}>数据中台</div> </div> <Divider /> <Form form={form} labelCol={{ span: 2, }} wrapperCol={{ span: 5, }} onFinish={onFinish} > <Form.Item label="服务地址(平台)" name="url" labelAlign="left" style={{ marginLeft: '20px' }} rules={[ { required: true, message: '请填写服务地址', }, ]} > <Input style={{ width: '300px' }} // placeholder="请填写服务地址" rules={[ { validator: (rule, value) => { let aa = form.getFieldValue().qrCodeurl; let regEn = /^((ht|f)tps?):\/\/([\w-]+(\.[\w-]+)*\/?)+(\?([\w\-\.,@?^=%&:\/~\+#]*)+)?$/; if (aa) { if (regEn.test(aa) === false) { return Promise.reject('url必须以http(s)://开头'); } } return Promise.resolve(); }, }, ]} /> </Form.Item> <Form.Item style={{ marginLeft: '20px' }} wrapperCol={{ offset: 2, span: 5, }} > <Button type="primary" htmlType="submit"> 保存 </Button> </Form.Item> </Form> <Modal visible={getWayVisible} title="提示" width="350px" closable={false} footer={ <Space> <Button onClick={() => { setGetWayVisible(false); setActiveKey('6'); }} type="primary" > 好的,去开启 </Button> </Space> } > <InfoCircleFilled style={{ color: '#faad14', fontSize: '18px', marginRight: '10px', }} /> <span>当前网关暂未打开,请前往开启!</span> </Modal> </div> ); }; export default ETCConfig;