1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
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
/*
* @Description:
* @Author: leizhe
* @Date: 2022-01-13 17:26:14
* @LastEditTime: 2022-03-22 16:22:17
* @LastEditors: leizhe
*/
import React, { useState, useEffect, useRef } from 'react';
import { Form, Input, notification } from 'antd';
import SiteModal from '@/components/Modal/SiteModa';
import { editStation } from '@/services/siteManage/api';
const { Item } = Form;
const EditModal = props => {
const [form] = Form.useForm();
const [formLayout, setFormLayout] = useState('horizontal');
const [loading, setLoading] = useState(false);
const flag = useRef();
const { confirmModal, stationObj, des } = props;
const onSubmit = () => {
form
.validateFields()
.then(res => {
setLoading(true);
flag.current = res;
editStation({
stationName: res.stationName,
description: res.description,
stationID: stationObj.id,
})
.then(res => {
setLoading(false);
if (res.msg === '') {
form.resetFields();
notification.success({
message: '通知',
duration: 3,
description: '编辑成功',
});
confirmModal();
} else {
notification.error({
message: '提示',
duration: 3,
description: res.msg,
});
}
})
.catch(err => {
setLoading(false);
notification.error({
message: '提示',
duration: 3,
description: err,
});
});
})
.catch(err => {
console.error(err);
});
};
useEffect(() => {
form.setFieldsValue({
stationName: stationObj.text,
description: stationObj.describe,
});
}, [stationObj]);
return (
<SiteModal
{...props}
title="编辑站点"
bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: 200, borderRadius: '20px' }}
width="600px"
maskClosable={false}
destroyOnClose
cancelText="取消"
okText="确认"
onOk={() => onSubmit()}
confirmLoading={loading}
>
<Form form={form} layout={formLayout} labelCol={{ span: 4 }}>
<Item
label="站点名称"
name="stationName"
rules={[
{
required: true,
message: '请输入站点名称',
},
]}
>
<Input placeholder="请输入站点名称" style={{ width: '95%' }} maxLength="20" />
</Item>
<Item label="站点描述" name="description">
<Input placeholder="请输入站点描述" style={{ width: '95%' }} maxLength="100" />
</Item>
</Form>
</SiteModal>
);
};
export default EditModal;