<template>
  <div id="QRCode" class="qrcode">
    <div id="qrCodeShow"></div>
  </div>
</template>
<script>

import QRCode from 'qrcodejs2'

export default {
  name: 'QRCode',
  data() {
    return {
      codes: '',
      companyName: '',
      companyTaxId: ''
    }
  },
  created() {
    this.companyName = this.$attrs.qrcode.companyName
    this.companyTaxId = this.$attrs.qrcode.companyTaxId
  },
  mounted() {
    this.showQrCode()
  },
  methods: {
    getCompanyInfo(companyName, companyTaxId) {
      this.companyName = companyName
      this.companyTaxId = companyTaxId
    },
    // 生成二维码
    showQrCode() {
      this.codes = ''
      document.getElementById('qrCodeShow').innerHTML = ''
      let url = 'https://www.chtax.cn/qrcode/#/titleTodo?entTaxId=' + this.companyTaxId + '&entName=' + this.companyName + ''
      this.codes = new QRCode('qrCodeShow', {
        width: 200,
        height: 200, // 高度
        text: url, // 二维码内容
        // colorDark : '#f0f',      // 前景色
        // colorLight : '#ff0',      // 背景色
        correctLevel: QRCode.CorrectLevel.L // 容错等级
      })
    },
    qrCodeDownLoad() {
      let myCanvas = document.getElementById('qrCodeShow').getElementsByTagName('canvas')
      let a = document.createElement('a')
      a.href = myCanvas[0].toDataURL('image/png')
      a.download = '扫码开票'
      a.click()
      this.$message({
        message: '正在进行下载保存',
        type: 'success'
      })
    },
    qrCodePrint() {

    }
  }
}
</script>

<style scoped>
.qrcode {
  display: flex;
  justify-content: center;
  align-content: center;
}
</style>
