<template>
	<view class="flexView">
		<view class="head-read"  >
			<view class="flex"  v-if="headflag" @click="openface()"> 
				<image class="read-img" :src="avatar" mode="aspectFill"></image>
				<view class="flex-box"  >
					<view class="flex-box-text">{{nickname}}</view> 
				</view> 
			</view>
			<view class="flex"  v-else @click="gologin()"> 
				<image class="read-img" :src="avatar" mode="aspectFill"></image>
				<view class="flex-box"  >
					<view class="flex-box-text">登录</view> 
				</view> 
			</view>
		</view> 
		<view class="fuwu mainwidth2">
			<view class="h3-title fsz32">
				我的服务 
			</view> 
			<view class="mine_card "> 
				<view class="li" @click="gopage2('/pages/order/order')">  
					<image src="/static/img/40.png" mode="widthFix"></image>
					<view class="fsz30">用户订单</view> 
				</view>
				<view class="li" @click="gopage2('/pages/address/list')" >  
					<image src="/static/img/46.png" mode="widthFix"></image>
					<view class="fsz30">用户地址</view> 
				</view>
				<view class="li" @click="gopage2('/pages/exchange/goodslist')">
					<image src="/static/img/48.png" mode="widthFix"></image>
					<view class="fsz30">积分商品</view> 
				</view>
				<view class="li" @click="gopage2('/pages/exchange/orderlist')" >
					<image src="/static/img/51.png" mode="widthFix"></image>
					<view class="fsz30">兑换订单</view> 
				</view> 
				<button open-type="contact">联系客服</button>
				<view class="li"  >
					<button class="slide-Items" open-type="contact"> 
						<image src="/static/img/kefu.png" mode="widthFix"></image>
						<view class="fsz30" style="margin-top: -20px;">在线客服</view> 
					</button> 
				</view> 
				<view class="li"  @click="gopage2('/pages/question/index')"> 
					<image src="/static/img/47.png" mode="widthFix"></image>
					<view class="fsz30"  >常见问题</view>  
				</view> 
				<view class="li" @click="goabout()" >
					<image src="/static/img/43.png" mode="widthFix"></image>
					<view class="fsz30">关于我们</view> 
				</view> 
				<view class="li"  >
					<button class="slide-Items" open-type="feedback"    > 
					<image src="/static/img/52.png" mode="widthFix"></image>
					<view class="fsz30" style="margin-top: -20px;">意见反馈</view> 
				 </button>
				</view> 
			</view> 
		</view>
		
		<view class="fuwu mainwidth2">
			<view class="h3-title fsz32">
				回收员工作台  
			</view> 
			<view class="mine_card " >
				
				<view class="li" @click="goworkerpage('/pages/person/orderlist')" v-if="person && person.status ==2">
					<image src="/static/img/39.png" mode="widthFix"></image>
					<view class="fsz30">回收员订单</view> 
				</view> 
				<view class="li" @click="goworkerpage('/pages/person/qiangdan')" v-if="person && person.status ==2">
					<image src="/static/img/49.png" mode="widthFix"></image>
					<view class="fsz30">抢单大厅</view> 
				</view>  
				
				<view class="li" @click="goadd('')" v-else> 
					<image src="/static/img/41.png" mode="widthFix"></image>
					<view class="fsz30">成为回收员</view> 
				</view>
			</view> 
		</view>
		 
		 <custom-tab-bar :current-page="1" />
	</view>
</template>

<script>  
	import CustomTabBar from '@/components/CustomTabBar.vue';
	export default { 
		data() {
			return { 
				exchange_shop:'',
				point:0,
				user_money:0,
				person_money:0,
				exchange_shop:'',
				userinfo:{},
				headflag:false, 
				nickname:'微信用户',
				person:{},
				avatar:'/static/img/t2.png', 
			}
		},
		components: {
			CustomTabBar
		},
		onLoad() {
			
			var token = uni.getStorageSync('userToken');  
			if (!token) {
				return false;
			}
			this.getinfo()
			this.getauth();
		},
		onShow() { 
			var token = uni.getStorageSync('userToken');  
			if (!token) {
				return false;
			}
			this.getinfo()
			this.getauth()
			
		},
		methods: {
			  
			getauth(){
				var _this = this;
				_this.$api.userInfo({},res=>{ 
					if(res.code == '1'){ 
						if(res.data.user.status =='hidden' ){ 
								uni.setStorageSync('userToken', ''); 
								this.headflag = false
								_this.avatar = '/static/img/t2.png';
								uni.showToast({ title: "您的账号已被禁止" , icon: 'none' }) 
									return false;
						}
						if(res.data.user.avatar){
							_this.avatar = res.data.user.avatar
						} 
						_this.nickname = res.data.user.nickname
						_this.point = res.data.user.user_point
						_this.user_money = res.data.user.user_money
						_this.person_money = res.data.user.person_money
						_this.person = res.data.person
					}else if(res.code == '0'){  
						_this.avatar = '/static/img/t2.png';
						
						uni.setStorageSync('userToken', '');  
						this.headflag = false
					}else{ 
					}
				})
			}, 
			gopage2(url){
				
				var token = uni.getStorageSync('userToken');  
				if (token) {
					if(url =='/pages/order/order'){
						uni.switchTab({
							url:'/pages/order/order'
						})
					}else{
						uni.navigateTo({
							url:url
						}) 
					} 
					return false;
					  
				}else{
					this.gologin()
				} 
			}, 
			goworkerpage(url){
				var token = uni.getStorageSync('userToken');  
				if (token) {
					if(this.person){ 	
						if(this.person.status !=2){ 
							uni.showToast({ title: "身份不符合回收员" , icon: 'none' })  
							return false;
						}
					}
					if(!this.person){
						return false;
					}   
					uni.navigateTo({
						url: url
					}) 
					
				} else{
					this.gologin()
				}
			},
			goadd(){ 
				
				var token = uni.getStorageSync('userToken');  
				if (token) {
					if(this.person){
						if(this.person.status ==1){ 
							uni.showToast({ title: "请等待审核", icon: 'none' })   
							return false;
						}
						if(this.person.status ==3){
							uni.showToast({ title: "您的申请被拒绝" , icon: 'none' })   
							return false;
						}
						if(this.person.status ==2){
							uni.showToast({ title: "您的申请已经审核通过，不需要在申请" , icon: 'none' })   
							return false;
						}
					}
					uni.navigateTo({
						url:'/pages/person/add'
					}) 
					
				} else{
					this.gologin()
				}
				
			},
			
			// 登陆
			gologin(){
				uni.navigateTo({
					url:'../login/authorize'
				})
			}, 
			goabout(){ 
						uni.navigateTo({
							url:'/pages/about/about'
						}) 
			},  
			// 查看是否有token
			getinfo(){
				
				var token = uni.getStorageSync('userToken');  
				if (token) {
					this.headflag = true 
					 
				}else{
					this.headflag = false
				}
			},  
			openface(){
				uni.navigateTo({
					url:'/pages/mine/edituser'
				})  
			}, 
		}
	}
</script>

<style lang="scss">
button::after{
	  border: none;
	}button{
		background: #fff;padding: 0 15rpx;
	  
	}	
	page{background-color: #eee !important;}
 
.mine_card{
	display: flex;
	flex-wrap: wrap;
	.li{
		flex: 0 0 25%;
		text-align: center;
		margin-bottom: 15rpx;
		color: #333333;
		position: relative;
		image{
			width: 100rpx;
			margin-bottom: 10rpx;
		}
		>.fsz26{
			position: absolute;
			background: #e01f20;
			min-width: 36rpx;
			min-height: 36rpx;
			border-radius: 50%;
			top: 0;
			color: #fff;
		}
	} 
}
.mine_card2{
	padding-top: 25rpx;
	box-sizing: border-box;
}
  
 
 .flexView {
 	width: 100%;
 	height: 100%;
 	margin: 0 auto;
 	display: flex;
 	flex-direction: column;
 
 		.head-read { 
 			background-color: #00a73b;
 			padding-bottom: 10rpx;
 			.flex {
 				display: flex;
 				align-items: center;
 				    padding: 120rpx 50rpx 40rpx 50rpx;
 				position: relative;
 				.read-img {
 					width: 120rpx;
 					height: 120rpx;
 					border-radius: 100%;
 					overflow: hidden;
 					margin-right: 20rpx;
 					border: 4rpx solid rgba(255, 255, 255, 0.3);
 				}
 				.flex-box {
 					flex: 1;
 					min-width: 0;
 					font-size: 26rpx;
 					color: #333;
 					&-text {
 						margin: 10rpx 0;
 						color: #f5f5f5;
 						font-weight: normal;
 					}
 				}
 				.arrow {
 					position: relative;
 					padding-right: 30rpx;
 					span {
 						font-size: 28rpx;
 						color: white;
 					}
 					&:after {
 						content: ' ';
 						display: inline-block;
 						height: 12rpx;
 						width: 12rpx;
 						border-width: 4rpx 4rpx 0 0;
 						border-color: #848484;
 						border-style: solid;
 						transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
 						position: relative;
 						top: -4rpx;
 						position: absolute;
 						top: 50%;
 						margin-top: -8rpx;
 						right: 4rpx;
 						border-radius: 2rpx;
 					}
 				}
 				.arrow-one:after {
 					border-color: white;
 					margin-top: -6rpx;
 				}
 			}
 		}
 		.white-box {
 			width: 94%;
 			background: white;
 			border-radius: 10rpx;margin: -75rpx auto  0rpx;
 			box-shadow: 0 6rpx 20rpx #e7e7e7;
 			.tx {
 				padding-top: 26rpx;
 				overflow: hidden;
 				display: flex;
 				justify-content: space-between;
 				align-content: center;
 				&-grid {
 					box-sizing: border-box;
 					&:first-child {
 						margin-left: 40rpx;
 					}
 					&-comm-sign {
 						display: block;
 						border-radius: 40rpx 0 0 40rpx;
 						font-size: 26rpx;
 						padding: 16rpx 44rpx;
 						background: linear-gradient(to right, #fef082, #ffc551);
 						background-color: #fef082;
 						color: #cf4400;
 					}
 					&-text {
 						display: block;
 						color: #333;
 						font-size: 26rpx;
 						white-space: nowrap;
 						text-overflow: ellipsis;
 						overflow: hidden;
 						.title {
 							font-size: 26rpx;
 							font-weight: normal; 
 						}
 						.money {
 							font-size: 50rpx;
 							color: #ff6423;
 							letter-spacing: 2rpx;
 							margin-bottom: 10rpx;
 							&-b {
 								font-size: 28rpx;
 							}
 						}
 					}
 				}
 			}
 			.palace {
 				padding-bottom: 25rpx;
 				    overflow: hidden;
 				    display: flex;
 				    justify-content: center;
 				    padding-top: 25rpx;
 				&-grid {
 					flex: 1;
 					position: relative;
 					box-sizing: border-box;
 					&:not(:last-child) {
 						&:after {
 							width: 1rpx;
 							height: 80rpx;
 							background: #fddece;
 							content: ' ';
 							display: inline-block;
 							position: absolute;
 							top: 0;
 							right: 0;
 						}
 					}
 					&-text {
 						display: block;
 						text-align: center;
 						color: #333;
 						font-size: 32rpx;
 						white-space: nowrap;
 						text-overflow: ellipsis;
 						overflow: hidden;
 						&-name {
 							font-size: 26rpx;
 							font-weight: normal; 
 						}
 						&-data {
 							font-size: 32rpx; 
 							letter-spacing: 2rpx;
 							margin-bottom: 12rpx;
 							&-b {
 								font-size: 20rpx;
 							}
 						}
 					}
 				}
 			}
 		 
 	}
 }
 .h3-title{margin: 0px 10px 15px 10px;
    border-bottom: solid 1px #eee;
    padding: 10px 0px;}
.fuwu{background:#fff;border-radius:20rpx;box-sizing:border-box;padding:10rpx;margin:20rpx 20rpx 0rpx 20rpx;;box-sizing:border-box}
</style>