新增上传多张图片功能

@@ -130,7 +130,8 @@ const uploadQiniu = async (file, token, filename) => {
 };
 /****************** END *******************/
 
-const afterRead = async (files) => {
+const handleUpload = async (files) => {
+  // 上传图片流程
   loading.value = true;
   // 获取HASH值
   const hash = getEtag(files.content);
@@ -144,30 +145,65 @@ const afterRead = async (files) => {
   files.status = "uploading";
   files.message = "上传中...";
   const imgUrl = await uploadQiniu(files.file, token, filename);
-  // 上传失败提示
-  if (!imgUrl.src) {
-    files.status = "failed";
-    files.message = "上传失败";
-    loading.value = false;
-  } else {
-    files.status = "";
-    files.message = "";
-    fileList.value.pop();
-    fileList.value.push({
-      url: imgUrl.src,
-      isImage: true,
-    });
+  return { imgUrl };
+};
 
-    props.item.value = {
-      key: "image_uploader",
-      filed_name: props.item.key,
-      value: fileList.value,
-    };
-    emit("active", props.item.value);
-    loading.value = false;
+var muliUpload = async (files) => {
+  for (let item of files) {
+    const res = await handleUpload(item);
+    console.warn(res.imgUrl.src);
+    // 上传失败提示
+    if (!res.imgUrl.src) {
+      item.status = "failed";
+      item.message = "上传失败";
+      loading.value = false;
+    } else {
+      item.status = "";
+      item.message = "";
+      // fileList.value.pop();
+      fileList.value.push({
+        url: res.imgUrl.src,
+        isImage: true,
+      });
+      loading.value = false;
+    }
   }
 };
 
+const afterRead = async (files) => {
+  if (Array.isArray(files)) {
+    // 多张图片上传files是一个数组
+    muliUpload(files);
+  } else {
+    const { imgUrl } = await handleUpload(files);
+    // 上传失败提示
+    if (!imgUrl.src) {
+      files.status = "failed";
+      files.message = "上传失败";
+      loading.value = false;
+    } else {
+      files.status = "";
+      files.message = "";
+      fileList.value.pop();
+      fileList.value.push({
+        url: imgUrl.src,
+        isImage: true,
+      });
+      loading.value = false;
+    }
+  }
+  fileList.value = fileList.value.filter((item) => {
+    if (item.url) return item;
+  });
+  props.item.value = {
+    key: "image_uploader",
+    filed_name: props.item.key,
+    value: fileList.value,
+  };
+  emit("active", props.item.value);
+  console.warn(fileList.value);
+};
+
 const beforeDelete = (files) => {
   fileList.value = fileList.value.filter((item) => {
     if (item.url !== files.url) return item;