//echart
$(function () {
  var sjcx_char_data = [
    [
      // {
      //   name: '咨询量',
      //   val: 22374,
      // },
      // {
      //   name: '受理量',
      //   val: 13862,
      // },
      // {
      //   name: '办结量',
      //   val: 3594,
      // },
    ],
  ]

  //修改日期格式
  Date.prototype.Format = function (fmt) {
    var o = {
      'M+': this.getMonth() + 1, //月份
      'd+': this.getDate(), //日
      'H+': this.getHours(), //小时
      'm+': this.getMinutes(), //分
      's+': this.getSeconds(), //秒
      'q+': Math.floor((this.getMonth() + 3) / 3), //季度
      S: this.getMilliseconds(), //毫秒
    }
    if (/(y+)/.test(fmt))
      fmt = fmt.replace(
        RegExp.$1,
        (this.getFullYear() + '').substr(4 - RegExp.$1.length)
      )
    for (var k in o)
      if (new RegExp('(' + k + ')').test(fmt))
        fmt = fmt.replace(
          RegExp.$1,
          RegExp.$1.length == 1
            ? o[k]
            : ('00' + o[k]).substr(('' + o[k]).length)
        )
    return fmt
  }

  var today = new Date()
  var startToday = new Date().setMonth(today.getMonth() - 1)
  startToday = new Date(startToday)
  layui.use('laydate', function () {
    var laydate = layui.laydate
    laydate.render({
      elem: '#date-start',
      value: startToday.Format('yyyy-MM-dd'),
      done: function (value) {
        console.log(value)
      },
    })
    laydate.render({
      elem: '#date-end',
      value: today,
      done: function (value) {
        console.log(value)
      },
    })
  })
  $('#searchData').html(
    startToday.Format('yyyy年MM月dd日') + '（包含）'+ '至' + today.Format('yyyy年MM月dd日')+ '（不包含）'
  )


	getData(startToday.Format('yyyy-MM-dd'),today.Format('yyyy-MM-dd'))
	initPage()


	$('.layui-btn').on('click',function(){
		var startToday = new Date($('#date-start').val())
		var today = new Date($('#date-end').val())



  $('#searchData').html(
    startToday.Format('yyyy年MM月dd日') + '至' + today.Format('yyyy年MM月dd日')
  )

		getData(startToday.Format('yyyy-MM-dd'),today.Format('yyyy-MM-dd'))
	})

})

function getData(starttime,endtime){
	$.ajax({
    url: '/szinf/consult/getBanJianNumByPeriod',
    type: 'POST',
    async: false,
    data: {
      starttime: starttime,
      endtime: endtime,
    },
    success: function (data) {
      $('#zxl').html(data.custom.projectnum.consultNum)
      $('#sll').html(data.custom.projectnum.slNum)
      //$('#bjl').html(data.custom.projectnum.bjNum)
      sjcx_char_data = [
        [
          {
            name: '咨询量',
            val: data.custom.projectnum.consultNum,
          },
          {
            name: '办件量',
            val: data.custom.projectnum.slNum,
          },
          //{
          //  name: '办结量',
          //  val: data.custom.projectnum.bjNum,
          //},
        ],
      ]
      sjcx_char(sjcx_char_data)
    },
  })
}

function initPage() {
  $(window).resize(function () {
    chartResize($('#sjcx_char')[0])
  })
}

function chartResize(e) {
  var chart = echarts.getInstanceByDom(e)
  if (chart && chart.resize) {
    chart.resize()
  }
}



//数据查询
function sjcx_char(eData) {
  var chart = echarts.init($('#sjcx_char')[0])
  var color = ['#4169e2', '#ffa200', '#cccccc']
  var option = {
    color: ['#4169e2', '#ffa200', '#cccccc'],
    animationEasing: 'cubicInOut',
    animationDuration: function (idx) {
      return idx * 200
    },
    animationDelayUpdate: function (idx) {
      return idx * 200
    },
    grid: {
      show: false,
      left: 60,
      right: 20,
      top: 30,
      bottom: 40,
    },
    tooltip: {
      trigger: 'axis',
      textStyle: {
        fontSize: 14,
      },
      axisPointer: {
        type: 'none',
      },
      formatter: '{b0} : {c0}',
    },
    xAxis: {
      data: [],
      axisLine: {
        lineStyle: {
          color: '#e3e3e3',
        },
      },
      axisTick: {
        lineStyle: {
          color: '#e3e3e3',
        },
      },
      axisLabel: {
        color: '#666666',
      },
    },
    yAxis: [
      {
        type: 'value',
        name: '',
        axisLine: {
          show: false,
        },
        axisTick: {
          show: false,
        },
        axisLabel: {
          color: '#666666',
        },
        splitLine: {
          show: true,
          lineStyle: {
            color: '#eeeeee',
          },
        },
        // min: 'dataMin',
        // max: 'dataMax'
        // interval: 50,
        // axisLabel: {
        // 		formatter: '{value} '
        // }
      },
    ],
    // series: [{
    // 		name: '',
    // 		data: [],
    // 		type: 'bar'
    // 	}],
    series: [
      {
        name: '',
        type: 'bar',
        itemStyle: {
          normal: {
            color: function (params) {
              return color[params.dataIndex]
            },
          },
        },
        //柱状图宽度
        barWidth: '30%',
        //柱状图数值
        data: [],
      },
    ],
  }
  chart.setOption(option)

  var chartDataObj = {
    xAxis: [
      {
        data: [],
      },
    ],
    series: [
      {
        data: [],
      },
    ],
  }

  $(eData[0]).each(function (i, map) {
    chartDataObj.xAxis[0].data.push(map.name)
    chartDataObj.series[0].data.push(map.val)
  })

  chart.setOption(chartDataObj)
  return chart
}