// pages/member/rankingListSecond/rankingListSecond.js
var app = getApp();
// const echarts = require('../../../../ec-canvas/echarts')
import * as echarts from '../../../../ec-canvas/echarts'; // 引入echarts.js
var barec1 = null;
var barec2 = null;
var barec3 = null;
var barec4 = null;
var barec5 = null;
Page({
  /**
   * 页面的初始数据
   */
  data: {
    show: false,
    showTitle: '',
    showContent: '',
    showID: '',
    card_id: '',
    nowTab: 0,
    url: 'plugin.business-card.frontend.controllers.statistics.visit.get-list',
    active: 0,

    visit: {
      diagram: {},
      statistics: {}
    },
    visitList: [],

    // 名片动作的图表
    reliable: {},
    save: {},
    share: {},

    collect: {
      diagram: {}
    },
    collectList: [],

    // more
    isLoadMore: true,
    page: 1,
    total_page: 0,
    ec1: {
      onInit: function (canvas, width, height) {
        barec1 = echarts.init(canvas, null, {
          width: width,
          height: height
        });
        canvas.setChart(barec1);
        return barec1;
      }
    },
    ec2: {
      onInit: function (canvas, width, height) {
        barec2 = echarts.init(canvas, null, {
          width: 317,
          height: 350
        });
        canvas.setChart(barec2);
        return barec2;
      }
    },
    ec3: {
      onInit: function (canvas, width, height) {
        barec3 = echarts.init(canvas, null, {
          width: 317,
          height: 350
        });
        canvas.setChart(barec3);
        return barec3;
      }
    },
    ec4: {
      onInit: function (canvas, width, height) {
        barec4 = echarts.init(canvas, null, {
          width: 317,
          height: 350
        });
        canvas.setChart(barec4);
        return barec4;
      }
    },
    ec5: {
      onInit: function (canvas, width, height) {
        barec5 = echarts.init(canvas, null, {
          width: 317,
          height: 350
        });

        canvas.setChart(barec5);
        return barec5;
      }
    }
  },

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

    this.getListDate();
  },

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

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

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

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

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

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    if (this.data.isLoadMore) {
      this.getMoreData();
    } else {
      console.log('没有更多了');
    }
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {},
  // 初始化图表--折线图
  init_lineCharts: function () {
    let option = {
      title: {
        text: '',
        textStyle: {
          color: '#0094ff',
          fontSize: 12
        }
      },
      tooltip: {
        trigger: 'axis'
      },
      grid: {
        left: '3%',
        right: '6%' || '4%',
        bottom: '3%',
        containLabel: true
      },
      toolbox: {
        feature: {
          saveAsImage: {}
        }
      },
      xAxis: {
        type: 'category',
        boundaryGap: false,
        data: this.data.visit.diagram.date || [
          '周一',
          '周二',
          '周三',
          '周四',
          '周五',
          '周六',
          '周日'
        ]
      },
      yAxis: {
        type: 'value'
      },
      series: [
        {
          type: 'line',
          areaStyle: {},
          data: this.data.visit.diagram.num
        }
      ]
    };

    barec1.setOption(option);
  },
  chooseTab(val) {
    let index = val.detail.index;
    this.setData({
      nowTab: index
    });
    if (index === 0) {
      this.setData({
        url: 'plugin.business-card.frontend.controllers.statistics.visit.get-list'
      });
    } else if (index === 2) {
      this.setData({
        url: 'plugin.business-card.frontend.controllers.statistics.collection.get-list'
      });
    } else {
      let option = {
        title: {
          text: '',
          textStyle: {
            color: '#0094ff',
            fontSize: 12
          }
        },
        tooltip: {
          trigger: 'axis'
        },
        grid: {
          left: '3%',
          right: '6%' || '4%',
          bottom: '3%',
          containLabel: true
        },
        toolbox: {
          feature: {
            saveAsImage: {}
          }
        },
        xAxis: {
          type: 'category',
          boundaryGap: false,
          data: this.data.visit.diagram.date || [
            '周一',
            '周二',
            '周三',
            '周四',
            '周五',
            '周六',
            '周日'
          ]
        },
        yAxis: {
          type: 'value'
        },
        series: [
          {
            type: 'line',
            areaStyle: {},
            data: this.data.visit.diagram.num
          }
        ]
      };

      barec2.setOption(option);
      barec3.setOption(option);
      barec4.setOption(option);
      return;
    }
    this.setData({
      showID: '',
      page: 1
    });
    this.getListDate();
  },
  showMore(e) {
    let id = e.target.dataset.id || e.currentTarget.dataset.id;
    if (id === this.data.showID) {
      this.setData({
        showID: ''
      });
    } else {
      this.setData({
        showID: id
      });
    }
  },
  showWeChat(e) {
    // item, str, flag
    let str = e.target.dataset.name || e.currentTarget.dataset.name;
    let item = e.target.dataset.item || e.currentTarget.dataset.item;
    let flag = e.target.dataset.str || e.currentTarget.dataset.str;
    this.setData({
      show: true,
      showTitle: str
    });
    if (str === '微信') {
      if (flag) {
        this.setData({
          showContent: item.collect_card.card_wechat
        });
      } else {
        this.setData({
          showContent: item.visitor_card.card_wechat
        });
      }
    } else if (str === '电话') {
      if (flag) {
        this.setData({
          showContent: item.collect_card.card_mobile
        });
      } else {
        this.setData({
          showContent: item.visitor_card.card_mobile
        });
      }
    }
  },
  getEchartDate() {
    let urlStr = app.getNetAddresss('plugin.business-card.frontend.controllers.statistics.visit.index');
    urlStr += '&card_id=' + this.data.card_id;
    app._getNetWork({
      url: urlStr,
      success: (resdata) => {
        var response = resdata.data;
        if (response.result == 1) {
          this.setData({
            visit: response.data
          });
          this.init_lineCharts();
        } else {
          wx.showToast({
            title: response.msg,
            icon: 'none'
          });
        }
      },
      fail: function (res) {
        console.log(res);
      }
    });
  },
  getListDate() {
    let urlStr = app.getNetAddresss(this.data.url);
    urlStr += '&card_id=' + this.data.card_id + '&page=1';
    app._getNetWork({
      url: urlStr,
      success: (resdata) => {
        var response = resdata.data;
        if (response.result == 1) {
          this.setData({
            isLoadMore: true,
            total_page: response.data.last_page
          });
          if (!this.data.total_page) {
            this.setData({
              total_page: 0
            });
          }
          if (this.data.nowTab === 0) {
            this.setData({
              visitList: response.data.data
            });
          } else if (this.data.nowTab === 2) {
            this.setData({
              collectList: response.data.data
            });
            let options = {
              title: {
                text: '',
                textStyle: {
                  color: '#0094ff',
                  fontSize: 12
                }
              },
              tooltip: {
                trigger: 'axis'
              },
              grid: {
                left: '3%',
                right: '6%' || '4%',
                bottom: '3%',
                containLabel: true
              },
              toolbox: {
                feature: {
                  saveAsImage: {}
                }
              },
              xAxis: {
                type: 'category',
                boundaryGap: false,
                data: this.data.collect.diagram.date || [
                  '周一',
                  '周二',
                  '周三',
                  '周四',
                  '周五',
                  '周六',
                  '周日'
                ]
              },
              yAxis: {
                type: 'value'
              },
              series: [
                {
                  type: 'line',
                  areaStyle: {},
                  data: this.data.collect.diagram.num
                }
              ]
            };
            barec5.setOption(options);
          }
        } else {
          wx.showToast({
            title: response.msg,
            icon: 'none'
          });
        }
      },
      fail: function (res) {
        console.log(res);
      }
    });
  },
  getCartAction() {
    let urlStr = app.getNetAddresss('plugin.business-card.frontend.controllers.statistics.card-action.index');
    urlStr += '&card_id=' + this.data.card_id;
    app._getNetWork({
      url: urlStr,
      success: (resdata) => {
        var response = resdata.data;
        if (response.result == 1) {
          this.setData({
            reliable: response.data.reliable,
            save: response.data.save,
            share: response.data.share
          });
        } else {
          wx.showToast({
            title: response.msg,
            icon: 'none'
          });
        }
      },
      fail: function (res) {
        console.log(res);
      }
    });
  },
  getcollect() {
    let urlStr = app.getNetAddresss('plugin.business-card.frontend.controllers.statistics.collection.index');
    urlStr += '&card_id=' + this.data.card_id;
    app._getNetWork({
      url: urlStr,
      success: (resdata) => {
        var response = resdata.data;
        if (response.result == 1) {
          this.setData({
            collect: response.data
          });
        } else {
          wx.showToast({
            title: response.msg,
            icon: 'none'
          });
        }
      },
      fail: function (res) {
        console.log(res);
      }
    });
  },
  // 获取更多数据
  getMoreData() {
    this.setData({
      isLoadMore: false
    });
    // 防止多次请求分页数据
    if (this.data.page >= this.data.total_page) {
      return;
    } else {
      let page = this.data.page + 1;
      this.setData({
        page});
      let urlStr = app.getNetAddresss(this.data.url);
      urlStr += '&card_id=' + this.data.card_id + '&page=' + this.data.page;

      app._getNetWork({
        url: urlStr,
        success: (resdata) => {
          this.setData({
            isLoadMore: true
          });
          var response = resdata.data;
          if (response.result == 1) {
            var myData = response.data.data;
            if (this.data.nowTab === 0) {
              let data = myData.concat(this.data.visitList);
              this.setData({
                visitList: data
              });
            } else if (this.data.nowTab === 2) {
              let datas = myData.concat(this.data.collectList);
              this.setData({
                collectList: datas
              });
            }
          } else {
            wx.showToast({
              title: response.msg,
              icon: 'none'
            });
            let pages = this.data.page - 1;
            this.setData({
              page: pages,
              isLoadMore: false
            });
          }
        },
        fail: function (res) {
          console.log(res);
        }
      });
    }
  },
  // 跳转到对应的名片
  goToBackCard(e) {
    let item = e.target.dataset.item || e.currentTarget.dataset.item;
    let str = e.target.dataset.str || e.currentTarget.dataset.str;
    if (str === 'collect') {
      if (item.collect_card) {
        wx.navigateTo({
          url: '/packageB/member/business_card/BusinessCard/BusinessCard?mark=card&card_id=' + item.collect_card.id
        });
      // this.$router.push(this.fun.getUrl("BusinessCard",{},{mark_id: item.collect_card.id, mark:'card'}))
      } else {
        wx.showToast({
          title: '该会员未开启名片',
          icon: 'none'
        });
      }
    } else {
      if (item.visitor_card) {
        wx.navigateTo({
          url: '/packageB/member/business_card/BusinessCard/BusinessCard?mark=card&card_id=' + item.visitor_card.id
        });
      // this.$router.push(this.fun.getUrl("BusinessCard",{},{mark_id: item.visitor_card.id, mark:'card'}))
      } else {
        wx.showToast({
          title: '该会员未开启名片',
          icon: 'none'
        });
      }
    }
  },
  // 点击蒙层是触发
  closePu() {
    this.setData({
      show: false
    });
  }
});
