AddModal.tsx
2.18 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
import React, { useEffect } from 'react';
import {Modal, Form, InputNumber, message} from 'antd';
import PmsSelsct from '@/pages/pms/comonents/PmsSelect';
import { getStoragePage } from '@/pages/pms/storage/StorageManage/api';
import usePagination from '@/hooks/usePagination';
import { saveApi } from '../api';
const {Item} = Form;
interface Props {
item:any
visible:boolean
onCancel:Function
refesh:Function
}
export default function Index(props: Props) {
const { item, onCancel, visible, refesh } = props;
const [form] = Form.useForm();
const { list: storages } = usePagination<PartStorageSpace.PageVO>(getStoragePage, { pageSize: 1000 });
const OK = () => {
form.validateFields().then(fileds => {
const params = {
id: item?.id,
storageId: fileds.storageId,
days: fileds.days,
amount: fileds.amount
};
saveApi(params).then(res => {
message.success("提交成功");
onCancel();
refesh();
}).catch(e => {
message.error(e.message);
});
});
};
useEffect(() => {
if (visible && item.id) {
form.setFieldsValue({
...item
});
}
if (!visible) {
form.resetFields();
}
}, [visible]);
return (
<Modal
open={visible}
maskClosable={false}
onCancel={() => onCancel()}
onOk={() => OK()}
title={item.id ? '编辑' : '新增'}
>
<Form form={form} labelCol={{span: 6}} wrapperCol={{span: 16}}>
<Item name="storageId" label="库房" required rules={[{ required: true, message: '请选择库房' }]}>
<PmsSelsct
style={{width: 300}}
options={storages.map((item: PartStorageSpace.PageVO) => ({ value: item.id, label: item.storageName }))}
/>
</Item>
<Item name="days" label="订件时长目标" required rules={[{ required: true, message: '请输入' }]}>
<InputNumber style={{ width: 300 }} addonAfter="天" />
</Item>
<Item name="amount" label="运费目标" required rules={[{ required: true, message: '请输入' }]}>
<InputNumber style={{ width: 300 }} addonAfter="元" />
</Item>
</Form>
</Modal>
);
}