<template>
  <div class="address2" >
    <div class="avata" v-if="acceptStatus==0">
      <img :src="userDetail.avatar" alt="">
    </div>
    <div class="title" v-if="acceptStatus==1">
      授权成功
    </div>
    <div class="title" v-if="acceptStatus==2">
      授权失败
    </div>
    <div class="text" v-if="acceptStatus==0">
      <p>你的好友{{userDetail.nickname}}邀请你</p>
      <p>成为他在唱唱启蒙英语的子账户</p>
    </div>
    <div class="text" v-if="acceptStatus==1">
      <p>此账号已成为{{userDetail.nickname}}在</p>
      <p>唱唱启蒙英语上的子账户</p>
    </div>
    <div class="text" v-if="acceptStatus==2&&errMsg==4002">
      <p>您不能成为自己的子账号</p>
    </div>
    <div class="text" v-if="acceptStatus==2&&errMsg==4003">
      <p>您的账号存在课程</p>
      <p>不能接受其他的看课授权</p>
    </div>
    <div class="text" v-if="acceptStatus==2&&errMsg==4004">
      <p>绑定子账号数超额</p>
      <p>一个主账号只能绑定一个子账号</p>
    </div>
    <div class="text" v-if="acceptStatus==2&&errMsg==4001">
      <p>该链接已过期</p>
      <p>请联系授权人重新分享</p>
    </div>
    <div class="text" v-if="acceptStatus==2&&errMsg==4005">
      <p>绑定主账号数超额</p>
      <p>一个子账号只能绑定一个主账号</p>
    </div>
    <div class="text" v-if="acceptStatus==2&&errMsg==4006">
      <p>恭喜您以成为{{userDetail.nickname}}</p>
      <p>在唱唱启蒙英语上的子账号</p>
    </div>
    <div class="text" v-if="acceptStatus==2&&errMsg==4007">
      <p>该链接已失效</p>
      <p>请联系授权人核实</p>
    </div>
    <div class="text" v-if="acceptStatus==2&&errMsg==4008">
      <p>您已授权子账号</p>
      <p>不可接受其他账号授权</p>
    </div>
    <div class="btnBox" @click="acceptFn" v-if="acceptStatus==0"><van-button round size="large" type="info">确认接受</van-button></div>
    <div class="ewm" v-if="acceptStatus!=0">
      <p>扫码关注</p>
      <p>「唱唱启蒙英语」</p>
      <img :src="img_qr" alt="">
    </div>
    <img class="bg" :src="img_logo" alt="">
  </div>
</template>

<script>
import img_logo from "../../assets/account/img_logo@3x.png";
import img_qr from "../../assets/shop/qr4.png";
import { bindAccountApi,mainAccountinfoApi,searchAccountinfoApi } from "../../service/api";
import common from '../../util/common'
import { Toast } from 'vant';
export default {
  name: "accept",
  components: {},
  data() {
    return {
      img_logo: img_logo,
      img_qr:img_qr,
      addressInfo: {},
      userDetail:{},
      acceptStatus:0,
      errMsg:"",
      sonDetail:{}
    };
  },
  mounted() {
    this.initPage();
  },
  methods: {
    initPage() {
      //  console.log(common.getParamhref())
       console.log(this.$route.query)
      // console.log(common.getUrlParam().code)
      this.sonDetail = localStorage.getItem("userDesc")
      if(this.$route.query.code){
        searchAccountinfoApi(this.$route.query.code).then(res =>{
          if(res.code==1){
          }else if(res.code==4006){
            this.acceptStatus = 1
          }else{
            this.errMsg = res.code
            this.acceptStatus = 2
          }
        })
          mainAccountinfoApi(this.$route.query.code).then(res =>{
            this.userDetail = res
          // console.log(res)
        })
      }else{
        alert('分享失败')
        // this.userDetail = JSON.parse(localStorage.getItem("userDesc"));
      }
    },
    acceptFn(){
      bindAccountApi(this.$route.query.code).then(res =>{
        if(res.code==1){
          this.acceptStatus = 1
          if(this.sonDetail.open_info.is_subscribe==1){
            Toast("授权成功")
            window.location=process.env.AUTHOR_UEL+'&refresh=1'
          }
        }else{
          this.errMsg = res.code
          this.acceptStatus = 2
        }
      })
    }
  }
};
</script>

<style scoped lang="less">
@import "../../util/public";
.address2 {
  background: #FFECAD;
  .bg{
    width: 100%;
    position: fixed;
    bottom: 0;
  }
  .avata{
    text-align: center;
    padding-top: 60* @toVw;
    img{width: 84* @toVw; border-radius: 50%;border: 3px solid white; }
  }
  .text{
    text-align: center;
    color: #333333;
    margin-top: 20* @toVw;
    line-height: 26* @toVw;
  }
  .btnBox{
    text-align: center;
    margin-top: 58* @toVw;
    .van-button--info{width: 132* @toVw;}
    font-weight: bold;
  }
  .ewm{
    text-align: center;
    margin-top: 68* @toVw;
    font-size: 12* @toVw;
    img{width: 180* @toVw; margin-top: 10* @toVw; }
  }
  .title{
    font-size: 30* @toVw;
    text-align: center;
    font-weight: 700;
    padding-top: 25* @toVw;
  }
}
</style>