feat: 新增投放指南组件和优化品牌物料页面

src/components/upload/ImageUpload.vue

@@ -107,54 +107,27 @@ const handleError = (error) => {
   console.error(error);
 };
 
-const customRequest = (option) => {
+const customRequest = async (option) => {
   const { onProgress, onError, onSuccess, fileItem, name } = option;
-  const xhr = new XMLHttpRequest();
-  if (xhr.upload) {
-    xhr.upload.onprogress = function (event) {
-      let percent;
-      if (event.total > 0) {
-        // 0 ~ 1
-        percent = event.loaded / event.total;
-      }
-      onProgress(percent, event);
-    };
-  }
-  xhr.onerror = function error(e) {
-    onError(e);
-  };
-  xhr.onload = function onload() {
-    if (xhr.status < 200 || xhr.status >= 300) {
-      return onError(xhr.responseText);
-    }
-    let response = JSON.parse(xhr.response);
-    if (response && response.data.upload_url) {
-      const blob = new Blob([fileItem.file], { type: fileItem.file.type });
-      axios
-        .put(response.data.upload_url, blob, {
-          headers: { 'Content-Type': fileItem.file.type },
-        })
-        .then(() => {
-          onSuccess(xhr.response);
-        })
-        .catch((error) => {
-          onError(error);
-        });
-    } else {
-      onError(xhr.response);
-    }
-  };
+  try {
+    // 1. 获取预签名上传URL
+    const response = await fetchImageUploadFile({ suffix: getFileExtension(fileItem.file.name) });
+    const preSignedUrl = response?.data?.upload_url;
 
-  const formData = new FormData();
-  formData.append(name || 'file', fileItem.file);
-  xhr.open('get', '/api/v1/oss/image-pre-signed-url?suffix=png', true);
-  xhr.send(formData);
-  let extension = getFileExtension(fileItem.file.name);
-  return {
-    abort() {
-      xhr.abort();
-    },
-  };
+    if (!preSignedUrl) {
+      throw new Error('未能获取有效的预签名上传地址');
+    }
+    console.log('preSignedUrl', preSignedUrl);
+    // 2. 使用预签名URL上传文件
+    const blob = new Blob([fileItem.file], { type: fileItem.file.type });
+    await axios.put(preSignedUrl, blob, {
+      headers: { 'Content-Type': fileItem.file.type },
+    });
+
+    onSuccess(JSON.stringify(response));
+  } catch (error) {
+    onError(error);
+  }
 };
 
 function getFileExtension(filename: string): string {