275 lines
7.2 KiB
JavaScript
275 lines
7.2 KiB
JavaScript
/*
|
|
* 手太欠
|
|
* 愿这世界都如故事里一样 美好而动人~
|
|
*/
|
|
|
|
Page({
|
|
|
|
/**
|
|
* 页面的初始数据
|
|
*/
|
|
data: {
|
|
base : '', //时间
|
|
calendar: [], //日历
|
|
userInfo: '', //用户名
|
|
userHead: '', //用户名头像
|
|
userCode: '', //二维码
|
|
qrcode : '', //小程序码
|
|
waterText: '', //获得水滴数
|
|
posterState: false //海报弹出
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面加载
|
|
*/
|
|
onLoad(options) {
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面显示
|
|
*/
|
|
onShow() {
|
|
// 获取日历信息
|
|
this.signInfo();
|
|
|
|
// 获取打卡背景
|
|
this.posterInfo();
|
|
|
|
// 获取小程序码
|
|
this.ShareInfo();
|
|
},
|
|
|
|
/**
|
|
* 小程序码
|
|
*/
|
|
ShareInfo() {
|
|
wx.$api.user.miniShare({
|
|
url: '/pages/login/index'
|
|
}).then(res => {
|
|
this.setData({
|
|
qrcode: res.data.qrcode
|
|
})
|
|
}).catch(err => {})
|
|
},
|
|
|
|
/**
|
|
* 打卡背景
|
|
*/
|
|
posterInfo() {
|
|
wx.$api.index.poster().then(res => {
|
|
this.setData({
|
|
userInfo: res.data
|
|
})
|
|
}).catch(err => {})
|
|
},
|
|
|
|
/**
|
|
* 日历信息
|
|
*/
|
|
signInfo (){
|
|
wx.$api.index.calendar().then(res => {
|
|
this.setData({
|
|
base : res.data.base,
|
|
calendar: res.data.calendar
|
|
})
|
|
}).catch(err => {})
|
|
},
|
|
|
|
/**
|
|
* 用户签到
|
|
*/
|
|
signClick (){
|
|
wx.$api.index.sign().then(res => {
|
|
this.setData({
|
|
waterText: res.data,
|
|
posterState: true
|
|
})
|
|
// 获取日历信息
|
|
this.signInfo();
|
|
// 获取打卡背景
|
|
this.posterInfo();
|
|
}).catch(err => {})
|
|
},
|
|
|
|
/**
|
|
* 用户补签
|
|
*/
|
|
replenishClick (val){
|
|
wx.$api.index.replenish({date:val.currentTarget.dataset.today}).then(res => {
|
|
wx.showToast({
|
|
title: '补签成功',
|
|
icon: "none"
|
|
})
|
|
setTimeout(()=>{
|
|
this.setData({
|
|
waterText: res.data,
|
|
posterState: true
|
|
})
|
|
// 获取日历信息
|
|
this.signInfo();
|
|
// 获取打卡背景
|
|
this.posterInfo();
|
|
},3000)
|
|
}).catch(err => {})
|
|
},
|
|
|
|
/**
|
|
* 海报样式 保存图片到本地
|
|
*/
|
|
saveImg(){
|
|
this.dowImg();
|
|
this.setData({
|
|
posterState: false
|
|
})
|
|
},
|
|
|
|
/**
|
|
* 海报样式
|
|
*/
|
|
dowImg(){
|
|
wx.showLoading({
|
|
title: '生成中',
|
|
mask : true
|
|
})
|
|
|
|
// 下载背景
|
|
let downImg = new Promise(success=>{
|
|
wx.getImageInfo({
|
|
src : this.data.userInfo.banner.cover,
|
|
success : res => {
|
|
success(res.path)
|
|
}
|
|
})
|
|
})
|
|
|
|
// 下载头像
|
|
let codeImg = new Promise(success=>{
|
|
wx.getImageInfo({
|
|
src : this.data.userInfo.user.avatar,
|
|
success : res => {
|
|
success(res.path)
|
|
}
|
|
})
|
|
})
|
|
|
|
// 下载小程序码
|
|
let qrcodeImg = new Promise(success=>{
|
|
wx.getImageInfo({
|
|
src : this.data.qrcode,
|
|
success : res => {
|
|
success(res.path)
|
|
}
|
|
})
|
|
})
|
|
|
|
Promise.all([downImg, codeImg, qrcodeImg]).then(res => {
|
|
// 绘制海报
|
|
const ctx = wx.createCanvasContext('qrcodeCard')
|
|
ctx.save()
|
|
|
|
// 白色底
|
|
ctx.setFillStyle('#ffffff')
|
|
ctx.fillRect(0, 0, 340, 600)
|
|
|
|
// 绘制打卡背景
|
|
ctx.drawImage(res[0], 0, 0, 340, 450)
|
|
|
|
// 头像
|
|
ctx.drawImage(res[1], 20, 20, 60, 60)
|
|
|
|
// 日期
|
|
ctx.setFontSize(24)
|
|
ctx.setFillStyle("#ffffff")
|
|
ctx.fillText(this.data.userInfo.time.day, 280, 48 , 150)
|
|
|
|
// 月份
|
|
ctx.setFontSize(16)
|
|
ctx.setFillStyle("#ffffff")
|
|
ctx.fillText(this.data.userInfo.time.yearMonth, 260, 70 , 150)
|
|
|
|
// 时间
|
|
ctx.setFontSize(28)
|
|
ctx.setFillStyle("#ffffff")
|
|
ctx.fillText(this.data.userInfo.time.time, 20, 430 , 150)
|
|
|
|
// 农历
|
|
ctx.setFontSize(18)
|
|
ctx.setFillStyle("#ffffff")
|
|
ctx.setTextAlign('left')
|
|
ctx.fillText(this.data.userInfo.time.lunar, 210, 425 , 380)
|
|
|
|
// 用户名
|
|
ctx.setFontSize(20)
|
|
ctx.setFillStyle("#000000")
|
|
ctx.fillText(this.data.userInfo.user.nickname, 20, 490 , 340)
|
|
|
|
// 打卡天数
|
|
ctx.setFontSize(13)
|
|
ctx.setFillStyle("#000000")
|
|
ctx.fillText(this.data.waterText, 20, 515 , 340)
|
|
|
|
// 上善若水
|
|
ctx.setFontSize(16)
|
|
ctx.setFillStyle("#ba9963")
|
|
ctx.fillText("上善若水", 20, 555 , 340)
|
|
|
|
// 利万物而不争
|
|
ctx.setFontSize(16)
|
|
ctx.setFillStyle("#ba9963")
|
|
ctx.fillText("利万物而不争", 20, 580 , 340)
|
|
|
|
// 二维码
|
|
ctx.drawImage(res[2], 215, 465, 110, 110)
|
|
|
|
// 保存图片
|
|
ctx.draw(true, () => {
|
|
wx.hideLoading()
|
|
wx.canvasToTempFilePath({
|
|
canvasId: 'qrcodeCard',
|
|
x: 0,
|
|
y: 0,
|
|
success: res => {
|
|
wx.saveImageToPhotosAlbum({
|
|
filePath: res.tempFilePath,
|
|
success : res=>{
|
|
wx.showToast({
|
|
title: '分享海报已保存至相册',
|
|
icon : 'none'
|
|
})
|
|
},
|
|
fail : err=>{
|
|
wx.showModal({
|
|
title : '提示',
|
|
content : '暂未授权小程序写入您的相册，无法存储二维码海报',
|
|
confirmColor: '#d82526',
|
|
confirmText : '去设置',
|
|
success : info=>{
|
|
if (info.confirm){
|
|
wx.openSetting()
|
|
}
|
|
}
|
|
})
|
|
},
|
|
complete: e => {}
|
|
})
|
|
}
|
|
})
|
|
})
|
|
|
|
}).catch(err=>{
|
|
wx.showToast({
|
|
title: '海报下载，请检查网络',
|
|
icon : 'none'
|
|
})
|
|
})
|
|
},
|
|
|
|
/**
|
|
* 关闭海报
|
|
*/
|
|
posterHide() {
|
|
this.setData({
|
|
posterState: false
|
|
})
|
|
}
|
|
}) |