youngee_c_web_v2/pages/mycenter/mycenter.vue

<template>
	<view>
		<!-- 胶囊 -->
		<mvBar :mysNavConfig="mysNavConfig"></mvBar>
		<view :style="{marginTop:navH}"></view>
		<view>
			<view class="head" v-if="token">
				<view class="head-left">
					<view class="head-avator" @click="toUserInfo()">
						<image :src="avatarUrl" mode="" style="width: 100%;height: 100%;border-radius: 100rpx;" />
					</view>
					<view>
						<p style="padding-bottom: 20rpx;font-size: 35rpx;" @click="toUserInfo()">{{nickName}}</p>
						<span style="display: flex;align-items: center;">
							<p style="font-size: 25rpx;">ID:{{information.id}}</p>
							<image :src="picture.icon_copy" mode="" style="width: 40rpx;height: 40rpx;"
								@click="handleCopy()" />
						</span>
					</view>
				</view>
				<view class="head-right">
					<image class="head-message" :src="picture.icon_message" @click="toMessage()"></image>
					<view v-if="hasUnReadMessage">
						<span class="point"></span>
					</view>
				</view>
			</view>

			<view class="head" v-if="!token">
				<view class="head-left">
					<view class="default-head-avator">
						<image :src="picture.defaultavatarUrl" mode="" @tap="login" style="width: 100%;height: 100%;">
						</image>
					</view>
					<view class="head-text">
						<p @tap="login" style="font-size: 35rpx;padding-bottom: 10rpx;">未登录</p>
						<p @tap="login" style="font-size: 30rpx;">点击登录账号</p>
					</view>
				</view>
			</view>

			<view class="show-income1">
				<view class="show-income1-left">
					<view class="show-income1-left-up">
						<view style="display: flex;align-items: center;">
							<p>我获得的收益总数</p>
							<image id="helpicon" :src="picture.icon_help" mode=""
								style="width: 35rpx;height: 35rpx;padding-left: 10rpx;"
								@click="showIncomeHelp = true" />
						</view>
						<view class="tip_box" v-if="showIncomeHelp" :style="{ top: boxTop + 'px'}">
							<view class="container" :style="{
						  'margin-right': cotainerMargin + 'px',
						  backgroundColor: '#404040', borderRadius: '5px' }">
								<!-- 提示文字 -->
								<view class="tips">
									<p>{{Text}}</p>
								</view>
								<view class="close" @click="showIncomeHelp = false">
									<image class="closeImg" src="../../static/delete.png" />
								</view>
							</view>
						</view>
					</view>
					<view class="show-income1-left-down">
						<p @click="toIncome('can')">
							{{information.showIncome?information.showIncome:'0.0'}}
						</p>
					</view>
				</view>
				<view class="show-income1-right">
					<view>
						<button class="show-income1-btn" type="default" @click="toIncome('can')">提现</button>
					</view>
				</view>
			</view>

			<view class="show-income2">
				<view class="show-income2-text" @click="toIncome('can')">
					<p style="padding-bottom: 20rpx;">可提现</p>
					<p>{{information.showCanwithdraw?information.showCanwithdraw:'0.0'}}</p>
				</view>
				<view class="show-income2-text" @click="toIncome('ed')">
					<p style="padding-bottom: 20rpx;">已提现</p>
					<p>{{information.showWithdrawed?information.showWithdrawed:'0.0'}}</p>
				</view>
				<view class="show-income2-text" @click="toIncome('ing')">
					<p style="padding-bottom: 20rpx;">提现中</p>
					<p>{{information.showWithdrawing?information.showWithdrawing:'0.0'}}</p>
				</view>
			</view>

			<view class="show-income1">
				<view class="show-income1-left">
					<view class="show-income1-left-up" style="margin-bottom: 10rpx;">
						<view style="display: flex;align-items: center;">
							<p>创作者积分</p>
							<image id="helpicon" :src="picture.icon_help" mode=""
								style="width: 35rpx;height: 35rpx;padding-left: 10rpx;" @click="showPointHelp = true" />
						</view>

						<view class="tip_box" v-if="showPointHelp" :style="{ top: boxTop + 'px'}">
							<view class="container" :style="{
								  'margin-right': cotainerMargin + 'px',
								  backgroundColor: '#404040', borderRadius: '5px' }">
								<!-- 提示文字 -->
								<view class="tips">
									<p>{{Text}}</p>
								</view>
								<view class="close" @click="showPointHelp = false">
									<image class="closeImg" src="../../static/delete.png" />
								</view>
							</view>
						</view>
					</view>
					<view class="show-income1-left-down">
						<p @click="toPoint()">
							{{information.showIncome?information.showIncome:'0'}}
						</p>
					</view>
				</view>

				<view class="show-income1-right" @click="toPoint()">
					<image class="show-body1-icon" :src="picture.icon_right"></image>
				</view>
			</view>

			<view class="show-body" style="border-bottom: 1rpx solid #c8c8c8;">
				<view class="show-body1">
					<view class="show-body1-text1" @click="toMyTask('all')">
						<p>我的任务</p>
					</view>
					<view class="show-body1-text2" @click="toMyTask('all')">
						<image class="show-body1-icon" :src="picture.icon_right"></image>
					</view>
				</view>
				<view class="show-body2">
					<view class="show-body2-text" @click="toMyTask('all')">
						<p class="task-num-p">{{information.numAllTask?information.numAllTask:0}}</p>
						<p padding>全部任务</p>
					</view>
					<view class="show-body2-text" @click="toMyTask('apply')">
						<p class="task-num-p">{{information.numApplyTask?information.numApplyTask:0}}</p>
						<p>已报名</p>
					</view>
					<view class="show-body2-text" @click="toMyTask('execute')">
						<p class="task-num-p">{{information.numExecuteTask?information.numExecuteTask:0}}</p>
						<p>执行中</p>
					</view>
					<view class="show-body2-text" @click="toMyTask('end')">
						<p class="task-num-p">{{ information.numEndTask ? information.numEndTask:0}}</p>
						<p>已结束</p>
					</view>
				</view>
			</view>

			<view class="show-body" style="border-bottom: 1rpx solid #c8c8c8;">
				<view class="show-body1">
					<view class="show-body1-text1" @click="toMyTeam('exe')">
						<p>YOUNG之团</p>
					</view>
					<view class="show-body1-text2" @click="toMyTeam('exe')">
						<p style="color: #f0d232;">看看团长收益</p>
						<image class="show-body1-icon" :src="picture.icon_right"></image>
					</view>
				</view>
				<view class="show-body2">
					<view class="show-body2-text" @click="toMyTeam('exe')">
						<p class="task-num-p">{{information.numExeTeam?information.numExeTeam:0}}</p>
						<p padding>开团中</p>
					</view>
					<view class="show-body2-text" @click="toMyTeam('end')">
						<p class="task-num-p">{{information.numEndTeam?information.numEndTeam:0}} </p>
						<p>已结束</p>
					</view>
					<view class="show-body2-text">
						<p style="color: #fff;">已结束</p>
					</view>
					<view class="show-body2-text">
						<p style="color: #fff;">已结束</p>
					</view>
				</view>
			</view>

			<view class="show-body" style="border-bottom: 1rpx solid #c8c8c8;">
				<view class="show-body1">
					<view class="show-body1-text1" @click="toMySec('all')">
						<p>选品广场</p>
					</view>
					<view class="show-body1-text2" @click="toMySec('all')">
						<image class="show-body1-icon" :src="picture.icon_right"></image>
					</view>
				</view>
				<view class="show-body2">
					<view class="show-body2-text" @click="toMySec('apply')">
						<p class="task-num-p">{{information.numApplySec?information.numApplySec:0}}</p>
						<p padding>已报名</p>
					</view>
					<view class="show-body2-text" @click="toMySec('execute')">
						<p class="task-num-p">{{information.numExecuteSec?information.numExecuteSec:0}}</p>
						<p>执行中</p>
					</view>
					<view class="show-body2-text" @click="toMySec('end')">
						<p class="task-num-p">{{information.numEndSec?information.numEndSec:0}}</p>
						<p>已结束</p>
					</view>
					<view class="show-body2-text">
						<p style="color: #fff;">已结束</p>
					</view>
				</view>
			</view>

			<view class="show-body">
				<view class="show-body2">
					<view class="show-body2-text" @click="handleInformation()">
						<image class="show-info-icon" style="width: 60rpx;height: 60rpx;padding-bottom: 15rpx;"
							:src="picture.icon_person"></image>
						<p>我的信息</p>
					</view>
					<view class="show-body2-text" @click="handleSubmitTask()">
						<image class="show-info-icon" :src="picture.icon_edit"></image>
						<p>发布任务</p>
					</view>
					<view class="show-body2-text">
						<p style="color: #fff;">联系客服</p>
					</view>
					<view class="show-body2-text">
						<p style="color: #fff;">客服</p>
					</view>
				</view>
			</view>

			<view class="contact" @click="toggle4('center')">
				<view class="contt">
					<!-- <image class="img2" src="https://horastar.obs.cn-east-3.myhuaweicloud.com/talent/home2.png" mode=""></image> -->
					<image class="img1"
						src="https://horastar.obs.cn-east-3.myhuaweicloud.com/talent/kefu_20211124192542.png" mode="">
					</image>

				</view>
			</view>

			<!-- 普通弹窗  公众号-->
			<uni-popup ref="popup2" class="share" background-color="#fff" @change="change">
				<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
					<view class="sharepage">
						<view class="Tasktext1">
							<image :src="picture.task15" mode=""></image>
							<span>YoungGee</span>
						</view>
						<view class="" style="margin-top: 5%;">
							<p style='color: #333333;font-size: 28rpx;text-align: center;'>不错过任何上新</p>
						</view>
						<view class="" style="margin-top: 5%;">
							<p style='color: #333333;font-size: 24rpx;'>公众号：</p>
						</view>

						<view class="sharemap">
							<image src="https://horastar.obs.cn-east-3.myhuaweicloud.com/talent/gzh.png" mode="">
							</image>
						</view>
					</view>
				</view>
			</uni-popup>

			<!-- 普通弹窗  商务合作-->
			<uni-popup ref="popup3" class="share" background-color="#fff" @change="change">
				<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
					<view class="sharepage">
						<view class="Tasktext1">
							<image :src="picture.task15" mode=""></image>
							<span>YoungGee</span>
						</view>
						<view class="" style="margin-top: 5%;">
							<p style='color: #333333;font-size: 28rpx;text-align: center;'>商务合作请联系我们</p>
						</view>
						<view class="" style="margin-top: 5%;">
							<p style='color: #333333;font-size: 24rpx;'>电话：010-53355656</p>
							<p style='color: #333333;font-size: 24rpx;'>商务：</p>
						</view>

						<view class="sharemap" style="margin-bottom: 5%;margin-top: 5%;">
							<image src="https://horastar.obs.cn-east-3.myhuaweicloud.com/talent/shangwu.png" mode="">
							</image>
						</view>
					</view>
				</view>
			</uni-popup>

			<!-- 普通弹窗  公众号-->
			<uni-popup ref="popup4" class="share" background-color="#fff" @change="change" :maskClick="false">
				<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
					<view class="sharepage">
						<view class="projecttext1">
							<image src="https://horastar.obs.cn-east-3.myhuaweicloud.com/talent/younggee_logo.png"
								style="width: 250rpx; height: 80rpx;" mode=""></image>
							<!-- <span>YoungGee</span> -->
						</view>
						<view class="sharemap">
							<image :src="kefuUrl" style="width: 400rpx;height: 400rpx;" mode=""></image>
						</view>
						<view style="margin: 30rpx 0;">
							<button class="butmin1" size="mini" @tap="saveImage">保存二维码</button>
						</view>
						<view class="sharetxt">
							<text>
								使用样叽的过程中，有任何疑问，\n
								请添加上方微信。\n
								我们保证及时全力为您解决！
							</text>
						</view>
						<view style="margin: 30rpx 0;">
							<button class="butmin" size="mini" @tap="closepop">知道了</button>
						</view>
					</view>

				</view>
			</uni-popup>
		</view>

		<!-- 普通弹窗  公众号-->
		<uni-popup ref="popup4" class="share" background-color="#fff" @change="change" :maskClick="false">
			<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
				<view class="sharepage">
					<view class="projecttext1">
						<image src="https://horastar.obs.cn-east-3.myhuaweicloud.com/talent/younggee_logo.png"
							style="width: 250rpx; height: 80rpx;" mode=""></image>
						<!-- <span>YoungGee</span> -->
					</view>
					<view class="sharemap">
						<image :src="kefuUrl" style="width: 400rpx;height: 400rpx;" mode=""></image>
					</view>
					<view style="margin: 30rpx 0;">
						<button class="butmin1" size="mini" @tap="saveImage">保存二维码</button>
					</view>
					<view class="sharetxt">
						<text>
							使用样叽的过程中，有任何疑问，\n
							请添加上方微信。\n
							我们保证及时全力为您解决！
						</text>
					</view>
					<view style="margin: 30rpx 0;">
						<button class="butmin" size="mini" @tap="closepop">知道了</button>
					</view>
				</view>

			</view>
		</uni-popup>


		<!-- 普通弹窗  发布任务-->
		<uni-popup ref="popup5" class="share" background-color="#fff" @change="change">
			<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
				<view class="sharepage">
					<view class="projecttext1">
						<span style="color: #f72424;font-size: 36rpx;line-height: 50rpx;">发布任务请用PC登录</span>
						<span style="color: #f72424;font-size: 36rpx;line-height: 50rpx;">www.younggee.com</span>
					</view>
					<view class="projecttext1" style="height: 40rpx;margin: 60rpx 0 10rpx;">
						<span style="font-size: 28rpx;line-height: 30rpx;">使用有任何疑问请联系样叽客服</span>
					</view>
					<view class="sharemap">
						<image :src="kefuUrl" style="width: 400rpx;height: 400rpx;" mode=""></image>
					</view>
					<view style="margin: 30rpx 0;">
						<button class="butmin1" size="mini" @tap="saveImage">保存二维码</button>
					</view>
				</view>

			</view>
		</uni-popup>

		<!-- <view class="" style="text-align: center;margin: 5% 0;">
			<button size="mini" @tap="toSpecialTask()">专项测试</button>
		</view> -->
		<!-- <view class="" style="text-align: center;margin: 5% 0;">
			<button size="mini" @tap="toTest()">进入测试页面</button>
		</view> -->
	</view>
</template>

<script>
	import mvBar from "@/components/mys_navBar/mysNavBar";
	import {
		saveImageToPhotosAlbum,
		showToast,
		downloadFile
	} from '@/uni_modules/sakura-canvas/js_sdk/util';
	import {
		money
	} from '@/components/utils.js';
	export default {
		components: {
			mvBar,
		},
		data() {
			return {
				kefuUrl: "https://horastar.obs.cn-east-3.myhuaweicloud.com/talent/kefu.jpeg",
				navH: getApp().globalData.navHeight,
				hasUnReadMessage: false,
				Text: "在平台产生的总收益【可提现+已提现+提现中】",
				showPointHelp: false,
				showIncomeHelp: false,
				boxTop: 0,
				arrowMargin: 0,
				cotainerMargin: 0,
				screenWidth: 0,
				picture: {
					icon_help: 'https://horastar.obs.cn-east-3.myhuaweicloud.com/talent_upload/icon-help.png',
					icon_copy: 'https://horastar.obs.cn-east-3.myhuaweicloud.com/talent_upload/icon-copy.png',
					icon_person: 'https://horastar.obs.cn-east-3.myhuaweicloud.com/youngee/talent_upload/icon-person.png',
					icon_edit: 'https://horastar.obs.cn-east-3.myhuaweicloud.com/talent_upload/icon-edit2.png',
					icon_location: 'https://horastar.obs.cn-east-3.myhuaweicloud.com/youngee/talent_upload/icon-location.png',
					icon_account: 'https://horastar.obs.cn-east-3.myhuaweicloud.com/youngee/talent_upload/icon-account.png',
					icon_rmb: 'https://horastar.obs.cn-east-3.myhuaweicloud.com/youngee/talent_upload/icon-rmb.png',
					icon_message: 'https://horastar.obs.cn-east-3.myhuaweicloud.com/youngee/talent_upload/icon-message.png',
					icon_right: 'https://horastar.obs.cn-east-3.myhuaweicloud.com/talent_upload/icon-arrow-right.png',
					defaultavatarUrl: 'https://horastar.obs.cn-east-3.myhuaweicloud.com/talent/logoxin01.png',
				},
				token: '',
				nickName: '',
				avatarUrl: '',
				type: 'center',
				type2: 'center',
				type3: 'center',
				type4: 'center',
				mysNavConfig: {
					/* 开启单页显示首页图标 */
					isHome: true,
					/* 固定导航  */
					navFixed: true,
					/* 标题 （屏幕中心居中 两边图标中心居中使用slot center1） */
					navTitle: {
						text: "我的",
						color: "",
						fontSize: "32rpx", // px upx rpx
						fontWeight: "normal", // 100 - 700
					},
				},
				codeImg: '',
				information: {},
			};
		},
		onReady() {
			this.init()
		},
		async onShow() {
			// 显示加载中
			uni.showLoading({
				title: '加载中'
			});
			// 判断登陆是否过期
			this.token = uni.getStorageSync('token')
			await this.$https.get('/youngee/c/t/g/is-login')
				.then(res => {
					if (res.data.code == 403) {
						this.token = ""
						uni.hideLoading();
					}
				})
			if (this.token !== '') { // 若登录
				this.nickName = uni.getStorageSync('nickName');
				this.avatarUrl = uni.getStorageSync('avatarUrl');

				// 获取达人基本信息
				await this.$https.get('/youngee/c/t/g/get-talent-info')
					.then(res => {
						if (res.data.code === 0) {
							this.information = res.data.data
							this.information.showWithdrawing = money(this.information.withdrawing)
							this.information.showWithdrawed = money(this.information.withdrawed)
							this.information.showCanwithdraw = money(this.information.canwithdraw)
							this.information.showIncome = money(this.information.income)
						}
					});
				// 获取达人参与任务数量
				await this.$https.get('/youngee/c/t/g/get-task-num')
					.then(res => {
						console.log(res)
						if (res.data.code === 0) {
							this.information.numAllTask = res.data.data.all_num
							this.information.numApplyTask = res.data.data.sign_up_num
							this.information.numExecuteTask = res.data.data.going_on_num
							this.information.numEndTask = res.data.data.completed_num
						}
					})
				await this.$https.get('/youngee/c/t/g/has-un-read-message')
					.then(res => {
						if (res.data.code === 0) {
							this.hasUnReadMessage = res.data.data === 0 ? false : true;
						}
					})
			} else { // 未登录
				// this.login();
			}
			uni.hideLoading();
		},
		onLoad() {},
		methods: {				
			toTest(){
				uni.navigateTo({
					url: '/pages/test/test'
				});
			},
			toSpecialTask() {
				uni.navigateTo({
					url: '/pages/tasksquare/specialTask/specialTaskDetail?id=' + "2301261257"
				});
			},
			init() {
				let rect = uni.getMenuButtonBoundingClientRect();
				let screenWidth = uni.getSystemInfoSync().screenWidth;
				// this.boxTop = rect.bottom;
				this.arrowMargin = rect.width * 0.75 + 4;
				this.cotainerMargin = screenWidth - rect.right;

				var that = this;

				const query = uni.createSelectorQuery().in(that);
				query.select('#helpicon').boundingClientRect(data => {
					this.boxTop = data.bottom;
					console.log(data)
				}).exec();
			},
			handleCopy() {
				wx.setClipboardData({
					data: this.information.id,
					success: function(res) {
						console.log("复制成功");
					}
				});
			},
			// 进入登录页面
			login() {
				uni.navigateTo({
					url: '../login/login'
				});
			},
			// 进入头像昵称修改页面
			toUserInfo() {
				uni.navigateTo({
					url: '../login/userinfo'
				});
			},
			// 进入通知页面
			toMessage() {
				uni.navigateTo({
					url: 'message'
				});
			},
			// 进入个人资料
			handleInformation() {
				if (this.token !== '')
					uni.navigateTo({
						url: '/pages/mycenter/myinformation/myinformation'
					});
				else
					this.login()
			},
			// 进入收益页面
			toIncome(tab) {
				console.log(tab)
				if (this.token !== '') {
					switch (tab) {
						case "can":
							uni.navigateTo({
								url: '/pages/mycenter/myincome?showTab=1'
							});
							break;
						case "ed":
							uni.navigateTo({
								url: '/pages/mycenter/myincome?showTab=2'
							});
							break;
						case "ing":
							uni.navigateTo({
								url: '/pages/mycenter/myincome?showTab=3'
							});
							break;
					}
				} else
					this.login()
			},
			toPoint() {
				if (this.token !== '') {
					uni.navigateTo({
						url: '/pages/mycenter/mypoint/mypoint'
					});
				} else
					this.login()
			},
			// 进入我的任务页面
			toMyTask(tab) {
				console.log(tab)
				if (this.token !== '') {
					var data = {
						tab: tab
					};
					data = JSON.stringify(data)
					uni.navigateTo({
						url: '/pages/mycenter/mytask/mytask?textObj=' + encodeURIComponent(data)
					});
				} else
					this.login()
			},
			// 进入我的young之团页面
			toMyTeam(tab) {
				console.log("toMyTeam: ",tab)
				if (this.token !== '') {
					var data = {
						tab: tab
					};
					data = JSON.stringify(data)
					uni.navigateTo({
						url: '/pages/mycenter/myteam/myteam?textObj=' + encodeURIComponent(data)
					});
				} else
					this.login()
			},
			// 进入我的选品页面
			toMySec(tab) {
				console.log("toMySec: ",tab)
				if (this.token !== '') {
					var data = {
						tab: tab
					};
					data = JSON.stringify(data)
					uni.navigateTo({
						url: '/pages/mycenter/myselection/myselection?textObj=' + encodeURIComponent(data)
					});
				} else
					this.login()
			},
			// 保留两位小数点
			toDecimal(x) {
				var f = parseFloat(x);
				if (isNaN(f)) {
					return;
				}
				f = Math.round(x * 100) / 100;
				return f;
			},
			//弹出层
			change(e) {
				console.log('当前模式：' + e.type + ',状态：' + e.show);
			},
			togo2(type) {
				this.type2 = type
				// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
				this.$refs.popup2.open(type)
				// this.$refs.popup1.close()
			},
			togo3(type) {
				this.type3 = type
				// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
				this.$refs.popup3.open(type)
				// this.$refs.popup1.close()
			},
			toggle4(type) {
				this.type4 = type
				// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
				this.$refs.popup4.open(type)
				// this.$refs.popup1.close()
			},
			// 保存图片
			async saveImage() {
				// showToast('保存成功')
				wx.downloadFile({
					url: this.kefuUrl,
					success: function(res) {
						wx.saveImageToPhotosAlbum({
							filePath: res.tempFilePath,
							success: function(data) {
								wx.showToast({
									title: "保存成功",
									icon: "success",
									duration: 2000
								})
							},
							fail: function(err) {
								console.log(err);
							},
							complete(res) {
								console.log(res);
							}
						})
					}
				})
			},
			closepop() {
				this.$refs.popup4.close()
			},
			// 进入个人资料
			handleSubmitTask() {
				// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
				this.$refs.popup5.open()
				// this.$refs.popup1.close()
			},
		},
	};
</script>
<style>
	/deep/ .share .uni-popup .uni-popup__wrapper {
		width: 70% !important;
		border-radius: 15rpx !important;
	}
</style>
<style lang="scss" scoped>
	p {
		font-size: 32rpx;
	}

	.head {
		display: flex;
		/* 垂直居中 */
		align-items: center;
		justify-content: space-between;
		height: 200rpx;
		position: relative;
		margin: 2% 3% 3%;
	}

	.head-left {
		display: flex;
		align-items: center;
	}

	.head-right {
		display: flex;
	}

	.default-head-avator {
		display: inline-block;
		margin: 0 25rpx;
		padding: 10rpx 10rpx 0 0;
		width: 120rpx;
		height: 120rpx;
		background-color: #F0D232;
		border-radius: 50%;
	}

	.head-avator {
		display: inline-block;
		margin: 0 25rpx;
		width: 120rpx;
		height: 120rpx;
		background-color: #F0D232;
		border-radius: 50%;
	}

	.head-text {
		display: inline-block;

	}

	.head-message {
		margin: 10rpx 20rpx 10rpx 100rpx;
		width: 60rpx;
		height: 60rpx;
	}

	.show-income1 {
		height: 150rpx;
		margin: 0 3% 0 8%;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.show-income1-btn {
		width: 150rpx;
		// padding: 0 40rpx;
		text-align: center;
		background-color: #F0D232;
		border-radius: 15rpx;
		font-size: 32rpx;
		line-height: 250%;
	}

	.show-income1-left {
		display: flex;
		flex-direction: column;
		justify-content: start;
	}

	.show-income1-left-up {
		margin-bottom: 10rpx;
	}

	.show-income1-left-down p {
		font-size: 40rpx;
		font-weight: bold;
		color: #F0D232;
	}

	.show-income1-right {
		padding-right: 20rpx;
	}

	.show-income2 {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 150rpx;
		margin: 0 3% 3%;
		background-color: #F0D232;
		border-radius: 10rpx;
		padding: 0 5%;
	}

	.show-income2-text {
		width: 24%;
		text-align: center;
	}

	.show-body {
		height: 250rpx;
		margin: 0 3% 3%;
	}

	.show-body1 {
		display: flex;
		align-items: center;
		height: 80rpx;
	}

	.show-body1-text1 {
		display: flex;
		justify-content: flex-start;
		margin-left: 40rpx;
		// margin-right: 480rpx;
	}

	.show-body1-text2 {
		display: flex;
		justify-content: flex-end;
		align-items: center;
		margin-right: 20rpx;
		flex: 1;
		// display: flex;
	}

	.show-body1-icon {
		width: 30rpx;
		height: 30rpx;
	}

	.show-body2 {
		// display: flex;
		// align-items: center;
		// justify-content: space-between;

		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 5%;
	}

	.show-body2-text {
		// width: 150rpx;
		width: 22%;
		text-align: center;
	}

	.task-num-p {
		padding-bottom: 40rpx;
		font-size: 35rpx;
		font-weight: bold;
		color: #F0D232;
	}

	.shu-line {
		border: 1rpx solid #BCBCBC;
		float: left;
		height: 70rpx;
		margin: 0 10rpx;
		margin-bottom: 30rpx;
	}

	.show-info {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 40rpx;
	}

	.show-info-text {
		text-align: center;
	}

	.show-info-icon {
		width: 50rpx;
		height: 50rpx;
		padding-bottom: 20rpx;
	}


	.butto {
		text-align: center;
	}

	.option {
		padding: 20rpx;
	}

	.uni-margin-wrap {
		width: 690rpx;
		width: 100%;
		;
	}

	.swiper {
		height: 300rpx;
	}

	.swiper-item {
		display: block;
		height: 300rpx;
		line-height: 300rpx;
		text-align: center;
	}

	.swiper-list {
		margin-top: 40rpx;
		margin-bottom: 0;
	}

	.uni-common-mt {
		margin-top: 60rpx;
		position: relative;
	}

	.info {
		position: absolute;
		right: 20rpx;
	}

	.uni-padding-wrap {
		width: 550rpx;
		padding: 0 100rpx;
	}

	.card {
		width: 88%;
		// height: 200rpx;
		padding: 24rpx;
		margin-top: 30rpx;
		border-radius: 15rpx;
		background-color: #ffffff;
		margin: 0 auto;
		box-shadow: 0px 0px 10rpx 2rpx #ffffff;
	}

	.iimmg {
		width: 80rpx;
		height: 80rpx;
		background-color: #FFFFFF;
		border-radius: 15%;
	}

	.iimmg image {
		width: 60%;
		height: 60%;
		padding: 20%;
	}

	.ppan {
		font-size: 60%;
		margin-top: 1%;
	}

	.headportrait {
		margin: 0 auto;
		width: 180rpx;
		height: 180rpx;
		background-color: #FEE58E;
		border-radius: 50%;
	}

	.task22 {
		width: 80%;
		height: 80%;
		padding: 10%;
	}

	.but1 {
		// width: 120%;
		text-align: center;
		background-color: #1890FF;
		color: #FFFFFF;
		border-radius: 10rpx;
		font-size: 34rpx;
		line-height: 150%;
		font-weight: 500;
		height: 60%;
	}

	.dou p {
		font-size: 26rpx;
		color: #333333;
		font-weight: 550;
		text-align: center;
	}

	.dou span {
		font-size: 24rpx;
		color: #666666;
		text-align: center;
	}

	.title-left {
		width: 4rpx;
		height: 80rpx;
		background: #E2E2E2;
		display: inline-block;
		border-radius: 1rpx;
		margin-top: 4rpx;
		vertical-align: top;

	}

	.share {
		text-align: center;
		line-height: 10rpx;
		margin-top: 10rpx;
	}

	.share image {
		vertical-align: middle;
		width: 25rpx;
		height: 25rpx;
		display: inline-block
	}

	.share p {
		// display: inline-block;
		font-size: 24rpx;
		// color: #333333;
	}

	/deep/ .share.uni-popup .uni-popup__wrapper {
		width: 70%;
		border-radius: 15rpx;
	}

	.Tasktext1 {
		// padding-top: 5%;
		padding: 0 0 0 1%;
		height: 80rpx;
		margin-top: 7%;
		text-align: center;
	}

	.Tasktext1 span {
		color: #333333;
		font-size: 100%;
		font-weight: 550;
		text-indent: 2em;

	}

	.Tasktext1 image {
		vertical-align: middle;
		width: 80rpx;
		height: 80rpx;
		display: inline-block;
		padding-right: 14rpx;
	}


	.butmin {
		height: 48rpx;
		background-color: #3397FA;
		color: #FFFFFF;
		line-height: 48rpx;
	}

	.tip_box {
		position: fixed;
		top: 0;
		right: 0;
		z-index: 9999;
		display: flex;
		justify-content: flex-end;
		align-items: flex-end;
		flex-direction: column;

		.arrow {
			width: 0;
			height: 0;
			border: 10rpx solid;
			border-color: transparent;
		}

		.container {
			display: flex;
			align-items: center;
			justify-content: center;
			padding: 16rpx 24rpx;

			.tips {
				flex: 1;
				padding-right: 12rpx;
			}

			.tips p {
				font-size: 24rpx;
				color: #fff
			}

			.close {
				display: flex;
				align-items: center;
				height: 30rpx;
				width: 30rpx;

				.closeImg {
					height: 100%;
					width: 100%;
				}
			}
		}
	}

	.point {
		position: absolute;
		// top: 0;
		right: 5px;
		width: 20rpx;
		height: 20rpx;
		background: red;
		border-radius: 50%;
	}

	.contt {
		position: relative;
	}

	.contact {
		position: fixed;
		top: 80%;
		right: 13%;
	}

	.img1 {
		width: 84rpx;
		height: 124rpx;
		position: absolute;
	}

	//弹窗
	.sharepage {
		// width: 90%;
		margin: 0 auto;
		// position: relative;
	}

	/deep/ .share.uni-popup .uni-popup__wrapper {
		width: 70%;

		border-radius: 15rpx;
	}

	.projecttext1 {
		// padding-top: 5%;
		padding: 0 0 0 1%;
		height: 80rpx;
		margin: 5% 0;
		text-align: center;
	}

	.projecttext1 image {
		vertical-align: middle;
		width: 80rpx;
		height: 80rpx;
		display: inline-block;
		padding-right: 14rpx;
	}

	.sharemap {
		margin: 0 auto;
		text-align: center;
		// margin-top: 15%;
		// margin-bottom: 15%;
	}

	.sharemap image {
		width: 400rpx;
		height: 400rpx;

	}

	.sharetxt {
		height: 100rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.sharetxt text {
		font-size: 24rpx;
		text-align: left;
		line-height: 20rpx
	}

	.butmin {
		// height: 48rpx;
		width: 250rpx;
		background-color: #FCCF41;
		line-height: 48rpx;
	}

	.butmin1 {
		// height: 48rpx;
		width: 250rpx;
		background-color: #fff;
		border: #000000 1rpx solid;
		line-height: 48rpx;
	}
</style>