<template>
	<view class="container">
		<text class="iconfont icon-youjiantou zuojiantou" @click="goBack()" style="left: 20rpx;"
		:style="{top:queryType==1? '16rpx':'-10rpx'}"></text>
		<view class="others" v-if="queryType == 2">
			<text>身份信息</text>
			<view class="others_item">
				<text>姓名：</text><input class="uni-input" type="text" placeholder="请输入姓名" v-model="userName"/>
			</view>
			<view class="others_item">
				<text>认证编号：</text><input class="uni-input" type="text" placeholder="请输证书编号" v-model="authenticationCode"/>
			</view>
		</view>
		<view class="certifyListContent" v-if="userCertificates?.length>0">
			<view class="certifyInfoItem" v-for="item in userCertificates" :key="item?.cerNo">
				<h4>{{item?.cerName}}</h4>
				<view class="certifyImgBox">
					<image :src="item?.cerUrl" mode="widthFix"></image>
					<view>认证编号：{{item?.authenticationCode}}</view>
					<view>有效期至：{{dateFormat(item?.endDate)}}</view>
				</view>
			</view>
		</view>
		<!-- 没有证书 -->
		<view class="noSign" v-if="userCertificates?.length==0">
			<h4>暂没有取得证书！</h4>
		</view>
	</view>
</template>

<script>
	import api from '../../api/api';
	import common from '../../common/common';
	import dataHandling from "@/util/dataHandling";
	export default{
		data(){
			return {
				userName:null,
				authenticationCode:null,
				queryType:null,
				userCertificates:[]
			}
		},
		components:{},
		onLoad(options){
			this.userName = options.userName;
			this.authenticationCode = options.authenticationCode;
			this.queryType =  options.queryType;
			this.getResult();
		},
		methods:{
			dateFormat(val){
				return dataHandling.dateFormat(val,'yyyy-MM-dd')
			},
			goBack(){
				uni.navigateBack({  
					delta: 1  
				});
			},
			getResult(){
				const  param = {
					queryType:(this.queryType=='null' || this.queryType=='undefined')?undefined:this.queryType,
					userId:uni.getStorageSync('cffp_userId'),
					userName:(this.userName == 'null' || this.userName == 'undefined')?undefined:this.userName,
					authenticationCode:(this.authenticationCode == 'null' || this.authenticationCode == 'undefined') ?undefined:this.authenticationCode
				}
				api.userCertificateResult(param).then((res)=>{
					if(res['success']){
						this.userCertificates = res['data']['userCertificates'];
					}else{
						uni.showToast({
							title: res['message'],
							duration: 2000,
							icon: 'none'
						})
						return;
					}
				});
			}
			
		}
	}
</script>

<style lang="scss">
	.others{
		padding:30rpx;
		margin-top: 30rpx;
		.others_item{
			display: flex;	
			margin-bottom: 20rpx;
			border-bottom: 2rpx #CECECE solid;
			height: 80rpx;
			align-items: center;
			.uni-input{
				height: 80rpx;
			}
		}
	}
	.noSign{
		text-align: center;
		margin-top: 10%;
	}
	.certifyListContent{
		.certifyInfoItem{
			background-color: #fff;
			margin-bottom: 10rpx;
			padding: 20rpx 0;
			width: 100%;
			display: flex;
			flex-direction: column;
			align-items: center;
			.certifyImgBox{
				text-align: center;
			}
			image{
				max-width: 60%;
				height: auto;
			}
		}
	}
	
</style>