ybPaySuccess.vue 5.61 KB
<template>
  <div class="ybPaySuccess">
    <div class='h2'>
      <img :src="icon_yes" alt=""> 恭喜您,成功领取唱唱启蒙精品课程!
    </div>
    <p class='tip'>*教具礼包将于开课前寄出</p>
    <div class='top'>
      <img class='qr' :src="img1" alt="">
      <p>请扫码关注公众号,查看课程!</p>
    </div>
    <img class='logo' :src="logo" alt="">
  </div>
</template>

<script>
import icon_yes from '../../assets/yb/icon_yes@2x.png'
// import img1 from '../../assets/shop/qr2.png'
import img1 from '../../assets/yb/img_code@2x.png'
import logo from '../../assets/yb/logo@2x.png'
import { getCourseInfoApi,getwechatParam,getGoodsDetailApi } from "../../service/api";
export default {
  name: "ybPaySuccess",
  components: {},
  data() {
    return {
      img1:img1,
      icon_yes:icon_yes,
      logo:logo,
      groupDetail:{},
    };
  },
  mounted() {
    this.initPage();
  },
  methods: {
    initPage() {
      if (window.location.href.indexOf("invite_code") > -1) {
        this.invite_code = this.$route.query.invite_code;
      }
      this.user_id = JSON.parse(localStorage.getItem("userDesc")).user_id;
      this.onShare()
      let invite = this.invite_code;
      getGoodsDetailApi(50).then(res =>{
        this.groupDetail = res
        this.$sa.track("ViewTeacherPage", {
          goodsID: this.groupDetail.id.toString(),
            courseCate:
              this.groupDetail.course_type === 1 ? "体验课" : "正式课",
            lessonNumber: this.groupDetail.watch_num,
            goodsName: this.groupDetail.name,
            coursePrice: Number(this.groupDetail.original_price / 100),
            discountPrice: Number(this.groupDetail.current_price / 100),
            courseID: this.groupDetail.course_id,
            courseName: "",
            salesType: invite ? invite.split("-")[1] : "null",
            salesID: invite ? Number(invite.split("-")[2]) : 0
        });
      })
    },
    goEdit(){
      this.$router.push({name:'addressEdit'})
    },
    handleInviteCode() {
      if (!this.invite_code) {
        this.this_code = "CC-AIA-" + this.user_id;
      } else {
        let invite_code = this.invite_code.split("-");
        let code = `${invite_code[0]}-${invite_code[1]}`;
        this.this_code = `${code}-${this.user_id}`;
      }
    },
    onShare: function(type) {
      this.handleInviteCode();
      let URL = `${process.env.API_URL}#/ybNav?parentId=${this.$route.query.parentId}&agentId=${this.$route.query.agentId}`;
      this.enableShare({
        product_title: '【免费领】价值498元亲子早教英语启蒙训练课',
        desc: '友邦助您启蒙宝贝快乐家庭',
        shareIcon: 'https://cdn.singsingenglish.com/new-sing/6c51175a99f73ee3a410ea9fbf66123f9f49f0f6.png',
        shareUrl: URL
      });
    },
    enableShare: function(option) {
      let that = this;
      getwechatParam({
        api_list: "onMenuShareAppMessage,onMenuShareTimeline",
        url: window.location.href.split("#")[0]
      }).then(wechatRes => {
        wx.config({
          debug: false,
          appId: wechatRes.appId,
          timestamp: parseInt(wechatRes.timestamp),
          nonceStr: wechatRes.nonceStr,
          signature: wechatRes.signature,
          jsApiList: wechatRes.jsApiList
        });
        wx.ready(function() {
          wx.onMenuShareTimeline({
            title: '【庆百年 友惊喜】暑期亲子礼︱价值498元唱唱启蒙英语线上课程免费领', // 分享标题
            desc: '【庆百年 友惊喜】暑期亲子礼︱价值498元唱唱启蒙英语线上课程免费领', // 分享描述
            link: option.shareUrl, // 分享链接
            imgUrl:
              option.shareIcon ||
              "https://cdn.singsingenglish.com/singsing/recommend/logo-refer.png", // 分享图标
            success: function() {
              console.log("分享成功");
            },
            cancel: function() {
              // alert("失败")
              console.log("分享失败");
            }
          });
          wx.onMenuShareAppMessage({
            title: '【庆百年 友惊喜】暑期亲子礼', // 分享标题
            desc: '价值498元唱唱启蒙英语线上课程免费领', // 分享描述
            link: option.shareUrl, // 分享链接
            imgUrl:
              option.shareIcon ||
              "https://cdn.singsingenglish.com/singsing/recommend/logo-refer.png", // 分享图标
            success: function() {},
            cancel: function() {}
          });
        });
      });
    },
  }
};
</script>

<style scoped lang="less">
@import "../../util/public";
.ybPaySuccess {
  background: #ffffff;
  text-align:center;
  border-top: 1px solid transparent;
  .top{
    margin:15 * @toVw auto;
    width: 326* @toVw;
    background: #FFEAAD;
    height: 350 * @toVw;
    border-radius:24 * @toVw;
    position: relative;
    img{max-width:100%;}
    .qr{
      position: absolute;
      left: 59 * @toVw;
      width: 207 * @toVw;
      top: 31*@toVw;
      border-radius:10 * @toVw;
    }
    p{
      position: absolute;
      top:270*@toVw;
      width: 100%;
      text-align: center;
      color:#6F5C25;
      font-weight:bold;
      font-size: 17 * @toVw;
    }
  }
  .h2{
    font-size:17 * @toVw;
    font-weight:bold;
    text-align:center;
    margin-top: 30 * @toVw;
    img{
      width: 24 * @toVw;
      position:relative;
      top: 2 * @toVw;
    }
  }
  .tip{
    font-size:13 * @toVw;
    color:#666666;
    margin: 13 * @toVw auto 33 * @toVw;
  }
  .logo{
    position:fixed;
    left: 130 * @toVw;
    bottom: 20 * @toVw;
    width: 125 * @toVw;
  }
}
@media screen and (orientation: landscape) {

}
</style>