<template>
	<view class="page">
		<far-bottom></far-bottom>
		<block v-if="isPageShow">
			<view class="header-content b-f m-btm20">
				<view >
					
				</view>
				<view class="tx-title f-28 col-3">提现金额</view>
				<view class="money-input dis-flex flex-y-center">
					<view class="money-icon">¥</view>
					<input type="digit" class="input" value="" placeholder="请输入提现金额" placeholder-class="placeinput" v-model="tx_money" />
				</view>
				<view class="tx-moneyShow dis-flex flex-x-between flex-y-center">
					<view class="f-24 col-9" style="line-height: 0upx;height: 60upx;">可提现(元):{{drawPrice}}</view>
					<view class="all-txBtn f-28 col-f t-c" @click="alltx(0)">全部提现</view>
				</view>
				<view style="color: #FF4444;font-size: 22upx;margin-top: 10upx;">提现金额{{min_money}}元起,<text v-if="max_money !== 999999999">单次最高提现金额{{max_money}}元</text>提现手续费{{withdrawcharge}}%</view>
				<view>
				</view>

				
			</view>
			<form @submit="formSubmit">
				<view class="with-opContent b-f m-btm20">
					<view class="tx-title f-28 col-3">提现到</view>
					<view class="op-content">
						<view class="op-list">
							<radio-group @change="precedenceChange" name="payment_type">
								<label v-for="(item, index) in txlist" :key="index" class="label-classtyle dis-flex flex-x-between" style="flex-wrap: wrap;">
									<view class="dis-flex flex-y-center" style="flex: 0.5;">
										<view class="op-imag">
											<image :src="imgfixUrls +  item.imag" mode=""></image>
										</view>
										<view class="f-28 col-3">{{(item.title == '账户')?item.title + TextSubstitution.moneytext:item.title}}</view>
									</view>
									<view style="flex: 0.5;">
										<radio :value="item.pay_type" :checked="index === prececurrent" />
									</view>
									<view class="userMsg-content" style="flex: 1;min-width: 80%;">
										<!-- 渠道2 -->
										<view class="yhk-msg-list" v-if="atpresent==='3' && item.pay_type ==='3'">
											<view class="msg-items dis-flex flex-y-center">
												<view class="msg-title f-24 col-3">开户姓名</view>
												<input class="f-24" type="text" :value="user_info.bank_username" name="bank_username" placeholder="请输入姓名" placeholder-class="placemsg-items" />
											</view>
											<view class="msg-items dis-flex flex-y-center">
												<view class="msg-title f-24 col-3 onelist-hidden">开户{{examineing==0?'银行':'渠道2'}}</view>
												<!-- <picker name="bank_name" style="width: 72%;" :value="bankNameIndex" :range="bankNameList" range-key="name"> -->
												<!-- {{bankNameList[bankNameIndex]['name']}} -->
												<!-- <view class="f-24" style="height: 52.5upx;line-height: 52.5upx;">123456</view> -->
												<!-- </picker> -->
												<input class="f-24" type="text" :value="user_info.bank_name" name="bank_name" :placeholder="examineing==0?'请输入开户银行':'请输入开户渠道2'" placeholder-class="placemsg-items" />
											</view>
											<view class="msg-items dis-flex flex-y-center">
												<view class="msg-title f-24 col-3">{{examineing==0?'银行卡':'渠道2'}}号</view>
												<input class="f-24" type="text" :value="user_info.card_number" name="card_number" :placeholder="examineing==0?'请输入银行卡号':'请输入开户渠道2号'" placeholder-class="placemsg-items" />
											</view>
										</view>
										<view class="yhk-msg-list" v-if="atpresent==='1' && item.pay_type ==='1'">
											<!-- 							<view class="msg-items dis-flex flex-y-center">
												<view class="msg-title f-24 col-3">真实姓名</view>
												<input class="f-24" type="text" value="" name="alipay_name" placeholder="请输入姓名" placeholder-class="placemsg-items" />
											</view> -->
											<view class="msg-items dis-flex flex-y-center">
												<view class="msg-title f-24 col-3">{{examineing==0?'支付宝账':'渠道1'}}号</view>
												<input class="f-24" type="text" :value="user_info.alipay" name="alipay" :placeholder="examineing==0?'请输入支付宝账号':'请输入渠道1账号'" placeholder-class="placemsg-items" />
											</view>
										</view>
										<view class="last-hint f-24 col-9" v-if=" item.pay_type ==='1' && atpresent==='1' || item.pay_type ==='3' && atpresent==='3'">请务必填写真实信息
											<text>*</text>
										</view>
									</view>
								</label>
							</radio-group>
						</view>
					</view>
					
				</view>
				<view class="sub-btn">
					<!-- {{appDiyFont.to_examine}} -->
					<button class="f-28 col-f" formType="submit">提现审核</button>
				</view>
			</form>
		</block>
		<!-- <page-loading ref="loading"></page-loading> -->
	</view>
</template>

<script>
	import App from "@/common/js/app.js";
	export default {
		data() {
			return {
				bankNameList: [],
				bankNameIndex: 0,
				atpresent: '',
				prececurrent: 0,
				txlist: [{
						id: 'we_chat',
						title: '微信零钱',
						imag: 'checkout/weixin.png',
						pay_type: "2"
					},
					{
						id: 'alipay',
						title: '渠道1',
						imag: 'checkout/zhifubao.png',
						pay_type: "1"

					},
					{
						id: 'bank_card',
						title: '渠道2账户',
						imag: 'checkout/card.png',
						pay_type: "3"
					},
					{
						id: 'balance',
						title: '账户',
						imag: 'checkout/yue.png',
						pay_type: "4"
					}
				],
				isPageShow: true,
				tx_money: null, //输入提现金额,
				drawPrice: null, //可提现金额,
				user_info: {}, // 个人信息设置
				withdrawcharge: null, //提现手续费
				min_money: "1", //最小提现申请金额（默认最小为1元）；单位：元
				max_money:'9999999',
				TextSubstitution:{},
				is_blindDate: false,
				examineing:1
			}
		},
		components: {

		},
		computed: {
			// appDiyFont() {
			// 	let appSetting = this.$store.state.appSetting;
			// 	if (appSetting) {
			// 		return appSetting.diy_font
			// 	}
			// }
		},
		beforeCreate() {

		},
		onLoad(options) {
			if(options.is_blindDate) {
				this.is_blindDate = options.is_blindDate
			}
			this.TextSubstitution = uni.getStorageSync('TextSubstitution');
			this.examineing = this.TextSubstitution.examineing || 0;
			if(this.examineing == 0){
				this.txlist[1].title = '支付宝'
				this.txlist[2].title = '银行卡'
			}
		},

		onShow() {

		},
		mounted() {
			this.withdrawDetail()
		},
		methods: {
			navgateTo() {
				App.navigationTo({
					url: 'pages/subPages/dealer/withdraw/withdrawrecord'
				})
			},
			/**
			 * 获取提现详情
			 */
			withdrawDetail() {
				let _this = this;
				App._post_form('&p=dating&do=getMatchmakerWithdrawal', {}, res => {
					_this.setData(res.data);
					_this.drawPrice = res.data.commission
					_this.withdrawcharge = res.data.service_charge
					// _this.max_money = 1;
					if(_this.max_money == 0){
						_this.max_money = 999999999;
					}
					_this.user_info = res.data.user_info;
					let payment_set = res.data.type,
						{
							txlist
						} = _this,
						txlist_toStr = txlist.toString(),
						newtxlist = [];
					if (payment_set !== 0) {
						for (let i = 0; i < txlist.length; i++) {
							if (txlist_toStr.indexOf(txlist[i].toString()) > -1) {
								for (let key in payment_set) {
									if (txlist[i].id === key) {
										if (payment_set[key] === "1") {
											newtxlist.push(txlist[i]);
											_this.atpresent = newtxlist[0].pay_type
											break;
										}
									}
								}
							}
							_this.setData({
								txlist: newtxlist
							})
						}
					}
				}, false, () => {})
			},
			/**
			 * 提现类型选择
			 */
			precedenceChange(evt) {
				for (let i = 0; i < this.txlist.length; i++) {
					if (this.txlist[i].pay_type === evt.target.value) {
						this.prececurrent = i;
						break;
					}
				}
				this.atpresent = evt.target.value;
			},
			/**
			 * 全部金额提现按钮
			 */
			alltx(num = '0') {
				let _this = this,
					drawPrice = _this.drawPrice;
					if(num !== 0){
						if(num == 1){
							_this.tx_money = Number(drawPrice);
						}else{
							_this.tx_money = Number(_this.max_money);
						}
					}else{
						if (!!drawPrice && Number(drawPrice) > 0 && Number(_this.max_money) >= Number(drawPrice)) {
							
							_this.tx_money = Number(drawPrice);
						} else if(Number(_this.max_money) < Number(drawPrice) && Number(drawPrice) > 0){
							uni.showToast({
								icon:'none',
								title:`单次最大可提现金额为${_this.max_money}`,
								duration:2000
							})
							// App.showError(``);
							_this.tx_money = Number(_this.max_money);
						}else{
							uni.showToast({
								icon:'none',
								title:`没有可提现金额`,
								duration:2000
							})
							
						}
					}
				
			},
			/**
			 * 申请提现
			 */
			withdraw(fromData) {
				uni.showLoading({})
				let that = this;
				App._post_form('&p=dating&do=matchmakerWithdrawal', {
					...fromData
				}, (result) => {
					console.log(result, '申请提现')
					if (result.errno === 0) {
						console.log(result)
						App.showSuccess('申请提现成功', () => {
							App.navigationTo({
								url: `pages/subPages/dealer/withdraw/withdrawrecord?draw_id=${result.data.id}`,
								navType: "rediRect"
							});
							if(that.is_blindDate) {
								uni.navigateBack()
							}
						})
					}
				}, false, () => {
					uni.hideLoading()
				})
			},
			/**
			 * 表单
			 */
			formSubmit(e) {
				let _this = this,
					fromData = {},
					{
						min_money,
						tx_money,
						drawPrice,
						withdrawcharge
					} = _this;
				fromData = e.detail.value;
				fromData.sapplymoney = tx_money;
				console.log(fromData)
				if (!_this.tx_money) {
					App.showError('请输入提现金额')
					return;
				}
				// if (Math.round(tx_money * 100) / 100 < Number(min_money) ||
				// 	(Math.round(tx_money * 100) / 100 > Number(drawPrice))) {
				// 	App.showError(`请检查输入金额是否小于最少提现金额${min_money}元或输入金额大于可提现金额`)
				// 	return;
				// }
				if (_this.atpresent === "30") {
					if (!fromData.bank_username) {
						App.showError('请输入开户姓名')
						return;
					}
					if (!fromData.bank_name) {
						App.showError(this.examineing == 0?'请输入正确开户银行':'请输入正确开户渠道2')
						return;
					}
					if (fromData.card_number.length < 13 || fromData.card_number.length > 25) {
						App.showError(this.examineing == 0?'请输入正确的银行卡号':'请输入渠道2号')
						return;
					}
				}
				if (_this.atpresent === "20") {
					// if (!fromData.alipay_name) {
					// 	App.showError('请输入真实姓名')
					// 	return false
					// }
					if (!fromData.alipay) {
						App.showError(this.examineing == 0?'请输入支付宝':'请输入渠道1账号')
						return;
					}
				}
				if (withdrawcharge == '' || withdrawcharge == '0') {
					withdrawcharge = 0
				}
				// if(Number(_this.tx_money)>Number(_this.max_money) || Number(_this.tx_money)>Number(_this.drawPrice)){
				// 	if(Number(_this.max_money)>Number(_this.drawPrice)){
				// 		uni.showToast({
				// 			icon:'none',
				// 			title:`本次最大可提现金额为${_this.drawPrice}`,
				// 			duration:2000
				// 		});
				// 		_this.alltx(1)
				// 	}else{
				// 		uni.showToast({
				// 			icon:'none',
				// 			title:`单次最大可提现金额为${_this.max_money}`,
				// 			duration:2000
				// 		});
				// 		_this.alltx(2)
				// 	}
				// 	// App.showError(``);
					
					
				// 	return;
				// }
				// let reali_price = (Math.round(tx_money * 100) / 100) * ((100 - Number(withdrawcharge)) / 100);
				// let realTimePrice = Math.round((reali_price - (Number(withdrawcharge) / 100 * reali_price)) * 100) / 100;//四舍五入
				let calculate = {
					money: tx_money,
					percent: Number(withdrawcharge)
				}
				App._post_form('&p=pay&do=calculationCash', calculate, res => {
					if (res.errno === 0) {
						let conpmoney = res.data.realmoney;
						console.log(conpmoney);
						if(Number(conpmoney) < 1){
							uni.showToast({
								title:'最低实得金额不能小于1元,当前实得金额' + conpmoney + '元',
								icon:'none'
							})
							return
						}
						App.showError(
							`确认提现${tx_money}元,实得${conpmoney}元`, (data) => {
								if (data.confirm) {
									!!data && _this.withdraw(fromData)
								}
							}, true)
					}
				})
				// App.showError(
				// 	`确认提现${tx_money}元,实得${realTimePrice}元`, (data) => {
				// 		if (data.confirm) {
				// 			!!fromData && _this.withdraw(fromData)
				// 		}
				// 	}, true)
			},
		}
	}
</script>

<style scoped>
	page {
		background: #F7F7F7;
	}

	.page {
		padding: 30upx 30upx;
	}

	.header-content {
		padding: 40upx 36upx 30upx 36upx;
		border-radius: 10upx;
	}

	.tx-title {
		margin-bottom: 40upx;
	}

	.placeinput {
		font-size: 30upx;
		height: 52upx;
		line-height: 52upx;
	}

	.money-icon {
		/* margin-right: 20upx; */
		font-size: 28upx;
		padding-top: 8upx;
		margin-right: 10upx;
		/* 	height: 1em;
		line-height: 1em; */
	}

	.money-input {
		padding-bottom: 20upx;
		border-bottom: 1px solid #EEEEEE;
		/* align-items: baseline; */
	}

	.money-input .input {
		width: 100%;
		font-size: 36upx;
		/* 		height: 1.1em;
		line-height: 1.1em; */
	}

	.tx-moneyShow {
		padding-top: 34upx;
	}

	.tx-moneyShow .all-txBtn {
		background-color: #F44F44;
		width: 184upx;
		height: 70upx;
		line-height: 70upx;
		background: rgba(244, 79, 68, 1);
		border-radius: 35upx;
	}

	.with-opContent {
		border-radius: 10upx;
		padding: 36upx 36upx 0 36upx;
	}

	.op-imag {
		margin-right: 15upx;
	}

	.op-imag image {
		width: 50upx;
		height: 50upx;
		vertical-align: middle;
	}

	.label-classtyle {
		padding: 20upx 0;
		border-bottom: 1px solid #EEEEEE;
	}

	.label-classtyle:last-child {
		border: none;
	}

	.userMsg-content {
		padding: 0 58upx;
	}

	.msg-title {
		width: 30%;
		margin-right: 30upx;
	}

	.msg-items {
		border-bottom: 1px solid #EEEEEE;
		padding: 26upx 0;
	}

	.placemsg-items {
		color: #999999;
	}

	.last-hint {
		position: relative;
		text-align: left;
		padding: 30upx 14upx 30upx 180upx;
	}

	.last-hint text {
		/* display: block; */
		/* position: absolute; */
		color: red;
		font-size: 22upx;
		padding-left: 10upx;
	}

	.sub-btn button {
		background: #F44F44;
		height: 84upx;
		line-height: 84upx;
		text-align: center;
		border-radius: 42upx;
	}

	.input-hidden {
		width: 0;
		height: 0;
		opacity: 0;
	}

	/* #ifdef H5*/
	radio>>>.uni-radio-input {
		/* 自定义样式.... */
		height: 36upx;
		width: 36upx;
		margin-top: -4upx;
		border-radius: 50%;
		border: 2upx solid #999;
		background: transparent;
	}

	radio>>>.uni-radio-input.uni-radio-input-checked {
		background-color: #F44F44 !important;
		border-color: #F44F44 !important;
	}

	/* #endif */
</style>
