function showReport(){
	var html = T( $('#tmpl-proreport').html() );
	$('body').append( html );
	$('#proreportMask').fadeIn(100).css('width',$(document).width());
	
	var data = [];
	var report1 = {
		title:"剩余单子完成情况",
		width:900,
		d:{"已完成":0,"未完成":0}
	};
	// data.push(report1);
	
	var report2 = {
		title:"未完成标签",
		width:900,
		d:{}
	};
	data.push(report2);
	
	var report3 = {
		title:"未完成人员",
		width:900,
		d:{}
	};
	data.push(report3);

	var isQA = false;

	// if(window.MYINFO && window.MYINFO.legulabel && window.MYINFO.legulabel.indexOf('QA') != -1) {
	// 	isQA = true;
	// 	var report4 = {
	// 		title: "问题类型（当月）",
	// 		d: {}
	// 	};
	// 	data.push(report4);
	// }
	
	for(var cardId in DATA.cards){
		if( DATA.cards[ cardId ].boardId != DATA.boardid)continue;
		if( DATA.cards[ cardId ].archived)continue;
		var _listid = DATA.cards[ cardId ].listId;
		if( !DATA.lists[_listid] || DATA.lists[_listid].archived )continue;
		
		if( DATA.cards[ cardId ].title.indexOf('~~') == -1 ){
			report1.d['未完成'] ++ ;
			
			var labels = DATA.cards[ cardId ].labelIds;
			labels.forEach(function(lid){
				var linfo = getLabelInfo(DATA.boardid,lid);
				if (linfo){
					var _name = linfo.name;
					if(report2.d[_name]==null)report2.d[_name]=0;
					report2.d[_name]++;
				}

			});
			
			var members = DATA.cards[ cardId ].members;
			members.forEach(function(uid){
				var uinfo = getUserInfo(uid);
				if(!uinfo)return;
				var _name = uinfo.profile.fullname;
				if(report3.d[_name]==null)report3.d[_name]=0;
				report3.d[_name]++;
			});
		}else{
			report1.d['已完成'] ++ ;
		}

		if (!isQA){
			continue
		}


	}
	// console.log('data',data);
	fmtChar(data);
	// QA的问题类型标签
	fmtCharQALables();

	showRemainList();

	$.get('?app=api&apiact=finishcount&boardid='+DATA.boardid,function(txt){
		var j = JSON.parse(txt);
		html = ('<h3 class="card-details-item-title">新增及完成统计</h3>\
            <div id="reportcf" style="height:600px;"></div>\
            <hr/>');
        $('#reportdata').append(html);
        var myChart = echarts.init(document.getElementById('reportcf'));
        var option = {
		    legend: {
		        data:j.title
		    },
		     tooltip : {
		        trigger: 'axis'
		    },
		    calculable : true,
		    xAxis : [
		        {
		            type : 'value',
		            boundaryGap : [0, 0.01]
		        }
		    ],
		    yAxis : [
		        {
		            type : 'category',
		            data : j.day
		        }
		    ],
		    series : [
		        {
		            name:j.title[0],
		            type:'bar',
		            data:j.create
		        },
		        {
		            name:j.title[1],
		            type:'bar',
		            data:j.finish
		        }
		    ]
		};
        myChart.setOption(option);
	})
}


function fmtCharQALables(act) {
	var act = act || '';
	if(window.MYINFO && window.MYINFO.legulabel && window.MYINFO.legulabel.indexOf('QA') != -1) {
		$.get('?app=api&apiact=reportQALables&boardid='+DATA.boardid + '&act=' + act,function(txt){
			var j = JSON.parse(txt);
			html = ('<h3 class="card-details-item-title">问题类型</h3>\
			<div id="lastMonthQALables">上月</div>\
            <div id="reportQALables" style="height:600px;"></div>\
            <hr/>');
			if (!$('#reportQALables').html()){
				$('#reportdata').append(html);
			}

			var boardName = '';
			if(DATA.boardid && DATA.boards && DATA.boards[ DATA.boardid ]){
				var board = DATA.boards[ DATA.boardid ];
				boardName = board.title;
			}
			var allNum = 0;

			for(var d in j.data){
				allNum += j.data[d].value;
			}

			var date = new Date;

			var year = date.getFullYear();
			var month = date.getMonth()+1;

			var dateTxt = year + "年" + month + "月";
			if (act == 'lastmonth'){
				dateTxt = getLastMonth();
			}

			var myChart = echarts.init(document.getElementById('reportQALables'), null);
			var option = {
				title : {
					text: boardName + ' ' + dateTxt,
					subtext: '已验收分类的单子数量：' + allNum,
					x:'center'
				},
				tooltip : {
					trigger: 'item',
					formatter: "{a} <br/>{b} : {c} ({d}%)"
				},
				legend: {
					orient : 'vertical',
					x : 'left',
					data:j.title
				},
				toolbox: {
					show : true,
					feature : {
						mark : {show: true},
						dataView : {show: true, readOnly: false},
						magicType : {
							show: true,
							type: ['pie', 'funnel'],
							option: {
								funnel: {
									x: '25%',
									width: '50%',
									funnelAlign: 'left',
									max: 1548
								}
							}
						},
						restore : {show: true},
						saveAsImage : {show: true}
					}
				},
				calculable : true,
				series : [
					{
						name:'问题类型',
						type:'pie',
						minAngle:5,
						avoidLabelOverlap:true,
						radius : '55%',
						center: ['50%', '50%'],
						data:j.data,
						label: {
							normal: {
								formatter: "{b} : {c} ({d}%)",

							}
						},
					}
				]
			};

			myChart.setOption(option);
		})
	}
}

function closeProreport(){
	$('#proreportMask').remove();
	$('#proreport').remove();
}
function fmtChar(datas){
	for(var i=0;i<datas.length;i++){
		var fd = datas[i];
		
		html = ('<h3 class="card-details-item-title">'+ fd.title +'</h3>\
            <div id="report'+ i +'" style="height: '+ (fd.height|| 600) +'px;;"></div>\
            <hr/>');
        $('#reportdata').append(html);
        
        var myChart = echarts.init(document.getElementById('report'+i));
        var option = {

		    tooltip : {
		        trigger: 'item',
		        formatter: "{a} <br/>{b} : {c} ({d}%)"
		    },
		    legend: {
		        orient: 'vertical',
		        left: 'left',
		        data: ['已完成','未完成']
		    },
		    series : [{
	            name: '完成情况',
	            type: 'pie',
	            radius : '55%',
	            center: ['50%', '50%'],
	            label: {
	                normal: {
	                    formatter: '{a|{a}}{abg|}\n{hr|}\n  {b|{b}：}{c}  {per|{d}%}  ',
	                    backgroundColor: '#eee',
	                    borderColor: '#aaa',
	                    borderWidth: 1,
	                    borderRadius: 4,
	                    rich: {
	                        a: {
	                            color: '#999',
	                            lineHeight: 22,
	                            align: 'center'
	                        },
	                        hr: {
	                            borderColor: '#aaa',
	                            width: '100%',
	                            borderWidth: 0.5,
	                            height: 0
	                        },
	                        b: {
	                            fontSize: 12,
	                            lineHeight: 21
	                        },
	                        per: {
	                            color: '#eee',
	                            backgroundColor: '#334455',
	                            padding: [1, 2],
	                            borderRadius: 2
	                        }
	                    }
	                }
	            },
	            data:[
	                {value:335, name:'已完成'},
	                {value:310, name:'未完成'}
	            ],
	            itemStyle: {
	                emphasis: {
	                    shadowBlur: 10,
	                    shadowOffsetX: 0,
	                    shadowColor: 'rgba(0, 0, 0, 0.5)'
	                }
	            }
		    }]
		};
		
		
		option.series[0].name = fd.title;
		var _data = [];
		for(var _k in fd.d){
			_data.push({name: _k , value :fd.d[_k]*1 });
		}
		_data.sort(function(a,b){
			return b.value - a.value;
		});
		
		_data = _data.splice(0,10);
		
		var _dlist = [];
		_data.forEach(function(_v){
			_dlist.push( _v.name );
		});
		
		option.legend.data = _dlist;
		
		option.series[0].data = _data;
		myChart.setOption(option);
	}
}


// 新的项目单子完成情况饼图
function showRemainList(act){
	var act = act || '';
	var myChart = echarts.init(document.getElementById('remainlist'), null);

	$.get('?app=api&apiact=reportshowRemainList&boardid='+DATA.boardid + '&act=' + act,function(txt) {
		var j = JSON.parse(txt);

		var option = {
			title: {
				text: '剩余单子',
				subtext: '全部单子数量：'+ j.allnum,
				x: 'center'
			},
			tooltip: {
				trigger: 'item',
				formatter: "{a} <br/>{b} : {c} ({d}%)"
			},
			legend: {
				orient: 'vertical',
				x: 'left',
				data: j.title
			},
			toolbox: {
				show: true,
				feature: {
					mark: {show: true},
					dataView: {show: true, readOnly: false},
					magicType: {
						show: true,
						type: ['pie', 'funnel'],
						option: {
							funnel: {
								x: '25%',
								width: '50%',
								funnelAlign: 'left',
								max: 1548
							}
						}
					},
					restore: {show: true},
					saveAsImage: {show: true}
				}
			},
			calculable: true,
			series: [
				{
					name: '问题类型',
					type: 'pie',
					minAngle: 5,
					avoidLabelOverlap: true,
					radius: '55%',
					center: ['50%', '50%'],
					data: j.data,
					label: {
						normal: {
							formatter: "{b} : {c} ({d}%)",

						}
					},
				}
			]
		};

		myChart.setOption(option);
	})
}


$(function(){
	$('body').on("click","#proreportMask",function(){
		closeProreport();
	}); 
	$('body').on("click","#cardreportClose",function(){
		closeProreport();
	});

	// qa标签 上月
	$('body').on("click","#lastMonthQALables",function(){
		fmtCharQALables('lastmonth');
	});
	$('body').on("click","#lastMonthRemainList",function(){
		showRemainList('lastmonth');
	});


});



function getLastMonth() {//获取上个月日期
	var date = new Date;
	var year = date.getFullYear();
	var month = date.getMonth();
	if (month == 0) {
		year = year - 1;
		month = 12;
	}
	return year + "年" + month + "月";
}