Skip to content

M
mallapp
Commit 92662469 authored by zhangjianguo's avatar zhangjianguo
Browse files
Options

1

parent 5ae19934
Show whitespace changes
Inline Side-by-side
Showing with 197 additions and 35 deletions
pages/order/after-sale/refunds.vue
View file @ 92662469
......@@ -206,7 +206,7 @@ export default {
uploadSuccessHandler(data, index, lists) {
console.log(JSON.parse(data));
let r = JSON.parse(data);
this.forms.VoucherList.push(r.data.url);
this.forms.VoucherList.push(r.data);
},
valChange(val){
this.forms.ReNumber = Number(val.value) ;
......
pages/share-qrcode/share-qrcode.vue
View file @ 92662469
<template>
<view class="qrcodeStyle" :style="{'height':contentHeight}">
<view style="width: 70%;margin-left: 15%;">
<image :src="qrcode.pic_url" style="width: 100%;" mode='widthFix'></image>
</view>
<u-top-tips ref="uTips"></u-top-tips>
<img :src="tempPic" mode="widthFix" style="width: 320px;margin-top: 20px;" />
<canvas
canvas-id="firstCanvas"
class="sty-box"
@error="canvasIdErrorCallback"
></canvas>
<view class="btn" :style="{background:mainColor}" @click="preservation">
<Text>保存图片分享赚钱</Text>
</view>
......@@ -17,12 +21,18 @@
contentHeight:0,
mainColor:'',
qrcode:'',
fenxqrcode:'',
UserInfo:'',
tempPic:'',
}
},created(){
this.contentHeight = this.$utils.calcContentHeight(-40)+'px';
this.mainColor = this.$uiConfig.mainColor;
this.secondary = this.$uiConfig.secondary;
this.UserInfo = uni.getStorageSync('mall_UserInfo') ?uni.getStorageSync('mall_UserInfo'):{}
console.log(this.UserInfo)
this.init()
},
mounted() {
......@@ -33,46 +43,179 @@
methods: {
init(){
uni.showNavigationBarLoading();
let h = this.apiheader();
this.request2(
{
url: '/api/AppletOrder/SetAppletOrderSendGoods',
data: that.forms
url: '/api/AppletUser/GetFenXiaoPoster',
data: {}
},
(res) => {
uni.hideNavigationBarLoading()
this.qrcode = res.data;
this.getWeiXinQRCode()
}
);
},
getWeiXinQRCode(){
uni.showNavigationBarLoading();
this.request2(
{
url: '/api/AppletUser/GetWeiXinQRCodeForApplet',
data: {
Path:'pages/index/index/pid='+this.UserInfo.UserId,
With:this.qrcode.QrCodeSize,
}
},
(res) => {
uni.hideNavigationBarLoading()
this.fenxqrcode = this.host2+res.data;
// this.fenxqrcode = 'https://mallApi.oytour.com'+res.data;
this.drawCtx();
}
);
},
drawCtx(){
uni.showLoading({
title: "正在生成海报",
});
let ctx = uni.createCanvasContext("firstCanvas", this);
let that = this;
uni.getImageInfo({
src: that.qrcode.PosterBgImg,
success: function (image) {
ctx.drawImage(image.path, 0, 0, 750, 1344);//绘制图
if(that.qrcode.IsShowHead==0){
that.drawTitle(ctx); //绘制文字
}
if(that.qrcode.IsShowNick==0){
uni.getImageInfo({//头像
src: that.UserInfo.Photo,
success: function (image) {
ctx.save(); // 先保存状态 已便于画完圆再用
ctx.beginPath(); //开始绘制
//先画个圆
ctx.arc(that.qrcode.HeadSize/2+that.qrcode.HeadPaddingLeft, that.qrcode.HeadSize/2+that.qrcode.HeadPaddingTop, that.qrcode.HeadSize/2, 0, Math.PI * 2, false);
ctx.clip();//画了圆 再剪切 原始画布中剪切任意形状和尺寸。一旦剪切了某个区域，则所有之后的绘图都会被限制在被剪切的区域内
ctx.drawImage(image.path, that.qrcode.HeadPaddingLeft, that.qrcode.HeadPaddingTop, that.qrcode.HeadSize, that.qrcode.HeadSize);//绘制头像
ctx.restore(); //恢复之前保存的绘图上下文 恢复之前保存的绘图上下午即状态 可以继续绘制
if(that.qrcode.IsShowQrCode==0){ //二维码
uni.getImageInfo({//头像
src: that.UserInfo.Photo,
success: function (image) {
ctx.drawImage(image.path, that.qrcode.QrCodePaddingLeft, that.qrcode.QrCodePaddingTop, that.qrcode.QrCodeSize, that.qrcode.QrCodeSize);//绘制头像
that.drawQrCode(ctx)
},
});
}
},
});
}else{
if(that.qrcode.IsShowQrCode==0){
uni.getImageInfo({//头像
src: that.UserInfo.Photo,
success: function (image) {
ctx.drawImage(image.path, that.qrcode.QrCodePaddingLeft, that.qrcode.QrCodePaddingTop, that.qrcode.QrCodeSize, that.qrcode.QrCodeSize);//绘制头像
that.drawQrCode(ctx)
},
});
}
}
},
});
},
drawTitle(ctx){
let that = this
let text = that.UserInfo.Name;
ctx.setFillStyle = that.qrcode.NickColor;
ctx.setFontSize(that.qrcode.NickSize)
ctx.fillText(text, that.qrcode.NickPaddingLeft, that.qrcode.NickPaddingTop);
ctx.restore();
},
drawQrCode(ctx) {
let that = this;
ctx.draw(false, () => {
uni.canvasToTempFilePath(
{
x: 0,
y: 0,
width: 750,
height: 1344,
destWidth: 750.0 ,
destHeight: 1344.0 ,
canvasId: "firstCanvas",
success: (res) => {
uni.hideLoading();
that.tempPic = res.tempFilePath;
},
fail(e) {
console.log(e);
},
},
that
);
});
},
preservation(){
console.log('保存')
uni.downloadFile({
url: this.qrcode.pic_url,
success: (res) =>{
if (res.statusCode === 200){
console.log(res)
uni.showLoading({
title: "正在生成海报",
});
let that = this;
uni.canvasToTempFilePath(
{
canvasId: "firstCanvas",
success: (res) => {
uni.hideLoading();
uni.showLoading({
title: "正在保存海报",
});
uni.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success: function() {
success: function () {
uni.showToast({
title: "保存成功",
icon: "none"
});
},
fail: function() {
uni.showToast({
fail: function (e) {
that.$refs.uTips.show({
title: "保存失败，请稍后重试",
icon: "none"
type: "error",
duration: "2300",
});
}
},
complete: function () {
uni.hideLoading();
},
});
}
}
})
},
fail: function (e) {
console.log(e);
that.$refs.uTips.show({
title: "生成失败，请稍后重试",
type: "error",
duration: "2300",
});
},
},
this
);
}
}
}
......@@ -81,16 +224,35 @@
<style>
.qrcodeStyle{
background: #f3f4f6;
display: flex;
flex-direction: column;
align-items: center;
}
.qrcodeStyle .btn{
width: 80%;
height: 50px;
border-radius: 25px;
color: #fff;
margin-left: 10%;
display: flex;
align-items: center;
justify-content: center;
margin-top: 20px;
}
.qrcodeStyle .imgbox{
width: 70%;
height: 515px;
margin-left: 15%;
position: relative;
background-repeat:no-repeat;
background-size: 100% 515px;
}
.qrcodeStyle .sty-box {
width: 750px;
height: 1344px;
position: absolute;
top: -1344px;
left: -750px;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment