<template> <div class="guideActivity"> <div class="h2"> <img :src="icon_yes" alt /> <span v-if='!exChange'>恭喜您,成功激活课程!</span> <span v-if='exChange'>恭喜您,成功兑换课程!</span> </div> <div class="top"> <img class="qr" v-if='!exChange' :src="imgguide2" alt /> <img class="qr" v-if='exChange' :src="imgguide" alt /> <img v-if="userCourse.teacher_qr" class="qrcode" :src="userCourse.teacher_qr" /> </div> <!-- <img class='logo' :src="logo" alt=""> --> </div> </template> <script> import icon_yes from "../../assets/yb/icon_yes@2x.png"; import imgguide from "../../assets/shop/imgguide@2x.png"; import imgguide2 from "../../assets/shop/imgguide2@2x.png"; import logo from "../../assets/yb/logo@2x.png"; import { getCourseInfoApi, getwechatParam, getUserDetailApi, getGoodsDetailApi } from "../../service/api"; export default { name: "guideActivity", components: {}, data() { return { icon_yes: icon_yes, logo: logo, groupDetail: {}, userCourse: {}, imgguide: imgguide, imgguide2:imgguide2, exChange:null }; }, mounted() { this.initPage(); }, methods: { initPage() { if(this.$route.query.exChange){ this.exChange = this.$route.query.exChange } if (window.location.href.indexOf("invite_code") > -1) { this.invite_code = this.$route.query.invite_code; } this.userCourse = JSON.parse(localStorage.getItem("userCourse")); console.log(this.userCourse); this.user_id = JSON.parse(localStorage.getItem("userDesc")).user_id; } } }; </script> <style scoped lang="less"> @import "../../util/public"; .guideActivity { background: #ffffff; text-align: center; border-top: 1px solid transparent; .top { margin: 35 * @toVw auto; width: 326 * @toVw; // background: #FFEAAD; border-radius: 24 * @toVw; position: relative; img { max-width: 100%; } .qr { // position: absolute; // left: 25 * @toVw; width: 326 * @toVw; // top: 31*@toVw; border-radius: 10 * @toVw; } .qrcode { position: absolute; top: 110 * @toVw; left: 68 * @toVw; width: 189 * @toVw; z-index: 1; } 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; } } .logo { position: fixed; left: 130 * @toVw; bottom: 20 * @toVw; width: 125 * @toVw; } } @media screen and (orientation: landscape) { } </style>