xieshengjie
/
gdsx


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388
							<%@ 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/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" />
<link rel="stylesheet"	href="<%=request.getContextPath()%>/resource/css/ztree/zTreeStyle.css"	type="text/css">	
<script	src="<%=request.getContextPath()%>/resource/js/ztree/jquery.ztree.all.min.js"	type="text/javascript"></script>
<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>
<style type="text/css">
.normal {
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-style: solid;
	border-top-color: #ffffff;
	border-left-color: #c1c1c1;
	border-right-color: #c1c1c1;
	border-bottom-color: #c1c1c1;
	border-width: 1px;
	width: 100px;
	height: 28px;
	float: left;
	margin-top: -1px;
	cursor: pointer;
	text-align: center;
	line-height: 28px;
	overflow: hidden;
	font-weight: bold;
	font-size: 12px;
	font-family: tahoma, arial, verdana, sans-serif;
}

.disable {
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-style: solid;
	border-top-color: #c1c1c1;
	border-left-color: #c1c1c1;
	border-right-color: #c1c1c1;
	border-bottom-color: #c1c1c1;
	border-width: 1px;
	width: 100px;
	height: 25px;
	float: left;
	margin-top: -1px;
	cursor: pointer;
	text-align: center;
	background-color: #e1e1e1;
	line-height: 25px;
	overflow: hidden;
	font-weight: bold;
	font-size: 12px;
	font-family: tahoma, arial, verdana, sans-serif;
}

.panelcontainer {
	width: 100%;
	height: 70px;
	border-style: solid;
	border-color: #C1C1C1;
	border-width: 1px;
}

.panelquery {
	width: 100%;
	height: 25px;
	background-color: #c1c1c1;
	line-height: 25px;
}

.panelquerytext {
	margin-left: 3px;
	font-weight: bold;
	font-size: 12px;
	font-family: tahoma, arial, verdana, sans-serif;
}

.querycondcontainer {
	line-height: 39px;
	padding: 3px;
	float: left;
	font-size: 12px;
}
</style>

<script type="text/javascript">

function queryData(){
	/*var year = $("#year").val();
	var month = $("#month").val();
	var windfarm=$("#windfarm").val();
	if (windfarm == "") {
		alert("请选择风场！");
		return;
	}
	if (year == "") {
		alert("请选择开始时间!");
		return;
	}
	if (month == "") {
		alert("请选择开始时间!");
		return;
	}	
	var temp = "analysismonthlist.action?windfarm=" + windfarm  + "&year=" + year + "&month=" + month;
	var url = encodeURI(encodeURI(temp));
			$("#gridTable").setGridParam({url:url}).trigger("reloadGrid"); */
			
			$("#gridTable").jqGrid('GridUnload');	
			showJqGrid();	
			
	createPolarChat();
	}


var series;
var options1;
var options2;
var chart1;
var chart2;
$(document).ready(function () {
initial();
showJqGrid();
createPolarChat();

});
function initial()
{
	$("#windfarm").attr("value", '<s:property value="windfarm"/>');
	$("#year").attr("value", '<s:property value="year"/>');
	$("#month").attr("value", '<s:property value="month"/>');
	/******************************************玫瑰图1***********************************************/
	options1 = {
		 chart: {
		 	renderTo : 'fzy1',
	        polar: true,
	        type: 'area'
	    },
	    
	    title: {
	        text: '',
	        x: 0
	    },
	    
	    pane: {
	    	size: '80%'
	    },
	    
	    xAxis: {
	        categories: ['发电量排行', '上网电量排行', '利用小时排行', '设备可利用率排行','综合场用电率排行', '等效可利用率排行'
			],
	        tickmarkPlacement: 'on',
	        lineWidth: 0
	    },
	        
	    yAxis: {
	        gridLineInterpolation: 'polygon',
	        lineWidth: 0,
	        min: 0
	    },
	    
	    tooltip: {
	    	shared: true,
	        pointFormat: '<span style="color:{series.color}"> <b>{point.y:,.0f}</b><br/>'
	    },
	   
	    
	    series: [{
	        name: '月排行区域分析',
	        data: [],
	        pointPlacement: 'on'
	    }]
	}
	/******************************************玫瑰图2**********************************************/
	options2 = {
		 chart: {
		 	renderTo : 'fzy2',
	        polar: true,
	        type: 'area'
	    },
	    
	    title: {
	        text: '',
	        x: 0
	    },
	    
	    pane: {
	    	size: '80%'
	    },
	    
	    xAxis: {
	        categories: ['发电量排行', '上网电量排行', '利用小时排行', '设备可利用率排行','综合场用电率排行', '等效可利用率排行'
			],
	        tickmarkPlacement: 'on',
	        lineWidth: 0
	    },
	        
	    yAxis: {
	        gridLineInterpolation: 'polygon',
	        lineWidth: 0,
	        min: 0
	    },
	    
	    tooltip: {
	    	shared: true,
	        pointFormat: '<span style="color:{series.color}"> <b>{point.y:,.0f}</b><br/>'
	    },
	   
	    
	    series: [{
	        name: '年排行区域分析',
	        data: [],
	        pointPlacement: 'on'
	    }]
	}
}


function createPolarChat()
{

	var year = $("#year").val();
	var month = $("#month").val();
	var windfarm = $("#windfarm").val();

	
/******************************************玫瑰图2**********************************************/
	var url = "yeartop1.action?windfarm=" + windfarm
				+ "&year=" + year+ "&month=" + month ;
		$.ajax( {
		url : url,
		type : "post",
		cache : false,
		dataType : "json",
		data : {},
		ifModified : false,
		success : function(result) {
			var data1 = [];
		
			if(result !=null)
			{
				$.each(result.data, function(m, obj) {
				if (obj.data1 != null) {
					data1.push(parseFloat(obj.data1));
				}
				
				});
				if(null !=options2.series[0])
				{
				options2.series[0].data = data1;
				}
				chart2 = new Highcharts.Chart(options2);
			}
			
		}
			
		});

}

function showJqGrid() {

	var year = $("#year").val();
	var month = $("#month").val();
	var windfarm = $("#windfarm").val();
	var temp = "analysismonthlist.action?windfarm=" + windfarm+ "&year=" + year + "&month=" + month;
	var url = encodeURI(encodeURI(temp));
var id = 'gridTable';


var datatype = 'json';

var colNames = ['发电量', '上网电量','功率','风速','利用小时','设备可利用率'
				, '等效可利用率','综合场用电率','故障损失电量','维护损失电量','限电损失电量'
				, '性能损失电量'
				];

var colModel = [

{ name: 'monthgc', index: 'monthgc', width: 120, align: 'center'},
{ name: 'monthge', index: 'monthge', width: 120, align: 'center'},
{ name: 'power', index: 'power', width: 120, align: 'center'},
{ name: 'speed', index: 'speed', width: 120, align: 'center'},
{ name: 'monthlyxs', index: 'monthlyxs', width: 120, align: 'center'},
{ name: 'monthsbklyl', index: 'monthsbklyl', width: 120, align: 'center'},
{ name: 'monthdxkyxs', index: 'monthdxkyxs', width: 120, align: 'center'},
{ name: 'monthzhcydl', index: 'monthzhcydl', width: 120, align: 'center'},
{ name: 'lossofpower2', index: 'lossofpower2', width: 120, align: 'center'},
{ name: 'lossofpower3', index: 'lossofpower3', width: 120, align: 'center'},
{ name: 'lossofpower1', index: 'lossofpower1', width: 120, align: 'center'},
{ name: 'lossofpower4', index: 'lossofpower4', width: 120, align: 'center'}
];

var caption = '风电场历史月信息查看';

var sortname = 'monthgc';

var gridPagerID ='gridPager';

var sortorder='desc';

var height='auto';

var width='auto';


var rownumbers=true;

var multiselect=false;

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

}


</script>
<style type="text/css">


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="analysisindex.action" method="post" id="f1">

<fieldset style="height: 60px" id="fst">
    <legend class="item_Name">查询条件</legend>
   <table width="500px" 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="windfarm" name="windfarm" 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',isShowWeek:true,readOnly:true})" 
			id="year" name="year" 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:'MM',isShowWeek:true,readOnly:true})" 
			id="month" name="month" title="月" onchange="javascript:queryData();"/>
		</td>
	</tr>
</table>

 </fieldset>

<br/>

<table id='gridTable' >

</table>

<div id='gridPager'></div>
<br/>
<div id="fzy2"
		style="background-color: '#ffffff';  width: 1445px; height: 400px;float: left;"></div>
		<div   style="clear:both"></div>  
		

</form>

</body>