91 lines
2.1 KiB
Vue
91 lines
2.1 KiB
Vue
<template>
|
|
<div class="p-result">
|
|
<div class="title">{{result.title}}</div>
|
|
<div class="desc">{{result.desc}}</div>
|
|
<div @click="saveImg">点击生成图片</div>
|
|
<painter :palette="template" @imgOK="onImgOk" />
|
|
<button data-id="shareBtn" open-type="share">点击分享</button>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
result: {},
|
|
template: {
|
|
background: '#eee',
|
|
width: '654rpx',
|
|
height: '400rpx',
|
|
borderRadius: '20rpx',
|
|
views: [
|
|
{
|
|
type: 'image',
|
|
url:
|
|
'https://qhyxpicoss.kujiale.com/r/2017/12/04/L3D123I45VHNYULVSAEYCV3P3X6888_3200x2400.jpg@!70q',
|
|
css: {
|
|
top: '48rpx',
|
|
right: '48rpx',
|
|
width: '192rpx',
|
|
height: '192rpx'
|
|
}
|
|
},
|
|
{
|
|
type: 'text',
|
|
text: 'borderWidth',
|
|
css: {
|
|
bottom: '40rpx',
|
|
right: '200rpx',
|
|
color: 'green',
|
|
borderWidth: '2rpx'
|
|
}
|
|
}
|
|
],
|
|
imgPath: ''
|
|
}
|
|
}
|
|
},
|
|
onShow() {
|
|
const result = wx.getStorageSync('tempResult')
|
|
this.result = result
|
|
},
|
|
onShareAppMessage(res) {
|
|
if (res.from === 'button') {
|
|
// 来自页面内转发按钮
|
|
console.log(res.target)
|
|
}
|
|
return {
|
|
title: '自定义转发标题',
|
|
path: '/page/user?id=123'
|
|
}
|
|
},
|
|
methods: {
|
|
onImgOk(e) {
|
|
// console.log(e.details.path)
|
|
console.log(e.mp.detail.path)
|
|
this.imgPath = e.mp.detail.path
|
|
},
|
|
saveImg() {
|
|
wx.saveImageToPhotosAlbum({
|
|
filePath: this.imgPath,
|
|
success: function() {
|
|
console.log('成功保存')
|
|
wx.showToast({
|
|
title: '保存成功', //提示的内容,
|
|
icon: 'success', //图标,
|
|
duration: 2000, //延迟时间,
|
|
mask: true //显示透明蒙层,防止触摸穿透,
|
|
})
|
|
},
|
|
fail: function(err) {
|
|
console.log(err)
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
</style>
|