From 8c3eaeddeff2c9c5a92352e6bf830e5000ff5882 Mon Sep 17 00:00:00 2001 From: xiangpei <xiangpei@timesnew.cn> Date: 星期二, 03 十二月 2024 12:16:11 +0800 Subject: [PATCH] 附件最多上传10个 --- src/components/UploadC.vue | 55 ++++++++++++++++++++++++++++++++++++++----------------- 1 files changed, 38 insertions(+), 17 deletions(-) diff --git a/src/components/UploadC.vue b/src/components/UploadC.vue index 686499b..f53fdac 100644 --- a/src/components/UploadC.vue +++ b/src/components/UploadC.vue @@ -4,10 +4,10 @@ :file-list="fileUrl" :on-remove="handleRemove" :before-remove="beforeRemove" :on-success="handleUploadSuccess" :before-upload="beforeUpload"> <el-button size="small" type="primary">鐐瑰嚮涓婁紶</el-button> - <div slot="tip" class="el-upload__tip">鍙兘涓婁紶pdf銆乵p4銆乵p3銆乸ng銆乯pg銆乯pge鏂囦欢锛屼笖涓嶈秴杩噞{ fileSizeLimitM }}M</div> + <div slot="tip" class="el-upload__tip">鍙兘涓婁紶pdf銆乵p4銆乤vi銆乸ng銆乯pg銆乯pge銆乫lv鏂囦欢锛屼笖涓嶈秴杩噞{ fileSizeLimitM }}G</div> <div v-if="fileUrl && fileUrl.length > 0 && uploadNum === 1"> - <video controls class="returnShow" v-if="fileType === 'video'" :src="'/api/files/' + fileUrl[0].url"></video> - <img class="returnShow" v-if="fileType === 'img'" :src="'/api/files/' + fileUrl[0].url" /> + <video controls class="returnShow" v-if="fileType === 'video' && fileUrl[0]" :src="'/api/files/' + fileUrl[0].url"></video> + <img class="returnShow" v-if="fileType === 'img' && fileUrl[0]" :src="'/api/files/' + fileUrl[0].url" /> </div> </el-upload> </div> @@ -40,11 +40,12 @@ }, data() { return { - uploadUrl: "http://localhost:8085/api/upload/upload", - fileTypeList:{ - 'video': ['.mp4', '.avi'], - 'img': ['.jgp', '.png', '.jpeg'], - 'pdf': ['.pdf'], + uploadUrl: "/api/upload/upload", + fileTypeList: { + 'video': ['mp4', 'avi', 'flv'], + 'img': ['jpg', 'png', 'jpeg'], + 'pdf': ['pdf'], + 'file': ['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'txt', 'png', 'jpg', 'jpeg', 'pdf'], } }; }, @@ -53,29 +54,49 @@ this.fileUrl = []; }, beforeRemove(file, fileList) { - return this.$confirm(`纭畾绉婚櫎 ${file.name}锛焋); + if (file && file.status === "success") { + return this.$confirm(`纭畾绉婚櫎 ${file.name}锛焋); + } }, handleRemove(file, fileList) { this.$emit('removeFile', this.fileUrl, file.name); }, handleUploadSuccess(res, file) { - this.fileUrl.push(res.response); - this.$emit('getUploadUrl', this.fileUrl); + if (res.response) { + this.fileUrl.push(res.response); + console.log("褰撳墠鏂囦欢淇℃伅", res.response) + this.$emit('getUploadUrl', this.fileUrl); + } }, beforeUpload(file) { - - const limit = file.size / 1024 / 1024 < this.fileSizeLimitM; - if (!limit) { - this.$message.error(`涓婁紶鏂囦欢澶у皬涓嶈兘瓒呰繃 ${this.fileSizeLimitM}MB!`); + const { type } = file; + const typeList = this.fileTypeList[this.fileType]; + let limitType = true; + if (typeList) { + const tempType = typeList.find(item => { + if (type.includes(item) || file.name.endsWith(".flv")) { + return true; + } else { + return false; + } + }); + if (!tempType) { + this.$message.error(`璇蜂笂浼犳纭殑鏂囦欢鏍煎紡锛乣); + limitType = false; + } } - return limit; + const limit = file.size / 1024 / 1024 / 1024 < this.fileSizeLimitM; + if (!limit) { + this.$message.error(`涓婁紶鏂囦欢澶у皬涓嶈兘瓒呰繃 ${this.fileSizeLimitM}G!`); + } + return limitType && limit; }, }, computed: { acceptList() { let temp = '.*'; if (this.fileTypeList[this.fileType]) { - temp = this.fileTypeList[this.fileType].join(','); + temp = this.fileTypeList[this.fileType].map(item => '.' + item).join(','); } return temp; } -- Gitblit v1.8.0