fix:文件上传

a1e3e972 · 黄燕娟 · a2415598 · a1e3e972 · a1e3e972 · a1e3e972
Commit a1e3e972 authored Feb 28, 2024 by 黄燕娟
Showing with 52 additions and 123 deletions
.env.test
src/api/request.js
src/api/sys.js
src/components/common/Editor.vue
src/views/common/form/components/FileUpload.vue
src/views/common/form/components/ImageUpload.vue
--- a/.env.test
+++ b/.env.test
 # 开发环境配置
 VUE_APP_MODE = 'test'
-VUE_APP_BASE_API = '/api'
+VUE_APP_BASE_API = 'http://sz-tianma.meiqicloud.com/api'
 VITE_AXIOS_API_PRIMARY = 'http://rapidplatform.meiqicloud.com/api'
 VUE_APP_SERVER_URL = 'http://sz-tianma.meiqicloud.com/api'
--- a/src/api/request.js
+++ b/src/api/request.js
@@ -46,7 +46,7 @@ axios.interceptors.response.use(
    (response) => {
        console.log('response', response)
        let { code } = response.data;
-        if (code === 501) {
+        if (code === 113) {
            window.parent.postMessage(
                { text: "子页面发消息给父页面", type: "token-past-due" },
                "*"
@@ -61,9 +61,9 @@ axios.interceptors.response.use(
    (error) => {
        console.log('error', error)
        if (!error.response) return Promise.reject(error);
-        const { code, data, config } = error.response;
+        const { status, data, config } = error.response;
-        switch (code) {
+        switch (status) {
            // 需要重新登录
            case 401: {
                break;

--- a/src/api/sys.js
+++ b/src/api/sys.js
@@ -27,7 +27,7 @@ export function userGroupPage(params) {
 // 文件上传
 export function sysUpload(params) {
    return request({
-        url: `/a/sys/upload`,
+        url: `/a/sys/file/uploadFile`,
        method: 'post',
        data: params
    })

--- a/src/components/common/Editor.vue
+++ b/src/components/common/Editor.vue
@@ -85,20 +85,15 @@ export default {
          let formData = new FormData();
          formData.append("file", blobInfo.blob(), blobInfo.filename());
          formData.append("isImg", true);
-          axios
-            .post(this.uploadUrl, formData, {
+          sysUpload(formData)
-              "Content-type": "multipart/form-data",
+            .then((res) => {
-            })
-            .then(
-              (res) => {
              this.$message.success("上传成功");
-                success(this.$getRes(res.data.url));
+              success(this.$getRes(res.data.fullPath));
-              },
+            })
-              (err) => {
+            .catch(() => {
-                this.$message.error("上传失败");
+              Toast.fail("上传失败");
-                console.log(err);
+            });
-              }
-            );
        },
        setup: (editor) => {
          editor.on("init", (e) => {
@@ -112,22 +107,6 @@ export default {
    };
  },
  computed: {
-    uploadUrl() {
-      let mode = sessionStorage.getItem("mode");
-      if (process.env.VUE_APP_MODE === "development") {
-        if (mode !== "PC") {
-          return "/a/wflow/res";
-        } else {
-          return process.env.VUE_APP_BASE_API + "/a/wflow/res";
-        }
-      } else {
-        if (mode !== "PC") {
-          return "/a/wflow/res";
-        } else {
-          return process.env.VUE_APP_SERVER_URL + "/a/wflow/res";
-        }
-      }
-    },
    _value: {
      get() {
        return this.value;

--- a/src/views/common/form/components/FileUpload.vue
+++ b/src/views/common/form/components/FileUpload.vue
@@ -13,7 +13,8 @@
    <div v-else-if="mode === 'PC' && !readonly" v-loading="loading">
      <el-upload
        :file-list="fileList"
-        :action="uploadUrl"
+        action=""
+        :http-request="uploadFile"
        :limit="maxNumber"
        with-credentials
        :multiple="maxNumber > 1"
@@ -100,7 +101,7 @@
 import componentMinxins from "../ComponentMinxins";
 import { Uploader, Toast } from "vant";
 import axios from "axios";
-import { CONDITION_PROPS } from "../../../admin/layout/process/DefaultNodeProps";
+import { sysUpload } from "@/api/sys.js";
 export default {
  mixins: [componentMinxins],
  name: "FileUpload",
@@ -132,22 +133,6 @@ export default {
    },
  },
  computed: {
-    uploadUrl() {
-      let mode = sessionStorage.getItem("mode");
-      if (process.env.VUE_APP_MODE === "development") {
-        if (mode !== "PC") {
-          return "/a/wflow/res";
-        } else {
-          return process.env.VUE_APP_BASE_API + "/a/wflow/res";
-        }
-      } else {
-        if (mode !== "PC") {
-          return "/a/wflow/res";
-        } else {
-          return process.env.VUE_APP_SERVER_URL + "/a/wflow/res";
-        }
-      }
-    },
    sizeTip() {
      if (this.fileTypes.length > 0) {
        return ` | 只允许上传[${String(this.fileTypes).replaceAll(
@@ -189,7 +174,6 @@ export default {
      uploadParams: { isImg: false },
      headers: {
        token: localStorage.getItem("token"),
-        factoryId: localStorage.getItem("factoryId"),
      },
    };
  },
@@ -225,13 +209,7 @@ export default {
        return size + "B";
      }
    },
-    removeFile(fileId) {
-      axios
-        .delete(`${process.env.VUE_APP_BASE_API}/a/wflow/res/${fileId}`)
-        .then((rsp) => {
-          this.$message.success("移除文件成功");
-        });
-    },
    uploadSuccess(response, file, fileList) {
      this.loading = false;
      console.log(response, this._value);
@@ -261,27 +239,28 @@ export default {
        this.uploadFile(file);
      }
    },
-    uploadFile(file) {
+    uploadFile(params) {
      //上传文件
      const formData = new FormData();
-      formData.append("file", file.file);
+      formData.append("file", params.file);
      formData.append("isImg", false);
-      Toast.loading({ message: "上传中...", forbidClick: true });
-      axios
+      sysUpload(formData)
-        .post(this.uploadUrl, formData, {
+        .then((res) => {
-          "Content-type": "multipart/form-data",
+          this._value.push({
-        })
+            ...res.data,
-        .then(
+            url: res.data.fullPath,
-          (res) => {
+            name: res.data.originalName,
-            this._value.push(res.data);
+          });
+          console.log(7886, res.data);
          this.$emit("input", this._value);
          Toast.success("上传成功");
-          },
+          this.loading = false;
-          (err) => {
+        })
+        .catch(() => {
          Toast.fail("上传失败");
-            console.log(err);
+          this.loading = false;
-          }
+        });
-        );
    },
    onOversize(file) {
      Toast.fail("文件过大");
@@ -289,7 +268,6 @@ export default {
    handleRemove(file, fileList) {
      let i = this._value.findIndex((v) => v.name === file.name);
      if (i > -1) {
-        //this.removeFile(this._value[i].id)
        this._value.splice(i, 1);
        this.$emit("input", this._value);
        console.log("删除文件", file);

--- a/src/views/common/form/components/ImageUpload.vue
+++ b/src/views/common/form/components/ImageUpload.vue
@@ -9,10 +9,11 @@
    <div v-else-if="mode === 'PC' && !readonly">
      <el-upload
        :file-list="fileList"
-        :action="uploadUrl"
+        action=""
        :limit="maxNumber"
        with-credentials
        :multiple="maxNumber > 1"
+        :http-request="uploadFile"
        :headers="headers"
        :data="uploadParams"
        :on-success="uploadSuccess"
@@ -24,7 +25,6 @@
        auto-upload
        :before-upload="beforeUpload"
      >
-        <!-- :http-request="uploadImg"  -->
        <i slot="default" class="el-icon-plus"></i>
        <div slot="tip" class="el-upload__tip">
          {{ placeholder }} {{ sizeTip }}
@@ -66,7 +66,7 @@ import { Uploader, Toast } from "vant";
 import componentMinxins from "../ComponentMinxins";
 import axios from "@/api/request";
 import { deepClone } from "@/utils/common.js";
+import { sysUpload } from "@/api/sys.js";
 export default {
  mixins: [componentMinxins],
  name: "ImageUpload",
@@ -96,22 +96,6 @@ export default {
    },
  },
  computed: {
-    uploadUrl() {
-      let mode = sessionStorage.getItem("mode");
-      if (process.env.VUE_APP_MODE === "development") {
-        if (mode !== "PC") {
-          return "/a/wflow/res";
-        } else {
-          return process.env.VUE_APP_BASE_API + "/a/wflow/res";
-        }
-      } else {
-        if (mode !== "PC") {
-          return "/a/wflow/res";
-        } else {
-          return process.env.VUE_APP_SERVER_URL + "/a/wflow/res";
-        }
-      }
-    },
    sizeTip() {
      return this.maxSize > 0 ? `| 每张图不超过${this.maxSize}MB` : "";
    },
@@ -169,24 +153,16 @@ export default {
      }
      return false;
    },
-    removeFile(fileId) {
-      axios
-        .delete(`${process.env.VUE_APP_BASE_API}/a/wflow/res/${fileId}`)
-        .then((rsp) => {
-          this.$message.success("移除文件成功");
-        });
-    },
    uploadSuccess(response, file, fileList) {
-      console.log(4444, response);
+      console.log("uploadSuccess", response);
      this.loading = false;
-      this.catchList.push(response);
+      this.catchList.push({ ...response.data, url: response.data.fullPath });
      let ft = fileList.filter((f) => f.size !== undefined);
      if (this.catchList.length === ft.length) {
        this._value.push(...this.catchList);
        this.$emit("input", this._value);
      }
-      this.$message.success(response.name + "上传成功");
+      this.$message.success("图片上传成功");
    },
    uploadFail(err) {
      this.loading = false;
@@ -201,28 +177,25 @@ export default {
        this.uploadFile(file);
      }
    },
-    // uploadImg(params) {},
-    uploadFile(file) {
+    uploadFile(params) {
      //上传文件
      const formData = new FormData();
-      formData.append("file", file.file);
+      formData.append("file", params.file);
      formData.append("isImg", true);
-      console.log(5555, this.uploadUrl);
+      sysUpload(formData)
-      axios
+        .then((res) => {
-        .post(this.uploadUrl, formData, {
+          this._value.push({
-          "Content-type": "multipart/form-data",
+            ...res.data,
-        })
+            url: res.data.fullPath,
-        .then(
+            name: res.data.originalName,
-          (res) => {
+          });
-            this._value.push(res.data);
          this.$emit("input", this._value);
          Toast.success("上传成功");
-          },
+        })
-          (err) => {
+        .catch(() => {
          Toast.fail("上传失败");
-            console.log(err);
+        });
-          }
-        );
    },
    overLimit() {
      if (this.mode === "PC") {
@@ -237,7 +210,6 @@ export default {
    handleRemove(file, fileList) {
      let i = this._value.findIndex((v) => v.name === file.name);
      if (i > -1) {
-        //this.removeFile(this._value[i].id)
        this._value.splice(i, 1);
        this.$emit("input", this._value);
      }