YH_Web_UI/WebUI/CallCenterWe.../statementAna.../js/pieCharts.js

/**
 * 运维图形统计  报修 耗材 隐藏
 * */
var stateVal = 0; //默认当天
var myChart0 = echarts.init(document.getElementById('pieChart0')); //工单数量统计
//var myChart1 = echarts.init(document.getElementById('pieChart1')); //报修统计
var myChart2 = echarts.init(document.getElementById('pieChart2')); //维修状态统计
var myChart3 = echarts.init(document.getElementById('pieChart3')); //维修及时率
var myChart4 = echarts.init(document.getElementById('pieChart4')); //满意度统计
var myChart5 = echarts.init(document.getElementById('pieChart5')); //设备巡检统计
var myChart6 = echarts.init(document.getElementById('pieChart6')); //设备保养统计
//var myChart7 = echarts.init(document.getElementById('pieChart7')); //耗材统计

$(function() {
	//初始化图形
	initPies();
	//获取数据
	getPiedatas();
	//搜索 0-当天；1-本周；2-本月；3-本年；4-累计
	$('#sc_statebtn').find('input[type="radio"]').on('change', function() {
		stateVal = $(this).val();
		getPiedatas();
	});
});

//获取数据
function getPiedatas() {
	$.ajax({
		type: "get",
		url: huayi.config.callcenter_url + "equipmentapi/api/RunningRepair/getequipmentroundreport",
		async: true,
		dataType: 'json',
		data: {
			datetype: stateVal, //否	int	0-当天；1-本周；2-本月；3-本年；4-累计
		},
		success: function(data) {
			myChart0.hideLoading();
//			myChart1.hideLoading();
			myChart2.hideLoading();
			myChart3.hideLoading();
			myChart4.hideLoading();
			myChart5.hideLoading();
			myChart6.hideLoading();
//			myChart7.hideLoading();
			if(data.state.toLowerCase() == "success") {
				data = data.data;
				if(data) {
					var source = data.source; //工单数量
					var repair = data.repair; //报修
					var state = data.state; //维修状态
					var timely = data.timely; //维修及时率统计
					var satisfied = data.satisfied; //满意度统计
					var equioment = data.running; //巡检统计
					var maintenance = data.maintenance; //设备保养统计
					var material = data.material; //耗材统计
					myChart0.setOption({
						series: [{
							data: [{
									name: '电话',
									value: source.pccount
								},
								{
									name: '微信',
									value: source.wxcount
								},
								{
									name: 'APP',
									value: source.appcount
								},
							],
						}]
					});
//					myChart1.setOption({
//						series: [{
//							data: [{
//									name: '日常报修',
//									value: repair.rccount
//								},
//								{
//									name: '设备报修',
//									value: repair.sbcount
//								}
//							],
//						}]
//					});
					myChart2.setOption({
						series: [{
							data: [{
									name: '已维修',
									value: state.ywxcount
								},
								{
									name: '待维修',
									value: state.dwxcount
								}
							],
						}]
					});
					myChart3.setOption({
						series: [{
							data: [{
									name: '2小时内',
									value: timely.hour2count,
								},
								{
									name: '4小时内',
									value: timely.hour4count,
								},
								{
									name: '8小时内',
									value: timely.hour8count,
								},
								{
									name: '24小时内',
									value: timely.hour24count,
								},
								{
									name: '24小时以上',
									value: timely.hour24scount,
								}
							],
						}]
					});
					myChart4.setOption({
						series: [{
							data: [{
									name: '满意',
									value: satisfied.mycount,
								},
								{
									name: '不满意',
									value: satisfied.nocount,
								}
							],
						}]
					});
					myChart5.setOption({
						series: [{
							data: [{
									name: '计划',
									value: equioment.rcount,
								},
								{
									name: '待巡检',
									value: equioment.rwcount,
								},
								{
									name: '异常',
									value: equioment.ryycount,
								}
							],
						}]
					});
					myChart6.setOption({
						series: [{
							data: [{
									name: '计划',
									value: maintenance.mcount,
								},
								{
									name: '待保养',
									value: maintenance.mwcount,
								},
								{
									name: '异常',
									value: maintenance.mabnormalcount,
								}
							],
						}]
					});
//					myChart7.setOption({
//						series: [{
//							data: [{
//									name: '已使用',
//									value: material.hccount,
//								},
//								{
//									name: '欠缺',
//									value: material.qqcount,
//								}
//							],
//						}]
//					});
				}
			}
		}
	});
}
//初始化图形
function initPies() {
	initPie0(); //初始化 工单数量统计
//	initPie1(); //初始化 报修统计
	initPie2(); //初始化 维修状态统计
	initPie3(); //初始化 维修及时率统计
	initPie4(); //初始化 满意度统计
	initPie5(); //初始化 设备巡检统计
	initPie6(); //初始化 设备保养统计
//	initPie7(); //初始化 耗材统计
}

//初始化 耗材统计
function initPie7() {
	myChart7.clear();
	myChart7.showLoading();
	var option = {
		color: ['#049FF2', '#FDC744'],
		title: {
			text: '耗材统计',
			x: 'center',
			textStyle: {
				color: '#fff'
			}
		},
		tooltip: {
			trigger: 'item',
			formatter: "{a} <br/>{b} : {c} ({d}%)"
		},
		legend: {
			orient: 'vertical',
			top: 26,
			left: 20,
			data: ['已使用', '欠缺'],
			textStyle: {
				color: '#fff'
			}
		},
		series: [{
			name: '耗材数量',
			type: 'pie',
			radius: '55%',
			center: ['50%', '60%'],
			data: [{
					name: '已使用',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				},
				{
					name: '欠缺',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				}
			],
			itemStyle: {
				emphasis: {
					shadowBlur: 10,
					shadowOffsetX: 0,
					shadowColor: 'rgba(0, 0, 0, 0.5)'
				}
			}
		}]
	};
	myChart7.setOption(option);
}

//初始化 设备保养统计
function initPie6() {
	myChart6.clear();
	myChart6.showLoading();
	var option = {
		color: ['#049FF2', '#FDC744', '#ACA1F0'],
		title: {
			text: '保养统计',
			x: 'center',
			textStyle: {
				color: '#fff'
			}
		},
		tooltip: {
			trigger: 'item',
			formatter: "{a} <br/>{b} : {c} ({d}%)"
		},
		legend: {
			orient: 'vertical',
			top: 26,
			left: 20,
			data: ['计划', '待保养', '异常'],
			textStyle: {
				color: '#fff'
			}
		},
		series: [{
			name: '工单量',
			type: 'pie',
			radius: '55%',
			center: ['50%', '60%'],
			data: [{
					name: '计划',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				},{
					name: '待保养',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				},
				{
					name: '异常',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				}
			],
			itemStyle: {
				emphasis: {
					shadowBlur: 10,
					shadowOffsetX: 0,
					shadowColor: 'rgba(0, 0, 0, 0.5)'
				}
			}
		}]
	};
	myChart6.setOption(option);
}

//初始化 设备巡检统计
function initPie5() {
	myChart5.clear();
	myChart5.showLoading();
	var option = {
		color: ['#049FF2', '#FDC744', '#ACA1F0'],
		title: {
			text: '巡检统计',
			x: 'center',
			textStyle: {
				color: '#fff'
			}
		},
		tooltip: {
			trigger: 'item',
			formatter: "{a} <br/>{b} : {c} ({d}%)"
		},
		legend: {
			orient: 'vertical',
			top: 26,
			left: 20,
			data: ['计划', '待巡检', '异常'],
			textStyle: {
				color: '#fff'
			}
		},
		series: [{
			name: '工单量',
			type: 'pie',
			radius: '55%',
			center: ['50%', '60%'],
			data: [{
					name: '计划',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				},
				{
					name: '待巡检',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				},
				{
					name: '异常',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				}
			],
			itemStyle: {
				emphasis: {
					shadowBlur: 10,
					shadowOffsetX: 0,
					shadowColor: 'rgba(0, 0, 0, 0.5)'
				}
			}
		}]
	};
	myChart5.setOption(option);
}

//初始化 满意度统计
function initPie4() {
	myChart4.clear();
	myChart4.showLoading();
	var option = {
		color: ['#049FF2', '#FDC744'],
		title: {
			text: '满意度统计',
			x: 'center',
			textStyle: {
				color: '#fff'
			}
		},
		tooltip: {
			trigger: 'item',
			formatter: "{a} <br/>{b} : {c} ({d}%)"
		},
		legend: {
			orient: 'vertical',
			top: 26,
			left: 20,
			data: ['满意', '不满意'],
			textStyle: {
				color: '#fff'
			}
		},
		series: [{
			name: '满意度',
			type: 'pie',
			radius: '55%',
			center: ['50%', '60%'],
			data: [{
					name: '满意',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				},
				{
					name: '不满意',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				}
			],
			itemStyle: {
				emphasis: {
					shadowBlur: 10,
					shadowOffsetX: 0,
					shadowColor: 'rgba(0, 0, 0, 0.5)'
				}
			}
		}]
	};
	myChart4.setOption(option);
}

//初始化 维修及时率统计
function initPie3() {
	myChart3.clear();
	myChart3.showLoading();
	var option = {
		color: ['#049FF2', '#FDC744', '#ACA1F0','#63D58E', '#70CD00',, ],
		title: {
			text: '维修及时率统计',
			x: 'center',
			textStyle: {
				color: '#fff'
			}
		},
		tooltip: {
			trigger: 'item',
			formatter: "{a} <br/>{b} : {c} ({d}%)"
		},
		grid: {
			top: 20,
		},
		legend: {
//			orient: 'vertical',
			top: 26,
			left: 0,
//			padding: [5, // 上
//				10, // 右
//				5, // 下
//				0, // 左
//			],
			//itemGap: 6,
			//			orient: 'horizontal',
			//			top: 30,
			data: ['2小时内', '4小时内', '8小时内', '24小时内', '24小时以上'],
			textStyle: {
				color: '#fff'
			}
		},
		series: [{
			name: '维修及时率',
			type: 'pie',
			radius: '55%',
			center: ['50%', '60%'],
			data: [{
					name: '2小时内',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				},
				{
					name: '4小时内',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				},
				{
					name: '8小时内',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				},
				{
					name: '24小时内',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				},
				{
					name: '24小时以上',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				},
			],
			itemStyle: {
				emphasis: {
					shadowBlur: 10,
					shadowOffsetX: 0,
					shadowColor: 'rgba(0, 0, 0, 0.5)'
				}
			}
		}]
	};
	myChart3.setOption(option);
}

//初始化 维修状态统计
function initPie2() {
	myChart2.clear();
	myChart2.showLoading();
	var option = {
		color: ['#049FF2', '#FDC744'],
		title: {
			text: '维修状态统计',
			x: 'center',
			textStyle: {
				color: '#fff'
			}
		},
		tooltip: {
			trigger: 'item',
			formatter: "{a} <br/>{b} : {c} ({d}%)"
		},
		legend: {
			orient: 'vertical',
			top: 26,
			left: 20,
			data: ['已维修', '待维修'],
			textStyle: {
				color: '#fff'
			}
		},
		series: [{
			name: '维修数量',
			type: 'pie',
			radius: '55%',
			center: ['50%', '60%'],
			data: [{
					name: '已维修',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				},
				{
					name: '待维修',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				},
			],
			itemStyle: {
				emphasis: {
					shadowBlur: 10,
					shadowOffsetX: 0,
					shadowColor: 'rgba(0, 0, 0, 0.5)'
				}
			}
		}]
	};
	myChart2.setOption(option);
}

//初始化 报修统计
function initPie1() {
	myChart1.clear();
	myChart1.showLoading();
	var option = {
		color: ['#FDC744', '#049FF2'],
		title: {
			text: '报修统计',
			x: 'center',
			textStyle: {
				color: '#fff'
			}
		},
		tooltip: {
			trigger: 'item',
			formatter: "{a} <br/>{b} : {c} ({d}%)"
		},
		legend: {
			orient: 'vertical',
			top: 26,
			left: 20,
			data: ['设备报修', '日常报修'],
			textStyle: {
				color: '#fff'
			}
		},
		series: [{
			name: '报修数量',
			type: 'pie',
			radius: '55%',
			center: ['50%', '60%'],
			data: [{
					name: '设备报修',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				},
				{
					name: '日常报修',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				}
			],
			itemStyle: {
				emphasis: {
					shadowBlur: 10,
					shadowOffsetX: 0,
					shadowColor: 'rgba(0, 0, 0, 0.5)'
				}
			}
		}]
	};
	myChart1.setOption(option);
}

//初始化 工单数量统计
function initPie0() {
	myChart0.clear();
	myChart0.showLoading();
	var option = {
		color: ['#FDC744', '#049FF2', '#ACA1F0'],
		title: {
			text: '工单数量统计',
			x: 'center',
			textStyle: {
				color: '#fff'
			}
		},
		tooltip: {
			trigger: 'item',
			formatter: "{a} <br/>{b} : {c} ({d}%)"
		},
		legend: {
			orient: 'vertical',
			top: 26,
			left: 20,
			data: ['微信', '电话', 'APP'],
			textStyle: {
				color: '#fff'
			}
		},
		series: [{
			name: '工单量',
			type: 'pie',
			radius: '55%',
			center: ['50%', '60%'],
			data: [{
					name: '微信',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				},
				{
					name: '电话',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				},
				{
					name: 'APP',
					value: 0,
					label: {
						normal: {
							formatter: "{d}%"
						}
					}
				}
			],
			itemStyle: {
				emphasis: {
					shadowBlur: 10,
					shadowOffsetX: 0,
					shadowColor: 'rgba(0, 0, 0, 0.5)'
				}
			}
		}]
	};
	myChart0.setOption(option);
}