// 浙学码页面
<template>
  <div class="zx_code">
    <p class="title">浙 学 码</p>
    <iframe class="zx_iframe" v-if="iframeUrl" :src="iframeUrl" frameborder="0"></iframe>
  </div>
</template>
<script>
export default {
  data() {
    return {
      StudentDetialInfo: {},
      iframeUrl: '',
    }
  },
  mounted() {
    this.setIframe()
    window.addEventListener('message', (e) => {
      if (e.data.type && e.data.type === 'zhexuema') {
        console.log(e.data.data.cubeUserId)
        this.bindLearnCode(e.data.data.cubeUserId)
      }
    })
  },
  destroyed() {
    window.removeEventListener('message', (e) => {
      if (e.data.type && e.data.type === 'zhexuema') {
        console.log(e.data.data.cubeUserId)
        this.bindLearnCode(e.data.data.cubeUserId)
      }
    })
  },
  methods: {
    setIframe() {
      let StudentDetialInfo = localStorage.getItem('StudentDetialInfo')
      if (!StudentDetialInfo) {
        this.$toast('未获取到用户信息，请退出重试')
      } else {
        StudentDetialInfo = JSON.parse(StudentDetialInfo)
        this.StudentDetialInfo = StudentDetialInfo
        let appId = '133199'
        if (StudentDetialInfo.cubeUserId) {
          this.iframeUrl = `https://zcode-images.zjedu.com:9060/QRCode/index.html?appId=${appId}&areaCode=330600&simple=true&cubeUserId=${StudentDetialInfo.cubeUserId}`
        } else {
          this.iframeUrl = `https://zcode-images.zjedu.com:9060/QRCode/index.html?appId=${appId}&areaCode=330600&simple=true&mobile=${StudentDetialInfo.travelerMobile}&nickName=${StudentDetialInfo.travelerName}&cardNo=${StudentDetialInfo.travelerIdCard}`
        }
      }
    },
    // 绑定浙学码
    bindLearnCode(cubeUserId) {
      let StudentDetialInfo = localStorage.getItem('StudentDetialInfo')
      StudentDetialInfo = JSON.parse(StudentDetialInfo)
      if (StudentDetialInfo.cubeUserId) return
      this.yxAxios.get(`${this.proxyUrl}/user/info/bindLearnCode?travelerId=${this.StudentDetialInfo.id}&cubeUserId=${cubeUserId}`)
    },
  },
}
</script>
<style lang="scss" scoped>
.zx_code {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  padding: 70px 50px;
}
.zx_iframe {
  width: 100%;
  height: 100%;
}
.title{
  font-size: 40px;
  text-align: center;
  margin-bottom: 50px;
}
</style>