yicangzongtai_app_240321/pages/user/balance-exchange.vue

<template>
	<view>
		<navbar :config="config" backColor="#999999"></navbar>
		<view class="usable-integrate">
			<text class="usable-title">可用余额（元)</text>
			<text class="usable-nums">{{ $addDecimals(balance , 2) }}</text>
		</view>
		<view class="box">

			<view class="usable-hint">
				<text>转赠余额</text>
			</view>
			<view class="usable-input">
				<text class="iconfont usable-hint-icon">￥</text>
				<u-input type="number" v-model="value" placeholder="请输入转赠金额" :clearable="false"/>
			</view>
			<mobilemapname ref="mobilemapname"></mobilemapname>
			
			<view class="usable-hint-info">
				<view class="usable-btn" @click.stop="openHintPopup()">
					确认转赠
				</view>
			</view>
		</view>

		<exchange-hint ref="exchangeHint" :params="pointGiveAwayApi" :type="2" :useNums="value" :resultNum="`手机号为“${receiveUser.phone}”的用户`"></exchange-hint>
	</view>
</template>

<script>
	import { balanceGiveAway } from "@/api/personal-center.js"
	export default {
		data() {
			return {
				pointGiveAwayApi: {
					url: balanceGiveAway,
					mode: 'post',
					data: {
						value: '',
						user_obj_id: ''
					}
				},
				balance:0,
				value: '',
				config: {
					back: true, //false是tolbar页面 是则不写
					title: '余额转赠',
					color: '#1A1A1A',
					// autoBack:true,
					//背景颜色;参数一：透明度（0-1）;参数二：背景颜色（array则为线性渐变，string为单色背景）
					backgroundColor: [1, "#fff"],
					statusBarFontColor: '#1A1A1A'
				},
				receiveUser: {
					phone: '',
					name: '',
					user_obj_id: ''
				},
				
			};
		},
		onShow() {
			this.getUserInfo()
		},
		watch:{
			value(newVal){
				if(newVal > this.balance){
					this.$mUtil.toast("转赠余额不能大于当前余额")
				}
			}
		},
		methods: {
			// if (!(this.form.identityNumber.match(this.$mConfig.twoMinNum))) {
			// 	this.$mUtil.toast("请输入正确的身份证号")
			// 	return false
			// }
			//获取个人信息
			getUserInfo() {
				let personal = uni.getStorageSync('personal');
				this.balance = personal ? personal.balance : '';
			},
			openHintPopup() {
				// console.log('this.value.match(this.$mConfig.twoMinNum) = ' , this.value , this.value.match(this.$mConfig.twoMinNum) , this.$mConfig.twoMinNum.test(this.value))
				if(!this.value){
					this.$mUtil.toast("请输入赠送金额")
					return false
				}else if(!this.$mConfig.twoMinNum.test(this.value)){
					this.$mUtil.toast("最多输入两位小数")
					return false
				}
			
				this.$refs.mobilemapname.getObjUserId().then(res => {
					this.receiveUser = res;
					this.pointGiveAwayApi.data = {
						value: this.value,
						user_obj_id: res.user_obj_id
					}
					this.$refs.exchangeHint.open()
				})
			}
		}
	}
</script>

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