challengeFamily/components/poster/poster.js

const util = require("../../utils/util.js")
Page({
  data: {
    options:{},
    painting:{},
    info:{},
    childComment:'',
    contentTop:390,
  },
  onLoad: function (options) {
    console.log(options)
    if (options) {
      this.setData({options})
      this.getPosterInfo();
    }
  },
  onReady: function () {

  },
  onShow: function () {

  },
// 保存图片
save(){
  let that =this,view=[],comment=that.data.info.comment,topSize=470;
  if (comment.length>=0 && comment.length<=150) {
    topSize = 630;
  } else if(comment.length>150 && comment.length<=250) {
    topSize = 530;
  }
  let pic_w_h=that.data.info.picWidthHeight || that.data.options.picWidthHeight;
  let width=pic_w_h.split('*')[0],
  height=pic_w_h.split('*')[1],
  proportion=0,picWidth=0,picHeight=0,poLeft=0,namepoLeft=0;
  if (width>height) {
    picWidth=550
    proportion=width/picWidth;
    picHeight=height/proportion
    if (picHeight>312) {
      picHeight=312;
      proportion=height/picHeight;
      picWidth=width/proportion
    }
  } else {
    picHeight=312;
    proportion=height/picHeight;
    picWidth=width/proportion;
    if (picWidth>550) {
      picWidth=550
      proportion=width/picWidth;
      picHeight=height/proportion
    }
  }
  poLeft=(750-picWidth)/2;
  namepoLeft=poLeft+picWidth-200;
  wx.reportAnalytics('save_pic', {
    aid: that.data.options.aid,
    title: that.data.options.atitle,
  });
  wx.showLoading({ title: '海报生成中'});
  view.push({
    type: 'image',
    url: 'https://img.bbztx.com/image_test/upload/thumbs/20210510/logo/1620636487933054816.png',
    top: 0,
    left: 0,
    width: 750,
    height: 1987
  },{
    type: 'rect',
    content: '',
    top: 98,
    left: 100,
    width: 550,
    height: picHeight,
    background:'#fcebe8',
    transform: 'rotate(-5deg)'
  },{
    type: 'image',
    url: that.data.info.pic || that.data.options.pic,
    top: 98,
    left: poLeft,//100
    width: picWidth,//550
    height: picHeight//312
  },{
    type: 'image',
    url: that.data.info.logo,
    top: 1264,
    left: 100,
    width: 550,
    height: 283,
    arcType: "arc",
    borderRadius:10
  },{
    type: 'image',
    url: that.data.info.bbztxCommentQrcode,
    top: 1730,
    left: 129,
    width: 188,
    height: 188,
    backgroundColor:'#fff',
  },{
    type: 'image',
    url: '/images/nameBox.png',
    top: picHeight+98-20,//380
    left: namepoLeft,
    width: 200,
    height: 40,
  },{
    type: 'text',
    display:'block',
    content: that.data.options.ChildName.length>4?that.data.options.ChildName.substr(0,4)+'...':that.data.options.ChildName,
    top: picHeight+98-20+7,
    left: that.data.options.ChildName.length>2?(that.data.options.ChildName.length>3?namepoLeft+40:namepoLeft+60):namepoLeft+70,
    fontSize: 28,
    fontWeight:700,
    width: 162,
    height: 40,
    lineHeight:40,
    color:'#fff'
  },{
    type: 'text',
    content: '      '+comment,
    top: topSize,
    left: 100,
    width: 550,
    fontSize: 24,
    color:'#3c3b3b',
    textAlign: 'justify',
    breakWord:true,
    lineHeight: 43,
    MaxLineNumber:14,
  },
  {
    type: 'text',
    content: that.data.info.tag.length>27?(that.data.info.tag.substring(0,27)+'...'):that.data.info.tag,
    top: 1575,
    left: 100,
    width: 550,
    textAlign:'left',
    fontSize: 22,
    color:'#eb3c47'
  },{
    type: 'text',
    content: '活动费',
    top: 1625,
    left: 100,
    fontSize: 22,
    color:'#3c3b3b'
  },{
    type: 'text',
    content: that.data.info.price,
    top: 1625,
    left: 162,
    fontSize: 24,
    color:'#3c3b3b'
  })
  if (that.data.info.psAttendCount>10) {
    view.push({
      type: 'text',
      content: that.data.info.count,
      top: 1625,
      left: 527,
      fontSize: 22,
      color:'#8e8d8d'
    })
  }
  this.setData({
    painting: {
      width: 750,
      height: 1987,
      clear: true,
      views: view
    }
  });
},
// cavans画图
eventGetImage(e){
  const { tempFilePath, errMsg } = e.detail;
  if (errMsg === 'canvasdrawer:ok') {
    wx.saveImageToPhotosAlbum({
      filePath: tempFilePath,
      success(res) {
        wx.showToast({
          title: '保存图片成功',
          icon: 'success',
          duration: 2000
        })
      },
      fail(res){
        console.log('fail',res)
      }
    });
    wx.hideLoading();
  }
},
// 判定内容高度
contentTop(data){
  let topSize=380;
  if (data.length>=0 && data.length<=150) {
    topSize = 520;
  } else if(data.length>150 && data.length<=230) {
    topSize = 470;
  }
  return topSize;
},
// 海报查询
getPosterInfo(){
  let that = this,data=this.data.options;
  util.ajax({
    func: "user/childcomment/poster/article",
    data:{
      id:data.id,
      commentType:0
    }
  }, function (res) {
    if (res.code == 0) {
      res.data.price='￥'+res.data.price;
      res.data.count='已售'+res.data.psAttendCount+'人';
      res.data.nickname='—— '+res.data.nickname;
      let data=[]
      res.data.tags.forEach(el => {
        data.push(el.tagValue)
      });
      res.data.tag=data.join('|');
      that.setData({
        info:res.data,
        childComment:res.data.comment,
        contentTop:that.contentTop(res.data.comment)
      })
      if (res.data.bbztxCommentQrcode=='') {
        that.getQrcode(res.data.aid)
      }
      if ((util.isEmpty(that.data.options.picWidthHeight) || util.isEmpty(that.data.options.pic))) {
        wx.showModal({
          content: '活动图片获取失败，请联系宝大大处理。',
          showCancel:false,
          success (res) {}
        })
      }
    } else
      util.showTips(res.reason);
  });
},
// 第一次生成二维码、
getQrcode(aid){
  let that = this,data=this.data.options;
  util.ajax({
    func: "user/qrcode/childComment/article",
    data:{
      aid:aid,
      commentType:0
    }
  }, function (res) {
    if (res.code == 0) {
      let data=that.data.info;
      if (res.data.url) {
        data.bbztxCommentQrcode=res.data.url;
        that.setData({info:data})
      }
    } else
      util.showTips(res.reason);
  });
}
})