修复验收图片多选暂存
This commit is contained in:
@@ -1,6 +1,7 @@
|
||||
import { Image, Typography } from 'antd'
|
||||
|
||||
import type { UploadedFile } from '@/types/worker-platform'
|
||||
import { getImageIdentityFromUrl } from '@/utils/image-identity'
|
||||
|
||||
type ImagePreviewListProps = {
|
||||
files?: UploadedFile[]
|
||||
@@ -44,15 +45,10 @@ function normalizePreviewItems(files: UploadedFile[], imageUrls: string[]) {
|
||||
mediumUrl: file.mediumUrl || file.url,
|
||||
}))
|
||||
.filter((item) => Boolean(item.url))
|
||||
const fileUrlSet = new Set(normalizedFiles.map((item) => getImageIdentity(item.url)))
|
||||
const fileUrlSet = new Set(normalizedFiles.map((item) => getImageIdentityFromUrl(item.url)))
|
||||
const normalizedUrls = imageUrls
|
||||
.map((url) => String(url || '').trim())
|
||||
.filter((url) => url && !fileUrlSet.has(getImageIdentity(url)))
|
||||
.filter((url) => url && !fileUrlSet.has(getImageIdentityFromUrl(url)))
|
||||
.map((url) => ({ url, thumbnailUrl: url, mediumUrl: url }))
|
||||
return [...normalizedFiles, ...normalizedUrls]
|
||||
}
|
||||
|
||||
/** 忽略临时签名参数,避免同一存储对象重复显示。 */
|
||||
function getImageIdentity(value: string) {
|
||||
return String(value || '').trim().split(/[?#]/, 1)[0]
|
||||
}
|
||||
|
||||
@@ -89,7 +89,10 @@ export default function ImageUpload({
|
||||
message.error(error instanceof Error ? error.message : '上传失败')
|
||||
}
|
||||
}
|
||||
if (next.length > valueRef.current.length) onChange?.(next)
|
||||
if (next.length > valueRef.current.length) {
|
||||
valueRef.current = next
|
||||
onChange?.(next)
|
||||
}
|
||||
}
|
||||
|
||||
async function uploadFiles(files: File[]) {
|
||||
@@ -141,7 +144,10 @@ export default function ImageUpload({
|
||||
const customRequest: UploadProps['customRequest'] = async (options) => {
|
||||
try {
|
||||
const uploaded = await uploadFile(options.file as File, scene, scope)
|
||||
onChange?.([...value, uploaded].slice(-maxCount))
|
||||
// 多文件选择会并发执行 customRequest,必须以 ref 中的最新列表累加,避免后完成的上传覆盖前面的图片。
|
||||
const next = [...valueRef.current, uploaded].slice(0, maxCount)
|
||||
valueRef.current = next
|
||||
onChange?.(next)
|
||||
options.onSuccess?.(uploaded)
|
||||
} catch (error) {
|
||||
message.error(error instanceof Error ? error.message : '上传失败')
|
||||
@@ -160,14 +166,17 @@ export default function ImageUpload({
|
||||
>
|
||||
<Upload
|
||||
accept="image/jpeg,image/png,image/webp"
|
||||
multiple
|
||||
listType="picture-card"
|
||||
fileList={fileList}
|
||||
maxCount={maxCount}
|
||||
customRequest={customRequest}
|
||||
onRemove={(file) => {
|
||||
onChange?.(
|
||||
value.filter((item) => (item.objectKey || item.url) !== file.uid),
|
||||
const next = valueRef.current.filter(
|
||||
(item) => (item.objectKey || item.url) !== file.uid,
|
||||
)
|
||||
valueRef.current = next
|
||||
onChange?.(next)
|
||||
return true
|
||||
}}
|
||||
showUploadList={{ showPreviewIcon: false }}
|
||||
|
||||
Reference in New Issue
Block a user