<template>
	<view>
		<view class="title">{{i18n.set.upPhotoTip}}</view>
		<view class="images row">
			<view v-for="(item,index) in tempFilePaths" class="row photos">
				<image @click="showthumb(index)" class="uploadback" :src="item"></image>
			</view>
			<image @click="upload" class="uploadback" src="../../static/image/shangchuantupian.png"></image>
		</view>
		<view class="uploadbtn" @click="uploadok">{{i18n.order.querensongda}}</view>
	</view>
</template>

<script>
	export default {
		computed: {
			i18n() {
				return this.$t('index')
			},
		},

		data() {
			return {
				tempFilePaths: [],
				thumbs: [],
				remark:''
			}
		},
		onLoad(option) {
			this.oid = option.oid
			this.orderByWorker = option.orderByWorker
			uni.setNavigationBarTitle({
				title: this.i18n.set.tupianshangchuan
			})
		},
		methods: {
			showthumb(index) {
				uni.previewImage({
					current: index,
					urls: this.tempFilePaths
				})
			},

			uploadok() {
				if (this.tempFilePaths.length == 0) {
					uni.showToast({
						title: this.i18n.set.zhishaoyizhang,
						icon: 'none'
					});
					return
				}
				var that = this
				uni.showLoading({})
				const Accesstoken = uni.getStorageSync('Accesstoken')
				for (let i = 0; i < this.tempFilePaths.length; i++) {
					uni.uploadFile({
						url: getApp().globalData.mainurl + '/upload/file',
						filePath: this.tempFilePaths[i],
						name: 'file',
						header: {
							"content-type": 'multipart/form-data',
							appYSToken: Accesstoken
						}, // 请求头
						formData: {},
						success(res) {
							
							var data = JSON.parse(res.data)
							if (data.code == 200) {
								// that.thumbs.push(data.data.info[0].url_all)
								// if (that.thumbs.length == that.tempFilePaths.length) {
								// 	uni.hideLoading()
								// 	uni.showToast({
								// 		title: that.i18n.set.upSucess,
								// 		icon: 'none'
								// 	});
									//在这里请求确认送达接口
									that.NB.sendRequest('/order/app/finishOrder', {
										orderId: that.oid,
										orderPicture: data.result,
										remark:that.remark,
										orderByWorker:that.orderByWorker
									}, true,"POST",'application/json').then(function(data) {
										if(data.code == 200){
											uni.showToast({
												title: "成功送达",
												icon: 'none'
											});
											setTimeout(() => {
												uni.navigateBack({
													delta: 1
												});
											}, 1000)
										}
									})
								// }
							} else {
								uni.hideLoading()
								uni.showToast({
									title: data.message,
									icon: 'none'
								});
							}
						},
						fail: err => {
							uni.hideLoading()
						}
					})
				}
			},
			upload() {
				
				let that = this;
				if (that.tempFilePaths.length > 2) {
					uni.showToast({
						title: that.i18n.set.zuiduosanzhang,
						icon: 'none'
					});
					return
				}

				uni.chooseImage({
					count: 3,
					sizeType: ['original', 'compressed'],
					sourceType: ['album', 'camera'],
					success: function(res) {
						for (let i = 0; i < res.tempFilePaths.length; i++) {
							if (that.tempFilePaths.length > 2) {
								return
							}
							that.tempFilePaths.push(res.tempFilePaths[i])
						}
					},
				});
			}
		}
	}
</script>

<style>
	.uploadbtn {
		background-color: #FF5725;
		height: 44px;
		font-size: 16px;
		color: #FFFFFF;
		line-height: 44px;
		width: calc(100% - 30px);
		margin-left: 15px;
		position: absolute;
		bottom: 20px;
		border-radius: 4px;
		text-align: center;
	}

	.images {
		margin-left: 15px;
		margin-top: 20px;
	}

	.uploadback {
		width: 76px;
		height: 76px;
		margin-right: 10px;
	}

	page {
		width: 100%;
		height: 100%;
		background-color: rgba(247, 247, 247, 100);
	}

	.title {
		color: rgba(152, 152, 152, 1);
		font-size: 13px;
		width: calc(100% - 30px);
		margin-left: 15px;
		margin-top: 20px;
		font-size: 13px;
	}
</style>