|
|
@@ -5,20 +5,7 @@
|
|
|
:foreground="foreground" :pdground="pdground" :icon="icon" :iconSize="iconSize" :lv="lv" :onval="onval" :showLoading="showLoading"
|
|
|
:loadMake="loadMake" :usingComponents="usingComponents" @result="qrR" />
|
|
|
</view>
|
|
|
- <!-- <view class="qrcode-wrapper">
|
|
|
- <image class="qrcode-save__image" :src="shareQrcodeUrl" mode="aspectFit"></image>
|
|
|
- <view class="qrcode-save__btn">
|
|
|
-
|
|
|
- </view>
|
|
|
- </view> -->
|
|
|
- <!-- <canvas :style="{ width: canvasW + 'px', height: canvasH + 'px',}" canvas-id="myCanvas" id="myCanvas"></canvas> -->
|
|
|
<canvas :style="{ width: '600rpx', height: '1066rpx',}" canvas-id="myCanvas" id="myCanvas" class="hb"></canvas>
|
|
|
- <!-- <view class="" v-if="fina">
|
|
|
- <button text="保存图片" @click="saveShareQrcode">保存图片</button>
|
|
|
- </view>
|
|
|
- <view class="" v-if="fina">
|
|
|
- <button text="保存图片" @click="saveShareQrcode">分享链接</button>
|
|
|
- </view> -->
|
|
|
<view class="btm-btn" v-if="fina">
|
|
|
<view class="btn" @click="comfirm">
|
|
|
<image src="../../static/icon/fzlj.png" mode=""></image>
|
|
|
@@ -95,7 +82,12 @@
|
|
|
});
|
|
|
});
|
|
|
} else {
|
|
|
+ // #ifdef APP-PLUS
|
|
|
this.val = 'http://hgd.liuniu946.com/appdom/index.html?spread=' + this.userInfo.uid
|
|
|
+ // #endif
|
|
|
+ // #ifdef H5
|
|
|
+ this.val = 'http://hgd.liuniu946.com/index/#/pages/index/index?spread=' + this.userInfo.uid
|
|
|
+ // #endif
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
@@ -162,7 +154,12 @@
|
|
|
this.ratio = this.SystemInfo.windowWidth / 750;
|
|
|
this.canvasW = 600 * this.ratio;
|
|
|
this.canvasH = 1066 * this.ratio;
|
|
|
+ // #ifdef APP-PLUS
|
|
|
this.ewmW = 350 * this.ratio;
|
|
|
+ // #endif
|
|
|
+ // #ifdef H5
|
|
|
+ this.ewmW = 250 * this.ratio;
|
|
|
+ // #endif
|
|
|
console.log(this.canvasH, 'this.canvasH')
|
|
|
// this.canvasH = this.goodsImg.height + this.ewmW + 200; // 画布高度 = 主图高度+二维码高度 + 文字图片的间距（大概50）
|
|
|
|
|
|
@@ -185,58 +182,19 @@
|
|
|
// 绘制商品主图，二维码
|
|
|
ctx.drawImage(this.goodsImg.path, 0, 0, this.canvasW, this
|
|
|
.canvasH) // drawImage(图片路径,x,y,绘制图像的宽度，绘制图像的高度)
|
|
|
- ctx.drawImage(this.ewmImg.path, (this.canvasW / 2 - this.ewmW / 2),this.canvasH - 85*this.ratio - this.ewmW,
|
|
|
- this.ewmW, this.ewmW) // drawImage(图片路径,x,y,绘制图像的宽度，绘制图像的高度,二维码的宽,高)
|
|
|
+ // #ifdef APP-PLUS
|
|
|
+ ctx.drawImage(this.ewmImg.path, (this.canvasW / 2 - this.ewmW / 2),this.canvasH - 85*this.ratio - this.ewmW,
|
|
|
+ this.ewmW, this.ewmW) // drawImage(图片路径,x,y,绘制图像的宽度，绘制图像的高度,二维码的宽,高)
|
|
|
+ // #endif
|
|
|
+ // #ifdef H5
|
|
|
+ ctx.drawImage(this.ewmImg.path, (this.canvasW / 2 - this.ewmW / 2),this.canvasH - 85*this.ratio - this.ewmW,
|
|
|
+ this.ewmW, this.ewmW) // drawImage(图片路径,x,y,绘制图像的宽度，绘制图像的高度,二维码的宽,高)
|
|
|
+ // #endif
|
|
|
+
|
|
|
|
|
|
// 3、绘制商品标题，多余文字自动换行
|
|
|
ctx.setFontSize(16); // setFontSize() 设置字体字号
|
|
|
ctx.setFillStyle('#333'); // setFillStyle() 设置字体颜色
|
|
|
-
|
|
|
- /* str 这段代码是我百度找的，参考别人的。canvas不能自动换行，需要自行计算 */
|
|
|
- // let _strlineW = 0;
|
|
|
- // let _strLastIndex = 0; //每次开始截取的字符串的索引
|
|
|
- // let _strHeight = this.canvasW +20; //绘制字体距离canvas顶部的初始高度
|
|
|
- // let _num = 1;
|
|
|
- // for (let i = 0; i < this.title.length; i++) {
|
|
|
- // _strlineW += ctx.measureText(this.title[i]).width;
|
|
|
- // if (_strlineW > this.canvasW-155) {
|
|
|
- // if(_num == 2 && 2){
|
|
|
- // //文字换行数量大于二进行省略号处理
|
|
|
- // ctx.fillText(this.title.substring(_strLastIndex, i-5)+'...', 40, _strHeight);
|
|
|
- // _strlineW = 0;
|
|
|
- // _strLastIndex = i;
|
|
|
- // _num++;
|
|
|
- // break;
|
|
|
- // }else{
|
|
|
- // ctx.fillText(this.title.substring(_strLastIndex, i), 40, _strHeight);
|
|
|
- // _strlineW = 0;
|
|
|
- // _strHeight += 20;
|
|
|
- // _strLastIndex = i;
|
|
|
- // _num++;
|
|
|
- // }
|
|
|
- // }else if (i == this.title.length - 1) {
|
|
|
- // ctx.fillText(this.title.substring(_strLastIndex, i + 1), 40, _strHeight);
|
|
|
- // _strlineW = 0;
|
|
|
- // }
|
|
|
- // }
|
|
|
- /* end */
|
|
|
-
|
|
|
- // ctx.setFontSize(16) // 字号
|
|
|
- // ctx.setFillStyle('#e31d1a') // 颜色
|
|
|
- // ctx.fillText('￥'+this.price, 10, this.canvasW +75); // （文字，x，y）
|
|
|
- // ctx.setFontSize(12)
|
|
|
- // ctx.setFillStyle('#b8b8b8')
|
|
|
- // ctx.fillText('原价￥'+this.Oldprice, 100, this.canvasW +75);
|
|
|
-
|
|
|
-
|
|
|
- // 邀请信息
|
|
|
- // ctx.setFontSize(16)
|
|
|
- // ctx.setFillStyle('#333')
|
|
|
- // ctx.fillText('长按二维码立即预约', this.ewmW + 40, this.canvasW +100);
|
|
|
-
|
|
|
- // ctx.setFontSize(16)
|
|
|
- // ctx.setFillStyle('#333')
|
|
|
- // ctx.fillText('分享自小程序', this.ewmW + 40, this.canvasW +120);
|
|
|
ctx.draw(false, (ret) => { // draw方法 把以上内容画到 canvas 中。
|
|
|
console.log(ret)
|
|
|
uni.showToast({
|
