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?'../../../static/other/wechat.png':currWayIndex[0]==1?'../../../static/other/zhifubao.png':'../../../static/other/yhk.png'" />
						{{currWay}}
						<image class='icon_arrR' mode="" src="../../../static/other/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="../../../static/other/wechat.png" />

					<view class='right'>
						<view class='item' @click="toCashRecord">
							提现记录
						</view>
						<!-- <view class='item'>
							收取提现金额的{{tipInfo.percent}}手续费
						</view>
						<view class='item'>
							如有疑问，请及时联系客服
						</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'
	export default {
		// components: {
		// 	navBar
		// },
		data() {
			return {
				wayList: [
					[
						'微信余额',
						'支付宝',
						'银行卡'
					]
				],

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

		},
		methods: {
			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>