duantuihe/pages/my/cash/index.vue

<template>
	<view class="container">
		<navBar title="提现" :back="true" color="#333333" background="#FFFFFF" />

		<view class='box'>
			<view class='addpd'>
				<view class='top'>
					<view class='left'>
						提现方式
					</view>
					<view class='right' @click="handleOpen">
						<image class='icon' mode=""
							:src="currWayIndex[0]==0?picBase+'wechat.png':currWayIndex[0]==1?picBase+'zhifubao.png':picBase+'yhk.png'" />
						{{currWay}}
						<image class='icon_arrR' mode="" :src="picBase+ 'c_arrR.png'" />
					</view>
				</view>


				<view class='money'>
					<view class='label'>
						提现金额
					</view>
					<view class='bot'>
						<view class='left'>
							<view class='danwei'>
								￥
							</view>
							<input class="" placeholder="请输入提现金额" v-model="formData.money">
							</input>
						</view>
						<view class='tips'>
							可提现余额￥{{availMoney}}
						</view>
					</view>
				</view>


				<view class='info'>
					<view class='item bb'>
						<view class='label'>
							名字
						</view>
						<input class="" placeholder="名字" v-model="formData.name">
						</input>
					</view>

					<view class='item bb' v-if="currWay=='银行卡'">
						<view class='label'>
							开户行
						</view>
						<input class="" placeholder="请输入开户行名称" v-model="formData.bankName">
						</input>
					</view>

					<view class='item'>
						<view class='label'>
							账号
						</view>
						<input class="" placeholder="账号" v-model="formData.account">
						</input>
					</view>
				</view>


				<view class='botTxt'>
					<!-- <image class='icon' mode="" src="{{picBaseUrl+'winfo.png'}}"/> -->
					<image class='icon' mode="" :src="picBase+'info_b.png'" />

					<view class='right'>
						<view class='item' @click="toCashRecord">
							提现记录
						</view>

						<view class='item' style="color:black;margin-top: 10rpx;">
							单次最低提现金额为{{min}}元
						</view>
						<view class='item' style="color:black;">
							收取提现金额的{{Ratio}}%手续费
						</view>
						<view class='item' style="color:black;">
							如有疑问，请及时联系客服
						</view>
					</view>
				</view>
			</view>
		</view>
		<u-picker :show="showPopup" :columns="wayList" title="提现方式" aColor="#007AFF" :defaultIndex="currWayIndex"
			:closeOnClickOverlay="true" @confirm="handleConfirm" @cancel="showPopup=false"></u-picker>

		<view class="btnBox">
			<view class="btn" @click="post">
				提交申请
			</view>
		</view>

	</view>
</template>

<script>
	// import navBar from '@/components/navBar/index.vue'

	import {
		userWithdraw,
		getYongjinList,
		getPosterBg
	} from '@/api/index/index.js'
	export default {
		// components: {
		// 	navBar
		// },
		data() {
			return {
				picBase: this.$picBase2,
				wayList: [
					[
						'微信余额',
						'支付宝',
						'银行卡'
					]
				],

				currWay: '微信余额',
				currWayIndex: [0],
				availMoney: 0,
				formData: {
					money: '',
					name: '',
					account: '',
					bankName: ''
				},
				showPopup: false,

				Ratio: 0,
				min: 0

			}
		},
		onLoad(o) {
			// if (getApp().availMoney) {
			// this.availMoney = Number(o.availMoney || 0)
			// console.log('传递过来的可提现余额', o.availMoney)
			// }
			this.getCashTip()
		},
		onShow() {
			this.getYongjinList()
		},
		methods: {
			async getCashTip() {
				let res1 = await getPosterBg({
					key: 'withdraw'
				})
				console.log('提现提示返回值--------1', res1);
				if (res1.code == 0) {
					this.Ratio = res1.data.value
				} else {
					this.$toast(res1.message)
				}

				let res2 = await getPosterBg({
					key: 'withdraw_min'
				})
				console.log('提现提示返回值--------2', res2);
				if (res2.code == 0) {
					this.min = res2.data.value
				} else {
					this.$toast(res2.message)
				}
			},


			async getYongjinList() {
				let res1 = await getYongjinList()
				console.log('佣金明细返回值--------', res1);
				if (res1.code == 0) {
					this.availMoney = Number(res1.data.withdrawIncome || 0)
					console.log('可提现佣金--------', this.availMoney);
				} else {
					this.$toast(res1.message)
				}
			},
			async post() {
				if (Number(this.formData.money) > this.availMoney) {
					return wx.showToast({
						title: '可提现余额不足',
						icon: 'none'
					})
				} else
				if (!this.formData.money) {
					return wx.showToast({
						title: '请输入提现金额',
						icon: 'none'
					})
				} else if (Number(this.formData.money) < Number(this.min)) {
					return wx.showToast({
						title: '单次最低提现金额为' + this.min,
						icon: 'none'
					})
				} else if (!this.formData.name) {
					return wx.showToast({
						title: '请输入名字',
						icon: 'none'
					})
				} else if (!this.formData.bankName && this.currWay == '银行卡') {
					return wx.showToast({
						title: '请输入开户行名称',
						icon: 'none'
					})
				} else if (!this.formData.account) {
					return wx.showToast({
						title: '请输入账号',
						icon: 'none'
					})
				}

				let p = {}

				if (this.currWayIndex[0] == 0) {
					p = {
						type: this.currWayIndex[0] + 1,
						amount: this.formData.money,
						name: this.formData.name,
						number: this.formData.account,
					}
				} else if (this.currWayIndex[0] == 1) {
					p = {
						type: this.currWayIndex[0] + 1,
						amount: this.formData.money,
						name: this.formData.name,
						number: this.formData.account,
					}
				} else {
					p = {
						type: this.currWayIndex[0] + 1,
						amount: this.formData.money,
						name: this.formData.name,
						number: this.formData.account,
						bank_name: this.formData.bankName,
					}
				}
				console.log('提现参数', p, this.formData, this.currWayIndex[0]);

				// return
				let res1 = await userWithdraw(p)
				console.log('提现返回值--------', res1);
				if (res1.code == 0) {
					this.$toast('提交成功', 'success')
					setTimeout(() => {
						uni.redirectTo({
							url: '/pages/my/cashRecord/index'
						})
					}, 1500)
				} else {
					this.$toast(res1.message)
				}
			},


			handleConfirm(e) {
				console.log('e', e, );
				this.currWay = e.value[0]
				this.currWayIndex = e.indexs
				this.showPopup = false
			},
			handleOpen() {
				this.showPopup = true
			},
			// post() {
			// 	console.log('提现参数', this.formData, this.currWayIndex);
			// },
			toCashRecord() {
				uni.navigateTo({
					url: '/pages/my/cashRecord/index'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import "./index.scss";
</style>