|
@@ -262,7 +262,7 @@ function getWorkbench(): void {
|
|
|
})
|
|
})
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-const beforeReadImage = async (file: File | File[]): Promise<UploadImage[] | false> => {
|
|
|
|
|
|
|
+const beforeReadImage = async (file: File | File[]): Promise<File[] | false> => {
|
|
|
const files = Array.isArray(file) ? file : [file]
|
|
const files = Array.isArray(file) ? file : [file]
|
|
|
const normalizedFiles: File[] = []
|
|
const normalizedFiles: File[] = []
|
|
|
|
|
|
|
@@ -293,17 +293,58 @@ const beforeReadImage = async (file: File | File[]): Promise<UploadImage[] | fal
|
|
|
normalizedFiles.push(f)
|
|
normalizedFiles.push(f)
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- // 返回增强的图片对象数组,包含状态信息
|
|
|
|
|
- return normalizedFiles.map((f) => ({
|
|
|
|
|
- file: f, // 原始File对象
|
|
|
|
|
|
|
+ // 返回原始 File 数组 给 van-uploader 进行默认处理,
|
|
|
|
|
+ // 我们会在 after-add watcher 中将其转换为 UploadImage 对象。
|
|
|
|
|
+ return normalizedFiles
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 将 van-uploader 添加的文件项规范化为 UploadImage 对象
|
|
|
|
|
+function toUploadImage(item: any): UploadImage {
|
|
|
|
|
+ // Vant 可能直接传入 File,也可能是 { file, url, status }
|
|
|
|
|
+ const fileObj: File = item?.file instanceof File ? item.file : item instanceof File ? item : null
|
|
|
|
|
+ const url = item?.url || (fileObj ? URL.createObjectURL(fileObj) : null)
|
|
|
|
|
+ return {
|
|
|
|
|
+ file: fileObj,
|
|
|
status: UPLOAD_STATUS.PENDING,
|
|
status: UPLOAD_STATUS.PENDING,
|
|
|
- url: null,
|
|
|
|
|
|
|
+ url: url,
|
|
|
error: null,
|
|
error: null,
|
|
|
retryCount: 0,
|
|
retryCount: 0,
|
|
|
- originalFile: f, // 保留用于重传
|
|
|
|
|
- }))
|
|
|
|
|
|
|
+ originalFile: fileObj,
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+// 监听 van-uploader 绑定的数组,自动将新加入的原始文件项转换为 UploadImage
|
|
|
|
|
+import { watch } from 'vue'
|
|
|
|
|
+watch(
|
|
|
|
|
+ outerImages,
|
|
|
|
|
+ (newVal, oldVal) => {
|
|
|
|
|
+ if (!Array.isArray(newVal)) return
|
|
|
|
|
+ // 如果数组项已经是 UploadImage(包含 status 字段),跳过
|
|
|
|
|
+ const needsNormalize = newVal.some((it: any) => !it || !('status' in it))
|
|
|
|
|
+ if (!needsNormalize) return
|
|
|
|
|
+
|
|
|
|
|
+ const normalized = newVal.map((it: any) => {
|
|
|
|
|
+ return 'status' in it ? it : toUploadImage(it)
|
|
|
|
|
+ })
|
|
|
|
|
+ outerImages.value = normalized
|
|
|
|
|
+ },
|
|
|
|
|
+ { deep: true },
|
|
|
|
|
+)
|
|
|
|
|
+
|
|
|
|
|
+watch(
|
|
|
|
|
+ innerImages,
|
|
|
|
|
+ (newVal, oldVal) => {
|
|
|
|
|
+ if (!Array.isArray(newVal)) return
|
|
|
|
|
+ const needsNormalize = newVal.some((it: any) => !it || !('status' in it))
|
|
|
|
|
+ if (!needsNormalize) return
|
|
|
|
|
+ const normalized = newVal.map((it: any) => {
|
|
|
|
|
+ return 'status' in it ? it : toUploadImage(it)
|
|
|
|
|
+ })
|
|
|
|
|
+ innerImages.value = normalized
|
|
|
|
|
+ },
|
|
|
|
|
+ { deep: true },
|
|
|
|
|
+)
|
|
|
|
|
+
|
|
|
// 单张图片上传函数
|
|
// 单张图片上传函数
|
|
|
const uploadSingleImage = async (
|
|
const uploadSingleImage = async (
|
|
|
imageObj: UploadImage,
|
|
imageObj: UploadImage,
|