周沫沫历险记
2 years ago
7 changed files with 212 additions and 23 deletions
@ -0,0 +1,51 @@ |
|||
import React, { useRef, useState } from 'react'; |
|||
import { Modal, Form, Button, Toast } from '@douyinfe/semi-ui'; |
|||
import { IconUpload } from '@douyinfe/semi-icons'; |
|||
|
|||
const ResourceUploadModal = (props) => { |
|||
const { apiRoot, user, onCancel, onOk } = props; |
|||
|
|||
const form = useRef(); |
|||
const handleOk = () => { |
|||
form.current.validate().then((values) => { |
|||
onOk(values); |
|||
}); |
|||
} |
|||
return (<Modal |
|||
title={"上传文件"} |
|||
visible={true} |
|||
maskClosable={false} |
|||
onOk={handleOk} |
|||
onCancel={onCancel}> |
|||
<Form |
|||
getFormApi={(formApi) => (form.current = formApi)} |
|||
labelPosition={'left'} |
|||
labelAlign={'right'} |
|||
labelCol={{ span: 6 }} |
|||
wrapperCol={{ span: 18 }} |
|||
> |
|||
<Form.Upload |
|||
field='attachPath' |
|||
label='文件上传' |
|||
action={apiRoot + '/attachments/resourceRepository?token=' + user.token} |
|||
maxSize={204800} |
|||
limit={5} |
|||
accept='.doc,.docx,.xls,.xlsx,.pdf,.pptx,.zip,.rar,.7z' |
|||
onAcceptInvalid={(files) => { Toast.error(`仅支持文件、压缩包类型`) }} |
|||
onSizeError={(file, fileList) => Toast.error(`${file.name} 超过200M`)} |
|||
onExceed={(fileList) => { Toast.error(`一次最多上传5个文件`) }} |
|||
rules={[{ required: true, message: '请上传文件' }]} |
|||
> |
|||
<Button icon={<IconUpload />} theme="light"> |
|||
点击上传 |
|||
</Button> |
|||
</Form.Upload> |
|||
<p>支持文件类型:.doc,.docx,.xls,.xlsx,.pdf,.pptx, |
|||
支持压缩包类型:zip、rar、7z, |
|||
文件大小一个不能超过200M,一次最多上传5个文件。 |
|||
</p> |
|||
</Form> |
|||
</Modal > |
|||
) |
|||
} |
|||
export default ResourceUploadModal |
Loading…
Reference in new issue