refactor(train_management): 优化人脸认证页面代码结构
-调整代码格式，提高可读性 - 移除冗余的空行和注释 - 统一代码风格 -优化部分变量和方法的命名hyx_2025-01-13_xgf2.0
parent
25d047341a
commit
4934e79c45
|
|
@ -5,7 +5,8 @@
|
|||
</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" />
|
||||
<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/images/gaiz.png" class="gaiimg"></cover-image>
|
||||
</view>
|
||||
|
|
@ -17,189 +18,200 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
// import {setMeetingFace, setScanCodeToVerifyFace, setUserFace, setVerifyFace} from "@/api";
|
||||
import { submitEditUserFace, compareUserFaceCertify, compareUserExamFaceCertify } from '@/api';
|
||||
// import {setMeetingFace, setScanCodeToVerifyFace, setUserFace, setVerifyFace} from "@/api";
|
||||
import {
|
||||
submitEditUserFace,
|
||||
compareUserFaceCertify,
|
||||
compareUserExamFaceCertify
|
||||
} from '@/api';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
startPreviewTimer: null, // 开始预览计时器实例
|
||||
isFirst: '', // 是否为第一次开启摄像头
|
||||
type: '', // 摄像头使用类别
|
||||
// showButton: "yes",
|
||||
routeQueryparams: {}, // 额外携带的参数
|
||||
btnTextStr: '拍照'
|
||||
}
|
||||
},
|
||||
onReady() {
|
||||
this.context = uni.createLivePusherContext('livePusher', this)
|
||||
this.startPreviewTimer = setInterval(() => {
|
||||
this.startPreview()
|
||||
}, 1000)
|
||||
},
|
||||
onLoad(query) {
|
||||
// facial_input 人脸认证 isFirst 1 第一次登录添加人脸
|
||||
// scan_face 扫码
|
||||
// update_facial_input 更新人脸
|
||||
// learning_certification 学习认证
|
||||
// meeting_attendance 会议签到
|
||||
const typeKey = ['facial_input', 'scan_face', 'learning_certification', 'update_facial_input']
|
||||
if (!typeKey.includes(query.type)) {
|
||||
uni.$u.toast('type参数错误')
|
||||
return
|
||||
}
|
||||
this.isFirst = query.isFirst || ''
|
||||
if (query.type === 'facial_input' || 'update_facial_input') this.btnTextStr = '人脸认证'
|
||||
if (query.type === 'scan_face') this.btnTextStr = '签到'
|
||||
if (query.type === 'learning_certification') this.btnTextStr = '开始考试'
|
||||
this.type = query.type
|
||||
// this.showButton = query.showButton || "yes";
|
||||
this.routeQueryparams = query ?? {}
|
||||
},
|
||||
onBackPress(event) {
|
||||
if (event.from === 'backbutton') {
|
||||
if ((this.type === 'scan_face' && this.isFirst === '1') || this.type === 'learning_certification' || this.type === 'facial_input') {
|
||||
uni.$u.toast('请完成人脸验证')
|
||||
return true
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
startPreviewTimer: null, // 开始预览计时器实例
|
||||
isFirst: '', // 是否为第一次开启摄像头
|
||||
type: '', // 摄像头使用类别
|
||||
// showButton: "yes",
|
||||
routeQueryparams: {}, // 额外携带的参数
|
||||
btnTextStr: '拍照'
|
||||
}
|
||||
},
|
||||
onReady() {
|
||||
this.context = uni.createLivePusherContext('livePusher', this)
|
||||
this.startPreviewTimer = setInterval(() => {
|
||||
this.startPreview()
|
||||
}, 1000)
|
||||
},
|
||||
onLoad(query) {
|
||||
// facial_input 人脸认证 isFirst 1 第一次登录添加人脸
|
||||
// scan_face 扫码
|
||||
// update_facial_input 更新人脸
|
||||
// learning_certification 学习认证
|
||||
// meeting_attendance 会议签到
|
||||
const typeKey = ['facial_input', 'scan_face', 'learning_certification', 'update_facial_input']
|
||||
if (!typeKey.includes(query.type)) {
|
||||
uni.$u.toast('type参数错误')
|
||||
return
|
||||
}
|
||||
this.isFirst = query.isFirst || ''
|
||||
if (query.type === 'facial_input' || 'update_facial_input') this.btnTextStr = '人脸认证'
|
||||
if (query.type === 'scan_face') this.btnTextStr = '签到'
|
||||
if (query.type === 'learning_certification') this.btnTextStr = '开始考试'
|
||||
this.type = query.type
|
||||
// this.showButton = query.showButton || "yes";
|
||||
this.routeQueryparams = query ?? {}
|
||||
},
|
||||
onBackPress(event) {
|
||||
// if (event.from === 'backbutton') {
|
||||
// if ((this.type === 'scan_face' && this.isFirst === '1') || this.type === 'learning_certification' || this.type === 'facial_input') {
|
||||
// uni.$u.toast('请完成人脸验证')
|
||||
// return true
|
||||
// }
|
||||
// }
|
||||
if (this.type === 'facial_input') {
|
||||
uni.$u.route({
|
||||
type: 'redirect',
|
||||
url: '/pages/index/index',
|
||||
})
|
||||
}
|
||||
return false
|
||||
},
|
||||
onUnload() {
|
||||
this.startPreviewTimer && clearInterval(this.startPreviewTimer)
|
||||
},
|
||||
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.showButton === "no" && this.snapshot();
|
||||
}
|
||||
})
|
||||
},
|
||||
getMinImage(imgPath) {
|
||||
plus.zip.compressImage({
|
||||
src: imgPath,
|
||||
dst: imgPath,
|
||||
overwrite: true,
|
||||
quality: 40
|
||||
},
|
||||
(zipRes) => {
|
||||
setTimeout(() => {
|
||||
const reader = new plus.io.FileReader()
|
||||
reader.onloadend = async (res) => {
|
||||
const speech = res.target.result
|
||||
// 获取 base 64 图片编码的前缀
|
||||
const USERAVATARPREFIX = speech.substring(0, speech.indexOf(
|
||||
'base64,') + 7)
|
||||
// 获取 base 64 图片的二进制到文本
|
||||
const USERAVATARURL = speech.substring(speech.indexOf('base64,') + 7)
|
||||
try {
|
||||
const otherParams = {
|
||||
...this.routeQueryparams
|
||||
}
|
||||
delete otherParams.type
|
||||
if (this.type === 'facial_input' || this.type ===
|
||||
'update_facial_input') {
|
||||
await submitEditUserFace({
|
||||
...otherParams,
|
||||
USERAVATARPREFIX,
|
||||
USERAVATARURL
|
||||
})
|
||||
await this.$store.dispatch('setVerification', '1')
|
||||
uni.$u.toast('人脸信息认证成功')
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
})
|
||||
}, 1000)
|
||||
} else if (this.type === 'scan_face') {
|
||||
await compareUserFaceCertify({
|
||||
...otherParams,
|
||||
USERAVATARPREFIX,
|
||||
USERAVATARURL
|
||||
})
|
||||
uni.$u.toast('人脸认证成功')
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({
|
||||
delta: 2
|
||||
})
|
||||
}, 1000)
|
||||
} else if (this.type === 'learning_certification') {
|
||||
const res = await compareUserExamFaceCertify({
|
||||
...otherParams,
|
||||
USERAVATARPREFIX,
|
||||
USERAVATARURL
|
||||
})
|
||||
await uni.$u.toast('人脸认证成功, 请进入考试答题')
|
||||
setTimeout(() => {
|
||||
uni.$u.route({
|
||||
url: '/pages/train_management/course_exam',
|
||||
params: {
|
||||
...this.routeQueryparams
|
||||
}
|
||||
})
|
||||
}, 1000)
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('扫描人脸过程中捕获的错误 :>>> ', e)
|
||||
if (e && e.msg) {
|
||||
uni.$u.toast(e.msg)
|
||||
}
|
||||
// this.showButton === "no" && this.snapshot();
|
||||
}
|
||||
}
|
||||
reader.readAsDataURL(plus.io.convertLocalFileSystemURL(zipRes.target))
|
||||
}, 4000)
|
||||
}
|
||||
)
|
||||
}
|
||||
}
|
||||
return false
|
||||
},
|
||||
onUnload() {
|
||||
this.startPreviewTimer && clearInterval(this.startPreviewTimer)
|
||||
},
|
||||
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.showButton === "no" && this.snapshot();
|
||||
}
|
||||
})
|
||||
},
|
||||
getMinImage(imgPath) {
|
||||
plus.zip.compressImage(
|
||||
{
|
||||
src: imgPath,
|
||||
dst: imgPath,
|
||||
overwrite: true,
|
||||
quality: 40
|
||||
},
|
||||
(zipRes) => {
|
||||
setTimeout(() => {
|
||||
const reader = new plus.io.FileReader()
|
||||
reader.onloadend = async (res) => {
|
||||
const speech = res.target.result
|
||||
// 获取 base 64 图片编码的前缀
|
||||
const USERAVATARPREFIX = speech.substring(0, speech.indexOf('base64,') + 7)
|
||||
// 获取 base 64 图片的二进制到文本
|
||||
const USERAVATARURL = speech.substring(speech.indexOf('base64,') + 7)
|
||||
try {
|
||||
const otherParams = {
|
||||
...this.routeQueryparams
|
||||
}
|
||||
delete otherParams.type
|
||||
if (this.type === 'facial_input' || this.type === 'update_facial_input') {
|
||||
await submitEditUserFace({
|
||||
...otherParams,
|
||||
USERAVATARPREFIX,
|
||||
USERAVATARURL
|
||||
})
|
||||
await this.$store.dispatch('setVerification', '1')
|
||||
uni.$u.toast('人脸信息认证成功')
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
})
|
||||
}, 1000)
|
||||
} else if (this.type === 'scan_face') {
|
||||
await compareUserFaceCertify({
|
||||
...otherParams,
|
||||
USERAVATARPREFIX,
|
||||
USERAVATARURL
|
||||
})
|
||||
uni.$u.toast('人脸认证成功')
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({
|
||||
delta: 2
|
||||
})
|
||||
}, 1000)
|
||||
} else if (this.type === 'learning_certification') {
|
||||
const res = await compareUserExamFaceCertify({
|
||||
...otherParams,
|
||||
USERAVATARPREFIX,
|
||||
USERAVATARURL
|
||||
})
|
||||
await uni.$u.toast('人脸认证成功, 请进入考试答题')
|
||||
setTimeout(() => {
|
||||
uni.$u.route({
|
||||
url: '/pages/train_management/course_exam',
|
||||
params: {
|
||||
...this.routeQueryparams
|
||||
}
|
||||
})
|
||||
}, 1000)
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('扫描人脸过程中捕获的错误 :>>> ', e)
|
||||
if (e && e.msg) {
|
||||
uni.$u.toast(e.msg)
|
||||
}
|
||||
// this.showButton === "no" && this.snapshot();
|
||||
}
|
||||
}
|
||||
reader.readAsDataURL(plus.io.convertLocalFileSystemURL(zipRes.target))
|
||||
}, 4000)
|
||||
}
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.container {
|
||||
background-color: #fff;
|
||||
}
|
||||
.container {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.livePusher {
|
||||
width: 700upx;
|
||||
height: 700upx;
|
||||
}
|
||||
.livePusher {
|
||||
width: 700upx;
|
||||
height: 700upx;
|
||||
}
|
||||
|
||||
.livefater {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-bottom: 100upx;
|
||||
height: 700upx;
|
||||
}
|
||||
.livefater {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-bottom: 100upx;
|
||||
height: 700upx;
|
||||
}
|
||||
|
||||
.fat {
|
||||
margin: 100upx;
|
||||
}
|
||||
.fat {
|
||||
margin: 100upx;
|
||||
}
|
||||
|
||||
.fatt {
|
||||
text-align: center;
|
||||
font-size: 36upx;
|
||||
font-weight: 800;
|
||||
}
|
||||
.fatt {
|
||||
text-align: center;
|
||||
font-size: 36upx;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.gaiimg {
|
||||
width: 700upx;
|
||||
height: 700upx;
|
||||
margin-top: -700upx;
|
||||
}
|
||||
.gaiimg {
|
||||
width: 700upx;
|
||||
height: 700upx;
|
||||
margin-top: -700upx;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue