<template>
	<view class="c-upload" :style="[customStyle]">
		<u-upload :width="width" :height="height" ref="uUpload" name="file"  :form-data="getFormData"
			:action="vuex_ossUrlPubilc" @on-choose-complete="getTempImgUrl" :before-upload="beforeUpload" :auto-upload="false"
			:show-progress="false" :custom-btn="customBtn" @on-success="getSuccessResult" :file-list="fileList"
			:deletable="deletable" :max-size="5 * 1024 * 1024" :max-count="maxCount">
			<view slot="addBtn">
				<slot name="addView"></slot>
			</view>
		</u-upload>
	</view>
</template>

<script>
	export default {
		name: 'c-upload',
		props: {
			width: {
				type: [String, Number],
				default: 200
			},
			height: {
				type: [String, Number],
				default: 200
			},
			maxCount: {
				type: [String, Number],
				default: 52
			},
			customStyle: {
				type: Object,
				default () {
					return {};
				}
			},
			fileList: {
				type: Array,
				default () {
					return [];
				}
			},
			//是否显示自定义组件
			customBtn: {
				type: Boolean,
				default: false
			},
			//是否显示删除按钮
			deletable: {
				type: Boolean,
				default: false
			},

		},
		data() {
			return {
				filePath: '',
				getFormData: {},
			}
		},
		watch: {
			filePath(val, oldVal) {
				this.updateFormData()
			},

			getFormData(val, oldVal) {
				setTimeout(() => {
					this.$refs.uUpload.upload();
				}, 500)
			},
		},
		computed: {

		},
		methods: {
			getTempImgUrl(list, index) {
				this.filePath = list[0].file.path
			},
			beforeUpload(index, list) {
				// 只上传偶数索引的文件
				console.log('beforeUpload', index, list[0])
			},
			updateFormData() {
				
				this.$u.api.getOssInit({
					"object_type": "resume_head_image"
				}).then(res => {
					this.getFormData = Object.assign({}, {
						'key': '',
						'OSSAccessKeyId': res.access_key_id,
						'policy': res.policy,
						'signature': res.signature,
						'callback': res.callback_body,
						'x:access_token': res.callback_token,
						'success_action_status': '200',
					}, {
						key: this.filePath
					})
				})
			},

			getSuccessResult(data, index, lists, name) {
				this.$emit("before-upload-parent", [data])
			}
		}
	}
</script>

<style lang="scss" scoped>
	
	
</style>