<template>
    <div class="app-center">

      <el-card class="box-card">
        <div slot="header" class="clearfix">
          <i class="el-icon-back"></i>
          <span>会员详情</span>
        </div>
        <div>基础资料</div>
        <div class="vip-my-top">
<!--          -->
          <div class="f-box">
            <div class="imgtoux"><el-avatar :size="80" :src="circleUrl"></el-avatar></div>
            <div>
              <el-button type="warning" plain round>绑定实体卡</el-button>
            </div>
            <div>
              <el-button type="primary" plain round>会员充值</el-button>
            </div>


          </div>

<!--          -->
        </div>

      </el-card>
      <el-card class="box-card">
      </el-card>
      <el-card class="box-card">
      </el-card>

    </div>
</template>

<script>
    export default {
        name: "index",
        data(){
          return{
            circleUrl: "https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png",
          }
        }
    }
</script>

<style scoped>
  .app-center{
    width: 100%;
    box-sizing: border-box;
    padding: 10px;
  }
  .vip-my-top{
    width: 100%;
    display: flex;
  }
  .f-box{
    width: 20%;

  }
  .imgtoux{
    width: 80px;
    margin: 10px auto;
  }

</style>
