71 lines
2.0 KiB
Vue
71 lines
2.0 KiB
Vue
<template>
|
|
|
|
<div>
|
|
|
|
<el-dialog
|
|
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,
|
|
|
|
}
|
|
},
|
|
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);
|
|
},
|
|
openCode(url) {
|
|
this.codeDialogVisible = true
|
|
this.$nextTick(() => {
|
|
$("#qrcode").html("")
|
|
$("#qrcode").qrcode({ //设置css
|
|
render: "canvas", //二维码的生成方式
|
|
width: $("#qrcode").width(), //生成二维码的宽度
|
|
height: $("#qrcode").width(), //生成二维码的高度
|
|
text: APP_DOMAIN + url,
|
|
correctLevel: 3 //容错级别，默认为2，最高为3，为了让用户扫码最快，容错级别应当设为最低
|
|
});
|
|
})
|
|
console.log(APP_DOMAIN + url)
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
</style>
|