|
@@ -6,6 +6,7 @@
|
|
<!-- v-if="canvasImg == ''" -->
|
|
<!-- v-if="canvasImg == ''" -->
|
|
<div ref="paymentCodeCanvas" id="paymentCodeCanvas">
|
|
<div ref="paymentCodeCanvas" id="paymentCodeCanvas">
|
|
<div class="paymentCode-img" ref="businessCardCanvas" id="businessCardCanvas">
|
|
<div class="paymentCode-img" ref="businessCardCanvas" id="businessCardCanvas">
|
|
|
|
+ <div class="paymentCode-img-live">团蜂同城生活</div>
|
|
<div class="paymentCode-img-title">扫码消费有补贴</div>
|
|
<div class="paymentCode-img-title">扫码消费有补贴</div>
|
|
<div class="img-box">
|
|
<div class="img-box">
|
|
<img :src="codeInfo.shopCode" alt="">
|
|
<img :src="codeInfo.shopCode" alt="">
|
|
@@ -38,14 +39,14 @@ import QRCode from 'qrcode';
|
|
import Cookies from 'js-cookie'
|
|
import Cookies from 'js-cookie'
|
|
import html2canvas from 'html2canvas'
|
|
import html2canvas from 'html2canvas'
|
|
export default {
|
|
export default {
|
|
- created () {
|
|
|
|
|
|
+ created() {
|
|
this.generateCode()
|
|
this.generateCode()
|
|
},
|
|
},
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
codeInfo: {
|
|
codeInfo: {
|
|
- shopName:'',
|
|
|
|
- shopCode:''
|
|
|
|
|
|
+ shopName: '',
|
|
|
|
+ shopCode: ''
|
|
},
|
|
},
|
|
canvasImg: '',
|
|
canvasImg: '',
|
|
srcList: [],
|
|
srcList: [],
|
|
@@ -65,7 +66,7 @@ export default {
|
|
},
|
|
},
|
|
{
|
|
{
|
|
url: require('@/assets/images/mode-img/4.png'),
|
|
url: require('@/assets/images/mode-img/4.png'),
|
|
- text: '团蜂交易金'
|
|
|
|
|
|
+ text: '团蜂消费金'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
url: require('@/assets/images/mode-img/5.png'),
|
|
url: require('@/assets/images/mode-img/5.png'),
|
|
@@ -78,7 +79,7 @@ export default {
|
|
],
|
|
],
|
|
// 没有 logo 的二维码图片
|
|
// 没有 logo 的二维码图片
|
|
qCodeImg: '',
|
|
qCodeImg: '',
|
|
- shopLogo:''
|
|
|
|
|
|
+ shopLogo: ''
|
|
}
|
|
}
|
|
},
|
|
},
|
|
// updated() {
|
|
// updated() {
|
|
@@ -111,15 +112,15 @@ export default {
|
|
ctx.drawImage(logo, logoX, logoY, logoSize, logoSize);
|
|
ctx.drawImage(logo, logoX, logoY, logoSize, logoSize);
|
|
// 将生成的二维码插入到页面中
|
|
// 将生成的二维码插入到页面中
|
|
this.codeInfo.shopCode = qrCodeCanvas.toDataURL();
|
|
this.codeInfo.shopCode = qrCodeCanvas.toDataURL();
|
|
- this.$nextTick(()=>{
|
|
|
|
|
|
+ this.$nextTick(() => {
|
|
this.generateImage()
|
|
this.generateImage()
|
|
})
|
|
})
|
|
};
|
|
};
|
|
},
|
|
},
|
|
async generateCode() {
|
|
async generateCode() {
|
|
- const res = await shopSysGetById({ })
|
|
|
|
- this.codeInfo.shopName = res.data.shopName
|
|
|
|
- this.shopLogo = res.data.shopLogo
|
|
|
|
|
|
+ const res = await shopSysGetById({})
|
|
|
|
+ this.codeInfo.shopName = res.data.shopName
|
|
|
|
+ this.shopLogo = res.data.shopLogo
|
|
// 生成 qCode 二维码
|
|
// 生成 qCode 二维码
|
|
this.setQRcode()
|
|
this.setQRcode()
|
|
},
|
|
},
|
|
@@ -228,18 +229,26 @@ img {
|
|
border-radius: 10px;
|
|
border-radius: 10px;
|
|
position: relative;
|
|
position: relative;
|
|
|
|
|
|
|
|
+ .paymentCode-img-live {
|
|
|
|
+ font-size: 28px;
|
|
|
|
+ color: #fff;
|
|
|
|
+ font-weight: 700;
|
|
|
|
+ font-style: italic;
|
|
|
|
+ margin-top: 15px;
|
|
|
|
+ }
|
|
|
|
+
|
|
.paymentCode-img-title {
|
|
.paymentCode-img-title {
|
|
display: block !important;
|
|
display: block !important;
|
|
width: 100%;
|
|
width: 100%;
|
|
- height: 76px !important;
|
|
|
|
|
|
+ height: 56px !important;
|
|
color: #fff !important;
|
|
color: #fff !important;
|
|
font-size: 50px !important;
|
|
font-size: 50px !important;
|
|
- margin: 32px 0 24px !important;
|
|
|
|
|
|
+ margin: 20px 0 24px !important;
|
|
font-weight: 700 !important;
|
|
font-weight: 700 !important;
|
|
font-style: italic !important;
|
|
font-style: italic !important;
|
|
box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
text-align: center;
|
|
text-align: center;
|
|
- line-height: 76px;
|
|
|
|
|
|
+ line-height: 56px;
|
|
}
|
|
}
|
|
|
|
|
|
.img-box {
|
|
.img-box {
|