// pages/attentiontwo/attentiontwo.js
const app=getApp()
Page({

  /**
   * 页面的初始数据
   */
  data: {
    maskHidden: false,
    id:'',
    description:'',
    qrcode:'',
    rings:'',
    title:""

  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.setData({
      id: options.id
    })

    this.getresult()
  },
  // 获取结果
  getresult() {
    let that = this;
    var url = 'index/answer_log_detail';
    var params = {
      answer_log_id: that.data.id,

    }
    app.post(url, params).then((res) => {
      console.log(res);
      that.setData({
        
        description: res.description,
        qrcode: res.qrcode,
        rings: res.rings,
        title:res.title
        
        
      })
      that.savefilecode()


    }).catch((err) => {

    })
  },

  createNewImg: function () {
    var that = this;
    console.log(9999)
    var context = wx.createCanvasContext('mycanvas');
    // var img = '/img/no.png';

    // context.createPattern(img, 0, 0, 375, 667)
    // context.style.background  ='/img/tuijianimg1.png'
    // context.setFillStyle("#ffe200");
    context.fillRect(0, 0, 375, 603);
    var path = "/img/attentionsix.png";
    context.drawImage(path, 0, 0, 375, 603);
    // context.drawImage(path, 0, 0, 680, 300);
    
    var path2 = that.data.qrcode;
    context.drawImage(path2, 10, 539, 55, 55);

    context.setFontSize(20);
    context.setFillStyle('#CE6198');
    context.setTextAlign('center');
    context.fillText(that.data.title, 185, 120);


    context.setFontSize(16);
    context.setFillStyle('#CE6198');
    context.setTextAlign('center');

    var str =that.data.description;
    var x = 145;
    var len = Math.ceil(str.length / 12);
    for (var i = 0; i < len; i++) {
      var j = i * 12;
      var strs = str.substring(j, 12 * (i + 1));
      context.fillText(strs, 180, x + 22 * i,900);
    }

    context.setFontSize(14);
    context.setFillStyle('#EA595D');
    context.setTextAlign('center');
    context.fillText(that.data.rings[1].sort_name +that.data.rings[1].percent, 114, 220);

    context.setFontSize(14);
    context.setFillStyle('#fff');
    context.setTextAlign('center');

    var str = that.data.rings[1].description;
    var x = 250;
    var len = Math.ceil(str.length / 5);
    for (var i = 0; i < len; i++) {
      var j = i * 5;
      var strs = str.substring(j, 5 * (i + 1));
      context.fillText(strs, 140, x + 22 * i, 2000);
    }

    context.setFontSize(14);
    context.setFillStyle('#CE6198');
    context.setTextAlign('center');
    context.fillText(that.data.rings[0].sort_name + that.data.rings[0].percent, 270, 233);



    context.setFontSize(14);
    context.setFillStyle('#fff');
    context.setTextAlign('center');

    var str = that.data.rings[0].description;
    var x = 265;
    var len = Math.ceil(str.length / 5);
    for (var i = 0; i < len; i++) {
      var j = i * 5;
      var strs = str.substring(j, 5 * (i + 1));
      context.fillText(strs, 245, x + 22 * i, 2000);
    }


    context.setFontSize(14);
    context.setFillStyle('#F49E15');
    context.setTextAlign('center');
    context.fillText(that.data.rings[4].sort_name + that.data.rings[4].percent, 90, 317);

    context.setFontSize(14);
    context.setFillStyle('#fff');
    context.setTextAlign('center');

    var str = that.data.rings[4].description;
    var x = 345;
    var len = Math.ceil(str.length / 5);
    for (var i = 0; i < len; i++) {
      var j = i * 5;
      var strs = str.substring(j, 5 * (i + 1));
      context.fillText(strs, 115, x + 22 * i, 2000);
    }

    context.setFontSize(14);
    context.setFillStyle('#A6639E');
    context.setTextAlign('center');
    context.fillText(that.data.rings[2].sort_name + that.data.rings[2].percent, 280, 397);

    context.setFontSize(12);
    context.setFillStyle('#fff');
    context.setTextAlign('center');

    var str = that.data.rings[2].description;
    var x = 342;
    var len = Math.ceil(str.length / 8);
    for (var i = 0; i < len; i++) {
      var j = i * 8;
      var strs = str.substring(j, 8 * (i + 1));
      context.fillText(strs, 288, x + 18 * i, 2000);
    }

    context.setFontSize(14);
    context.setFillStyle('#1BB4A5');
    context.setTextAlign('center');
    context.fillText(that.data.rings[5].sort_name + that.data.rings[5].percent, 110, 487);

    context.setFontSize(14);
    context.setFillStyle('#fff');
    context.setTextAlign('center');

    var str = that.data.rings[5].description;;
    var x = 420;
    var len = Math.ceil(str.length / 5);
    for (var i = 0; i < len; i++) {
      var j = i * 5;
      var strs = str.substring(j, 5 * (i + 1));
      context.fillText(strs, 140, x + 22 * i, 2000);
    }


    context.setFontSize(14);
    context.setFillStyle('#1A97D0');
    context.setTextAlign('center');
    context.fillText(that.data.rings[3].sort_name + that.data.rings[3].percent, 270, 504);
    
    context.setFontSize(14);
    context.setFillStyle('#fff');
    context.setTextAlign('center');

    var str = that.data.rings[3].description;;
    var x = 425;
    var len = Math.ceil(str.length / 5);
    for (var i = 0; i < len; i++) {
      var j = i * 5;
      var strs = str.substring(j, 5 * (i + 1));
      context.fillText(strs, 240, x + 22 * i, 2000);
    }





    // var path2 = that.data.codeurl;
    // console.log('888777666554433', path2)
    // var path3 = "/img/feihuiyuan.png";
    // var path4 = "/img/dali.png";
    // var path5 = "/img/tiyanactive.png";

    // this.drawCircular(context, 96, 96, this.data.imgwidth * 0.7, this.data.imgheight * 0.7, path2);

    context.save(); // 保存当前context的状态

    // context.setFontSize(20);
    // context.setFillStyle('#78482F');
    // context.setTextAlign('center');
    // let nickname = wx.getStorageSync("nickname");
    // console.log('889900', nickname)
    // context.fillText(nickname, 184, 45);

    // context.setFontSize(15);
    // context.setFillStyle('#78482F');
    // context.setTextAlign('center');
    // context.fillText('期待你的加入', 185, 75);

    // var path1 = that.data.saveimg;
    // console.log('头像', path1)

    // context.arc(76, 56, 35, 0, 2 * Math.PI) //画出圆
    // context.setFillStyle('#ffffff')
    // context.strokeStyle = "#ffe200";
    // context.clip(); //裁剪上面的圆形00
    // context.drawImage(path1, 41, 21, 70, 70); // 在刚刚裁剪的园上画图
    context.draw();



    //将生成好的图片保存到本地，需要延迟一会，绘制期间耗时
    setTimeout(function () {
      wx.canvasToTempFilePath({
        canvasId: 'mycanvas',
        success: function (res) {
          console.log(res)
          var tempFilePath = res.tempFilePath;
          console.log(tempFilePath)
          that.setData({
            imagePath: tempFilePath,
            canvasHidden: true
          });
        },
        fail: function (res) {
          console.log(res);
        }
      });
    }, 200);
  },


  drawCircular(ctx, width, height, x, y, url) {

    var avatarurl_width = width;
    var avatarurl_heigth = height;
    var avatarurl_x = x;
    var avatarurl_y = y;

    console.log(avatarurl_width);
    console.log(avatarurl_heigth);
    console.log(avatarurl_x);
    console.log(avatarurl_y);
    ctx.save();
    ctx.beginPath();
    ctx.arc(avatarurl_width / 2 + avatarurl_x, avatarurl_heigth / 2 + avatarurl_y, avatarurl_width / 2, 0, Math.PI * 2, false);
    ctx.clip();
    ctx.drawImage(url, avatarurl_x, avatarurl_y, avatarurl_width, avatarurl_heigth);
    ctx.restore();
  },

  //点击保存到相册
  baocun: function () {
    console.log(999)
    var that = this
    wx.getSetting({
      success(res) {
        if (!res.authSetting['scope.writePhotosAlbum']) {
          wx.authorize({
            scope: 'scope.writePhotosAlbum',
            success() { //这里是用户同意授权后的回调


              wx.saveImageToPhotosAlbum({
                filePath: that.data.imagePath,
                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) {

                    }
                  })
                }
              })



            },
            fail() { //这里是用户拒绝授权后的回调


              // wx.openSetting({
              //   success: function (data) {
              //     console.log(data)
              //     if (data.authSetting["scope.writePhotosAlbum"] === true) {
              //      console.log("是否授权成功")
              //     } else {
              //       applyApi.toast("授权失败");
              //     }
              //   }
              // })
              wx.showModal({
                title: '提示',
                content: '您取消授权，无法保存图片，点击确定打开权限',
                success(res) {
                  if (res.confirm) {
                    console.log('用户点击确定')
                    wx.openSetting({
                      success(res) {
                        console.log(res.authSetting)
                        // res.authSetting = {
                        //   "scope.userInfo": true,
                        //   "scope.userLocation": true
                        // }
                      }
                    })
                  } else if (res.cancel) {
                    console.log('用户点击取消')
                  }
                }
              })

            }
          })
        } else { //用户已经授权过了

          console.log(that.data.imagePath)
          wx.saveImageToPhotosAlbum({
            filePath: that.data.imagePath,
            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) {

                }
              })
            }
          })
        }
      }
    })

  },

  hideceng() {
    this.setData({
      maskHidden: false
    })
  },
  

  savephoto() {

    console.log(54683485)
    let that = this;
    this.setData({
      maskHidden: false
    });
    wx.showToast({
      title: '海报生成中',
      icon: 'loading',
      duration: 1000
    });
    setTimeout(function () {
      wx.hideToast()
      that.createNewImg();
      that.setData({
        maskHidden: true
      });
    }, 1000)

  },

  savefilecode() {
    let that = this;
    console.log(that.data.codeurl)
    wx.downloadFile({
      url: that.data.qrcode,
      header: {},
      success: function (res) {
        console.log('下载图片下载图片下载图片', res)
        var tempFilePath = res.tempFilePath
        //console.log('临时文件地址是：' + tempFilePath)
        wx.saveFile({
          tempFilePath: tempFilePath,
          success: function (res) {
            console.log(res)
            var saveFilePath = res.savedFilePath;
            that.setData({
              qrcode: res.savedFilePath
            })

            console.log('123456855555555', that.data.qrcode)

          }, //可以将saveFilePath写入到页面数据中
          fail: function (res) { },
          complete: function (res) {
            console.log('complete后的res数据：')
          },
        }) //,
      },
      // fail: function (res) {
      //   wx.showModal({
      //     title: '下载失败',
      //     content: '请联系管理员',
      //   })
      // },
      complete: function (res) { },
    })
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
      // wx.navigateTo({
      //   url: '/pages/homepage/homepage',
      // })
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {
    let that = this;

    return {
      title: '我的注意力分享', // 转发后 所显示的title
      // path: '/pages/home/buildtextdetail/buildtextdetail?buildid='+buildid+'&gettoken='+newtoken, // 相对的路径
      path: '/pages/attentiontwo/attentiontwo?id=' + that.data.id, //分娩笔记分享2

      success: (res) => { // 成功后要做的事情
        console.log(res)

      },
      fail: function (res) {
        // 分享失败
        console.log(res)
      }
    }
  }
})