邀请规则更新

invite/invite.vue

@@ -1,32 +1,45 @@
 <template>
-	<view class="invite">
-		<view class="title">
-			邀请好友加入慧研学惠生活
-		</view>
-		<view class="desc">
-			您将获得现金红包奖励
-		</view>
-
-		<view class="code-box">
-			<image class="head" :src="userInfo.imgPath" mode=""></image>
-			<view class="user-name">
-				{{ userInfo.nickname }}
+	<view class="page">
+		<view class="qr-card">
+			<view class="title">
+				邀请好友加入慧研学惠生活
 			</view>
-
 			<view class="qrcode-box">
-				<u--image width="380rpx" height="380rpx" :src="src">
+				<u--image width="360rpx" height="360rpx" :src="src">
 					<template v-slot:loading>
-						<u-loading-icon size="56rpx" color="#FF4C3A"></u-loading-icon>
+						<u-loading-icon size="56rpx" color="#0C6FFE"></u-loading-icon>
 					</template>
 				</u--image>
 			</view>
-
+			<view class="save-btn">
+				<view style="width: 480rpx">
+					<u-button shape="circle" @click="save">保存二维码</u-button>
+				</view>
+			</view>
 		</view>
 
-		<view class="save-btn">
+		<view class="rules">
+			<view class="title">
+				慧研学惠生活用户邀请活动奖励规则
+			</view>
+
+			<view class="rules-content">
+				<text>
+					一、返利激励机制
+					1. 订购奖励：当被推荐的新用户首次订购慧研学惠生活任意档会员，推荐者将从新用户订购期内的月会员费中获得10%的返利激励；
+					2. 持续激励：被推荐的新用户持续订购会员，推荐者每月都能享受返利；
+					3. 推荐人数无上限：每个慧研学惠生活用户可以推荐的新用户人数没有上限；
+					4. 新用户在取消会员订购后，推荐者停止获得返利；
+					5. 新用户在取消会员订购后再次订购会员，原推荐者无法继续获得返利；
+					二、返利发放条件与时间
+					1. 新用户定义：被邀请者须是邀请前未注册、登录过慧研学惠生活平台的用户。
+					2. 确认订购：新用户被邀请后的48小时内订购成功，且在5天内无退订行为，系统将自动确认发放返利资格。
+					3. 发放时间：当月返利将在次月发放至慧研学惠生活个人账号。
+					5. 提现时间：每月25日，推荐者可进行上月返利的提现操作。
+					*最终解释权归本平台所有。
+				</text>
+			</view>
 
-			<u-button color="linear-gradient(265deg, #FF4A39 0%, #FC8B45 100%)" shape="circle" type="primary"
-				@click="save">保存二维码</u-button>
 		</view>
 
 	</view>
@@ -89,7 +102,7 @@ export default {
 
 								console.log(this.src.slice(22))
 								console.log(this.src)
-								console.log( wx.env.USER_DATA_PATH + '/pic' + number + '.png')
+								console.log(wx.env.USER_DATA_PATH + '/pic' + number + '.png')
 
 								const number = Math.random()
 								wx.getFileSystemManager().writeFile({
@@ -207,75 +220,54 @@ export default {
 	}
 }
 </script>
-
-<style lang="scss">
-.invite .u-image__loading,
-.u-image__error {
-	background-color: #fff !important;
-}
-
-.invite {
-	padding: 0 30rpx;
+<style lang="scss" scoped>
+.page {
+	background: #F9F9F9;
 	min-height: 100vh;
-	background: url('http://zswl-dev.oss-cn-chengdu.aliyuncs.com/63b7c68b71a69169d1b33f92/store/bdb/user/avatar/SpRgpIr81Trt13ba08b3b78f59f72c0a555b82b73492.png/1.png') no-repeat;
-	background-size: 100% 100%;
-
-	.title {
-		text-align: center;
-		font-size: 48rpx;
-		font-weight: 800;
-		margin-top: 178rpx;
-	}
-
-	.desc {
-		margin-top: 20rpx;
-		font-size: 28rpx;
-		color: #999999;
-		text-align: center;
-	}
-
-	.code-box {
-		width: 690rpx;
-		height: 650rpx;
-		background: #fff;
-		box-shadow: 0rpx 6rpx 20rpx 2rpx rgba(0, 0, 0, 0.06);
+	padding: 24rpx 20rpx;
+
+	.qr-card {
+		padding: 42rpx;
+		display: flex;
+		flex-direction: column;
+		justify-items: center;
+		justify-content: center;
+		background: #FFFFFF;
 		border-radius: 16rpx;
-		position: relative;
-		margin-top: 110rpx;
-
-		.head {
-			width: 162rpx;
-			height: 162rpx;
-			border-radius: 50%;
-			position: absolute;
-			top: 0;
-			left: 50%;
-			transform: translate(-50%, -50%);
-		}
 
-		.user-name {
-			padding-top: 100rpx;
-			text-align: center;
-			font-size: 32rpx;
+		.title {
+			font-size: 36rpx;
 			color: #222222;
-			font-weight: bold;
+			font-weight: Bold;
+			margin-bottom: 36rpx;
+			text-align: center;
 		}
 
 		.qrcode-box {
-			width: 380rpx;
-			height: 380rpx;
-			margin: 80rpx auto;
 			display: flex;
 			justify-content: center;
-			align-items: center;
+			margin-bottom: 78rpx;
+		}
 
+		.save-btn {
+			display: flex;
+			justify-content: center;
+			margin-bottom: 16rpx;
 		}
 	}
 
-	.save-btn {
-		position: fixed;
-		bottom: 100rpx;
-		width: calc(100% - 60rpx);
+	.rules {
+		color: #222222;
+		font-size: 36rpx;
+		font-weight: Bold;
+		margin-top: 30rpx;
+
+		.rules-content {
+			color: #CCCCCC;
+			font-size: 28rpx;
+			margin-top: 16rpx;
+			font-weight: 400;
+		}
 	}
 }
 </style>