yicangzongtai_app_240321/pages/user/Integral-transferred.vue

<template>
	<view>
		<navbar :config="config" backColor="#999999"></navbar>
		<view class="usable-integrate">
			<text class="usable-title">可用积分</text>
			<text class="usable-nums">{{ $addDecimals(integral_able , 8) }}</text>
		</view>
		<view class="box">
			<view class="usable-hint">
				<text>转赠积分</text>
				<service-charge title="转赠积分手续费为"></service-charge>
			</view>
			<view class="usable-input">
				<text class="iconfont usable-hint-icon">￥</text>
				<u-input v-model="value" placeholder="请输入转赠额度" @blur="getPointGiveAwayComputer" />
			</view>
			<mobilemapname ref="mobilemapname"></mobilemapname>
			<view class="usable-hint-info">
				<view class="usable-hint-item">
					<text class="usable-hint-title">手续费（销毁）：</text>
					<text class="usable-hint-val">{{ result.handling_fee }}</text>
				</view>
				<view class="usable-hint-item">
					<text class="usable-hint-title">实际转赠积分：</text>
					<text class="usable-hint-val">{{ result.face_point }}</text>
				</view>
				<!-- 	<view class="usable-hint-item usable-hint-error">
					*积分数量不足，请重新输入
				</view> -->

				<view class="usable-btn" @click.stop="openHintPopup()">
					确认转赠
				</view>
			</view>
		</view>

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

<script>
	import {
		pointGiveAwayComputer,
		pointGiveAway
	} from "@/api/personal-center.js"
	export default {
		data() {
			return {
				pointGiveAwayApi: {
					url: pointGiveAway,
					mode: 'post',
					data: {
						value: '',
						user_obj_id: ''
					}
				},
				integral_able: 0,
				value: '', // 需要转赠的积分
				receiveUser: {
					phone: '',
					name: '',
					user_obj_id: ''
				},
				config: {
					back: true, //false是tolbar页面 是则不写
					title: '积分转赠',
					color: '#1A1A1A',
					// autoBack:true,
					//背景颜色;参数一：透明度（0-1）;参数二：背景颜色（array则为线性渐变，string为单色背景）
					backgroundColor: [1, "#fff"],
					statusBarFontColor: '#1A1A1A'
				},
				// 手续费 / 实际转赠
				result: {
					face_point: 0,
					handling_fee: 0
				}
			};
		},
		onShow() {
			this.getUserInfo()
		},
		methods: {
			//获取个人信息
			getUserInfo() {
				let personal = uni.getStorageSync('personal');
				this.integral_able = personal ? personal.integral_able : '';
			},
			// 积分转赠计算
			getPointGiveAwayComputer(e) {
				if(!this.value){
					return false
				}
				this.$http.post(pointGiveAwayComputer, {
					value: this.value
				}).then((res) => {
					if (res && res.code == 200) {
						this.result.face_point = res.data.face_point
						this.result.handling_fee = res.data.handling_fee
					}
				});
			},
			openHintPopup() {
				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()
				})
				// this.$refs.exchangeHint.open()
			}
		}
	}
</script>

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