| 
					
				 | 
			
			
				@@ -1,35 +1,35 @@ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 <template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    <div class="upload-file"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <el-upload 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            ref="fileUpload" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            multiple 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            :action="uploadFileUrl" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            :before-upload="handleBeforeUpload" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            :file-list="fileList" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            :limit="limit" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            :on-error="handleUploadError" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            :on-exceed="handleExceed" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            :on-success="handleUploadSuccess" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            :show-file-list="false" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            :headers="headers" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            class="upload-file-uploader" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            <!-- 上传按钮 --> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            <el-button type="primary">{{ btnText }}</el-button> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        </el-upload> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <!-- 上传提示 --> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <div v-if="showTip" class="el-upload__tip"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            请上传 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            <template v-if="fileSize"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-                大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            </template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            <template v-if="fileType"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-                格式为 <b style="color: #f56c6c">{{ fileType.join('/') }}</b> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            </template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            的文件 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <!-- 文件列表 --> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <!-- <transition-group 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	<div class="upload-file"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		<el-upload 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			ref="fileUpload" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			multiple 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			:action="uploadFileUrl" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			:before-upload="handleBeforeUpload" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			:file-list="fileList" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			:limit="limit" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			:on-error="handleUploadError" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			:on-exceed="handleExceed" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			:on-success="handleUploadSuccess" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			:show-file-list="false" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			:headers="headers" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			class="upload-file-uploader" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			<!-- 上传按钮 --> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			<el-button type="primary">{{ btnText }}</el-button> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		</el-upload> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		<!-- 上传提示 --> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		<div v-if="showTip" class="el-upload__tip"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			请上传 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			<template v-if="fileSize"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			</template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			<template v-if="fileType"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				格式为 <b style="color: #f56c6c">{{ fileType.join('/') }}</b> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			</template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			的文件 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		<!-- 文件列表 --> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		<!-- <transition-group 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				             class="upload-file-list el-upload-list el-upload-list--text" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				             name="el-fade-in-linear" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				             tag="ul" 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -48,7 +48,7 @@ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				                 </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				             </li> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         </transition-group> --> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 </template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 <script setup lang="ts"> 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -57,41 +57,41 @@ import { ElMessage } from 'element-plus'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 import { getCurrentInstance, ComponentInternalInstance, ref, computed, watch } from 'vue'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 const props = defineProps({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    modelValue: [String, Object, Array] as any, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    // 数量限制 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    limit: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        type: Number, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        default: 5, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    // 大小限制(MB) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    fileSize: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        type: Number, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        default: 5, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    // 文件类型, 例如['png', 'jpg', 'jpeg'] 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    fileType: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        type: Array as () => Array<any>, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        default: () => ['doc', 'xls', 'ppt', 'txt', 'pdf'], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    // 是否显示提示 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    isShowTip: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        type: Boolean, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        default: true, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    action: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        type: String, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        default: 'business/common/upload', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    // 按钮文字 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    btnText: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        type: String, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        default: '点击上传文件', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    // 文件列表是否显示 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    showFileList: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        type: Boolean, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        default: true, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	modelValue: [String, Object, Array] as any, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	// 数量限制 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	limit: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		type: Number, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		default: 5, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	// 大小限制(MB) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	fileSize: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		type: Number, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		default: 5, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	// 文件类型, 例如['png', 'jpg', 'jpeg'] 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	fileType: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		type: Array as () => Array<any>, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		default: () => ['doc', 'xls', 'ppt', 'txt', 'pdf'], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	// 是否显示提示 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	isShowTip: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		type: Boolean, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		default: true, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	action: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		type: String, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		default: 'business/common/upload', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	// 按钮文字 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	btnText: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		type: String, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		default: '点击上传文件', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	// 文件列表是否显示 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	showFileList: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		type: Boolean, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		default: true, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 const { proxy } = getCurrentInstance() as ComponentInternalInstance; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 const emit = defineEmits(['update:modelValue', 'handleSuccess']); 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -104,143 +104,143 @@ const fileList = ref<any[]>([]); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 const showTip = computed(() => props.isShowTip && (props.fileType || props.fileSize)); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 watch( 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    () => props.modelValue, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    val => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        if (val) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            let temp = 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            // 首先将值转为数组 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            const list = Array.isArray(val) ? val : props.modelValue!.split(','); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            // 然后将数组转为对象数组 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            fileList.value = list.map((item: any) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-                if (typeof item === 'string') { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-                    item = { name: item, url: item }; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-                } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-                item.uid = item.uid || new Date().getTime() + temp++; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-                return item; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        } else { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            fileList.value = []; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            return []; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    { deep: true, immediate: true } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	() => props.modelValue, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	val => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		if (val) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			let temp = 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			// 首先将值转为数组 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			const list = Array.isArray(val) ? val : props.modelValue!.split(','); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			// 然后将数组转为对象数组 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			fileList.value = list.map((item: any) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				if (typeof item === 'string') { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+					item = { name: item, url: item }; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				item.uid = item.uid || new Date().getTime() + temp++; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+				return item; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			}); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		} else { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			fileList.value = []; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			return []; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	{ deep: true, immediate: true } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 ); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 // 上传前校检格式和大小 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 function handleBeforeUpload(file: any) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    // 校检文件类型 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    if (props.fileType.length) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        const fileName = file.name.split('.'); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        const fileExt = fileName[fileName.length - 1]; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        const isTypeOk = props.fileType.indexOf(fileExt) >= 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        if (!isTypeOk) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            proxy!.$modal.msgError(`文件格式不正确, 请上传${props.fileType.join('/')}格式文件!`); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            return false; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    // 校检文件大小 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    if (props.fileSize) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        const isLt = file.size / 1024 / 1024 < props.fileSize; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        if (!isLt) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            proxy!.$modal.msgError(`上传文件大小不能超过 ${props.fileSize} MB!`); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            return false; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    proxy!.$modal.loading('正在上传文件,请稍候...'); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    number.value++; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    return true; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	// 校检文件类型 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	if (props.fileType.length) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		const fileName = file.name.split('.'); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		const fileExt = fileName[fileName.length - 1]; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		const isTypeOk = props.fileType.indexOf(fileExt) >= 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		if (!isTypeOk) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			proxy!.$modal.msgError(`文件格式不正确, 请上传${props.fileType.join('/')}格式文件!`); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			return false; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	// 校检文件大小 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	if (props.fileSize) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		const isLt = file.size / 1024 / 1024 < props.fileSize; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		if (!isLt) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			proxy!.$modal.msgError(`上传文件大小不能超过 ${props.fileSize} MB!`); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			return false; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	proxy!.$modal.loading('正在上传文件,请稍候...'); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	number.value++; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	return true; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 // 文件个数超出 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 function handleExceed() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    proxy!.$modal.msgError(`上传文件数量不能超过 ${props.limit} 个!`); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	proxy!.$modal.msgError(`上传文件数量不能超过 ${props.limit} 个!`); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 // 上传失败 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 function handleUploadError(err: any) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    proxy!.$modal.msgError('上传文件失败'); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    proxy!.$modal.closeLoading(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	proxy!.$modal.msgError('上传文件失败'); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	proxy!.$modal.closeLoading(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 // 上传成功回调 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 function handleUploadSuccess(res: any, file: any) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    if (res.code === 200) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        uploadList.value.push({ name: res.fileName, url: res.fileName }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        uploadedSuccessfully(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        emit('handleSuccess', res); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        ElMessage.success(res.msg || '上传成功'); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    } else { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        number.value--; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        proxy!.$modal.closeLoading(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        proxy!.$modal.msgError(res.msg); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        (proxy!.$refs.fileUpload as any).handleRemove(file); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        uploadedSuccessfully(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	if (res.code === 200) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		uploadList.value.push({ name: res.fileName, url: res.fileName }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		uploadedSuccessfully(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		emit('handleSuccess', res); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		ElMessage.success(res.msg || '上传成功'); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} else { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		number.value--; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		proxy!.$modal.closeLoading(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		proxy!.$modal.msgError(res.msg); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		(proxy!.$refs.fileUpload as any).handleRemove(file); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		uploadedSuccessfully(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 // 清空列表 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 function clearList() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    (proxy!.$refs.fileUpload as any).clearFiles(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	(proxy!.$refs.fileUpload as any).clearFiles(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 // 删除文件 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 function handleDelete(index: any) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    fileList.value.splice(index, 1); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    emit('update:modelValue', listToString(fileList.value)); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	fileList.value.splice(index, 1); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	emit('update:modelValue', listToString(fileList.value)); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 // 上传结束处理 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 function uploadedSuccessfully() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    if (number.value > 0 && uploadList.value.length === number.value) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        fileList.value = fileList.value.filter(f => f.url !== undefined).concat(uploadList.value); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        uploadList.value = []; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        number.value = 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        emit('update:modelValue', listToString(fileList.value)); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        proxy!.$modal.closeLoading(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	if (number.value > 0 && uploadList.value.length === number.value) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		fileList.value = fileList.value.filter(f => f.url !== undefined).concat(uploadList.value); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		uploadList.value = []; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		number.value = 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		emit('update:modelValue', listToString(fileList.value)); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		proxy!.$modal.closeLoading(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 // 获取文件名称 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 function getFileName(name: any) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    if (name.lastIndexOf('/') > -1) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        return name.slice(name.lastIndexOf('/') + 1); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    } else { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        return ''; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	if (name.lastIndexOf('/') > -1) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		return name.slice(name.lastIndexOf('/') + 1); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} else { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		return ''; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 // 对象转成指定字符串分隔 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 function listToString(list: any, separator?: any) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    let strs = ''; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    separator = separator || ','; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    for (let i in list) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        if (list[i].url) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            strs += list[i].url + separator; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    return strs !== '' ? strs.substr(0, strs.length - 1) : ''; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	let strs = ''; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	separator = separator || ','; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	for (let i in list) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		if (list[i].url) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+			strs += list[i].url + separator; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+		} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	return strs !== '' ? strs.substr(0, strs.length - 1) : ''; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 defineExpose({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    handleClea: clearList, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	handleClea: clearList, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 </script> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 <style scoped lang="scss"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 .upload-file-uploader { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    margin-bottom: 5px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	margin-bottom: 5px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 .upload-file-list .el-upload-list__item { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    border: 1px solid #e4e7ed; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    line-height: 2; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    margin-bottom: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    position: relative; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	border: 1px solid #e4e7ed; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	line-height: 2; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	margin-bottom: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	position: relative; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 .upload-file-list .ele-upload-list__item-content { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    justify-content: space-between; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    align-items: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    color: inherit; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	justify-content: space-between; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	align-items: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	color: inherit; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 .ele-upload-list__item-content-action .el-link { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    margin-right: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+	margin-right: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 </style> 
			 |