index.tsx 1.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243
  1. import { Form, Input, Modal } from 'antd'
  2. import { FC } from 'react'
  3. export interface BatchFillingModalProps {
  4. visible: boolean
  5. setVisible: (v: boolean) => void
  6. onOk: (form: any) => void
  7. }
  8. export const BatchFillingModal: FC<BatchFillingModalProps> = ({ visible, setVisible, onOk }) => {
  9. const [form] = Form.useForm()
  10. const handleCancel = () => {
  11. setVisible(false)
  12. }
  13. const handleSubmit = async () => {
  14. if (!(await form.validateFields())) return
  15. onOk(form.getFieldsValue())
  16. setVisible(false)
  17. form.resetFields()
  18. }
  19. return (
  20. <Modal
  21. title='批量填写'
  22. width={700}
  23. maskClosable={false}
  24. open={visible}
  25. onCancel={handleCancel}
  26. onOk={handleSubmit}
  27. >
  28. <Form form={form} labelCol={{ span: 3 }}>
  29. <Form.Item name='checker' label='盘点人' rules={[{ required: true }]}>
  30. <Input placeholder='请填写' maxLength={20} />
  31. </Form.Item>
  32. <Form.Item name='remark' label='备注'>
  33. <Input placeholder='请填写' maxLength={20} />
  34. </Form.Item>
  35. </Form>
  36. </Modal>
  37. )
  38. }