lichebao/pages/storeData/wechatData/index.js

import _ from '../../../commons/js/commons';
import popularData from '../../../commons/js/lib/popularData';
import * as echarts from '../../../ecCanvas/components/ec-canvas/echarts';
const app = getApp()

let Bar1ChartData;
let Bar2ChartData;
function Bar1Chart(canvas, width, height, dpr) {
  const chart = echarts.init(canvas, null, {
    width: width,
    height: height,
    devicePixelRatio: dpr // new
  });
  canvas.setChart(chart);
  let option = Bar1ChartData
  chart.setOption(option);
  chart.on('click',function(e){
    console.log(e)
  });
  return chart;
}
function Bar2Chart(canvas, width, height, dpr) {
  const chart = echarts.init(canvas, null, {
    width: width,
    height: height,
    devicePixelRatio: dpr // new
  });
  canvas.setChart(chart);
  let option = Bar2ChartData
  chart.setOption(option);
  chart.on('click',function(e){
    console.log(e)
  });
  return chart;
}

Page({
  data: {
    imgUrl: _.config.imgUrl,//静态图片路径
    showBar1Chart:false,//是否显示Bar图表
    ecBar1:{},
    showBar2Chart:false,//是否显示Bar图表
    ecBar2:{},
  },

  onLoad: function (options) {
    for (let key in options) {
      this.setData({
        [key]: options[key]
      })
    }

    // popularData.getDateLater(0,0).then(res => {
    //   this.setData({
    //     s_date:res[0],
    //     e_date:res[1],
    //     current_date:res[1],
    //   })
    // })

    this.getAppBizStats_wxqy()
    
  },

  //选择日期
  changeDate(e){
    if(e.currentTarget.dataset.type=="s_date"){
      let begin = new Date(e.detail.value).getTime();
      let end = new Date(this.data.e_date).getTime();
      let day = 0
      if(end>=begin){
        day = (end - begin)/(24*60*60*1000);
        this.setData({
          s_date: e.detail.value,
        })
      }
      else{
        day = (begin - end)/(24*60*60*1000);
        let s_date = this.data.e_date
        let e_date = e.detail.value
        this.setData({
          s_date,
          e_date,
        })
      }
      if (day > 365) {
        wx.showToast({
          title: '请选择一年时间内',
          icon: 'none'
        })
      }
      else{
        this.getAppBizStats_wxqy()
      }
    }
    if(e.currentTarget.dataset.type=="e_date"){
      let begin = new Date(this.data.s_date).getTime();
      let end = new Date(e.detail.value).getTime();
      let day = 0
      if(end>=begin){
        day = (end - begin)/(24*60*60*1000);
        this.setData({
          e_date: e.detail.value,
        })
      }
      else{
        day = (begin - end)/(24*60*60*1000);
        let e_date = this.data.s_date
        let s_date = e.detail.value
        this.setData({
          s_date,
          e_date,
        })
      }
      if (day > 365) {
        wx.showToast({
          title: '请选择一年时间内',
          icon: 'none'
        })
      }
      else{
        this.getAppBizStats_wxqy()
      }
    }
    
  },

  //企微数据
  getAppBizStats_wxqy(){
    this.setData({
      showBar1Chart:false,
      showBar2Chart:false,
    })
    let params = {};
    params['s_time'] = this.data.s_date;
    params['e_time'] = this.data.e_date;
    _.apiQuery.getAppBizStats_wxqy(params).then(res => {

      wx.setNavigationBarTitle({
        title: res.data.title
      })

      //Bar1ChartData = getBar1Option()
      Bar1ChartData = {
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'shadow'
          }
        },
        xAxis: {
          type: 'value',
          data: []
        },
        yAxis: {
          type: 'category',
          data: []
        },
        grid: {
          top: '1%',
          left: '2%',
          right: '5%',
          bottom: '1%',
          containLabel: true
        },
        series: [
    
          {
            data: [],
            type: 'bar',
            top: 0,
            bottom:'0',
          }
        ]
      };
      
      Bar1ChartData.yAxis.data = res.data.bar1.xAxis_data
      Bar1ChartData.series[0].data = res.data.bar1.series_data
      this.setData({
        Bar1height:100 + 50*(res.data.bar1.xAxis_data.length),
        Bar1title:res.data.bar1.title,
        showBar1Chart:true,
        ['ecBar1.onInit']:Bar1Chart,
      })

      //Bar2ChartData = getBar2Option()
      Bar2ChartData = {
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'shadow'
          }
        },
        xAxis: {
          type: 'value',
          data: []
        },
        yAxis: {
          type: 'category',
          data: []
        },
        grid: {
          top: '1%',
          left: '2%',
          right: '1%',
          bottom: '3%',
          containLabel: true
        },
        series: [
    
          {
            data: [],
            type: 'bar',
            top: 0,
            bottom:'0',
          }
        ]
      };
      
      Bar2ChartData.yAxis.data = res.data.bar2.xAxis_data
      Bar2ChartData.series[0].data = res.data.bar2.series_data
      this.setData({
        Bar2height:100 + 50*(res.data.bar2.xAxis_data.length),
        Bar2title:res.data.bar2.title,
        showBar2Chart:true,
        ['ecBar2.onInit']:Bar2Chart,
      })

      wx.stopPullDownRefresh()

    });
  },

  //推送链接
  pushLink(e) {
    if(e.currentTarget.dataset.url){
      _.$router.openUrlScheme(e.currentTarget.dataset.url)
    }
  },

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

})


function getBar1Option() {

  return{
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'shadow'
      }
    },
    xAxis: {
      type: 'value',
      data: []
    },
    yAxis: {
      type: 'category',
      data: ['张三', '李四', '王五', '赵六', '孙七', '周八', '吴九','郑十']
    },
    grid: {
      top: '5%',
      left: '2%',
      right: '5%',
      bottom: '3%',
      containLabel: true
    },
    series: [

      {
        data: [120, 200, 150, 80, 70, 110, 130, 10],
        type: 'bar',
        top: 0,
        bottom:'0',
      }
    ]
  };
}

function getBar2Option() {

  return{
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'shadow'
      }
    },
    xAxis: {
      type: 'value',
      data: []
    },
    yAxis: {
      type: 'category',
      data: ['张三', '李四', '王五', '赵六', '孙七', '周八', '吴九','郑十']
    },
    grid: {
      top: '5%',
      left: '2%',
      right: '5%',
      bottom: '3%',
      containLabel: true
    },
    series: [

      {
        data: [20, 20, 10, 20, 20, 20, 25, 2],
        type: 'bar',
        top: 0,
        bottom:'0',
      }
    ]
  };
}