integrated_traffic_uniapp/pages/application/onlinexxks/face/index.nvue

271 lines
6.7 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<view class="allbox">
<div class="custom" :style="{height: CustomBar+'px'}">
<view class="navcontent" :style="[{top:statusBar + 'px'}]">
<text style="color: #FFFFFF;font-size: 16px;line-height: 45px;text-align: center;">人脸识别</text>
<text></text>
</view>
</div>
<view class="fat">
<text class="fatt">{{msg}}</text>
</view>
<view class="livefater">
<view
style="
width: 700upx;
height: 700upx;
border-radius: 700upx;
overflow: hidden;
"
>
<live-pusher
id="livePusher"
ref="livePusher"
class="livePusher"
url=""
mode="SD"
:muted="true"
:enable-camera="true"
:auto-focus="true"
:beauty="1"
whiteness="2"
aspect="1:1"
/>
</view>
<cover-image src="../../../../static/image/gaiz.png" class="gaiimg"></cover-image>
</view>
</view>
</template>
<script>
import {basePath,loginUser} from "@/common/tool";
export default {
data: {
msg:'请将人脸置于圆圈内',
statusBar: '',
CustomBar: 0,
USER_ID:'',
startPreviewTimer:null,
params:{}
},
onLoad(event) {
this.params = JSON.parse(event.params)
var that = this
uni.getStorage({
key: 'USER',
success: function (res) {
that.USER_ID = res.data.USER_ID
if(!res.data.USER_ID){
uni.clearStorage()
uni.reLaunch({
url: '/pages/login/home'
});
}
}
})
},
onReady() {
// 注意需要在onReady中 或 onLoad 延时
this.context = uni.createLivePusherContext("livePusher", this);
var that = this
uni.getSystemInfo({
success: function(e) {
// 计算导航栏高度
that.statusBar = e.statusBarHeight
// #ifndef MP
if (e.platform == 'android') {
that.CustomBar = e.statusBarHeight + 50
} else {
that.CustomBar = e.statusBarHeight + 45
}
console.log(that.statusBar)
// #endif
// #ifdef MP-WEIXIN
let custom = wx.getMenuButtonBoundingClientRect()
that.CustomBar = custom.bottom + custom.top - e.statusBarHeight
// #endif
// #ifdef MP-ALIPAY
that.CustomBar = e.statusBarHeight + e.titleBarHeight
// #endif
that.$nextTick(() => {
// that.startPreview()
that.startPreviewTimer = setInterval(() => {
that.startPreview()
}, 1000)
})
}
})
},
onBackPress(event) {
if (event.from === "backbutton") {
// uni.showToast({
// icon:'none',
// title:'请完成人脸验证'
// })
uni.navigateBack({
delta: 2
});
return true;
}
return false;
},
methods: {
snapshot() {
// uni.showLoading({
// title: "加载中",
// });
this.context.snapshot({
success: (e) => {
this.getMinImage(e.message.tempImagePath);
},
});
},
startPreview() {
this.context.stopPreview();
this.context.startPreview({
success: () => {
this.startPreviewTimer && clearInterval(this.startPreviewTimer);
this.snapshot();
},
});
},
// 使用plus.zip.compressImage压缩图片并转换成base64
getMinImage(imgPath) {
var that = this
plus.zip.compressImage({
src: imgPath,
dst: imgPath,
overwrite: true,
quality: 40
},
zipRes => {
setTimeout(() => {
var reader = new plus.io.FileReader();
reader.onloadend = res => {
var speech = res.target.result; //base64图片
var USERAVATARPREFIX = speech.substring(0, speech.indexOf('base64,') + 7)
var USERAVATARURL = speech.substring(speech.indexOf('base64,') + 7)
uni.request({
url: basePath +'/app/user/compareFace',
method: 'POST',
dataType: 'json',
header: {
'Content-type':'application/x-www-form-urlencoded'
},
data: {
USERAVATARPREFIX:USERAVATARPREFIX,
USERAVATARURL:USERAVATARURL,
USER_ID : that.USER_ID,
CORPINFO_ID:loginUser.CORPINFO_ID,
...this.params
},
success: (res) => {
// uni.hideLoading();//结束加载中动画
if (res.data != null) {
var result = res.data.result;
if ("success" == result) {
uni.showToast({
title: "验证成功",
duration: 1000
});
uni.$emit('verification')
uni.navigateBack()
} else if ("error" == result) {
that.msg = res.data.msg
that.snapshot();
}else{
uni.showToast({
icon: 'none',
title: "人脸信息更新,请重新登陆",
duration: 2000
});
}
}
}
})
};
//一定要使用plus.io.convertLocalFileSystemURL将target地址转换为本地文件地址否则readAsDataURL会找不到文件
reader.readAsDataURL(plus.io.convertLocalFileSystemURL(zipRes.target));
}, 1000);
},
function(error) {
console.log('Compress error!', error);
}
);
},
}
}
</script>
<style>
.allbox {
background-color: #fff;
}
.allfoot {
padding: 0 20px 0 20px;
}
.cu-btn {
color: #fff;
}
.custom {
background-color: #2C65F7;
}
.navcontent {
height: 45px;
padding: 0 24px;
color: #FFFFFF;
position: relative;
}
.livePusher {
width: 700upx;
height: 700upx;
}
.livefater {
display: -ms-flex;
display: -webkit-flex;
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
margin-bottom: 50rpx;
height: 700upx;
position: relative;
}
.fat{
margin: 50rpx;
}
.fatt{
text-align: center;
font-size: 18px;
}
.gaiimg {
width: 700upx;
height: 700upx;
margin-top: -700upx;
}
.allbtn {
color: #fff;
border-radius: 10upx;
}
.alltext {
text-align: center;
color: #FFFFFF;
font-size: 16px;
line-height: 45px;
}
</style>