<template>
    <view class="container">
       <view class="logo">
		   <view class="" style="width: 120rpx;">
		   		   <image src="../../static/cffp_logo.jpg" alt="" mode="widthFix"></image>
		   </view>
		   <text>欢迎使用CFFP</text>
	   </view>
	   <view class="inviteInfo">
		   <text>{{invitationName}}邀请您申请为</text>
		   <text>{{areaName}}</text>
	   </view>
	   <view class="register" @click="ckregister()">
		   <text>点击注册</text>
	   </view>
    </view>
</template>
<script>
	import api from "@/api/api"
    export default {
        data() {
            return {
				areaName:'',
				invitationName:''
            }
        },
		onLoad(options) {
			console.log(options, 777)
			this.getqueryById(options.shareId)
		},
		methods:{
			getqueryById(id){
				console.log(id)
				api.queryById(id).then(res =>{
					console.log(res, 77414)
					this.areaName = res.data.data.areaName
					this.invitationName = res.data.data.invitationName
					this.mobileNumber = res.data.data.mobileNumber
				})
			},
			ckregister(){
				uni.navigateTo({
					url:'/pages/invitationRegister/invitationlogin?invitationName=' +  this.invitationName + '&mobileNumber=' + this.mobileNumber
				})
			}
		}
    }
</script> 

<style lang="scss">
	.container{
		height: 100%;
		background: url('../../static/app-plus/registerBg.png') 100% 100%; 
		background-size: contain;
		color: #fff;
		.logo{
			padding-top: 100rpx;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			border-radius: 30rpx;
			overflow: hidden;
			font-size: 40rpx;
			image{
				margin-bottom: 20rpx;
				width: 160rpx;
				height: 160rpx;
				border-radius: 30rpx;
				overflow: hidden;
			}
		}
		.inviteInfo{
			position: absolute;
			bottom: 60%;
			left: 0;
			right: 0;
			width: 100%;
			text-align: center;
			font-size: 40rpx;
			display: flex;
			flex-direction: column;
		}
	}
	.register{
		position: absolute;
		bottom: 20%;
		left: 0;
		right: 0;
		margin: 0 auto;
		width: 60%;
		height: 100rpx;
		border-radius: 80rpx;
		background-color: #20269B;
		color: #fff;
		font-size: 36rpx;
		display: flex;
		justify-content: center;
		align-items: center;
	}
</style>