<template>
	<view class="text-white ">
		<view class="top" ref="top">我的</view>
		<view class="bg">
			<view class=" u-flex padding ">
				<view class="u-m-r-10" style="position: relative;">
					<image :src="avatar" style="width: 100rpx;height: 100rpx;border-radius: 50%;"
						@click="goNav('/pages/my/userinfo')"></image>
					<view style="position: absolute; top: -13px; right: -8px;z-index: 9;"
						v-if="isVip&&XCXIsSelect !='否'">
						<image src="../../static/images/vp.png" style="width: 25px;height:24px;"></image>
					</view>
				</view>
				<view class="u-flex-1 u-m-l-10 text-white" v-if="!isLogin">
					<view>
						<view class="u-font-18 margin-left-sm text-bold">{{userName}}</view>
						<view class="u-font-15 margin-left-sm margin-top-xs">ID:{{invitationCode}}</view>
					</view>
				</view>
				<view v-else class="text-xl u-p-l-20 text-bold" @click="goLogin('/pages/public/login')">
					登录
				</view>
			</view>
		</view>
		<view class="aqwa flex align-center justify-between">
			<view class="aqwaleft" @click="goNav('/my/wallet/index')" v-if="XCXIsSelect != '否'">
				<view class="flex align-center justify-center">
					<image src="../../static/images/my/yue.png" style="width: 45rpx;height: 44rpx;"></image>
					<view class="" style="margin-left: 16rpx;color: #6d3b03;font-weight: bold;font-size: 30rpx;">
						余额
					</view>
				</view>
				<view class="" style="font-size: 40rpx;color: #333333;font-weight: 600;margin: 14rpx 0;">
					{{money}}
				</view>
				<view class="flex align-center justify-center">
					<view class="" style="margin-right: 16rpx;color: #a88554;">
						充值
					</view>
					<image src="../../static/images/my/jiantou.png" style="width: 14rpx;height: 22rpx;"></image>
				</view>
			</view>
			<view class="aqwacenter" style="width: 1%;">
				<view class="" style="width: 2rpx;height: 80rpx;background-color: #cdae81;"></view>
			</view>
			<view class="aqwaright" @click="goNav('/my/hongbao/youhuijuan')" v-if="XCXIsSelect != '否'">
				<view class="flex align-center justify-center">
					<image src="../../static/images/my/yhq.png" style="width: 45rpx;height: 42rpx;"></image>
					<view class="" style="margin-left: 16rpx;color: #6d3b03;font-weight: bold;font-size: 30rpx;">
						优惠券
					</view>
				</view>
				<view class="" style="font-size: 40rpx;color: #333333;font-weight: 600;margin: 14rpx 0;">
					{{couponnum}}
				</view>
				<view class="flex align-center justify-center">
					<view class="" style="margin-right: 16rpx;color: #a88554;">
						查看
					</view>
					<image src="../../static/images/my/jiantou.png" style="width: 14rpx;height: 22rpx;"></image>
				</view>
			</view>
		</view>
		<view class="padding-lr margin-lr" style="background-color: #111111;border-radius: 18rpx;margin-top: 30rpx;"
			v-if="XCXIsSelect != '否' && hyCheck != '否'">
			<view class="flex justify-between align-center" style="height: 140rpx;">
				<view class="flex justify-between align-center" style="">
					<view class="">
						<image src="../../static/images/my/lihe.png" style="width: 70upx;height: 70upx;" mode="">
						</image>
					</view>
					<view class="" style="margin-left: 24rpx;">
						<view v-if="!isVip" class="vipttl">开通会员</view>
						<view v-if="isVip" class="vipttl">会员中心</view>
						<view class="flex-sub text-26" style="color: #e6c485;margin-top: 6rpx;">会员可享贵族福利</view>
					</view>
				</view>
				<view v-if="!isVip" class="btn-bg" @click="goNav('/my/vip/index')"
					style="justify-content: space-between;">立即开通
				</view>
				<view v-if="isVip" class="btn-bg" @click="goNav('/my/vip/index')"
					style="justify-content: space-between;">会员特权
				</view>
			</view>
		</view>
		<!-- <view class="box">
			<view style="font-size: 30upx;font-weight: bold;margin: 30upx 0upx 0upx 30upx;">我的订单</view>
			<view class="flex justify-around text-center">
				<view class=" padding-tb" @click="goNavOrder(1)">
					<image src="../../static/images/my/order1.png" style="width:60upx;height: 60upx;" mode="">
					</image>
					<view class="text-df" style="line-height: 50upx;">待付款</view>
				</view>
				<view class=" padding-tb" @click="goNavOrder(2)">
					<image src="../../static/images/my/order6.png" style="width: 60upx;height: 60upx;" mode="">
					</image>
					<view class="text-df" style="line-height: 50upx;">待接单</view>
				</view>
				<view class=" padding-tb" @click="goNavOrder(2)">
					<image src="../../static/images/my/order2.png" style="width: 60upx;height: 60upx;" mode="">
					</image>
					<view class="text-df" style="line-height: 50upx;">已接单</view>
				</view>
				<view class=" padding-tb" @click="goNavOrder(6)">
					<image src="../../static/images/my/order4.png" style="width: 60upx;height: 60upx;" mode="">
					</image>
					<view class="text-df" style="line-height: 50upx;">待评价</view>
				</view>
				<view class=" padding-tb" @click="goNavOrder(8)">
					<image src="../../static/images/my/order3.png" style="width: 60upx;height: 60upx;" mode="">
					</image>
					<view class="text-df" style="line-height: 50upx;">已完成</view>
				</view>
			</view>
		</view> -->

		<!-- <image src="https://admin.sjajk.com/file/uploadPath/2023/02/17/f98b11f8bc19c1541d3b88b8c1cd3dcd.png"
			class="kefu_view" @click="goChat">
		</image> -->
		<view class="box">

			<view style="font-size: 30upx;font-weight: bold;margin: 0upx 0upx 14upx 30upx;">常用功能</view>
			<view class="flex text-center flex-wrap">
				<!-- <view class="padding-tb-sm" @click="goNav('/my/wallet/index')" v-if="XCXIsSelect != '否'"
					style="width: 25%;">
					<image src="../../static/images/my/money.png" style="width: 55upx;height: 55upx;" mode=""></image>
					<view class="text-df" style="line-height: 50upx;">我的钱包</view>
				</view> -->
				<view class="padding-tb-sm" @click="goNav('/my/gird/shoucang')" style="width: 25%;">
					<image src="../../static/images/my/shoucang.png" style="width: 55upx;height: 55upx;" mode="">
					</image>
					<view class="text-df" style="line-height: 50upx;">我的收藏</view>
				</view>
				<!-- <view class="padding-tb-sm" @click="goNav('/my/hongbao/youhuijuan')" v-if="XCXIsSelect != '否'"
					style="width: 25%;">
					<image src="../../static/images/my/youhuijuan.png" style="width: 55upx;height: 55upx;" mode="">
					</image>
					<view class="text-df" style="line-height: 50upx;">优惠券</view>
				</view> -->
				<view class="padding-tb-sm" @click="bindFb()" v-if="XCXIsSelect != '否'" style="width: 25%;">
					<image src="../../static/images/my/ruzhu.png" style="width: 55upx;height: 55upx;" mode=""></image>
					<view class="text-df" style="line-height: 50upx;">成为按摩师</view>
				</view>
				<!-- <view class="padding-tb-sm" @click="goChat" style="width: 25%;">
					<image src="../../static/images/my/kefu.png" style="width: 55upx;height: 55upx;" mode=""></image>
					<view class="text-df" style="line-height: 50upx;">在线客服</view>
				</view> -->
				<!-- <view class="padding-tb-sm" @click="goNav('/my/feedback/index')" style="width: 25%;">
					<image src="../../static/images/my/yijian.png" style="width: 55upx;height: 55upx;" mode=""></image>
					<view class="text-df" style="line-height: 50upx;">意见反馈</view>
				</view> -->
				<!-- <view class="padding-tb-sm" @click="goNav('/my/order/tousuList')" style="width: 25%;">
					<image src="../../static/images/my/mytousu.png" style="width: 55upx;height: 55upx;" mode=""></image>
					<view class="text-df" style="line-height: 50upx;">我的投诉</view>
				</view> -->
				<view v-if="isShop == 1" class="padding-tb-sm" @click="goNav('/my/gonghui/index')" style="width: 25%;">
					<image src="../../static/images/my/gonghui.png" style="width: 55upx;height: 55upx;"></image>
					<view class="text-df" style="line-height: 50upx;">我的商户</view>
				</view>
				<view class="padding-tb-sm" @click="goNav('/pages/my/myteam')" style="width: 25%;"
					v-if="isAgency == 1 && tgCheck != '否'">
					<image src="../../static/images/my/myteam.png" style="width: 55upx;height: 55upx;" mode=""></image>
					<view class="text-df" style="line-height: 50upx;">我的团队</view>
				</view>
				<view class="padding-tb-sm" @click="goNav('/pages/my/invitationUser')" style="width: 25%;">
					<image src="../../static/images/my/myyao.png" style="width: 55upx;height: 55upx;" mode=""></image>
					<view class="text-df" style="line-height: 50upx;">分享好友</view>
				</view>
				<view class="padding-tb-sm" @click="goNav('/pages/my/cooperation')" style="width: 25%;"
					v-if="isAgency != 1 && tgCheck != '否'">
					<image src="../../static/images/my/mydl.png" style="width: 55upx;height: 55upx;" mode=""></image>
					<view class="text-df" style="line-height: 50upx;">成为代理商</view>
				</view>
				<view class="padding-tb-sm" @click="goNav('/my/address/address')" style="width: 25%;">
					<image src="../../static/images/my/yijian.png" style="width: 55upx;height: 55upx;" mode=""></image>
					<view class="text-df" style="line-height: 50upx;">地址管理</view>
				</view>
				<view class="padding-tb-sm" @click="goNav('/my/help/feedbackIndex')" style="width: 25%;">
					<image src="../../static/images/my/help.png" style="width: 55upx;height: 55upx;" mode=""></image>
					<view class="text-df" style="line-height: 50upx;">帮助中心</view>
				</view>
				<view class="padding-tb-sm" @click="goNav('/my/setting/index')" style="width: 25%;">
					<image src="../../static/images/my/set.png" style="width: 55upx;height: 55upx;" mode=""></image>
					<view class="text-df" style="line-height: 50upx;">设置中心</view>
				</view>
				<!-- #ifndef H5 -->
				<view class="padding-tb-sm" @click="goNav('/pages/my/jinji')" style="width: 25%;">
					<image src="../../static/images/my/set1.png" style="width: 55upx;height: 55upx;" mode=""></image>
					<view class="text-df" style="line-height: 50upx;">紧急求助</view>
				</view>
				<!-- #endif -->
			</view>
		</view>
		<view class="flex align-center justify-center" style="margin: 30rpx 0;text-align: center;">
			<image src="../../static/images/my/leile.png" style="width: 29rpx;height: 12rpx;" mode=""></image>
			<text class="" style="color: #a1a1a1;font-size: 28rpx;font-weight: bold;margin: 0 16rpx;">
				当你累了 想起盛安到家
			</text>
			<image src="../../static/images/my/leile2.png" style="width: 29rpx;height: 12rpx;" mode=""></image>
		</view>
		<view class="">
			<view style="font-size: 30upx;font-weight: bold;margin: 34upx 0upx 14upx 30upx;"></view>
			<view class="flex text-center flex-wrap">
				<!-- <view class="padding-tb-sm" @click="goChat" style="width: 25%;">
					<image src="../../static/images/my/kefu.png" style="width: 55upx;height: 55upx;" mode=""></image>
					<view class="text-df" style="line-height: 50upx;">在线客服</view>
				</view> -->
				<!-- <view class="padding-tb-sm" @click="goNav('/my/feedback/index')" style="width: 25%;">
					<image src="../../static/images/my/yijian.png" style="width: 55upx;height: 55upx;" mode=""></image>
					<view class="text-df" style="line-height: 50upx;">意见反馈</view>
				</view> -->
				<!-- <view class="padding-tb-sm" @click="goNav('/my/order/tousuList')" style="width: 25%;">
					<image src="../../static/images/my/mytousu.png" style="width: 55upx;height: 55upx;" mode=""></image>
					<view class="text-df" style="line-height: 50upx;">我的投诉</view>
				</view> -->




			</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				isShop: 0,
				hyCheck: '否',
				tgCheck: '否',
				isAgency: 0,
				avatar: '../../static/logo.png',
				isLogin: true,
				userName: '匿名',
				phone:"18684369159",
				browse: 0, //浏览数
				fans: 0, //粉丝数
				follow: 0, //关注数
				visitor: 0, //访客数
				userId: '',
				isVip: false,
				invitationCode: '', //邀请码
				money: '0',
				couponnum: '0',
				list: [{
						image: '',
						title: '',
						url: ''
					}, {
						image: '',
						title: '我的收藏',
						url: ''
					}, {
						image: '',
						title: '',
						url: ''
					}, {
						image: '',
						title: '成为按摩师',
						url: ''
					}, {
						image: '',
						title: '联系客服',
						url: ''
					}, {
						image: '',
						title: '意见反馈',
						url: ''
					},
					// {
					// 	image: '',
					// 	title: '帮助中心',
					// 	url: ''
					// }, 
					{
						image: '',
						title: '设置中心',
						url: ''
					}, {
						image: '',
						title: '退出登录',
						url: ''
					}
				],
				renzheng: 0,
				XCXIsSelect: '否',
			}
		},
		onLoad(e) {
			this.XCXIsSelect = this.$queue.getData("XCXIsSelect");
			if (e.money && e.couponnum) {
				this.money = e.money;
				this.couponnum = e.couponnum;
			}
		},
		onShow() {
			this.hyCheck = this.$queue.getData('hyCheck');
			this.tgCheck = this.$queue.getData('tgCheck');
			this.userId = uni.getStorageSync('userId')
			if (this.userId) {
				this.isLogin = false
				this.getUserInfo()

				this.getAmount()
				this.getIsVip()
			} else {
				this.isShop = 0;
				this.isAgency = 0;
				this.isLogin = true
				this.userName = '匿名'
				this.browse = 0
				this.fans = 0
				this.follow = 0
				this.visitor = 0
				this.avatar = '../../static/logo.png'
				this.isVip = false
			}

		},
		methods: {
			goChat() {
				let kefu = this.$queue.getData('kefu'); // 用户端联系方式 1 手机号 2企业微信 
				let kefuPhone = this.$queue.getData('kefuPhone');
				if (kefu == 1) {
					uni.makePhoneCall({
						phoneNumber: kefuPhone //仅为示例
					});
				} else if (kefu == 3) {
					uni.navigateTo({
						url: '/my/setting/customer'
					});
				} else {
					// #ifdef MP-WEIXIN
					let that = this
					try {
						wx.openCustomerServiceChat({
							extInfo: {
								url: that.$queue.getData('kefuUrl')
							},
							corpId: that.$queue.getData('kefuAppId'),
							success(res) {},
							fail(res) {
								console.error(res)
							}
						})
					} catch (error) {
						console.error("catchcatch" + error)
						uni.showToast({
							title: '请更新至微信最新版本'
						});
					}
					// #endif
					// #ifndef MP-WEIXIN
					let url = this.$queue.getData('kefuUrl');
					if (url.indexOf('/pages/') !== -1 || url.indexOf('/my/') !== -1) {
						uni.navigateTo({
							url
						});
					} else {
						//#ifndef H5
						uni.navigateTo({
							url: '/pages/index/webView?url=' + url
						});
						//#endif
						//#ifdef H5
						window.location.href = url;
						//#endif
					}
					// #endif
				}
			},
			//退出登录
			TuiLogin() {
				let that = this
				if (that.userId) {
					uni.showModal({
						title: '提示',
						content: '确定退出登录吗？',
						success: function(res) {
							if (res.confirm) {
								console.log('用户点击确定');
								uni.removeStorageSync('userName')
								uni.removeStorageSync('avatar')
								uni.removeStorageSync('userId')
								uni.removeStorageSync('token')
								uni.removeStorageSync('phone')
								uni.removeStorageSync('zhiFuBaoName')
								uni.removeStorageSync('zhiFuBao')
								uni.removeStorageSync('invitationCode')
								uni.removeStorageSync('unionId')
								uni.removeStorageSync('openId')
								uni.removeStorageSync('isVIP')
								uni.showToast({
									title: '退出成功！',
									icon: 'none'
								})
								that.isLogin = true
								that.userName = '匿名'
								that.browse = 0
								that.fans = 0
								that.follow = 0
								that.visitor = 0
								that.isVip = false
								that.avatar = '../../static/logo.png'
								that.userId = uni.getStorageSync('userId')

							} else if (res.cancel) {
								console.log('用户点击取消');
							}
						}
					})
				} else {
					uni.showModal({
						title: '提示',
						content: '您还未登录,请先登录',
						success: function(res) {
							if (res.confirm) {
								console.log('用户点击确定');
								uni.navigateTo({
									url: '/pages/public/login'
								})
							} else if (res.cancel) {
								console.log('用户点击取消');
							}
						}
					})
				}


			},
			//成为按摩师  跳转商户端
			bindFb() {
				if (this.userId) {
					uni.navigateTo({
						url: '/pages/my/hehuo'
					});
				} else {
					uni.showModal({
						title: '提示',
						content: '您还未登录,请先登录',
						success: function(res) {
							if (res.confirm) {
								console.log('用户点击确定');
								uni.navigateTo({
									url: '/pages/public/login'
								})
							} else if (res.cancel) {
								console.log('用户点击取消');
							}
						}
					})
				}
			},
			goNavOrder(index) {
				let token = this.$queue.getData('token');
				if (token) {
					this.$queue.setData('SelectIndex', index);
					uni.switchTab({
						url: '/pages/order/index'
					})
				} else {
					uni.showModal({
						title: '提示',
						content: '您还未登录,请先登录',
						success: function(res) {
							if (res.confirm) {
								console.log('用户点击确定');
								uni.navigateTo({
									url: '/pages/public/login'
								})
							} else if (res.cancel) {
								console.log('用户点击取消');
							}
						}
					})
				}
			},
			goNav(e, name) {
				console.log(e)
				if (this.userId) {
					uni.navigateTo({
						url: e
					})
				} else {
					uni.showModal({
						title: '提示',
						content: '您还未登录,请先登录',
						success: function(res) {
							if (res.confirm) {
								console.log('用户点击确定');
								uni.navigateTo({
									url: '/pages/public/login'
								})
							} else if (res.cancel) {
								console.log('用户点击取消');
							}
						}
					})
				}
			},
			goLogin(e) {
				uni.navigateTo({
					url: e
				})
			},
			getAmount() {
				this.$Request.get("/app/userBrowse/selectAmount").then(res => {
					if (res.code == 0) {
						this.browse = res.data.browse
						this.fans = res.data.fans
						this.follow = res.data.follow
						this.visitor = res.data.visitor
					}
				});
			},
			getUserInfo() {
				this.$Request.get("/app/user/selectUserById").then(res => {
					console.log("res.data--->", res.data);
					if (res.code == 0) {
						this.userName = res.data.userName
						this.phone=res.data.phone;
						this.invitationCode = res.data.invitationCode
						this.avatar = res.data.avatar ? res.data.avatar : '../../static/logo.png'
						this.isAuthentication = res.data.isAuthentication
						this.isAgency = res.data.isAgency ? res.data.isAgency : 0; //是否是推广员 1是 2否


						this.money = res.data.money
						this.couponnum = res.data.member

						// uni.setStorageSync('isAuthentication', res.data.isAuthentication)
						this.isShop = res.data.isShop ? res.data.isShop : 0;
						uni.setStorageSync('avatar', res.data.avatar)
						uni.setStorageSync('userName', res.data.userName)
						uni.setStorageSync('invitationCode', res.data.invitationCode)
						uni.setStorageSync('zhiFuBao', res.data.zhiFuBao)
						uni.setStorageSync('zhiFuBaoName', res.data.zhiFuBaoName)

						if (res.data.isAuthentication == 0 || res.data.isAuthentication == null) {
							this.renzheng = 0
							uni.setStorageSync("renzheng", this.renzheng)
						} else if (res.data.isAuthentication == 1) {
							this.renzheng = 1
							uni.setStorageSync("renzheng", this.renzheng)
						} else if (res.data.isAuthentication == 2) {
							this.renzheng = 2
							uni.setStorageSync("renzheng", this.renzheng)
						} else if (res.data.isAuthentication == 3) {
							this.renzheng = 3
							uni.setStorageSync("renzheng", this.renzheng)
						} else if (res.data.isAuthentication == 4) {
							this.renzheng = 4
							uni.setStorageSync("renzheng", this.renzheng)
						} else if (res.data.isAuthentication == 5) {
							this.renzheng = 5
							uni.setStorageSync("renzheng", this.renzheng)
						} else if (res.data.isAuthentication == 6) {
							this.renzheng = 6
							uni.setStorageSync("renzheng", this.renzheng)
						}

					}
				});

				// #ifdef APP-PLUS
				let clientid = plus.push.getClientInfo().clientid;
				let sysPhone = 1;
				if (plus.os.name.toLowerCase() === 'android') {
					sysPhone = 1;
				} else {
					sysPhone = 2;
				}
				let userId = this.$queue.getData('userId');
				if (userId) {
					this.$Request.postT('/app/user/updateClientId?clientId=' + clientid + '&userId=' + userId +
						'&sysPhone=' + sysPhone).then(
						res => {});
				}
				//#endif
			},

			getIsVip() {
				this.$Request.get("/app/UserVip/isUserVip").then(res => {
					if (res.code == 0) {
						this.isVip = res.data
						uni.setStorageSync('isVIP', res.data)
					}
				});
			}

		}
	}
</script>

<style lang="scss">
	page {
		background-color: #F7F7F7;
	}

	.kefu_view {
		width: 100rpx;
		height: 100rpx;
		position: fixed;
		right: 30rpx;
		bottom: 200rpx;
	}

	.top {
		width: 100%;
		height: 44px;
		line-height: 44px;
		background: linear-gradient(to right, #223845, #00a85b);
		font-size: 36rpx;
		text-align: center;
	}

	.bg {
		background: linear-gradient(to right, #223845, #00a85b);
		padding-bottom: 120rpx;
	}

	.aqwa {
		background: url(../../static/images/my/cbgimg.png);
		background-size: cover;
		height: 204rpx;
		width: 92%;
		margin-left: 4%;
		margin-top: -50px;
	}

	.aqwaleft {
		width: 48%;
		text-align: center;
	}

	.aqwaright {
		width: 48%;
		text-align: center;
	}

	.box {
		background: #FFFFFF;
		color: #333333;
		width: 92%;
		margin: 30rpx auto;
		border-radius: 24rpx;
		padding: 30rpx 0;
	}

	.camera {
		width: 54px;
		height: 44px;

		&:active {
			background-color: #ededed;
		}
	}

	.btn-bg {
		width: 90px;
		height: 28px;
		background: #e6c485;
		border-radius: 28px;
		text-align: center;
		line-height: 28px;
		color: #000000;
		font-size: 29rpx;
	}

	.images {
		width: 18rpx;
		height: 30rpx;
	}

	.vipttl {
		font-size: 32rpx;
		font-family: DFZongYi-Bd-80-Win-GB;
		font-weight: 800;
		margin-right: 16rpx;
		color: #e6c485;
	}
</style>