update dialog: 上传组件的格式和大小验证
This commit is contained in:
		@@ -8,8 +8,10 @@
 | 
			
		||||
			:file-list="fileList"
 | 
			
		||||
			:on-preview="handleDownload"
 | 
			
		||||
			:on-remove="handleRemove"
 | 
			
		||||
			:before-upload="/.*?image.*?/i.test(extraParams.typeCode) ? validateImage : validateFile"
 | 
			
		||||
			:before-remove="beforeRemove"
 | 
			
		||||
		>
 | 
			
		||||
			<!-- accept="image/*" -->
 | 
			
		||||
			<!-- <el-upload class="yd-upload" :action="$http.adornUrl(url)" multiple name="files" :data="extraParams" :file-list="fileList" :on-remove="handleRemove" :before-remove="beforeRemove"> -->
 | 
			
		||||
			<el-button size="small" type="primary">{{ buttonContent }}</el-button>
 | 
			
		||||
			<div v-if="tip" slot="tip" class="el-upload__tip">{{ tip }}</div>
 | 
			
		||||
@@ -93,17 +95,36 @@ export default {
 | 
			
		||||
			})
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		/** 大小验证 */
 | 
			
		||||
		/** 大小验证,由配置文件开启 */
 | 
			
		||||
		validateFile(file) {
 | 
			
		||||
			this.extraUploadParams.typeCode = 'equipmentInfoFile'
 | 
			
		||||
			console.log("[*] 验证文件大小")
 | 
			
		||||
 | 
			
		||||
			const isRightSize = file.size / 1024 / 1024 < 10
 | 
			
		||||
			const isRightSize = file.size / 1024 / 1024 < 2
 | 
			
		||||
			if (!isRightSize) {
 | 
			
		||||
				this.$message.error(this.$t('upload.picSizeAlarm'))
 | 
			
		||||
				// this.$message.error(this.$t('upload.picSizeAlarm'))
 | 
			
		||||
				this.$message.error('文件不应超过 2MB')
 | 
			
		||||
			}
 | 
			
		||||
			return isRightSize
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		/** 图片验证,由配置文件开启 */
 | 
			
		||||
		validateImage(file) {
 | 
			
		||||
			console.log("[*] 验证图片")
 | 
			
		||||
 | 
			
		||||
			const isRightSize = file.size / 1024 / 1024 < 2
 | 
			
		||||
			if (!isRightSize) {
 | 
			
		||||
				this.$message.error('文件不应超过 2MB')
 | 
			
		||||
				// this.$message.error(this.$t('upload.picSizeAlarm'))
 | 
			
		||||
			}
 | 
			
		||||
 | 
			
		||||
			const isAccept = new RegExp('image/*').test(file.type)
 | 
			
		||||
			if (!isAccept) {
 | 
			
		||||
				// this.$message.error(this.$t('upload.picAlarm'))
 | 
			
		||||
				this.$message.error('只允许上传图片')
 | 
			
		||||
			}
 | 
			
		||||
			return isRightSize && isAccept
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		/** 点击下载 */
 | 
			
		||||
		handleDownload({ id: fileId, name: fileName }) {
 | 
			
		||||
			const type = {
 | 
			
		||||
@@ -142,9 +163,9 @@ export default {
 | 
			
		||||
			})
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		beforeRemove(file, filelist) {
 | 
			
		||||
			return this.$confirm(`确定移除 ${file.name}?`)
 | 
			
		||||
		},
 | 
			
		||||
		// beforeRemove(file, filelist) {
 | 
			
		||||
		// 	return this.$confirm(`确定移除 ${file.name}?`)
 | 
			
		||||
		// },
 | 
			
		||||
 | 
			
		||||
		handleRemove(file, filelist) {
 | 
			
		||||
			// 把更新后的 fileList 传递出去
 | 
			
		||||
 
 | 
			
		||||
@@ -114,10 +114,6 @@ const addOrUpdateConfigs = {
 | 
			
		||||
				extraParams: { typeCode: 'EquipmentInfoFile' },
 | 
			
		||||
				buttonContent: '点击上传',
 | 
			
		||||
				tip: '上传文件大小不要超过 2mb (2048kb)'
 | 
			
		||||
			},
 | 
			
		||||
			validators: {
 | 
			
		||||
				size: () => {}, // 上传大小设置
 | 
			
		||||
				image: () => {} // 上传图片认证
 | 
			
		||||
			}
 | 
			
		||||
		},
 | 
			
		||||
		{
 | 
			
		||||
@@ -130,11 +126,7 @@ const addOrUpdateConfigs = {
 | 
			
		||||
				url: '/monitoring/attachment/uploadFileFormData',
 | 
			
		||||
				extraParams: { typeCode: 'EquipmentInfoImage' },
 | 
			
		||||
				buttonContent: '点击上传',
 | 
			
		||||
				tip: '上传文件大小不要超过 2mb (2048kb)'
 | 
			
		||||
			},
 | 
			
		||||
			validators: {
 | 
			
		||||
				size: () => {}, // 上传大小设置
 | 
			
		||||
				image: () => {} // 上传图片认证
 | 
			
		||||
				tip: '上传图片文件,且大小不要超过 2mb (2048kb)'
 | 
			
		||||
			}
 | 
			
		||||
		}
 | 
			
		||||
	],
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user