MiniScm/subpkg_checkin/staticFaceCheck/staticFaceCheck.vue

<template>
	<view>
		<u-upload :fileList="fileList" @afterRead="afterRead" @delete="deletePic" :name="guest.id" :maxCount="1"
			:previewFullImage="true" :maxSize="1024*1024*1.5" @oversize="oversize"></u-upload>
		<u-toast ref="uToast"></u-toast>
		<u-button text="下一步" :disabled="disabled" @click="gotoConfirmOrder"></u-button>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex'
	export default {
		data() {
			return {
				name: '',
				idNumber: '',
				phone: '',
				fileList: [],
				picBase64: '',
				disabled: false,
				picValid: false
			};
		},
		computed: {
			...mapState('m_business', ['hotelParams', 'currentHotel', 'checkinInfo']),
		},
		methods: {
			...mapMutations('m_business', ['updateCheckinInfo']),
			//上传图片
			async afterRead(event) {
				let _this = this
				this.disabled = true
				uni.showLoading({
					title: "上传中",
				});
				uni.getFileSystemManager().readFile({
					filePath: event.file.url, //选择图片返回的相对路径
					encoding: 'base64', //编码格式
					success: res => {
						console.log(res);
						_this.picBase64 = res.data
						uni.$http.post('/faceVerification/checkPic', {
							hotelId: _this.currentHotel.hotelId,
							faceData: _this.picBase64
						}).then((res) => {
							if (res.data.code === 200 && res.data.success ===
								true) {

								_this.fileList.push({
									url: event.file.url
								})
								uni.$showMsg('上传成功！')
								_this.picValid = true
							} else {
								uni.$showMsg('未检测到人脸，请重新上传！')
							}
							console.log(res)
						})
					},
					fail: (e) => {
						uni.$showMsg('图片转换失败，请重试！')
						console.log("图片转换失败!");
						console.log(e);
					},
					complete: (e) => {
						console.log(e);
						setTimeout(() => {
							uni.hideLoading()
							this.disabled = false
						}, 1000)
					}
				})
			},
			oversize() {
				uni.$showMsg('图片超出允许大小（1.5M）')
			},
			//删除图片
			deletePic(event) {
				console.log(event)
				this.fileList = []
				this.picBase64 = ''
			},
			gotoConfirmOrder() {
				if (this.picValid === true) {
					let guestInfo = {
						name: this.name,
						idNumber: this.idNumber,
						faceData: this.picBase64,
						phone: this.phone
					}
					this.checkinInfo.push(guestInfo)
					this.updateCheckinInfo(this.checkinInfo)
					uni.reLaunch({
						url: '/subpkg_checkin/confirmOrder/confirmOrder'
					})
				} else {
					uni.$showMsg('请检查图片！')
				}
			}
		},
		onLoad(options) {
			this.name = options.name
			this.idNumber = options.idNumber
			this.phone = options.phone
		},
		// #ifdef MP-WEIXIN
		onShareAppMessage(info) {
			return {
				title: '源享住',
				path: 'pages/login/login',
				imageUrl: "/static/logo.png"
			}
		}
		// #endif
	}
</script>

<style lang="scss">

</style>