poster.js 4.84 KB
import Poster from '../../miniprogram_dist/poster/poster';
let app = getApp();
Page({
  data: {
    imageUrl: "", // 海报图片
    wxShareTitle: "", // 分享标题
    wxCodePath: "", // 微信二维码参数地址,分享链接公用
    wxCodeUrl: "", // 微信二维码图片地址
  },
  onShareAppMessage() {
    if (res.from === 'button') {
      // 来自页面内转发按钮
      console.log(res.target)
    }
    let title = this.data.wxShareTitle;
    let path = this.data.wxCodePath;
    let imageUrl = this.data.imageUrl;
    console.log("title:", title);
    console.log("path:", path);
    console.log("imageUrl:", imageUrl);
    return {
      title,
      path,
      imageUrl
    }
  },
  onLoad(options) {
    app.queryIndex().then((result) => {
      console.log("result:", result);
      wx.showLoading({
        title: '生成中',
      });
      this.initData();
    })
  },
  initData() {
    // 设置 分享链接,分享文案
    let nickname = app.globalData.userInfo && app.globalData.userInfo.nickname || "";
    let billCode = app.globalData.indexInfo.wishBillCode;
    let wxShareTitle = nickname + `正在参加丸美眼霜节心愿单活动,需要你的倾情相助!`;
    let wxCodePath = `/pages/coop/coop?billCode=${billCode}&s=share`
    this.setData({
      wxCodePath: wxCodePath,
      wxShareTitle: wxShareTitle
    })

    // 获取小程序码
    app.post({
      url: app.api.wxacodeGet,
      data: {
        path: encodeURIComponent(wxCodePath)
      }
    }).then((result) => {
      this.setData({
        wxCodeUrl: result
      })

      // 获取海报数据
      let posterData = this.getPosterConfig();
      // 绘制设置海报
      this.onCreatePoster(posterData);
    })

    // // 获取海报数据
    // let posterData = this.getPosterConfig();
    // // 绘制设置海报
    // this.onCreatePoster(posterData);

  },

  onPosterSuccess(e) {
    console.log("onPosterSuccess");
    wx.hideLoading();
    const {
      detail
    } = e;
    console.log("detail:", detail)
    this.setData({
      imageUrl: detail
    })
  },
  onPosterFail(err) {
    wx.hideLoading();
    console.error(err);
  },

  /**
   * 查看图片
   */
  onPreviewImage() {
    let imageUrl = this.data.imageUrl
    console.log("imageUrl:", imageUrl);
    wx.previewImage({
      current: imageUrl,
      urls: [imageUrl]
    })
  },
  /**
   * 保存图片到本地
   */
  saveImageToPhotosAlbum() {
    let _this = this;
    wx.saveImageToPhotosAlbum({
      filePath: _this.data.imageUrl,
      success(res) {
        wx.showToast({
          title: '海报保存成功',
          icon: 'success'
        });
      },
      fail(err) {
        wx.getSetting({
          success: (res) => {
            if (!res.authSetting['scope.writePhotosAlbum']) {
              // 未授权
              wx.showModal({
                title: '提示',
                content: '小程序请求访问相册权限',
                confirmText: '前往授权',
                success(res) {
                  if (res.confirm) {
                    wx.openSetting({
                      success(res) {}
                    })
                  } else if (res.cancel) {}
                }
              })
            }
          }
        })
      }
    })
  },

  /**
   * 异步生成海报
   */
  onCreatePoster(posterConfig) {
    console.log("posterConfig:", posterConfig);
    this.setData({
      posterConfig: posterConfig
    }, () => {
      Poster.create(true); // 入参:true为抹掉重新生成
    });
  },


  // 获取海报数据
  getPosterConfig() {
    // 合成图片需要的数据
    let {
      userInfo
    } = app.globalData;
    let codeUrl = this.data.wxCodeUrl;
    let posterData = {
      width: 700,
      height: 921,
      debug: false,
      blocks: [],
      images: [
        // 底图
        {
          width: 700,
          height: 921,
          x: 0,
          y: 0,
          url: '../../image/draw/draw-c1.png',
        },
        // // 头像
        // {
        //   width: 102,
        //   height: 102,
        //   x: 35,
        //   y: 700,
        //   url: userInfo.avatar,
        // },
        // 小程序码
        {
          width: 118,
          height: 118,
          x: 560,
          y: 780,
          url: codeUrl,
          zIndex: 14
        }
      ],
      lines: [],
      texts: [{
        x: 165,
        y: 810,
        width: 360,
        lineHeight: 32,
        fontSize: 26,
        lineNum: 3,
        baseLine: 'middle',
        text: `${userInfo.nickname}正在参加丸美眼霜节心愿单活动,需要你的倾情相助!`,
        color: '#666666',
        zIndex: 111
      }],
    }
    return posterData;
  },


  // 子组件事件
  evtcomp(evt) {
    let {
      name,
      data
    } = evt.detail;
    switch (name) {

      case "_evt_hide":
        break;

      default:
        break;
    }
  },
})