<template>
	<view>
		<!-- 公共组件-每个页面必须引入 -->
		<public-module></public-module>
		<view class="d-flex a-center j-center m-5">
			<image src="/static/bigLogo.png" mode="widthFix" style="width: 180rpx;height: 180rpx;"></image>
		</view>
		<view class="status">认证状态：<text class="main-text-color">{{statusstage}}</text></view>
		<view class="status" v-if="userStatus=='2'">您的认证信息正在审核中，请耐心等待</view>
		<view class="status" v-if="(userStatus=='3')|| (userStatus=='4')">{{(userStatus=='4')?'退回原因':'驳回原因'}}:</view>
		<view class="remark" v-if="(userStatus=='3')|| (userStatus=='4')">
			{{remark}}
		</view>
		
		<template v-if="userStatus=='4'">
			<view class="d-flex flex-column">
				<button class="d-flex a-center j-center main-bg-color mt-4 mx-3" type="primary" @tap="toNext">重新认证</button>
				<button class="d-flex a-center j-center main-bf-hover-color mt-4 mx-3" type="primary" @tap="toLogin">下次再说</button>
			</view>
		</template>
	</view>
</template>

<script>
	import {mapState} from "vuex"
	export default {
		data() {
			return {
				remark:"",
				statusstage:""
			}
		},
		onLoad() {
			if(this.userStatus == '2'){
				this.statusstage="正在审核中"; 
			}else if(this.userStatus == '3'){
				this.statusstage="审核驳回";
			}else if(this.userStatus == '4'){
				this.statusstage="退回修改";
			}
			this.getRemark();
		},
		computed:{
			...mapState(['userStatus',"userInfo","userCheckInfo"])
		},
		methods: {
			getRemark(){
				this.remark = this.userCheckInfo.esmUserInternal.remark;
			},
			toNext(){
				uni.navigateTo({
					url:"/pages/user/infoInput"
				})
			},
			toLogin(){
				uni.switchTab({
					url:"/pages/index/index"
				})
			}
			
		}
	}
</script>

<style scoped>
.status{
	font-size: 36rpx;
	font-weight: bold;
	margin-top: 20rpx;
	padding: 0 40rpx;
}
.remark{
	min-height: 160rpx;
	margin-top: 20rpx;
	margin: 10rpx 30rpx;
	padding: 20rpx;
	border: 1px solid #ddd;
}
</style>
