SystemModal.tsx
1.99 KB
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
import React, { FC } from 'react';
import { Modal, Form, Input, Button, message as $message } from 'antd';
import { createSystem } from "../../api/system.api";
const { Item } = Form
interface systemProp {
modalVisible: boolean
onCreate: (createRes: boolean) => void
onCancel: () => void
}
const SystemModal: FC<systemProp> = ({ modalVisible, onCreate, onCancel }) => {
const [form] = Form.useForm()
const createCallBack = async (formInfo: any) => {
try {
const createResult = await createSystem(formInfo) as any
const { code, message } = createResult
if (code === 200) {
$message.success('创建成功!')
onCreate(true)
form.resetFields()
} else {
$message.error('创建失败!' + message)
}
} catch (error) {
$message.error(error)
console.log(error)
}
}
const onFinish = async () => {
try {
const validateRes = await form.validateFields()
if (validateRes.errorFields) return
createCallBack(validateRes)
} catch (error) {
console.log(error)
}
}
const onClose = () => {
form.resetFields()
onCancel()
}
return (
<Modal
title="创建系统"
visible={modalVisible}
destroyOnClose={true}
onOk={onFinish}
onCancel={onClose}
footer={[
<Button type="primary" key="submit" onClick={ onFinish }>
确定
</Button>,
]}
>
<Form
name="systemForm"
form={form}
initialValues={{
name: '',
description: ''
}}
>
<Item
label="系统名称"
name="name"
rules={[{ required: true, message: '请输入系统名称' }]}
>
<Input />
</Item>
<Item
label="系统描述"
name="description"
rules={[{ required: true, message: '请输入系统描述' }]}
>
<Input />
</Item>
</Form>
</Modal>
)
}
export default SystemModal;