<template>
	<view class="enterpriseAttestation" v-if="logocome">
		<far-bottom></far-bottom>
		<!-- <scroll-view :style="{ height: phoneHight }" :scroll-y="true"> -->
			<view>
			<image :src="qyrzBack" class="wid750 "></image>
			<view class="mainView absolute0">
				<!-- 基本信息 -->
				<view class="informationView marginAuto">
					<view class="p30">
						<view>
							<view class="line inlineBlock verticalM"></view>
							<text class="colorBlack font28 verticalM marginL10">企业/个体工商户认证</text>
						</view>
						<view class="marginT29">
							<view class="inputView">
								<text class="colorBlack font24 verticalM">主体名称</text>
								<input placeholder="请输入企业/个体工商户认证" class="colorBlack font24 inlineBlock verticalM p0p50" v-model="userInfo.name" />
							</view>
							<!-- <view class="inputView marginT18">
								<text class="colorBlack font24 verticalM">主体类型</text>
								<input placeholder="请输入主体类型" class="colorBlack font24 inlineBlock verticalM p0p50" v-model="storeType" :disabled="true"/>
							</view> --> 
							<view class="inputView marginT18">
								<text class="colorBlack font24 verticalM">执照注册号</text>
								<input placeholder="请输入执照注册号" class="colorBlack font24 inlineBlock verticalM p0p50" v-model="userInfo.cardnum" />
							</view>
							<view class="inputView marginT18">
								<text class="colorBlack font24 verticalM">联系电话</text>
								<input placeholder="请输入联系电话" class="colorBlack font24 inlineBlock verticalM p0p50" type="number" v-model="userInfo.phone" />
							</view>
							<!-- <view :class="(item.type == 'text'|| item.type == 'number')?'inputView marginT18':'inputImg marginT18'" v-for="(item,index) in userInfo.moreset" :key="index" v-if="item.type == 'number' || item.type == 'text'">
								<text class="colorBlack font24 verticalM" >{{item.content}}</text>
								<input v-if="item.type == 'number'" :placeholder="'请输入' +item.content" class="colorBlack font24 inlineBlock verticalM p0p50"
								 type="number" v-model="userInfo['m' + index]" />
								<input v-if="item.type == 'text'" :placeholder="'请输入' + item.content" class="colorBlack font24 inlineBlock verticalM p0p50"
								 v-model="userInfo['m' + index]" />
							</view> -->
						</view>
					</view>
				</view>
				<!-- 基本信息 -->
				<!-- 上传证件 -->
				<view class="uploadView marginAuto marginT35">
					<view class="p30">
						<view>
							<view class="line inlineBlock verticalM"></view>
							<text class="colorBlack font28 verticalM marginL10">上传营业执照</text>
						</view>
						<view class="marginT29 flex">
							<view class="uploadButton inlineBlock textC" @click="uploadFiles(3)" v-if="picArray.length==0">
								<image :src="yyzz" class="upLoadImg"></image>
							</view>
							<view class="uploadButton inlineBlock textC color0" v-if="picArray.length==0">
								<image :src="qyal" class="upLoadImg"></image>
							</view>
							<view class="uploadButton inlineBlock textC color0" v-else @click="uploadFiles(3)">
								<image v-for="(item,index) in picArray" :src="item" class="upLoadImg"></image>
							</view>
						</view>
						<view class="marginT29">
							<text class="color999999  font24">请上传清晰的营业执照</text>
						</view>
					</view>

				</view>
				<!-- 上传证件 -->

				<!-- 店铺详情 -->
				<view  style="margin: 30upx;padding: 30upx;background-color: #FFFFFF;border-radius: 15upx;" v-if="orderSubmitInfoData.diyform">
					<view class="f-26">
						<view class="line inlineBlock verticalM"></view>
						<text style="padding-left: 10upx;">完善更多信息</text>
					</view>
					<form-item ref="formItem" :gopay="gopay" :gopaytwo="gopaytwo" :orderSubmitInfo="orderSubmitInfoData"></form-item>
				</view>
				<!-- 店铺详情 -->

				<!-- 协议 -->
				<view class="marginT40">
					<view class="pL30">
						<view class="bor1gray" v-if="agree==false" @click="agree=true"></view>
						<image :src="imgfixUrls + 'merchant/tyXy.png'" class="image22" v-if="agree==true" @click="agree=false"></image>
						<text class="font24 color999999 marginL10" @click="agree=!agree">阅读并同意</text>
						<text class="font24 color4F6D8C" @click="showPop">《用户协议条款》</text>
					</view>
				</view>
				<!-- 协议 -->

				<!-- 提交按钮 -->
				<view class="marginT70auto textC" @click="setInfo" :class="agree==true?'submitButton':'submitButton1'"><text class="lineHeight80 colorW font28">提交</text></view>
				<!-- 提交按钮 -->
				<popAgreement :show="show" @clickmask="closePop" :buttonColor="buttonColor" :textInfo="userInfo.agreement"></popAgreement>

			</view>
			</view>
		<!-- </scroll-view> -->
	</view>
</template>

<script>
	import App from '@/common/js/app.js';

	// #ifdef H5
	import wxApi from '@/common/js/wxApi.js';
	// #endif
	import popAgreement from '@/components/template/popAgreement';
	import formItem from '@/components/template/formItem.vue'
	export default {
		components: {
			popAgreement,
			formItem
		},
		data() {
			return {
				agree: false,
				phoneHight: null,
				show: false,
				buttonColor: 'rgba(51,136,255,1)',
				userInfo: {},
				picArray: [],
				storeType: '个体商户',
				type1Url: '',
				type1Urlon: '',
				type2Url: [],
				type2Urlon:[],
				user:{},
				logocome:true,
				gopay:true,
				orderSubmitInfoData:{},
				gopaytwo:true
			};
		},
		computed: {
			qyrzBack() {
				let _this = this;
				return _this.imageRoot + 'qyrzBack.png';
			},
			yyzz() {
				let _this = this;
				return _this.imageRoot + 'yyzz.png';
			},
			qyal() {
				let _this = this;
				return _this.imageRoot + 'qyal.png';
			},
		},
		onLoad(e) {
			let _this = this;
			_this.rzType = e.rzType;
			uni.getSystemInfo({
				success(res) {
					_this.phoneHight = res.windowHeight + 'px';
				}
			});
			uni.getStorage({
				key: 'checkStoreid',
				success: function(res) {
					_this.id = res.data
					_this.init(res.data);
				}
			});
		},
		methods: {
			closePreview(item,indexs){
				this.logocome = false;
				let userArray = ['a']
				if(this.userInfo['m' + indexs]){
					this.userInfo['m' + indexs].map((items,index)=>{
						if(items == item){
							console.log(this.userInfo['m' + indexs],1111111111111);
							userArray = this.userInfo['m' + indexs].splice(index,1);
						}
					});
				}else{
					this.type2Url.map((items,index)=>{
						if(items == item){
							this.type2Url.splice(index,1);
							this.type2Urlon.splice(index,1);
							this.userInfo['m' + indexs].splice(index,1);
						}
					});
				}
				console.log(this.type2Url,this.userInfo['m' + indexs])
				this.logocome = true;
			},
			closeLogo(index,item) {
				let _this = this;
				
				_this.type1Url = '';
				_this.type1Urlon = '';
				_this.userInfo.moreset.map((items,indexs)=>{
					if(item == items.value){
						_this.userInfo.moreset[indexs].value = '';
					}
				})
				_this.logocome = !_this.logocome;
				_this.logocome = !_this.logocome;
				// _this.userInfo.logo = '';
			},
			closePop() {
				let _this = this
				_this.show = false
			},
			showPop() {
				let _this = this
				_this.show = true
			},
			init(mid) {
				let _this = this;
				// #ifdef H5
				wxApi.wxRegister();
				// #endif
				_this.getInfo(mid);
			},
			setInfo() {
				let _this = this;
				_this.gopay = false;
				setTimeout(()=>{
					_this.gopay = true;
				},2000)
				// let data = {
				// 	type: 2,
				// 	sid: _this.id,
				// 	operation: 'set',
				// 	att_id: _this.userInfo.att_id,
				// 	name: _this.userInfo.name,
				// 	phone: _this.userInfo.phone,
				// 	pic: _this.userInfo.pic,
				// 	cardnum: _this.userInfo.cardnum,
				// 	m0:_this.type1Urlon,
				// 	m1:_this.userInfo.m1,
				// 	m2:_this.type2Urlon,
				// 	m3:_this.userInfo.m3,
				// };
				delete this.userInfo.agreement //true
				delete this.userInfo.id //true
				delete this.userInfo.moreinfo //true
				delete this.userInfo.moreset
				this.userInfo.type = 2;
				this.userInfo.sid = _this.id;
				this.userInfo.operation = 'set';
				// this.userInfo.moreset.map((item,index)=>{
				// 	this.userInfo['m'+index] = item.text;
				// });
				if (  _this.userInfo.name == '') {
					uni.showToast({
						icon: 'none',
						title: '主体名称不能为空',
						duration: 2000
					});
					return;
				}
				if (  _this.userInfo.phone == '') {
					uni.showToast({
						icon: 'none',
						title: '联系电话不能为空',
						duration: 2000
					});
					return;
				}
				if (  _this.userInfo.cardnum == '') {
					uni.showToast({
						icon: 'none',
						title: '执照注册号不能为空',
						duration: 2000
					});
					return;
				}
				if (  _this.userInfo.pic.length < 1) {
					uni.showToast({
						icon: 'none',
						title: '请上传营业执照',
						duration: 2000
					});
					return;
				}
				// if(_this.userInfo.moreset.length !== 0 &&  !_this.userInfo.m1){
				// 	uni.showToast({
				// 		icon: 'none',
				// 		title: '店长姓名不能为空',
				// 		duration: 2000
				// 	});
				// 	return;
				// }
				// if( _this.userInfo.moreset.length !== 0 && !_this.userInfo.m3){
				// 	uni.showToast({
				// 		icon: 'none',
				// 		title: '客服电话不能为空',
				// 		duration: 2000
				// 	});
				// 	return;
				// }
				// if(_this.userInfo.moreset.length !== 0 && _this.userInfo.type1Url == ''){
				// 	uni.showToast({
				// 		icon: 'none',
				// 		title: '请上传食品安全证',
				// 		duration: 2000
				// 	});
				// 	return;
				// }
				// if(_this.userInfo.moreset.length !== 0 && _this.type2Url.length == 0){
				// 	uni.showToast({
				// 		icon: 'none',
				// 		title: '请上传店内图片',
				// 		duration: 2000
				// 	});
				// 	return;
				// }
				setTimeout(()=>{
					if(_this.$refs.formItem){
						if( _this.$refs.formItem.ifrequired == false){
							uni.showToast({
								icon: 'none',
								title: '请完善必填信息'
							});
							return
						}
						let datas = _this.$refs.formItem.formList;
						_this.userInfo.datas = JSON.stringify(datas);
						App._post_form('&p=attestation&do=infoSet', _this.userInfo, res => {
							App.navigationTo({
								url: 'pages/subPages/attestationCenter/index?rzType=' + _this.rzType
							});
						});
					}else{
						App._post_form('&p=attestation&do=infoSet', _this.userInfo, res => {
							App.navigationTo({
								url: 'pages/subPages/attestationCenter/index?rzType=' + _this.rzType
							});
						});
					}
					
				})
				
			},
			// 信息设置接口
			getInfo(mid) {
				let _this = this;
				let data = {
					type: 2,
					sid: mid,
					operation: 'get'
				};
				App._post_form('&p=attestation&do=infoSet', data, res => {
					_this.userInfo = res.data;
					_this.orderSubmitInfoData = res.data;
					_this.gopaytwo = false;
					setTimeout(()=>{
						_this.gopaytwo = true;
					},2000)
					if(_this.userInfo.moreset){
						_this.userInfo.moreset.map((item,index)=>{
							if(item.type == 'pic'){
								_this.userInfo['m' + index] = !item.value?'':item.value;
							}else if(item.type == 'pics'){
								_this.userInfo['m' + index] =  !item.value?[]:item.value;
							}else{
								_this.userInfo['m' + index] = !item.value?'':item.value;
							}
						});
					}
					
					_this.picArray = res.data.pic
				});
			},
			// 文件上传接口
			async uploadFiles(type,indexs) {
				let _this = this;
				// #ifdef H5
				if(App.getClientType() == 2){
				     let res = await App.browser_upload(1);
				     if (type == 1) {
				     	console.log(res);
				     	let img = await App._upLoad(res.tempFilePaths[0]);
				     	_this.type1Url = img.data.img;
				     	_this.type1Urlon = img.data.image;
				     	_this.userInfo['m' + indexs] = _this.type1Url;
				     } else if (type == 3) {
				     	for (let i = 0; i < res.tempFilePaths.length; i++) {
				     		let aa = await App._upLoad(res.tempFilePaths[i]);
				     		_this.userInfo.pic.splice(0, 1, aa.data.image)
				     		_this.picArray.splice(0, 1, aa.data.img)
				     	}
				     } else if (type == 2) {
				     	_this.type2Url = _this.userInfo['m' + indexs];
				     	if (_this.type2Url.length == 9) {
				     		uni.showToast({
				     			title: '最多上传九张图片',
				     			icon: 'none'
				     		});
				     		return
				     	}
				     	let imgs = await App._upLoad(res.tempFilePaths[0]);
				     	console.log(_this.type2Url,_this.userInfo['m' + indexs])
				     	_this.type2Url.push(imgs.data.img);
				     	_this.type2Urlon.push(imgs.data.image);
				     	_this.userInfo['m' + indexs] = _this.type2Url;
				     	// res.tempFilePaths.map(item=>{
				     	// 	let imgs = await App._upLoad(item);
				     	// })
				     }
				
				     return
				    }
				wxApi.choseImage(res => {
					wxApi.uoloadIg(res.localIds[0], data => {
						if (data.errMsg === 'uploadImage:ok') {
							uni.showLoading({});
							let requestData = {
								upload_type: 2,
								id: data.serverId
							};
							App._post_form(
								'&do=uploadFiles',
								requestData,
								res => {
									if (type == 1) {
										_this.type1Url = res.data.img;
										_this.type1Urlon = res.data.image;
										_this.userInfo['m' + indexs] = _this.type1Url;
									} else if (type == 3) {
										if (res.errno === 0) {
											_this.userInfo.pic[0] = res.data.image;
											_this.picArray[0] = res.data.img;
											console.info('picArray', _this.picArray)
										}
									} else if (type == 2) {
										_this.type2Url = _this.userInfo['m' + indexs] || [];
										if (_this.type2Url.length == 9) {
											uni.showToast({
												title: '最多上传九张图片',
												icon: 'none'
											});
											return
										}
										console.log(_this.userInfo['m' + indexs]);
										_this.type2Url.push(res.data.img);
										_this.type2Urlon.push(res.data.image);
										_this.userInfo['m' + indexs] = _this.type2Url;
										
									}
									_this.logocome = !_this.logocome;
									_this.logocome = !_this.logocome;
								},
								false,
								() => {
									uni.hideLoading();
								}
							);
						} else {
							uni.hideLoading();
							App.showError('上传失败');
						}
					});
				});
				// #endif
				// #ifndef H5
				wx.chooseImage({
					count: 1,
					sourceType: ['album', 'camera'],
					success: async function(res) {
						if (type == 1) {
							console.log(res);
							let img = await App._upLoad(res.tempFilePaths[0]);
							_this.type1Url = img.data.img;
							_this.type1Urlon = img.data.image;
							_this.userInfo['m' + indexs] = _this.type1Url;
						} else if (type == 3) {
							for (let i = 0; i < res.tempFilePaths.length; i++) {
								let aa = await App._upLoad(res.tempFilePaths[i]);
								_this.userInfo.pic.splice(0, 1, aa.data.image)
								_this.picArray.splice(0, 1, aa.data.img)
							}
						} else if (type == 2) {
							_this.type2Url = _this.userInfo['m' + indexs];
							if (_this.type2Url.length == 9) {
								uni.showToast({
									title: '最多上传九张图片',
									icon: 'none'
								});
								return
							}
							let imgs = await App._upLoad(res.tempFilePaths[0]);
							console.log(_this.type2Url,_this.userInfo['m' + indexs])
							_this.type2Url.push(imgs.data.img);
							_this.type2Urlon.push(imgs.data.image);
							_this.userInfo['m' + indexs] = _this.type2Url;
							// res.tempFilePaths.map(item=>{
							// 	let imgs = await App._upLoad(item);
							// })
						}
					}
				});
				// #endif
			},
		}
	};
</script>

<style lang="less" scoped>
	.bor1gray {
		width: 21upx;
		height: 21upx;
		display: inline-block;
		background: white;
		border: 1upx solid #999999;
		border-radius: 50%;
	}

	.enterpriseAttestation {
		font-size: 0;
		background-color: #f8f8f8;
	}

	.wid750 {
		width: 750upx;
		height: 340upx;
	}

	.informationView {
		width: 690upx;
		// height:496upx;
		background: rgba(255, 255, 255, 1);
		border-radius: 10upx;
	}

	.marginAuto {
		margin: auto;
	}

	

	.close {
		width: 32upx !important;
		height: 32upx !important;
		position: relative;
		bottom: 150upx;
		left: 120upx;
		z-index: 30;
	}

	

	.absolute0 {
		position: absolute;
		top: 179upx;
		width: 750upx;
	}

	.line {
		width: 8upx;
		height: 27upx;
		background: rgba(51, 136, 255, 1);
		border-radius: 4upx;
	}

	.colorBlack {
		color: rgba(51, 51, 51, 1);
	}

	.font28 {
		font-size: 28upx;
	}

	.font24 {
		font-size: 24upx;
	}

	.inlineBlock {
		display: inline-block;
	}

	.verticalM {
		vertical-align: middle;
	}

	.marginL10 {
		margin-left: 10upx;
	}

	.p30 {
		padding: 30upx;
	}

	.pL30 {
		padding: 0 30upx;
	}

	.marginT29 {
		margin-top: 29upx;
	}

	.marginT40 {
		margin-top: 40upx;
	}

	.inputView {
		width: 630upx;
		height: 83upx;
		background: rgba(250, 250, 250, 1);
		border-radius: 10upx;

		>text {
			display: inline-block;
			line-height: 83upx;
			width: 126upx;
			text-align: right;
		}

		>input {
			height: 100%;
			width: 400upx;
		}
	}

	.inputImg {
		width: 630upx;
		// background: rgba(250, 250, 250, 1);
		border-radius: 10upx;

		>text {
			display: inline-block;
			line-height: 83upx;
			width: 126upx;
			text-align: right;
		}

		>input {
			height: 100%;
			width: 400upx;
		}
	}

	.marginT18 {
		margin-top: 18upx;
	}

	.marginT35 {
		margin-top: 35upx;
	}

	.marginT30auto {
		margin: 30upx auto 0 auto;
	}

	.p0p50 {
		padding: 0 50upx;
	}

	.uploadView {
		width: 690upx;
		height: 533upx;
		background: rgba(255, 255, 255, 1);
		border-radius: 10upx;
	}

	.uploadButton {
		width: 290upx;
		height: 344upx;
		background: rgba(248, 248, 248, 1);
		border-radius: 10upx;
	}

	.color0 {
		background: rgba(248, 248, 248, 0) !important;
	}

	.flex {
		display: flex;
		justify-content: space-between;
	}

	.upLoadImg {
		width: 262upx;
		height: 319upx;
		margin-top: 13upx;
	}

	.color999999 {
		color: rgba(153, 153, 153, 1);
	}

	.color4F6D8C {
		color: #4f6d8c;
	}

	.textC {
		text-align: center;
	}

	.image22 {
		width: 22upx;
		height: 22upx;
	}

	.submitButton {
		width: 690upx;
		height: 80upx;
		background: rgba(51, 136, 255, 1);
		border-radius: 40upx;
	}

	.submitButton1 {
		width: 690upx;
		height: 80upx;
		background: #999999;
		border-radius: 40upx;
		pointer-events: none
	}

	.marginT70auto {
		margin: 70upx auto 20upx auto;
	}

	.lineHeight80 {
		line-height: 80upx;
	}

	.colorW {
		color: rgba(255, 255, 255, 1);
	}
</style>
