修复验收图片多选暂存

This commit is contained in:
yml2213
2026-08-15 14:49:48 +08:00
parent 190445319b
commit d433518038
5 changed files with 305 additions and 126 deletions
@@ -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 }}