|
|
|
@ -8,20 +8,20 @@ |
|
|
|
<view class="canvas-box"> |
|
|
|
<canvas style="width: 375px;height: 667px;position:fixed;top:9999px" canvas-id="mycanvas" /> |
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
<view class="btn-bottom" style="bottom: 40rpx;"> |
|
|
|
<view class="padding-lr-lg"> |
|
|
|
<button class="cu-btn block bg-orange lg" style="border-radius: 42rpx;" @tap="saveBill()"> |
|
|
|
<text class="lf-font-32 text-white">保存</text> |
|
|
|
</button> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="flex justify-center align-center lf-m-t-30"> |
|
|
|
|
|
|
|
<!-- <view class="flex justify-center align-center lf-m-t-30"> |
|
|
|
<view class="lf-color-gray lf-font-28">https：//hbdsufiewhuifusikj.com</view> |
|
|
|
<view class="lf-font-24 text-orange lf-m-l-30" @click="copy('https：//hbdsufiewhuifusikj.com')">复制</view> |
|
|
|
</view> |
|
|
|
</view> --> |
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
</template> |
|
|
|
|
|
|
|
@ -41,10 +41,11 @@ |
|
|
|
}, |
|
|
|
showLogin: true, |
|
|
|
imagePath: '', |
|
|
|
|
|
|
|
|
|
|
|
userToken: '', |
|
|
|
wxCode: '', |
|
|
|
onceCode: '' |
|
|
|
onceCode: '', |
|
|
|
backgroundImg: '' |
|
|
|
} |
|
|
|
}, |
|
|
|
onLoad() { |
|
|
|
@ -54,24 +55,37 @@ |
|
|
|
duration: 1000 |
|
|
|
}); |
|
|
|
this.getWxCode() |
|
|
|
this.getBackground() |
|
|
|
}, |
|
|
|
methods:{ |
|
|
|
methods: { |
|
|
|
getBackground() { |
|
|
|
let _this = this |
|
|
|
_this.$http(_this.API.API_BILLBACKGROUND, { |
|
|
|
type: 'telent_share' |
|
|
|
}).then(res => { |
|
|
|
let img = res.data.img_url |
|
|
|
if (img) { |
|
|
|
wx.getImageInfo({ |
|
|
|
src: img, |
|
|
|
success: function(sres) { |
|
|
|
_this.backgroundImg = sres.path |
|
|
|
console.log('临时路径',_this.backgroundImg) |
|
|
|
} |
|
|
|
}) |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
getWxCode() { |
|
|
|
uni.request({ |
|
|
|
url: 'http://dev-gxsky.com/api/salesman/qrcode', //仅为示例，并非真实接口地址。 |
|
|
|
data: { |
|
|
|
scene: 'route=home&id=2&pt=2', |
|
|
|
page: 'pages/route/index', |
|
|
|
width: '2800' |
|
|
|
}, |
|
|
|
method: 'POST', |
|
|
|
success: (res) => { |
|
|
|
this.wxCode = res.data.data.base_url |
|
|
|
if (this.wxCode) { |
|
|
|
this.getwxCodeImg() |
|
|
|
} |
|
|
|
this.$http(this.API.API_WXBILL, { |
|
|
|
scene: 'route=home&id=2&pt=2', |
|
|
|
page: 'pages/route/index', |
|
|
|
width: '2800' |
|
|
|
}).then(res => { |
|
|
|
this.wxCode = res.data.base_url |
|
|
|
if (this.wxCode) { |
|
|
|
this.getwxCodeImg() |
|
|
|
} |
|
|
|
}); |
|
|
|
}) |
|
|
|
}, |
|
|
|
//保存二维码 |
|
|
|
getwxCodeImg() { |
|
|
|
@ -84,9 +98,13 @@ |
|
|
|
encoding: 'base64', |
|
|
|
success: res => { |
|
|
|
this.onceCode = wx.env.USER_DATA_PATH + '/pic' + number + '.jpg' |
|
|
|
if(this.onceCode) { |
|
|
|
console.log('小程序二维码',this.onceCode) |
|
|
|
console.log(this.onceCode) |
|
|
|
if (this.onceCode && this.backgroundImg) { |
|
|
|
this.createNewImg() |
|
|
|
}else if(!this.onceCode){ |
|
|
|
this.$msg('小程序码生成失败!') |
|
|
|
}else if(!this.backgroundImg){ |
|
|
|
this.$msg('海报背景图生成失败!') |
|
|
|
} |
|
|
|
}, |
|
|
|
fail: err => { |
|
|
|
@ -97,7 +115,8 @@ |
|
|
|
createNewImg() { |
|
|
|
var that = this; |
|
|
|
var context = wx.createCanvasContext('mycanvas'); |
|
|
|
var path = "../../static/images/bill.png"; |
|
|
|
console.log('画布', that.backgroundImg) |
|
|
|
var path = that.backgroundImg; |
|
|
|
context.drawImage(path, 0, 0, 375, 667); |
|
|
|
//绘制二维码 |
|
|
|
let wxcode = that.onceCode |
|
|
|
@ -115,7 +134,7 @@ |
|
|
|
canvasId: 'mycanvas', |
|
|
|
success: function(res) { |
|
|
|
that.imagePath = res.tempFilePath; |
|
|
|
if(that.imagePath) { |
|
|
|
if (that.imagePath) { |
|
|
|
that.canvasHidden = true |
|
|
|
that.maskHidden = true |
|
|
|
} |
|
|
|
@ -125,7 +144,7 @@ |
|
|
|
console.log(res); |
|
|
|
} |
|
|
|
}); |
|
|
|
},900); |
|
|
|
}, 900); |
|
|
|
}, |
|
|
|
saveBill() { |
|
|
|
var that = this |
|
|
|
@ -166,14 +185,14 @@ |
|
|
|
width: 100%; |
|
|
|
height: 366rpx; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.mine { |
|
|
|
display: block; |
|
|
|
text-align: center; |
|
|
|
color: #333; |
|
|
|
margin-top: 44rpx; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.code { |
|
|
|
display: block; |
|
|
|
text-align: center; |
|
|
|
@ -182,7 +201,7 @@ |
|
|
|
font-weight: bold; |
|
|
|
margin-top: 30rpx; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.who { |
|
|
|
display: block; |
|
|
|
margin-top: 80rpx; |
|
|
|
@ -190,12 +209,12 @@ |
|
|
|
color: #333; |
|
|
|
text-align: center; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.inputBox { |
|
|
|
text-align: center; |
|
|
|
margin-top: 44rpx; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.input { |
|
|
|
text-align: center; |
|
|
|
width: 440rpx; |
|
|
|
@ -205,7 +224,7 @@ |
|
|
|
font-size: 32rpx; |
|
|
|
display: inline-block; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.btn { |
|
|
|
width: 160rpx; |
|
|
|
height: 88rpx; |
|
|
|
@ -218,18 +237,18 @@ |
|
|
|
line-height: 88rpx; |
|
|
|
margin-left: 40rpx; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
button[class="btn"]::after { |
|
|
|
border: 0; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.tishi { |
|
|
|
display: block; |
|
|
|
text-align: center; |
|
|
|
color: #999; |
|
|
|
margin-top: 30rpx; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.shareText { |
|
|
|
display: block; |
|
|
|
text-align: center; |
|
|
|
@ -237,24 +256,24 @@ |
|
|
|
font-size: 28rpx; |
|
|
|
margin-top: 100rpx; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.imgBox { |
|
|
|
text-align: center; |
|
|
|
width: 100%; |
|
|
|
margin-top: 60rpx; |
|
|
|
padding-bottom: 120rpx; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.img { |
|
|
|
display: inline-block; |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.m_l { |
|
|
|
margin-left: 180rpx; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.zfbtn { |
|
|
|
display: inline-block; |
|
|
|
width: 120rpx; |
|
|
|
@ -265,15 +284,15 @@ |
|
|
|
border: 0; |
|
|
|
padding: 0; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
button[class="zfbtn"]::after { |
|
|
|
border: 0; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
button[class="zfbtn m_l"]::after { |
|
|
|
border: 0; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.imagePathBox { |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
@ -285,7 +304,7 @@ |
|
|
|
bottom: 0; |
|
|
|
z-index: 10; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.shengcheng { |
|
|
|
width: 80%; |
|
|
|
height: 80%; |
|
|
|
@ -295,7 +314,7 @@ |
|
|
|
margin-left: -40%; |
|
|
|
z-index: 10; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.baocun { |
|
|
|
display: block; |
|
|
|
width: 80%; |
|
|
|
@ -311,7 +330,7 @@ |
|
|
|
font-size: 32rpx; |
|
|
|
border-radius: 44rpx; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
button[class="baocun"]::after { |
|
|
|
border: 0; |
|
|
|
} |
|
|
|
|
