zd/pages/user_home/award/changeWallet.vue

<template>
	<view class="content">
		<view class="listBox">
			<view class="list">
				<view class="flex listItem" @click="navTo('/pages/set/userinfo')">
					<view class="flex titleBox">
						<text class="title">可兑换金额</text>
					</view>
					<view class="right flex">
						<text>{{ userInfo.brokerage_price | getMoneyStyle}}</text>
						<!-- <image class="img" src="../../static/icon/next1.png" mode="widthFix"></image> -->
					</view>
				</view>
				<view class="flex listItem">
					<view class="flex titleBox">
						<text class="title">申请转换金额</text>
					</view>
					<view class="right flex">
						<input class="input" type="text" v-model="withdrawal" placeholder="请输入金额" placeholder-class="placeholder" />
					</view>
				</view>
				<view class="all" @click="withdrawal=userInfo.brokerage_price">
					全部转换
				</view>
			</view>
		</view>
		<button class="base-buttom" :class="{ action: loding }" @click="!loding ? confirm() : ''">提交申请</button>
	</view>
</template>

<script>
	import {
		getMoneyStyle
	} from '@/utils/rocessor.js';
	import {
		getUserInfo,
	} from '@/api/user.js';
	import {
		rechargeWechat
	} from '@/api/wallet.js'
	import {
		mapMutations,
		mapState
	} from 'vuex';
	export default {
		filters: {
			getMoneyStyle
		},
		data() {
			return {
				money: '0.00', //可提现金额
				withdrawal: '', //提现金额
				// #ifdef H5
				weichatBsrowser: false,
				// #endif
				loding: false,
				type: 0
			};
		},
		onLoad(options) {
			// #ifdef H5
			this.weichatBsrowser = uni.getStorageSync('weichatBrowser');
			// #endif
			this.dataUp();
			if (options.type) {
				this.type = options.type;

			}
		},
		computed: {
			...mapState('user', ['userInfo'])
		},
		methods: {
			...mapMutations('user', ['setUserInfo', 'login']),
			// 更新数据
			dataUp() {
				let obj = this;
				getUserInfo({})
					.then(e => {
						obj.login();
						// 保存返回用户数据
						obj.setUserInfo(e.data);
					})
					.catch(e => {
						console.log(e);
					});
			},
			// 切换选中对象
			tabRadio(e) {
				this.type = e.detail.value;
			},
			// 提交
			confirm() {
				let obj = this;
				obj.loding = true;
				if (obj.withdrawal == 0) {
					obj.loding = false;
					uni.showModal({
						title: '提示',
						content: '转换金额不要为0'
					});
					return;
				}

				let data = {
					from: 'weixinh5', //
					price: obj.withdrawal, //金额
					type: 1 //0佣金1余额
				};
				rechargeWechat(data)
					.then(e => {
						// 允许按钮点击
						obj.loding = false;
						// 初始化提现金额
						obj.withdrawal = '';
						uni.showToast({
							title: '转换成功',
							duration: 2000,
							position: 'top'
						});
						obj.dataUp();
					})
					.catch(e => {
						obj.$api.msg(e.msg);
						obj.loding = false;
						console.log();
					});
			},
		}
	};
</script>

<style lang="scss">
	page {
		height: 100%;
	}
	.listBox {
		overflow: hidden;
		background-color: #FFFFFF;
	}
	.list {
		.all{
			text-align: right;
			padding: 20rpx 30rpx;
			font-size: $font-base;
			color: $uni-color-primary;
		}
		.listItem {
			padding: 35rpx 40rpx;
			border-bottom: 1px solid $page-color-light;
		}
	
		.listIconImg {
			width: 36rpx;
		}
	
		.right {
			color: $font-color-light;
			font-size: $font-base;
			flex-grow: 1;
			justify-content: flex-end;
			.img {
				width: 26rpx;
			}
		}
		.input {
			flex-grow: 1;
			text-align: right;
			font-size: $font-base;
			color: $color-gray;
		}
		
		.titleBox {
			.title {
				color: $font-color-base;
				font-size: $font-base;
			}
		}
	}
</style>