<template>
	<view class="out-box">
		
			<view v-if="photo">
				<view style="text-align: center; padding: 20px;">
					<image :src="photo" style="width: 60vw; height: 60vh;"></image>
				</view>
				
				<view>
					<button  type="primary" @tap="checkAndNext">识别并登录</button>
				</view>
				
				<view>
					<button  type="warn" @tap="clearPhoto">重新拍照</button>
				</view>
				
			</view>
			
			<view v-else>
				<yf-photo-take v-model="photo" :base64.sync="base64"></yf-photo-take>
				<button type="warn" @tap="backLogin">返回登录页面</button>
			</view>
			
			
					
	</view>
</template>

<script>
	import { faceLogin } from '@/api/sys/user/user.js'
	export default {

		data() {
			return {
				photo: '',
				base64: ''
			}
		},

		methods: {

			clearPhoto(){
				this.photo = ''
				this.base64 = ''
			},
			// 对比获取token
			checkAndNext(){
				
				let that = this
				
				uni.showLoading({
					title: '正在比对人脸...'
				});
			
				faceLogin({ base64: this.base64 }).then(res => {
					console.log('识别结果', res)
					
					// 保存本地token
					uni.setStorageSync('token', res.token);
									
					//打印请求返回的数据
					uni.switchTab({
						url: '/pages/index/index'
					});
					
					
					uni.hideLoading()
				})
			},
			
			
			// 返回登录页面
			backLogin(){
				uni.redirectTo({
					url: '/pages/login/login'
				});
			}

		}
	}
</script>

<style scoped>
	.out-box {
	    padding: 25px;
	    font-size: 14px;
	    flex-direction: column;
	    height: 100vh;
	}
	
	button {
		margin-top: 20px;
	}
	
</style>
