xieshengjie
/
gdhb


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417
							<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@include file="/pages/includes/taglibs.jsp" %>
<head>
<script type="text/javascript" src="<%=request.getContextPath() %>/resource/js/jquery-1.8.3.js"></script>
 <script type="text/ecmascript" src="<%=request.getContextPath() %>/resource/plugin/jqgrid/js/jquery.jqGrid.min.js"></script>
 <script type="text/ecmascript" src="<%=request.getContextPath() %>/resource/plugin/jqgrid/js/i18n/grid.locale-cn.js"></script>
<script type="text/javascript"	src="<%=request.getContextPath()%>/resource/plugin/highslide/highslide-with-html.js"></script>
 <link rel="stylesheet" type="text/css"	href="<%=request.getContextPath()%>/resource/plugin/highslide/highslide.css" />
<script type="text/ecmascript" src="<%=request.getContextPath()%>/resource/js/system/jqdatagrid.js"></script>
<script src="<%=request.getContextPath()%>/resource/js/datePicker/WdatePicker.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="<%=request.getContextPath() %>/resource/plugin/jqueryui/css/custom-theme/jquery-ui-1.9.2.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="<%=request.getContextPath() %>/resource/plugin/jqgrid/css/ui.jqgrid.css" />
<script	src="<%=request.getContextPath()%>/resource/js/highcharts/highcharts.src.js"	type="text/javascript"></script>
<script	src="<%=request.getContextPath()%>/resource/js/highcharts/highcharts-more.js">	</script>
<script	src="<%=request.getContextPath()%>/resource/js/highcharts/modules/solid-gauge.src.js"></script>
<style type="text/css">

a.url{      /* 统一设置所以样式 */
     font-family:Arial;
     font-size:12px;
     text-align:center;
     margin:3px;
}
a:link.url ,a:visited.url{  /* 超链接正常状态、被访问过的样式 */
    color:#000000;
    padding:4px 10px 4px 10px;
    background-color:#f1f1f1;
    text-decoration:none;
 
    border-top:1px solid #EEEEEE; /* 边框实现阴影效果 */
    border-left:1px solid #EEEEEE;
    border-bottom:1px solid #717171;
    border-right:1px solid #717171;
}
a:hover.url{       /* 鼠标指针经过时的超链接 */
    color:#821818;     /* 改变文字颜色 */
    padding:5px 8px 3px 12px;  /* 改变文字位置 */
    background-color:#e2c4c9;  /* 改变背景色 */
    border-top:1px solid #717171; /* 边框变换，实现“按下去”的效果 */
    border-left:1px solid #717171;
    border-bottom:1px solid #EEEEEE;
    border-right:1px solid #EEEEEE;
}

fieldset legend {  
    color:#302A2A;  
    font: bold 16px/2 Verdana, Geneva, sans-serif;  
    font-weight: bold;  
    text-align: left;  
    text-shadow: 2px 2px 2px rgb(88, 126, 156);  
}  
</style>
<script type="text/javascript">
hs.graphicsDir = '<%=request.getContextPath()%>/resource/plugin/highslide/graphics/';
hs.outlineType = 'rounded-white';
hs.wrapperClassName = 'draggable-header';

	  var options1;
        var chart1;
		function changeFc(type){
   		var url1 = "windfarmAjax.action?type="+type;

   		$.ajax({
			type:"post",
			url:url1,
			dataType:"json",
			success: function(data){
				if(data.length != 0){
					eval(data);
					$("#wpId").empty();
					$("#wpId").append("<option value=''>请选择</option>"); 
				
					for(var i=0; i<data.length; i++){
						$("#wpId").append("<option value='"+data[i].id+"'>"+data[i].name+"</option>"); 
					}
					
				}else{
					$("#wpId").append("<option value=''>请选择</option>"); 
					$("#wpId").addOption("请选择","");
				}
				
				queryData();
	  		}		
		});
		
		
	}
	function queryData(){
		 if("" == $("#beginDate").val()){
			alert("请选择查询开始日期!");
		}else if("" == $("#endDate").val()){
			alert("请选择查询结束日期!");
		}
		else{
			
			//var wpId=$("#wpId").find("option:selected").val(); 
			//var beginDate=$("#beginDate").val(); 
			//var endDate=$("#endDate").val(); 
			//var url = '<%=request.getContextPath() %>/charts/fittingtoplist1.action?wpId='+wpId
			//		 +"&beginDate="+beginDate +"&endDate="+endDate;
			//$("#gridTable").setGridParam({url:url}).trigger("reloadGrid");
			$("#gridTable").jqGrid('GridUnload');	
			showJqGrid();	
		}
	}
	
	function toExcel() {
	  if("" == $("#beginDate").val()){
			alert("请选择查询开始日期!");
		}else if("" == $("#endDate").val()){
			alert("请选择查询结束日期!");
		}
		else{
		
			var wpId=$("#wpId").find("option:selected").val(); 
			var beginDate=$("#beginDate").val(); 
			var endDate=$("#endDate").val(); 
			var url = '<%=request.getContextPath() %>/charts/fittingtopExcel.action?wpId='+wpId
					 +"&beginDate="+beginDate +"&endDate="+endDate;
			$('#toexcel').attr('href',url); 
		}
	}
	
$(document).ready(function () {

showJqGrid();

 options1={
        	chart: {
				renderTo: 'container',
				type: 'spline'
			},
			title: {
				text: '风功率曲线'
			},
			tooltip: {
			crosshairs:{//控制十字线  
				              	width:2  
				          	 },
            	crosshairs: true,
            	shared: true
        	},
        	credits: {
       			enabled: false
      			},
      			  plotOptions: {
				         	spline: {
				                  		dataLabels : {  
				                            enabled :false  
				                        },  
				                      // pointPadding: 0.2,
				                       borderWidth: 0
				                  },
				             series: {
				                 cursor: 'pointer',
				                 marker: {
				                     radius: 0, 
				                     symbol: 'circle' //曲线点类型："circle", "square", "diamond", "triangle","triangle-down"，默认是"circle"
				                 }
				             }
				         },
        	xAxis: {
				          		labels: {
				          			align: 'center'
				                },
				                categories:[3.0,3.5,4.0,4.5,5.0,5.5,6.0,6.5,7.0,7.5,8.0,8.5,9.0,9.5,10.0,10.5,11.0,11.5,12.0,12.5,13.0,13.5,14.0,14.5,15.0,15.5,16.0,16.5,17.0,17.5,18.0,18.5,19.0,19.5,20.0,20.5,21.0,21.5,22.0,22.5,23.0,23.5,24.0,24.5,25.0]
				         },
			yAxis: [{
				             title: {
				                 text: '功率(kW)'
				             },lineWidth : 1
				         }],
        	legend: {
				
				align: 'center',
				verticalAlign: 'bottom'
			}
        };

});

 function queryChart(){
        	var bd=$("#beginDate").val();
        	var ed=$("#endDate").val();
 
        	var wtIds="";
        	
      		var arr=$("#gridTable").jqGrid('getGridParam', 'selarrrow');
          	var i=0;
          	
         	 $.each(arr,function(n,value) {   
            
           		var temp= $("#gridTable").jqGrid('getCell',value,'windturbine');
               	 i++;
                 wtIds += temp+","
            })
            wtIds=wtIds.substring(0,wtIds.length-1);
            if(i>10)
        			{
                		alert("一次最多能选择十台风机！");
        				
        	}else
        	{
        		if(wtIds==""){
        		alert("请选择风场！");
        		return;
        	}
        	
        	if(bd==""){
        		alert("请选择开始时间!");
        		return;
        	}
        	if(ed==""){
        		alert("请选择结束时间！");
        		return;
        	}
        	$.ajax({
			url : "queryAp.action?wtIds="+wtIds+"&beginDate="+bd+"&endDate="+ed,
			type : "post",
			cache : false,
			dataType : "json",
			data : {},
			ifModified : false,
			success : function(res) {
				var serNames=[];
				var speed=res["speed"];
				
				
				$.each(res["sers"],function(m,obj){
					serNames.push(obj);
					}
				);
		
					chart1 = new Highcharts.Chart(options1);
					
				for(var j=0;j<serNames.length;j++){
					var ser={
						type: 'spline',
			          	 name: serNames[j],
			          	data:res[serNames[j]],
			          	 yAxis:0
					};
					
					chart1.addSeries(ser);
				}
				
				//////////dialog test///////
				showDiv1();
				////////////////////////////
			}
		});
        	}
        	
 }
 
 function showDiv1() {
var hc = $("#container");

//	return hs.htmlExpand(obj, {
	return  hs.htmlExpand(hc[0], {
		contentId : 'showDiv2',
		width : 1000,
		height : 600,
		align : 'center',
		headingText : '风功率曲线'
	});
}
function showJqGrid() {
	
			var wpId=$("#wpId").find("option:selected").val(); 
			var beginDate=$("#beginDate").val(); 
			var endDate=$("#endDate").val(); 
var id = 'gridTable';

var url = '<%=request.getContextPath() %>/charts/fittingtoplist1.action?wpId='+wpId
					 +"&beginDate="+beginDate +"&endDate="+endDate;

var datatype = 'json';

var colNames = ['风场', '风机','编码','起始日期','截至日期','平均风速','拟合优度'];

var colModel = [

{ name: 'windfarm', index: 'windfarm', width: 200, align: 'center'},
{ name: 'windturbine', index: 'windturbine', width: 200, align: 'center',hidden : true},
{ name: 'code', index: 'code', width: 80, align: 'center'},
{ name: 'beginDate', index: 'beginDate', width: 250, align: 'center',formatter:'date', formatoptions:{newformat:'Y-m-d'},align:'center'},
{ name: 'endDate', index: 'endDate', width: 250, align: 'center',formatter:'date', formatoptions:{newformat:'Y-m-d'},align:'center'},
{ name: 'speed', index: 'speed', width: 200, align: 'center', formatter:'number', formatoptions:{decimalPlaces: 2},sorttype: 'int'},
{ name: 'power', index: 'power', width: 200, align: 'center', formatter:'number', formatoptions:{decimalPlaces: 2},sorttype: 'int' }
];

var caption = '拟合优度排行榜';


var sortname = 'power';

var gridPagerID ='gridPager';

var sortorder='desc';

var height='auto';

var width='auto';

var rownumbers=true;

var multiselect=true;

myJqGrid(id, url, datatype, colNames, colModel, caption,  sortname, gridPagerID,sortorder,height,width,
multiselect,rownumbers);
}


</script>
<style type="text/css">
 {      /* 统一设置所以样式 */
     font-family:Arial;
     font-size:12px;
     text-align:center;
     margin:3px;
}
a:link.url ,a:visited.url{  /* 超链接正常状态、被访问过的样式 */
    color:#000000;
    padding:4px 10px 4px 10px;
    background-color:#f1f1f1;
    text-decoration:none;
 
    border-top:1px solid #EEEEEE; /* 边框实现阴影效果 */
    border-left:1px solid #EEEEEE;
    border-bottom:1px solid #717171;
    border-right:1px solid #717171;
}
a:hover.url{       /* 鼠标指针经过时的超链接 */
    color:#821818;     /* 改变文字颜色 */
    padding:5px 8px 3px 12px;  /* 改变文字位置 */
    background-color:#e2c4c9;  /* 改变背景色 */
    border-top:1px solid #717171; /* 边框变换，实现“按下去”的效果 */
    border-left:1px solid #717171;
    border-bottom:1px solid #EEEEEE;
    border-right:1px solid #EEEEEE;
}


fieldset legend {  
    color:#302A2A;  
    font: bold 16px/2 Verdana, Geneva, sans-serif;  
    font-weight: bold;  
    text-align: left;  
    text-shadow: 2px 2px 2px rgb(88, 126, 156);  
}  
</style>
</head>
<body>

<form action="fittingtopindex.action" method="post" id="f1">
<div class="highslide-html-content" id="showDiv2" style="width: 1100">
			<div class="highslide-header">
				<ul>
					<li class="highslide-move">
						<a href="#" onclick="return false">Move</a>
					</li>
					<li class="highslide-close" >
						<a href="#" onclick="return hs.close(this)"></a>
					</li>
				</ul>
			</div>
			<div  class="highslide-body"   id="container" style="width: 1000px">

			</div>
		</div>
<fieldset style="height: 60px" id="fst">
    <legend class="item_Name">查询条件</legend>
   <table width="1000px" cellpadding="0" cellspacing="0" class="dataform">
	<tr>
		
		<th width="100px" class="item_Name">
			风场:
		</th>
		<td width="100px" class="item_Name">
			<s:select  list="wps" cssStyle="width:100px" listKey="id" listValue="name" id="wpId" name="wpId" headerKey="" headerValue="请选择" onchange="javascript:queryData();"></s:select>
		</td>
	
		<th width="100px" class="item_Name">
			开始日期
		</th>
		<td width="100px" style="text-align: left">
			<s:textfield cssClass="Wdate" onFocus="WdatePicker({dateFmt:'yyyy-MM-dd',isShowWeek:true,readOnly:true})" 
			id="beginDate" name="beginDate" title="开始日期" onchange="javascript:queryData();"/>
		</td>
		<th width="100px" class="item_Name">
			结束日期
		</th>
		<td width="100px" style="text-align: left">
			<s:textfield cssClass="Wdate" onFocus="WdatePicker({dateFmt:'yyyy-MM-dd',isShowWeek:true,readOnly:true})" 
			id="endDate" name="endDate" title="结束日期" onchange="javascript:queryData();"/>
		</td>
		<td width="200px" style="text-align: right">
		
			<a href="#" onclick="javascript:queryChart();" class="url"  >生成曲线</a>
			<a href="#" onclick="javascript:toExcel();"  class="url"  id="toexcel">导出</a>	
		</td>
	</tr>
</table>
  </fieldset>

<br/>

<table id='gridTable' ></table>


</form>

</body>