fix(web): FileUpload bugfix

This commit is contained in:
zhaoying
2026-02-10 17:42:40 +08:00
parent 01458ac111
commit bacffc94d9
4 changed files with 26 additions and 48 deletions

View File

@@ -2,7 +2,7 @@
* @Author: ZhaoYing
* @Date: 2026-02-03 16:27:39
* @Last Modified by: ZhaoYing
* @Last Modified time: 2026-02-10 12:18:23
* @Last Modified time: 2026-02-10 17:40:15
*/
/**
* Chat debugging component for application testing
@@ -366,10 +366,8 @@ const Chat: FC<ChatProps> = ({ chatList, data, updateChatList, handleSave, sourc
const handleMessageChange = (message: string) => {
setMessage(message)
}
const [update, setUpdate] = useState(false)
const fileChange = (file?: any) => {
setFileList([...fileList, file])
setUpdate(prev => !prev)
}
// const handleRecordingComplete = async (file: any) => {
// console.log('file', file)
@@ -456,29 +454,27 @@ const Chat: FC<ChatProps> = ({ chatList, data, updateChatList, handleSave, sourc
onChange={handleMessageChange}
>
<Flex justify="space-between" className="rb:flex-1">
<Flex gap={8} align="center">
<Dropdown
menu={{
items: [
{ key: 'define', label: t('memoryConversation.addRemoteFile') },
{
key: 'upload', label: (
<UploadFiles
fileType={['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg']}
onChange={fileChange}
fileList={[]}
update={update}
/>
)
},
],
onClick: handleShowUpload
}}
>
<div
className="rb:size-6 rb:cursor-pointer rb:bg-cover rb:bg-[url('@/assets/images/conversation/link.svg')] rb:hover:bg-[url('@/assets/images/conversation/link_hover.svg')]"
></div>
</Dropdown>
<Flex gap={8} align="center">
<Dropdown
menu={{
items: [
{ key: 'define', label: t('memoryConversation.addRemoteFile') },
{
key: 'upload', label: (
<UploadFiles
fileType={['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg']}
onChange={fileChange}
/>
)
},
],
onClick: handleShowUpload
}}
>
<div
className="rb:size-6 rb:cursor-pointer rb:bg-cover rb:bg-[url('@/assets/images/conversation/link.svg')] rb:hover:bg-[url('@/assets/images/conversation/link_hover.svg')]"
></div>
</Dropdown>
</Flex>
{/* <Flex align="center">
<AudioRecorder onRecordingComplete={handleRecordingComplete} />

View File

@@ -2,7 +2,7 @@
* @Author: ZhaoYing
* @Date: 2026-02-06 21:09:42
* @Last Modified by: ZhaoYing
* @Last Modified time: 2026-02-09 16:41:31
* @Last Modified time: 2026-02-10 17:40:08
*/
/**
* File Upload Component
@@ -55,8 +55,6 @@ interface UploadFilesProps extends Omit<UploadProps, 'onChange'> {
maxCount?: number;
/** Custom file removal callback */
onRemove?: (file: UploadFile) => boolean | void | Promise<boolean | void>;
/** Trigger to reset file list */
update?: boolean;
}
// Mapping of file extensions to MIME types
const ALL_FILE_TYPE: {
@@ -109,7 +107,6 @@ const UploadFiles = forwardRef<UploadFilesRef, UploadFilesProps>(({
isAutoUpload = true,
maxCount = 1,
onRemove: customOnRemove,
update,
requestConfig,
...props
}, ref) => {
@@ -118,11 +115,6 @@ const UploadFiles = forwardRef<UploadFilesRef, UploadFilesProps>(({
const [fileList, setFileList] = useState<UploadFile[]>(propFileList);
const [accept, setAccept] = useState<string | undefined>();
// Reset file list when update prop changes
useEffect(() => {
setFileList([])
}, [update])
/**
* Validates file type and size before upload
* @returns Upload.LIST_IGNORE to prevent upload, or true to proceed
@@ -185,9 +177,7 @@ const UploadFiles = forwardRef<UploadFilesRef, UploadFilesProps>(({
/**
* Handles upload state changes
*/
const handleChange: UploadProps['onChange'] = ({ fileList: newFileList, event }) => {
console.log('event', event)
setFileList(newFileList);
const handleChange: UploadProps['onChange'] = ({ fileList: newFileList }) => {
if (onChange) {
onChange(maxCount === 1 ? newFileList[0] : newFileList);
}

View File

@@ -2,7 +2,7 @@
* @Author: ZhaoYing
* @Date: 2026-02-03 16:58:03
* @Last Modified by: ZhaoYing
* @Last Modified time: 2026-02-09 20:20:01
* @Last Modified time: 2026-02-10 17:41:05
*/
/**
* Conversation Page
@@ -254,10 +254,8 @@ const Conversation: FC = () => {
})
}
const [update, setUpdate] = useState(false)
const fileChange = (file?: any) => {
form.setFieldValue('files', [...(queryValues.files || []), file])
setUpdate(prev => !prev)
}
// const handleRecordingComplete = async (file: any) => {
// console.log('file', file)
@@ -353,8 +351,6 @@ const Conversation: FC = () => {
action={shareFileUploadUrlWithoutApiPrefix}
fileType={['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg']}
onChange={fileChange}
fileList={[]}
update={update}
requestConfig={{
headers: {
'Content-Type': 'multipart/form-data',

View File

@@ -2,7 +2,7 @@
* @Author: ZhaoYing
* @Date: 2026-02-06 21:10:56
* @Last Modified by: ZhaoYing
* @Last Modified time: 2026-02-10 12:17:41
* @Last Modified time: 2026-02-10 17:41:24
*/
/**
* Workflow Chat Component
@@ -343,13 +343,11 @@ const Chat = forwardRef<ChatRef, { appId: string; graphRef: GraphRef }>(({ appId
const handleMessageChange = (message: string) => {
setMessage(message)
}
const [update, setUpdate] = useState(false)
/**
* Handles file upload from local device
*/
const fileChange = (file?: any) => {
setFileList([...fileList, file])
setUpdate(prev => !prev)
}
// const handleRecordingComplete = async (file: any) => {
// console.log('file', file)
@@ -517,8 +515,6 @@ const Chat = forwardRef<ChatRef, { appId: string; graphRef: GraphRef }>(({ appId
<UploadFiles
fileType={['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg']}
onChange={fileChange}
fileList={[]}
update={update}
/>
)
},