<template>
	<!-- 个人中心 -->
	<web-view v-if="aa" :src="kfInfo.url" class="webView"></web-view>
	<view v-else>
		<loadlogo v-if="loading == true"></loadlogo>
		<scroll-view class="userCenter" v-else :style="{height: phoneHeight}" scroll-y :scroll-x="false">
			<view class="userCenterPackage">
				<view class="userCenterMain">
					<!-- 个人信息区域 -->
					<view class="userCenterInfo" :style="{'background-image': 'url(' + memberInfo.bgimg + ')'}">
						<view class="userCenterInfoTitle">
							<view class="userInfoHeader">
								<image :src="memberInfo.avatar" />
							</view>
							<view class="userInfoName">
								<span @click="goAppLogin" v-if="login == false" class="loginN">去登陆 ></span>
								<span v-if="login == true" class="nickname_text">{{ memberInfo.nickname }}</span>
								<view v-if="memberInfo.mid" style="font-size: 24upx;padding: 5upx 0;color: #FFFFFF;background-color: transparent;padding-left: 5upx;padding-top: 0;">MID:{{memberInfo.mid}}</view>
								<view class="userInfoPhone" v-if="login == true">
									<image :src="imgfixUrls + 'merchant/phone.png'" />
									<span v-if="!!memberInfo.mobile">{{ memberInfo.mobile }} </span>
									<!-- #ifdef H5 -->
									<span v-else @click="show1 = true">未绑定手机 </span>
									<!-- #endif -->
									<!-- #ifndef H5 -->
									<!-- <span v-else @click="show1 = true">未绑定手机 </span> -->
									<button v-else open-type="getPhoneNumber" @click="test" @getphonenumber="getPhoneNumber" class="titlegetphone">
										未绑定手机
									</button>
									<!-- #endif -->
								</view>
							</view>
						</view>
						<view class="userCenterInfoBody">
							<view class="userCenterMoney" @click="gobalance">
								<view>{{ memberInfo.credit2 }}</view>
								<view class="userCenterMoneyTitle">{{ textList.moneytext }}</view>
							</view>
							<view class="line"></view>
							<view class="userCenterMoney" @click="goIntegralRecord">
								<view>{{ memberInfo.credit1 }}</view>
								<view class="userCenterMoneyTitle">{{ textList.credittext }}</view>
							</view>
							<view class="line"></view>
							<view class="userCenterMoney" @click="goCollection">
								<view>{{ memberInfo.collectnum }}</view>
								<view class="userCenterMoneyTitle">{{languageStatus!=1?'收藏':'저장'}}</view>
							</view>
							<view class="line"></view>
							<view class="userCenterMoney" @click="goPrivate">
								<view>{{ memberInfo.news_total }}</view>
								<view class="userCenterMoneyTitle">{{languageStatus!=1?'消息':'소식'}}</view>
							</view>
						</view>
						<view class="userCenterInfoFoot" :style="{'background-image': 'url(' + imgfixUrls + memberCard +  ')','backgroundSize': '100% 100%'}">
							<view v-if="memberInfo.halfcardstatus == '1'">
								<view style="padding: 4rpx 4rpx 4rpx 4rpx;">
									<image :src="imgfixUrls + 'merchant/member.png'" />
									<span>{{ textList.halfcardtext }}</span>
									<view class="memberLine"></view>
									<span v-if="memberInfo.halfcardflag == 0">{{languageStatus!=1?'开通':'개통'}}{{ textList.halfcardtext }}，{{languageStatus!=1?'立享优惠折扣':'쿠폰할인 받기'}}</span>
									<span v-else>已为您节省{{ memberInfo.ellipsismoney }}元</span>
								</view>
								<view class="goButton" @click="goMemberCard">
									<span v-if="memberInfo.halfcardflag == 0">{{languageStatus!=1?'立即开通':'즉시 개통'}}</span>
									<span v-else>立即续费</span>
									<image :src="imgfixUrls + 'merchant/right.svg'" />
								</view>
							</view>
						</view>
					</view>

					<!-- 积分签到区域 -->
					<view class="signIn" @click="goSigndesk" v-if="login && memberInfo.signstatus === '1'">
						<image :src="imgfixUrls + 'merchant/signInLogo.png'" class="signInLeft" />
						<span>{{ textList.credittext }}签到</span>
						<image :src="imgfixUrls+ 'merchant/rightWhite.png'" class="signInRight" />
					</view>
					<!-- 积分签到区域 -->
					<!-- 个人信息区域 -->

					<!-- 订单区域 -->
					<view class="mineOrder">
						<view class="mineOrderTitle border-line diy-nav-list border-bottom">
							<view class="mineOrderTitlePackage">
								<span>{{languageStatus!=1?'我的订单':'나의 주문'}}</span>
								<view @click="orderList(10)">
									<span>{{languageStatus!=1?'查看全部':'전체 보기'}}</span>
									<image :src="imgfixUrls + 'merchant/right.svg'" />
								</view>
							</view>
						</view>
						<view :class="memberInfo.mobile == undefined ? 'mineOrderBody border-line diy-nav-list border-bottom' : 'mineOrderBody'">
							<view class="mineOrderBodyPackage">
								<view @click="orderList(0)">
									<view>
										<image :src="imgfixUrls + 'merchant/paymentNo.png'" />
									</view>
									<span>{{languageStatus != 1?'待付款':'미지불'}}</span>
									<view class="dis-flx">
										<view></view>
										<view class="numberMessage" v-if="memberInfo.ordernum1 !== undefined && memberInfo.ordernum1 !== 0">
											<span>{{ memberInfo.ordernum1 }}</span>
										</view>
									</view>
								</view>
								<view @click="orderList(1)">
									<view>
										<image :src="imgfixUrls + 'merchant/useNo.png'" />
									</view>
									<span> {{languageStatus != 1?`待${memberInfo.changeflag===1?'发货':'使用'}`:'미사용'}} </span>
									<view class="dis-flx">
										<view></view>
										<view class="numberMessage" v-if="memberInfo.ordernum2 !== undefined && memberInfo.ordernum2 !== 0">
											<span>{{ memberInfo.ordernum2 }}</span>
										</view>
									</view>
								</view>
								<view @click="orderList(4)">
									<view>
										<image :src="imgfixUrls + 'merchant/dsh.png'" />
									</view>
									<span>{{languageStatus != 1?'待收货':'미수납'}}</span>
									<view class="dis-flx">
										<view></view>
										<view class="numberMessage" v-if="memberInfo.ordernum4 !== undefined && memberInfo.ordernum4 !== 0">
											<span>{{ memberInfo.ordernum4 }}</span>
										</view>
									</view>
								</view>
								<view @click="orderList(2)">
									<view>
										<image :src="imgfixUrls + 'merchant/evaluateNo.png'" />
									</view>
									<span>{{languageStatus != 1?'待评价':'미평가'}}</span>
									<view class="dis-flx">
										<view></view>
										<view class="numberMessage" v-if="memberInfo.ordernum3 !== undefined && memberInfo.ordernum3 !== 0">
											<span>{{ memberInfo.ordernum3 }}</span>
										</view>
									</view>
								</view>
								<view @click="afterSale">
									<view>
										<image :src="imgfixUrls + 'merchant/refunNo.png'" />
									</view>
									<span>{{languageStatus != 1?'退款/售后':'환불/A/S'}}</span>
									<view class="dis-flx">
										<view></view>
										<!-- 	<view class="numberMessage" v-if="memberInfo.ordernum3 !== undefined && memberInfo.ordernum3 !== 0">
											<span>{{ memberInfo.ordernum3 }}</span>
										</view> -->
									</view>
								</view>
							</view>
						</view>

						<view class="mineOrderFoot" v-if="mobilediv == 1">
							<span>找不到订单和优惠券？绑定手机号试试</span>
							<view>
								<view @click="show1 = true" v-if="ptType == 1"><span>立即绑定</span></view>
								<button v-if="ptType == 2" open-type="getPhoneNumber"  @click="test" @getphonenumber="getPhoneNumber" class="getPhone">
									立即绑定
								</button>
						<!-- 		<view v-if="ptType == 1"><span>立即绑定</span></view> -->
							</view>
						</view>
					</view>
					<!-- 订单区域 -->

					<!-- 工具区域 -->
					<view class="mineTool" v-if="!!memberInfo.user_set && memberInfo.user_set.length>0">
						<view class="mineToolTitle border-line diy-nav-list border-bottom"><span>{{languageStatus!=1?'我的工具':'나의 공구'}}</span></view>
						<view class="mineToolBody ">
							<view class="mineToolBodyPackage">
								<view @click="go(userTabItem.link,userTabItem.title,userTabItem)" v-for="(userTabItem,index) in memberInfo.user_set" :key="index">
									<view v-if="userTabItem.kefuflag != 1">
										<image :src="userTabItem.icon" />
									</view>
									<button
										class="buttondrag"
										open-type="contact"
										hover-class="none"
										v-else
									>
										<image :src="userTabItem.icon"  mode="aspectFit"></image>
									</button>
									<span>{{ userTabItem.title }}</span>
								</view>
								
							</view>
						</view>
					</view>
					<!-- 工具区域 -->

					<!-- 填充区域 -->
					<view class="full"></view>
					<!-- 填充区域 -->

					<view class="page-footer">
						<TabBars :tabBarAct="0" />
					</view>
				</view>
			</view>
		</scroll-view>
		<follow  :followShow="followShow" :followType="followType" :followTitleShow="followTitleShow" @clickmask="openQrShow"
		 @closeFollowPop="closeFollowPop" @closeFollowTitle="closeFollowTitle"></follow>
		<!-- 绑定手机	 -->
			<PhoneMask :show1="show1" @clickmask1="closePop1" @getMemberInfo='getMemberInfo'></PhoneMask>
		<!-- 绑定手机	 -->
		<!-- <far-bottom></far-bottom> -->
	</view>
</template>

<script>
	import App from '@/common/js/app.js';

	// #ifdef H5
	import wxApi from '@/common/js/wxApi.js';
	// #endif

	import util from '@/common/js/util.js';

	import TabBars from '@/components/template/tabBar';
	import loadlogo from '@/components/template/loadlogo';
	import follow from '@/components/template/follow.vue';
	import PhoneMask from '@/components/template/PhoneMask';

	export default {
		components: {
			TabBars,
			loadlogo,
			follow,
			PhoneMask
		},
		data() {
			return {
					show1: false,
				mobilediv:1,
				followTitleShow: true,
				followShow: false,
				followType: '0',
				memberInfo: {
					nickname: ''
				},
				pinText: '获取验证码',
				show: false,
				phone: '',
				smsCode: '',
				getSmsCode: '',
				textList: {},
				TextSubstitution: {},
				scollHeight: null,
				fullHeight: null,
				card: '',
				timeCount: 0,
				timeEnd: '',
				login: true,
				loading: true,
				phoneHeight: null,
				kfInfo: {},
				ptType: null,
				aa: false,
				userCenterBackImg: null,
				nLogin: null,
				img:'',
				code:'',
				memberCard:'merchant/memberCard.png',
				CustomerService:{}
			};
		},
		onLoad(e) {
			this.img = this.imgfixUrl;
			let _this = this;
			this.textList = uni.getStorageSync('TextSubstitution');
			if (!!e.show) {
				this.show = e.show;
			}
			// #ifdef H5
			_this.ptType = 1;
			// #endif
			// #ifdef MP-WEIXIN
			_this.ptType = 2;
			wx.showShareMenu({
			  withShareTicket: false,
			  menus: ['shareAppMessage', 'shareTimeline']
			})
			// #endif
		},
		// onShareTimeline(e) {
		//     console.error("点击分享pyq", e)
		//     var query={
		//       data:"dsadbiujasdoinsa"
		//     };
		//     return {
		//       title: "xxxxxxxxx",
		//       imageUrl: "",
		//       query: query,
		//     }
		//   },
		onShow() {
			this.init();
		},
		mounted() {
			this.img = this.imgfixUrl;
			let _this = this;
			uni.getSystemInfo({
				success(res) {
					_this.phoneHeight = res.windowHeight + 'px';
				}
			});
			uni.createSelectorQuery()
				.select('.userCenterMain')
				.boundingClientRect(data => {
					console.info('data', data);
					_this.scollHeight = uni.upx2px(1866) + 'px';
				})
				.exec();
		},
		computed: {
			userImg() {
				return this.imageRoot + 'userCenterImg.png';
			}
		},
		methods: {
			closePop1() {
				let _this = this;
				_this.show1 = false;
				_this.init();
			},
			mobileBlur(e) {
				uni.pageScrollTo({
					scrollTop: 0,
					duration: 0
				});
			},
			closeFollowTitle() {
				let _this = this
				_this.followTitleShow = false
			},
			closeFollowPop() {
				let _this = this
				_this.followShow = false
			},
			openQrShow() {
				let _this = this
				_this.followShow = true
			},
			afterSale() {
				let _this = this;
				App.navigationTo({
					url: 'pages/subPages/afterSale/index'
				});
			},
			phonereon(postData){
				let _this = this;
				App._post_form('&p=member&do=phoneDecrypt', postData, res => {
					let a = res.data.phone.slice(0, 3);
					let b = res.data.phone.slice(7, 11);
					let mobile = res.data.phone;
					uni.showModal({
						title: '提示',
						content: '确定绑定手机' + a + '****' + b + '?',
						success: function(res) {
							if (res.confirm) {
								let data = {
									mobile: mobile
								};
								App._post_form(
									'&p=member&do=changeMobile',
									data,
									res => {
										uni.showToast({
											icon: 'none',
											title: '绑定成功',
											duration: 2000
										});
										_this.getMemberInfo();
									},
									res => {
										uni.showModal({
											title: '友情提示',
											content: res.data.message,
											showCancel: true,
											success(res) {
												if (res.confirm) {
													let data = {
														mobile: mobile,
														mergeflag: 1
													};
													App._post_form('&p=member&do=changeMobile', data, res => {
														uni.showToast({
															icon: 'none',
															title: '修改成功',
															duration: 2000
														});
														uni.setStorageSync('weliam_user_token', res.data.token)
														_this.getMemberInfo();
													});
												} else if (res.cancel) {
											
												}
											}
										});
									}
								);
							} else if (res.cancel) {}
						}
					});
				},fail => {
					console.log('111111111111111',fail);
					App.showError(fail.data.message)
					if(fail.data.message == '绑定失败，请重试！'){
						// setTimeout(()=>{
						// 	_this.phonereon(postData);
						// },1000)
						
					}
				});
			},
			test(){
				let _this = this;
				uni.login({
					provider: 'weixin',
					scopes: 'auth_user',
					success(res) {
						_this.code = res.code;
						// App._post_form('&p=member&do=getSessionKey', {code:res.code}, reson => {
						//  = res.code;
						// })
					}
				})
			},
			getPhoneNumber(e) {
				let _this = this;
				console.log(e)
				if (e.detail.errMsg === "getPhoneNumber:ok") {
					uni.checkSession({
						success() {
							
							
								// reson.data = uni.setStorageSync('session_key');
							// let session_key = uni.getStorageSync('session_key');
							console.info('登陆有效');
							// debugger
							let postData = {
								data: e.detail.encryptedData,
								iv: e.detail.iv,
								code:_this.code
							};
							_this.phonereon(postData);
							// };
						},
						fail() {
							console.info('登陆失效');
							App.navigationTo({
								url: 'pages/mainPages/login/minLogin'
							});
						}
					});
					
				} else {
					App.showError('手机号绑定取消')
				}
			},
			goAppLogin() {
				let _this = this;
				App.navigationTo({
					url: 'pages/mainPages/login/minLogin'
				});
			},
			init() {
				let _this = this;
				_this.getMemberInfo();
				// #ifdef H5
				_this.getMemberInfo();
				// #endif
				//#ifndef H5
				_this.loading = false;
				uni.getStorage({
					key: 'weliam_user_token',
					success: function(res) {
						_this.login = true;
						_this.getMemberInfo();
					},
					fail: function(res) {
						_this.memberInfo.avatar = _this.imageRoot + 'nLogin.png';
						_this.userCenterBackImg = _this.userImg;
						_this.login = false;
						_this.memberInfo.halfcardflag = '--';
						_this.memberInfo.credit2 = '--';
						_this.memberInfo.credit1 = '--';
						_this.memberInfo.collectnum = '--';
						_this.memberInfo.news_total = '--';
						_this.memberInfo.ellipsismoney = '--';
					}
				});
				//#endif
				_this.KefuInfo();
			},
			go(url,title,item) {
				if(item.kefuflag == 2){
					//#ifdef H5
					App.navigationTo({
						url:item.customerurl
					});
					// #endif
					//#ifdef MP-WEIXIN
					this.CustomerService = uni.getStorageSync('CustomerService');
					wx.openCustomerServiceChat({
					  extInfo: {url: item.customerurl},
					  corpId: this.CustomerService.enterpriseid,
					  success(res) {
						  
					  }
					})
					//#endif
					return
				}else if(item.kefuflag == 1){
					return
				}
				if(url.indexOf('pages/subPages/redpacket/myredpacket') != -1 || url.indexOf('pages/subPages/coupon/coupon') != -1){
					App.navigationTo({
						url:url + `?title=${title}`
					});
				}else{
					App.navigationTo({
						url
					});
				}
				
			},
			KefuInfo() {
				let _this = this;
				let data = {};
				App._post_form('&do=CustomerService', data, res => {
					_this.kfInfo = res.data;
				});
			},
			goSigndesk() {
				App.navigationTo({
					url: 'pages/subPages/signdesk/index/index'
				});
			},
			// 跳转消息
			goPrivate() {
				App.navigationTo({
					url: 'pages/subPages/homepage/private/private'
				});
			},
			// 跳转余额
			gobalance() {
				if(this.memberInfo.diy_userInfo && this.memberInfo.diy_userInfo.dhurl){
					
						// this.duurUrl = url;
						// url = encodeURIComponent(this.memberInfo.diy_userInfo.dhurl);
						// App.navigationTo({
						// 	url: `pages/subPages/webview/webview?urlsrc=${url}`
						// })
						// #ifdef H5
						let locations = window.location.href;
						// let urls = encodeURIComponent(this.memberInfo.diy_userInfo.dhurl + '&backurl=' + encodeURIComponent(locations))
						let urls = this.memberInfo.diy_userInfo.dhurl + '&backurl=' + encodeURIComponent(locations);
						location.href = urls;
						//#endif
						//#ifndef H5
						let pages = getCurrentPages();
						let pageObj = pages[pages.length - 1];
						let wxurl = pageObj.route + '?i=' + pageObj.options.i + '&aid=' + pageObj.options.aid;
						let urls = this.memberInfo.diy_userInfo.dhurl + '&backurl=' + wxurl;
						console.log(urls,pageObj.options)
						uni.navigateTo({
							url: `/pages/subPages/webview/webview?urlsrc=${encodeURIComponent(urls)}`
						})
						//#endif
						
						// uni.redirectTo({
						// 	url: `/pages/subPages/webview/webview?urlsrc=${url}`
						// });
					
				}else{
					App.navigationTo({
						url: 'pages/subPages/balance/balance'
					});
				}
				
			},
			// 跳转收藏
			goCollection() {
				App.navigationTo({
					url: 'pages/subPages/mineCollection/mineCollection'
				});
			},
			// 跳转积分
			goIntegralRecord() {
				App.navigationTo({
					url: 'pages/subPages/IntegralRecord/IntegralRecord'
				});
			},
			gokf() {
				console.info(11111111)
				let _this = this;
				App.navigationTo({
					url: _this.kfInfo.url
				})
			},
			// 跳转卡劵
			goCoupon() {
				App.navigationTo({
					url: 'pages/subPages/coupon/coupon'
				});
			},
			closePop() {
				let _this = this;
				_this.show = false;
			},
			// 跳转会员卡
			goMemberCard() {
				let _this = this;
				if (_this.memberInfo.halfcardflag == 0) {
					_this.card = 'nhave';
				} else {
					_this.card = 'have';
				}
				App.navigationTo({
					url: 'pages/mainPages/memberCard/getMembership/getMembership?card=' + _this.card
				});
			},
			// 跳转平团
			goPt() {
				let _this = this;
				_this.aa = true;
			},
			// 设置
			goSet() {
				App.navigationTo({
					url: 'pages/mainPages/userset/userset'
				});
			},
			close() {
				let _this = this;
				_this.show = false;
			},
			// 用户个人中心信息
			getMemberInfo() {
				let _this = this;
				let data = {};
				App._post_form('&p=member&do=memberInfo', data, res => {
					if(res.data.nickname == '' && res.data.avatar == '' && res.data.mid == ''){
						// _this.memberInfo.avatar = _this.imageRoot + 'nLogin.png';
						// _this.userCenterBackImg = res.data.bgimg;
						_this.memberInfo = res.data;
						_this.login = false;
						
						_this.memberInfo.halfcardflag = '--';
						_this.memberInfo.credit2 = '--';
						_this.memberInfo.credit1 = '--';
						_this.memberInfo.collectnum = '--';
						_this.memberInfo.news_total = '--';
						_this.memberInfo.ellipsismoney = '--';
					}else{
						_this.memberInfo = res.data;
					}
					
					_this.userCenterBackImg = res.data.bgimg;
					_this.loading = false;
					_this.mobilediv = res.data.mobilediv;
				});
			},
			orderList(type) {
				App.navigationTo({
					url: 'pages/subPages/orderList/orderList?type=' + type
				});
			},
			// 收货地址
			goAddress() {
				App.navigationTo({
					url: 'pages/subPages/receivingAddress/receivingAddress'
				});
			},
		}
	};
</script>

<style lang="less" scoped>
	.nickname_text {
		display: -webkit-box;
		    overflow: hidden;
		    -webkit-box-orient: vertical;
		    text-overflow: ellipsis;
		    -webkit-line-clamp: 2;
			width: 350upx;
	}

	view {
		font-size: 0;
	}

	.dis-flx {
		display: flex !important;
		justify-content: space-between !important;
		position: relative !important;

		>view {
			display: inline-block;
		}
	}

	.getPhoneSpan {
		line-height: 50upx;
		font-size: 24upx;
		color: rgba(255, 68, 68, 1);
	}

	.getPhone {
		vertical-align: middle;
		margin: 18upx 30upx 0 0;
		display: inline-block;
		width: 160upx;
		height: 50upx;
		border: 2upx solid rgba(255, 68, 68, 1);
		border-radius: 10upx;
		text-align: center;
		line-height: 50upx;
		font-size: 24upx;
		color: rgba(255, 68, 68, 1);
	}
	.titlegetphone{
		vertical-align: middle;
		// margin: 18upx 30upx 0 0;
		display: inline-block;
		// width: 160upx;
		// height: 50upx;
		padding: 0;
		border: none;
		border-radius: 10upx;
		text-align: left;
		line-height: 34upx;
		font-size: 24upx;
		color: #ffffff;
		background-color: transparent;
	}
	.goLogin {
		text-align: center;

		>span {
			font-size: 24upx;
			font-family: Source Han Sans CN;

			color: rgba(255, 255, 255, 1);
		}
	}

	page {
		font-size: 0 !important;
		background: #f6f6f6 !important;
	}

	// #ifdef H5
	body,
	html {
		background: #f6f6f6 !important;
	}

	// #endif
	.userCenter {
		font-size: 0 !important;
		background: #f6f6f6 !important;
	}

	.userCenterBackImg {
		width: 750upx;
		height: 385upx;

		>image {
			width: 750upx;
			height: 385upx;
		}
	}

	.userCenterInfo {
		background-size: 750upx 385upx;
		background-repeat: no-repeat;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}

	.userCenterInfoTitle {
		margin-top: 45upx;
		margin-left: 40upx;

		>view {
			display: inline-block;
		}
	}

	.userCenterMain {
		width: 750upx;
		position: absolute;
		top: 0;
		z-index: 1;
		// background: #f6f6f6;
	}

	.userInfoName {
		margin-left: 28upx;
		vertical-align: middle;

		>span {
			font-size: 36upx;

			font-weight: bold;
			color: rgba(255, 255, 255, 1);
		}

		>view {
			height: 36upx;
			background: rgba(121, 51, 9, 0.3);
			border-radius: 10upx;
			margin-top: 9upx;
		}
	}

	.userInfoHeader {
		vertical-align: middle;
		width: 99upx;
		height: 100upx;
		border-radius: 50%;
		overflow: hidden;

		>image {
			width: 99upx;
			height: 100upx;
		}
	}

	.userInfoPhone {
		width: 160upx;
		display: flex;
		>image {
			vertical-align: middle;
			width: 30upx;
			height: 30upx;
		}

		>span {
			vertical-align: middle;
			font-size: 24upx;

			color: rgba(255, 255, 255, 1);
		}
	}

	.userCenterInfoBody {
		display: flex;
		justify-content: space-between;
		margin-top: 47upx;
        height: 105upx;
		>view {
			display: inline-block;
		}
	}

	.line {
		margin-top: 30upx;
		width: 1upx;
		height: 32upx;
		background: rgba(255, 255, 255, 0.5);
	}

	.userCenterMoney {
		width: 24%;

		>view {
			text-align: center;
			font-size: 28upx;
			color: rgba(255, 255, 255, 1);
		}
	}

	.userCenterMoneyTitle {
		margin-top: 10upx;
	}

	.userCenterInfoFoot {
		width: 690upx;
		margin: 30upx auto 0 auto;
		border-style: none;
		border-width: 0;
		border: none;

		>view {
			padding: 14upx 17upx 12upx 17upx;
			display: flex;
			justify-content: space-between;

			>view {
				display: inline-block;

				>image {
					vertical-align: middle;
					width: 60upx;
					height: 60upx;
				}

				>span {
					vertical-align: middle;
					font-size: 24upx;
					color: rgba(238, 209, 150, 1);
				}
			}
		}
	}

	.loginN {
		line-height: 100upx;
		font-size: 36upx;
		font-family: Source Han Sans CN;
		font-weight: bold;
		color: rgba(255, 255, 255, 1);
	}

	.memberLine {
		margin: 0 20upx;
		vertical-align: middle;
		display: inline-block;
		width: 1upx;
		height: 32upx;
		background: rgba(238, 209, 150, 0.5);
	}

	.goButton {
		margin-top: 10upx;
		margin-left: 41upx;
		vertical-align: middle;
		display: inline-block;
		width: 144upx;
		height: 40upx;
		background: linear-gradient(-90deg, rgba(241, 206, 128, 1), rgba(255, 232, 181, 1));
		border-radius: 20upx;

		>span {
			margin-left: 16upx !important;
			line-height: 40upx !important;
			vertical-align: middle !important;
			font-size: 24upx !important;
			font-weight: normal !important;
			color: rgba(129, 82, 36, 1) !important;
			margin-right: 5upx !important;
		}

		>image {
			vertical-align: middle !important;
			width: 20upx !important;
			height: 26upx !important;
		}
	}

	.mineOrder {
		margin: 30upx auto 0 auto;
		width: 690upx;
		background: rgba(255, 255, 255, 1);
		border-radius: 10upx;
	}

	.mineOrderTitle {
		width: 690upx;
		height: 88upx;
	}

	.mineOrderTitlePackage {
		display: flex;
		justify-content: space-between;

		>span {
			margin-left: 30upx;
			line-height: 88upx;
			vertical-align: middle;
			font-size: 30upx;

			font-weight: bold;
			color: rgba(51, 51, 51, 1);
		}

		>view {
			margin-right: 30upx;
			display: inline-block;
			vertical-align: middle;

			>span {
				line-height: 88upx;
				vertical-align: middle;
				font-size: 24upx;

				color: rgba(153, 153, 153, 1);
			}

			>image {
				margin-left: 8upx;
				vertical-align: middle;
				width: 20upx;
				height: 30upx;
			}
		}
	}

	.mineOrderBody {
		width: 690upx;
		height: 164upx;
	}

	.mineOrderFoot {
		width: 690upx;
		height: 90upx;
		display: flex;
		justify-content: space-between;

		>span {
			vertical-align: middle;
			margin-left: 30upx;
			line-height: 90upx;
			font-size: 24upx;

			color: rgba(102, 102, 102, 1);
		}

		>view {
			display: inline-block;

			>view {
				vertical-align: middle;
				margin: 18upx 30upx 0 0;
				display: inline-block;
				width: 130upx;
				height: 50upx;
				border: 2upx solid rgba(255, 68, 68, 1);
				border-radius: 10upx;
				text-align: center;

				>span {
					line-height: 50upx;
					font-size: 24upx;

					color: rgba(255, 68, 68, 1);
				}
			}
		}
	}

	.mineOrderBodyPackage {
		position: relative;
		width: 596upx;
		margin: 20upx auto 0 auto;
		display: flex;
		justify-content: space-between;
		text-align: center;

		>view {
			display: inline-block;

			>view {
				margin: auto;
				width: 80upx;
				height: 80upx;

				>image {
					width: 80upx;
					height: 80upx;
				}
			}

			>span {
				font-size: 24upx;

				color: rgba(51, 51, 51, 1);
			}
		}
	}

	.numberMessage {
		font-size: 0;
		overflow: hidden;
		width: 27upx !important;
		height: 27upx !important;
		background: rgba(255, 255, 255, 1);
		border: 2upx solid rgba(255, 61, 60, 1);
		border-radius: 50%;
		position: absolute;
		top: -108upx;
		right: 7upx;
		text-align: center;

		>span {
			line-height: 27upx;
			font-size: 18upx !important;

			color: rgba(244, 79, 68, 1);
		}
	}

	.mineTool {
		margin: 18upx auto 0 auto;
		width: 688upx;
		background: rgba(255, 255, 255, 1);
		border-radius: 10upx;
	}

	.full {
		width: 750upx;
		height: 118upx;
	}

	.mineToolTitle {
		height: 89upx;
		width: 688upx;

		>span {
			line-height: 89upx;
			margin-left: 33upx;
			font-size: 30upx;

			font-weight: bold;
			color: rgba(51, 51, 51, 1);
		}
	}

	.webView {
		text-align: center;
		display: inline-block;
		margin-bottom: 20upx;
		width: 25%;

		>view {
			margin: auto;
			width: 120upx;
			height: 120upx;

			>image {
				width: 120upx;
				height: 120upx;
			}
		}

		>span {
			font-size: 24upx;

			color: rgba(51, 51, 51, 1);
		}
	}

	.mineToolBodyPackage {
		padding: 10upx 20upx;
		flex-wrap: wrap;
		margin-bottom: 70upx;

		>view {
			text-align: center;
			display: inline-block;
			margin-bottom: 20upx;
			width: 25%;
			
			>button{
				margin: auto;
				width: 120upx;
				height: 120upx;
				background-color: transparent!important;
				padding: 0;
				>image {
					width: 120upx;
					height: 120upx;
				}
			}
			
			>view {
				margin: auto;
				width: 120upx;
				height: 120upx;

				>image {
					width: 120upx;
					height: 120upx;
				}
			}

			>span {
				font-size: 24upx;

				color: rgba(51, 51, 51, 1);
			}
		}
	}

	.signIn {
		height: 60upx;
		border-radius: 180upx 0 0 180upx;
		background: #d75731;
		position: absolute;
		right: 0;
		top: 63upx;

		>image {
			vertical-align: middle;
		}

		>span {
			vertical-align: middle;
			font-size: 24upx;

			color: rgba(254, 254, 254, 1);
		}
	}

	.signInLeft {
		width: 60upx;
		height: 60upx;
	}

	.signInRight {
		width: 20upx;
		height: 25upx;
		margin-left: 10upx;
	}
</style>
