<template>
	<view style="position: relative;">
		<!-- 胶囊 -->
		<mvBar :mysNavConfig="mysNavConfig"></mvBar>
		<view :style="{marginTop:navH}"></view>
		<view class="show-form">
			<view class="show-form-cell" v-if="activeRadio == '银行卡'">
				<view class="show-form-cell-left">
					<p>银行卡号</p>
				</view>
				<view style="display: flex;justify-content: space-between;width: 550rpx;">
					<view>
						<p>{{formData.bank_card_number}}</p>
					</view>
					<view style="display: flex;align-items: center;justify-content: center;" @click="toModifyBank()">
						<p v-if="!binded">前往绑定</p>
						<p v-else>前往修改</p>
						<image class="show-body1-icon" :src="picture.icon_right"></image>
					</view>
				</view>
			</view>
			<view class="show-form-cell">
				<view class="show-form-cell-left">
					<view class="show-form-cell-left1">
						<p>提现金额</p>
					</view>
					<p>{{showTotalAmount}}</p>
				</view>
				<view>
					<p>元</p>
				</view>
			</view>
			<view class="show-form-cell">
				<view class="show-form-cell-left">
					<view class="show-form-cell-left1">
						<p>实际金额</p>
					</view>
					<p>{{showRealAmount}}</p>
				</view>
				<view>
					<p>元</p>
				</view>
			</view>
			<view class="tips">
				<p>*根据国家法规，平台需代扣代缴5%个人所得税</p>
				<p>*预计5个工作日到账，法定节假日顺延</p>
			</view>
			<view class="withdraw-btn">
				<button type="default" class="btn1" @click="withdraw()">
					确认提现</button>
			</view>
		</view>
	</view>
</template>

<script>
	import mvBar from "@/components/mys_navBar/mysNavBar";
	import {
		money
	} from '@/components/utils.js';
	export default {
		components: {
			mvBar,
		},
		data() {
			return {
				binded: false,
				navH: getApp().globalData.navHeight,
				picture: getApp().globalData.picture,
				bankType: 1,
				incomeIdList: [],
				totalAmount: 0,
				realAmount: 0,
				showRealAmount: 0,
				showTotalAmount: 0,
				activeRadio: "银行卡",
				radioGroup: ['支付宝', '银行卡'],
				formData: {},
				mysNavConfig: {
					/* 开启单页显示首页图标 */
					isHome: true,
					/* 固定导航  */
					navFixed: true,
					/* 标题 （屏幕中心居中 两边图标中心居中使用slot center1） */
					navTitle: {
						text: "申请提现",
						color: "",
						fontSize: "32rpx", // px upx rpx
						fontWeight: "normal", // 100 - 700
					},
					btnType: "type2",
					onLeftClick: "",
					/* type2 按钮 */
					type2Config: {
						// 左图标
						leftPath: "/static/img/png2.png",
						// 右图标
						rightPath: "/static/img/png4.png",
						// 圆角
						radius: "40rpx",
					},
				},
			}
		},
		onLoad(options) {
			let data = options.textObj.replace(/""/g, "");
			data = JSON.parse(decodeURIComponent(data))
			this.incomeIdList = data.incomeIdList
			this.totalAmount = data.totalAmount
			this.realAmount = (data.totalAmount * 0.95).toFixed(2)
			this.showTotalAmount = money(this.totalAmount)
			this.showRealAmount = money(this.realAmount)
		},
		async onShow() {
			await this.getInfo()			
			this.getBankInfo()
		},
		methods: {
			chan(e) {
				if (e.detail.value == "支付宝")
					this.bankType = 1
				else
					this.bankType = 2
				this.activeRadio = e.detail.value;
				console.log(this.activeRadio);
			},
			// 默认信息表，获取平台logo
			getInfo() {
				return this.$https.get('/youngee/c/g/get-info-tables')
					.then(res => {
						this.array1 = res.data.data.Bank
					})
			},
			getBankInfo() {
				this.$https.get('/youngee/c/t/g/get-talent-bank-info')
					.then(res => {
						console.log(res)
						if (res.data.data != null) {
							this.binded = true
							this.formData = res.data.data
						}else{
							this.binded = false
						}
					})
			},
			withdraw() {					
				if(!this.binded){					
					uni.showToast({
						title: "请先绑定银行卡信息",
						icon: 'none'
					})
					return
				}
				this.$https.post('/youngee/c/t/p/withdraw', {
						income_id_list: this.incomeIdList,
						total_amount: this.totalAmount,
						real_amount: this.realAmount,
						bank_type: 2,
					})
					.then(res => {
						console.log(res)
						let pages = getCurrentPages(); // 当前页面
						let beforePage = pages[pages.length - 2]; // 上一页
						setTimeout(() => {
							uni.navigateBack({
								success: function() {
									beforePage
										.onLoad(); // 执行上一页的onLoad方法
								}
							})
							uni.navigateBack()
						})
					})
			},
			toModifyBank() {
				uni.navigateTo({
					url: '/page_mycenter/myinformation/mybank'
				});
			},
			toModifyZhifubao() {
				uni.navigateTo({
					url: '/page_mycenter/myinformation/myzhifubao'
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	p {
		font-size: 32rpx;
	}

	.show-form {
		margin: 0 25rpx;
	}

	.show-form-cell {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.show-form-cell-left {
		display: flex;
		margin: 30rpx 0;
	}

	.show-form-cell-left1 {
		width: 150rpx;
	}


	.tips {
		margin: 30rpx 0;
		padding: 30rpx 20rpx;
		background-color: #eaeaea;
		border-radius: 15rpx;
	}

	.tips p {
		font-size: 28rpx;
	}

	.withdraw-btn {
		display: flex;
		align-items: center;
		width: 100%;
		position: fixed;
		bottom: 0rpx;
		display: flex;
		height: 100rpx;
		padding-top: 2%;
	}

	.btn1 {
		width: 60%;
		background-color: #f2d22d;
		color: #000;
		border-color: #ffffff;
		border-radius: 10rpx;
		font-size: 36rpx;
		line-height: 240%;
		letter-spacing: 10rpx;
		font-weight: 500;
		height: 80%;
	}

	.show-body1-icon {
		width: 30rpx;
		height: 30rpx;
	}
</style>
