<template>
	<div class="body">
    <!-- 选择类型 -->
    <!-- <back :title="titlename"></back> -->
    <div class="head">
		<img src="../assets/images/foot_icon1.png" alt="">
		<div>
			<p>昵称：{{user.name}}</p>
			<p>{{user.phone}}</p>
		</div>
		<img style="width: 100%;border-radius: 0px;margin-top: .4rem;" src="../assets/images/my_banner.png" alt="">
	</div>
    <div class="list">
      <router-link to="/Personinfomation">
        <img src="../assets/images/my_icon1.png" alt="">
        <span>个人信息</span>
      </router-link>
      <router-link to="/Doorlist">
        <img src="../assets/images/my_icon2.png" alt="">
        <span>我的快件</span>
      </router-link>
      <router-link to="/Appointmentlist">
        <img src="../assets/images/my_icon3.png" alt="">
        <span>客服</span>
      </router-link>
      <router-link to="/Realinfo">
        <img src="../assets/images/my_icon4.png" alt="">
        <span>地址簿维护</span>
      </router-link>
      <router-link to="/Doorlist">
        <img src="../assets/images/my_icon5.png" alt="">
        <span>消息</span>
      </router-link>
      <router-link to="/Appointmentlist">
        <img src="../assets/images/my_icon6.png" alt="">
        <span>设置</span>
      </router-link>
    </div>
    <!-- 底部 -->
    <tabbar></tabbar>
	</div>

</template>

<script>
export default {
    data() {
      return {
        openid:"",
        user:[]
      };
    },
    created:function(){
       this.openid = this.$store.state.openId
       console.log(this.openid)
       //this.openid = '123'
	   this.getUser();
    },
    methods:{
      //跳转
      

    }
  };
</script>

<style lang="less" scoped>
  body{
    background: #fbfbfb;
  }
  .body{
	  .head{
		  padding:.43rem .38rem;
		  font-size: .24rem;
		  color: #999;
		  display: flex;
		  background: white;
		  flex-wrap: wrap;
		  position: relative;
		  img{
			  width: 1.48rem;
			  height: 1.48rem;
			  border-radius: 50%;
			  margin-right: .4rem;
		  }
		  div{
			  p:nth-of-type(1){
				  font-size: .36rem;
				  font-weight: bold;
				  color: #333;
				  margin-bottom: .2rem;
				  padding-top: .3rem;
			  }
		  }
		  div:after{
			  content: "";
			  display: block;
			  width: .2rem;
			  height: .2rem;
			  border-left: .01rem solid #333;
			  border-top: .01rem solid #333;
			  transform: rotate(135deg);
			  position: absolute;
			  right: .38rem;
			  top: 1rem;
		  }
	  }
    .list{
      background: white;
      margin-top: .36rem;
      border-radius: .05rem;
      a{
        font-size: .3rem;
        font-weight: bold;
        display: block;
        color: #333;
        padding:.3rem .4rem;
        border-bottom:1px solid #f4f3f3;
		position: relative;
        img{
          width: .4rem;
          height: .4rem;
        }
        span{
          position: relative;
          top: -.075rem;
          margin-left: .3rem;
        }
      }
	  a:after{
		  content: "";
		  display: block;
		  width: .2rem;
		  height: .2rem;
		  border-left: .01rem solid #b8b8b8;
		  border-top: .01rem solid #b8b8b8;
		  transform: rotate(135deg);
		  position: absolute;
		  right: .4rem;
		  top: .4rem;
	  }
    }
  }
</style>
