<script>
import tkiQrcode from "@/components/tki-qrcode/tki-qrcode.vue";
import {
pathToBase64
} from '../../utils/base64.js';
export default {
data() {
return {
};
},
onLoad() {
},
methods: {
// 接收renderjs发回的数据
receiveRenderData(val) {
console.log(val);
uni.showLoading({
title: "生成中",
mask: true
});
this.base64 = val
let _this = this;
if (this.base64 != null) {
let base64 = this.base64;
const bitmap = new plus.nativeObj.Bitmap("test");
bitmap.loadBase64Data(base64, function() {
const url = "_doc/" + new Date().getTime() + ".png"; // url为时间戳命名方式
bitmap.save(url, {
overwrite: true, // 是否覆盖
// quality: 'quality' // 图片清晰度
}, (i) => {
uni.saveImageToPhotosAlbum({
filePath: url,
success: function() {
_this.frienType = false;
uni.hideLoading();
uni.showToast({
title: '图片保存成功',
icon: 'none'
})
bitmap.clear()
}
});
}, (e) => {
uni.hideLoading();
uni.showToast({
title: '图片保存失败',
icon: 'none'
})
bitmap.clear()
});
}, (e) => {
uni.hideLoading();
uni.showToast({
title: '图片保存失败',
icon: 'none'
})
bitmap.clear()
});
}
},
// 接收renderjs发回的数据
receiveRenderDatai(val) {
let _this = this;
uni.showLoading({
title: "生成中",
mask: true
});
var bitmap = new plus.nativeObj.Bitmap();
bitmap.loadBase64Data(val, function() {
bitmap.save("DCIM/a.jpg", {
overwrite: true
}, function(i) {
uni.hideLoading();
uni.share({
provider: "weixin",
scene: "WXSceneSession",
type: 2,
imageUrl: i.target,
success: function(res) {
console.log("========图片路径=======", i.target)
console.log("success:" + JSON.stringify(res));
_this.frienType = false;
},
fail: function(err) {
console.log("fail:" + JSON.stringify(err));
}
});
}, function(e) {
console.log('保存图片失败：' + JSON.stringify(e));
});
}, function(e) {
console.log('绘制图片失败：' + JSON.stringify(e));
});
},
// 接收renderjs发回的数据
receiveRenderDatai2(val) {
let _this = this;
uni.showLoading({
title: "生成中",
mask: true
});
var bitmap = new plus.nativeObj.Bitmap();
bitmap.loadBase64Data(val, function() {
bitmap.save("DCIM/a.jpg", {
overwrite: true
}, function(i) {
console.log(i.target, "target")
uni.hideLoading();
uni.share({
provider: "weixin",
scene: "WXSenceTimeline",
type: 2,
imageUrl: i.target,
success: function(res) {
console.log("success:" + JSON.stringify(res));
_this.frienType = false;
},
fail: function(err) {
console.log("fail:" + JSON.stringify(err));
}
});
}, function(e) {
console.log('保存图片失败：' + JSON.stringify(e));
});
}, function(e) {
console.log('绘制图片失败：' + JSON.stringify(e));
});
},
},
}
</script>
<script module="renderScript" lang="renderjs">
// 引入
import html2canvas from "html2canvas";
export default {
data() {
return {}
},
methods: {
// 发送数据到逻辑层
emitData(e, ownerVm) {
console.log("进入emitData")
const dom = document.getElementById('poster')
setTimeout(function() {
(window.html2canvas || html2canvas)(dom, {
width: dom.clientWidth, //dom 原始宽度
height: dom.clientHeight,
scrollY: 0, // html2canvas默认绘制视图内的页面，需要把scrollY，scrollX设置为0
scrollX: 0,
useCORS: true, //支持跨域，但好像没什么用
// allowTaint:true,
}).then((canvas) => {
console.log("进入canvas")
// 将生产的canvas转为base64图片3
let image = canvas.toDataURL("image/png");
ownerVm.callMethod('receiveRenderData', image);
}).catch(err => {
// do sth
console.log(err, "err")
});;
}, 3000);
},
// 发送数据到逻辑层
emitDatai(e, ownerVm) {
const dom = document.getElementById('poster')
html2canvas(dom, {
width: dom.clientWidth, //dom 原始宽度
height: dom.clientHeight,
scrollY: 0, // html2canvas默认绘制视图内的页面，需要把scrollY，scrollX设置为0
scrollX: 0,
useCORS: true, //支持跨域，但好像没什么用
}).then((canvas) => {
// 将生产的canvas转为base64图片3
let image = canvas.toDataURL('image/png');
ownerVm.callMethod('receiveRenderDatai', image);
});
},
// 发送数据到逻辑层
emitDatai2(e, ownerVm) {
const dom = document.getElementById('poster')
html2canvas(dom, {
width: dom.clientWidth, //dom 原始宽度
height: dom.clientHeight,
scrollY: 0, // html2canvas默认绘制视图内的页面，需要把scrollY，scrollX设置为0
scrollX: 0,
useCORS: true, //支持跨域，但好像没什么用
}).then((canvas) => {
// 将生产的canvas转为base64图片3
ownerVm.callMethod('receiveRenderDatai2', canvas.toDataURL('image/png'));
});
},
}
};
</script>