medicine-xcx/pagesC/member/dredge/index.vue

<template>
	<view class="page">
		<view class="hint_info">
			<text>个人实名认证</text>
			<text>请如实填写个人信息</text>
		</view>
		<view class="submit_info">
			<u-form :model="form" ref="uForm">
				<u-form-item label="姓名" :label-style="{'font-size': '32rpx'}" :borderBottom="true">
					<u-input placeholder="请输入姓名" v-model="form.name" />
				</u-form-item>
				<u-form-item label-width="140" label="身份证号" :label-style="{'font-size': '32rpx'}">
					<u-input placeholder="请输入身份证号" v-model="form.idCard" maxlength="18" />
				</u-form-item>
			</u-form>
		</view>
	<!-- 	<text class="identity_title">身份证照片</text>
		<view class="identity_pic_upload_box">
			<view class="pic_box">
				<u-upload 
				 ref="uUpload"
				 :header="headerInfo" 
				 :action="href"
				 :custom-btn="true" 
				 image-mode="none"
				 @on-success="onSuccess"
				 max-count="1"
				width="281" height="192">
					<view slot="addBtn" class="slot-btn" hover-class="slot-btn__hover" hover-stay-time="150">
						<image :src="img_url+'member/obverse.png'" mode=""></image>
					</view>
				</u-upload>
				<text>身份证头像面</text>
			</view>
			<view class="pic_box">
				<u-upload :custom-btn="true" :action="href" :header="headerInfo"  max-count="1" width="278" height="187" @on-success="onSuccess2">
					<view slot="addBtn" class="slot-btn" hover-class="slot-btn__hover" hover-stay-time="150">
						<image :src="img_url+'member/reverse.png'" mode=""></image>
					</view>
				</u-upload>
				<text>身份证国徽面</text>
			</view>
		</view>
		 -->
		<button @click="toCardAdd" class="btn_success">提交认证</button>
		
	</view>
</template>

<script>
	import config_img from "@/utils/js/config.js"
	export default {
		data() {
			return {
				img_url: config_img.img_url,
				headerInfo: {
					"content-type": "application/x-www-form-urlencoded",
					"X-Access-Token": ''
				},
				href: "",  //图片上传地址
				form: {
					name: '',
					idCard: '',
					// idCardPhoto: '',
					// isCardImage: '',
					uid: ''
				},
				userInfo: {},
				id: '',
				type:''
			}
		},
		onLoad(options) {
			this.id = options.id
			this.type = options.type
			this.href = this.$upload_img;
			console.log(this.href);
			this.headerInfo["X-Access-Token"] = uni.getStorageSync("__user_token");
			this.form.uid= uni.getStorageSync("__user_info").uid;
		},
	
		methods: {
			// onSuccess(res) {				
			// 	this.form.idCardPhoto = res.result;
			// },
			// onSuccess2(res) {
			// 	this.form.isCardImage = res.result;
			// },
			toCardAdd() {
				// 实名认证
				const params = this.form
				uni.showLoading();
				this.$api('getCardAdd',params).then(res => {
					let { code, result, message} = res;
					uni.hideLoading();
					if( code == 200) {
						// console.log(result);
						// this.$Toast(message);
						uni.navigateTo({
							url: `./../authentication_success/index?id=${this.id}&type=${this.type}`
						})
					}else {
						this.$Toast(message);
					}
				}).catch( err => {
					uni.hideLoading();
					this.$Toast(err.message);
				})
				
			},
		}
	}
</script>

<style lang="scss" scoped>
	.page {
		background-color: #fff;
	}

	.hint_info {
		width: 100%;
		height: 161rpx;
		background-color: #01AEEA;
		display: flex;
		flex-direction: column;
		padding-left: 29rpx;

		text {
			color: #fff;

			&:first-child {
				padding-top: 40rpx;
				padding-bottom: 14rpx;
				font-size: 28rpx;
				font-weight: bold;
			}

			&:last-child {
				font-size: 26rpx;
			}
		}
	}

	.submit_info {
		width: 687rpx;
		margin: 0 auto;
		
		/deep/ .u-form-item {
			border-bottom: 1px solid #707070;
			.u-input__input{
				color: #929292;
			}
		}
	}

	.identity_title {
		display: inline-block;
		margin-top: 61rpx;
		margin-left: 33rpx;
		margin-bottom: 56rpx;
		font-size: 28rpx;
		font-weight: bold;
	}

	.identity_pic_upload_box {
		margin: 0 33rpx;
		display: flex;
		justify-content: space-between;

		.pic_box {
			display: flex;
			flex-direction: column;
			align-items: center;

			/deep/.u-list-item {
				margin: 0;
			}

			image {
				width: 281rpx;
				height: 192rpx;
			}

			text {
				margin-top: 46rpx;
				font-size: 28rpx;
				color: #929292;
			}
		}
		
	}
	.btn_success{
		margin:  0 auto;
		margin-top: 115rpx;
		margin-bottom: 168rpx;
		width: 668rpx;
		height: 88rpx;
		background-color: #01AEEA;
		border-radius: 38rpx;
		font-size: 28rpx;
		color: #fff;
		text-align: center;
		line-height: 88rpx;
	}
</style>