<template>
  <div class="app-container" >
    <div class="header">
      <van-row style="width: 90%; margin: 0 auto">
        <van-col span="7">
          <img v-if="user.avatar" :src="'/api'+user.avatar" style="border: 2px solid #FFF;width: 2rem;height: 2rem;border-radius: 50%;">
          <img v-else src="../../assets/images/user_tx.png" style="width: 2rem;height: 2rem;border-radius: 50%;">
        </van-col>
        <van-col span="17">
          <p>{{phone}}</p>
          <p onclick="window.location='accountSetting'">账户设置</p>
        </van-col>
      </van-row>
    </div>
    <div style="width: 96%;transform: translateY(-20%);margin: 0 auto;border-radius: 0.4rem;overflow: hidden;">
      <van-cell title="我的竞价" is-link icon="bar-chart-o" to="bidding" />
      <van-cell title="我的咨询" is-link icon="service-o" to="userInteraction" />
      <van-cell title="我的供求" is-link icon="bag-o" to="userSupply" />
      <van-cell title="合同网签" is-link icon="orders-o" to="/user/signature/signatureList" />
    </div>
    <van-button class="loginOut" round color="#007E72" @click="loginOut">
      退出登录
    </van-button>
  </div>
</template>

<script>
import { getMember , supplyList , deleteSupply} from "@/api/user/index";
import { logout ,getInfo } from "@/api/login/index";
import Cookies from "js-cookie";

export default {
  name: "user",
  data() {
    return {
      phone:'',
      user:'',
    };
  },
  created() {
    this.getInfo();
  },
  methods: {
    loginOut(){
      logout().then(response => {
        var keys = document.cookie.match(/[^ =;]+(?=\=)/g);
        if(keys) {
          for(var i = keys.length; i--;)
            document.cookie = keys[i] + '=0;expires=' + new Date(0).toUTCString()
        }
        this.$router.push({name:'index'})
      });
    },
    getInfo(){
      getInfo().then(response => {
        console.log(response)
        this.user = response.user;
        getMember(response.user.userId).then(response => {
          console.log(response)
          Cookies.set('memberId',response.data.id)
          this.phone = response.data.phone;
        });
      });
    },
  },
};
</script>

<style scoped lang="scss">
.app-container {

}
  .header{
    background-color: #007E72;
    padding: 1rem 0rem 1.5rem;
    width: 100%;
    p{
      color: #FFF;
      font-size: 0.4rem;
      margin-top: 0.2rem;
    }
    p:nth-child(2){
      width: 40%;
      text-align: center;
      padding: 10px;
      border-radius: 0.5rem;
      margin-top: 0.2rem;
      font-size: 12PX;
      background: #FEE1AA url("../../assets/images/seting.png") no-repeat left center;
      background-size: 0.5rem;
      color: #007E72;
      padding-left: 5%;
      background-position-x: 6%;
    }
  }
  .van-icon{
    color: #007E72;
  }
  .loginOut{
    width: 94%;
    margin-left: 3%;
  }
</style>
