var oFilter={}, iFilter, aMonth=[], oTab={};
var aProduct=[], aHospital=[], aDealer=[], aRep=[], iHospital;
var iPeriod=0, aPeriod=[
	{code:"MTH", name:"上个月", month:[11]},
	{code:"QTR", name:"上季度", month:[7,8,9]},
	{code:"QTD", name:"当季累计", month:[10, 11]},
	{code:"RQ", name:"滚动季度", month:[9,10,11]},
	{code:"YTD", name:"当年累计", month:[1,2,3,4,5,6,7,8,9,10,11]},
	{code:"MAT", name:"滚动年度", month:[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]} 
];

$(document).ready( onDocumentReady );

function onDocumentReady() {
	pageInit(showDashboard);
	loadMaster();
}

function loadMaster() {
	jsonRequest("sales", "load_master", {}, onMasterResponse, "正在获取数据…请稍候");
}

function onMasterResponse(res) {
	aProduct=res.product_list;
	aHospital=res.hospital_list;
	aDealer=res.dealer_list;
	aRep=res.rep_list;
	oFilter['product']=aProduct;
	oFilter['hospital']=aHospital;
	oFilter['dealer']=aDealer;
}

/**************** FILTER ****************/

function showFilter() {
	if (!iFilter) {
		filterDate();
		filterInit("product", "产品");
		filterInit("hospital", "医院");
		filterInit("dealer", "经销商");
		filterSwitch("date");
	}
	pageGo("filter");
}	

function filterSwitch(filter) {
	tabSwitch("filter", filter);
	if (iFilter) {
		$("#filter_"+iFilter).hide();
	}
	iFilter=filter;
	$("#filter_"+iFilter).show();
}

function filterInit(series, title) {
	var html="";
	html+=div("div_filter_on", 
		div("div_filter_code", "所有")+
		div("div_filter_name", title)+
		div("div_filter_mark_on", "", "", series+"_mark_all"), 
			"filterToggle('"+series+"','all')", series+"_filter_all");
	for (var i=0; i<oFilter[series].length; i++) {
		html+=div("div_filter_off",
			div("div_filter_code", oFilter[series][i].code)+
			div("div_filter_name", oFilter[series][i].name)+
			div("div_filter_all_on", "", "", series+"_mark_"+i),
				"filterToggle('"+series+"','"+i+"')", series+"_filter_"+i);
	}
	$("#filter_"+series).html(html);
	$("#"+series+"_filter_all").data("status", "on");
	for (var i=0; i<oFilter[series].length; i++) {
		$("#"+series+"_filter_"+i).data("status", "on");
	}
}	

function filterToggle(series, index) {
	var filter=$("#"+series+"_filter_"+index);
	var b=filter.data("status");
	b=(b=="on")?"off":"on";
	filter.data("status", b);
	filter.attr("class", "div_filter_"+b);
	$("#"+series+"_mark_"+index).attr("class", "div_filter_mark_"+b);

	if (index=="all") {
		for (var i=0; i<oFilter[series].length; i++) {
			filter=$("#"+series+"_filter_"+i);
			filter.data("status",b);
			filter.attr("class", "div_filter_off");
			$("#"+series+"_mark_"+i).attr("class", "div_filter_all_"+b);
		}
	} else {
		var all=$("#"+series+"_filter_all");
		all.data("status", "off");
		all.attr("class", "div_filter_off");
		$("#"+series+"_mark_all").attr("class", "div_filter_mark_off");
	}
}

function filterDate() {
	var html="", group="", m0=11;

	if (aMonth.length==0) {
		aMonth=[m0];
	}
	for (var i=0; i<aPeriod.length; i++) {
		group+=div("div_date_item width_50p",
			div("div_date_period div_date_"+(i==iPeriod?"on":"off"), 
				aPeriod[i].name+" "+aPeriod[i].code, "setPeriod("+i+")"));
	}
	html+=div("div_date_label", "常用时间段");
	html+=div("div_date_group", group);

	group="";
	for (var q=0; q<=4; q++) {
		var qb=(q*3<=m0)?((aMonth.indexOf(q*3)>=0 && aMonth.indexOf(q*3-1)>=0 && aMonth.indexOf(q*3-2)>=0)?"on":"off"):"none";
		var qtr=q>0?q+"季度":"去年"+(q+4)+"季度";
		group+=div("div_date_item width_40p", div("div_date_quarter div_date_"+qb, qtr, "setQuarter("+q+")"));
		for (var m=q*3-2; m<=q*3; m++) {
			var mb=(m<=m0)?(aMonth.indexOf(m)>=0?"on":"off"):"none";
			var mth=m>0?m:m+12;
			group+=div("div_date_item width_20p", div("div_date_month div_date_"+mb, mth, "setMonth("+m+")"));
		}
	}
	html+=div("div_date_label", "季度-月份");
	html+=div("div_date_group", group);
	$("#filter_date").html(html);
}

function setPeriod(i) {
	iPeriod=i;
	aMonth=aPeriod[iPeriod].month;
	filterDate();
}

function setMonth(m) {
	aMonth=[m];
	iPeriod=null;
	filterDate();
}

function setQuarter(q) {
	aMonth=[q*3-2, q*3-1, q*3];
	iPeriod=null;
	filterDate();
}


/*********** CHART *********/

function optionItem(series, labels, fx) {
	var html="";
	oSwitch[series]=oSwitch[series] || "0";
	for (var i=0; i<labels.length; i++) {
		var c=(i==oSwitch[series])?"div_switch_on":"div_switch_off";
		if (i==0) {	c+=" div_switch_left";	}
		if (i==labels.length-1) {	c+=" div_switch_right";	}
		html+=div(c, labels[i], "toggleSwitch('"+series+"','"+i+"'); "+fx, "switch_"+series+"_"+i);
	}
	return div("div_option_item", html);
}

function tabSwitch(series, active) {
	var prev=oTab[series];
	if (prev != null) {
		$("#tab_"+series+"_"+prev).attr("class", "div_tab_off");
	}
	oTab[series]=active;
	$("#tab_"+series+"_"+active).attr("class", "div_tab_on");
	showVisualAid();
}

function showDashboard() {
	menuSwitch("dashboard");
	showDashboard1();
}

function showDashboard1() {
	var option=initChart("gauge", "综合达成率", "2015-Q3");
	option.series=[{name:"达成率", data: [128], tooltip: {valueSuffix: '%'} }];
	$("#chart_dashboard").highcharts(option);
	tabSwitch("dashboard","1");
}

function showDashboard2() {
	var option=initChart("waterfall", "同期比较", "2015-Q3");
	var data=[
		{name:"去年", y:80, color:option.colors[1]},
		{name:"增长", y:70, color:option.colors[2]},
		{name:"实际", y:150, isIntermediateSum:true, color:option.colors[0]},
		{name:"超额", y:-30, color:option.colors[4]}, 
		{name:"指标", y:120, isSum:true, color:option.colors[3]}
	];
	option.series[0].data=data;
	$("#chart_dashboard").highcharts(option);
	tabSwitch("dashboard",2);
}

function showDashboard3() {
	var indicator=optionItem("dashboard3_indicator", ["指标","销量"], "showDashboard3();");
 	$("#option_dashboard").html(indicator);
 
 	var option=initChart("pie", "各城市销量贡献", "2015-Q3");
    option.series.name="城市比例";
    option.series[0].data.push({name:"杭州", y:15});
    option.series[0].data.push({name:"宁波", y:14});
    option.series[0].data.push({name:"温州", y:13});
    option.series[0].data.push({name:"绍兴", y:12});
    option.series[0].data.push({name:"湖州", y:11});
    option.series[0].data.push({name:"嘉兴", y:10});
    option.series[0].data.push({name:"京华", y:9});
    option.series[0].data.push({name:"衢州", y:8});
    option.series[0].data.push({name:"台州", y:7});
    option.series[0].data.push({name:"其他", y:1});
    if (oSwitch['dashboard3_indicator']=="1") {
    	option.series[0].data[0].y=8;
    	option.series[0].data[1].y=6;
    }
	$("#chart_dashboard").highcharts(option);
	tabSwitch("dashboard",3);
}

function showDashboard4() {
	var indicator=optionItem("dashboard4_indicator", ["指标","销量"], "showDashboard4();");
 	$("#option_dashboard").html(indicator);

	var option=initChart("column", "各城市品牌销量比例", "2015-Q3");
    option.xAxis.categories=["杭州", "宁波", "温州", "绍兴", "湖州", "嘉兴", "京华", "衢州"];
    option.tooltip.pointFormat="<span style='color:{series.color}'>{series.name}</span>: <b>{point.y}</b> ({point.percentage:.0f}%)<br/>";
    option.tooltip.shared=true;
    option.plotOptions.column={stacking:"percent"};
    option.series.push({name:"立普妥", data:[5,3,4,7,2,5,4,3]});
    option.series.push({name:"博路定", data:[3,4,7,2,5,4,3,5]});
    option.series.push({name:"波立维", data:[4,7,2,5,4,3,5,3]});
    option.series.push({name:"希罗达", data:[7,2,5,4,3,5,3,4]});
    if (oSwitch['dashboard4_indicator']=="1") {
    	option.series[0].data=[1,1,1,1,1,1,1,1];
    }
	$("#chart_dashboard").highcharts(option);
	tabSwitch("dashboard",4);
}

function showTrend() {
	menuSwitch("trend");
	showTrend1();
}

function showTrend1() {
	var period=optionItem("trend1_period", ["季度", "月度"], "showTrend1();");
	var measure=optionItem("trend1_unit", ["数量","金额"], "showTrend1();");
 	$("#option_trend").html(period+measure);

	var option=initChart(null, "销量、达成率和增长率趋势", "2015 全年");
	option.yAxis=[];
	var unit=(oSwitch['trend1_unit']=="1")?"万元":"千盒";
	option.yAxis[0]={title:{text:null}, labels:{format:"{value}"+unit}, max:125};
	option.yAxis[1]={title:{text:null}, labels:{format:"{value}%"}, max:125, opposite:true};
    if (oSwitch['trend1_period']=="1") {
		option.xAxis.categories=["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"];
		option.series.push({name:"销量", type:"column", data:[70, 70, 60, 80, 90, 100, 95, 70, 75, 105, 120, 105]});
		option.series.push({name:"达成率", type:"spline", yAxis:1, data:[90, 90, 80, 100, 110, 105, 80, 70, 70, 95, 105, 95]});
		option.series.push({name:"增长率", type:"spline", yAxis:1, data:[10, 12, 15, 20, 30, 25, 15, 10, 10, 20, 15, 30]});
	} else {
		option.xAxis.categories=["Q1", "Q2", "Q3", "Q4"];
		option.series.push({name:"销量", type:"column", data:[70, 70, 60, 80]});
		option.series.push({name:"达成率", type:"spline", yAxis:1, data:[90, 90, 80, 100]});
		option.series.push({name:"增长率", type:"spline", yAxis:1, data:[10, 12, 15, 20]});
    }
	$("#chart_trend").highcharts(option);
	tabSwitch("trend",1);
}
		

function showTrend2() {
	var period=optionItem("trend2_period", ["季度", "月度"], "showTrend2();");
 	$("#option_trend").html(period);

	var option=initChart("spline");
	option.title.text="指标达成率趋势";
	option.subtitle.text="按产品细分";
	option.yAxis.title={text:null};
	if (oSwitch['trend2_period']=="1") {
		option.xAxis.categories=["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"];
		option.series.push({name:"立普妥", data:[100, 90, 110, 100, 140, 120, 110, 150, 130, 140, 160, 180]});
		option.series.push({name:"博路定", data:[80, 85, 75, 60, 60, 60, 70, 90, 110, 100, 110, 120]});
		option.series.push({name:"波立维", data:[120, 160, 140, 120, 90, 60, 60, 70, 50, 40, 30, 20]});
		option.series.push({name:"希罗达", data:[50, 60, 70, 100, 120, 150, 130, 100, 90, 100, 120, 110]});
	} else {
		option.xAxis.categories=["Q1", "Q2", "Q3", "Q4"];
		option.series.push({name:"立普妥", data:[100, 120, 130, 160]});
		option.series.push({name:"博路定", data:[80, 60, 90, 110]});
		option.series.push({name:"波立维", data:[140, 90, 60, 30]});
		option.series.push({name:"希罗达", data:[60, 150, 100, 120]});
	}
	$("#chart_trend").highcharts(option);
	tabSwitch("trend",2);
}

function showTrend3() {
	$("#option_trend").empty();
	var option=initChart("column", "去年同期销量比较", "2015 vs 2014");
	option.chart.options3d={enabled:true, alpha:15, beta:20, depth:70};
	option.plotOptions={column:{depth: 25}};	
	option.xAxis.categories=["Q1", "Q2", "Q3", "Q4"];
	option.series.push({name:"去年同期", data:[100, 120, 130, 160], lineWidth:1});
	option.series.push({name:"今年实际", data:[105, 130, 160, 100]});	
	option.colors=["rgba(255,160,60,0.8)", "rgba(0,160,255,0.8)"];
	$("#chart_trend").highcharts(option);
	tabSwitch("trend",3);
}

function showTrend4() {
	var period=optionItem("trend4_period", ["季度", "月度"], "showTrend4();");
 	$("#option_trend").html(period);
	var option=initChart("areaspline", "销量趋势", "2015 1月~12月");
	option.plotOptions.areaspline={fillOpacity:0.3};
	if (oSwitch['trend4_period']=="1") {
		option.xAxis.categories=["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"];
		option.series.push({name:"总销量", data:[70, 70, 60, 80, 90, 100, 95, 70, 75, 105, 120, 105]});
		option.series.push({name:"立普妥", data:[10, 11, 8, 12, 14, 15, 16, 18, 20, 15, 17, 12]});
	} else {
		option.xAxis.categories=["Q1", "Q2", "Q3", "Q4"];
		option.series.push({name:"总销量", data:[200, 270, 240, 330]});
		option.series.push({name:"立普妥", data:[29, 41, 54, 44]});
	}	
	$("#chart_trend").highcharts(option);
	tabSwitch("trend",4);
}

function showTeam() {
	menuSwitch("team");
	showTeam1();
}

function showTeam1() {
	var territory=optionItem("team1_territory", ["最新辖区", "历史辖区"], "showTeam1();");
 	$("#option_team").html(territory);

	var option=initChart("bubble", "成员销量、达成率、增长率", "2015 Q3");
	option.xAxis.title.text="达成率(%)";
	option.yAxis.title.text="增长率(%)";
	for (var i=0; i<5; i++) {
	    option.series[i].name=aRep[i].name;
	}
	if (oSwitch['team1_territory']=="1") {
		option.series[0].data=[[115, 10, 20]];
		option.series[1].data=[[95, 5, 15]];
		option.series[2].data=[[90, 15, 10]];
		option.series[3].data=[[115, 15, 12]];
		option.series[4].data=[[105, 20, 18]];
	} else {
		option.series[0].data=[[110, 20, 20]];
		option.series[1].data=[[90, 0, 15]];
		option.series[2].data=[[80, 20, 10]];
		option.series[3].data=[[100, 10, 12]];
		option.series[4].data=[[120, 5, 18]];
	}		
	option.series[5].name="其他";
	option.series[5].data=[[80, 0, 1]];
	$("#chart_team").highcharts(option);
	tabSwitch("team",1);
}

function showTeam2() {
 	$("#option_team").empty();
	var option=initChart("pie", "团队成员销量贡献比例", "2015-Q3");
    option.series.name="成员销量比例";
    option.series[0].data.push({name:aRep[0].name, y:20});
    option.series[0].data.push({name:aRep[1].name, y:25});
    option.series[0].data.push({name:aRep[2].name, y:30});
    option.series[0].data.push({name:aRep[3].name, y:15});
    option.series[0].data.push({name:aRep[4].name, y:10});
	$("#chart_team").highcharts(option);
	tabSwitch("team",2);
}

function showTeam3() {
 	$("#option_team").empty();
	var option=initChart("area", "团队成员销量趋势", "2015 Q1-Q4");
	option.xAxis.categories=["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"];
	option.xAxis.tickmarkPlacement="on";
	option.plotOptions.area={ stacking:"normal", lineWidth:1, lineColor:"rgba(160,160,160,0.8)", marker:{enabled:false} };
	for (var i=0; i<5; i++) {
		var d=[];
		for (var j=0; j<12; j++) {
			d.push(Math.floor(Math.random()*10+20));
		}
		option.series.push({name:aRep[i].name, data:d});
	}
	$("#chart_team").highcharts(option);
	tabSwitch("team",3);
}

function showTeam4() {
 	$("#option_team").empty();
	var option=initChart("column");
	option.title.text="指标和实际销量趋势";
	option.subtitle.text="2015 Q1~Q4";
	for (var i=0; i<5; i++) {
		option.xAxis.categories[i]=aRep[i].name;
	}
	option.yAxis.title={text:null};
	option.series.push({name:"指标", color:"rgba(120, 220, 60, 0.5)", data:[100, 120, 130, 160, 140], pointPadding:-0.3, pointPlacement:0.15});
	option.series.push({name:"实际", color:"rgba(0, 160, 255, 1)", data:[105, 90, 160, 120, 140], pointPadding:0.2, pointPlacement:-0.15});	
	$("#chart_team").highcharts(option);
	tabSwitch("team",4);
}

/*********** VIEW **********/

function loadSalesTimeline() {
	var title=["季度", "月份", "指标", "销量", "达成"];
	var width=["20%", "20%", "20%", "20%", "18%"];
	$("#div_sales_timeline_field").html(field(title, width));
	
	var html="";
	for (var q=1; q<=4; q++) {
		var targetSum=0, salesSum=0;
		for (var m=q*3-2; m<=q*3; m++) {
			var target=Math.floor(Math.random()*10)+20;
			var sales=m<=8?(Math.floor(Math.random()*10)+20):0;
			var ach=Math.floor(sales*100/target);
			var color=(ach<=90)?"#C00000":(ach>=110?"#00A000":"#606060");
			html+=div("div_row", 
				cell("","20%", "#0090FF")+
				cell(m+"月份", "20%")+
				cell(target+",000", "20%", "right")+
				cell(sales+(sales?",000":""), "20%", "right", color)+
				cell(ach+(ach?"%":""), "18%", "right", color));
			targetSum+=target;
			salesSum+=sales;
			
		}
		var ach=Math.floor(salesSum*100/targetSum) || "";
		var color=(ach<=90)?"#C00000":(ach>=110?"#00A000":"#606060");
		html+=div("div_row_blue", 
			cell(q+"季度", "20%")+
			cell("汇总", "20%")+
			cell(targetSum+",000", "20%", "right")+
			cell(salesSum+",000", "20%", "right", color)+
			cell(ach+(ach?"%":""), "18%", "right", color));
	}
	$("#div_sales_timeline_sheet").html(html);
}

function showHospital() {
	menuSwitch("hospital");
	loadSalesHospital();
}

function loadSalesHospital() {
	var width=["50%", "18%", "18%", "12%"];
	var align=["left", "right", "right", "right"];
	var title=["医院", "指标", "销量", "达成"];
	var f=field(title, width);
	$("#div_sales_hospital_field").html(f);

	var html="";
	for (var i=0; i<aHospital.length; i++) {
		var target=Math.floor(Math.random()*50)+75, sales=Math.floor(Math.random()*50)+75,ach=Math.floor(sales*100/target);
		var color=(ach<=90)?"#C00000":(ach>=110?"#00A000":"#606060");
		html+=div("div_row", 
			cell(aHospital[i].code+"-"+aHospital[i].name,"50%", "left")+
			cell(target+",000", "18%", "right")+
			cell(sales+",000", "18%", "right", color)+
			cell(ach+"%", "12%", "right", color), "iHospital="+i+"; showSalesRaw()");
	}
	$("#div_sales_hospital_sheet").html(html);
}

function showTimeline() {
	menuSwitch("timeline");
	loadSalesTimeline();
}

function showSalesRaw() {
	pageGo("raw");
	loadSalesRaw();
}

function loadSalesRaw() {
	var width=["25%", "20%", "40%", "15%"];
	var title=["日期", "产品", "经销商", "数量"];
	$("#div_sales_raw_field").html(field(title, width));
	var date=["2015-10-15", "2015-10-18", "2015-10-21", "2015-10-28", "2015-10-31"];
	
	var html="";
	for (var i=0; i<5; i++) {
		var n=Math.floor(Math.random()*20+5)*10;
		var j=Math.floor(Math.random()*aProduct.length);
		var k=Math.floor(Math.random()*aDealer.length);
		html+=div("div_row", 
			cell(date[i],"25%")+
			cell(aProduct[j].name, "20%", "left")+
			cell(aDealer[k].name, "40%", "left")+
			cell(n+"盒", "15%", "right"), "showSalesRawDetail('"+date[i]+"','"+aProduct[j].name+"','"+aDealer[k].name+"',"+n+")");
	}
	$("#div_sales_raw_sheet").html(html);
}

function showSalesRawDetail(date, product, dealer, qty) {
	var label=["编号", "流向日期", "录入日期", "产品", "经销商", "医院", "数量", "金额", "状态"];
	var content=["R1022A", date, date, product, dealer, aHospital[iHospital].name, qty+"盒", qty*25+"元", "正常"];
	var s=property(label, content);
	$("#div_sales_raw_property").html(s);	
	pageGo("raw_detail");
}