297 lines
7.4 KiB
Vue
297 lines
7.4 KiB
Vue
<template>
|
||
<view class="page">
|
||
<custom-nav-bar :fill="false" :show-back="true" background-color="transparent" title="" />
|
||
<image class="bj" mode="" src="https://api.ccttiot.com/image-1757389708427.png"></image>
|
||
<view v-if="!isReal" class="sfxx">
|
||
<view class="tit"> 请输入您的有效身份信息</view>
|
||
<view class="name"> 姓名 <input v-model="name" placeholder="请填写姓名" type="text" /></view>
|
||
<view class="name">
|
||
身份证号 <input v-model="zfzh" placeholder="请填写身份证号" type="text" />
|
||
</view>
|
||
<view class="" style="width: 100%; text-align: center; margin-top: 20rpx; color: #ccc">
|
||
您当前还未完成实名认证
|
||
</view>
|
||
</view>
|
||
<view v-else class="sfxx">
|
||
<view class="tit"> 请输入您的有效身份信息</view>
|
||
<view class="name">
|
||
姓名 <input v-model="name" :disabled="true" placeholder="请填写姓名" type="text" />
|
||
</view>
|
||
<view class="name">
|
||
身份证号 <input v-model="zfzh" :disabled="true" placeholder="请填写身份证号" type="text" />
|
||
</view>
|
||
<view class="" style="width: 100%; text-align: center; margin-top: 20rpx; color: #ccc">
|
||
您当前已完成实名认证
|
||
</view>
|
||
</view>
|
||
|
||
<view v-if="!isReal" class="anniu" @click="btnshiming">
|
||
<!-- <text>进入人脸识别</text> -->
|
||
<text>提交</text>
|
||
</view>
|
||
<view v-if="isRefresh" class="refresh" @click="toGetshuaxin">
|
||
<text>刷新实名状态</text>
|
||
</view>
|
||
<uv-toast ref="toast"></uv-toast>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
putRealName,
|
||
refreshRealName,
|
||
} from '../../api/realNameAuthentication/realNameAuthentication'
|
||
|
||
export default {
|
||
data() {
|
||
return {
|
||
isRefresh: false,
|
||
isReal: false,
|
||
bgc: {
|
||
backgroundColor: '',
|
||
},
|
||
name: '',
|
||
zfzh: '',
|
||
|
||
backData: null,
|
||
smflag: true,
|
||
}
|
||
},
|
||
onLoad(option) {
|
||
if (option.isReal === 'true') {
|
||
console.log('路由传入的实名', option.isReal)
|
||
this.isReal = true
|
||
console.log('vue挂载的实名', this.isReal)
|
||
}
|
||
},
|
||
onShow() {
|
||
// if (this.backData === true) {
|
||
// console.log('接收数据:', this.backData);
|
||
// this.getshuaxin();
|
||
// this.backData = null; // 重置
|
||
// }
|
||
this.smflag = true
|
||
},
|
||
methods: {
|
||
toGetshuaxin() {
|
||
uni.$uv.debounce(this.getshuaxin, 500, true)
|
||
},
|
||
|
||
// 刷新人脸识别状态
|
||
async getshuaxin() {
|
||
try {
|
||
// 显示加载Toast（30秒超时自动隐藏）
|
||
this.$refs.toast.show({
|
||
type: 'loading',
|
||
message: '正在刷新实名信息...',
|
||
overlay: true,
|
||
duration: 30000,
|
||
})
|
||
|
||
const res = await refreshRealName()
|
||
this.$refs.toast.hide()
|
||
|
||
if (res.code === 200) {
|
||
this.handleRefreshSuccess(res.data)
|
||
} else {
|
||
this.handleRefreshFail(res.msg || '人脸认证失败')
|
||
}
|
||
} catch (error) {
|
||
this.$refs.toast.hide()
|
||
this.handleRefreshFail(error.message || '网络异常')
|
||
}
|
||
},
|
||
|
||
// 处理成功响应
|
||
handleRefreshSuccess(data) {
|
||
if (data.pass) {
|
||
uni.showModal({
|
||
title: '认证成功',
|
||
showCancel: false,
|
||
complete: () => uni.navigateBack(),
|
||
})
|
||
} else {
|
||
this.handleRefreshFail('人脸验证未通过')
|
||
}
|
||
},
|
||
|
||
// 统一处理失败
|
||
handleRefreshFail(message) {
|
||
// uni.showModal({
|
||
// title: '提示',
|
||
// content: message,
|
||
// showCancel: false,
|
||
// // complete: () => uni.navigateBack(),
|
||
// })
|
||
},
|
||
|
||
// 点击进行实名认证
|
||
btnshiming() {
|
||
if (this.smflag === true) {
|
||
this.smflag = false
|
||
let data = {
|
||
userName: this.name,
|
||
idCard: this.zfzh,
|
||
}
|
||
console.log('身份信息', data)
|
||
putRealName(data)
|
||
.then(res => {
|
||
if (res.code === 200) {
|
||
let https = encodeURIComponent(res.data.jumpUrl)
|
||
this.backData = true
|
||
uni.navigateTo({
|
||
url: '/page_user/facialRecognition/facialRecognition?https=' + https,
|
||
})
|
||
this.isRefresh = true
|
||
}
|
||
// else if (res.code === 500 && res.msg === null) {
|
||
// uni.showToast({
|
||
// title: '已提交，请等待系统反馈',
|
||
// icon: 'none',
|
||
// duration: 2000,
|
||
// })
|
||
// this.smflag = true
|
||
// } else {
|
||
// uni.showToast({
|
||
// title: res.msg,
|
||
// icon: 'none',
|
||
// duration: 2000,
|
||
// })
|
||
// this.smflag = true
|
||
// }
|
||
})
|
||
.catch(error => {
|
||
if (error.code === 500 && error === null) {
|
||
uni.showToast({ title: '已提交，请等待系统反馈', icon: 'none' })
|
||
} else {
|
||
uni.showToast({ title: error || '系统错误', icon: 'none' })
|
||
console.log('@@@@@@@@', error)
|
||
}
|
||
this.smflag = true
|
||
})
|
||
}
|
||
|
||
// this.$u.put(`/app/realName/realName`,data).then(res =>{ //人脸
|
||
// if(res.code === 200){
|
||
// let https = encodeURIComponent(res.data.jumpUrl)
|
||
// this.backData = true
|
||
// uni.navigateTo({
|
||
// url:'/page_fenbao/renlian?https=' + https
|
||
// })
|
||
// }else{
|
||
// uni.showToast({
|
||
// title: res.msg,
|
||
// icon: 'none',
|
||
// duration: 2000
|
||
// })
|
||
// }
|
||
// })
|
||
},
|
||
},
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.anniu {
|
||
width: 750rpx;
|
||
height: 174rpx;
|
||
background: #ffffff;
|
||
box-shadow: 0rpx 8rpx 20rpx 0rpx rgba(0, 0, 0, 0.3);
|
||
border-radius: 0rpx 0rpx 0rpx 0rpx;
|
||
line-height: 174rpx;
|
||
text-align: center;
|
||
position: fixed;
|
||
left: 0;
|
||
bottom: 0;
|
||
|
||
text {
|
||
display: inline-block;
|
||
width: 682rpx;
|
||
height: 84rpx;
|
||
background: #f15a04;
|
||
border-radius: 42rpx 42rpx 42rpx 42rpx;
|
||
text-align: center;
|
||
line-height: 84rpx;
|
||
font-weight: 600;
|
||
font-size: 36rpx;
|
||
color: #ffffff;
|
||
}
|
||
}
|
||
|
||
.refresh {
|
||
width: 250rpx;
|
||
height: 174rpx;
|
||
|
||
line-height: 174rpx;
|
||
text-align: center;
|
||
padding: 0 250rpx;
|
||
|
||
text {
|
||
display: inline-block;
|
||
width: 250rpx;
|
||
height: 84rpx;
|
||
background: #f15a04;
|
||
border-radius: 42rpx 42rpx 42rpx 42rpx;
|
||
text-align: center;
|
||
line-height: 84rpx;
|
||
font-weight: 600;
|
||
font-size: 36rpx;
|
||
color: #ffffff;
|
||
}
|
||
}
|
||
|
||
.sfxx {
|
||
width: 676rpx;
|
||
height: 480rpx;
|
||
background: #ffffff;
|
||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||
margin: auto;
|
||
margin-top: 460rpx;
|
||
border-radius: 30rpx;
|
||
|
||
.name {
|
||
width: 624rpx;
|
||
height: 92rpx;
|
||
margin: auto;
|
||
background: #efefef;
|
||
border-radius: 46rpx 46rpx 46rpx 46rpx;
|
||
margin-top: 46rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 32rpx;
|
||
color: #3d3d3d;
|
||
padding-left: 40rpx;
|
||
box-sizing: border-box;
|
||
justify-content: space-between;
|
||
|
||
input {
|
||
width: 430rpx;
|
||
padding-right: 20rpx;
|
||
box-sizing: border-box;
|
||
}
|
||
}
|
||
|
||
.tit {
|
||
width: 676rpx;
|
||
height: 118rpx;
|
||
background: #efefef;
|
||
font-weight: 600;
|
||
font-size: 36rpx;
|
||
color: #3d3d3d;
|
||
line-height: 118rpx;
|
||
padding-left: 38rpx;
|
||
box-sizing: border-box;
|
||
border-radius: 30rpx 30rpx 0 0;
|
||
}
|
||
}
|
||
|
||
.bj {
|
||
width: 750rpx;
|
||
height: 696rpx;
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
z-index: -1;
|
||
}
|
||
</style>
|