/**
 * Created by njcn on 2017/5/19.
 */
$(document).ready(function() {
	initSbtj();
});

var modelImage;
var factoryImage;
var voltageImage;

function initSbtj(){
	var i;
	$.ajax({
		type : "POST",
		url : "/pqs9200/device/getSbtj",
		data:{},
		dataType:"json",
		beforeSend: function () {  
            i = ityzl_SHOW_LOAD_LAYER();  
        },
		success : function(data) {
			var model = data.model;
			var area = data.area;
			var factory = data.factory;
			
			drawModel(model);
			drawArea(area);
			drawFactory(factory);
			
			if(model.length > 3){
				var mhigh = 130;
			}else{
				var mhigh = true;
			}
			
			if(area.length > 3){
				var ahigh = 130;
			}else{
				var ahigh = true;
			}
			
			if(factory.length > 3){
				var fhigh = 130;
			}else{
				var fhigh = true;
			}
			
			var table=$('#xhtj').DataTable({
				scrollX : false,
				lengthChange : false,
				destroy : true,
				searching: false,
				language : {
					url : '../json/chine.json'
				},
				scrollY: mhigh,
				paging:false,
		        info:false,
				data : model
			})
			
			var table=$('#cjtj').DataTable({
				scrollX : false,
				lengthChange : false,
				destroy : true,
				searching: false,
				language : {
					url : '../json/chine.json'
				},
				scrollY: fhigh,
				paging:false,
		        info:false,
				data : factory
			})
			
			var table=$('#qytj').DataTable({
				scrollX : false,
				lengthChange : false,
				destroy : true,
				searching: false,
				language : {
					url : '../json/chine.json'
				},
				scrollY: ahigh,
				paging:false,
		        info:false,
				data : area
			})

			//***********关闭loading
        	ityzl_CLOSE_LOAD_LAYER(i); 
		}

	});
}

function drawModel(info){
	var reaArray = new Array();
	var valueArray = new Array();
	for (var i = 0; i < info.length; i++) {
		reaArray.push(info[i][0]);
        var causeValue=new Object();
        causeValue.name=info[i][0];
        causeValue.value=info[i][1];
        valueArray.push(causeValue)
	}
	var option = {
		backgroundColor: canvasBG,//背景色
		title : {
			text : '按终端型号统计',
			x : 'center'
		},
		animation:false,
        tooltip : {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c} ({d}%)"
        },
        legend: {
            show:false,
            data: reaArray
        },
		series : [ 
			{
                name: '终端型号',
                type: 'pie',
                radius : '70%',
                center: ['50%', '53%'],
                label: {
                    normal: {
                        show: false
                    },
                    emphasis: {
                        show: false
                    }
                },
                lableLine: {
                    normal: {
                        show: false
                    },
                    emphasis: {
                        show: false
                    }
                },
                data:valueArray,
                itemStyle: {
                    emphasis: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
		]

	};

	echarts.dispose(document.getElementById('model'));
	var model = echarts.init(document.getElementById('model'));
	model.setOption(option);
	modelImage= model.getDataURL();
}

function drawFactory(info){
	var reaArray = new Array();
	var valueArray = new Array();
	for (var i = 0; i < info.length; i++) {
		reaArray.push(info[i][0]);
        var causeValue=new Object();
        causeValue.name=info[i][0];
        causeValue.value=info[i][1];
        valueArray.push(causeValue)
	}
	var option = {
		backgroundColor: canvasBG,//背景色
		title : {
			text : '按终端厂家统计',
			x : 'center'
		},
		animation:false,
        tooltip : {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c} ({d}%)"
        },
        legend: {
            show:false,
            data: reaArray
        },
		series : [ 
			{
                name: '终端厂家',
                type: 'pie',
                radius : '70%',
                center: ['50%', '53%'],
                label: {
                    normal: {
                        show: false
                    },
                    emphasis: {
                        show: false
                    }
                },
                lableLine: {
                    normal: {
                        show: false
                    },
                    emphasis: {
                        show: false
                    }
                },
                data:valueArray,
                itemStyle: {
                    emphasis: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
		]

	};

	echarts.dispose(document.getElementById('factory'));
	var factory = echarts.init(document.getElementById('factory'));
	
	factory.setOption(option);
	factoryImage= factory.getDataURL();
}

function drawArea(info){
	var reaArray = new Array();
	var valueArray = new Array();
	for (var i = 0; i < info.length; i++) {
		reaArray.push(info[i][0]);
        var causeValue=new Object();
        causeValue.name=info[i][0];
        causeValue.value=info[i][1];
        valueArray.push(causeValue)
	}
	var option = {
		backgroundColor: canvasBG,//背景色
		title : {
			text : '按区域统计',
			x : 'center'
		},
		animation:false,
        tooltip : {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c} ({d}%)"
        },
        legend: {
            show:false,
            data: reaArray
        },
		series : [ 
			{
                name: '区域',
                type: 'pie',
                radius : '70%',
                center: ['50%', '53%'],
                label: {
                    normal: {
                        show: false
                    },
                    emphasis: {
                        show: false
                    }
                },
                lableLine: {
                    normal: {
                        show: false
                    },
                    emphasis: {
                        show: false
                    }
                },
                data:valueArray,
                itemStyle: {
                    emphasis: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
		]

	};

	echarts.dispose(document.getElementById('area'));
	var area = echarts.init(document.getElementById('area'));
	area.setOption(option);
	voltageImage= area.getDataURL();
}

$('#saveImage').on(
		'click',
		function(event) {
			// 取消掉默认的事件
			event.preventDefault();
			// editor 要截取的内容区域的id

			var selectId = '#picture';
			var picName = '终端统计.png';

			html2canvas(document.querySelector(selectId), {
				// 是否允许跨域(默认是false)
				allowTaint : true,
				// 是否在渲染前测试图片(默认是true)
				taintTest : false,
				onrendered : function(canvas) {
					canvas.id = "mycanvas";
					// 生成base64图片数据
					var dataUrl = canvas.toDataURL();
					// 下载到本地
					var triggerDownload = $("<a>").attr("href",
							dataUrl).attr("download", picName)
							.appendTo("body");
					triggerDownload[0].click();
					triggerDownload.remove();
				}
			});
		});
