YC12345_Web/WebChart_2.0/js/index.js

$(function() {
	var mySwiper = new Swiper('.swiper-container', {
//		loop: true,
//		autoplay: {
//			delay: 60000,
//		},
		pagination: { /* 分页器*/
			el: '.swiper-pagination',
			clickable: true,

		},
		navigation: {
			nextEl: '.swiper-button-next',
			prevEl: '.swiper-button-prev',
		},
		//				followFinger : false,
		//				speed:800,
		on: {
			init: function() {
				swiperAnimateCache(this); //隐藏动画元素 
				swiperAnimate(this); //初始化完成开始动画
			},
			transitionEnd: function() {
				swiperAnimate(this); //每个slide切换结束时也运行当前slide动画

			},
		}

	})
	Ajax();
	deprtment();// 第五屏部门下拉
	laydate.render({
					elem: '#time1',
					eventElem:'.data-input-icon1',
		            trigger:'click',
					range: '~',
					format: 'yyyy-MM-dd',
					theme: '#114a97',
						done: function(value, date) {
						oneScreen(value && value.split(' ~ ')[0], value && value.split(' ~ ')[1])
					}
				});
	laydate.render({
					elem: '#time2',
			        eventElem:'.data-input-icon2',
		            trigger:'click',
					range: '~',
					format: 'yyyy-MM-dd',
					theme: '#114a97',
						done: function(value, date) {
						twoScreen(value && value.split(' ~ ')[0], value && value.split(' ~ ')[1])
					}
				});
	laydate.render({
					elem: '#time3',
				    eventElem:'.data-input-icon3',
		            trigger:'click',
					format: 'yyyy-MM-dd',
					theme: '#114a97',
					done: function(value) {
						threeScreen(value)
					}
				});
	laydate.render({
					elem: '#time4',
					eventElem:'.data-input-icon4',
		            trigger:'click',
					range: '~',
					format: 'yyyy-MM-dd',
					theme: '#114a97',
						done: function(value, date) {
						fourScreen(value && value.split(' ~ ')[0], value && value.split(' ~ ')[1])
					}
				});
	laydate.render({
					elem: '#test6',
					eventElem:'.data-input-icon5',
		            trigger:'click',
					range: '~',
					format: 'yyyy-MM-dd',
					theme: '#114a97',
					done: function(value, date) {
						fiveScreen(value && value.split(' ~ ')[0], value && value.split(' ~ ')[1])
					}
				});
})
var cityObj = {
		ele1: "hc_count",
		ele2: "hc_cheguan",
		ele3: "hh_mashan",
		ele4: "cjx_count",
		ele5: "sgx_count",
		ele6: "szx_count",
		ele7: "wjz_count",
		ele8: "xdpz_count",
		ele9: "xdpz_pqzh",
		ele10: "xdpz_cjzh",
		ele11: "xdpz_jkozh",
		ele12: "xdpz_tqizh",
		ele13: "xdpz_lzhaizh",
		ele14: "xdpz_shzhe",
		ele15: "wzz_count",
		ele16: "fjx_count",
		ele17: "qgmx_count",
		ele18: "wzz_count1",
		ele19: "syz_count",
		ele20: "lhpz_count",
		ele21: "saz_count",
		ele22: "saz_chgzxia",
		ele23: "saz_hkouxian",
		ele24: "saz_cexiang",
		ele25: "saz_hlxiang",
		ele26: "xdpz_mizhen",
		ele27: "xdpz_huczhen",
		ele28: "xdpz_wolzhe",
		ele29: "wxz_count",
		
		
	}
	var vars = {};
	getCountUp(cityObj)

	function getCountUp(obj1) {
		var options = {  
			useEasing: true,
			  useGrouping: true,
			  separator: ',',
			  decimal: '.',
		};
		$.each(obj1, function(k, v) {
			new CountUp(v, 0, 0, 0, 2, options).start()
			vars[v] = new CountUp(v, 0, 0, 0, 2, options)
		})
	}
	
var myDate = new Date();

function turn(aa) {
	if(aa < 10) {
		aa = "0" + aa;
	}
	return aa
}
	// 第三屏 第四屏 发光外框 定时
	(function() {
		var i = 0;
		var length = $(".orderState_ul >li").length;
		var j = 0;
		var length_1 = $(".orderTtype_Con li").length;
		setInterval(function() {
			if(i == length) {
				i = 0;
				$(".orderState_ul >li").removeClass('active');
			}
			$(".orderState_ul >li").eq(i).addClass('active').siblings().removeClass('active');
			if(i == 5) {
				$(".orderState_ul >li").eq(4).removeClass('active');
			}
			i++;

			if(j == length_1) {
				j = 0;
			}
			$(".orderTtype_Con li").eq(j).addClass('active').siblings().removeClass('active');
			j++;
		}, 2000);
	})();
	//第一屏幕 开始
	function oneScreen(sd,ed) {
		//			 	$('.gdmap-r ul').html('');
		//			 		var index = layer.load(1, { shade: [0.5,'#030303'] //0.1透明度的白色背景
		//			});
		$.ajax({
			type: "get",
			url: huayi.config.callcenter_url + "info/GetAreaCountByDate",
			async: true,
			dataType: 'json',
			data: {
				start: sd,
				end: ed,
			},
			success: function(data) {
				if(data.state.toLowerCase() == 'success') {
					// 	   			layer.close(index);
					var con = data.data;
					$(con).each(function(i, n) {
						if(n.AreaName.indexOf('演集镇') != -1) {
							vars.hc_count.update(n.Count);
						}
						if(n.AreaName.indexOf('城关镇') != -1) {
							vars.hc_cheguan.update(n.Count);
						}
						if(n.AreaName.indexOf('芒山镇') != -1) {
							vars.hh_mashan.update(n.Count);
						}
						if(n.AreaName.indexOf('酂城镇') != -1) {
							vars.cjx_count.update(n.Count);
						}
						if(n.AreaName.indexOf('高庄镇') != -1) {
							vars.sgx_count.update(n.Count);
						}
						if(n.AreaName.indexOf('十八里镇') != -1) {
							vars.szx_count.update(n.Count);
						}
						if(n.AreaName.indexOf('薛湖镇') != -1) {
							vars.wjz_count.update(n.Count);
						}
						if(n.AreaName.indexOf('马桥镇') != -1) {
							vars.xdpz_count.update(n.Count);
						}
						if(n.AreaName.indexOf('裴桥镇') != -1) {
							vars.xdpz_pqzh.update(n.Count);
						}
						if(n.AreaName.indexOf('陈集镇') != -1) {
							vars.xdpz_cjzh.update(n.Count);
						}
						if(n.AreaName.indexOf('蒋口镇') != -1) {
							vars.xdpz_jkozh.update(n.Count);
						}
						if(n.AreaName.indexOf('太丘镇') != -1) {
							vars.xdpz_tqizh.update(n.Count);
						}
						if(n.AreaName.indexOf('李寨镇') != -1) {
							vars.xdpz_lzhaizh.update(n.Count);
						}
						if(n.AreaName.indexOf('顺和镇') != -1) {
							vars.xdpz_shzhe.update(n.Count);
						}
						if(n.AreaName.indexOf('酂阳镇') != -1) {
							vars.wzz_count.update(n.Count);
						}
						if(n.AreaName.indexOf('马牧镇') != -1) {
							vars.fjx_count.update(n.Count);
						}
						if(n.AreaName.indexOf('龙岗镇') != -1) {
							vars.wxz_count.update(n.Count);
						}
						if(n.AreaName.indexOf('王集镇') != -1) {
							vars.qgmx_count.update(n.Count);
						}
						if(n.AreaName.indexOf('刘河镇') != -1) {
							vars.wzz_count1.update(n.Count);
						}
						if(n.AreaName.indexOf('双桥镇') != -1) {
							vars.syz_count.update(n.Count);
						}
						if(n.AreaName.indexOf('条河镇') != -1) {
							vars.lhpz_count.update(n.Count);
						}
						if(n.AreaName.indexOf('新桥镇') != -1) {
							vars.saz_count.update(n.Count);
						}
						if(n.AreaName.indexOf('陈官庄乡') != -1) {
							vars.saz_chgzxia.update(n.Count);
						}
						if(n.AreaName.indexOf('黄口乡') != -1) {
							vars.saz_hkouxian.update(n.Count);
						}
						if(n.AreaName.indexOf('城厢乡') != -1) {
							vars.saz_cexiang.update(n.Count);
						}
						if(n.AreaName.indexOf('侯岭乡') != -1) {
							vars.saz_hlxiang.update(n.Count);
						}
						if(n.AreaName.indexOf('苗桥镇') != -1) {
							vars.xdpz_mizhen.update(n.Count);
						}
						if(n.AreaName.indexOf('茴村镇') != -1) {
							vars.xdpz_huczhen.update(n.Count);
						}
						if(n.AreaName.indexOf('卧龙镇') != -1) {
							vars.xdpz_wolzhe.update(n.Count);
						}
						
					})
				}
			}
		});
	}

	//第二屏
	function twoScreen(sd,ed) {
		$.ajax({
			type: "get",
			url: huayi.config.callcenter_url + "info/GetSourceByDate",
			async: true,
			dataType: 'json',
			data: {
				start: sd,
				end: ed,
			},
			success: function(data) {
				if(data.state.toLowerCase() == 'success') {
					// 	   			layer.close(index);
					$('.orderSource ul li .rectangle').remove();
					var con = data.data;

					$(con).each(function(i, n) {
						if(!n.Percent) {
							n.Percent = '0.00%'
						}
						var str = '<div class="source_kuang rectangle">' +
							'<div class="pbout">' +
							'<div class="percent_box">' +
							'<div class="percent_out"></div>	' +
							' <div class="percent_in"></div>' +
							' <div class="percent_word"><p>' + n.Percent.split('%')[0] + '</p>%' +
							'</div>' +
							'</div>' +
							'</div>' +
							'<p class="num_word">' +
							'<span>' + n.Source + '</span><span>' + n.Count + '</span>' +
							'</p>' +
							'</div>'
						$('.orderSource ul li').eq(i).prepend(str)
					})
				}
			}
		});
	}

	//第三屏
	function threeScreen(sd) {
		$.ajax({
			type: "get",
			url: huayi.config.callcenter_url + "Info/GetTypeCountNew",
			async: true,
			dataType: 'json',
			data: {
				date: sd,
			},
			success: function(data) {
				if(data.state.toLowerCase() == 'success') {
					$('.orderTtype_Con ul').html('');
					// 	   			layer.close(index);
					var con = data.data;
					var img_name = '';
					$(con).each(function(i, n) {
						if(n.TypeName.indexOf('咨询') != -1) {
							img_name = 'order_ZX.png'
						}
						if(n.TypeName.indexOf('求助') != -1) {
							img_name = 'order_QZ.png'
						}
						if(n.TypeName.indexOf('投诉') != -1) {
							img_name = 'order_TS.png'
						}
						if(n.TypeName.indexOf('建议') != -1) {
							img_name = 'order_JY.png'
						}
						if(n.TypeName.indexOf('表扬') != -1) {
							img_name = 'order_BY.png'
						}
						if(n.TypeName.indexOf('其他') != -1) {
							img_name = 'order_QT.png'
						}
						$('<li>' +
							'<div class="typeWord">' + n.TypeName + '</div>' +
							'<img src="img/' + img_name + '" alt="" />' +
							'<p class="typeWord_line">数据展示</p>' +
							'<p class="order_count">' + n.DayCount + '</p>' +
							'<p class="typeWord_line">今日' + n.TypeName + '量</p>' +
							'<p class="order_count">' + n.MonthCount + '</p>' +
							'<p class="typeWord_line">本月' + n.TypeName + '量</p>' +
							'<p class="order_count">' + n.TotalCount + '</p>' +
							'<p class="typeWord_line">' + n.TypeName + '总量</p>' +
							'<div class="persent_box">' +
							'<div class="persent_kuang">' + n.Percent + '</div>' +
							'</div>' +
							'<p class="persent_word">总计类型占比</p>' +
							'</li>').appendTo('.orderTtype_Con ul');

					})
				}
			}
		});
	}

		//第四屏 数字滚动
	function fourScreen(sd,ed) {
		$.ajax({
			type: "get",
			url: huayi.config.callcenter_url + "Info/GetStateCountByMonth",
			async: true,
			dataType: 'json',
			data:{
				start: sd,
				end: ed,
			},
			success: function(data) {
				if(data.state.toLowerCase() == 'success') {
					// 	   			layer.close(index);
					var con = data.data;
					$(con).each(function(i, n) {
						if(n.Name.indexOf('延时审核') != -1) {
							$("#state_yssh").rollNum({
								deVal: n.Count
							});
						}
						if(n.Name.indexOf('已办理') != -1) {
							$("#state_ybl").rollNum({
								deVal: n.Count
							});
						}
						if(n.Name.indexOf('已回访') != -1) {

							$("#state_yhf").rollNum({
								deVal: n.Count
							});
						}
						if(n.Name.indexOf('重办中') != -1) {
							$("#state_cbz").rollNum({
								deVal: n.Count
							});
						}
						if(n.Name.indexOf('已结案') != -1) {
							$("#state_yja").rollNum({
								deVal: n.Count
							});
						}
						if(n.Name.indexOf('新工单') != -1) {
							$("#state_xzgd").rollNum({
								deVal: n.Count
							});
						}
						if(n.Name.indexOf('待交办') != -1) {
							$("#state_djb").rollNum({
								deVal: n.Count
							});
						}
						if(n.Name.indexOf('待查收') != -1) {
							$("#state_dcs").rollNum({
								deVal: n.Count
							});
						}
						if(n.Name.indexOf('退回审核') != -1) {
							$("#state_thsh").rollNum({
								deVal: n.Count
							});
						}
						if(n.Name.indexOf('办理中') != -1) {
							$("#state_blz").rollNum({
								deVal: n.Count
							});
						}
					});
				}
			}
		});

	}
	//第五屏js
	function fiveScreen(sd,ed) {
        keyWord(sd, ed);
	} 
	$(".depart").change(function() {
        keyWordDetail($('#test6').val() && $('#test6').val().split(' ~ ')[0], $('#test6').val() && $('#test6').val().split(' ~ ')[1]);
	})
	//部门下拉框
	function deprtment () {
		$.getJSON( huayi.config.callcenter_url +"info/GetDeptList", function(result) {
			if(result.state.toLowerCase() == "success") {
				goodslist = result.data;
				$(".depart").empty();
				$('<option value="">请选择部门</option>').appendTo($(".depart"));
				$(goodslist).each(function(i, n) {
					$('<option value="' + n.F_DeptId 
					+ '">' + n.F_DeptName 
					+ '</option>').appendTo($(".depart"));
				})
			}
		});
	}
	
//	左侧关键词
function keyWord(sd, ed) {
		$.ajax({
			type: "get",
			url: huayi.config.callcenter_url + "info/GetKeyCountRankByDate",
			async: true,
			dataType: 'json',
            data: {
                start: sd,
                end: ed
			},
			success: function(data) {
				if(data.state.toLowerCase() == 'success') {
					var con = data.data;
//					$(".keyW_t").text(con[0].TypeName)
					$('.tagcloud').html('');
					$(con).each(function(k, j) {
						if(k < 12) {
							var strs = '<div index="'+j.Id+'" class="tagcloud_bj">' +
								'<p class="tag_title">' + j.TypeName + '</p>' +
								'<p class="imgs">' + j.Count + '</p>' +
								'</div>'
							$('.tagcloud').append(strs);
						}
					})
					$(".tagcloud div:first-child").removeClass("tagcloud_bj");
                    $(".tagcloud div:first-child").addClass("tagcloud_bjShine");
                    keyWordDetail(sd, ed);
				}
			}
		});
	}
	
//	右侧部门
function keyWordDetail(sd, ed) {
		$.ajax({
			type: "get",
			url: huayi.config.callcenter_url + "info/GetDeptKeyCountByDateNew",
			async: true,
			dataType: 'json',
			data: {
                start: sd,
                end: ed,
                deptid: $('.depart').val(),
                keyid: $(".tagcloud_bjShine").eq(0).attr("index")
			},
			success: function(data) {
				if(data.state.toLowerCase() == 'success') {
					$('.scroll_table tbody').html('');
					var con = data.data;
                    $(con).each(function (j, n) {
                        var rate = '';
                        if (n.rate) { rate = n.rate;}
                        var str = '<tr><td>' + n.deptname + '</td><td>' + n.acceptcount + '</td><td>' + rate + '</td></tr>'
						$('.scroll_table tbody').append(str);
					})
					$(".scroll_table").Scroll({
						line: 1,
						speed: 500,
						timer: 2000
					});
				}
			}
		});
	}
	$(".tagcloud").on("click","div",function(){
		$(".tagcloud div").addClass("tagcloud_bj");
		$(".tagcloud div").removeClass("tagcloud_bjShine");
		$(this).removeClass("tagcloud_bj");
		$(this).addClass("tagcloud_bjShine");

        keyWordDetail($('#test6').val() && $('#test6').val().split(' ~ ')[0], $('#test6').val() && $('#test6').val().split(' ~ ')[1]);
	});
	function Ajax() {
		oneScreen($('#time1').val() && $('#time1').val().split(' ~ ')[0], $('#time1').val() && $('#time1').val().split(' ~ ')[1])
		twoScreen($('#time2').val() && $('#time2').val().split(' ~ ')[0], $('#time2').val() && $('#time2').val().split(' ~ ')[1])
		threeScreen();
		fourScreen($('#time4').val() && $('#time4').val().split(' ~ ')[0], $('#time4').val() && $('#time4').val().split(' ~ ')[1])
        fiveScreen($('#test6').val() && $('#test6').val().split(' ~ ')[0], $('#test6').val() && $('#test6').val().split(' ~ ')[1])
}