<template>
	<view class="content">
		<view class="pro-head">
			promotion
			<view class="pro-hea-rig">
				<image src="../../../static/promo/nav_icon_des@2x.png" mode="aspectFit" class="img1"
					@click="goInviteRule()"></image>
				<image src="../../../static/promo/nav_icon_more@2x.png" mode="aspectFit" class="img2"
					@click="invMore=true,msShow=true"></image>

			</view>
		</view>
		<view class="pro-body">
			<view class="pro-body-p1">
				bonus: <span class="category-sigh">{{currencySymbol}}</span><span
					class="s1">{{inviteRule.bonusCapital}}</span>
			</view>

			<view class="pro-body-btn1" @click="appl=true,msShow=true">
				Apply to balance
			</view>

			<view class="pro-body-lea">
				<view class="lea-item" v-for="(item,index) in proLeav" :key="item.id" @click="leaIdChange(item.id,index)">
					<p :class="['p1', leaId==index?'on':'']">{{item.lea}}</p>
				
				</view>
				<view class="total">
					<view class="Totalpe">
						<p class="p2">Total people</p>
						<p class="p3">{{totalPeople}}</p>
					</view>
				 <view class="Totalpe">
				 	<p class="p2">Contribution</p>
				 	<p class="p3">{{currencySymbol}}{{totalYong}}</p>
				 </view>
				</view>
				
			</view>

			<view class="pro-body-code">
				<view class="code-item1">
					<p class="p1" ref="">My Promotion Code</p>
					<p class="p2">{{inviteRule.inviteCode}}</p>
				</view>
				<view class="code-item1">
					<p class="p1">My Promotion Link</p>
					<p class="p2">{{copyText}}</p>
				</view>

				<view class="code-btn" @click="copyTextMethod()">
					Copy
				</view>


			</view>
			<cont></cont>
		</view>

		<view class="invite-more" v-show="invMore">
			<view class="invite-con">
				<view class="more-a" @click="goProRe">
					promotion record
				</view>
				<view class="more-a" @click="goBouns">
					bonus record
				</view>
				<view class="more-a" @click="applyRecord">
					apply record
				</view>
			</view>
			<view class="invite-con2">
				<view class="more-a" @click="invMore=false,msShow=false">
					cancel
				</view>
			</view>
		</view>


		<view class="appl_Ba" v-show="appl">
			<view class="top">


				<view class="title">
					apply to balance
				</view>
				<view class="input">
					<input type="text" value="" placeholder="bonus" v-model="tranAmt"
						placeholder-style="color: #BFC2CCFF;font-size:28rpx;text-transform: capitalize" />
				</view>
				<view class="all" @click="applyAll()">
					Apply all
				</view>
			</view>

			<view class="btn_con">
				<view class="btn1" @click="appl=false,msShow=false">
					cancel
				</view>
				<view class="btn1 puple" @click="bountOut()">
					confirm
				</view>
			</view>
		</view>
		<view class="msg-box-bg" v-show="msShow" @click="invMore=false,msShow=false,appl=false">
		</view>
	</view>


</template>

<script>
	import cont from "@/components/cont/cont.vue"
	import api from '@/utils/api'
	export default {
		data() {
			return {
				
				totalYong:0.00,
				totalPeople:0,
				level:1,
				currencySymbol: '',
				leaId: 0,
				inviteRule: [],
				tranAmt: '',
				totalElements:'',
				
				proLeav: [{
						id: 1,
						lea: 'level1',
						leanum:1,
						lea2: 'Total people',
						leanum: 0
					},
					{
						id: 2,
						lea: 'level2',
						leanum:2,
						lea2: 'Contribution',
						leanum: 0.00
					},
					{
						id: 3,
						lea: 'level3',
						leanum:3,
						leanum: 0.00
					},
				],
				copyText: '',
				invMore: false,
				appl: false,
				msShow: false,
				currencySymbol:'',
			}
		},
		onLoad() {
				this.currencySymbol=uni.getStorageSync('siteInfo').currencySymbol;
			this.getBounsRecord();

			this.openGame();
			const post = api.inviteCode({
				"ticket": uni.getStorageSync('logInfo').data,
			})
			post.then(res => {
					this.inviteRule = res.data;
					this.inviteRule.bonusCapital=parseFloat(this.inviteRule.bonusCapital).toFixed(2)
					this.copyText = this.inviteRule.qrcodeUrl;
				})
				.catch(e => {
					uni.showToast({
						title: e,
						icon: 'none',
						duration: 2500
					})
				})

		},
		methods: {
	getBounsRecord(){
		const post = api.bonusSummary({
				"ticket": uni.getStorageSync('logInfo').data,
				"level":this.level,			
				 })
				 post.then(res => {
			    this.totalPeople=res.data.totalPeople;
				 this.totalYong=res.data.contribution;
		     this.totalYong=parseFloat(this.totalYong).toFixed(2)
	
				 	})
		
	},
	
			openGame() {
				const post = api.info()
				post.then(d => {
						// uni.setStorage({
						// 	key: 'Gamestatus',
						// 	data: d.data.gameMenuStatus,
						// });
					
						if (d.data.gameMenuStatus == 'close') {
							uni.setTabBarItem({
								index: 2,
								text: 'Order',
								pagePath:'/pages/menu/order/index',
								iconPath: '/static/tabbar/dorder.png',
								selectedIconPath: '/static/tabbar/dorderS.png'
							})
						}else if (d.data.gameMenuStatus == 'open'){
							uni.setTabBarItem({
								index: 2,
								text: 'Game',
								pagePath: "/pages/menu/color/index",
								iconPath: "/static/tabbar/meun_icon_game_nor@2x.png",
								selectedIconPath: "/static/tabbar/meun_icon_game_sel@2x.png"
							})
						}
					})
					.catch((e) => {
						console.log(e)
					})
			},
			goInviteRule() {
				uni.navigateTo({
					url: '../rule/inviteRule/index'
				})
			},
			applyAll() {
				this.tranAmt = this.inviteRule.bonusCapital;
			},
			bountOut() {
				const post = api.bonusOut({
					"ticket": uni.getStorageSync('logInfo').data,
					"tranAmt": this.tranAmt,
				})
				post.then(res => {
						if (res) {
							if (res.success == true) {
								uni.showToast({
									title: 'Commission successfully transferred out to balance',
									icon: 'success',
									duration: 1500
								})
							} else {
								uni.showToast({
									title: res.errMsg,
									icon: 'none',
									duration: 1500
								})
							}
						}
					})
					.catch(e => {
						uni.showToast({
							title: e,
							icon: 'none',
							duration: 2500
						})
					})

			},
			goProRe() {
				uni.navigateTo({
					url: './promotionRecord/index'
				})
			},
			goBouns() {
				uni.navigateTo({
					url: './bounsRecord/index'
				})
			},
			applyRecord() {
				uni.navigateTo({
					url: './applyRecord/index'
				})
			},
			copyTextMethod() {

			// #ifdef H5
			    this.$copyText(this.copyText).then(res => {
			     uni.showToast({
			      title: 'Copy Success',
			      icon: 'success'
			     })
			    })
			    // #endif
			    // #ifdef APP-PLUS
			    uni.setClipboardData({
			     data: this.copyText,
			     success() {
					 uni.showToast({
					  title: 'Copy Success',
					  icon: 'success'
					 })
			     }
			    })
			    // #endif
			},
			leaIdChange(i,index) {
				this.level=i;
				this.leaId = index;
				this.getBounsRecord();
			}
		}
	}
</script>

<style lang="scss" scoped>
	/* #ifdef APP-PLUS */
		.pro-head{
			padding-top: 30rpx;
		}
	.pro-hea-rig{
	position: absolute;
	right: 36rpx;
	top: 60%;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	}
		/* #endif */
	@import url("./index.css");
</style>
