From 927b05713a25340f3ba3a58bdd42ca2129060c4a Mon Sep 17 00:00:00 2001 From: RuoYi <yzz_ivy@163.com> Date: 星期五, 25 二月 2022 11:51:29 +0800 Subject: [PATCH] 组件fileUpload支持多文件同时选择上传 --- ruoyi-common/src/main/java/com/ruoyi/common/utils/StringUtils.java | 49 ++++++++++++ ruoyi-common/src/main/java/com/ruoyi/common/utils/uuid/Seq.java | 86 +++++++++++++++++++++ ruoyi-ui/src/components/FileUpload/index.vue | 29 +++++-- ruoyi-ui/src/components/ImageUpload/index.vue | 23 +---- ruoyi-ui/src/views/system/user/index.vue | 2 ruoyi-common/src/main/java/com/ruoyi/common/utils/file/FileUploadUtils.java | 5 6 files changed, 166 insertions(+), 28 deletions(-) diff --git a/ruoyi-common/src/main/java/com/ruoyi/common/utils/StringUtils.java b/ruoyi-common/src/main/java/com/ruoyi/common/utils/StringUtils.java index 8df5617..6765117 100644 --- a/ruoyi-common/src/main/java/com/ruoyi/common/utils/StringUtils.java +++ b/ruoyi-common/src/main/java/com/ruoyi/common/utils/StringUtils.java @@ -531,4 +531,53 @@ { return (T) obj; } + + /** + * 鏁板瓧宸﹁竟琛ラ綈0锛屼娇涔嬭揪鍒版寚瀹氶暱搴︺�傛敞鎰忥紝濡傛灉鏁板瓧杞崲涓哄瓧绗︿覆鍚庯紝闀垮害澶т簬size锛屽垯鍙繚鐣� 鏈�鍚巗ize涓瓧绗︺�� + * + * @param num 鏁板瓧瀵硅薄 + * @param size 瀛楃涓叉寚瀹氶暱搴� + * @return 杩斿洖鏁板瓧鐨勫瓧绗︿覆鏍煎紡锛岃瀛楃涓蹭负鎸囧畾闀垮害銆� + */ + public static final String padl(final Number num, final int size) + { + return padl(num.toString(), size, '0'); + } + + /** + * 瀛楃涓插乏琛ラ綈銆傚鏋滃師濮嬪瓧绗︿覆s闀垮害澶т簬size锛屽垯鍙繚鐣欐渶鍚巗ize涓瓧绗︺�� + * + * @param s 鍘熷瀛楃涓� + * @param size 瀛楃涓叉寚瀹氶暱搴� + * @param c 鐢ㄤ簬琛ラ綈鐨勫瓧绗� + * @return 杩斿洖鎸囧畾闀垮害鐨勫瓧绗︿覆锛岀敱鍘熷瓧绗︿覆宸﹁ˉ榻愭垨鎴彇寰楀埌銆� + */ + public static final String padl(final String s, final int size, final char c) + { + final StringBuilder sb = new StringBuilder(size); + if (s != null) + { + final int len = s.length(); + if (s.length() <= size) + { + for (int i = size - len; i > 0; i--) + { + sb.append(c); + } + sb.append(s); + } + else + { + return s.substring(len - size, len); + } + } + else + { + for (int i = size; i > 0; i--) + { + sb.append(c); + } + } + return sb.toString(); + } } \ No newline at end of file diff --git a/ruoyi-common/src/main/java/com/ruoyi/common/utils/file/FileUploadUtils.java b/ruoyi-common/src/main/java/com/ruoyi/common/utils/file/FileUploadUtils.java index 1a89dd9..cc3fd26 100644 --- a/ruoyi-common/src/main/java/com/ruoyi/common/utils/file/FileUploadUtils.java +++ b/ruoyi-common/src/main/java/com/ruoyi/common/utils/file/FileUploadUtils.java @@ -12,7 +12,7 @@ import com.ruoyi.common.exception.file.InvalidExtensionException; import com.ruoyi.common.utils.DateUtils; import com.ruoyi.common.utils.StringUtils; -import com.ruoyi.common.utils.uuid.IdUtils; +import com.ruoyi.common.utils.uuid.Seq; /** * 鏂囦欢涓婁紶宸ュ叿绫� @@ -121,7 +121,8 @@ */ public static final String extractFilename(MultipartFile file) { - return DateUtils.datePath() + "/" + IdUtils.fastUUID() + "." + getExtension(file); + return StringUtils.format("{}/{}_{}.{}", DateUtils.datePath(), + FilenameUtils.getBaseName(file.getOriginalFilename()), Seq.getId(Seq.uploadSeqType), getExtension(file)); } public static final File getAbsoluteFile(String uploadDir, String fileName) throws IOException diff --git a/ruoyi-common/src/main/java/com/ruoyi/common/utils/uuid/Seq.java b/ruoyi-common/src/main/java/com/ruoyi/common/utils/uuid/Seq.java new file mode 100644 index 0000000..fd88245 --- /dev/null +++ b/ruoyi-common/src/main/java/com/ruoyi/common/utils/uuid/Seq.java @@ -0,0 +1,86 @@ +package com.ruoyi.common.utils.uuid; + +import java.util.concurrent.atomic.AtomicInteger; +import com.ruoyi.common.utils.DateUtils; +import com.ruoyi.common.utils.StringUtils; + +/** + * @author ruoyi 搴忓垪鐢熸垚绫� + */ +public class Seq +{ + // 閫氱敤搴忓垪绫诲瀷 + public static final String commSeqType = "COMMON"; + + // 涓婁紶搴忓垪绫诲瀷 + public static final String uploadSeqType = "UPLOAD"; + + // 閫氱敤鎺ュ彛搴忓垪鏁� + private static AtomicInteger commSeq = new AtomicInteger(1); + + // 涓婁紶鎺ュ彛搴忓垪鏁� + private static AtomicInteger uploadSeq = new AtomicInteger(1); + + // 鏈哄櫒鏍囪瘑 + private static String machineCode = "A"; + + /** + * 鑾峰彇閫氱敤搴忓垪鍙� + * + * @return 搴忓垪鍊� + */ + public static String getId() + { + return getId(commSeqType); + } + + /** + * 榛樿16浣嶅簭鍒楀彿 yyMMddHHmmss + 涓�浣嶆満鍣ㄦ爣璇� + 3闀垮害寰幆閫掑瀛楃涓� + * + * @return 搴忓垪鍊� + */ + public static String getId(String type) + { + AtomicInteger atomicInt = commSeq; + if (uploadSeqType.equals(type)) + { + atomicInt = uploadSeq; + } + return getId(atomicInt, 3); + } + + /** + * 閫氱敤鎺ュ彛搴忓垪鍙� yyMMddHHmmss + 涓�浣嶆満鍣ㄦ爣璇� + length闀垮害寰幆閫掑瀛楃涓� + * + * @param atomicInt 搴忓垪鏁� + * @param length 鏁板�奸暱搴� + * @return 搴忓垪鍊� + */ + public static String getId(AtomicInteger atomicInt, int length) + { + String result = DateUtils.dateTimeNow(); + result += machineCode; + result += getSeq(atomicInt, length); + return result; + } + + /** + * 搴忓垪寰幆閫掑瀛楃涓瞇1, 10 鐨� (length)骞傛鏂�), 鐢�0宸﹁ˉ榻恖ength浣嶆暟 + * + * @return 搴忓垪鍊� + */ + private synchronized static String getSeq(AtomicInteger atomicInt, int length) + { + // 鍏堝彇鍊煎啀+1 + int value = atomicInt.getAndIncrement(); + + // 濡傛灉鏇存柊鍚庡��>=10 鐨� (length)骞傛鏂瑰垯閲嶇疆涓�1 + int maxSeq = (int) Math.pow(10, length); + if (atomicInt.get() >= maxSeq) + { + atomicInt.set(1); + } + // 杞瓧绗︿覆锛岀敤0宸﹁ˉ榻� + return StringUtils.padl(value, length); + } +} diff --git a/ruoyi-ui/src/components/FileUpload/index.vue b/ruoyi-ui/src/components/FileUpload/index.vue index ea15a57..aa2296b 100644 --- a/ruoyi-ui/src/components/FileUpload/index.vue +++ b/ruoyi-ui/src/components/FileUpload/index.vue @@ -1,6 +1,7 @@ <template> <div class="upload-file"> <el-upload + multiple :action="uploadFileUrl" :before-upload="handleBeforeUpload" :file-list="fileList" @@ -69,6 +70,8 @@ }, data() { return { + number: 0, + uploadList: [], baseUrl: process.env.VUE_APP_BASE_API, uploadFileUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 涓婁紶鐨勫浘鐗囨湇鍔″櫒鍦板潃 headers: { @@ -122,7 +125,7 @@ return false; }); if (!isTypeOk) { - this.$message.error(`鏂囦欢鏍煎紡涓嶆纭�, 璇蜂笂浼�${this.fileType.join("/")}鏍煎紡鏂囦欢!`); + this.$modal.msgError(`鏂囦欢鏍煎紡涓嶆纭�, 璇蜂笂浼�${this.fileType.join("/")}鏍煎紡鏂囦欢!`); return false; } } @@ -130,25 +133,33 @@ if (this.fileSize) { const isLt = file.size / 1024 / 1024 < this.fileSize; if (!isLt) { - this.$message.error(`涓婁紶鏂囦欢澶у皬涓嶈兘瓒呰繃 ${this.fileSize} MB!`); + this.$modal.msgError(`涓婁紶鏂囦欢澶у皬涓嶈兘瓒呰繃 ${this.fileSize} MB!`); return false; } } + this.$modal.loading("姝e湪涓婁紶鏂囦欢锛岃绋嶅��..."); + this.number++; return true; }, // 鏂囦欢涓暟瓒呭嚭 handleExceed() { - this.$message.error(`涓婁紶鏂囦欢鏁伴噺涓嶈兘瓒呰繃 ${this.limit} 涓�!`); + this.$modal.msgError(`涓婁紶鏂囦欢鏁伴噺涓嶈兘瓒呰繃 ${this.limit} 涓�!`); }, // 涓婁紶澶辫触 handleUploadError(err) { - this.$message.error("涓婁紶澶辫触, 璇烽噸璇�"); + this.$modal.msgError("涓婁紶鍥剧墖澶辫触锛岃閲嶈瘯"); + this.$modal.closeLoading() }, // 涓婁紶鎴愬姛鍥炶皟 - handleUploadSuccess(res, file) { - this.$message.success("涓婁紶鎴愬姛"); - this.fileList.push({ name: res.fileName, url: res.fileName }); - this.$emit("input", this.listToString(this.fileList)); + handleUploadSuccess(res) { + this.uploadList.push({ name: res.fileName, url: res.fileName }); + if (this.uploadList.length === this.number) { + this.fileList = this.fileList.concat(this.uploadList); + this.uploadList = []; + this.number = 0; + this.$emit("input", this.listToString(this.fileList)); + this.$modal.closeLoading(); + } }, // 鍒犻櫎鏂囦欢 handleDelete(index) { @@ -158,7 +169,7 @@ // 鑾峰彇鏂囦欢鍚嶇О getFileName(name) { if (name.lastIndexOf("/") > -1) { - return name.slice(name.lastIndexOf("/") + 1).toLowerCase(); + return name.slice(name.lastIndexOf("/") + 1); } else { return ""; } diff --git a/ruoyi-ui/src/components/ImageUpload/index.vue b/ruoyi-ui/src/components/ImageUpload/index.vue index bf04c5b..71172c1 100644 --- a/ruoyi-ui/src/components/ImageUpload/index.vue +++ b/ruoyi-ui/src/components/ImageUpload/index.vue @@ -133,7 +133,7 @@ this.uploadList = []; this.number = 0; this.$emit("input", this.listToString(this.fileList)); - this.loading.close(); + this.$modal.closeLoading(); } }, // 涓婁紶鍓峫oading鍔犺浇 @@ -154,36 +154,27 @@ } if (!isImg) { - this.$message.error( - `鏂囦欢鏍煎紡涓嶆纭�, 璇蜂笂浼�${this.fileType.join("/")}鍥剧墖鏍煎紡鏂囦欢!` - ); + this.$modal.msgError(`鏂囦欢鏍煎紡涓嶆纭�, 璇蜂笂浼�${this.fileType.join("/")}鍥剧墖鏍煎紡鏂囦欢!`); return false; } if (this.fileSize) { const isLt = file.size / 1024 / 1024 < this.fileSize; if (!isLt) { - this.$message.error(`涓婁紶澶村儚鍥剧墖澶у皬涓嶈兘瓒呰繃 ${this.fileSize} MB!`); + this.$modal.msgError(`涓婁紶澶村儚鍥剧墖澶у皬涓嶈兘瓒呰繃 ${this.fileSize} MB!`); return false; } } - this.loading = this.$loading({ - lock: true, - text: "涓婁紶涓�", - background: "rgba(0, 0, 0, 0.7)", - }); + this.$modal.loading("姝e湪涓婁紶鍥剧墖锛岃绋嶅��..."); this.number++; }, // 鏂囦欢涓暟瓒呭嚭 handleExceed() { - this.$message.error(`涓婁紶鏂囦欢鏁伴噺涓嶈兘瓒呰繃 ${this.limit} 涓�!`); + this.$modal.msgError(`涓婁紶鏂囦欢鏁伴噺涓嶈兘瓒呰繃 ${this.limit} 涓�!`); }, // 涓婁紶澶辫触 handleUploadError() { - this.$message({ - type: "error", - message: "涓婁紶澶辫触", - }); - this.loading.close(); + this.$modal.msgError("涓婁紶鍥剧墖澶辫触锛岃閲嶈瘯"); + this.$modal.closeLoading(); }, // 棰勮 handlePictureCardPreview(file) { diff --git a/ruoyi-ui/src/views/system/user/index.vue b/ruoyi-ui/src/views/system/user/index.vue index ea1fd45..58de56f 100644 --- a/ruoyi-ui/src/views/system/user/index.vue +++ b/ruoyi-ui/src/views/system/user/index.vue @@ -443,7 +443,7 @@ email: [ { type: "email", - message: "'璇疯緭鍏ユ纭殑閭鍦板潃", + message: "璇疯緭鍏ユ纭殑閭鍦板潃", trigger: ["blur", "change"] } ], -- Gitblit v1.9.3