// package/riskManagement/riskManagement.js
import * as echarts from '../components/ec-canvas/echarts';

function setOption(chart, data) {
  const option = {
    grid: {
      top: '5%',
      left: '3%',
      right: '4%',
      bottom: '3%',
      containLabel: true
    },
    xAxis: {
      type: 'category',
      data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
    },
    yAxis: {
      type: 'value'
    },
    series: [
      {
        data: data,
        type: 'line'
      }
    ]
  };
  chart.setOption(option);
}

Page({

  /**
   * 页面的初始数据
   */
  data: {
    ec: {
      // onInit: initChart,
      lazyLoad: true, // 将 lazyLoad 设为 true 后，需要手动初始化图表
    },
    isLoaded: false,
    list: [1, 2, 3, 4],
  },

  // 初始化图表
  initChart: function (data) {
    this.ecComponent.init((canvas, width, height, dpr) => {
      // 获取组件的 canvas、width、height 后的回调函数
      // 在这里初始化图表
      const chart = echarts.init(canvas, null, {
        width: width,
        height: height,
        devicePixelRatio: dpr // new
      });
      setOption(chart, data);

      // 将图表实例绑定到 this 上，可以在其他成员函数中访问
      this.chart = chart;

      this.setData({
        isLoaded: true,
      });

      // 注意这里一定要返回 chart 实例，否则会影响事件处理等
      return chart;
    });
  },

  toCalendar() {
    wx.navigateTo({
      url: '/package/riskManagement/riskCalendar/riskCalendar',
    })
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    // 请求数据
    setTimeout(() => {
      this.initChart([250, 300, 100, 147, 260, 123, 311])
    }, 1000)
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {
    this.ecComponent = this.selectComponent('#risk-trend-chart');
  },

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

  },

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

  },

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

  },

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

  },

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

  },

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

  }
})