更新文件上传接口

dsk-operate-ui/src/components/Editor/index.vue

@@ -60,7 +60,7 @@ export default {
   },
   data() {
     return {
-      uploadUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址
+      uploadUrl: process.env.VUE_APP_BASE_API + "/system/oss/upload", // 上传的图片服务器地址
       headers: {
         Authorization: "Bearer " + getToken()
       },
@@ -176,11 +176,11 @@ export default {
         // 获取光标所在位置
         let length = quill.getSelection().index;
         // 插入图片  res.url为服务器返回的图片地址
-        quill.insertEmbed(length, "image", process.env.VUE_APP_BASE_API + res.fileName);
+        quill.insertEmbed(length, "image", res.data.url);
         // 调整光标到最后
         quill.setSelection(length + 1);
       } else {
-        this.$message.error("图片插入失败");
+        this.$message.error(res.msg);
       }
     },
     handleUploadError() {

dsk-operate-ui/src/components/FileUpload/index.vue

@@ -28,7 +28,7 @@
     <!-- 文件列表 -->
     <transition-group class="upload-file-list el-upload-list el-upload-list--text" name="el-fade-in-linear" tag="ul">
       <li :key="file.url" class="el-upload-list__item ele-upload-list__item-content" v-for="(file, index) in fileList">
-        <el-link :href="`${baseUrl}${file.url}`" :underline="false" target="_blank">
+        <el-link :href="`${file.url}`" :underline="false" target="_blank">
           <span class="el-icon-document"> {{ getFileName(file.name) }} </span>
         </el-link>
         <div class="ele-upload-list__item-content-action">
@@ -41,6 +41,7 @@
 
 <script>
 import { getToken } from "@/utils/auth";
+import { listByIds, delOss } from "@/api/system/oss";
 
 export default {
   name: "FileUpload",
@@ -73,7 +74,7 @@ export default {
       number: 0,
       uploadList: [],
       baseUrl: process.env.VUE_APP_BASE_API,
-      uploadFileUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传文件服务器地址
+      uploadFileUrl: process.env.VUE_APP_BASE_API + "/system/oss/upload", // 上传文件服务器地址
       headers: {
         Authorization: "Bearer " + getToken(),
       },
@@ -82,16 +83,24 @@ export default {
   },
   watch: {
     value: {
-      handler(val) {
+      async handler(val) {
         if (val) {
           let temp = 1;
           // 首先将值转为数组
-          const list = Array.isArray(val) ? val : this.value.split(',');
+          let list;
+          if (Array.isArray(val)) {
+            list = val;
+          } else {
+            await listByIds(val).then(res => {
+              list = res.data.map(oss => {
+                oss = { name: oss.originalName, url: oss.url, ossId: oss.ossId };
+                return oss;
+              });
+            })
+          }
           // 然后将数组转为对象数组
           this.fileList = list.map(item => {
-            if (typeof item === "string") {
-              item = { name: item, url: item };
-            }
+            item = { name: item.name, url: item.url, ossId: item.ossId };
             item.uid = item.uid || new Date().getTime() + temp++;
             return item;
           });
@@ -142,12 +151,12 @@ export default {
     // 上传失败
     handleUploadError(err) {
       this.$modal.msgError("上传文件失败，请重试");
-      this.$modal.closeLoading()
+      this.$modal.closeLoading();
     },
     // 上传成功回调
     handleUploadSuccess(res, file) {
       if (res.code === 200) {
-        this.uploadList.push({ name: res.fileName, url: res.fileName });
+        this.uploadList.push({ name: res.data.fileName, url: res.data.url, ossId: res.data.ossId });
         this.uploadedSuccessfully();
       } else {
         this.number--;
@@ -159,6 +168,8 @@ export default {
     },
     // 删除文件
     handleDelete(index) {
+      let ossId = this.fileList[index].ossId;
+      delOss(ossId);
       this.fileList.splice(index, 1);
       this.$emit("input", this.listToString(this.fileList));
     },
@@ -174,10 +185,11 @@ export default {
     },
     // 获取文件名称
     getFileName(name) {
+      // 如果是url那么取最后的名字 如果不是直接返回
       if (name.lastIndexOf("/") > -1) {
         return name.slice(name.lastIndexOf("/") + 1);
       } else {
-        return "";
+        return name;
       }
     },
     // 对象转成指定字符串分隔
@@ -185,11 +197,11 @@ export default {
       let strs = "";
       separator = separator || ",";
       for (let i in list) {
-        strs += list[i].url + separator;
+        strs += list[i].ossId + separator;
       }
-      return strs != '' ? strs.substr(0, strs.length - 1) : '';
-    }
-  }
+      return strs != "" ? strs.substr(0, strs.length - 1) : "";
+    },
+  },
 };
 </script>
 

dsk-operate-ui/src/components/ImagePreview/index.vue

@@ -12,7 +12,6 @@
 </template>
 
 <script>
-import { isExternal } from "@/utils/validate";
 
 export default {
   name: "ImagePreview",
@@ -36,10 +35,7 @@ export default {
         return;
       }
       let real_src = this.src.split(",")[0];
-      if (isExternal(real_src)) {
-        return real_src;
-      }
-      return process.env.VUE_APP_BASE_API + real_src;
+      return real_src;
     },
     realSrcList() {
       if (!this.src) {
@@ -48,10 +44,7 @@ export default {
       let real_src_list = this.src.split(",");
       let srcList = [];
       real_src_list.forEach(item => {
-        if (isExternal(item)) {
-          return srcList.push(item);
-        }
-        return srcList.push(process.env.VUE_APP_BASE_API + item);
+        return srcList.push(item);
       });
       return srcList;
     },

dsk-operate-ui/src/components/ImageUpload/index.vue

@@ -19,7 +19,7 @@
     >
       <i class="el-icon-plus"></i>
     </el-upload>
-    
+
     <!-- 上传提示 -->
     <div class="el-upload__tip" slot="tip" v-if="showTip">
       请上传
@@ -44,6 +44,7 @@
 
 <script>
 import { getToken } from "@/utils/auth";
+import { listByIds, delOss } from "@/api/system/oss";
 
 export default {
   props: {
@@ -77,7 +78,7 @@ export default {
       dialogVisible: false,
       hideUpload: false,
       baseUrl: process.env.VUE_APP_BASE_API,
-      uploadImgUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址
+      uploadImgUrl: process.env.VUE_APP_BASE_API + "/system/oss/upload", // 上传的图片服务器地址
       headers: {
         Authorization: "Bearer " + getToken(),
       },
@@ -86,19 +87,21 @@ export default {
   },
   watch: {
     value: {
-      handler(val) {
+      async handler(val) {
         if (val) {
           // 首先将值转为数组
-          const list = Array.isArray(val) ? val : this.value.split(',');
+          let list;
+          if (Array.isArray(val)) {
+            list = val;
+          } else {
+            await listByIds(val).then(res => {
+              list = res.data;
+            })
+          }
           // 然后将数组转为对象数组
           this.fileList = list.map(item => {
-            if (typeof item === "string") {
-              if (item.indexOf(this.baseUrl) === -1) {
-                  item = { name: this.baseUrl + item, url: this.baseUrl + item };
-              } else {
-                  item = { name: item, url: item };
-              }
-            }
+            // 此处name使用ossId 防止删除出现重名
+            item = { name: item.ossId, url: item.url, ossId: item.ossId };
             return item;
           });
         } else {
@@ -125,7 +128,7 @@ export default {
         if (file.name.lastIndexOf(".") > -1) {
           fileExtension = file.name.slice(file.name.lastIndexOf(".") + 1);
         }
-        isImg = this.fileType.some(type => {
+        isImg = this.fileType.some((type) => {
           if (file.type.indexOf(type) > -1) return true;
           if (fileExtension && fileExtension.indexOf(type) > -1) return true;
           return false;
@@ -155,7 +158,7 @@ export default {
     // 上传成功回调
     handleUploadSuccess(res, file) {
       if (res.code === 200) {
-        this.uploadList.push({ name: res.fileName, url: res.fileName });
+        this.uploadList.push({ name: res.data.fileName, url: res.data.url, ossId: res.data.ossId });
         this.uploadedSuccessfully();
       } else {
         this.number--;
@@ -169,12 +172,14 @@ export default {
     handleDelete(file) {
       const findex = this.fileList.map(f => f.name).indexOf(file.name);
       if(findex > -1) {
+        let ossId = this.fileList[findex].ossId;
+        delOss(ossId);
         this.fileList.splice(findex, 1);
         this.$emit("input", this.listToString(this.fileList));
       }
     },
     // 上传失败
-    handleUploadError() {
+    handleUploadError(res) {
       this.$modal.msgError("上传图片失败，请重试");
       this.$modal.closeLoading();
     },
@@ -198,11 +203,11 @@ export default {
       let strs = "";
       separator = separator || ",";
       for (let i in list) {
-        if (list[i].url) {
-          strs += list[i].url.replace(this.baseUrl, "") + separator;
+        if (list[i].ossId) {
+          strs += list[i].ossId + separator;
         }
       }
-      return strs != '' ? strs.substr(0, strs.length - 1) : '';
+      return strs != "" ? strs.substr(0, strs.length - 1) : "";
     }
   }
 };
@@ -219,8 +224,8 @@ export default {
 }
 
 ::v-deep .el-list-enter, .el-list-leave-active {
-    opacity: 0;
-    transform: translateY(0);
+  opacity: 0;
+  transform: translateY(0);
 }
 </style>