<template>
	<!-- 转赠收款 -->
	<view class="activityEntry" style="background: url(../../../../static/chooseCade/reddogbg.png);">
		<far-bottom></far-bottom>
		<view >
			<view class="dis-flex" style="justify-content:center;align-items:center;padding-top: 180upx;">
				<image style="width: 120upx;height: 120upx;border-radius: 50%;" :src="particulars.avatar" mode="aspectFill"></image>
			</view>
			<view class="t-c f-36 " style="padding: 30upx 0 0;color: #FFFFFF;">
				{{particulars.title}}
			</view>
			<view class="t-c f-30 " style="padding: 30upx 0 200upx;color: #FFFFFF;">
				{{particulars.nickname}}转赠{{particulars.money}}元
			</view>
			<view class="dis-flex" style="justify-content:center;align-items:center;padding-bottom: 30upx;">
				<input class="uni-input t-c" v-model="message.realname" :adjust-position="false" @blur="inputBlur"@confirm="inputBlur" placeholder="请输入你的姓名" maxlength="4" placeholder-style="text-align: center;" style="padding: 10upx 20upx;background-color: #FFFFFF;width: 70vw;height: 70upx;border-radius: 10upx;"/>
			</view>
			<view class="dis-flex" style="justify-content:center;align-items:center;">
				<input class="uni-input t-c" v-model="message.mobile" :adjust-position="false" placeholder="请输入你的手机号" @blur="inputBlur"@confirm="inputBlur" type="number" maxlength="11" placeholder-style="text-align: center;" style="padding: 10upx 20upx;background-color: #FFFFFF;width: 70vw;height: 70upx;border-radius: 10upx;" />
			</view>
			<view class="t-c f-28" style="padding: 30upx 30upx;color: #FE9894;overflow: hidden;">
				输入你的信息,收到的人民币自动放入你的账户
			</view>
			<view class="dis-flex" style="justify-content:center;align-items:center;padding-top: 50upx;">
				<view class="t-c f-30" style="width: 55vw;height: 80upx;border-radius: 15upx;background-color: #FEEC62;line-height: 80upx;color: #FF4444;" @click="goshouqian">
					确认
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import App from '@/common/js/app.js';
	import noneMores from '@/components/template/nonemores.vue'
	
	// #ifdef H5
	import wxApi from '@/common/js/wxApi.js';
	// #endif
	export default{
		data(){
			return{
				particulars:{},
				message:{
					realname:'',
					mobile:'',
					id:null
				},
			}
		},
		onLoad(e) {
			console.log(e.transfer_id);
			this.message.id = e.transfer_id;
			this.getParticulars(e.transfer_id);
		},
		methods:{
			inputBlur(){
				uni.pageScrollTo({
				scrollTop: 0,
				duration: 0
				});
			},
			getParticulars(id){
				App._post_form(`&p=member&do=transferpage&id=${id}`,{},res=>{
					this.particulars = {...this.particulars,...res.data};
				})
			},
			goshouqian(){
				let phone = new RegExp(/^1[3-9]\d{9}$/);
				if(this.message.realname == ''){
					uni.showToast({
						icon:'none',
						title:'姓名不能为空'
					});
					return
				}
				if(!phone.test(this.message.mobile)){
					uni.showToast({
						icon:'none',
						title:'请输入正确的手机号' 
					});
					return
				}
				App._post_form(`&p=member&do=getTransfer`,this.message,res=>{
					uni.showLoading({
					    title: '获取成功,为您跳转回到首页'
					});
					setTimeout(()=>{
						uni.hideLoading();
						uni.reLaunch({
						    url: '/pages/mainPages/index/index'
						});
					},1000)
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.activityEntry{
		width: 100vw;
		height: 100vh;
		background-size: 100% 100%;
	}
</style>
