<template>
	<div class="my_box boxs">
		<div class="my_cont">
			<img src="@/static/bg_mine.png" alt="" class="my_img">
			<div class="my_nr" @click="tx_btn">
				<div class="icon">
					<img :src="info_data.avatarUrl" v-if="flag" alt="" class="img">
					<!-- v-if="!flag" -->
					<img src="@/static/grzx_txw2x.png" v-if="!flag"  alt="" class="img">
				</div>
				<div class="my_xq">
					<div class="my_name">{{flag?info_data.nickName:'未登录'}}</div>
					<div class="my_phone">{{flag?phone:'点击头像登录'}}</div>
				</div>
			</div>
		</div>
		<div class="my_yj" @click="share_btn">
			<div class="my_yj_left">
				<img src="@/static/icon_mine_rycj.png" alt="" class="img imgse">
				<span>人员采集</span>
			</div>
			<div class="my_yj_rig">
				<img src="@/static/you@2x.png" alt="" class="img imgse">
			</div>
		</div>
		<div class="my_yj" @click = "guanlu">
			<!-- <button open-type="contact"></button> -->
			<div class="my_yj_left">
				<img src="@/static/icon_mine_rygl.png" alt="" class="img">
				<span>人员管理</span>
			</div>
			<div class="my_yj_rig">
				<img src="@/static/you@2x.png" alt="" class="img">
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				info_data: {}, // 用户信息
				flag: '', // 是否登录
				//手机号码
				phone:''
			}
		},
		onLoad() {

		},
		onPullDownRefresh() {
	
		},
		onShow() {
			let type = uni.getStorageSync('ztype')
			this.info_data = uni.getStorageSync('userInfo')
			this.phone = uni.getStorageSync('phone')
			console.log(this.info_data)
			if(type == 0){
				uni.redirectTo({
					url: '/pages/login/login'
				})
				this.flag = false
			}else{
				this.flag = true
			}
		},
		methods: {
			tx_btn() {
				if(!this.flag){
					uni.navigateTo({
						url: '/pages/login/login',
					})
				}
			},
			
			shop_btn(index){
				const token = uni.getStorageSync('token')
				if(!token){
					uni.redirectTo({
						url: '/pages/login/login',
					})
					return
				}
				uni.navigateTo({
					url: `/pages/my/order_list?index=${index}`
				})
			},
			share_btn() {
				console.log(23)
				const token = uni.getStorageSync('token')
				// if(!token){
					// uni.redirectTo({
					// 	url: '/pages/login/login',
					// })
					// return
				// }
				uni.switchTab({
					url:'/pages/tab/fw'
				})
			},
			//人员管理
			guanlu(){
				wx.navigateTo({
				  // url: '/pages/home/management'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.my_box{
		background-color: #f0f0f0;
		min-height: 100vh;
		.my_cont{
			height: 340upx;
			position: relative;
			overflow: hidden;
			display: flex;
			align-items: center;
			padding: 0 46upx;
			background-color: #fff;
			.my_img{
				width: 100%;
				position: absolute;
				bottom: 0;
				left: 0;
			}
			.my_nr{
				position: relative;
				z-index: 1;
				display: flex;
				.icon{
					width: 160upx;
					height: 160upx;
					display: flex;
					justify-content: center;
					align-items: center;
					background: #fff;
					border-radius: 50%;
					margin-right: 21upx;
					.img{
						border-radius: 50%;
						width: 156upx;
						height: 156upx;
						vertical-align: 0;
					}
				}
				.my_xq{
					color: #fff;
					display: flex;
					justify-content: center;
					flex-direction: column;
					.my_name{
						font-size: 35upx;
						line-height: 1;
						margin-bottom: 27upx;
					}
					.my_phone{
						font-size: 28upx;
						line-height: 1;
					}
				}
			}
		}
		.my_gn{
			background: #fff;
			width: calc(100vw - 40upx);
			position: relative;
			z-index: 2;
			margin: -50upx auto 20upx;
			height: 253upx;
			box-sizing: border-box;
			background: #fff;
			border-radius: 6upx;
			display: flex;
			padding: 0 35upx;
			justify-content: space-between;
			align-items: center;
			.my_gn_item{
				.img{
					width: 103upx;
					height: 103upx;
					margin-bottom: 27upx;
				}
				p{
					color: #343434;
					font-size: 31upx;
					font-weight: 400;
					text-align: center;
					line-height: 1;
				}
			}
		}
		.my_yj{
			// width: calc(100vw - 40upx);
			box-sizing: border-box;
			// margin: 0 auto 20upx;
			height: 112upx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 34upx;
			background: #fff;
			position: relative;
			button{
				width: 100%;
				height: 100%;
				position: absolute;
				left: 0;
				top: 0;
				background: transparent;
				&::after{
					border: none!important;
				}
			}
			
			.my_yj_left{
				display: flex;
				align-items: center;
				.img{
					width: 55upx;
					height: 55upx;
					margin-right: 34upx;
				}
				span{
					color: #343434;
					font-weight: 400;
					font-size: 31upx;
				}
			}
			.my_yj_rig{
				width: 46upx;
				height: 46upx;
				.img{
					width: 100%;
					height: 100%;
				}
			}
		}
	}
	.imgse{
		width: 56upx !important;
		height: 47upx !important;
	}
</style>
