From fa2bdcd5ac5f1c3baa70183699fd29fdb5953d7b Mon Sep 17 00:00:00 2001
From: 疯狂的狮子li <15040126243@163.com>
Date: 星期五, 26 十一月 2021 18:11:41 +0800
Subject: [PATCH] update 抽象 Excel 导入支持自定义监听器

---
 ruoyi-ui/src/components/FileUpload/index.vue |   86 +++++++++++++++++++++++++++---------------
 1 files changed, 55 insertions(+), 31 deletions(-)

diff --git a/ruoyi-ui/src/components/FileUpload/index.vue b/ruoyi-ui/src/components/FileUpload/index.vue
index 81e2b3a..a5971f2 100644
--- a/ruoyi-ui/src/components/FileUpload/index.vue
+++ b/ruoyi-ui/src/components/FileUpload/index.vue
@@ -4,7 +4,7 @@
       :action="uploadFileUrl"
       :before-upload="handleBeforeUpload"
       :file-list="fileList"
-      :limit="1"
+      :limit="limit"
       :on-error="handleUploadError"
       :on-exceed="handleExceed"
       :on-success="handleUploadSuccess"
@@ -26,8 +26,8 @@
 
     <!-- 鏂囦欢鍒楄〃 -->
     <transition-group class="upload-file-list el-upload-list el-upload-list--text" name="el-fade-in-linear" tag="ul">
-      <li :key="file.uid" class="el-upload-list__item ele-upload-list__item-content" v-for="(file, index) in list">
-        <el-link :href="file.url" :underline="false" target="_blank">
+      <li :key="file.uid" class="el-upload-list__item ele-upload-list__item-content" v-for="(file, index) in fileList">
+        <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">
@@ -42,9 +42,15 @@
 import { getToken } from "@/utils/auth";
 
 export default {
+  name: "FileUpload",
   props: {
     // 鍊�
     value: [String, Object, Array],
+    // 鏁伴噺闄愬埗
+    limit: {
+      type: Number,
+      default: 5,
+    },
     // 澶у皬闄愬埗(MB)
     fileSize: {
       type: Number,
@@ -63,36 +69,42 @@
   },
   data() {
     return {
-      uploadFileUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 涓婁紶鐨勫浘鐗囨湇鍔″櫒鍦板潃
+      baseUrl: process.env.VUE_APP_BASE_API,
+      uploadFileUrl: process.env.VUE_APP_BASE_API + "/system/oss/upload", // 涓婁紶鐨勫浘鐗囨湇鍔″櫒鍦板潃
       headers: {
         Authorization: "Bearer " + getToken(),
       },
       fileList: [],
     };
   },
+  watch: {
+    value: {
+      handler(val) {
+        if (val) {
+          let temp = 1;
+          // 棣栧厛灏嗗�艰浆涓烘暟缁�
+          const list = Array.isArray(val) ? val : this.value.split(',');
+          // 鐒跺悗灏嗘暟缁勮浆涓哄璞℃暟缁�
+          this.fileList = list.map(item => {
+            if (typeof item === "string") {
+              item = { name: item, url: item };
+            }
+            item.uid = item.uid || new Date().getTime() + temp++;
+            return item;
+          });
+        } else {
+          this.fileList = [];
+          return [];
+        }
+      },
+      deep: true,
+      immediate: true
+    }
+  },
   computed: {
     // 鏄惁鏄剧ず鎻愮ず
     showTip() {
       return this.isShowTip && (this.fileType || this.fileSize);
-    },
-    // 鍒楄〃
-    list() {
-      let temp = 1;
-      if (this.value) {
-        // 棣栧厛灏嗗�艰浆涓烘暟缁�
-        const list = Array.isArray(this.value) ? this.value : [this.value];
-        // 鐒跺悗灏嗘暟缁勮浆涓哄璞℃暟缁�
-        return list.map((item) => {
-          if (typeof item === "string") {
-            item = { name: item, url: item };
-          }
-          item.uid = item.uid || new Date().getTime() + temp++;
-          return item;
-        });
-      } else {
-        this.fileList = [];
-        return [];
-      }
     },
   },
   methods: {
@@ -126,7 +138,7 @@
     },
     // 鏂囦欢涓暟瓒呭嚭
     handleExceed() {
-      this.$message.error(`鍙厑璁镐笂浼犲崟涓枃浠禶);
+      this.$message.error(`涓婁紶鏂囦欢鏁伴噺涓嶈兘瓒呰繃 ${this.limit} 涓�!`);
     },
     // 涓婁紶澶辫触
     handleUploadError(err) {
@@ -134,13 +146,19 @@
     },
     // 涓婁紶鎴愬姛鍥炶皟
     handleUploadSuccess(res, file) {
-      this.$message.success("涓婁紶鎴愬姛");
-      this.$emit("input", res.data.url);
+      if (res.code === 200) {
+        this.$message.success("涓婁紶鎴愬姛");
+        this.fileList.push({ name: res.data.fileName, url: res.data.url });
+        this.$emit("input", this.listToString(this.fileList));
+      } else {
+        this.$message.error(res.msg);
+        this.loading.close();
+      }
     },
     // 鍒犻櫎鏂囦欢
     handleDelete(index) {
       this.fileList.splice(index, 1);
-      this.$emit("input", '');
+      this.$emit("input", this.listToString(this.fileList));
     },
     // 鑾峰彇鏂囦欢鍚嶇О
     getFileName(name) {
@@ -149,10 +167,16 @@
       } else {
         return "";
       }
-    }
-  },
-  created() {
-    this.fileList = this.list;
+    },
+    // 瀵硅薄杞垚鎸囧畾瀛楃涓插垎闅�
+    listToString(list, separator) {
+      let strs = "";
+      separator = separator || ",";
+      for (let i in list) {
+        strs += list[i].url + separator;
+      }
+      return strs != "" ? strs.substr(0, strs.length - 1) : "";
+    },
   },
 };
 </script>

--
Gitblit v1.9.3