-
Notifications
You must be signed in to change notification settings - Fork 2.4k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
### What problem does this PR solve? feat: create folder feat: ensure that all files in the current folder can be correctly requested after renaming the folder #345 ### Type of change - [x] New Feature (non-breaking change which adds functionality)
- Loading branch information
Showing
10 changed files
with
285 additions
and
47 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,64 @@ | ||
import { InboxOutlined } from '@ant-design/icons'; | ||
import { Modal, Segmented, Upload, UploadProps, message } from 'antd'; | ||
import { useState } from 'react'; | ||
|
||
const { Dragger } = Upload; | ||
|
||
const FileUploadModal = () => { | ||
const [isModalOpen, setIsModalOpen] = useState(false); | ||
|
||
const props: UploadProps = { | ||
name: 'file', | ||
multiple: true, | ||
action: 'https://660d2bd96ddfa2943b33731c.mockapi.io/api/upload', | ||
onChange(info) { | ||
const { status } = info.file; | ||
if (status !== 'uploading') { | ||
console.log(info.file, info.fileList); | ||
} | ||
if (status === 'done') { | ||
message.success(`${info.file.name} file uploaded successfully.`); | ||
} else if (status === 'error') { | ||
message.error(`${info.file.name} file upload failed.`); | ||
} | ||
}, | ||
onDrop(e) { | ||
console.log('Dropped files', e.dataTransfer.files); | ||
}, | ||
}; | ||
|
||
const handleOk = () => { | ||
setIsModalOpen(false); | ||
}; | ||
|
||
const handleCancel = () => { | ||
setIsModalOpen(false); | ||
}; | ||
|
||
return ( | ||
<> | ||
<Modal | ||
title="File upload" | ||
open={isModalOpen} | ||
onOk={handleOk} | ||
onCancel={handleCancel} | ||
> | ||
<Segmented options={['Local uploads', 'S3 uploads']} block /> | ||
<Dragger {...props}> | ||
<p className="ant-upload-drag-icon"> | ||
<InboxOutlined /> | ||
</p> | ||
<p className="ant-upload-text"> | ||
Click or drag file to this area to upload | ||
</p> | ||
<p className="ant-upload-hint"> | ||
Support for a single or bulk upload. Strictly prohibited from | ||
uploading company data or other banned files. | ||
</p> | ||
</Dragger> | ||
</Modal> | ||
</> | ||
); | ||
}; | ||
|
||
export default FileUploadModal; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,67 @@ | ||
import { IModalManagerChildrenProps } from '@/components/modal-manager'; | ||
import { useTranslate } from '@/hooks/commonHooks'; | ||
import { Form, Input, Modal } from 'antd'; | ||
|
||
interface IProps extends Omit<IModalManagerChildrenProps, 'showModal'> { | ||
loading: boolean; | ||
onOk: (name: string) => void; | ||
} | ||
|
||
const FolderCreateModal = ({ visible, hideModal, loading, onOk }: IProps) => { | ||
const [form] = Form.useForm(); | ||
const { t } = useTranslate('common'); | ||
|
||
type FieldType = { | ||
name?: string; | ||
}; | ||
|
||
const handleOk = async () => { | ||
const ret = await form.validateFields(); | ||
|
||
return onOk(ret.name); | ||
}; | ||
|
||
const handleCancel = () => { | ||
hideModal(); | ||
}; | ||
|
||
const onFinish = (values: any) => { | ||
console.log('Success:', values); | ||
}; | ||
|
||
const onFinishFailed = (errorInfo: any) => { | ||
console.log('Failed:', errorInfo); | ||
}; | ||
|
||
return ( | ||
<Modal | ||
title={'New Folder'} | ||
open={visible} | ||
onOk={handleOk} | ||
onCancel={handleCancel} | ||
okButtonProps={{ loading }} | ||
confirmLoading={loading} | ||
> | ||
<Form | ||
name="basic" | ||
labelCol={{ span: 4 }} | ||
wrapperCol={{ span: 20 }} | ||
style={{ maxWidth: 600 }} | ||
onFinish={onFinish} | ||
onFinishFailed={onFinishFailed} | ||
autoComplete="off" | ||
form={form} | ||
> | ||
<Form.Item<FieldType> | ||
label={t('name')} | ||
name="name" | ||
rules={[{ required: true, message: t('namePlaceholder') }]} | ||
> | ||
<Input /> | ||
</Form.Item> | ||
</Form> | ||
</Modal> | ||
); | ||
}; | ||
|
||
export default FolderCreateModal; |
Oops, something went wrong.