新增上传多张图片功能

@@ -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,6 +145,37 @@ const afterRead = async (files) => {
   files.status = "uploading";
   files.message = "上传中...";
   const imgUrl = await uploadQiniu(files.file, token, filename);
+  return { imgUrl };
+};
+
+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";
@@ -157,15 +189,19 @@ const afterRead = async (files) => {
         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);
-    loading.value = false;
-  }
+  console.warn(fileList.value);
 };
 
 const beforeDelete = (files) => {