const app = getApp();
import Wxml2Canvas from 'wxml2canvas';
import moment from 'moment'
import {
  getPublicImage
} from "../../../assets/js/middleGround/tool.js";
Page({

  /**
   * 页面的初始数据
   */
  data: {
    active: 0,
    topicIdOrRefCode: "applyCourseCertificate",
    tabList: [{
        label: '课程证书',
        key: 1,
        topicIdOrRefCode: 'applyCourseCertificate',
      },
      {
        label: '教材证书',
        key: 2,
        topicIdOrRefCode: 'applyTextbookCertificate',
      }
    ],
    list: [],
    //分页
    page: 1,
    limit: 6,
    pageTotalCount: 0,
    bottomLoading: false,
    isMoreData: false,
    // 返回顶部 
    isBackTop: false,
    setScrollValue: 0,
    skeletonLoding: true,
    visible: false,
    showIndex: false,
    closeBtn: false,
    deleteBtn: false,
    images: [],
    pubCertificateHide: false,
    contentData: {},
    rzzsImg: ''
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    console.log(options);
    this.getDataList(false);
  },

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

  },

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

  },

  tabBookClick(item) {
    let that = this;
    let info = this.data.tabList[item.detail.value]
    that.setData({
      skeletonLoding: true,
      active: item.detail.value,
      topicIdOrRefCode: info.topicIdOrRefCode,
      list: [],
      page: 1,
      bottomLoading: false,
      isMoreData: false,
    })
    that.getDataList(false);
  },
  getDataList(isReachBottom) {
    const data = {
      start: this.data.page * this.data.limit - this.data.limit,
      size: this.data.limit,
      topicIdOrRefCode: this.data.topicIdOrRefCode,
      appRefCode: app.config.appRefCode,
      filterList: [],
      sort: {
        type: 'Desc',
        field: 'CreateDate'
      }
    }
    app.MG.ugc.getTopicMessageList(data)
      .then((res) => {
        if (res.datas.length > 0) {
          res.datas.forEach((item) => {
            if (item.content) {
              item.productList = JSON.parse(item.content)
              item.productList.updateDate = moment(item.updateDate).format('YYYY年MM月')
              item.productList.userPicture = getPublicImage(item.productList.userPicture, '', '')
            }
          })
          let dataList = res.datas;
          //触底加载新数据并保留老数据
          if (isReachBottom) {
            dataList = [...this.data.list, ...dataList] //将新数据加入老数据中
          }
          this.setData({
            list: dataList,
            pageTotalCount: res.totalSize,
            bottomLoading: false,
            isMoreData: dataList.length > 0 ? false : true,
            skeletonLoding: false,
            loading: false
          })
        } else {
          this.setData({
            list: [],
            skeletonLoding: false,
            loading: false
          })
        }
      })
      .catch(() => {})
  },
  goBookDetails(e) {
    let productList = e.currentTarget.dataset.book.productList
    this.setData({
      contentData: productList,
      pubCertificateHide: true,
    })
    this.drawImage1()
  },
  drawImage1() {
    let that = this;
    let drawMyImage1 = new Wxml2Canvas({
      width: that.data.imageWidth,
      height: that.data.imageHeight,
      element: 'myCanvas1',
      progress(percent) {},
      finish(url) {
        wx.getFileSystemManager().readFile({
          filePath: url,
          encoding: 'base64',
          success: (res) => {
            let MyImageBase641 = 'data:image/jpg;base64,' + res.data
            if (MyImageBase641) {
              that.setData({
                rzzsImg: MyImageBase641,
              })
            }
            setTimeout(() => {
              that.setData({
                pubCertificateHide: false,
                images: [that.data.rzzsImg],
                showIndex: true,
                visible: true,
              })
            }, 1000)
          },
        })
      },
      error(res) {
        console.log("生成的图片失败", res)
      }
    }, this);
    let data = {
      list: [{
        type: 'wxml',
        class: '.my_canvas1 .my_draw_canvas1', //.my_draw_canvas每个要绘制元素的类名
        limit: '.my_canvas1', //my_canvas根元素类名
        x: 0,
        y: 0
      }]
    }
    drawMyImage1.draw(data, that);
  },

  onClose(e) {
    const {
      trigger
    } = e.detail;
    this.setData({
      visible: false,
      images: [],
    });
  },
  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {
    if (this._freshing) return
    this.setData({
      // list: [],
      page: 1,
      limit: 6,
      pageTotalCount: 0,
      bottomLoading: false,
      isMoreData: false
    })
    this._freshing = true;
    this.setData({
      triggered: false,
    })
    this.getDataList(false);
    this._freshing = false
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {
    this.setData({
      bottomLoading: true,
      isMoreData: false
    })
    let bool = false;
    if (this.data.pageTotalCount > this.data.list.length) {
      bool = true;
      this.setData({
        page: this.data.page + 1,
      })
    } else {
      setTimeout(() => {
        this.setData({
          bottomLoading: false,
          isMoreData: true
        })
      }, 100)
      return false;
    }
    this.getDataList(bool);
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})