<template>
	<view class="content">
		<navigation>
			withdrawal
			<view class="bread" slot="bread">
				<image src="../../../static/promo/nav_icon_more@2x.png" mode="aspectFit"
					@click="invMore=true,msShow=true"></image>
			</view>
		</navigation>
		<view class="rech-body">
			<view class="pro-body-p1">Balance:<span data-v-642729fd=""
					class="category-sigh">{{currentBalance}}</span><span class="s1"></span></view>
			<view>
				<u-modal v-model="show" width="80%" :show-title="false" confirm-text="Confirm"
					confirm-color="#954DE3FF">
					<view class="" v-html="content" class="p_con"></view>
				</u-modal>
			</view>

			<view class="input-item flex">
				<view class="login-sigh login-sigh2  flex">
					<view class="imgcon">
						<image src="../../../static/promo/list_icon_meiyuan@3x.png" mode="aspectFit"></image>
					</view>
				</view>
				<input value="" placeholder="enter withdrawal amount"
					placeholder-style="color: #BFC2CCFF;font-size:14px;text-transform:capital" v-model="tranAmt"
					@input="calulate" />
			</view>
			<view class="p_con">
				<view class="fee">
					FEE:{{this.fee}}, TO ACCOUNT {{this.trueMoney}}
				</view>
				<view class="minnum">
					MINIMUM WITHDRAWAL AMOUNT: {{withdrawConfig.withdraw_limit_min}}
				</view>
			</view>
			  <view class="rech-capy">
	   		<view class="capy">
	   		<image src="../../../static/login/icon_hook@2x.png" mode="aspectFit" class="img1"></image>	 BANK CARD
	   		</view>
	   </view>
		<!-- 	<view class="rech-input-con">
				<view class="input-item flex" style="height: auto;">
					<view class="login-sigh login-sigh2  flex">
						<view class="imgcon">
							<image src="../../../static/login/list_icon_card@2x.png" mode=""></image>
						</view>
					</view>
						<input type="text" value="" placeholder="mobile phone" v-model="mobile"
						placeholder-style="color: #BFC2CCFF;font-size:14px;" />		
				</view>
			
			</view> -->
      <view class="xiala_con" :class="fujiNum==1?'activeErji':''" >
      	<view class="fuji " @click="fuji()">
      		<image src="../../../static/login/list_icon_card@2x.png" mode="aspectFit" class="img1"></image>
			<text class="text1">
				My Card：3480****6675  
			</text>
			<text class="text2">
				Select
				<image src="../../../static/color/loading_icon_ins@3x(18).png" mode="aspectFit"  class="img2"></image>
			</text>
      	</view>
		<view class="erji">
			<view class="item item-active">
				My Card：3480****6675  
			</view>
			<view class="item">
				Card 2:9200****4028
			</view>
			<view class="item" @click="goAddBankCard()">
				Add Bank Card
			</view>
		</view>
      </view>
       
	   <view class="longey_item" @click="goAddBankCard()">
		   <image src="../../../static/bankCard/list_icon_card_add@3x.png" mode="aspectFit" class="img1"></image>
	   <text class="text1">Add Bank Card</text>	
	   </view>
	   
	   <view class="input-item flex">
	   	<view class="login-sigh login-sigh2  flex">
	   		<view class="imgcon">
	   			<image src="../../../static/login/list_icon_key@2x.png" mode=""></image>
	   		</view>
	   	</view>
	   	<input type="password" value="" placeholder="Enter your login password"
	   		placeholder-style="color: #BFC2CCFF;font-size:14px;" v-model="password"  style="height: 50px;" />
	   </view>
	   
	   
	   
	   
	   
		</view>




		<view class="rech-btn-con">
			<view class="rech-btn" @click="widthDrawl" :class="btncol==1?'active':''">
				Withdrawal
			</view>
		</view>


		<view class="invite-more" v-show="invMore">
			<view class="invite-con">
				<view class="more-a" @click="goBouns">
					transactions record
				</view>
				<view class="more-a" @click="goProRe">
					withdrawl record
				</view>
				<view class="more-a" @click="gow">
					withdrawl
				</view>
			</view>
			<view class="invite-con2">
				<view class="more-a" @click="invMore=false,msShow=false">
					cancel
				</view>
			</view>
		</view>
		<view class="msg-box-bg" v-show="invMore">
		</view>
	</view>
</template>

<script>
	import api from '@/utils/api'
	import utils from '@/utils'
	import cont from "@/components/navigation/navigation.vue"
	import md5 from 'js-md5'
	export default {
		data() {
			return {
				fujiNum:-1,
				i:0,
				// 银行卡信息列表
		
				
				currentBalance: '',
				currencySymbol: '',
				withdrawConfig: [],
				show: false,
				content: '',
				password: '',
				tranAmt: '',
				mobile: '',
				fee: '',
				trueMoney: '',
				btncol: 0,
				invMore: false,
			}
		},

		onLoad() {
			this.currentBalance = uni.getStorageSync('currentBalance');
			this.mobile = uni.getStorageSync('loginMobile');
            this.init();
		},
		methods: {
			goAddBankCard(){
				uni.navigateTo({
					url:'../bankCard/addAddress/index'
				})
			},
			// 判断下拉函数
			fuji(){
				this.fujiNum=1;
				this.i++;
				if(this.i%2==0){
					this.i=0;
					this.fujiNum=-1;
				}
			},
			init(){
				const post2 = api.withdrawConfig({
					"ticket": uni.getStorageSync('logInfo').data,
				})
				post2.then(res => {
						this.withdrawConfig = res.data;
						this.content = this.withdrawConfig.tips;
						console.log(res.data, 8880);
						console.log(this.withdrawConfig, 9990);
						this.show = true;
				
					})
					.catch(e => {
						uni.showToast({
							title: e,
							icon: 'none',
							duration: 2500
						})
					})
					// 获取用户银行卡信息
				const post = api.bankcardList({
							"ticket": uni.getStorageSync('logInfo').data,
						})
						post.then(res => {
						  // this.itemList=res.data
							})
							.catch(e => {
								uni.showToast({
									title: e,
									icon: 'none',
									duration: 2500
								})
							})
			},
			gow() {
				uni.navigateTo({
					url: '../index'
				})
			},
			goBouns() {
				uni.navigateTo({
					url: './transactions/index'
				})
			},
			goProRe() {
				uni.navigateTo({
					url: './withdrawlRecord/index'
				})
			},
			calulate() {
				this.fee = this.tranAmt * 0.1;
				this.fee = parseFloat(this.fee).toFixed(2)
				this.trueMoney = this.tranAmt - this.fee;
				this.btncol = 1;
				if (this.tranAmt == '') {
					this.btncol = 0;
				}
			},
			open() {
				this.show = true;
			},
			widthDrawl() {
				// if(this.mobile==''){
				// 	uni.showToast({
				// 		title: 'Please input mobile phone number',
				// 		 icon: 'none',
				// 		duration: 1500
				// 	})
				// 	return;
				// }
				// var a= /^[0-9]{4,14}$/;
				// if(!a.test(this.mobile)){
				// uni.showToast({
				// 	title: 'Wrong format of mobile phone number',
				// 	 icon: 'none',
				// 	duration: 1500
				// })
				// return;
				// }
				// 	if (this.password == '') {
				// 		uni.showToast({
				// 			title: 'password is empty',
				// 			icon: 'none',
				// 			duration: 1500
				// 		})
				// 		return;
				// 	}
				// var a= /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{5,19}$/;
				// if(!a.test(this.password)){
				// 	uni.showToast({
				// 		title: 'Incorrect password format,a password requires a combination of numbers and letters',
				// 		icon: 'none',
				// 		duration: 1500
				// 	})
				// 	return;
				// }

				// if(this.tranAmt<withdrawConfig.withdraw_min_amt){
				//  uni.showToast({
				//  	title: 'The withdrawal amount cannot be less than the minimum withdrawal amount',
				//  	icon: 'none',
				//  	duration: 1500
				//  })
				//  return;
				// }

				// if(this.tranAmt<withdrawConfig.withdraw_max_amt){
				// 				   uni.showToast({
				// 				   	title: 'The withdrawal amount cannot be greater than the maximum withdrawal amount',
				// 				   	icon: 'none',
				// 				   	duration: 1500
				// 				   })
				// 				   return;
				// }
				uni.showLoading({
					title: 'loading'
				});
				if (this.tranAmt == '') {
					uni.showToast({
						title: 'Please enter the withdrawal amount',
						icon: 'none',
						duration: 1500
					})
					return;
				}




				const post2 = api.withdraw({
					"ticket": uni.getStorageSync('logInfo').data,
					// 'password': md5(this.password),
					"tranAmt": this.tranAmt,
				})
				post2.then(res => {
						if (res.success == true) {
							uni.showToast({
								title: res.errMsg,
								icon: 'none',
								duration: 1500
							})

							const post = api.withdrawServiceCharge({
								"ticket": uni.getStorageSync('logInfo').data,
								// 'password': md5(this.password),
								"tranAmt": this.tranAmt,
								"ticket": uni.getStorageSync('logInfo').data,
							})
							post.then(res => {
									console.log(res.data, '45464654646446');

								})
								.catch(e => {
									uni.showToast({
										title: e,
										icon: 'none',
										duration: 2500
									})
								})
						} else {
							uni.showToast({
								title: 'Withdrawal failed',
								icon: 'none',
								duration: 1500
							})
						}

					})
					.catch(e => {
						uni.showToast({
							title: e,
							icon: 'none',
							duration: 2500
						})
					})

			}

		},

	}
</script>

<style>
	@import './index.css';
</style>
