@kengic/uni 0.5.1 → 0.5.2-beta.1

package/dist/uni/uni-ui/uni-file-picker/uni-file-picker.vue

@@ -1,667 +1,669 @@
 <template>
-	<view class="uni-file-picker">
-		<view v-if="title" class="uni-file-picker__header">
-			<text class="file-title">{{ title }}</text>
-			<text class="file-count">{{ filesList.length }}/{{ limitLength }}</text>
-		</view>
-		<upload-image v-if="fileMediatype === 'image' && showType === 'grid'" :readonly="readonly"
-			:image-styles="imageStyles" :files-list="filesList" :limit="limitLength" :disablePreview="disablePreview"
-			:delIcon="delIcon" @uploadFiles="uploadFiles" @choose="choose" @delFile="delFile">
-			<slot>
-				<view class="is-add">
-					<view class="icon-add"></view>
-					<view class="icon-add rotate"></view>
-				</view>
-			</slot>
-		</upload-image>
-		<upload-file v-if="fileMediatype !== 'image' || showType !== 'grid'" :readonly="readonly"
-			:list-styles="listStyles" :files-list="filesList" :showType="showType" :delIcon="delIcon"
-			@uploadFiles="uploadFiles" @choose="choose" @delFile="delFile">
-			<slot><button type="primary" size="mini">选择文件</button></slot>
-		</upload-file>
-	</view>
+    <view class="uni-file-picker">
+        <view v-if="title" class="uni-file-picker__header">
+            <text class="file-title">{{ title }}</text>
+            <text class="file-count">{{ filesList.length }}/{{ limitLength }}</text>
+        </view>
+        <upload-image
+            v-if="fileMediatype === 'image' && showType === 'grid'"
+            :readonly="readonly"
+            :image-styles="imageStyles"
+            :files-list="filesList"
+            :limit="limitLength"
+            :disablePreview="disablePreview"
+            :delIcon="delIcon"
+            @uploadFiles="uploadFiles"
+            @choose="choose"
+            @delFile="delFile"
+        >
+            <slot>
+                <view class="is-add">
+                    <view class="icon-add"></view>
+                    <view class="icon-add rotate"></view>
+                </view>
+            </slot>
+        </upload-image>
+        <upload-file
+            v-if="fileMediatype !== 'image' || showType !== 'grid'"
+            :readonly="readonly"
+            :list-styles="listStyles"
+            :files-list="filesList"
+            :showType="showType"
+            :delIcon="delIcon"
+            @uploadFiles="uploadFiles"
+            @choose="choose"
+            @delFile="delFile"
+        >
+            <slot><button type="primary" size="mini">选择文件</button></slot>
+        </upload-file>
+    </view>
 </template>
 
 <script>
-	import {
-		chooseAndUploadFile,
-		uploadCloudFiles
-	} from './choose-and-upload-file.js'
-	import {
-		get_file_ext,
-		get_extname,
-		get_files_and_is_max,
-		get_file_info,
-		get_file_data
-	} from './utils.js'
-	import uploadImage from './upload-image.vue'
-	import uploadFile from './upload-file.vue'
-	let fileInput = null
-	/**
-	 * FilePicker 文件选择上传
-	 * @description 文件选择上传组件，可以选择图片、视频等任意文件并上传到当前绑定的服务空间
-	 * @tutorial https://ext.dcloud.net.cn/plugin?id=4079
-	 * @property {Object|Array}	value	组件数据，通常用来回显 ,类型由return-type属性决定
-	 * @property {Boolean}	disabled = [true|false]	组件禁用
-	 * 	@value true 	禁用
-	 * 	@value false 	取消禁用
-	 * @property {Boolean}	readonly = [true|false]	组件只读，不可选择，不显示进度，不显示删除按钮
-	 * 	@value true 	只读
-	 * 	@value false 	取消只读
-	 * @property {String}	return-type = [array|object]	限制 value 格式，当为 object 时 ，组件只能单选，且会覆盖
-	 * 	@value array	规定 value 属性的类型为数组
-	 * 	@value object	规定 value 属性的类型为对象
-	 * @property {Boolean}	disable-preview = [true|false]	禁用图片预览，仅 mode:grid 时生效
-	 * 	@value true 	禁用图片预览
-	 * 	@value false 	取消禁用图片预览
-	 * @property {Boolean}	del-icon = [true|false]	是否显示删除按钮
-	 * 	@value true 	显示删除按钮
-	 * 	@value false 	不显示删除按钮
-	 * @property {Boolean}	auto-upload = [true|false]	是否自动上传，值为true则只触发@select,可自行上传
-	 * 	@value true 	自动上传
-	 * 	@value false 	取消自动上传
-	 * @property {Number|String}	limit	最大选择个数 ，h5 会自动忽略多选的部分
-	 * @property {String}	title	组件标题，右侧显示上传计数
-	 * @property {String}	mode = [list|grid]	选择文件后的文件列表样式
-	 * 	@value list 	列表显示
-	 * 	@value grid 	宫格显示
-	 * @property {String}	file-mediatype = [image|video|all]	选择文件类型
-	 * 	@value image	只选择图片
-	 * 	@value video	只选择视频
-	 * 	@value all		选择所有文件
-	 * @property {Array}	file-extname	选择文件后缀，根据 file-mediatype 属性而不同
-	 * @property {Object}	list-style	mode:list 时的样式
-	 * @property {Object}	image-styles	选择文件后缀，根据 file-mediatype 属性而不同
-	 * @event {Function} select 	选择文件后触发
-	 * @event {Function} progress 文件上传时触发
-	 * @event {Function} success 	上传成功触发
-	 * @event {Function} fail 		上传失败触发
-	 * @event {Function} delete 	文件从列表移除时触发
-	 */
-	export default {
-		name: 'uniFilePicker',
-		components: {
-			uploadImage,
-			uploadFile
-		},
-		options: {
-			virtualHost: true
-		},
-		emits: ['select', 'success', 'fail', 'progress', 'delete', 'update:modelValue', 'input'],
-		props: {
-			// #ifdef VUE3
-			modelValue: {
-				type: [Array, Object],
-				default () {
-					return []
-				}
-			},
-			// #endif
+    import { chooseAndUploadFile, uploadCloudFiles } from './choose-and-upload-file.js';
+    import { get_extname, get_file_data, get_files_and_is_max } from './utils.js';
+    import uploadImage from './upload-image.vue';
+    import uploadFile from './upload-file.vue';
 
-			// #ifndef VUE3
-			value: {
-				type: [Array, Object],
-				default () {
-					return []
-				}
-			},
-			// #endif
+    let fileInput = null;
+    /**
+     * FilePicker 文件选择上传
+     * @description 文件选择上传组件，可以选择图片、视频等任意文件并上传到当前绑定的服务空间
+     * @tutorial https://ext.dcloud.net.cn/plugin?id=4079
+     * @property {Object|Array}	value	组件数据，通常用来回显 ,类型由return-type属性决定
+     * @property {Boolean}	disabled = [true|false]	组件禁用
+     * 	@value true 	禁用
+     * 	@value false 	取消禁用
+     * @property {Boolean}	readonly = [true|false]	组件只读，不可选择，不显示进度，不显示删除按钮
+     * 	@value true 	只读
+     * 	@value false 	取消只读
+     * @property {String}	return-type = [array|object]	限制 value 格式，当为 object 时 ，组件只能单选，且会覆盖
+     * 	@value array	规定 value 属性的类型为数组
+     * 	@value object	规定 value 属性的类型为对象
+     * @property {Boolean}	disable-preview = [true|false]	禁用图片预览，仅 mode:grid 时生效
+     * 	@value true 	禁用图片预览
+     * 	@value false 	取消禁用图片预览
+     * @property {Boolean}	del-icon = [true|false]	是否显示删除按钮
+     * 	@value true 	显示删除按钮
+     * 	@value false 	不显示删除按钮
+     * @property {Boolean}	auto-upload = [true|false]	是否自动上传，值为true则只触发@select,可自行上传
+     * 	@value true 	自动上传
+     * 	@value false 	取消自动上传
+     * @property {Number|String}	limit	最大选择个数 ，h5 会自动忽略多选的部分
+     * @property {String}	title	组件标题，右侧显示上传计数
+     * @property {String}	mode = [list|grid]	选择文件后的文件列表样式
+     * 	@value list 	列表显示
+     * 	@value grid 	宫格显示
+     * @property {String}	file-mediatype = [image|video|all]	选择文件类型
+     * 	@value image	只选择图片
+     * 	@value video	只选择视频
+     * 	@value all		选择所有文件
+     * @property {Array}	file-extname	选择文件后缀，根据 file-mediatype 属性而不同
+     * @property {Object}	list-style	mode:list 时的样式
+     * @property {Object}	image-styles	选择文件后缀，根据 file-mediatype 属性而不同
+     * @event {Function} select 	选择文件后触发
+     * @event {Function} progress 文件上传时触发
+     * @event {Function} success 	上传成功触发
+     * @event {Function} fail 		上传失败触发
+     * @event {Function} delete 	文件从列表移除时触发
+     */
+    export default {
+        name: 'uniFilePicker',
+        components: {
+            uploadImage,
+            uploadFile,
+        },
+        options: {
+            virtualHost: true,
+        },
+        emits: ['select', 'success', 'fail', 'progress', 'delete', 'update:modelValue', 'input'],
+        props: {
+            // #ifdef VUE3
+            modelValue: {
+                type: [Array, Object],
+                default() {
+                    return [];
+                },
+            },
+            // #endif
 
-			disabled: {
-				type: Boolean,
-				default: false
-			},
-			disablePreview: {
-				type: Boolean,
-				default: false
-			},
-			delIcon: {
-				type: Boolean,
-				default: true
-			},
-			// 自动上传
-			autoUpload: {
-				type: Boolean,
-				default: true
-			},
-			// 最大选择个数 ，h5只能限制单选或是多选
-			limit: {
-				type: [Number, String],
-				default: 9
-			},
-			// 列表样式 grid | list | list-card
-			mode: {
-				type: String,
-				default: 'grid'
-			},
-			// 选择文件类型  image/video/all
-			fileMediatype: {
-				type: String,
-				default: 'image'
-			},
-			// 文件类型筛选
-			fileExtname: {
-				type: [Array, String],
-				default () {
-					return []
-				}
-			},
-			title: {
-				type: String,
-				default: ''
-			},
-			listStyles: {
-				type: Object,
-				default () {
-					return {
-						// 是否显示边框
-						border: true,
-						// 是否显示分隔线
-						dividline: true,
-						// 线条样式
-						borderStyle: {}
-					}
-				}
-			},
-			imageStyles: {
-				type: Object,
-				default () {
-					return {
-						width: 'auto',
-						height: 'auto'
-					}
-				}
-			},
-			readonly: {
-				type: Boolean,
-				default: false
-			},
-			returnType: {
-				type: String,
-				default: 'array'
-			},
-			sizeType: {
-				type: Array,
-				default () {
-					return ['original', 'compressed']
-				}
-			},
-			sourceType: {
-				type: Array,
-				default () {
-					return  ['album', 'camera']
-				}
-			}
-		},
-		data() {
-			return {
-				files: [],
-				localValue: []
-			}
-		},
-		watch: {
-			// #ifndef VUE3
-			value: {
-				handler(newVal, oldVal) {
-					this.setValue(newVal, oldVal)
-				},
-				immediate: true
-			},
-			// #endif
-			// #ifdef VUE3
-			modelValue: {
-				handler(newVal, oldVal) {
-					this.setValue(newVal, oldVal)
-				},
-				immediate: true
-			},
-			// #endif
-		},
-		computed: {
-			filesList() {
-				let files = []
-				this.files.forEach(v => {
-					files.push(v)
-				})
-				return files
-			},
-			showType() {
-				if (this.fileMediatype === 'image') {
-					return this.mode
-				}
-				return 'list'
-			},
-			limitLength() {
-				if (this.returnType === 'object') {
-					return 1
-				}
-				if (!this.limit) {
-					return 1
-				}
-				if (this.limit >= 9) {
-					return 9
-				}
-				return this.limit
-			}
-		},
-		created() {
-			// TODO 兼容不开通服务空间的情况
-			if (!(uniCloud.config && uniCloud.config.provider)) {
-				this.noSpace = true
-				uniCloud.chooseAndUploadFile = chooseAndUploadFile
-			}
-			this.form = this.getForm('uniForms')
-			this.formItem = this.getForm('uniFormsItem')
-			if (this.form && this.formItem) {
-				if (this.formItem.name) {
-					this.rename = this.formItem.name
-					this.form.inputChildrens.push(this)
-				}
-			}
-		},
-		methods: {
-			/**
-			 * 公开用户使用，清空文件
-			 * @param {Object} index
-			 */
-			clearFiles(index) {
-				if (index !== 0 && !index) {
-					this.files = []
-					this.$nextTick(() => {
-						this.setEmit()
-					})
-				} else {
-					this.files.splice(index, 1)
-				}
-				this.$nextTick(() => {
-					this.setEmit()
-				})
-			},
-			/**
-			 * 公开用户使用，继续上传
-			 */
-			upload() {
-				let files = []
-				this.files.forEach((v, index) => {
-					if (v.status === 'ready' || v.status === 'error') {
-						files.push(Object.assign({}, v))
-					}
-				})
-				return this.uploadFiles(files)
-			},
-			async setValue(newVal, oldVal) {
-				const newData =  async (v) => {
-					const reg = /cloud:\/\/([\w.]+\/?)\S*/
-					let url = ''
-					if(v.fileID){
-						url = v.fileID
-					}else{
-						url = v.url
-					}
-					if (reg.test(url)) {
-						v.fileID = url
-						v.url = await this.getTempFileURL(url)
-					}
-					if(v.url) v.path = v.url
-					return v
-				}
-				if (this.returnType === 'object') {
-					if (newVal) {
-						await newData(newVal)
-					} else {
-						newVal = {}
-					}
-				} else {
-					if (!newVal) newVal = []
-					for(let i =0 ;i < newVal.length ;i++){
-						let v = newVal[i]
-						await newData(v)
-					}
-				}
-				this.localValue = newVal
-				if (this.form && this.formItem &&!this.is_reset) {
-					this.is_reset = false
-					this.formItem.setValue(this.localValue)
-				}
-				let filesData = Object.keys(newVal).length > 0 ? newVal : [];
-				this.files = [].concat(filesData)
-			},
+            // #ifndef VUE3
+            value: {
+                type: [Array, Object],
+                default() {
+                    return [];
+                },
+            },
+            // #endif
 
-			/**
-			 * 选择文件
-			 */
-			choose() {
+            disabled: {
+                type: Boolean,
+                default: false,
+            },
+            disablePreview: {
+                type: Boolean,
+                default: false,
+            },
+            delIcon: {
+                type: Boolean,
+                default: true,
+            },
+            // 自动上传
+            autoUpload: {
+                type: Boolean,
+                default: true,
+            },
+            // 最大选择个数 ，h5只能限制单选或是多选
+            limit: {
+                type: [Number, String],
+                default: 9,
+            },
+            // 列表样式 grid | list | list-card
+            mode: {
+                type: String,
+                default: 'grid',
+            },
+            // 选择文件类型  image/video/all
+            fileMediatype: {
+                type: String,
+                default: 'image',
+            },
+            // 文件类型筛选
+            fileExtname: {
+                type: [Array, String],
+                default() {
+                    return [];
+                },
+            },
+            title: {
+                type: String,
+                default: '',
+            },
+            listStyles: {
+                type: Object,
+                default() {
+                    return {
+                        // 是否显示边框
+                        border: true,
+                        // 是否显示分隔线
+                        dividline: true,
+                        // 线条样式
+                        borderStyle: {},
+                    };
+                },
+            },
+            imageStyles: {
+                type: Object,
+                default() {
+                    return {
+                        width: 'auto',
+                        height: 'auto',
+                    };
+                },
+            },
+            readonly: {
+                type: Boolean,
+                default: false,
+            },
+            returnType: {
+                type: String,
+                default: 'array',
+            },
+            sizeType: {
+                type: Array,
+                default() {
+                    return ['original', 'compressed'];
+                },
+            },
+            sourceType: {
+                type: Array,
+                default() {
+                    return ['album', 'camera'];
+                },
+            },
+        },
+        data() {
+            return {
+                files: [],
+                localValue: [],
+            };
+        },
+        watch: {
+            // #ifndef VUE3
+            value: {
+                handler(newVal, oldVal) {
+                    this.setValue(newVal, oldVal);
+                },
+                immediate: true,
+            },
+            // #endif
+            // #ifdef VUE3
+            modelValue: {
+                handler(newVal, oldVal) {
+                    this.setValue(newVal, oldVal);
+                },
+                immediate: true,
+            },
+            // #endif
+        },
+        computed: {
+            filesList() {
+                let files = [];
+                this.files.forEach((v) => {
+                    files.push(v);
+                });
+                return files;
+            },
+            showType() {
+                if (this.fileMediatype === 'image') {
+                    return this.mode;
+                }
+                return 'list';
+            },
+            limitLength() {
+                if (this.returnType === 'object') {
+                    return 1;
+                }
+                if (!this.limit) {
+                    return 1;
+                }
+                if (this.limit >= 9) {
+                    return 9;
+                }
+                return this.limit;
+            },
+        },
+        created() {
+            // TODO 兼容不开通服务空间的情况
+            if (!(uniCloud.config && uniCloud.config.provider)) {
+                this.noSpace = true;
+                uniCloud.chooseAndUploadFile = chooseAndUploadFile;
+            }
+            this.form = this.getForm('uniForms');
+            this.formItem = this.getForm('uniFormsItem');
+            if (this.form && this.formItem) {
+                if (this.formItem.name) {
+                    this.rename = this.formItem.name;
+                    this.form.inputChildrens.push(this);
+                }
+            }
+        },
+        methods: {
+            /**
+             * 公开用户使用，清空文件
+             * @param {Object} index
+             */
+            clearFiles(index) {
+                if (index !== 0 && !index) {
+                    this.files = [];
+                    this.$nextTick(() => {
+                        this.setEmit();
+                    });
+                } else {
+                    this.files.splice(index, 1);
+                }
+                this.$nextTick(() => {
+                    this.setEmit();
+                });
+            },
+            /**
+             * 公开用户使用，继续上传
+             */
+            upload() {
+                let files = [];
+                this.files.forEach((v, index) => {
+                    if (v.status === 'ready' || v.status === 'error') {
+                        files.push(Object.assign({}, v));
+                    }
+                });
+                return this.uploadFiles(files);
+            },
+            async setValue(newVal, oldVal) {
+                const newData = async (v) => {
+                    const reg = /cloud:\/\/([\w.]+\/?)\S*/;
+                    let url = '';
+                    if (v.fileID) {
+                        url = v.fileID;
+                    } else {
+                        url = v.url;
+                    }
+                    if (reg.test(url)) {
+                        v.fileID = url;
+                        v.url = await this.getTempFileURL(url);
+                    }
+                    if (v.url) v.path = v.url;
+                    return v;
+                };
+                if (this.returnType === 'object') {
+                    if (newVal) {
+                        await newData(newVal);
+                    } else {
+                        newVal = {};
+                    }
+                } else {
+                    if (!newVal) newVal = [];
+                    for (let i = 0; i < newVal.length; i++) {
+                        let v = newVal[i];
+                        await newData(v);
+                    }
+                }
+                this.localValue = newVal;
+                if (this.form && this.formItem && !this.is_reset) {
+                    this.is_reset = false;
+                    this.formItem.setValue(this.localValue);
+                }
+                let filesData = Object.keys(newVal).length > 0 ? newVal : [];
+                this.files = [].concat(filesData);
+            },
 
-				if (this.disabled) return
-				if (this.files.length >= Number(this.limitLength) && this.showType !== 'grid' && this.returnType ===
-					'array') {
-					uni.showToast({
-						title: `您最多选择 ${this.limitLength} 个文件`,
-						icon: 'none'
-					})
-					return
-				}
-				this.chooseFiles()
-			},
+            /**
+             * 选择文件
+             */
+            choose() {
+                if (this.disabled) return;
+                if (this.files.length >= Number(this.limitLength) && this.showType !== 'grid' && this.returnType === 'array') {
+                    uni.showToast({
+                        title: `您最多选择 ${this.limitLength} 个文件`,
+                        icon: 'none',
+                    });
+                    return;
+                }
+                this.chooseFiles();
+            },
 
-			/**
-			 * 选择文件并上传
-			 */
-			chooseFiles() {
-				const _extname = get_extname(this.fileExtname)
-				// 获取后缀
-				uniCloud
-					.chooseAndUploadFile({
-						type: this.fileMediatype,
-						compressed: false,
-						sizeType: this.sizeType,
-						sourceType: this.sourceType,
-						// TODO 如果为空，video 有问题
-						extension: _extname.length > 0 ? _extname : undefined,
-						count: this.limitLength - this.files.length, //默认9
-						onChooseFile: this.chooseFileCallback,
-						onUploadProgress: progressEvent => {
-							this.setProgress(progressEvent, progressEvent.index)
-						}
-					})
-					.then(result => {
-						this.setSuccessAndError(result.tempFiles)
-					})
-					.catch(err => {
-						console.log('选择失败', err)
-					})
-			},
+            /**
+             * 选择文件并上传
+             */
+            chooseFiles() {
+                const _extname = get_extname(this.fileExtname);
+                // 获取后缀
+                uniCloud
+                    .chooseAndUploadFile({
+                        type: this.fileMediatype,
+                        compressed: false,
+                        sizeType: this.sizeType,
+                        sourceType: this.sourceType,
+                        // TODO 如果为空，video 有问题
+                        extension: _extname.length > 0 ? _extname : undefined,
+                        count: this.limitLength - this.files.length, //默认9
+                        onChooseFile: this.chooseFileCallback,
+                        onUploadProgress: (progressEvent) => {
+                            this.setProgress(progressEvent, progressEvent.index);
+                        },
+                    })
+                    .then((result) => {
+                        this.setSuccessAndError(result.tempFiles);
+                    })
+                    .catch((err) => {
+                        console.log('选择失败', err);
+                    });
+            },
 
-			/**
-			 * 选择文件回调
-			 * @param {Object} res
-			 */
-			async chooseFileCallback(res) {
-				const _extname = get_extname(this.fileExtname)
-				const is_one = (Number(this.limitLength) === 1 &&
-						this.disablePreview &&
-						!this.disabled) ||
-					this.returnType === 'object'
-				// 如果这有一个文件 ，需要清空本地缓存数据
-				if (is_one) {
-					this.files = []
-				}
+            /**
+             * 选择文件回调
+             * @param {Object} res
+             */
+            async chooseFileCallback(res) {
+                const _extname = get_extname(this.fileExtname);
+                const is_one = (Number(this.limitLength) === 1 && this.disablePreview && !this.disabled) || this.returnType === 'object';
+                // 如果这有一个文件 ，需要清空本地缓存数据
+                if (is_one) {
+                    this.files = [];
+                }
 
-				let {
-					filePaths,
-					files
-				} = get_files_and_is_max(res, _extname)
-				if (!(_extname && _extname.length > 0)) {
-					filePaths = res.tempFilePaths
-					files = res.tempFiles
-				}
+                let { filePaths, files } = get_files_and_is_max(res, _extname);
+                if (!(_extname && _extname.length > 0)) {
+                    filePaths = res.tempFilePaths;
+                    files = res.tempFiles;
+                }
 
-				let currentData = []
-				for (let i = 0; i < files.length; i++) {
-					if (this.limitLength - this.files.length <= 0) break
-					files[i].uuid = Date.now()
-					let filedata = await get_file_data(files[i], this.fileMediatype)
-					filedata.progress = 0
-					filedata.status = 'ready'
-					this.files.push(filedata)
-					currentData.push({
-						...filedata,
-						file: files[i]
-					})
-				}
-				this.$emit('select', {
-					tempFiles: currentData,
-					tempFilePaths: filePaths
-				})
-				res.tempFiles = files
-				// 停止自动上传
-				if (!this.autoUpload || this.noSpace) {
-					res.tempFiles = []
-				}
-			},
+                let currentData = [];
+                for (let i = 0; i < files.length; i++) {
+                    if (this.limitLength - this.files.length <= 0) break;
+                    files[i].uuid = Date.now();
+                    let filedata = await get_file_data(files[i], this.fileMediatype);
+                    filedata.progress = 0;
+                    filedata.status = 'ready';
+                    this.files.push(filedata);
+                    currentData.push({
+                        ...filedata,
+                        file: files[i],
+                    });
+                }
+                this.$emit('select', {
+                    tempFiles: currentData,
+                    tempFilePaths: filePaths,
+                });
+                res.tempFiles = files;
+                // 停止自动上传
+                if (!this.autoUpload || this.noSpace) {
+                    res.tempFiles = [];
+                }
+            },
 
-			/**
-			 * 批传
-			 * @param {Object} e
-			 */
-			uploadFiles(files) {
-				files = [].concat(files)
-				return uploadCloudFiles.call(this, files, 5, res => {
-						this.setProgress(res, res.index, true)
-					})
-					.then(result => {
-						this.setSuccessAndError(result)
-						return result;
-					})
-					.catch(err => {
-						console.log(err)
-					})
-			},
+            /**
+             * 批传
+             * @param {Object} e
+             */
+            uploadFiles(files) {
+                files = [].concat(files);
+                return uploadCloudFiles
+                    .call(this, files, 5, (res) => {
+                        this.setProgress(res, res.index, true);
+                    })
+                    .then((result) => {
+                        this.setSuccessAndError(result);
+                        return result;
+                    })
+                    .catch((err) => {
+                        console.log(err);
+                    });
+            },
 
-			/**
-			 * 成功或失败
-			 */
-			async setSuccessAndError(res, fn) {
-				let successData = []
-				let errorData = []
-				let tempFilePath = []
-				let errorTempFilePath = []
-				for (let i = 0; i < res.length; i++) {
-					const item = res[i]
-					const index = item.uuid ? this.files.findIndex(p => p.uuid === item.uuid) : item.index
+            /**
+             * 成功或失败
+             */
+            async setSuccessAndError(res, fn) {
+                let successData = [];
+                let errorData = [];
+                let tempFilePath = [];
+                let errorTempFilePath = [];
+                for (let i = 0; i < res.length; i++) {
+                    const item = res[i];
+                    const index = item.uuid ? this.files.findIndex((p) => p.uuid === item.uuid) : item.index;
 
-					if (index === -1 || !this.files) break
-					if (item.errMsg === 'request:fail') {
-						this.files[index].url = item.path
-						this.files[index].status = 'error'
-						this.files[index].errMsg = item.errMsg
-						// this.files[index].progress = -1
-						errorData.push(this.files[index])
-						errorTempFilePath.push(this.files[index].url)
-					} else {
-						this.files[index].errMsg = ''
-						this.files[index].fileID = item.url
-						const reg = /cloud:\/\/([\w.]+\/?)\S*/
-						if (reg.test(item.url)) {
-							this.files[index].url = await this.getTempFileURL(item.url)
-						}else{
-							this.files[index].url = item.url
-						}
+                    if (index === -1 || !this.files) break;
+                    if (item.errMsg === 'request:fail') {
+                        this.files[index].url = item.path;
+                        this.files[index].status = 'error';
+                        this.files[index].errMsg = item.errMsg;
+                        // this.files[index].progress = -1
+                        errorData.push(this.files[index]);
+                        errorTempFilePath.push(this.files[index].url);
+                    } else {
+                        this.files[index].errMsg = '';
+                        this.files[index].fileID = item.url;
+                        const reg = /cloud:\/\/([\w.]+\/?)\S*/;
+                        if (reg.test(item.url)) {
+                            this.files[index].url = await this.getTempFileURL(item.url);
+                        } else {
+                            this.files[index].url = item.url;
+                        }
 
-						this.files[index].status = 'success'
-						this.files[index].progress += 1
-						successData.push(this.files[index])
-						tempFilePath.push(this.files[index].fileID)
-					}
-				}
+                        this.files[index].status = 'success';
+                        this.files[index].progress += 1;
+                        successData.push(this.files[index]);
+                        tempFilePath.push(this.files[index].fileID);
+                    }
+                }
 
-				if (successData.length > 0) {
-					this.setEmit()
-					// 状态改变返回
-					this.$emit('success', {
-						tempFiles: this.backObject(successData),
-						tempFilePaths: tempFilePath
-					})
-				}
+                if (successData.length > 0) {
+                    this.setEmit();
+                    // 状态改变返回
+                    this.$emit('success', {
+                        tempFiles: this.backObject(successData),
+                        tempFilePaths: tempFilePath,
+                    });
+                }
 
-				if (errorData.length > 0) {
-					this.$emit('fail', {
-						tempFiles: this.backObject(errorData),
-						tempFilePaths: errorTempFilePath
-					})
-				}
-			},
+                if (errorData.length > 0) {
+                    this.$emit('fail', {
+                        tempFiles: this.backObject(errorData),
+                        tempFilePaths: errorTempFilePath,
+                    });
+                }
+            },
 
-			/**
-			 * 获取进度
-			 * @param {Object} progressEvent
-			 * @param {Object} index
-			 * @param {Object} type
-			 */
-			setProgress(progressEvent, index, type) {
-				const fileLenth = this.files.length
-				const percentNum = (index / fileLenth) * 100
-				const percentCompleted = Math.round((progressEvent.loaded * 100) / progressEvent.total)
-				let idx = index
-				if (!type) {
-					idx = this.files.findIndex(p => p.uuid === progressEvent.tempFile.uuid)
-				}
-				if (idx === -1 || !this.files[idx]) return
-				// fix by mehaotian 100 就会消失，-1 是为了让进度条消失
-				this.files[idx].progress = percentCompleted - 1
-				// 上传中
-				this.$emit('progress', {
-					index: idx,
-					progress: parseInt(percentCompleted),
-					tempFile: this.files[idx]
-				})
-			},
+            /**
+             * 获取进度
+             * @param {Object} progressEvent
+             * @param {Object} index
+             * @param {Object} type
+             */
+            setProgress(progressEvent, index, type) {
+                const fileLenth = this.files.length;
+                const percentNum = (index / fileLenth) * 100;
+                const percentCompleted = Math.round((progressEvent.loaded * 100) / progressEvent.total);
+                let idx = index;
+                if (!type) {
+                    idx = this.files.findIndex((p) => p.uuid === progressEvent.tempFile.uuid);
+                }
+                if (idx === -1 || !this.files[idx]) return;
+                // fix by mehaotian 100 就会消失，-1 是为了让进度条消失
+                this.files[idx].progress = percentCompleted - 1;
+                // 上传中
+                this.$emit('progress', {
+                    index: idx,
+                    progress: parseInt(percentCompleted),
+                    tempFile: this.files[idx],
+                });
+            },
 
-			/**
-			 * 删除文件
-			 * @param {Object} index
-			 */
-			delFile(index) {
-				this.$emit('delete', {
-					tempFile: this.files[index],
-					tempFilePath: this.files[index].url
-				})
-				this.files.splice(index, 1)
-				this.$nextTick(() => {
-					this.setEmit()
-				})
-			},
+            /**
+             * 删除文件
+             * @param {Object} index
+             */
+            delFile(index) {
+                this.$emit('delete', {
+                    tempFile: this.files[index],
+                    tempFilePath: this.files[index].url,
+                });
+                this.files.splice(index, 1);
+                this.$nextTick(() => {
+                    this.setEmit();
+                });
+            },
 
-			/**
-			 * 获取文件名和后缀
-			 * @param {Object} name
-			 */
-			getFileExt(name) {
-				const last_len = name.lastIndexOf('.')
-				const len = name.length
-				return {
-					name: name.substring(0, last_len),
-					ext: name.substring(last_len + 1, len)
-				}
-			},
+            /**
+             * 获取文件名和后缀
+             * @param {Object} name
+             */
+            getFileExt(name) {
+                const last_len = name.lastIndexOf('.');
+                const len = name.length;
+                return {
+                    name: name.substring(0, last_len),
+                    ext: name.substring(last_len + 1, len),
+                };
+            },
 
-			/**
-			 * 处理返回事件
-			 */
-			setEmit() {
-				let data = []
-				if (this.returnType === 'object') {
-					data = this.backObject(this.files)[0]
-					this.localValue = data?data:null
-				} else {
-					data = this.backObject(this.files)
-					if (!this.localValue) {
-						this.localValue = []
-					}
-					this.localValue = [...data]
-				}
-				// #ifdef VUE3
-				this.$emit('update:modelValue', this.localValue)
-				// #endif
-				// #ifndef VUE3
-				this.$emit('input', this.localValue)
-				// #endif
-			},
+            /**
+             * 处理返回事件
+             */
+            setEmit() {
+                let data = [];
+                if (this.returnType === 'object') {
+                    data = this.backObject(this.files)[0];
+                    this.localValue = data ? data : null;
+                } else {
+                    data = this.backObject(this.files);
+                    if (!this.localValue) {
+                        this.localValue = [];
+                    }
+                    this.localValue = [...data];
+                }
+                // #ifdef VUE3
+                this.$emit('update:modelValue', this.localValue);
+                // #endif
+                // #ifndef VUE3
+                this.$emit('input', this.localValue);
+                // #endif
+            },
 
-			/**
-			 * 处理返回参数
-			 * @param {Object} files
-			 */
-			backObject(files) {
-				let newFilesData = []
-				files.forEach(v => {
-					newFilesData.push({
-						extname: v.extname,
-						fileType: v.fileType,
-						image: v.image,
-						name: v.name,
-						path: v.path,
-						size: v.size,
-						fileID:v.fileID,
-						url: v.url,
-						// 修改删除一个文件后不能再上传的bug, #694
-            uuid: v.uuid,
-            status: v.status,
-            cloudPath: v.cloudPath
-					})
-				})
-				return newFilesData
-			},
-			async getTempFileURL(fileList) {
-				fileList = {
-					fileList: [].concat(fileList)
-				}
-				const urls = await uniCloud.getTempFileURL(fileList)
-				return urls.fileList[0].tempFileURL || ''
-			},
-			/**
-			 * 获取父元素实例
-			 */
-			getForm(name = 'uniForms') {
-				let parent = this.$parent;
-				let parentName = parent.$options.name;
-				while (parentName !== name) {
-					parent = parent.$parent;
-					if (!parent) return false;
-					parentName = parent.$options.name;
-				}
-				return parent;
-			}
-		}
-	}
+            /**
+             * 处理返回参数
+             * @param {Object} files
+             */
+            backObject(files) {
+                let newFilesData = [];
+                files.forEach((v) => {
+                    newFilesData.push({
+                        extname: v.extname,
+                        fileType: v.fileType,
+                        image: v.image,
+                        name: v.name,
+                        path: v.path,
+                        size: v.size,
+                        fileID: v.fileID,
+                        url: v.url,
+                        // 修改删除一个文件后不能再上传的bug, #694
+                        uuid: v.uuid,
+                        status: v.status,
+                        cloudPath: v.cloudPath,
+                    });
+                });
+                return newFilesData;
+            },
+            async getTempFileURL(fileList) {
+                fileList = {
+                    fileList: [].concat(fileList),
+                };
+                const urls = await uniCloud.getTempFileURL(fileList);
+                return urls.fileList[0].tempFileURL || '';
+            },
+            /**
+             * 获取父元素实例
+             */
+            getForm(name = 'uniForms') {
+                let parent = this.$parent;
+                let parentName = parent.$options.name;
+                while (parentName !== name) {
+                    parent = parent.$parent;
+                    if (!parent) return false;
+                    parentName = parent.$options.name;
+                }
+                return parent;
+            },
+        },
+    };
 </script>
 
 <style>
-	.uni-file-picker {
-		/* #ifndef APP-NVUE */
-		box-sizing: border-box;
-		overflow: hidden;
-		width: 100%;
-		/* #endif */
-		flex: 1;
-	}
+    .uni-file-picker {
+        /* #ifndef APP-NVUE */
+        box-sizing: border-box;
+        overflow: hidden;
+        width: 100%;
+        /* #endif */
+        flex: 1;
+    }
 
-	.uni-file-picker__header {
-		padding-top: 5px;
-		padding-bottom: 10px;
-		/* #ifndef APP-NVUE */
-		display: flex;
-		/* #endif */
-		justify-content: space-between;
-	}
+    .uni-file-picker__header {
+        padding-top: 5px;
+        padding-bottom: 10px;
+        /* #ifndef APP-NVUE */
+        display: flex;
+        /* #endif */
+        justify-content: space-between;
+    }
 
-	.file-title {
-		font-size: 14px;
-		color: #333;
-	}
+    .file-title {
+        font-size: 14px;
+        color: #333;
+    }
 
-	.file-count {
-		font-size: 14px;
-		color: #999;
-	}
+    .file-count {
+        font-size: 14px;
+        color: #999;
+    }
 
-	.is-add {
-		/* #ifndef APP-NVUE */
-		display: flex;
-		/* #endif */
-		align-items: center;
-		justify-content: center;
-	}
+    .is-add {
+        /* #ifndef APP-NVUE */
+        display: flex;
+        /* #endif */
+        align-items: center;
+        justify-content: center;
+    }
 
-	.icon-add {
-		width: 50px;
-		height: 5px;
-		background-color: #f1f1f1;
-		border-radius: 2px;
-	}
+    .icon-add {
+        width: 50px;
+        height: 5px;
+        background-color: #f1f1f1;
+        border-radius: 2px;
+    }
 
-	.rotate {
-		position: absolute;
-		transform: rotate(90deg);
-	}
+    .rotate {
+        position: absolute;
+        transform: rotate(90deg);
+    }
 </style>