YNUtdPlatform/pages/realName/workbench/qualifications/index.vue

<template>
  <view class="page">
    <u-navbar class="u-navbar" title="人员资质检查" placeholder @leftClick="leftClick" leftIconColor="#fff"  bgColor="#00337A"  :titleStyle="{ color: '#FFF', fontSize: '32rpx' }"/>
	<scroll-view class="content" scroll-y="true">
		<!-- 人脸识别 -->
		<view class="view-box bg1">
			<view class="btn" @click="distinguish">立即进入</view>
		</view>
		<!-- 资质查询 -->
		<view class="view-box bg2">
			<view class="btn" @click="goSearch">立即进入</view>
		</view>
	 
	</scroll-view>
  </view>
</template>

<script>
import { pathToBase64, base64ToPath } from 'image-tools';
import config from '@/config'
export default {
  data() {
    return { 
		idNumber:uni.getStorageSync('realNameUser').idNumber,
		faceData:{}
    }
  },
  onLoad() {
	  
  },
  onShow() {
  },
  methods: {
	//人脸识别采集
	distinguish(){
		console.log('人脸识别采集')
		uni.chooseImage({
		count: 1,
		sizeType: ['compressed'],
		sourceType: ['camera'],
		success: res => {
			console.log('🚀 ~ res-拍照:', res)
			this.imgToBase64(res.tempFilePaths[0]).then(base64 => {
				// console.log(base64)
				uni.uploadFile({
					url: config.realFileUrl+'file/getFaceRecognition', //服务器地址
					fileType:"image",//ZFB必填,不然报错
					filePath: res.tempFilePaths[0],//这个就是我们上面拍照返回或者先中照片返回的数组
					formData: {
						file:base64,
						photoType:'face',
					},
					success: (uploadFileRes) => {
						console.log(uploadFileRes)
						if(uploadFileRes.statusCode==200){
							uploadFileRes=JSON.parse(uploadFileRes.data)
							console.log(uploadFileRes)
							if(uploadFileRes.code==200){
								if(uploadFileRes.data.face){
									this.faceData=JSON.parse(uploadFileRes.data.personData)
									console.log(this.faceData)
									if(this.faceData){
										uni.navigateTo({
											url: `/pages/realName/workbench/qualifications/detail?idNumber=${this.faceData.idNumber}`
										})
										// uni.$u.toast('人脸认证成功！');
									}else{
										uni.$u.toast('识别失败');
									}
								}else{
									uni.$u.toast(uploadFileRes.msg);
								}
							}else{
								uni.$u.toast(uploadFileRes.msg);
							}
						}else{
							uni.$u.toast('识别失败');
						}
					},
					fail: err => {
						uni.$u.toast('识别失败');
						console.log(err)
					}
				});
			  })
			},
			fail: err => { 
			  console.log('🚀 ~ err:', err)
			}
		})
	},
	goSearch(){
		uni.navigateTo({//人员查询
			url: `/pages/realName/workbench/qualifications/search`
		})
	},
	imgToBase64(data) {
	  return new Promise((resolve, reject) => {
		pathToBase64(data)
		  .then(base64 => {
			resolve(base64)
		  })
		  .catch(error => {
			console.error(error)
			reject(error)
		  })
	  })
	},
	// 返回
    leftClick() {
      console.log('返回')
      uni.navigateBack({
      	delta: 1 // 返回
      });
    }, 
  },

}
</script>

<style lang="scss">
.page {
	width: 100vw;
	height: 100vh;
	background-color: #EFEFEF;
	box-sizing: border-box;
	font: 24rpx;
	.content{
		width: 100%;
		height: 92vh;
		margin-top: 20rpx;
		background-color: #EFEFEF;
		padding-bottom: 40rpx;
		.view-box{
			width: 92%;
			height: 240rpx;
			margin: 20rpx auto;
			background-color: #FFF;
			border-radius: 10rpx;
			position: relative;
		}
		.bg1{
			background: url('../../../../static/realName/qualifications_face_img.png') no-repeat;
			background-size: 100% 100%;
		}
		.bg2{
			background: url('../../../../static/realName/qualifications_qualifications_img.png') no-repeat;
			background-size: 100% 100%;
		}
		.btn{
			width: 140rpx;
			height: 50rpx;
			position:absolute;
			right: 100rpx;
			bottom: 30rpx; 
			display: flex;align-items: center;justify-content: center;
			background: #00337A;
			color: #FFF;
			font-size: 24rpx;
			border-radius: 50rpx;
		}
	}
}
</style>