checkName.vue 3.0 KB
<template>
	<view v-if="showCheckName">
		<view class="topLine"></view>
		<view class="phoneWrap">
			<view class="phoneItem">
				<view class="phoneLeft">
					姓名
				</view>
				<view class="phoneCenter">
					<input v-if="userInfo.id_no == ''" type="text" v-model="param.name" placeholder="请输入完整姓名" placeholder-class="centerInp"/>
					<text v-if="userInfo.id_no != ''">{{userInfo.name | hideStar}}</text>
				</view>
			</view>
			<view class="phoneItem">
				<view class="phoneLeft">
					身份证号
				</view>
				<view class="phoneCenter">
					<input v-if="userInfo.id_no == ''" type="text" v-model="param.id_no" placeholder="请输入身份证号" placeholder-class="centerInp"/>
					<text v-if="userInfo.id_no != ''">{{userInfo.id_no | hideStar}}</text>
				</view>
			</view>
		</view>
		<view class="bottomBtnWrap" v-if="userInfo.id_no == ''">
			<view class="bottomBtn" @click="checkName">
				完成认证
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				showCheckName:false,
				userInfo:{},
				param:{
					name:'',
					id_no:''
				}
			}
		},
		filters:{
			hideStar(data){
				if(data.length == 18){
					return data.substring(0,4)+'****'+data.substring(data.length-4,data.length)
				}else{
					return '*'+data.substring(1,data.length)
				}
			}
		},
		onLoad() {
			//获取用户信息
			this.$request('/user/info').then((res)=>{
				this.userInfo = res.data
				this.showCheckName = true
			})
		},
		methods:{
			checkName(){
				if(this.param.name == ''){
					uni.showToast({
						title:'请输入完整姓名',
						icon:'none'
					})
					return
				}
				if(this.param.id_no == ''){
					uni.showToast({
						title:'请输入身份证号',
						icon:'none'
					})
					return
				}
				this.$request('/user/certification',this.param).then((res)=>{
					console.log('实名认证',res)
					if(res.code == 1){
						uni.navigateBack({
							delta:1
						})
						setTimeout(()=>{
							uni.showToast({
								title:'认证成功'
							})
						},500)
					}else{
						uni.showToast({
							title:res.msg,
							icon:'none'
						})
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	page{background: #f8f8f9;}
	.topLine{height: 2rpx;background: rgba(25,24,51,0.06);}
	.phoneWrap{
		padding: 0 32rpx;
		font-size: 28rpx;
		background: #fff;
		.phoneItem{
			display: flex;
			justify-content: space-between;
			align-items: center;
			height: 88rpx;
			.phoneLeft{
				width: 180rpx;
			}
			.phoneCenter{
				flex: 1;
				display: flex;
				justify-content: flex-end;
				input{
					text-align: end;
				}
				.centerInp{
					font-size: 28rpx;
				}
			}
		}
	}
	.bottomBtnWrap{
		width: 100%;
		height: 138rpx;
		background: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		box-shadow: 0rpx -14rpx 44rpx 0rpx rgba(85,123,218,0.08);
		.bottomBtn{
			width: 200rpx;
			height:75rpx;
			background: #35655f;
			text-align: center;
			line-height: 75rpx;
			color: #fff;
			border-radius: 50rpx;
			font-size: 28rpx;
		}
	}
</style>