|
@ -1,176 +1,222 @@ |
|
|
<template> |
|
|
<template> |
|
|
<view class="certified-individual"> |
|
|
|
|
|
<!--顶部导航栏--> |
|
|
|
|
|
<navbar leftClick @leftClick="$utils.navigateBack" title="上传身份证信息"/> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!--内容区域--> |
|
|
|
|
|
<view class="content"> |
|
|
|
|
|
<view class="title"> |
|
|
|
|
|
<view class="image"> |
|
|
|
|
|
<image src="../static/auth/1.svg" style="width: 100%;height: 100%"></image> |
|
|
|
|
|
</view> |
|
|
|
|
|
请确保二代身份证有效,并且头像文字清晰,四角对齐,无反光,无遮挡。 |
|
|
|
|
|
</view> |
|
|
|
|
|
<view class="center"> |
|
|
|
|
|
<view class="avatarFace" @click="uploadImage('imageStraight')"> |
|
|
|
|
|
<image v-if="certifiedIndividual.imageStraight" :src="certifiedIndividual.imageStraight" |
|
|
|
|
|
style="width: 100%;height: 100%"></image> |
|
|
|
|
|
<image v-else src="../static/auth/4.png" style="width: 100%;height: 100%"></image> |
|
|
|
|
|
</view> |
|
|
|
|
|
<view class="reverseSide" @click="uploadImage('imageReverseSide')"> |
|
|
|
|
|
<image v-if="certifiedIndividual.imageReverseSide" :src="certifiedIndividual.imageReverseSide" |
|
|
|
|
|
style="width: 100%;height: 100%"></image> |
|
|
|
|
|
<image v-else src="../static/auth/5.png" style="width: 100%;height: 100%"></image> |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
<!--立即认证按钮--> |
|
|
|
|
|
<view @click="nowAuth" class="bottomBtn"> |
|
|
|
|
|
下一步 |
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
<!--人脸识别服务协议--> |
|
|
|
|
|
<view class="agree"> |
|
|
|
|
|
<uv-checkbox-group v-model="checkboxValue" placement="column" size="35" activeColor="#008000" |
|
|
|
|
|
inactiveColor="#999999"> |
|
|
|
|
|
<uv-checkbox shape='circle' :checked="true" name="apple" :label="labelValue ? labelValue : ''" |
|
|
|
|
|
iconSize="35"> |
|
|
|
|
|
</uv-checkbox> |
|
|
|
|
|
</uv-checkbox-group> |
|
|
|
|
|
我已阅读并同意签署 <span style="color:#009dff">《服务协议》</span> |
|
|
|
|
|
<span style="color:#009dff">《隐私政策》</span> |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
<view class="certified-individual"> |
|
|
|
|
|
<!--顶部导航栏--> |
|
|
|
|
|
<navbar leftClick @leftClick="$utils.navigateBack" title="上传身份证信息" /> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!--内容区域--> |
|
|
|
|
|
<view class="content"> |
|
|
|
|
|
<view class="title"> |
|
|
|
|
|
<view class="image"> |
|
|
|
|
|
<image src="../static/auth/1.svg" style="width: 100%;height: 100%"></image> |
|
|
|
|
|
</view> |
|
|
|
|
|
请确保二代身份证有效,并且头像文字清晰,四角对齐,无反光,无遮挡。 |
|
|
|
|
|
</view> |
|
|
|
|
|
<view class="center"> |
|
|
|
|
|
<view class="avatarFace" @click="uploadImage('imageStraight')"> |
|
|
|
|
|
<image v-if="certifiedIndividual.imageStraight" :src="certifiedIndividual.imageStraight" |
|
|
|
|
|
style="width: 100%;height: 100%"></image> |
|
|
|
|
|
<image v-else src="../static/auth/4.png" style="width: 100%;height: 100%"></image> |
|
|
|
|
|
</view> |
|
|
|
|
|
<view class="reverseSide" @click="uploadImage('imageReverseSide')"> |
|
|
|
|
|
<image v-if="certifiedIndividual.imageReverseSide" :src="certifiedIndividual.imageReverseSide" |
|
|
|
|
|
style="width: 100%;height: 100%"></image> |
|
|
|
|
|
<image v-else src="../static/auth/5.png" style="width: 100%;height: 100%"></image> |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
<!--立即认证按钮--> |
|
|
|
|
|
<view @click="nowAuth" class="bottomBtn"> |
|
|
|
|
|
下一步 |
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
<!--人脸识别服务协议--> |
|
|
|
|
|
<!-- <view class="agree"> |
|
|
|
|
|
<uv-checkbox-group v-model="checkboxValue" placement="column" size="35" activeColor="#008000" |
|
|
|
|
|
inactiveColor="#999999"> |
|
|
|
|
|
<uv-checkbox shape='circle' :checked="true" name="apple" :label="labelValue ? labelValue : ''" |
|
|
|
|
|
iconSize="35"> |
|
|
|
|
|
</uv-checkbox> |
|
|
|
|
|
</uv-checkbox-group> |
|
|
|
|
|
我已阅读并同意签署 <text @click="$refs.popup.open('getPrivacyPolicy')">服务协议与隐私条款</text> |
|
|
|
|
|
<text @click="$refs.popup.open('getUserAgreement')">个人信息保护指引</text> |
|
|
|
|
|
</view> --> |
|
|
|
|
|
|
|
|
|
|
|
<view class="config"> |
|
|
|
|
|
<uv-checkbox-group |
|
|
|
|
|
v-model="checkboxValue" |
|
|
|
|
|
shape="circle"> |
|
|
|
|
|
<view class="content"> |
|
|
|
|
|
<view |
|
|
|
|
|
style="display: flex;"> |
|
|
|
|
|
|
|
|
|
|
|
<uv-checkbox |
|
|
|
|
|
size="30rpx" |
|
|
|
|
|
:name="1" |
|
|
|
|
|
></uv-checkbox> |
|
|
|
|
|
阅读并同意我们的<text @click="openConfigDetail('getPrivacyPolicy')">“服务协议与隐私条款”</text> |
|
|
|
|
|
</view> |
|
|
|
|
|
<view class=""> |
|
|
|
|
|
以及<text @click="openConfigDetail('getUserAgreement')">个人信息保护指引</text> |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
</uv-checkbox-group> |
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<configPopup ref="popup"></configPopup> |
|
|
|
|
|
</view> |
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
<script> |
|
|
<script> |
|
|
import {mapState} from 'vuex' |
|
|
|
|
|
|
|
|
|
|
|
export default { |
|
|
|
|
|
onLoad: function (options) { |
|
|
|
|
|
this.type = options.type; |
|
|
|
|
|
}, |
|
|
|
|
|
computed: { |
|
|
|
|
|
...mapState(['certifiedIndividual']), |
|
|
|
|
|
}, |
|
|
|
|
|
data() { |
|
|
|
|
|
return { |
|
|
|
|
|
checkboxValue: [], |
|
|
|
|
|
labelValue: '', // 如果labelValue为空,则不会显示任何内容 |
|
|
|
|
|
type: '', |
|
|
|
|
|
}; |
|
|
|
|
|
}, |
|
|
|
|
|
methods: { |
|
|
|
|
|
uploadImage(key) { |
|
|
|
|
|
this.$Oss.ossUploadImage({ |
|
|
|
|
|
success: url => { |
|
|
|
|
|
console.log(url,"url"); |
|
|
|
|
|
this.certifiedIndividual[key] = url |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
}, |
|
|
|
|
|
nowAuth() { |
|
|
|
|
|
|
|
|
|
|
|
if(!this.certifiedIndividual.imageReverseSide){ |
|
|
|
|
|
return uni.showToast({ |
|
|
|
|
|
title: '请上传身份证背面', |
|
|
|
|
|
icon: 'none' |
|
|
|
|
|
}) |
|
|
|
|
|
} |
|
|
|
|
|
if(!this.certifiedIndividual.imageStraight){ |
|
|
|
|
|
return uni.showToast({ |
|
|
|
|
|
title: '请上传身份证正面', |
|
|
|
|
|
icon: 'none' |
|
|
|
|
|
}) |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// uni.redirectTo({ |
|
|
|
|
|
// url: '/pages_mine/mine/authPerson' |
|
|
|
|
|
// }) |
|
|
|
|
|
|
|
|
|
|
|
// 根据type跳转到不同页面(个人认证/企业认证) |
|
|
|
|
|
if (this.type == "person") { |
|
|
|
|
|
uni.redirectTo({ |
|
|
|
|
|
url: '/pages_mine/mine/authPerson' |
|
|
|
|
|
}) |
|
|
|
|
|
// this.$utils.navigateTo('/mine/authPerson') |
|
|
|
|
|
} else if (this.type == "firm") { |
|
|
|
|
|
uni.redirectTo({ |
|
|
|
|
|
url: '/pages_mine/mine/authFirm' |
|
|
|
|
|
}) |
|
|
|
|
|
// this.$utils.navigateTo('/mine/authFirm') |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
import { |
|
|
|
|
|
mapState |
|
|
|
|
|
} from 'vuex' |
|
|
|
|
|
|
|
|
|
|
|
export default { |
|
|
|
|
|
onLoad: function(options) { |
|
|
|
|
|
this.type = options.type; |
|
|
|
|
|
}, |
|
|
|
|
|
computed: { |
|
|
|
|
|
...mapState(['certifiedIndividual']), |
|
|
|
|
|
}, |
|
|
|
|
|
data() { |
|
|
|
|
|
return { |
|
|
|
|
|
checkboxValue: [], |
|
|
|
|
|
labelValue: '', // 如果labelValue为空,则不会显示任何内容 |
|
|
|
|
|
type: '', |
|
|
|
|
|
}; |
|
|
|
|
|
}, |
|
|
|
|
|
methods: { |
|
|
|
|
|
uploadImage(key) { |
|
|
|
|
|
this.$Oss.ossUploadImage({ |
|
|
|
|
|
success: url => { |
|
|
|
|
|
console.log(url, "url"); |
|
|
|
|
|
this.certifiedIndividual[key] = url |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
}, |
|
|
|
|
|
nowAuth() { |
|
|
|
|
|
|
|
|
|
|
|
if(!this.checkboxValue.length){ |
|
|
|
|
|
return uni.showToast({ |
|
|
|
|
|
title: '请先同意隐私协议', |
|
|
|
|
|
icon:'none' |
|
|
|
|
|
}) |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
if (!this.certifiedIndividual.imageReverseSide) { |
|
|
|
|
|
return uni.showToast({ |
|
|
|
|
|
title: '请上传身份证背面', |
|
|
|
|
|
icon: 'none' |
|
|
|
|
|
}) |
|
|
|
|
|
} |
|
|
|
|
|
if (!this.certifiedIndividual.imageStraight) { |
|
|
|
|
|
return uni.showToast({ |
|
|
|
|
|
title: '请上传身份证正面', |
|
|
|
|
|
icon: 'none' |
|
|
|
|
|
}) |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// uni.redirectTo({ |
|
|
|
|
|
// url: '/pages_mine/mine/authPerson' |
|
|
|
|
|
// }) |
|
|
|
|
|
|
|
|
|
|
|
// 根据type跳转到不同页面(个人认证/企业认证) |
|
|
|
|
|
if (this.type == "person") { |
|
|
|
|
|
uni.redirectTo({ |
|
|
|
|
|
url: '/pages_mine/mine/authPerson' |
|
|
|
|
|
}) |
|
|
|
|
|
// this.$utils.navigateTo('/mine/authPerson') |
|
|
|
|
|
} else if (this.type == "firm") { |
|
|
|
|
|
uni.redirectTo({ |
|
|
|
|
|
url: '/pages_mine/mine/authFirm' |
|
|
|
|
|
}) |
|
|
|
|
|
// this.$utils.navigateTo('/mine/authFirm') |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
</script> |
|
|
</script> |
|
|
|
|
|
|
|
|
<style lang="scss" scoped> |
|
|
<style lang="scss" scoped> |
|
|
.certified-individual { |
|
|
|
|
|
.content { |
|
|
|
|
|
padding: 40rpx; |
|
|
|
|
|
|
|
|
|
|
|
.title { |
|
|
|
|
|
display: flex; |
|
|
|
|
|
font-size: 30rpx; |
|
|
|
|
|
|
|
|
|
|
|
.image { |
|
|
|
|
|
display: flex; |
|
|
|
|
|
align-items: flex-start; |
|
|
|
|
|
width: 10vw; |
|
|
|
|
|
height: 3vh; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.center { |
|
|
|
|
|
display: flex; |
|
|
|
|
|
flex-direction: column; |
|
|
|
|
|
justify-content: center; |
|
|
|
|
|
align-items: center; |
|
|
|
|
|
gap: 150rpx; |
|
|
|
|
|
margin-top: 15%; |
|
|
|
|
|
|
|
|
|
|
|
.avatarFace { |
|
|
|
|
|
width: 80vw; |
|
|
|
|
|
height: 20vh; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.reverseSide { |
|
|
|
|
|
width: 80vw; |
|
|
|
|
|
height: 20vh; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.bottomBtn { |
|
|
|
|
|
position: fixed; |
|
|
|
|
|
bottom: 15%; |
|
|
|
|
|
left: 25%; |
|
|
|
|
|
width: 50%; |
|
|
|
|
|
height: 60rpx; |
|
|
|
|
|
line-height: 60rpx; |
|
|
|
|
|
font-size: 30rpx; |
|
|
|
|
|
color: #FFFFFF; |
|
|
|
|
|
text-align: center; |
|
|
|
|
|
|
|
|
|
|
|
//border: 1px solid red; |
|
|
|
|
|
background: $uni-linear-gradient-color; |
|
|
|
|
|
-webkit-background-clip: text; |
|
|
|
|
|
/*将设置的背景颜色限制在文字中*/ |
|
|
|
|
|
-webkit-text-fill-color: transparent; |
|
|
|
|
|
/*给文字设置成透明*/ |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.agree { |
|
|
|
|
|
position: fixed; |
|
|
|
|
|
bottom: 7%; |
|
|
|
|
|
left: 15%; |
|
|
|
|
|
display: flex; |
|
|
|
|
|
font-size: 26rpx; |
|
|
|
|
|
justify-content: center; |
|
|
|
|
|
//border: 1px solid red; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
.certified-individual { |
|
|
|
|
|
.content { |
|
|
|
|
|
padding: 40rpx; |
|
|
|
|
|
|
|
|
|
|
|
.title { |
|
|
|
|
|
display: flex; |
|
|
|
|
|
font-size: 30rpx; |
|
|
|
|
|
|
|
|
|
|
|
.image { |
|
|
|
|
|
display: flex; |
|
|
|
|
|
align-items: flex-start; |
|
|
|
|
|
width: 10vw; |
|
|
|
|
|
height: 3vh; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.center { |
|
|
|
|
|
display: flex; |
|
|
|
|
|
flex-direction: column; |
|
|
|
|
|
justify-content: center; |
|
|
|
|
|
align-items: center; |
|
|
|
|
|
gap: 150rpx; |
|
|
|
|
|
margin-top: 15%; |
|
|
|
|
|
|
|
|
|
|
|
.avatarFace { |
|
|
|
|
|
width: 80vw; |
|
|
|
|
|
height: 20vh; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.reverseSide { |
|
|
|
|
|
width: 80vw; |
|
|
|
|
|
height: 20vh; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.bottomBtn { |
|
|
|
|
|
position: fixed; |
|
|
|
|
|
bottom: 15%; |
|
|
|
|
|
left: 25%; |
|
|
|
|
|
width: 50%; |
|
|
|
|
|
height: 60rpx; |
|
|
|
|
|
line-height: 60rpx; |
|
|
|
|
|
font-size: 30rpx; |
|
|
|
|
|
color: #FFFFFF; |
|
|
|
|
|
text-align: center; |
|
|
|
|
|
|
|
|
|
|
|
//border: 1px solid red; |
|
|
|
|
|
background: $uni-linear-gradient-color; |
|
|
|
|
|
-webkit-background-clip: text; |
|
|
|
|
|
/*将设置的背景颜色限制在文字中*/ |
|
|
|
|
|
-webkit-text-fill-color: transparent; |
|
|
|
|
|
/*给文字设置成透明*/ |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// .agree { |
|
|
|
|
|
// position: fixed; |
|
|
|
|
|
// bottom: 7%; |
|
|
|
|
|
// left: 15%; |
|
|
|
|
|
// display: flex; |
|
|
|
|
|
// font-size: 26rpx; |
|
|
|
|
|
// justify-content: center; |
|
|
|
|
|
// //border: 1px solid red; |
|
|
|
|
|
// } |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.config{ |
|
|
|
|
|
position: fixed; |
|
|
|
|
|
bottom: 20rpx; |
|
|
|
|
|
margin: 0 auto; |
|
|
|
|
|
font-size: 28rpx; |
|
|
|
|
|
text-align: center; |
|
|
|
|
|
line-height: 50rpx; |
|
|
|
|
|
text{ |
|
|
|
|
|
color: #3c69f1; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
</style> |
|
|
</style> |