<template>
	<view class="center">
		<view>	
			<text @click='consent' v-bind:class="switchs1">公司</text>
			<text  @click='consent' v-bind:class="switchs2">个人</text>
		</view>
		<view v-if="consentStatus == true">
			<view>
				<view style="margin: 0 auto;" v-if="license1 != ''" @click="license">
					<image v-bind:src = "license1" class="picture"></image>
				</view>
			</view>
			
			<view class="personalcss">
			<view class="c-row b-b">
				<text class="tit">公司名称</text>
				<view class="con-list">
					<input placeholder="请填写公司名称" name="input" v-model="deptList.compName"></input>
				</view>
			</view>
			<view class="c-row ">
				<text class="tit">纳税人识别号</text>
				<view class="con-list">
				<input placeholder="请填写纳税人识别号" name="input" v-model="deptList.payTaxesCard"></input>
				</view>
			</view>
			</view>
			
			<view>
			
				<view style="margin: 0 auto;" v-if="idup != ''" @click="idUp">
					<image v-bind:src = "idup" class="picture"></image>
				</view>
		
				<view style="margin: 0 auto;" v-if="idlow != ''" @click="idLow">
					<image v-bind:src = "idlow" class="picture"></image>
				</view>
			</view>
			<view class="personalcss">
			<view class="c-row b-b">
				<text class="tit">姓名</text>
				<view class="con-list">
					<input placeholder="请填写姓名" name="input" v-model="deptList.customerName"></input>
				</view>
			</view>
			<view class="c-row ">
				<text class="tit">身份证号</text>
				<view class="con-list">
					<input placeholder="请填写身份证号" name="input"
						v-model="deptList.customerNumberCard"></input>
				</view>
			</view>
			</view>
			<view>
		
				<view style="margin: 0 auto;" v-if="bank1 != ''"  @click="bankUp()">
					<image v-bind:src = "bank1" class="picture"></image>
				</view>

				<view style="margin: 0 auto;" v-if="bank2 != ''" @click="bankLow()">
					<image v-bind:src = "bank2" class="picture"></image>
				</view>
			</view>
			<view class="personalcss">
			<view class="c-row b-b">
				<text class="tit">银行卡号</text>
				<view class="con-list">
					<input placeholder="请填写银行卡号" name="input" v-model="deptList.bankCard"></input>
				</view>
			</view>
			<view class="c-row b-b">
				<text class="tit">开户行</text>
				<view class="con-list">
				<input placeholder="请填写开户行" name="input" v-model="deptList.bankDeposit"></input>
				</view>
			</view>
			<view class="c-row b-b">
				<text class="tit">开户支行</text>
				<view class="con-list">
				<input placeholder="请填写开户支行" name="input"
					v-model="deptList.bankDepositBranch"></input>
				</view>
			</view>
			<view class="c-row b-b">
				<text class="tit">手机号</text>
				<view class="con-list">
						<input placeholder="请填写手机号" @input='phoneinput' v-model="deptList.customerPhone"></input>
				</view>
			</view>
			<view class="c-row ">
				<text class="tit">公司地址</text>
				<view class="con-list">
					<input placeholder="请填写公司地址" name="input" v-model="deptList.compAddress"></input>
				</view>
			</view>
		</view>
		</view>
		<view v-else>
			<view>
				<view style="margin: 0 auto;" v-if="idup != ''" @click="idUp">
					<image v-bind:src = "idup" class="picture"></image>
				</view>
						
				<view style="margin: 0 auto;" v-if="idlow != ''" @click="idLow">
					<image v-bind:src = "idlow" class="picture"></image>
				</view>
			</view>
			<view class="personalcss">
			<view class="c-row b-b">
				<text class="tit">姓名</text>
				<view class="con-list">
					<input placeholder="请填写姓名" name="input" v-model="deptList.customerName"></input>
				</view>
			</view>
			<view class="c-row b-b">
				<text class="tit">身份证号</text>
				<view class="con-list">
					<input placeholder="请填写身份证号" name="input"
						v-model="deptList.customerNumberCard"></input>
				</view>
			</view>
			</view>
			<view>
				<view style="margin: 0 auto;" v-if="bank1 != ''"  @click="bankUp()">
					<image v-bind:src = "bank1" class="picture"></image>
				</view>
				
				<view style="margin: 0 auto;" v-if="bank2 != ''" @click="bankLow()">
					<image v-bind:src = "bank2" class="picture"></image>
				</view>
			</view>
			<view class="personalcss">
			<view class="c-row b-b">
				<text class="tit">银行卡号</text>
				<view class="con-list">
					<input placeholder="请填写银行卡号" name="input" v-model="deptList.bankCard"></input>
				</view>
			</view>
			<view class="c-row b-b">
				<text class="tit">开户行</text>
				<view class="con-list">
					<input placeholder="请填写开户行" name="input" v-model="deptList.bankDeposit"></input>
				</view>
			</view>
			<view class="c-row b-b">
				<text class="tit">开户支行</text>
				<view class="con-list">
					<input placeholder="请填写开户支行" name="input"
						v-model="deptList.bankDepositBranch"></input>
				</view>
			</view>
			<view class="c-row b-b">
				<text class="tit">收款人姓名</text>
				<view class="con-list">
					<input placeholder="请填写收款人姓名" name="input" v-model="deptList.payeeName"></input>
				</view>
			</view>
			<view class="c-row">
				<text class="tit">收款人身份证号</text>
				<view class="con-list">
					<input placeholder="请填写收款身份证号" name="input"
						v-model="deptList.payeeNumberCard"></input>
				</view>
			</view>
			<view class="c-row b-b">
				<text class="tit">手机号</text>
				<view class="con-list">
				<input placeholder="请填写手机号" @input='phoneinput' v-model="deptList.customerPhone"></input>
				</view>
			</view>
			<view class="c-row ">
				<text class="tit">联系地址</text>
				<view class="con-list">
					<input placeholder="请填写联系地址" name="input" v-model="deptList.compAddress"></input>
				</view>
			</view>
		
		</view>
</view>
			<button class="btn btns" @click="commitEdit">修改</button>

	</view>
</template>

<script>
	import {
	    mapState 
	} from 'vuex';
	export default {
		name: "buy",
		data() {
			return {
				radios: 2,
				deptList:{
					compName:"",
					payTaxesCard:"",
				},
				consentStatus:true,
				consentStatus1:false,
				parameter:{},
				businessman:{},
				id:[],
				idup:"",
				idlow:"",
				license1:"",
				bank1:"",
				bank2:"",
				bankid:[],
				payeeAddress:[],
				commitEdits:{},
				switchs1:"switchs1",
				switchs2:"switchs2",
			};
		},
		onLoad(option) {
			this.parameter.id = option.id,
			this.getList()
		},
		computed: {
			...mapState(['hasLogin','userInfo'])
		},
		methods: {
			commitEdit(item){
				console.log(this.deptList.compName,"公司名称")
				this.deptList.commonId = this.userInfo.id
				this.deptList.cardAddressUrl = this.id.toString()
				this.deptList.payeeAddressUrl = this.bankid.toString()
				if(this.consentStatus1 == true){
					this.deptList.customerTypeFlag = "个人"
				}else if(this.consentStatus == true){
					this.deptList.customerTypeFlag = "企业"
				}
				// console.log(this.deptList,"编辑对象")
				this.$api.doRequest('post', '/identityAuthenticationInfo/api/editIdentityAuthenticationInfo', this.deptList, 'application/json;charset=UTF-8').then(res => {
						console.log("成功连接")
						if (!this.deptList.goodsName) {
							this.$api.msg('修改成功！')
							
							return
						}
						uni.navigateTo({
							url: `/pages/attestation/index`
						})
					
					})
					.catch(res => {
						if(res.errmsg){
							uni.showToast({
								title: res.errmsg,
								icon: 'none',
								duration: 2000
							})
						}
						else{
							uni.showToast({
								title: "系统异常，请联系管理员",
								icon: 'none',
								duration: 2000
							})
						}
					});
				
				
				},
				license() {
					var that = this
					uni.chooseImage({
						success: function(res) {
							uni.uploadFile({
								url: 'https://www.zthymaoyi.com/upload/admin',
								filePath: res.tempFilePaths[0],
								name: 'file',
								success(res) {
									var data = res.data
									var strToObj = JSON.parse(data)			
									that.deptList.businessLicenseAddressUrl = strToObj.url
									that.license1 = strToObj.url
								}
							})
						}
					})
				},
				idUp(){
					var that = this
					uni.chooseImage({
						success: function(res) {
							uni.uploadFile({
								url: 'https://www.zthymaoyi.com/upload/admin',
								filePath: res.tempFilePaths[0],
								name: 'file',
								success(res) {
									var data = res.data
									var strToObj = JSON.parse(data)			
									that.id[0] = strToObj.url
									that.idup = strToObj.url
								}
							})
						}
					})
				},
				idLow(){
					var that = this
					uni.chooseImage({
						success: function(res) {
							uni.uploadFile({
								url: 'https://www.zthymaoyi.com/upload/admin',
								filePath: res.tempFilePaths[0],
								name: 'file',
								success(res) {
									var data = res.data
									var strToObj = JSON.parse(data)			
									that.id[1] = strToObj.url
									that.idlow = strToObj.url
								}
							})
						}
					})
				},
				bankUp(){
					var that = this
					uni.chooseImage({
						success: function(res) {
							uni.uploadFile({
								url: 'https://www.zthymaoyi.com/upload/admin',
								filePath: res.tempFilePaths[0],
								name: 'file',
								success(res) {
									var data = res.data
									var strToObj = JSON.parse(data)			
									that.bankid[0] = strToObj.url
									that.bank1 = strToObj.url
								}
							})
						}
					})
				},
				bankLow(){
					var that = this
					uni.chooseImage({
						success: function(res) {
							uni.uploadFile({
								url: 'https://www.zthymaoyi.com/upload/admin',
								filePath: res.tempFilePaths[0],
								name: 'file',
								success(res) {
									var data = res.data
									var strToObj = JSON.parse(data)			
									that.bankid[1] = strToObj.url
									that.bank2 = strToObj.url
								}
							})
						}
					})
				},
			getList(ids) {		
					this.$api.doRequest('get', '/identityAuthenticationInfo/api/getIdentityAuthenticationInfo', this.parameter, 'application/json;charset=UTF-8').then(res => {
							console.log("成功连接")
				
							this.deptList = res.data.data
							if(this.deptList.businessLicenseAddressUrl != ""){
								this.license1 = this.deptList.businessLicenseAddressUrl
							}
							if(this.deptList.cardAddressUrl != ""){
								this.id = this.deptList.cardAddressUrl.split(",")
								this.idup = this.id[0]
								this.idlow = this.id[1]
							}
							if(this.deptList.payeeAddressUrl != ""){
								this.payeeAddress = this.deptList.payeeAddressUrl.split(","),
							this.bank1 = this.payeeAddress[0]
							this.bank2 = this.payeeAddress[1]
							}
							console.log(this.deptList.customerTypeFlag,"判断")
							if(this.deptList.customerTypeFlag == 2){
								this.consentStatus = true
								this.consentStatus1 = false
								this.switchs1 = "switchs1"
								this.switchs2 = "switchs2"
							}else{
								this.consentStatus = false
								this.consentStatus1 = true
								this.switchs1 = "switchs2"
								this.switchs2 = "switchs1"
							}
		
						})
						.catch(res => {
							if(res.errmsg){
								uni.showToast({
									title: res.errmsg,
									icon: 'none',
									duration: 2000
								})
							}
							else{
								uni.showToast({
									title: "系统异常，请联系管理员",
									icon: 'none',
									duration: 2000
								})
							}
						});
			},
			consent(){
				if(this.consentStatus == false && this.consentStatus1 == true){
					this.consentStatus = true
					this.consentStatus1 = false
					this.switchs1 = "switchs1"
					this.switchs2 = "switchs2"
				}else if(this.consentStatus == true && this.consentStatus1 == false){
					this.consentStatus = false
					this.consentStatus1 = true
					this.switchs1 = "switchs2"
					this.switchs2 = "switchs1"
				}
				
			},
			
		}
	}
</script>

<style>
	.center {
		padding: 10px 20px;
	}

	.c-row {
		display: -webkit-box;
		display: -webkit-flex;
		display: flex;
		-webkit-box-align: center;
		-webkit-align-items: center;
		align-items: center;
		padding: 20rpx 30rpx;
		position: relative;
	}

	.con-list {
		-webkit-box-flex: 1;
		-webkit-flex: 1;
		flex: 1;
		display: -webkit-box;
		display: -webkit-flex;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-webkit-flex-direction: column;
		flex-direction: column;
		color: #303133;
		line-height: 40rpx;
		text-align: right;
		padding-right: 20rpx;
		font-size: 14px;
	}
	.picture{
		width: 100%;
		 height: 220px;
		 text-align: center;
		 margin-top: 10px;
	}
	.fujians{
		margin: 0 auto;
		background-color: #FFFFFF;
		margin-top: 30px;
		border-radius: 20px;
		padding: 10px 10px;
	}
	.picturebiaoti{
		font-size: 17px;
		font-weight: 700;
	}
	.personalcss{
		background-color: #FFFFFF;
		border-radius: 20px;
		margin-top: 10px;
	}
	.btn {
		margin-top: 10px;
		background-color: #FFFFFF;
		border-radius: 25px;
		border: none;
	}
	
	.btns {
		background-color: #22C572;
		color: white;
	}
	.switchs1{
		font-size: 20px;
		font-weight: 700;
		margin-right: 16px;
	}
	.switchs2{
		font-size: 20px;
		margin-right: 16px;
	}
</style>
