修改 呼损报表，坐席工作报表

CallCenterWeb.UI/reportAnalysis/jthusuan.html

@@ -98,16 +98,13 @@
 		<script src="../js/echarts.common.min.js"></script>
 
 		<script>
-			var token = $.cookie("token"),
-				endtime = helper.DateFormat.getNowDate(), //结束时间
-				stime = helper.DateFormat.getPreMonth(endtime), //开始时间
-				tabtu,
-				xzhou,
-				jtCount, //接通次数
-				hsCount, //呼损次数
-				jtPercent, //接通率
-				hsPercent; //呼损率
-			$(function() {
+			var token = $.cookie("token");
+			var myChartp;
+			var endtime = helper.DateFormat.getNowDate(); //结束时间
+			var stime = helper.DateFormat.getPreMonth(endtime); //开始时间
+
+			$(document).ready(function() {
+
 				laydate.render({
 					elem: '#startTime',
 					range: '~',
@@ -125,15 +122,23 @@
 					var index = $(this).index();
 					$('.th-content >div').eq(index).show()
 						.siblings().hide();
-				})
+				});
 
-				//图形
-				tabtu = echarts.init(document.getElementById('tabtu'));
+				//搜索事件
+				$(".sear").click(function() {
+					getDataLists();
+				});
+				//导出功能
+				$('.export').click(function() {
+					dcexcel(this);
+				});
 
+				myChartp = echarts.init(document.getElementById('tabtu'));
+				myChartp.clear();
+				myChartp.showLoading();
 				option = {
 					tooltip: {
 						trigger: 'axis',
-
 					},
 
 					legend: {
@@ -142,7 +147,7 @@
 					},
 					xAxis: [{
 						type: 'category',
-						data: xzhou,
+						data: [],
 						axisPointer: {
 							type: ''
 						},
@@ -154,7 +159,7 @@
 					yAxis: [{
 							type: 'value',
 							name: '通话次数(通)',
-							nameLocation: 'middle',
+							nameLocation: 'end',
 							nameGap: 40,
 							//							min: 0,
 							//							max:300,
@@ -167,7 +172,7 @@
 						{
 							type: 'value',
 							name: '百分比(%)',
-							nameLocation: 'middle',
+							nameLocation: 'end',
 							nameGap: 35,
 							min: 0,
 							max: 100,
@@ -180,117 +185,152 @@
 					series: [{
 							type: 'bar',
 							name: '接通次数',
-							data: jtCount
+							data: []
 						},
 						{
 							type: 'bar',
 							name: '呼损次数',
-							data: hsCount
+							data: []
 						},
 						{
 							type: 'line',
 							name: '接通率',
-							data: jtPercent,
+							data: [],
 							yAxisIndex: 1,
 						},
 						{
 							type: 'line',
 							name: '呼损率',
-							data: hsPercent,
+							data: [],
 							yAxisIndex: 1,
 						}
 					],
 					color: ['#1ab394', '#fbbe5b', '#88ebc4', '#fa957f']
-				};
-				Ajax();
-				tabtu.setOption(option);
+				}
 
-				//表头数据
-				getColumnList();
-				//搜索事件
-				$(".sear").click(function() {
-					$('.thTable tbody').html('');
-					stime = $("#startTime").val() && $("#startTime").val().split(' ~ ')[0];
-					endtime = $("#startTime").val() && $("#startTime").val().split(' ~ ')[1];
-					Ajax();
-					tabtu.setOption(option);
-				});
-
-				//导出
-				$('.export').click(function() {
-					dcexcel(this);
-				})
+				// 使用刚指定的配置项和数据显示图表。
+				myChartp.setOption(option);
+				getDataLists(); //加载数据
+				getColumnList(); //获取表格
 
 			});
 
+			//获取数据  
+			function getDataLists() {
+				$.ajax({
+						type: "get",
+						url: huayi.config.callcenter_url + "SwitchedlossCall/GetDataList",
+						async: true,
+						dataType: 'json',
+						data: {
+							token: token,
+							stime: $('#startTime').val() && $('#startTime').val().split('~')[0],
+							endtime: $('#startTime').val() && $('#startTime').val().split('~')[1]
+						},
+						success: function(data) {
+
+						}
+					})
+					.then(function(data) {
+						$('.thTable tbody').html('');
+						myChartp.hideLoading();
+						if(data.state.toLowerCase() == "success") {
+							var tbodyCon = data.data;
+							// 填入数据
+							if(tbodyCon) {
+								myChartp.setOption({
+									xAxis: {
+										data: (function() {
+											var res = [];
+											for(var i = 0; i < tbodyCon.length; i++) {
+												res.push(tbodyCon[i].日期);
+											}
+											return res;
+										})(),
+									},
+									series: (function() {
+										var sres = [],
+											sres1 = [],
+											sres2 = [],
+											sres3 = [];
+										var sobj = [{
+												data: sres,
+											},
+											{
+												data: sres1,
+											},
+											{
+												data: sres2,
+											},
+											{
+												data: sres3,
+											},
+										];
+										for(var i = 0; i < tbodyCon.length; i++) {
+											sres.push(tbodyCon[i].接通次数);
+											sres1.push(tbodyCon[i].呼损次数);
+											sres2.push(tbodyCon[i].接通率);
+											sres3.push(tbodyCon[i].呼损率);
+										}
+										return sobj;
+									})(),
+								});
+								//填充表格数据
+								for(var j = 0; j < tbodyCon.length; j++) {
+									$('<tr><td>' + tbodyCon[j].日期 + '</td><td>' + tbodyCon[j].接通次数 + '</td><td>' + tbodyCon[j].呼损次数 + '</td><td>' + tbodyCon[j].接通率 + '</td><td>' + tbodyCon[j].呼损率 + '</td></tr>').appendTo('.thTable tbody');
+								}
+							} else {
+								$('#tabtu').html('<p class="text-center">暂无数据</p>');
+								$('.thTable tbody').html('<td colspan="9">没有找到您想要的记录呢！我会努力的...</td>');
+							}
+
+						} else {
+							$('#tabtu').html('<p class="text-center">暂无数据</p>');
+							$('.thTable tbody').html('<td colspan="9">没有找到您想要的记录呢！我会努力的...</td>');
+						}
+					});
+
+			}
+
+			//获取表头数据
 			function getColumnList() {
 				$.ajax({
-					type: "get",
-					url: huayi.config.callcenter_url + "SwitchedlossCall/GetColumnList",
-					async: true,
-					dataType: 'json',
-					data: {
-						token: token
-					},
-					success: function(res) {
-						var con = res.data;
-						for(var i = 0; i < con.length; i++) {
-							$('<td>' + con[i] + '</td>').appendTo('.thTable thead tr')
+						type: "get",
+						url: huayi.config.callcenter_url + "SwitchedlossCall/GetColumnList",
+						async: true,
+						dataType: 'json',
+						data: {
+							token: token
+						},
+						success: function(res) {
 
 						}
-					}
-				});
+
+					})
+
+					.then(function(data) {
+						$('.thTable thead tr').html('');
+						if(data.state.toLowerCase() == "success") {
+							var con = data.data;
+							if(con) {
+								for(var i = 0; i < con.length; i++) {
+									$('<td>' + con[i] + '</td>').appendTo('.thTable thead tr');
+								}
+							} else {
+								$('<td colspan="9">暂无表头数据</td>').appendTo('.thTable thead tr')
+							}
+						} else {
+							$('<td colspan="9">暂无表头数据</td>').appendTo('.thTable thead tr')
+						}
+					});
 			}
 
+			//导出
 			function dcexcel(obj) {
 				var url = huayi.config.callcenter_url + "SwitchedlossCall/ExptList?token=" + token;
 				url += "&stime=" + stime + "&endtime=" + endtime;
 				obj.href = url;
 			}
-
-			//表格数据
-			function Ajax() {
-				var jtshu = [],
-					hsshu = [],
-					jtlv = [],
-					hslv = [],
-					riqi = [];
-				$.ajax({
-					type: 'get',
-					url: huayi.config.callcenter_url + 'SwitchedlossCall/GetDataList',
-					async: false,
-					dataType: 'json',
-					data: {
-						token: token,
-						stime: stime,
-						endtime: endtime
-					},
-					success: function(data) {
-						var tbodyCon = data.data;
-						console.log(tbodyCon);
-						for(var j = 0; j < tbodyCon.length; j++) {
-							$('<tr><td>' + tbodyCon[j].日期 + '</td><td>' + tbodyCon[j].接通次数 + '</td><td>' + tbodyCon[j].呼损次数 + '</td><td>' + tbodyCon[j].接通率 + '</td><td>' + tbodyCon[j].呼损率 + '</td></tr>').appendTo('.thTable tbody');
-							riqi.push(tbodyCon[j].日期)
-							
-							jtshu.push(tbodyCon[j].坐席名称);
-							hsshu.push(tbodyCon[j].呼入次数);
-							jtlv.push(tbodyCon[j].呼出次数);
-							hslv.push(tbodyCon[j].通话总时长);
-						}
-					}
-				});
-				xzhou = riqi;
-				jtCount = jtshu;
-				hsCount = hsshu;
-				jtPercent = jtlv;
-				hsPercent = hslv;
-				console.log(xzhou);
-				option.xAxis[0].data = xzhou;
-				option.series[0].data = jtCount;
-				option.series[1].data = hsCount;
-				option.series[2].data = jtPercent;
-				option.series[3].data = hsPercent;
-			}
 		</script>
 	</body>