You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
421 lines
12 KiB
421 lines
12 KiB
import {
|
|
getMomentDetail,
|
|
getCommentList,
|
|
likeMoment,
|
|
likeComment,
|
|
commentMoment
|
|
} from "../../../../pages/api/moment"
|
|
const util = require('../../../../utils/util')
|
|
const app = getApp()
|
|
// pages/moment/detail/index.js
|
|
Page({
|
|
/**
|
|
* 页面的初始数据
|
|
*/
|
|
data: {
|
|
id: null,
|
|
safeBottom: app.globalData.safeBottom,
|
|
height: app.globalData.safeFragmentHeight,
|
|
type: 0,
|
|
tabList: [{
|
|
id: 0,
|
|
name: '评论',
|
|
badge: 12
|
|
},
|
|
{
|
|
id: 1,
|
|
name: '系统',
|
|
badge: 0
|
|
}
|
|
],
|
|
tabIndex: 0,
|
|
inputBottom: 0,
|
|
keyboardHeight: 0,
|
|
focus: false,
|
|
comment: '',
|
|
momentDetail: null,
|
|
commentList: [],
|
|
requesting: false,
|
|
finished: false,
|
|
form: {
|
|
pageNum: 1,
|
|
pageSize: 15
|
|
},
|
|
maskHidden: false,
|
|
},
|
|
/**
|
|
* 生命周期函数--监听页面加载
|
|
*/
|
|
onLoad: function (options) {
|
|
this.data.keyboardHeight = wx.getStorageSync('keyboardHeight')
|
|
if (options.type) {
|
|
this.data.type = Number(options.type)
|
|
}
|
|
this.setData({
|
|
type: this.data.type,
|
|
safeBottom: app.globalData.safeBottom,
|
|
height: app.globalData.safeFragmentHeight - 100
|
|
})
|
|
if (options.id) {
|
|
this.data.id = options.id
|
|
this.data.form.articleId = options.id
|
|
wx.showLoading({
|
|
title: '加载中',
|
|
mask: true
|
|
})
|
|
getMomentDetail(options.id).then(result => {
|
|
this.setData({
|
|
momentDetail: result.data
|
|
})
|
|
this.fetchCommentList()
|
|
wx.hideLoading()
|
|
}).catch(err => {
|
|
wx.hideLoading()
|
|
util.showToast(err)
|
|
})
|
|
}
|
|
},
|
|
onRefreshList: function () {
|
|
if (this.data.requesting) {
|
|
return
|
|
}
|
|
this.setData({
|
|
commentList: [],
|
|
['form.pageNum']: 1,
|
|
finished: false
|
|
})
|
|
this.fetchCommentList()
|
|
},
|
|
fetchCommentList: function () {
|
|
if (this.data.requesting || this.data.finished) {
|
|
return
|
|
}
|
|
this.setData({
|
|
requesting: true
|
|
})
|
|
getCommentList(this.data.id, this.data.form).then(result => {
|
|
if (result.data.records.length) {
|
|
var respList = result.data.records
|
|
let nowList = `commentList[${this.data.commentList.length}]`
|
|
var num = this.data.form.pageNum
|
|
var finished = this.data.form.pageNum >= result.data.pages
|
|
if (num == 1) {
|
|
this.setData({
|
|
commentList: [],
|
|
[nowList]: respList,
|
|
requesting: false,
|
|
['form.pageNum']: (num + 1),
|
|
['momentDetail.replyQuantity']: result.data.total,
|
|
finished
|
|
})
|
|
} else {
|
|
this.setData({
|
|
[nowList]: respList,
|
|
requesting: false,
|
|
['form.pageNum']: (num + 1),
|
|
['momentDetail.replyQuantity']: result.data.total,
|
|
finished
|
|
})
|
|
}
|
|
} else {
|
|
this.setData({
|
|
requesting: false,
|
|
finished: true
|
|
})
|
|
}
|
|
}).catch(err => {
|
|
this.setData({
|
|
requesting: false
|
|
})
|
|
})
|
|
},
|
|
onTabChange: function (e) {
|
|
if (this.data.tabIndex == Number(e.detail.key)) {
|
|
return
|
|
}
|
|
this.data.tabIndex = Number(e.detail.key)
|
|
},
|
|
bindInput: function (e) {
|
|
this.data.comment = e.detail.value
|
|
},
|
|
inputFocus: function (e) {
|
|
if (this.data.keyboardHeight) {
|
|
return
|
|
}
|
|
this.data.keyboardHeight = Number(e.detail.height)
|
|
wx.setStorageSync('keyboardHeight', this.data.keyboardHeight)
|
|
this.setData({
|
|
inputBottom: e.detail.height
|
|
})
|
|
},
|
|
inputBlur: function (e) {
|
|
this.setData({
|
|
inputBottom: 0,
|
|
focus: false
|
|
})
|
|
},
|
|
showComment: function (e) {
|
|
if (!app.globalData.userInfo) {
|
|
wx.navigateTo({
|
|
url: '/pages/login/index'
|
|
})
|
|
return
|
|
}
|
|
if (this.data.keyboardHeight) {
|
|
this.setData({
|
|
focus: true,
|
|
inputBottom: this.data.keyboardHeight
|
|
})
|
|
} else {
|
|
this.setData({
|
|
focus: true
|
|
})
|
|
}
|
|
},
|
|
submitComment: function () {
|
|
if (util.isEmpty(this.data.comment)) {
|
|
util.showToast('请输入评论内容')
|
|
return
|
|
}
|
|
wx.showLoading({
|
|
title: '处理中',
|
|
mask: true
|
|
})
|
|
var form = {
|
|
content: this.data.comment,
|
|
articleId: this.data.id
|
|
}
|
|
commentMoment(form).then(result => {
|
|
this.setData({
|
|
inputBottom: 0,
|
|
focus: false,
|
|
comment: ''
|
|
})
|
|
wx.hideLoading()
|
|
util.showToast('评论成功')
|
|
this.onRefreshList()
|
|
}).catch(error => {
|
|
wx.hideLoading()
|
|
util.showToast(error)
|
|
})
|
|
},
|
|
postLikeComment: function (e) {
|
|
if (!app.globalData.userInfo) {
|
|
wx.navigateTo({
|
|
url: '/pages/login/index'
|
|
})
|
|
return
|
|
}
|
|
var item = this.data.commentList[e.currentTarget.dataset.page][e.currentTarget.dataset.index]
|
|
if (item.isLiked) {
|
|
util.showToast('请勿重复点赞')
|
|
return
|
|
}
|
|
likeComment({
|
|
replyId: item.id
|
|
}).then(result => {
|
|
if (item.isLiked) {
|
|
this.setData({
|
|
['commentList[' + e.currentTarget.dataset.page + '][' + e.currentTarget.dataset.index + '].likeQuantity']: result.data.likeQuantity,
|
|
['commentList[' + e.currentTarget.dataset.page + '][' + e.currentTarget.dataset.index + '].isLiked']: 0
|
|
})
|
|
} else {
|
|
this.setData({
|
|
['commentList[' + e.currentTarget.dataset.page + '][' + e.currentTarget.dataset.index + '].likeQuantity']: result.data.likeQuantity,
|
|
['commentList[' + e.currentTarget.dataset.page + '][' + e.currentTarget.dataset.index + '].isLiked']: 1
|
|
})
|
|
}
|
|
}).catch(error => {
|
|
util.showToast(error)
|
|
})
|
|
},
|
|
likePost: function () {
|
|
if (!app.globalData.userInfo) {
|
|
wx.navigateTo({
|
|
url: '/pages/login/index'
|
|
})
|
|
return
|
|
}
|
|
if (this.data.momentDetail.isLiked) {
|
|
util.showToast('请勿重复点赞')
|
|
return
|
|
}
|
|
likeMoment({
|
|
articleId: this.data.id
|
|
}).then(result => {
|
|
this.setData({
|
|
['momentDetail.likeQuantity']: result.data.likeQuantity,
|
|
['momentDetail.isLiked']: 1
|
|
})
|
|
}).catch(error => {
|
|
util.showToast(error)
|
|
})
|
|
},
|
|
toMill: function () {
|
|
util.navigateTo('/pages/agent/factory/index?id=' + this.data.momentDetail.millPaperId)
|
|
},
|
|
onShareAppMessage: function () {
|
|
var imageUrl = '/assets/image/icon_logo.png'
|
|
if (this.data.momentDetail.imgUrlList && this.data.momentDetail.imgUrlList.length > 0) {
|
|
imageUrl = this.data.momentDetail.imgUrlList[0]
|
|
}
|
|
return {
|
|
title: this.data.momentDetail.title,
|
|
path: 'pages/index/index?url=/pakageInfo/pages/article/detail/index&key=id&value=' + this.data.momentDetail.id,
|
|
imageUrl: this.data.imagePathHb||imageUrl
|
|
}
|
|
},
|
|
//分享至朋友圈
|
|
onShareTimeline(res) {
|
|
var imageUrl = '/assets/image/icon_logo.png'
|
|
if (this.data.momentDetail.imgUrlList && this.data.momentDetail.imgUrlList.length > 0) {
|
|
imageUrl = this.data.momentDetail.imgUrlList[0]
|
|
}
|
|
return {
|
|
title: this.data.momentDetail.title,
|
|
path: 'pages/index/index?url=/pakageInfo/pages/article/detail/index&key=id&value=' + this.data.momentDetail.id,
|
|
imageUrl: this.data.imagePathHb||imageUrl
|
|
}
|
|
},
|
|
createPoster() {
|
|
|
|
},
|
|
createNewImg() {
|
|
var that = this;
|
|
var context = wx.createCanvasContext('mycanvas');
|
|
context.font="normal 400 15px Arial, sans-serif"
|
|
// wx:if="{momentDetail.millPaperName}" src="/pakageInfo/assets/image/img_poster_header_has_title.png"
|
|
// <image wx:else src="/pakageInfo/assets/image/im_poster_header_no_title.png" style="width:100%;height:100%"></image>
|
|
var parth0='../../../assets/image/img_poster_bg.png'
|
|
if (this.data.momentDetail.millPaperName) {
|
|
var path1 = '../../../assets/image/img_poster_header_has_title.png'
|
|
} else {
|
|
var path1 = '../../../assets/image/im_poster_header_no_title.png'
|
|
}
|
|
context.fillStyle = "white"
|
|
context.fillRect(0, 0, 375, 667);
|
|
context.stroke()
|
|
context.drawImage(parth0, 0, 0, 375, 667);
|
|
context.stroke()
|
|
context.drawImage(path1, 0, 0, 375, 120);
|
|
context.stroke()
|
|
|
|
//绘制底部图片区域
|
|
var parth2='../../../assets/image/img_poster_footer.png'
|
|
context.drawImage(parth2, 0, 500, 375, 120);
|
|
context.stroke()
|
|
|
|
//绘制内容标题
|
|
context.setFontSize(18);
|
|
context.setFillStyle('#000000');
|
|
context.setTextAlign('center');
|
|
context.fillText(this.data.momentDetail.title, 187, 152);
|
|
context.stroke()
|
|
|
|
//绘制内容
|
|
var text = this.data.momentDetail.content
|
|
var chr = text.split(""); //这个方法是将一个字符串分割成字符串数组
|
|
var temp = "";
|
|
var row = [];
|
|
context.setFontSize(15)
|
|
context.setTextAlign('left');
|
|
context.setFillStyle("#000")
|
|
//内容自动换行
|
|
for (var a = 0; a < chr.length; a++) {
|
|
if (context.measureText(temp).width < 330) {
|
|
temp += chr[a];
|
|
} else {
|
|
a--; //这里添加了a-- 是为了防止字符丢失,效果图中有对比
|
|
row.push(temp);
|
|
temp = "";
|
|
}
|
|
}
|
|
row.push(temp);
|
|
if (row.length > 12) {
|
|
var rowCut = row.slice(0, 12);
|
|
var rowPart = rowCut[11];
|
|
var test = "";
|
|
var empty = [];
|
|
for (var a = 0; a < rowPart.length; a++) {
|
|
if (context.measureText(test).width < 330) {
|
|
test += rowPart[a];
|
|
}
|
|
else {
|
|
break;
|
|
}
|
|
}
|
|
empty.push(test);
|
|
var group = empty[0] + "..."//这里只显示两行,超出的用...表示
|
|
rowCut.splice(11, 1, group);
|
|
row = rowCut;
|
|
}
|
|
for (var b = 0; b < row.length; b++) {
|
|
context.fillText(row[b], 20, 185+ b * 30, 500);
|
|
}
|
|
|
|
//如果纸厂名字存在则在顶部图片区域中心绘制纸厂名称
|
|
//这里先把细体文字绘制完再绘制加粗的顶部纸厂名称,如果不在最后绘制则需要使用ctx.font = 'normal 400 15px Arial, sans-serif';重置一下大小
|
|
if(this.data.momentDetail.millPaperName){
|
|
// context.setFontSize(24);
|
|
context.font="normal bold 24px sans-serif"
|
|
context.setFillStyle('#3539F8');
|
|
context.setTextAlign('center');
|
|
context.fillText(this.data.momentDetail.millPaperName, 187, 55);
|
|
context.stroke()
|
|
}
|
|
|
|
|
|
context.save(); // 保存当前context的状态
|
|
context.draw();
|
|
//将生成好的图片保存到本地,需要延迟一会,绘制期间耗时
|
|
setTimeout(function () {
|
|
wx.canvasToTempFilePath({
|
|
canvasId: 'mycanvas',
|
|
success: function (res) {
|
|
var tempFilePath = res.tempFilePath;
|
|
that.setData({
|
|
imagePathHb: tempFilePath,
|
|
canvasHidden: true,
|
|
maskHidden: true,
|
|
});
|
|
},
|
|
fail: function (res) {
|
|
console.log(res);
|
|
}
|
|
});
|
|
}, 200);
|
|
|
|
},
|
|
//点击保存到相册
|
|
baocun: function () {
|
|
var that = this
|
|
wx.saveImageToPhotosAlbum({
|
|
filePath: that.data.imagePathHb,
|
|
success(res) {
|
|
wx.showModal({
|
|
content: '图片已保存到相册,赶紧晒一下吧~',
|
|
showCancel: false,
|
|
confirmText: '好的',
|
|
confirmColor: '#333',
|
|
success: function (res) {
|
|
if (res.confirm) {
|
|
console.log('用户点击确定');
|
|
/* 该隐藏的隐藏 */
|
|
that.setData({
|
|
maskHidden: false
|
|
})
|
|
}
|
|
},fail:function(res){
|
|
console.log(11111)
|
|
}
|
|
})
|
|
}
|
|
})
|
|
},
|
|
coloseHb() {
|
|
console.log(this.data)
|
|
this.setData({
|
|
maskHidden: false
|
|
})
|
|
}
|
|
})
|