zhuhongbin
/
TMRWatchNew


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154
							<%@ page contentType="text/html; charset=utf-8" session="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>我的工作台</title>
<%@ include file="../common/header.jsp" %>
<script type="text/javascript" src="${contextPath }/js/calendar/WdatePicker.js"></script>
<script type="text/javascript" src="${contextPath}/js/highcharts.js"></script>
<script type="text/javascript" src="${contextPath}/js/exporting.js"></script>
<script type="text/javascript">
	var chart,xStr,chartHeight,chartWidth,options;
	$(document).ready( function(){
		$("input.datebox").bind("click", function() {WdatePicker();});
		setNowDate();
		chartWidth = document.body.clientWidth-10;
		chartHeight = document.body.clientHeight-60;
		queryDate();
	});
	//初始化日期
	function setNowDate(){
		var myDate = new Date();
		var year = myDate.getFullYear();
		var month = myDate.getMonth()+1;
		var day = myDate.getDate();
		var nowdate = year + "-" + month + "-" + day;
		$("#endDate").val(nowdate);
		var lastmonth = myDate.getMonth();
		var lastdate = year + "-" + lastmonth + "-" + day;		
		$("#beginDate").val(lastdate);
	}
	function leftDate(){
		var beginDate = $("#beginDate").val();
		var endDate = $("#endDate").val();
		var newbDate = checkDate(beginDate,"left");
		var neweDate = checkDate(endDate,"left");
		$("#beginDate").val(newbDate);
		$("#endDate").val(neweDate);
		queryDate();
	}
	function rightDate(){
		var beginDate = $("#beginDate").val();
		var endDate = $("#endDate").val();
		var newbDate = checkDate(beginDate,"");
		var neweDate = checkDate(endDate,"");
		$("#beginDate").val(newbDate);
		$("#endDate").val(neweDate);
		queryDate();
	}
	//查询数据
	function queryDate(){
		//获取点线图的数据
		$.ajax({
			async: false,
			type: "post",
			dataType: "json", //返回类型json
			data: "beginDate="+$("#beginDate").val()+"&endDate="+$("#endDate").val(),
			url: "${contextPath }/admin/chart/recipelist.html",
			error: function(){alert("系统错误");},
			success: function(json){
				if(json.status == "success"){
					xStr = json.Mydate;
					options = {
			            chart: {
			                type: "column",
			                height: chartHeight,
			                width: chartWidth,
			                renderTo: "container",
			            },
				        navigation: {
				            buttonOptions: {
				                enabled: false
				            }
				        },
			            title: {
			                text: "每日拌料车次"
			            },
			            xAxis: {
			                categories: xStr,
			            },
			            yAxis: {
			                min: 0,
			                title: {
			                    text: ""
			                },
			                stackLabels: {
			                    enabled: true,
			                    style: {
			                        fontWeight: "bold",
			                        color: (Highcharts.theme && Highcharts.theme.textColor) || "gray"
			                    }
			                }
			            },
			            tooltip: {
			                formatter: function() {
			                    return "<b>"+ this.x +"</b><br/>"+
			                        this.series.name +": "+ this.y +"<br/>"+
			                        "合计: "+ this.point.stackTotal;
			                }
			            },
			            plotOptions: {
			            	series: {
			                	animation: false
			            	},
			                column: {
			                    stacking: "normal",
			                    dataLabels: {
			                        enabled: true,
			                        color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || "white"
			                    }
			                }
			            },
			            series: []					
					};		
					loadChart(json.Serieslists,json.Mydate); //加载点线图	
				}
			}
		});
	}
	
	//Chart初始化
	function loadChart(Serieslists,Mydate){
		$.each(Serieslists, function(i, n){
		  	options.series.push({name:""});
			options.series[i].name = n.feedtempletName;
			options.series[i].data = n.RMydatelist;				
		});	
		chart = new Highcharts.Chart(options);
	}
</script>
</head>
<body style="background-color: #E0E0E0;">
	<div class="navfrm">		
			<span>当前位置：</span>
			<span><a href="${contextPath }/admin/welcome.html">首页</a></span>
			<span>&nbsp;>>&nbsp;</span>
			<span>配方统计</span>		
	</div>
	<table cellspacing="1" cellpadding="0" border="0" style="width: 99%;">
	  <tr>
	    <td width="10%" height="20">
	    	<input id="beginDate" name="beginDate" style="width:100px;" class="datebox" value=""/>
	    	<input id="endDate" name="endDate" style="width:100px;" class="datebox" value=""/>
	    	<input type="button" value="<" onclick="leftDate();" /><input type="button" value=">" onclick="rightDate();" />
	    	<input type="button" value="统计" onclick="queryDate()" class="sysub" />
	    </td>
	  </tr>
	  <tr>
	    <td height="20">
	    	<div id="container"></div>
	    </td>
	  </tr>
	</table>
</body>
</html>