<template>
	<view class="content">
		<u-overlay :show="overlayShow"></u-overlay>
		<view class="container">
			<headers :titles="titles"><uni-icons type="arrow-left" color="#fff" size="22px"></uni-icons></headers>
			<view class="box_">
				<view class="title_">
					法人或负责人信息
				</view>
				<view class="box_bs">
					<view class="">证件类型</view>
					<view class="right_size">
						<view class="h_">{{formData.legalPerson.certTypeName||""}}</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">姓名</view>
					<view class="right_size">
						<view class="h_">{{formData.legalPerson.participantName||""}}</view>
					</view>
				</view>



				<view class="box_bs">
					<view class="">身份证号</view>
					<view class="right_size">
						<view class="h_">{{formData.legalPerson.certNo||""}}</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">有效期</view>
					<view class="right_size">
						<view class="h_">{{formData.legalPerson.certEffectDate+'-'+formData.legalPerson.certExaDate}}
						</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">地址</view>
					<view class="right_size">
						<view class="h_">{{formData.legalPerson.address||""}}</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">法人国籍</view>
					<view class="right_size">
						<view class="h_">{{formData.legalPerson.nationLabel||""}}</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">归属地</view>
					<view class="right_size">
						<view class="h_">
							{{(formData.legalPerson.provinceName+formData.legalPerson.cityName+formData.legalPerson.countyName)||""}}
						</view>
					</view>
				</view>



				<view class="box_bs">
					<view class="">法人职业</view>
					<view class="right_size">
						<view class="h_">{{formData.legalPerson.firstCareerName||""}}</view>
						<view class="h_">{{formData.legalPerson.secondCareerName||""}}</view>
						<view class="h_">{{formData.legalPerson.thirdCareerName||""}}</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">法人手机号</view>
					<view class="right_size">
						<view class="h_">{{formData.legalPerson.mobileNo||""}}</view>
					</view>
				</view>
			</view>
			<view class="box_">
				<view class="title_">
					商户信息
				</view>
				<view class="box_bs">
					<view class="">名称</view>
					<view class="right_size">
						<view class="h_">{{formData.merchantName||""}}</view>
					</view>
				</view>


				<view class="box_bs">
					<view class="">住所</view>
					<view class="right_size">
						<view class="h_">{{formData.merAddress||""}}</view>
					</view>
				</view>

				<view class="box_bs">
					<view class="">注册资本</view>
					<view class="right_size">
						<view class="h_">{{formData.corCapital+"万元"+formData.corCapitalUnitName||""}}</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">成立时间</view>
					<view class="right_size">
						<view class="h_">{{formData.establishDate||""}}</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">营业期限</view>
					<view class="right_size">
						<view class="h_">{{formData.corIdEffectDate+'-'+formData.corIdExaDate||""}}</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">经营范围</view>
					<view class="right_size">
						<view class="h_">{{formData.businessScope||""}}</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">营业执照号</view>
					<view class="right_size">
						<view class="h_">{{formData.bno||""}}</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">商户简称</view>
					<view class="right_size">
						<view class="h_">{{formData.abbreviation||""}}</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">商户类型</view>
					<view class="right_size">
						<view class="h_">{{formData.corKindName||""}}</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">商户归属地</view>
					<view class="right_size">
						<view class="h_">
							{{formData.merProvinceNames+formData.merRegionNames+formData.merCountyNames||""}}
						</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">详细地址</view>
					<view class="right_size">
						<view class="h_">
							{{formData.merAddr||""}}
						</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">邮箱</view>
					<view class="right_size">
						<view class="h_">
							{{formData.email||""}}
						</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">行业分类</view>
					<view class="right_size">
						<view class="h_">
							{{formData.merTertiaryBusKindName||""}}
						</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">实缴资本</view>
					<view class="right_size">
						<view class="h_">
							{{formData.paidInCapital+"万元"+formData.paidInCapitalUnitName||""}}
						</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">企业规模</view>
					<view class="right_size">
						<view class="h_">
							{{formData.enterpriseScaleName||""}}
						</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">年营业收入</view>
					<view class="right_size">
						<view class="h_">
							{{formData.annualIncome+"万元"+formData.annualIncomeUnitName||""}}
						</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">签约期限</view>
					<view class="right_size">
						<view class="h_">{{(formData.openAccEffectDate+'-'+formData.openAccExpDate)||""}}</view>
					</view>

				</view>
				<view class="right-box">(期满双方如无异议自动续签一年)</view>
			</view>
			<view class="box_">
				<view class="title_">
					商户费率
				</view>
				<view class="box_bs">
					<view class="">微信费率(%)</view>
					<view class="right_size">
						<view class="h_">{{formData.wxRate||""}}</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">支付宝费率(%)</view>
					<view class="right_size">
						<view class="h_">{{formData.aliRate||""}}</view>
					</view>
				</view>
				<view class="box_bs">
					<view class="">云闪付费率(%)</view>
					<view class="right_size">
						<view class="h_">{{formData.unionPayRate||""}}</view>
					</view>
				</view>
			</view>
			<view class="box_">
				<view class="title_">
					相关责任人信息
				</view>

				<view class="box_" v-if="oneShow">
					<view class="qiuqiu" @click="infoClick(1)"></view>
					<view @click="infoClick(1)">
						<view class="title-bs">
							<view class="" style="margin-left: 15px;font-weight: bold;">
								联系人信息
							</view>
							<view class="dis_" style="width: 100px;justify-content: flex-end;">
								<u-icon name="arrow-down" color="#6c6c6c" size="18"></u-icon>
							</view>
						</view>
					</view>

					<view class="box_bs">
						<view class="">证件类型</view>
						<view class="dis_" style="width: 80%;justify-content: flex-end;">
							<view class="size_">{{this.formData.contacts?this.formData.contacts.certTypeName:""}}</view>

						</view>
					</view>
					<view style="margin: 15px auto;">证件照</view>
					<view class="bs_img">
						<view class="fifty">
							<u-upload :deletable="false" :fileList="fileList1"
								@afterRead="((item)=>{addInfoImg(item, 'concat',1,1)})"
								@delete="((item)=>{deletePic(item, 'concat',1,1)})" name="1" multiple :maxCount="1"
								width="150" height="100">
								<image src="/static/imgs/yhkzm.png" mode="widthFix" style="width: 150px;height: 100px;">
								</image>
							</u-upload>
							<view class="" style="margin-top: 10px;">证件人像面</view>
						</view>
						<view class="fifty">
							<u-upload :deletable="false" :fileList="fileList2"
								@afterRead="((item)=>{addInfoImg(item, 'concat',2,2)})"
								@delete="((item)=>{deletePic(item, 'concat',2,2)})" name="2" multiple :maxCount="1"
								width="150" height="100">
								<image src="/static/imgs/yhkfm.png" mode="widthFix" style="width: 150px;height: 100px;">
								</image>
							</u-upload>
							<view class="" style="margin-top: 10px;">证件国徽面</view>
						</view>
					</view>

					<view class="box_bs">
						<view class="">姓名</view>
						<view class="right_size">
							<view>{{formData.contacts.participantName}}</view>
						</view>
					</view>
					<view class="box_bs">
						<view class="">证件号</view>
						<view class="right_size">
							<view>{{formData.contacts.certNo}}</view>

						</view>
					</view>
					<view class="box_bs">
						<view class="">证件有效期</view>
						<view class="dis_">
							<view class="dis_">

								<view style="color:#000;margin: 0px 5px;">{{formData.contacts.certEffectDate}}
								</view>

							</view>



							<view class="size_" style="margin: 0px 5px;">至</view>
							<view class="dis_">

								<view style="color:#000;margin: 0px 5px;">{{formData.contacts.certExaDate}}
								</view>

							</view>


						</view>
					</view>
					<view class="box_bs">
						<view class="">手机号</view>
						<view class="right_size">
							<view>{{formData.contacts.mobileNo}} </view>

						</view>
					</view>
					<view class="box_bs">
						<view class="">邮箱</view>
						<view class="right_size">
							<view>{{formData.contacts.email}} </view>

						</view>
					</view>
					<view class="box_bs">
						<view class="">归属地</view>
						<view class="dis_">
							<view class="size_">
								{{this.formData.contacts.provinceName+this.formData.contacts.cityName+this.formData.contacts.countyName}}
							</view>

						</view>
					</view>
					<view class="box_bs">
						<view class="">住址</view>
						<view class="right_size">
							<view>{{formData.contacts.address}} </view>


						</view>
					</view>

				</view>
				<view class="four_box" @click="infoClick(1)" v-else>

					<view class="icon-box">
						<image src="../../static/imgs/l1.png" style="width: 18px; height: 18px;" mode=""></image>
						<view class="size_">联系人信息</view>
					</view>
					<view class="" @click="infoClick(1)">
						<u-icon name="arrow-right" color="#6c6c6c" size="18"></u-icon>
					</view>
				</view>
				<!-- 2 -->
				<view class="four_box" v-if="!twoShow" @click="infoClick(2)">
					<view class="icon-box">
						<image src="../../static/imgs/l2.png" style="width: 18px; height: 18px;" mode=""></image>
						<view class="size_">受益人信息</view>
					</view>
					<view class="">
						<u-icon name="arrow-right" color="#6c6c6c" size="18"></u-icon>
					</view>
				</view>
				<view class="box_" v-else>
					<view class="qiuqiu" @click="infoClick(2)"></view>
					<view class="title-bs" @click="infoClick(2)">
						<view class="" style="margin-left: 15px;font-weight: bold;">
							受益人信息
						</view>
						<view class="dis_" @click="twoShow =! twoShow">
							<u-icon name="arrow-down" color="#6c6c6c" size="18"></u-icon>
						</view>
					</view>
					<view v-for="(item,idx) in formData.beneficiary" :key="idx">
						<view class="d-s" v-show="idx>0">
							<view class="lv-biao"></view>
							<view class="">{{'第'+numToTxt(idx+1)+'受益人信息'}}</view>
						</view>
						<view class="box_bs">
							<view class="">证件类型</view>
							{{item.certTypeName}}
						</view>
						<view style="margin: 15px auto;">证件照</view>
						<view class="bs_img">
							<view class="fifty">
								<u-upload :deletable="false" :fileList="item.fileList1"
									@afterRead="((item)=>{addInfoImg(item, 'beneficiary',idx,1)})"
									@delete="((item)=>{deletePic(item, 'beneficiary',idx,1)})" name="1" multiple
									:maxCount="1" width="150" height="100">
									<image src="/static/imgs/yhkzm.png" mode="widthFix"
										style="width: 150px;height: 100px;">
									</image>
								</u-upload>
								<view class="" style="margin-top: 10px;">证件人像面</view>
							</view>
							<view class="fifty">
								<u-upload :deletable="false" :fileList="item.fileList2"
									@afterRead="((item)=>{addInfoImg(item, 'beneficiary',idx,2)})"
									@delete="((item)=>{deletePic(item, 'beneficiary',idx,2)})" name="2" multiple
									:maxCount="1" width="150" height="100">
									<image src="/static/imgs/yhkfm.png" mode="widthFix"
										style="width: 150px;height: 100px;">
									</image>
								</u-upload>
								<view class="" style="margin-top: 10px;">证件国徽面</view>
							</view>
						</view>

						<view class="box_bs">
							<view class="">姓名</view>
							<view class="right_size">
								<view>{{item.participantName}}</view>
							</view>
						</view>
						<view class="box_bs">
							<view class="">证件号</view>
							<view class="right_size">
								<view>{{item.certNo}}</view>

							</view>
						</view>
						<view class="box_bs">
							<view class="">证件有效期</view>
							<view class="dis_">
								<view class="dis_">
									<view style="color:#000;margin: 0px 5px;">{{item.certEffectDate}}
									</view>
								</view>
								<view class="size_" style="margin: 0px 5px;">至</view>
								<view class="dis_">
									<view style="color:#000;margin: 0px 5px;">{{item.certExaDate}}
									</view>
								</view>
							</view>
						</view>
						<view class="box_bs">
							<view class="">手机号</view>
							<view class="right_size">
								<view>{{item.mobileNo}}</view>
							</view>
						</view>
						<view class="box_bs">
							<view class="">邮箱</view>
							<view class="right_size">
								<view>{{item.email}}</view>
							</view>
						</view>
						<view class="box_bs">
							<view class="">归属地</view>
							<view class="dis_">
								<view class="size_">
									{{item.provinceName+item.cityName+item.countyName}}
								</view>
							</view>
						</view>
						<view class="box_bs">
							<view class="">住址</view>
							<view class="right_size">
								<view>{{item.address}}</view>

							</view>
						</view>

					</view>


				</view>


				<!-- 3 -->

				<view class="four_box" v-if="!threeShow " @click="infoClick(3)">
					<view class="icon-box">
						<image src="../../static/imgs/l3.png" style="width: 18px; height: 18px;" mode=""></image>
						<view class="size_">实际控制人信息</view>
					</view>
					<view class="" @click="infoClick(3)">
						<u-icon name="arrow-right" color="#6c6c6c" size="18"></u-icon>
					</view>
				</view>
				<view class="box_" v-else>
					<view class="qiuqiu" @click="infoClick(3)"></view>
					<view class="title-bs" @click="infoClick(3)">
						<view class="" style="margin-left: 15px;font-weight: bold;">
							实际控制人信息
						</view>
						<view class="dis_" @click="infoClick(3)">
							<u-icon name="arrow-down" color="#6c6c6c" size="18"></u-icon>
						</view>
					</view>
					<view v-for="(item,idx) in formData.actualController" :key="idx">
						<view class="d-s" v-show="idx>0">
							<view class="lv-biao"></view>
							<view class="">{{'第'+numToTxt(idx+1)+'实际控制人信息'}}</view>
						</view>
						<view class="box_bs">
							<view class="">证件类型</view>
							<view>{{item.certTypeName}}</view>

						</view>
						<view style="margin: 15px auto;">证件照</view>
						<view class="bs_img">
							<view class="fifty">
								<u-upload :deletable="false" :fileList="item.fileList1"
									@afterRead="((item)=>{addInfoImg(item, 'actual',idx,1)})"
									@delete="((item)=>{deletePic(item, 'actual',idx,1)})" name="1" multiple
									:maxCount="1" width="150" height="100">
									<image src="/static/imgs/yhkzm.png" mode="widthFix"
										style="width: 150px;height: 100px;">
									</image>
								</u-upload>
								<view class="" style="margin-top: 10px;">证件人像面</view>
							</view>
							<view class="fifty">
								<u-upload :deletable="false" :fileList="item.fileList2"
									@afterRead="((item)=>{addInfoImg(item, 'actual',idx,2)})"
									@delete="((item)=>{deletePic(item, 'actual',idx,2)})" name="2" multiple
									:maxCount="1" width="150" height="100">
									<image src="/static/imgs/yhkfm.png" mode="widthFix"
										style="width: 150px;height: 100px;">
									</image>
								</u-upload>
								<view class="" style="margin-top: 10px;">证件国徽面</view>
							</view>
						</view>

						<view class="box_bs">
							<view class="">姓名</view>
							<view class="right_size">
								<input type="text" v-model="item.participantName" placeholder="请输入" />
							</view>
						</view>
						<view class="box_bs">
							<view class="">证件号</view>
							<view class="right_size">
								<view>{{item.certNo}}</view>
							</view>
						</view>
						<view class="box_bs">
							<view class="">证件有效期</view>
							<view class="dis_">
								<view class="dis_">
									<view style="color:#000;margin: 0px 5px;">{{item.certEffectDate}}
									</view>
								</view>



								<view class="size_" style="margin: 0px 5px;">至</view>
								<view class="dis_">

									<view style="color:#000;margin: 0px 5px;">{{item.certExaDate}}
									</view>

								</view>


							</view>
						</view>
						<view class="box_bs">
							<view class="">手机号</view>
							<view class="right_size">
								<view>{{item.mobileNo}}</view>
							</view>
						</view>
						<view class="box_bs">
							<view class="">邮箱</view>
							<view class="right_size">
								<view>{{item.email}}</view>

							</view>
						</view>
						<view class="box_bs">
							<view class="">归属地</view>
							<view class="dis_">
								<view class="size_">
									{{item.provinceName+item.cityName+item.countyName}}
								</view>
							</view>
						</view>
						<view class="box_bs">
							<view class="">住址</view>
							<view class="right_size">
								<view class="size_">
									{{item.address}}
								</view>


							</view>
						</view>

					</view>
				</view>
				<view class="four_box" v-if="!fourShow" @click="infoClick(4)">
					<view class="icon-box">
						<image src="../../static/imgs/l4.png" style="width: 18px; height: 18px;" mode=""></image>
						<view class="size_">控制股东信息</view>
					</view>
					<view class="" @click="infoClick(4)">
						<u-icon name="arrow-right" color="#6c6c6c" size="18"></u-icon>
					</view>
				</view>
				<view class="box_" v-else>
					<view class="qiuqiu" @click="infoClick(4)"></view>
					<view class="title-bs" @click="infoClick(4)">
						<view class="" style="margin-left: 15px;font-weight: bold;">
							控制股东信息
						</view>
						<view class="dis_" @click="infoClick(4)">
							<u-icon name="arrow-down" color="#6c6c6c" size="18"></u-icon>
						</view>
					</view>
					<view v-for="(item,idx) in formData.controllingShareholder" :key="idx">
						<view class="d-s" v-show="idx>0">
							<view class="lv-biao"></view>
							<view class="">{{'第'+numToTxt(idx+1)+'控制股东信息'}}</view>
						</view>
						<view class="box_bs">
							<view class="">证件类型</view>
							<view>{{item.certTypeName}}</view>
						</view>
						<view style="margin: 15px auto;">证件照</view>
						<view class="bs_img">
							<view class="fifty">
								<u-upload :deletable="false" :fileList="item.fileList1"
									@afterRead="((item)=>{addInfoImg(item, 'controlling',idx,1)})"
									@delete="((item)=>{deletePic(item, 'controlling',idx,1)})" name="1" multiple
									:maxCount="1" width="150" height="100">
									<image src="/static/imgs/yhkzm.png" mode="widthFix"
										style="width: 150px;height: 100px;">
									</image>
								</u-upload>
								<view class="" style="margin-top: 10px;">证件人像面</view>
							</view>
							<view class="fifty">
								<u-upload :deletable="false" :fileList="item.fileList2"
									@afterRead="((item)=>{addInfoImg(item, 'controlling',idx,2)})"
									@delete="((item)=>{deletePic(item, 'controlling',idx,2)})" name="2" multiple
									:maxCount="1" width="150" height="100">
									<image src="/static/imgs/yhkfm.png" mode="widthFix"
										style="width: 150px;height: 100px;">
									</image>
								</u-upload>
								<view class="" style="margin-top: 10px;">证件国徽面</view>
							</view>
						</view>

						<view class="box_bs">
							<view class="">姓名</view>
							<view class="right_size">
								<view>{{item.participantName}}</view>
							</view>
						</view>
						<view class="box_bs">
							<view class="">证件号</view>
							<view class="right_size">
								<view>{{item.certNo}}</view>

							</view>
						</view>
						<view class="box_bs">
							<view class="">证件有效期</view>
							<view class="dis_">
								<view class="dis_">

									<view style="color:#000;margin: 0px 5px;"> {{item.certEffectDate}}
									</view>

								</view>



								<view class="size_" style="margin: 0px 5px;">至</view>
								<view class="dis_">

									<view style="color:#000;margin: 0px 5px;">{{item.certExaDate}}
									</view>

								</view>


							</view>
						</view>
						<view class="box_bs">
							<view class="">手机号</view>
							<view class="right_size">
								<view>{{item.mobileNo}}</view>

							</view>
						</view>
						<view class="box_bs">
							<view class="">邮箱</view>
							<view class="right_size">
								<view>{{item.email}}</view>

							</view>
						</view>
						<view class="box_bs">
							<view class="">归属地</view>
							<view class="dis_">
								<view class="size_">
									{{item.provinceName+item.cityName+item.countyName}}
								</view>
							</view>
						</view>
						<view class="box_bs">
							<view class="">住址</view>
							<view class="right_size">
								<view>{{item.address}}</view>
							</view>
						</view>

					</view>


				</view>


			</view>

			<!-- 4 -->



		</view>
		<view class="box_">
			<view class="title_">
				结算卡信息
			</view>
			<view class="box_bs">
				<view class="">结算账户类型</view>
				<view class="right_size">
					<view class="h_">{{formData.settleAccTypeName||""}}</view>
				</view>
			</view>
			<view class="box_bs">
				<view class="">账户号</view>
				<view class="right_size">
					<view class="h_">{{formData.bankAccountNo||""}}</view>
				</view>
			</view>

			<view class="box_bs">
				<view class="">账户名称</view>
				<view class="right_size">
					<view class="h_">{{formData.settleAccName||""}}</view>
				</view>
			</view>
			<view class="box_bs">
				<view class="">开户行</view>
				<view class="right_size">
					<view class="h_">{{(formData.bankProvinceName+formData.bankCityName)||""}}</view>
				</view>
			</view>
			<view class="box_bs">
				<view class=""></view>
				<view class="right_size">
					<view class="h_">{{(formData.bankOutletsName)||""}}</view>
				</view>
			</view>
			<view class="box_bs">
				<view class="">结算周期</view>
				<view class="right_size">
					<view class="h_">{{(formData.settlementCycleName)||""}}</view>
				</view>
			</view>



		</view>
		<!--  -->
		<u-popup :show="show" mode="center" :round="10" @close="close" @open="open">
			<view class="box_popup">
				<view class="popup-top">
					<view class="popup-title">电子签名协议</view>
					<view class="popup-smalltitle">(需法人签名)</view>
					<view class="popup-ds">
						<view class="" style="width: 10%; ">
							<view class="qiu" v-if="popupShow == false" @click="popupShow =! popupShow "></view>
							<view class="xqiu" v-if="popupShow == true" @click="popupShow =! popupShow ">
								<u-icon name="checkbox-mark" color="#fff" size="14"></u-icon>
							</view>
						</view>
						<view class="" style="width: 90%;text-align: left;font-size: 14px;">
							<text>我已阅读并同意</text>
							<text
								style="color: #f79d31; font-size: 14px;">《兔米旺商户扫码支付服务协议》《兔米旺开户意愿书》《兔米旺商户注册及服务协议》《兔米旺隐私政策》</text>
						</view>
					</view>
				</view>

				<jushi-signature :settings="settings" base64 @cancel="signatureCancel"
					@change="signatureChange"></jushi-signature>
			</view>
		</u-popup>

		<!-- <view class="" style="margin-top: 20rpx;">
				<text class="text">保存后的签名图片</text>
				<view class="preview">
					<image :src="imgUrl" mode="" style="width: 100%;"></image>
				</view>
			</view> -->
		<view class="button_p" @click="nextStep()">
			<view class="">确认提交</view>
		</view>
	</view>

	</view>
</template>

<script>
	import headers from '../../components/header/headers.vue'
	import request from '../../utils/request.js'
	import upload from '@/utils/upload.js'
	export default {
		data() {
			return {
				overlayShow: false,
				titles: "信息确认",
				oneShow: false,
				oneCorporation: false,
				twoShow: false,
				twoCorporation: false,
				threeShow: false,
				threeCorporation: false,
				fourShow: false,
				fourCorporation: false,
				xgshow: false,
				dataList: [],
				fileList1: [],
				fileList2: [],
				value1: '',
				show: false,
				popupShow: false,
				status: 'loading',
				select: '',
				options: [{
					value: "1",
					label: "人民币"
				}, {
					value: "2",
					label: "刀乐"
				}, {
					value: "3",
					label: "英镑",
					disabled: true
				}],
				settings: { //签名设置
					width: '750', //签名区域的宽
					height: '500', //签名区域的高
					lineWidth: 4, //签名时线宽
					textColor: '#000' //签名文字颜色
				},
				imgUrl: '',
				merchantId: null,
				formData: {
					areaType: "7", //商户类型 7 小微 写死
					openAccEffectDate: "",
					openAccExpDate: "",
					legalPerson: {
						address: "",
						backPic: "",
						backPicUrl: "",
						certEffectDate: "",
						certExaDate: "",
						certNo: "",
						certType: "11",
						certTypeName: "身份证",
						city: "",
						cityName: "",
						county: "",
						countyName: "",
						email: "",
						facePic: "",
						facePicUrl: "",
						firstCareerName: "",
						firstCareerNo: "",
						gender: "1",
						mobileNo: "",
						nation: "CHN",
						nationLabel: "中国",
						participantName: "",
						province: "",
						provinceName: "",
						secondCareerName: "",
						secondCareerNo: "",
						sort: 0,
						thirdCareerName: "",
						thirdCareerNo: ""
					},
					openAccount: "",
					openAccountUrl: "",
					rate: "0.25",
					steps: "5" //步骤当前页面写死第一页，

				},
				sexList: [], //性别  数据字典获取
				merchantId: null

			}
		},
		onLoad(options) {
			if (options && options.merchantId) {
				this.merchantId = options.merchantId
			}
			this.getSexList()

		},
		onShow() {
			this.getMerchantInfo()
		},
		computed: {
			genderName() {
				if (this.sexList && this.sexList.length > 0) {
					let tempData = this.sexList.find(item => item.value == this.formData.legalPerson.gender)
					return tempData.label
				} else {
					return '男'
				}
			}
		},
		components: {
			headers,
		},
		methods: {
			numToTxt(num) {
				if (num == 1) {
					return "一"
				} else if (num == 2) {
					return "二"
				} else if (num == 3) {
					return "三"
				} else if (num == 4) {
					return "四"
				} else if (num == 5) {
					return "五"
				} else if (num == 6) {
					return "六"
				} else if (num == 7) {
					return "七"
				} else if (num == 8) {
					return "八"
				} else if (num == 9) {
					return "九"
				} else if (num == 10) {
					return "十"
				} else {
					return num
				}
			},
			infoClick(idx) {
				if (idx == 1) {
					this.oneShow = !this.oneShow
				} else if (idx == 2) {
					this.twoShow = !this.twoShow
				} else if (idx == 3) {
					this.threeShow = !this.threeShow
				} else if (idx == 4) {
					this.fourShow = !this.fourShow
				}

			},
			async submit() {
				let res = await request({
					url: 'app/report/newBaseInfoSaveOrUpdate',
					method: 'post',
					data: this.formData
				})
				if (res.code == 0) {
					console.log("提交成功");

				}

			},
			async getSexList() {
				this.sexList = await this.$getDictList('gender')

			},
			async getMerchantInfo() {
				let ress = await request({
					url: 'app/report/newBaseInfo',
					method: 'post',
					data: {
						objectId: this.merchantId
					}
				})
				this.formData = ress.data
				this.formData.steps = '6'
				this.formData.steps = '3'
				if (!this.formData.contacts) {
					this.formData.contacts = {
						address: "",
						backPic: "",
						backPicUrl: "",
						certEffectDate: "",
						certExaDate: "",
						certNo: "",
						certType: "11",
						certTypeName: "身份证",
						city: "",
						cityName: "",
						county: "",
						countyName: "",
						email: "",
						facePic: "",
						facePicUrl: "",
						firstCareerName: "",
						firstCareerNo: "",
						gender: "1",
						mobileNo: "",
						nation: "CHN",
						nationLabel: "中国",
						participantName: "",
						province: "",
						provinceName: "",
						secondCareerName: "",
						secondCareerNo: "",
						sort: 0,
						thirdCareerName: "",
						thirdCareerNo: ""
					}
				} else {
					this.fileList1.push({
						url: this.formData.contacts.facePicUrl
					})
					this.fileList2.push({
						url: this.formData.contacts.backPicUrl
					})
				}
				if (!this.formData.beneficiary || this.formData.beneficiary.length == 0) {
					this.formData.beneficiary.push({
						address: "",
						backPic: "",
						backPicUrl: "",
						certEffectDate: "",
						certExaDate: "",
						certNo: "",
						certType: "11",
						certTypeName: "身份证",
						city: "",
						cityName: "",
						county: "",
						countyName: "",
						email: "",
						facePic: "",
						facePicUrl: "",
						firstCareerName: "",
						firstCareerNo: "",
						gender: "1",
						mobileNo: "",
						nation: "CHN",
						nationLabel: "中国",
						participantName: "",
						province: "",
						provinceName: "",
						secondCareerName: "",
						secondCareerNo: "",
						sort: 0,
						thirdCareerName: "",
						thirdCareerNo: "",
						fileList1: [],
						fileList2: []
					})

				} else {
					for (var i = 0; i < this.formData.beneficiary.length; i++) {
						this.formData.beneficiary[i].fileList1 = [{
							url: this.formData.beneficiary[i].facePicUrl
						}]
						this.formData.beneficiary[i].fileList2 = [{
							url: this.formData.beneficiary[i].backPicUrl
						}]
					}


				}
				if (!this.formData.actualController || this.formData.actualController.length == 0) {
					this.formData.actualController.push({
						address: "",
						backPic: "",
						backPicUrl: "",
						certEffectDate: "",
						certExaDate: "",
						certNo: "",
						certType: "11",
						certTypeName: "身份证",
						city: "",
						cityName: "",
						county: "",
						countyName: "",
						email: "",
						facePic: "",
						facePicUrl: "",
						firstCareerName: "",
						firstCareerNo: "",
						gender: "1",
						mobileNo: "",
						nation: "CHN",
						nationLabel: "中国",
						participantName: "",
						province: "",
						provinceName: "",
						secondCareerName: "",
						secondCareerNo: "",
						sort: 0,
						thirdCareerName: "",
						thirdCareerNo: "",
						fileList1: [],
						fileList2: []
					})

				} else {
					for (var i = 0; i < this.formData.actualController.length; i++) {
						this.formData.actualController[i].fileList1 = [{
							url: this.formData.actualController[i].facePicUrl
						}]
						this.formData.actualController[i].fileList2 = [{
							url: this.formData.actualController[i].backPicUrl
						}]
					}


				}
				if (!this.formData.controllingShareholder || this.formData.controllingShareholder.length == 0) {
					this.formData.controllingShareholder.push({
						address: "",
						backPic: "",
						backPicUrl: "",
						certEffectDate: "",
						certExaDate: "",
						certNo: "",
						certType: "11",
						certTypeName: "身份证",
						city: "",
						cityName: "",
						county: "",
						countyName: "",
						email: "",
						facePic: "",
						facePicUrl: "",
						firstCareerName: "",
						firstCareerNo: "",
						gender: "1",
						mobileNo: "",
						nation: "CHN",
						nationLabel: "中国",
						participantName: "",
						province: "",
						provinceName: "",
						secondCareerName: "",
						secondCareerNo: "",
						sort: 0,
						thirdCareerName: "",
						thirdCareerNo: "",
						fileList1: [],
						fileList2: []
					})

				} else {
					for (var i = 0; i < this.formData.controllingShareholder.length; i++) {
						this.formData.controllingShareholder[i].fileList1 = [{
							url: this.formData.controllingShareholder[i].facePicUrl
						}]
						this.formData.controllingShareholder[i].fileList2 = [{
							url: this.formData.controllingShareholder[i].backPicUrl
						}]
					}


				}
				console.log(this.formData);

			},
			close() {
				this.show = false
			},
			open() {
				console.log('打开了');
			},
			signatureCancel() {
				this.show = false
			},
			signatureChange(e) {
				this.imgUrl = e
				const index = e.lastIndexOf("/")
				let fileName = e.substring(index + 1, e.length)
				this.uploadFile(this.imgUrl, fileName)
				this.show = false
			},
			async uploadFile(url, fileName) {
				uni.showLoading({
					title: '上传中'
				});
				this.overlayShow = true
				let that = this
				upload({
					url: 'app/report/fileUplod',
					filePath: url,
					formData: {
						fileName: fileName,
						type: 29,
						name: this.formData.legalPerson.participantName,
						corporate: this.formData.merchantName,
						merName: this.formData.legalPerson.participantName,
						phone: this.formData.legalPerson.mobileNo,
						email: this.formData.legalPerson.email,
						address: this.formData.merProvinceNames + this.formData.merRegionNames + this.formData
							.merCountyNames + this.formData.merAddr,
						wxRate: this.formData.wxRate,
						aliRate: this.formData.aliRate,
						ysfRate: this.formData.unionPayRate

					}

				}).then((res) => {
					let that = this
					if (res.code == 0) {
						that.formData.networkProtocol = res.data.externalKey
						that.formData.networkProtocolUrl = res.data.imgUrl
						that.submit()
					}
				}).finally((res) => {
					uni.hideLoading();
					that.overlayShow = false

				})
			},
			change(e) {
				console.log('select = ', this.select)
			},
			nextStep() {
				this.show = true
			},
			goback() {
				uni.navigateBack()
			}
		}
	}
</script>

<style scoped lang="scss">
	.content {
		background: #f4f5f6;

		height: 100vh;
	}

	.container {
		width: 100%;
		background: #f4f5f6;
		box-sizing: border-box;
		padding-top: 88px;
		padding-bottom: 88px;
	}

	.box_ {
		width: 95%;
		border-radius: 8px;
		box-sizing: border-box;
		padding: 10px;
		background: #fff;
		margin: 15px auto;
	}

	.box_bs {
		display: flex;
		align-items: center;
		justify-content: space-between;
		box-sizing: border-box;
		padding: 10px 0px;
		color: #aeaeae;
		border-bottom: 1px solid #eeeeee;
	}

	.dis_ {
		display: flex;
	}

	.size_ {
		margin-right: 5px;
		color: #000;
	}

	.title_ {
		font-size: 18px;
		font-weight: bold;
		margin: 10px 0px;
		margin-bottom: 20px;
	}

	.upload-box {
		width: 100%;
		margin: 5px 0px;

		display: flex;
		text-align: center;
		justify-content: space-between;
		margin-bottom: 20px;
	}

	.upload-title {
		font-size: 16px;
		margin-right: 10%;

	}

	.right_size {
		width: 70%;
		text-align: right;
	}

	.input_color {
		width: 100px;
		display: flex;
		align-items: center;
		height: 36px;
		border: 2px solid #efefef;
		border-radius: 4px;
		box-sizing: border-box;
		padding: 5px;
		margin-left: 10px;
	}

	.button_p {
		width: 100%;
		background: #E4612E;
		height: 55px;
		display: flex;
		align-items: center;
		justify-content: center;
		color: #fff;
		border-radius: 4px;
		position: fixed;
		bottom: 0px;
	}

	.right-box {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: flex-end;
		color: #aeaeae;
		font-size: 14px;
		margin: 10px 0px;
	}

	.bs_img {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.fifty {
		width: 50%;
		text-align: center;

		box-sizing: border-box;
		padding-left: 15px;
		font-size: 14px;

	}

	.h_ {
		color: #000;
	}

	.preview {
		margin: 10rpx;
		border: 1rpx solid #aaaaaa;
		border-radius: 10rpx;
	}

	.text {
		margin: 20rpx;
		color: #aaaaaa;
	}

	.xg-box {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin: 10px auto;
	}

	.s-h-box {
		width: 100%;
		box-sizing: border-box;
		padding: 10px 0px;
		border-bottom: 1px solid #d5d5d5;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.left-h {
		color: #aeaeae;
	}

	.right-h {
		color: #000;
	}

	.box_popup {
		width: 370px;
		box-sizing: border-box;
		overflow: hidden;
		border-radius: 8px;
		background: #fff;
		// background: linear-gradient(90deg, #d7f3e5 0%, #fafdea 100%, );
	}

	.popup-top {
		width: 100%;
		background: linear-gradient(90deg, #d7f3e5 0%, #fafdea 100%, );
		background: linear-gradient(180deg, #d7f3e5 0%, #fafdea 85%, rgba(255, 255, 255, 0.84) 95%, rgba(255, 255, 255, 0.84) 100%);
		text-align: center;
		box-sizing: border-box;
		padding: 15px;
	}

	.popup-ds {
		width: 100%;
		display: flex;

	}

	.popup-title {
		font-size: 18px;
		font-weight: bold;

	}

	.popup-smalltitle {
		font-size: 14px;
		color: #686d66;
		margin-bottom: 10px;
	}

	.qiu {
		width: 16px;
		height: 16px;
		border: 1px solid #686d66;
		border-radius: 50%;
	}

	.xqiu {
		width: 16px;
		height: 16px;
		background: #E4612E;
		border: 1px solid #E4612E;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.gang {
		width: 4px;
		height: 20px;
		background: #E4612E;
		border-radius: 14px;
		margin-right: 10px;

	}

	.d-s {
		display: flex;
		align-items: center;
		margin: 10px 0px;
	}

	.qiuqiu {
		width: 25px;
		height: 25px;
		background: #E4612E;
		border-radius: 50%;
		top: 13px;

		position: absolute;
		left: -12px;
	}

	.title-bs {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-bottom: 15px;
	}

	.box_ {
		width: 95%;
		border-radius: 8px;
		box-sizing: border-box;
		padding: 15px;
		background: #fff;
		margin: 15px auto;
		overflow: hidden;
		position: relative;
	}

	.icon-box {
		display: flex;
		align-items: center;
	}

	.four_box {
		width: 95%;
		margin: 15px auto;
		background: #fff;
		border-radius: 6px;
		display: flex;
		align-items: center;
		justify-content: space-between;
		box-sizing: border-box;
		padding: 15px;

	}
</style>
