index.tsx
1.68 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
import React, { useState } from 'react';
import { Modal, Form, Input, Button } from 'antd';
import FeeweeUploadAttachment from '@/components/FeeweeUploadAttachment';
import { UploadOutlined } from '@ant-design/icons';
interface Props {
open: boolean,
setOpen: (bool: boolean) => void,
callback?: Function
}
export default function Add({ open, setOpen, callback }: Props) {
const [form] = Form.useForm();
const [confirmLoading, setConfirmLoading] = useState<boolean>(false);
function handleCancel() {
setOpen(false);
form.resetFields();
}
async function handleSave() {
const params = await form.validateFields();
setConfirmLoading(true);
callback && callback(params);
setConfirmLoading(false);
setOpen(false);
}
return (
<Modal
open={open}
title="提交审批"
onCancel={() => setOpen(false)}
maskClosable={false}
footer={[
<Button key="cancel" onClick={handleCancel} loading={confirmLoading} style={{marginLeft: 10}}>取消</Button>,
<Button key="submit" onClick={handleSave} type="primary" htmlType="submit" loading={confirmLoading}>确认</Button>
]}
>
<Form form={form} labelCol={{ span: 6 }} wrapperCol={{ span: 15 }}>
<Form.Item label="备注" name="remark">
<Input.TextArea maxLength={512} autoSize={{minRows: 4}} showCount placeholder="请输入备注" />
</Form.Item>
<Form.Item label="附件" name="attachmentList" valuePropName="fidList">
<FeeweeUploadAttachment maxCount={8} listType="text">
<Button icon={<UploadOutlined />}>上传附件</Button>
</FeeweeUploadAttachment>
</Form.Item>
</Form>
</Modal>
);
}