SeniorMember.vue 2.2 KB
<template>
 <div class="home">
    <h2 @click="goBack"><</h2>
    <div class="nav">
         <div class="nav1">
           <img src="../assets/2.png" alt="">
            <h1>高级会员</h1>
         </div>
         <p>¥<span>100</span>/月</p>
         <p>高级会员搜索排名优先,每天可以选择一个心仪对象</p>
    </div>
    <div class="footer" @click="goPay">升级</div>
 </div>
</template>
<script>

export default {
  name: 'home',
  components: {

  },
  methods: {

    goBack ()  {
      this.$router.go(-1)
    },
    goPay () {
       this.$axios.post('/api/Center/center_vip',{}).then((res) => {
           this.data = res.data
            this.$router.push('/pay')
            console.log(this.data)
       }).catch((err) =>{
         console.log(err)
       })
      }
  }
}
</script>
<style lang="scss" scoped>
  .home{
    width:100%;
    height:100%;
    background:#11A7FC;
     padding-top:15%;
    padding-left:6%;
    h2{
      width:.14rem;
      height:.17rem;
      font-size:.2rem;
      color:rgba(255,255,255,1);
    }
    .nav{
      width:3.43rem;
      height:1.7rem;
      margin-top:15%;
      background:red;
      margin-left:1%;
      background:url('../assets/7.png') 100%;
      border-radius:.2rem;
      .nav1{
        width:2.5rem;
        height:.7rem;
        // background:pink;
        margin-top:.78rem;
        margin-left:.26rem;
        h1{
          font-size:.2rem;
          line-height:.7rem;
          color:#784700;
          margin-left:.1rem;
        }
        img{
          width:.28rem;
          height:.28rem;
          float:left;
           margin-top:.22rem;

        }
      }
      p{
        font-size:.12rem;
        color:#784700;
        line-height:.45rem;
        margin-left:0.3rem;
        span{
          font-size:.16rem;
          font-weight:bold;
        }
      }
    }
    .footer{
      width:92%;
      height:.5rem;
      font-size:.2rem;
      line-height:.5rem;
      text-align:center;
      margin-top:2.8rem;
      background:linear-gradient(310deg,rgba(255,186,106,1) 0%,rgba(242,211,154,1) 100%);
        box-shadow:0px 12px 24px 0px rgba(32,166,242,0.58);
        border-radius:48px;
    }
  }
</style>