// shoppingGuid/page/pages/achievement/achievement.js
const wxService = require('../../../../utils/wxService');
const app = getApp();
import * as echarts from '../../../../ec-canvas/echarts';

wxService.page({

  /**
   * 页面的初始数据
   */
  data: {
    filterBar: [
      { name: '本月', isActive: true, index: 0 }, 
      { name: '上月', isActive: false, index: 1 }, 
      { name: '3个月', isActive: false, index: 2 }
    ],
    current : 0,
    currentOrderData : {},
    
    info : {},
    achievement : {},
    ec: {
      lazyLoad: true
    }
  },

  //切换
  onTapChangeFilter(e){
    let index = e.currentTarget.dataset.index;
    this.data.filterBar.forEach(item => {
      item.isActive = false;
    });

    this.data.filterBar[index].isActive = true;
    this.data.current = this.data.filterBar[index].index;
    this.data.currentOrderData = this.data.achievement.monthAchievement[this.data.current];
    this.setData({
      filterBar: this.data.filterBar,
      current : this.data.current,
      currentOrderData: this.data.currentOrderData
    });

  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    let currentUserInfo = wx.getStorageSync('guidBaseInfo');
    if (!currentUserInfo) { //未登录成功
      wx.redirectTo({
        url: '/shoppingGuid/page/pages/welcomGuider/welcomGuider',
      });
      return ;
    }

    let userInfo = wx.getStorageSync('guidInfo');
    if (currentUserInfo.member) {
      if (!currentUserInfo.member.name) {
        currentUserInfo.member.name = userInfo.nickName;
      }
    }

    this.setData({
      info: currentUserInfo
    });

    //获取导购业绩
    this.echartsComponnet = this.selectComponent('#barChart');
    this.getGuidAchievement();
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
    
  },
  //初始化barchart
  initBarChart(series){
    this.echartsComponnet.init((canvas, width, height) => {
      // 初始化图表
      const Chart = echarts.init(canvas, null, {
        width: width,
        height: height
      });
      Chart.setOption(this.getOption(series));
      // 注意这里一定要返回 chart 实例，否则会影响事件处理等
      return Chart;
    });
  },

  //获取optiosn
  getOption(series){
    var option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {            // 坐标轴指示器，坐标轴触发有效
          type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
        },
      },
      xAxis: {
        type: 'category',
        data: ['普通会员', '付费会员', '销售额'],
        axisLine: {
          lineStyle: {
            color: '#dddddd'
          }
        },
        axisLabel: {
          color: '#666666'
        }
      },
      yAxis: {
        type: 'value',
        axisLine: {
          lineStyle: {
            color: '#dddddd'
          }
        },
        axisLabel: {
          color: '#666666'
        }
      },
      series: series
    };

    return option;
  },

  //获取导购业绩
  getGuidAchievement(){
    wxService.post('/marketing/shoppingguide/achievement').then(res => {
      if(!res) return ;
      this.data.currentOrderData = res.data.data.monthAchievement[this.data.current];
      this.setData({
        achievement: res.data.data,
        currentOrderData: this.data.currentOrderData,
      });

      let obj = res.data.data;
      console.log(obj)
      let series = [
        {
          name: '本月',type: 'bar', color: 'rgba(0,145,255,0.2)', barWidth: '20',
          data: [obj.memberRecruitAmountMonth, obj.plusMemberRecruitAmountMonth, obj.achievementMonth]
        },
        {
          name: '累计',
          type: 'bar',
          barWidth: '20',
          color: 'rgba(0, 145, 255, 1)',
          data: [obj.memberRecruitAmountTotal, obj.plusMemberRecruitAmountTotal, obj.achievementTotal]
        },
      ];
      this.initBarChart(series);
    });
  },
})