diff --git a/apps/admin-web/src/components/OssUpload.tsx b/apps/admin-web/src/components/OssUpload.tsx index 12f1634..314edf2 100644 --- a/apps/admin-web/src/components/OssUpload.tsx +++ b/apps/admin-web/src/components/OssUpload.tsx @@ -1,5 +1,5 @@ -import { useState } from 'react'; -import { Button, Image, Input, Modal, Space, Upload, message } from 'antd'; +import { useState, type ReactNode } from 'react'; +import { Button, Image, Input, Modal, Space, Typography, Upload, message } from 'antd'; import { EyeOutlined, FilePdfOutlined, UploadOutlined } from '@ant-design/icons'; import type { UploadProps } from 'antd'; import { uploadFileToOss, type OssMediaType, type UploadFileResult } from '../lib/upload'; @@ -13,6 +13,7 @@ type OssUploadProps = { accept?: string; maxSizeMb?: number; placeholder?: string; + uploadHint?: ReactNode; }; function isImageUrl(url: string) { @@ -23,6 +24,32 @@ function isPdfUrl(url: string) { return /\.pdf(\?|#|$)/i.test(url); } +function formatUploadImageMessage(result: UploadFileResult): string { + const img = result.image; + if (!img) return '上传成功'; + const sizeLabel = `${img.width}×${img.height}`; + if (img.compressed && img.originalWidth && img.originalHeight) { + const original = `${img.originalWidth}×${img.originalHeight}`; + if (original !== sizeLabel) { + return `上传成功(${sizeLabel},已由 ${original} 自动压缩)`; + } + } + return `上传成功(${sizeLabel})`; +} + +function formatUploadImageHint(result: UploadFileResult): string | null { + const img = result.image; + if (!img) return null; + const sizeLabel = `${img.width}×${img.height}`; + if (img.compressed && img.originalWidth && img.originalHeight) { + const original = `${img.originalWidth}×${img.originalHeight}`; + if (original !== sizeLabel) { + return `${sizeLabel}(已由 ${original} 自动压缩)`; + } + } + return sizeLabel; +} + export default function OssUpload({ value, onChange, @@ -31,9 +58,11 @@ export default function OssUpload({ mediaType = 'IMAGE', accept, placeholder = '上传后自动填入,或手动粘贴 URL', + uploadHint, }: OssUploadProps) { const [uploading, setUploading] = useState(false); const [pdfPreviewOpen, setPdfPreviewOpen] = useState(false); + const [imageMetaHint, setImageMetaHint] = useState(null); const resolvedAccept = accept ?? (mediaType === 'VIDEO' ? 'video/*' : mediaType === 'FILE' ? undefined : 'image/*'); @@ -45,7 +74,9 @@ export default function OssUpload({ const result = await uploadFileToOss(raw, { bizType, mediaType }); onChange?.(result.url); onUploaded?.(result); - message.success('上传成功'); + const successMessage = formatUploadImageMessage(result); + setImageMetaHint(formatUploadImageHint(result)); + message.success(successMessage); onSuccess?.(result); } catch (e) { const err = e instanceof Error ? e : new Error('上传失败'); @@ -116,6 +147,16 @@ export default function OssUpload({