Autobio_UI/CallCenterWe.../js/huTotal.js

var token = $.cookie("token");
var date; //初始日期
var myChart;
var tabIndex = 0;
$(document).ready(function() {
	layui.use('laydate', function() {
		var laydate = layui.laydate;
		//日期
		laydate.render({
			elem: '#chooseTime',
			format: 'yyyy',
			type: 'year',
			theme: '#1ab394',
		});
	});

	//tab切换
	$('.hu-tab li').click(function() {
		$(this).addClass('active')
			.siblings().removeClass('active');

		tabIndex = $(this).index();
		$('.hu-content >div').eq(tabIndex).show()
			.siblings().hide();
		loadDatas();	
	});

	//柱形图
	//基于准备好的dom，初始化echarts实例
	myChart = echarts.init(document.getElementById('huData'));
	myChart.clear();
	myChart.showLoading();
	option = {
		color: ['#1ab394'],
		tooltip: {
			trigger: 'axis',
			axisPointer: { // 坐标轴指示器，坐标轴触发有效
				type: 'line' // 默认为直线，可选为：'line' | 'shadow'
			}
		},
		toolbox: {
			show: true,
		},
		calculable: true,
		xAxis: [{
			type: 'category',
			name: '月份',
			splitLine: {
				show: false
			}, //去除网格线
			data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
			axisTick: {
				alignWithLabel: true
			}
		}],
		yAxis: [{
			type: 'value',
			name: '通话量',
			nameLocation: 'end',
			splitLine: {
				show: false
			} //去除网格线
		}],
		series: [{
				name: '通话量',
				type: 'bar',
				barWidth: '30%', //图形宽度
				data: [],
				itemStyle: {
					normal: {
						label: {
							show: true,
							textStyle: {
								color: '#800080' //顶部数据颜色
							}
						}
					}
				},
				label: {
					normal: {
						show: true,
						position: 'top' //顶部数据显示位置
					}

				}
			}

		]
	};
	// 使用刚指定的配置项和数据显示图表。
	myChart.setOption(option);
	loadDatas();
	//搜索事件
	$(".sear").click(function() {
		$(".huTable tbody").html('');
		date = $("#chooseTime").val();
		loadDatas();
	});
})

function getDataList() {

	layui.use('table', function() {
		var table = layui.table;
		//方法级渲染
		table.render({
			elem: '#t_callTotal',
			url: huayi.config.callcenter_url + "TotalCall/GetDataList",
			method: 'get', //如果无需自定义HTTP类型，可不加该参数
			skin: 'row', //line （行边框风格） row （列边框风格） nob （无边框风格）
			even: true, //开启隔行背景
			size: 'lg', //sm,lg尺寸的表格
			where: {
				years: date,
				token: token
			}, //如果无需传递额外参数，可不加该参数
			//request: {}, //如果无需自定义请求参数，可不加该参数
			response: {
				statusName: 'state', //数据状态的字段名称，默认：code
				statusCode: 'success', //成功的状态码，默认：0
				msgName: 'message', //状态信息的字段名称，默认：msg
				//countName: 'total', //数据总数的字段名称，默认：count
				//dataName: 'rows', //数据列表的字段名称，默认：data
			}, //如果无需自定义数据响应名称，可不加该参数
			cols: [
				[{
					field: '月份',
					title: '月份',
					fixed: true,
					align: 'center',
					width: 200,
				}, {
					field: '日期',
					title: '日期',
					align: 'center',
					sort: true,
					//width: '30%',
				}, {
					field: '总数',
					title: '总数（次）',
					align: 'center',
					//width: '30%',
				}]
			],
			height: 'full-230'
		});
	});
}
//获取图形数据
function tu() {
	$.ajax({
		type: "get",
		url: huayi.config.callcenter_url + "TotalCall/GetChartData",
		async: true,
		dataType: 'json',
		data: {
			token: token,
			years: date
		},
		success: function(data) {
			myChart.hideLoading();
			if(data.data) {
				myChart.setOption({
					series: [{
						data: data.data
					}]
				});
			}
		}
	});

}
//导出
$('.export').click(function() {
	dcexcel(this);
})

function dcexcel(obj) {
	var url = huayi.config.callcenter_url + "TotalCall/ExptList?token=" + $.cookie("token");
	url += "&years=" + $("#chooseTime").val();
	obj.href = url;
}
function loadDatas() {
	if(tabIndex == 0) {
		tu(); //加载图形
	} else if(tabIndex == 1) {
		getDataList(); //加载表格
	}
}