<template>
	<view class="orgvzone">
		<!-- 机构认证 -->
		<!-- 第一步 选择需要认证的类型 -->
		<view class="vfbox" v-if="step==1">
			<view class="vftit">机构认证</view>
			<view class="vfitem" :class="vfindex==1?'selected':''" @click="vfselitem(1)">
				<view class="vfi-tit">公共文化机构</view>
				<view class="vfi-desc">
					<view>公共文化是相对经营文化而言，是为满足社会的共同需要而形成的文化形态，强调的是以社会全体公众为服务对象的公共行政职能。</view>
					<view class="">如：博物馆、美术馆、图书馆、文化馆及街道、社区各级文化活动站（室）</view>
				</view>
			</view>
			<view class="vfitem" :class="vfindex==2?'selected':''" @click="vfselitem(2)">
				<view class="vfi-tit">文化生产机构</view>
				<view class="vfi-desc">
					<view>文化生产机构是指从事文化工作，具有法人资格，以创作生产某种业态文化数字内容为目标的文化机构；比如是出版社、影视公司、演出公司、设计公司等</view>
				</view>
			</view>
			<view class="vfitem" :class="vfindex==3?'selected':''" @click="vfselitem(3)">
				<view class="vfi-tit">高校科研机构</view>
				<view class="vfi-desc">
					<view>高校科研机构是指经过学校上级主管部门或者学校正式下文批准成立的，一般分为实体性科研机构和非实体性科研机构</view>
					<view>如：实验室、研究室、研究所、研究中心、研究院、研究基地等</view>
				</view>
			</view>
			<view class="vfitem" :class="vfindex==4?'selected':''" @click="vfselitem(4)">
				<view class="vfi-tit">其它</view>
				<view class="vfi-desc">
					<view>其他 - 通常指经营类企业。</view>
				</view>
			</view>
			<!-- 立即认证 -->
			<view class="vfbtn" v-if="vfindex>0">
				<button @click="gotostep(2)">立即认证</button>
			</view>
		
		</view>
		
		<!-- step 2 -->
		<view class="vfbox" v-if="step==2">
			<view class="form-item">
				<input class="form-item--input" v-model="Organizationcode" maxlength="18" placeholder="统一社会信用代码" @change="chkinput()"/>
			</view>
			<view class="vfbtn">
				<button>下一步</button>
			</view>
		</view>
		<!-- step 3 -->
	</view>
</template>

<script>

	export default {
		data() {
			return {
				// 认证步骤
				step:1,
				// 当前标签索引
				curvf: 0,
				// 需要认证的类型
				vfindex:0,
				//统一社会组织代码
				Organizationcode:"",
			}
		},
		methods: {
			// 选择
			vfselitem(item){
				this.vfindex = item
				//this.$toast("your choose is:"+item)
			},
			//
			gotostep(step){
				this.step = step
			},
			//检验统一社会信用代码
			chkinput(){
				const app = this
				let Code = app.Organizationcode
				// 社团统一编码
				const patrn = /^[0-9A-Z]+$/
				if(Code.length!=18 || patrn.test(Code) ==false){
					app.$toast("统一社会信用代码格式不对")
					return false;
				}else{
					let Ancode; //统一社会信用代码的每一个值
					let Ancodevalue; //统一社会信用代码每一个值的权重
					let total = 0;
					const weightedfactors = [1, 3, 9, 27, 19, 26, 16, 17, 20, 29, 25, 13, 8, 24, 10, 30, 28,]; //加权因子
					const str = "0123456789ABCDEFGHJKLMNPQRTUWXY";
					//不用I、O、S、V、Z
					for (let i = 0; i < Code.length - 1; i++) {
					    Ancode = Code.substring(i, i + 1);
					    Ancodevalue = str.indexOf(Ancode);
					    total = total + Ancodevalue * weightedfactors[i];
					    //权重与加权因子相乘之和
					}
					let logiccheckcode = 31 - (total % 31);
					if (logiccheckcode == 31) {
					    logiccheckcode = 0;
					}
					let Str = "0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F,G,H,J,K,L,M,N,P,Q,R,T,U,W,X,Y";
					let Array_Str = Str.split(",");
					logiccheckcode = Array_Str[logiccheckcode];
					
					let checkcode = Code.substring(17, 18);
					if (logiccheckcode != checkcode) {
					    return false;
					} else {
					    console.info("yes");
					}
					return true;
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
.orgvzone{
	background: #fff;
	margin-bottom: 36rpx;
	
	.vfbox{
		width: 90%;
		margin: 0rpx auto;
		padding: 10rpx;
		
		.vftit{
			font-size: 36rpx;
			font-weight: 600;;
		}
		
		.vfitem{
			font-size: 30rpx;
			line-height: 1.8;
			margin: 30rpx auto;
			border:2rpx solid #eee;
			border-radius: 10rpx;
			padding: 16rpx;
			
			.vfi-tit{
				font-size: 34rpx;
				line-height: 80rpx;
				padding-left: 22rpx;
			}
			
			.vfi-desc{
				background-color: #FEFFE8;
				border: 1px solid #CFAF0F;
				padding: 10px 8px;
				color: #444444;
				border-radius: 12rpx;
				text-indent: 36rpx;
			}
			
			&:hover{
				background-color: #487AEE;
				color: #fff;
			}
			
			&.selected{
				background-color: #487AEE;
				color: #fff;
			}
		}
		
		// 按钮
		.vfbtn{
			
			button{
				background: #487AEE;
				color: #fff;
			}
		}
		
		// 输入框元素
		.form-item {
		  display: flex;
		  padding: 18rpx;
		  border-bottom: 1rpx solid #f3f1f2;
		  margin-bottom: 30rpx;
		  height: 96rpx;
		
		  &--input {
		    font-size: 28rpx;
		    letter-spacing: 1rpx;
		    flex: 1;
		    height: 100%;
		  }
		
		  &--parts {
		    min-width: 100rpx;
		    height: 100%;
		  }

		}

	}
	
}
</style>
