75 lines
2.5 KiB
Vue
75 lines
2.5 KiB
Vue
<template>
|
|
|
|
<div>
|
|
|
|
<el-dialog
|
|
:title="title"
|
|
:visible.sync="codeDialogVisible"
|
|
:close-on-click-modal="false"
|
|
width="40%">
|
|
<div style="width: 100%;">
|
|
<div id="qrcode" style="width: 70%;left: 0;right: 0;margin: auto"></div>
|
|
</div>
|
|
|
|
<span slot="footer" class="dialog-footer">
|
|
<el-button @click="codeDialogVisible = false" type="primary">关 闭</el-button>
|
|
<!-- <el-button type="primary" @click="dwn('活动二维码')">下 载</el-button>-->
|
|
</span>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
|
|
module.exports = {
|
|
props: {},
|
|
data() {
|
|
return {
|
|
codeDialogVisible: false,
|
|
title: "活动二维码"
|
|
}
|
|
},
|
|
methods: {
|
|
saveFile(data, filename) {
|
|
var save_link = document.createElementNS("http://www.w3.org/1999/xhtml", "a")
|
|
save_link.href = data
|
|
save_link.download = filename
|
|
|
|
var event = document.createEvent("MouseEvents")
|
|
event.initMouseEvent("click", true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null)
|
|
save_link.dispatchEvent(event)
|
|
},
|
|
/*下载二维码*/
|
|
dwn(name) {
|
|
var type = "png"
|
|
var dataurl = $("canvas").get(0).toDataURL("image/png").replace("image/png", "image/octet-stream")
|
|
var filename = name + "_" + (new Date()).getTime() + "." + type
|
|
this.saveFile(dataurl, filename)
|
|
},
|
|
isHttpOrHttps(url) {
|
|
return /^(http:\/\/|https:\/\/)/i.test(url)
|
|
},
|
|
openCode(url, title) {
|
|
this.codeDialogVisible = true
|
|
this.$nextTick(() => {
|
|
$("#qrcode").html("")
|
|
$("#qrcode").qrcode({ //设置css
|
|
render: "canvas", //二维码的生成方式
|
|
width: $("#qrcode").width(), //生成二维码的宽度
|
|
height: $("#qrcode").width(), //生成二维码的高度
|
|
text: this.isHttpOrHttps(url) ? url : (APP_DOMAIN + url),
|
|
correctLevel: 3 //容错级别，默认为2，最高为3，为了让用户扫码最快，容错级别应当设为最低
|
|
})
|
|
})
|
|
this.title = title ? title : "活动二维码"
|
|
console.log(APP_DOMAIN + url)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
</style>
|