fhxnuser_uniapp_fudai_video_01/pages_course/activity.vue

<template>
	<view class="content">
		<view class="detail-cont">
			<view class="title">{{item.title}}</view>
			<view class="info">
				<view class="reads">阅读数：{{item.views}}</view>
				<view class="time">{{item.publishTime}}</view>
			</view>
			<!-- 正文 -->
			<view class="full-text">
				<view v-html="item.contents"></view>
			</view>
		</view>
		<!-- 最近阅读 -->
		<view class="recent-reads">
			<!-- <view class="left">
				<text class="label">最近阅读</text>
				<view class="peop-box" @click="showUsers">
					<view class="head-box">
						<view class="head" v-for="(subitem,j) in views" :key="j">
							<image :src="subitem.avatar==null?'/static/images/detault_head.jpg':subitem.avatar" mode=""></image>
						</view>
					</view>
					<image class="arrow" src="/static/images/arrow_gray.png" mode=""></image>
				</view>
			</view> -->
			<!-- <view class="share-btn" v-if="!isExpiry&&collectType!=1">
				<image src="/static/images/share.png" mode=""></image>
				<text>分享</text>
				<button  class="share" data-name="shareBtn" open-type="share">分享</button>
			</view> -->
			<view class="recent-reads">
				<view class="thumb-up-fill x-c" v-if="collectType==1 || !isExpiry">已点赞</view>
				<view class="thumb-up x-c" v-if="collectType!=1&&isExpiry" @click="handleReceive">点赞</view>
				<!-- <u-icon name="thumb-up-fill" color="#1BB99D" size="32" v-if="collectType==1"></u-icon>
				<u-icon name="thumb-up" color="#333" size="32" v-if="collectType!=1&&isExpiry" @click="handleReceive"></u-icon> -->
			</view>
		</view>
		<!-- 咨询按钮 -->
		<!-- <view class="inquiry">
			<view class="content">
				<image src="/static/images/consult.png" mode=""></image>
				<text class="text">咨询</text>
				<button class="contact-btn" open-type="contact"></button>
			</view>
			
		</view> -->
		<view>
			<u-popup :show="show" mode="center" bgColor="transparent" :closeOnClickOverlay="false" overlayOpacity="0.7">
				<view class="popup-box">
					<image class="activity_jb" src="https://cdn.his.cdwjyyh.com/minapp/course/activity_jb.png"
						mode="heightFix"></image>
					<text class="popup-tit">恭喜您获得</text>
					<view class="con">
						<view class="numbox color_FB2205"><text class="num">+{{coinAmount||0}}</text>芳华币</view>
						<view>您的芳华币总额：<text class="color_FB2205" style="font-weight: 600;">{{balance||0}}</text></view>
					</view>
					<!-- <view class="popup-tips">赶紧去芳华未来APP，兑换好物吧~</view> -->
					<view class="popbtn x-c" @click="show=false">我知道啦</view>
				</view>
				<!-- <view class="popup-tips" style="color: #FFFFFF;margin-top: 60rpx;">兑换提示：请前往芳华未来APP兑换</view> -->
				<!-- <view class="popup-tips" style="color: #FFC05C;text-decoration-line: underline;" @click="navTo">如何下载芳华未来APP？</view> -->
			</u-popup>
			<u-popup :show="userlogo" mode="bottom" round='12'>
				<view class="userlogo column">
					<view class="mtb30 justify-start align-center ml20">
						<u-avatar src="/static/logo.png" size="50"></u-avatar>
						<view class="bold mlr20">坤德精选a</view>
						<view>申请</view>
					</view>
					<view class="bold fs36 ml20">授权你的昵称头像信息</view>
					<view class="mtb20 justify-between align-center  plr20">
						<view class="justify-start align-center">
							<view class="boxweixin" :class="userinfos.nickname==''?'boxnosel':'boxsel'">
								<view v-if="userinfos.nickname">
									<u-icon name="checkbox-mark" color="#00aa00" size="22"></u-icon>
								</view>
							</view>
							<view class="ml20">
								<view class="base-color-3 bold">第一步</view>
								<view class="fs32 base-color-9">请点击授权微信昵称</view>
							</view>
						</view>
						<view class="button-container">
						   <input 
						     type="nickname"
						     class="hidden-input"
							 @blur="onNickNameInput"
							 @input="onNickNameInput"
						   />
						   <button class="custom-button" :class="nameuser==''?'subname':'subavt'">{{nameuser?"已授权":'允许授权'}}</button>
						 </view>
					</view>
					<!-- <view class="mtb20 justify-between align-center  plr20 mt40">
						<view class="justify-start align-center">
							<view class="boxweixin" :class="userinfos.nickname==''?'boxnosel':'boxsel'">
								<view v-if="userinfos.avatar">√</view>
							</view>
							<view class="ml20">
								<view class="base-color-3 bold">第二步</view>
								<view class="fs32 base-color-9">请点击授权微信头像</view>
							</view>
						</view>
						<view class="button-container">
						  <button open-type="chooseAvatar" @chooseavatar="onChooseAvatar" class="hidden-input" 
						  v-if="nameuser">
						    允许授权
						  </button>
						  <button class="custom-button sub" @click="shouquan" v-if="nameuser==''">允许授权</button>
						   <button class="custom-button "  :class="avataruser==''?'subname':'subavt'"
						   v-else>{{avataruser?"已授权":'允许授权'}}</button>
						 </view>
					</view> -->
					<view class="submitname" @click="confimrname" :class="nameuser&&avataruser?'subact':'sub'">确定</view>
				</view>
			</u-popup>
			<u-popup :show="showPhonePopup" mode="bottom" round="12" :closeOnClickOverlay="false" @close="showPhonePopup=false">
				<view class="column" style="padding: 40rpx; min-height: 400rpx; background: #fff; border-radius: 24rpx 24rpx 0 0;">
					<view style="text-align: center; font-weight: bold; font-size: 36rpx; margin-bottom: 30rpx;">授权手机号</view>
					<view style="text-align: center; color: #666; font-size: 30rpx; margin-bottom: 50rpx;">为了提供更好的服务，我们需要获取您的手机号</view>
					<view style="display: flex; flex-direction: column; gap: 20rpx;">
						<button 
							open-type="getPhoneNumber" 
							@getphonenumber="getPhoneNumber"
							style="width: 100%; background: #00aa00; color: #fff; border-radius: 44rpx; height: 88rpx; line-height: 88rpx; font-size: 32rpx;"
						>
							一键授权
						</button>
						<!-- <view 
							@click="showPhonePopup=false"
							style="width: 100%; text-align: center; height: 88rpx; line-height: 88rpx; color: #999; font-size: 30rpx;"
						>
							暂不授权
						</view> -->
					</view>
				</view>
			</u-popup>
		</view>
	</view> 
</template>

<script>
	import {mapGetters} from 'vuex';
	import { getLuckyBagInfo, receiveLuckyBag,loginByMp,editUser,isAddCompanyUser,registerQwFsUserFinish,handleFsUserWx,setIPhoneNumber,getByAppId}from '@/api/course.js';
	
	import {getArticleByArticleId,updateView} from '@/api/article'
	export default {
		data() {
			return {
				articleId:'',
				item:{},
				views:[],
				showPhonePopup: false,
				statusBarHeight: uni.getSystemInfoSync().statusBarHeight,
				show: false,
				status: 0,
				recordId: '',
				urlOption: {},
				sortLink: '',
				isLogin: false,
				isLoginH5: 1, // 1服务号授权
				authType: 1, //授权方式
				collectType: 0, // 领取状态(0-已发放 1-已领取 2-已失效)
				isExpiry: true, // false 失效 true 有效
				coinAmount: 0,
				balance: 0,
				chatId: '',
				userlogo:false,
				imgname:'',
				userinfos:{
					nickname:"",
					avatar:""
				},
				btnLoading: false,
				registerLoading: false,
				errMSg: '',
				code:'',
				goReceive: 0
			};
		},
		computed: {
			...mapGetters(['coureLogin']),
			nameuser() {
				return this.userinfos.nickname
			},
			avataruser() {
				return this.userinfos.avatar
			},
		},
		watch: {
			coureLogin: {
				immediate: true, // 页面一进入就检查一次
				handler(val) {
					if (val == 2 && this.isLogin) {
						console.log("注册AppToken失效，请重新登录")
						uni.removeStorageSync('web_userInfo');
						uni.removeStorageSync('auto_userInfo');
						uni.removeStorageSync('TOKEN_WEXIN');
						this.isLogin = false
						this.goReceive = 0
						this.goLogin()
					}
				}
			}
		},
		//发送给朋友
		onShareAppMessage(res) {
			return {
				title: this.item.title,
				imageUrl: this.item.imageUrl,
				path: '/pages/healthy/detail=?articleId'+this.articleId,
			}
		},
		onLoad(option) {
			this.articleId=option.articleId||275;
			this.urlOption = option.link ? JSON.parse(decodeURIComponent(option.link)) : {};
			this.sortLink = this.urlOption.link || ''
			this.chatId = this.urlOption.chatId || ''
			this.recordId =this.urlOption.businessId || ''
			console.log(this.sortLink)
			uni.$on('usercode', (data) => {
				if (data) {
					this.code = data.code
					this.loginFsUserWx(data)
				}
			})
			this.getLuckyBagInfo()
			const user = uni.getStorageSync('auto_userInfo')&&JSON.stringify(uni.getStorageSync('auto_userInfo'))!='{}' ? JSON.parse(uni.getStorageSync('auto_userInfo')):'';
			this.utils.isLoginCourse().then(
				isLogin => {
					this.isLogin = isLogin
					if (this.isLogin&&user) {
					} else {
						this.goReceive = 0
						this.goLogin()
					}
				},
				rej => {}
			);
			// if(this.utils.checkToken()){
			// 	this.updateView();
			// }
		},
		beforeDestroy() {
			uni.$off('usercode')
		},
		onUnload() {
			uni.$off('usercode')
		},
		onShow() {
			this.getArticleByArticleId();
		},
		methods:{
			updateView(){
				updateView(this.articleId).then(
					res => {
					},
					rej => {}
				);
			},
			getArticleByArticleId(){
				let data = {articleId:this.articleId};
				getArticleByArticleId(data).then(
					res => {
						if(res.code==200){
							this.item=res.data;
							this.views=res.views;
						}else{
							uni.showToast({
								icon:'none',
								title: "请求失败",
							});
						}
					},
					rej => {}
				);
			},
			// 查看阅读用户
			showUsers() {
				uni.navigateTo({
					url: './readUsers?articleId='+this.articleId
				})
			},
			getPhoneNumber(e) {
				if (e.detail.errMsg === 'getPhoneNumber:ok') {
					uni.showLoading({ title: '授权中...' });
					uni.login({
						provider: 'weixin',
						success: (loginRes) => {
							const params = {
								code: loginRes.code,
								encryptedData: e.detail.encryptedData,
								iv: e.detail.iv,
								appId: getApp().globalData.appId
							};
							setIPhoneNumber(params).then(res => {
								uni.hideLoading();
								if (res.code === 200|| res.code == 20003) {
									uni.showToast({ title: '授权成功', icon: 'success' });
									uni.setStorageSync('auto_userInfo', JSON.stringify(res.user));
									uni.setStorageSync('web_userInfo', res.user);
									this.showPhonePopup = false;
									this.registerQwFsUserFinish()
								} else {
									uni.showToast({ title: res.msg || '授权失败', icon: 'none' });
								}
							}).catch(() => {
								uni.hideLoading();
								uni.showToast({ title: '授权失败', icon: 'none' });
							});
						},
						fail: () => {
							uni.hideLoading();
							uni.showToast({ title: '获取登录凭证失败', icon: 'none' });
						}
					});
				} else {
					uni.showToast({ title: '您取消了授权', icon: 'none' });
				}
			},
			registerQwFsUserFinish() {
				uni.showLoading({
					title: '领取中...'
				});
				registerQwFsUserFinish(this.urlOption).then(res=>{
					uni.hideLoading()
					if(res.code==200) {
						this.receiveLuckyBag()
					} else {
						if (this.chatId) {
							this.userlogo = true
						} else {
							this.getAddCompanyUser()
						}
					}
				}).catch(()=>{
					uni.hideLoading()
				})
			},
			getAddCompanyUser() {
				if(this.registerLoading) return;
				uni.showLoading({
					title: '注册中'
				})
				this.registerLoading = true
				isAddCompanyUser(this.urlOption).then(res=>{
					this.registerLoading = false
					uni.hideLoading()
					if(res.code==200) {
						this.receiveLuckyBag()
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						});
					}
				}).catch(()=>{
					this.registerLoading = false
					uni.hideLoading()
				})
			},
			//修改用户昵称以及头像
			editUserA(){
				this.userinfos=uni.getStorageSync('web_userInfo')?uni.getStorageSync('web_userInfo'):this.userinfos
				const data={
					nickName:this.userinfos.nickname,
					// avatar:this.userinfos.avatar,
				}
				editUser(data).then(res=>{
					if(res.code==200){
						this.isLogin = true
						uni.showToast({
							icon:'none',
							title:'修改成功！',
						});
						setTimeout(()=>{
							this.getAddCompanyUser()
						},100)
					}else{
						uni.removeStorageSync('web_userInfo')
						uni.showToast({
							icon:'none',
							title:res.msg+'请重新领取福袋',
						});
					}
				})
			},
			shouquan(){
				if(this.userinfos.nickname==''){
					uni.showToast({
						icon:'none',
						title: "请先授权微信昵称",
					});
				}
			},
			confimrname(){
				if(this.userinfos.nickname==''){
					uni.showToast({
						icon:'none',
						title: "请授权微信昵称",
					});
					return
				}
				// if(this.userinfos.avatar==''){
				// 	uni.showToast({
				// 		icon:'none',
				// 		title: "请授权微信头像",
				// 	});
				// 	return
				// }
				uni.setStorageSync('web_userInfo',this.userinfos)
				this.editUserA()
				this.userlogo=false
			},
			onNickNameInput(e){
				console.log(e)
				this.userinfos.nickname=e.detail.value
			},
			onChooseAvatar(e){
				this.userinfos.avatar=e.detail.avatarUrl
				uni.uploadFile({
					url: 'https://h5api.his.cdwjyyh.com'+'/app/common/uploadOSS', //仅为示例，非真实的接口地址
					filePath: e.detail.avatarUrl,
					name: 'file',
					formData: {
						'user': 'test'  // 上传附带参数
					},
					success: (uploadFileRes) => {
						console.log(uploadFileRes)
						// 根据接口具体返回格式   赋值具体对应url
						var data=JSON.parse(uploadFileRes.data)
						this.headImg=uni.getStorageSync('requestPath')+data.fileName
						this.userinfos.avatar=data.url
					}
				});
			},
			handleReceive() {
				if(this.collectType!=1&&this.isExpiry) {
					if(this.errMSg){
						uni.showToast({
							icon:'none',
							title: this.errMSg,
						});
						return
					}
					const user = uni.getStorageSync('auto_userInfo')&&JSON.stringify(uni.getStorageSync('auto_userInfo'))!='{}' ? JSON.parse(uni.getStorageSync('auto_userInfo')):'';
					this.utils.isLoginCourse().then(
						isLogin => {
							this.isLogin = isLogin
							if (this.isLogin&&user) {
								if(user&&user.phone) {
									this.registerQwFsUserFinish()
								} else {
									this.showPhonePopup = true
								}
							} else {
								this.goReceive =1
								this.goLogin()
							}
						},
						rej => {}
					);
				} else {
					this.collectType==1
				}
			},
			receiveLuckyBag() {
				if(this.btnLoading) {
					return
				}
				uni.showLoading({
					title: '领取中...',
				});
				this.btnLoading = true
				const param = {
					...this.urlOption,
					recordId: this.recordId
				}
				receiveLuckyBag(param).then(res => {
					uni.hideLoading()
					this.btnLoading = false
					if(res.code == 200) {
						this.coinAmount = res.data.coinAmount || 0
						this.balance =  res.data.balance || 0
						this.collectType = 1
						// this.show = true
						uni.showToast({
							title: "恭喜您获得"+this.coinAmount+"芳华币。",
							icon: 'none'
						});
					} else {
						uni.showModal({
							title: '领取失败',
							content: res.msg,
							showCancel: false,
							success: function (res) {
								if (res.confirm) {
									console.log('用户点击确定');
								} else if (res.cancel) {
									console.log('用户点击取消');
								}
							}
						});
					}
				}).catch(()=>{
					this.btnLoading = false
				})
			},
			navTo() {
				this.show = false
				uni.navigateTo({
					url: '/pages_course/appDownload'
				})
			},
			getLuckyBagInfo() {
				this.errMSg = ''
				uni.hideLoading()
				getLuckyBagInfo({
					recordId: this.recordId
				}).then(res => {
					if (res.code == 200) {
						this.collectType = res.data.collectType || 0; //领取状态(0-已发放 1-已领取 2-已失效)
						this.isExpiry = res.data.isExpiry; //false 失效 true 有效
					} else {
						this.errMSg = res.msg
						uni.showToast({
							title: res.msg,
							icon: 'none'
						});
					}
				})
			},
			goLogin() {
				getByAppId(getApp().globalData.appId).then(res=>{
					if(res.code == 200) {
						this.authType = res.config.authType || 1
						if(this.authType == 1) {
							this.code = ''
							this.goWXLogin()
						} else if(this.authType==2) {
							this.loginFsUserWx()
						}
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'error'
						})
					}
				}).catch((err)=>{
					uni.showToast({
						title: JSON.stringify(err),
						icon: 'error'
					})
				})
			},
			goWXLogin() {
				this.utils.getProvider().then(provider => {
					console.log('当前的环境商', provider)
					if (!provider) {
						reject()
					}
					uni.login({
						provider: provider,
						success: async loginRes => {
							console.log(loginRes)
							uni.getUserInfo({
								provider: provider,
								success: (infoRes) => {
									uni.showToast({
										title: '登录中...',
										icon: 'loading'
									});
									loginByMp({
										code: loginRes.code,
										encryptedData: infoRes.encryptedData,
										iv: infoRes.iv,
										appId: getApp().globalData.appId
									}).then(res => {
										uni.hideLoading();
										if (res.code == 200) {
											// this.checkUserInfoA()
											this.$store.commit('setCoureLogin', 1);
											uni.setStorageSync('AppTokenmini_RTCourse', res.token);
											uni.setStorageSync('auto_userInfo', JSON.stringify(res.user));
											this.isLogin = true
											if(this.goReceive == 1) {
												if(res.user&&res.user.phone) {
													this.registerQwFsUserFinish()
												} else {
													this.showPhonePopup = true
												}
											}
										} else {
											uni.showToast({
												title: res.msg,
												icon: 'none'
											});
										}
									}).catch(err => {
										uni.hideLoading();
										uni.showToast({
											icon: 'none',
											title: "登录失败,请重新登录",
										});
									});
								}
							});
						}
					})
				}).catch(err => {})
			},
			async loginFsUserWx(data) {
				if (data) {
					console.log('huoqu1222', data)
					uni.showLoading({
						title: '登录中'
					})
					uni.login({
						provider: "weixin",
						success: async loginRes => {
							console.log(loginRes)
							let code = loginRes.code // 获取开发code
							handleFsUserWx({
									code: code,
									appId: getApp().globalData.appId,
									userId: data.userId
								})
								.then(res => {
									uni.hideLoading();
									if (res.code == 200) {
										this.code = ''
										console.log("loginFsUserWx:", res)
										let token = uni.getStorageSync('TOKEN_WEXIN');
										let user = uni.getStorageSync('web_userInfo')
										
										this.$store.commit('setCoureLogin', 1);
										uni.setStorageSync('AppTokenmini_RTCourse', token);
										uni.setStorageSync('auto_userInfo', JSON.stringify(user));
										this.isLogin = true
										if(this.goReceive == 1) {
											if(user&&user.phone) {
												this.registerQwFsUserFinish()
											} else {
												this.showPhonePopup = true
											}
										}
									} else {
										uni.showToast({
											icon: 'none',
											title: res.msg,
										});
									}
			
								})
						},
					})
				} else {
					uni.setStorageSync('H5course', {
						companyId: this.urlOption.companyId,
						companyUserId: this.urlOption.companyUserId,
					})
					await this.$store.dispatch('getWebviewUrl');
					uni.navigateTo({
						url: '/pages_course/webview'
					})
				}
			}
		}
	}
</script>

<style lang="scss">
	page{
		height: 100%;
	}
	.content{
		height: 100%;
		display: flex;
		flex-direction: column;
	}
	.thumb-up {
		width: 80%;
		height: 88rpx;
		background: linear-gradient( 90deg, #0050F1 0%, #36A9F7 100%);
		border-radius: 100rpx;
		color: #fff;
	}
	.thumb-up-fill {
		width: 80%;
		height: 88rpx;
		background: #FFFFFF;
		border-radius: 100rpx;
		border: 2rpx solid #0070FD;
		color: #0070FD;
	}
	.detail-cont{
		flex: 1;
		padding: 40upx;
		overflow-y: auto;
		.title{
			font-size: 40upx;
			font-family: PingFang SC;
			// font-weight: bold;
			color: #222222;
			line-height: 70upx;
		}
		.info{
			display: flex;
			align-items: center;
			font-size: 24upx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #999999;
			line-height: 48upx;
			margin: 23upx 0;
			.reads{
				margin-right: 30upx;
			}
		}
		.full-text{
			font-size: 36upx;
			font-family: PingFang SC;
			// font-weight: 500;
			color: #222222;
			line-height: 60upx;
		}
	}
	.recent-reads{
		width: 100%;
		flex-shrink: 0;
		box-sizing: border-box;
		height: 121upx;
		background: #FFFFFF;
		border-top: 1px solid #F0F0F0;
		display: flex;
		align-items: center;
		justify-content: center;
		.left{
			display: flex;
			align-items: center;
			.label{
				font-size: 28upx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #666666;
				line-height: 1;
				margin-right: 20upx;
			}
			.peop-box{
				display: flex;
				align-items: center;
				.head-box{
					margin-right: 28upx;
					display: flex;
					align-items: center;
					.head{
						width: 48upx;
						height: 48upx;
						border-radius: 50%;
						overflow: hidden;
						box-shadow: 0 0 0 1px #fff;
						margin-right: -10upx;
						image{
							width: 100%;
							height: 100%;
						}
					}
				}
				.arrow{
					width: 13upx;
					height: 23upx;
				}
			}
		}
		.share-btn{
			position: relative;
			width: 240upx;
			height: 80upx;
			line-height: 80upx;
			font-size: 30upx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			background: #1BB99D;
			border-radius: 40upx;
			display: flex;
			align-items: center;
			justify-content: center;
			image{
				width: 32upx;
				height: 32upx;
				margin-right: 15upx;
			}
			.share{
				position: absolute;
				width: 100%;
				height: 100%;
				opacity: 0;
			}
		}
	}
	.inquiry{
		width: 131upx;
		height: 131upx;
		position: fixed;
		right: 22upx;
		bottom: 193upx;
		z-index: 99;
		
		.content{
			position: relative;
			image{
				width: 100%;
				height: 100%;
				position: absolute;
				top: 0;
				left: 0;
				z-index: 9;
			}
			.text{
				position: absolute;
				top: 70upx;
				left: 50%;
				transform: translateX(-50%);
				z-index: 10;
				font-size: 22upx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #1BB99D;
				line-height: 1;
			}
			 
		}
		
		
	}
	.contact-btn{
		display: inline-block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		opacity: 0;
		z-index: 9999;
	}
	.subname{
		background-color: #00aa00;
		color: #fff;
	}
	.subavt{
		background-color: #fff;
		border: 2rpx #0a0 solid;
		color: #00aa00;
	}
	.boxweixin{
		width: 44rpx;
		height: 44rpx;
		border-radius: 50%;
		text-align: center;
		line-height: 34rpx;
		color: #0a0;
	}
	.boxnosel{
		border: #757575 4rpx solid;
	}
	.boxsel{
		border: #0a0 4rpx solid;
	}
	.button-container {
	  position: relative;
	  width: 240rpx;
	}
	.hidden-input {
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  opacity: 0;
	  z-index: 2;
	}
	.custom-button {
	  position: relative;
	  z-index: 1;
	  /* 其他样式 */
	  width:100%;
	  margin: 0 auto;
	  height: 80rpx;
	  line-height: 60rpx;
	  font-size: 28rpx;
	  padding: 10rpx 20rpx;
	}
	.submitname{
		width: 90%;
		
		margin: 0 auto;
		text-align: center;
		padding: 30rpx;
		margin-top: 40rpx;
	}
	.sub{
		background-color: #f0f0f0;
		color: #0a0;
	}
	.subact{
		background-color: #0a0;
		color: #fff;
	}
	.userlogo{
		height: 760rpx;
	}
	.color_FB2205 {
		color: #FB2205;
	}
	
	.popup-box {
		width: 518rpx;
		min-height: 568rpx;
		background: linear-gradient(180deg, #FFE7AC 0%, #FFFFFF 100%);
		border-radius: 56rpx 56rpx 56rpx 56rpx;
		position: relative;
		display: flex;
		align-items: center;
		flex-direction: column;
		box-shadow: 0 0 30px -6px rgba(255, 231, 206, 1);
	
		.activity_jb {
			height: 184rpx;
			margin-top: -130rpx;
			position: relative;
		}
	
		.popup-tit {
			font-family: PingFang SC;
			font-weight: 600;
			font-size: 40rpx;
			color: #000000;
			line-height: 80rpx;
		}
	
		.con {
			margin-top: 16rpx;
			width: 438rpx;
			min-height: 170rpx;
			padding: 16rpx 0;
			background: #FFE8AE;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			font-family: PingFang SC;
			font-weight: 400;
			font-size: 28rpx;
			color: #333333;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
		}
	
		.numbox {
			font-weight: 600;
			margin-bottom: 12rpx;
		}
	
		.num {
			font-size: 68rpx;
			margin-right: 10rpx;
		}
	
		.popbtn {
			width: 358rpx;
			height: 88rpx;
			background: linear-gradient(90deg, #F82D31 0%, #FD6C05 100%);
			box-shadow: 0rpx 8rpx 0rpx 0rpx #FEBC92;
			border-radius: 64rpx 64rpx 64rpx 64rpx;
			margin-top: 55rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 600;
			font-size: 32rpx;
			color: #FFFFFF;
		}
	}
	
	.popup-tips {
		margin-top: 20rpx;
		font-family: PingFang SC;
		font-weight: 400;
		font-size: 24rpx;
		color: #666666;
		text-align: center;
	}
	
</style>