Files
dvcp_v2_wechat_app/src/mods/extra/AppAuth/AppAuth.vue
2022-06-29 18:15:53 +08:00

169 lines
3.9 KiB
Vue

<template>
<div class="wrapper">
<div class="top">
<img src="https://cdn.cunwuyun.cn/AppAuth/security.png" alt="">
<span class="toast">请验证你的个人信息</span>
</div>
<div class="form">
<u-input placeholder="请输入姓名" trim placeholder-style="color:#ccc;font-size:17px"
:custom-style="{height:'72px',borderBottom:'1px solid #ddd'}" v-model="name"/>
<u-input placeholder="请输入身份证号码" trim placeholder-style="color:#ccc;font-size:17px"
:custom-style="{height:'72px'}" v-model="idNumber" maxlength="18"/>
</div>
<div class="btn" @click="confirm()">提交</div>
<!-- <div class="promise">以上信息将为你严格保密</div> -->
<div class="bottom-text">
<u-checkbox v-model="isChecked"></u-checkbox>
<span @click="isChecked=!isChecked">阅读并同意</span>
<span class="deal" @click.stop="toAgreement()">用户服务及隐私协议</span>
</div>
</div>
</template>
<script>
import {mapState} from 'vuex';
export default {
name: "AppAuth",
appName: "实名认证",
computed: {
...mapState(['user']),
},
data() {
return {
name: '',
idNumber: '',
isChecked: false,
};
},
onLoad() {
let {status} = this.user
if (status == 2) {
uni.redirectTo({url: "./authInfo"})
} else if (status == 0) {
//停留此页
} else {
uni.redirectTo({url: "./authSuccess"})
}
},
methods: {
toAgreement() {
uni.navigateTo({url: "./agreement"})
},
confirm() {
let {name, idNumber} = this
if (!name) {
return this.$u.toast('请填写姓名')
}
if (!idNumber) {
return this.$u.toast('请填写身份证号码')
}
if (!this.$idCardNoUtil.checkIdCardNo(idNumber)) {
return this.$u.toast('请输入正确的身份证号码')
}
if(!this.isChecked) {
return this.$u.toast('请勾选用户服务及隐私协议')
}
this.$instance.post(`/app/appwechatuser/idNumberAttestation`, {
idNumber, name
}).then(res => {
if (res.code == 0) {
if (res.data == 2 || res.data == 0) {
this.$store.dispatch('getUserInfo')
uni.redirectTo({
url: `./authSuccess?status=${res.data}`, success: () => {
if (res.data == 0) {
uni.setStorageSync("authForm", {idNumber, name})
}
}
})
} else {
uni.redirectTo({url: "./authSuccess"})
}
} else {
this.$u.toast(res.msg);
setTimeout(() => {
uni.navigateBack();
}, 500)
}
}).catch(err => {
this.$u.toast(err)
})
},
}
};
</script>
<style lang="scss" scope>
@import "~dvcp-wui/common";
.top {
height: 480px;
background: #4181FF;
display: flex;
flex-direction: column;
align-items: center;
padding-top: 48px;
& > img {
width: 160px;
height: 160px;
}
.toast {
margin-top: 32px;
font-size: 44px;
font-weight: 600;
color: #D9E5FF;
line-height: 60px;
}
}
.form {
width: 686px;
background: #FFFFFF;
margin: -132px auto 0;
box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.02);
border-radius: 16px;
box-sizing: border-box;
padding: 0 48px;
.input {
width: 590px;
height: 144px;
border-bottom: 2px solid #DDDDDD;
}
}
.btn {
width: 686px;
height: 88px;
margin: 80px auto 0;
background: #4181FF;
border-radius: 16px;
display: flex;
align-items: center;
justify-content: center;
font-size: 34px;
font-weight: 500;
color: #FFFFFF;
}
.bottom-text {
padding: 0 48px;
text-align: center;
margin-top: 30px;
.deal {
color: #4181ff;
}
}
.promise {
font-size: 28px;
font-weight: 400;
color: #999999;
line-height: 40px;
text-align: center;
margin-top: 48px;
}
</style>