From 3d4bcf43f592ada157e6dbd0117b28058709b56d Mon Sep 17 00:00:00 2001
From: chenjinsong <chenjinsong@nismail.iie.ac.cn>
Date: Mon, 8 Oct 2018 17:40:14 +0800
Subject: [PATCH] =?UTF-8?q?1.=E4=BF=AE=E5=A4=8D=E6=8B=93=E6=89=91=E5=A4=9A?=
 =?UTF-8?q?=E5=87=BA=E4=B8=80=E4=B8=AAnodeList=E7=9A=84=E9=97=AE=E9=A2=98?=
 =?UTF-8?q?=202.3d=E6=9C=BA=E6=88=BF=E5=BC=B9=E6=A1=86=E6=9B=B4=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 WebRoot/main.jsp                              |  41 +++--
 .../monitorData/monitorInfoListNewTopo.jsp    |   1 -
 WebRoot/page/show/nodeGroup/newShowTopo.jsp   |  17 ---
 WebRoot/page/show/showNodeRoom.jsp            | 144 +++++++++++++++++-
 4 files changed, 168 insertions(+), 35 deletions(-)

diff --git a/WebRoot/main.jsp b/WebRoot/main.jsp
index e81c4fb..e009d36 100644
--- a/WebRoot/main.jsp
+++ b/WebRoot/main.jsp
@@ -38,6 +38,8 @@
 <script language="javascript" type="text/javascript" src="<c:url value="/scrollBar/scrollBar.js"/>"></script>
 <script type="text/javascript"
 	src="<c:url value='/js/jquery-easyui-1.1.2/jquery.easyui.min.js' />"></script>
+<script language="javascript" type="text/javascript"
+			src="<c:url value='/js/raphael.js'/>"></script>
 <script type="text/javascript">
 $(function(){
 	var lang=$("#languageChange").val();
@@ -627,21 +629,30 @@ html, body {
 	document.body.style.overflowX="hidden";	
 	document.body.style.overflowY="hidden";
 </script>
+<!-- 业务逻辑拓扑弹框 -->
 <div id="nodeList" style="display:none;height:100%" scrolling="no">
-		<!-- 1为禁止查询，2为可以联想查询  此开关同main.jsp-->
-		<input type="hidden" id="lianxiangStatus" value="2" />
-		<!--<span id="title" class="color_3_tip"
-			style="width: 100%;  display: none; text-align: center;"></span>-->
-		<iframe id="I4" name="I4" height="35%" width="100%" border="0"
-			style="background: #FFFFFF; display: none;" frameborder="0" src=""
-			scrolling="no">
-			i18n_st.message.frameInfo_n81i
-		</iframe>
-		<hr id="hr" />
-		<iframe id="I5" name="I5" height="64%" width="100%" border="0"
-			style="background: #FFFFFF;" frameborder="0" src="" scrolling="auto">
-			i18n_st.message.frameInfo_n81i
-		</iframe>
-	</div>
+	<!-- 1为禁止查询，2为可以联想查询  此开关同main.jsp-->
+	<input type="hidden" id="lianxiangStatus" value="2" />
+	<!--<span id="title" class="color_3_tip"
+		style="width: 100%;  display: none; text-align: center;"></span>-->
+	<iframe id="I4" name="I4" height="35%" width="100%" border="0"
+		style="background: #FFFFFF; display: none;" frameborder="0" src=""
+		scrolling="no">
+		i18n_st.message.frameInfo_n81i
+	</iframe>
+	<hr id="hr" />
+	<iframe id="I5" name="I5" height="64%" width="100%" border="0"
+		style="background: #FFFFFF;" frameborder="0" src="" scrolling="auto">
+		i18n_st.message.frameInfo_n81i
+	</iframe>
+</div>
+<!-- 3D机房弹框 -->
+<div id="nodeBoxs" style="display:none;"></div>
+<div id="alarmInfo" style="display:none;">
+	<iframe id="I6" name="I6" height="525px" width="100%" border="0"
+		style="background: #FFFFFF;" frameborder="0" src="" scrolling="auto">
+		i18n_snr.message.frame_n81i
+	</iframe>
+</div>
 </body>
 </html>
diff --git a/WebRoot/page/detection/monitorData/monitorInfoListNewTopo.jsp b/WebRoot/page/detection/monitorData/monitorInfoListNewTopo.jsp
index 113a9ab..c5e3284 100644
--- a/WebRoot/page/detection/monitorData/monitorInfoListNewTopo.jsp
+++ b/WebRoot/page/detection/monitorData/monitorInfoListNewTopo.jsp
@@ -168,7 +168,6 @@
 }
 </style>
 		<script type="text/javascript">	
-		 parent.setDivTitle('${nodeGroupName}');
      //页面5分钟刷新一次
 		var interval;
 		$(function(){
diff --git a/WebRoot/page/show/nodeGroup/newShowTopo.jsp b/WebRoot/page/show/nodeGroup/newShowTopo.jsp
index 6715ede..7fb4d2f 100644
--- a/WebRoot/page/show/nodeGroup/newShowTopo.jsp
+++ b/WebRoot/page/show/nodeGroup/newShowTopo.jsp
@@ -46,23 +46,6 @@
 	<div>
 		<canvas  id="canvas" style="background-color:#FAFAFA; border:1px solid #444;display:block"></canvas>
 	</div>
-	<div id="nodeList" closed="true">
-		<!-- 1为禁止查询，2为可以联想查询  此开关同main.jsp-->
-		<input type="hidden" id="lianxiangStatus" value="2" />
-		<!--<span id="title" class="color_3_tip"
-			style="width: 100%;  display: none; text-align: center;"></span>-->
-		<div id="title" class="color_3_tip" style="height: 20px;text-align: center;line-height: 20px">i18n_st.text.policy_n81i</div>
-		<iframe id="I4" name="I4" height="30%" width="100%" border="0"
-			style="background: #FFFFFF; display: none;" frameborder="0" src=""
-			scrolling="no">
-			i18n_st.message.frameInfo_n81i
-		</iframe>
-		<hr id="hr" />
-		<iframe id="I5" name="I5" height="100%" width="100%" border="0"
-			style="background: #FFFFFF;" frameborder="0" src="" scrolling="no">
-			i18n_st.message.frameInfo_n81i
-		</iframe>
-	</div>
 	
 	<!-- <div id="nodeList" closed="true">
 		1为禁止查询，2为可以联想查询  此开关同main.jsp
diff --git a/WebRoot/page/show/showNodeRoom.jsp b/WebRoot/page/show/showNodeRoom.jsp
index 5acb756..54e2031 100644
--- a/WebRoot/page/show/showNodeRoom.jsp
+++ b/WebRoot/page/show/showNodeRoom.jsp
@@ -214,7 +214,7 @@ body {
 			}
 		})
 		
-		function getNodeBox(param){
+		/*function getNodeBox(param){
 			var params=param.split(",");
 			$.ajax({
 					type:"post",
@@ -336,10 +336,150 @@ body {
 						 }
 					}
 				})
+		}*/
+		function getNodeBox(param){
+			var params=param.split(",");
+			$.ajax({
+					type:"post",
+					dataType:'json',
+					url:"<c:url value='/nodePosition/topoShow.do?action=getNodeBox'/>",
+					data:params[0],
+					async:true,
+					 success:function (data,textStatus){
+					 	if(textStatus == "success" && (data!= null && data!= "" )){
+						 	window.top.$("#nodeBoxs").html("");
+						 	var length = $(data).length;
+						 	var raphaelBox = window.top.Raphael("nodeBoxs",boxWidth,boxHeight);
+						 	//raphaelBox.rect(0,0,boxWidth,boxHeight).attr({'stroke-width':1,stroke: "#FFFFFF", fill: "#FBFBEA"});
+						 	//边框设置
+						 	var subBoxStartX=20;
+						 	var subBoxStartY=10;
+						 	var footHeight = 30;
+						 	var subBoxGap = 3;
+						 	raphaelBox.image(boxTopImg,0,0,204,subBoxStartY);
+						 	raphaelBox.image(boxLeftImg,0,subBoxStartY,subBoxStartX,boxHeight);
+						 	raphaelBox.image(boxRightImg,boxWidth-20,subBoxStartY,subBoxStartX,boxHeight);
+						 	raphaelBox.image(boxFootImg,0,boxHeight-footHeight,204,footHeight);
+						 	//每个子U为的大小设置
+						 	var subHeight = (boxHeight-subBoxStartY-footHeight)/length-subBoxGap;
+						 	var subWidth = boxWidth - 2*subBoxStartX;
+						 	var index=-1;//控制占多个U位的处理；
+						 	var nodeIndex=0;//在机柜展示中显示节点机所在的序号
+						 	$(data).each(function(i,item){
+						 		if(index >= i){
+						 			return true;
+						 		}
+						 		//item.nodeposition
+						 		var subBoxY = subBoxStartY+i*(subHeight+subBoxGap);
+						 		var newHeight = subHeight;
+						 		if(item.nodeSeqId != "0" && item.nodeTable != null){
+						 			
+						 			var title="";//设置节点的提升信息
+						 			var param="";//设置单击事件的传参
+						 			if(item.nodeTable != null){
+						 				title = "i18n_snr.message.nodeTableTitle.nodeIp_n81i："+item.nodeTable.nodeIp+"\ni18n_snr.message.nodeTableTitle.nodeName_n81i："+item.nodeTable.nodeName
+						 						+"\ni18n_snr.message.nodeTableTitle.nodeU_n81i："+item.nodeTable.nodeUType+"\ni18n_snr.message.nodeTableTitle.startU_n81i："+item.nodeTable.nodeBeginUType;
+						 				param = "&seqList="+item.nodeTable.seqId;
+						 				
+						 				//占多个U位的处理
+						 				var UNum = Number(item.nodeTable.nodeUType);
+						 				if( UNum>1){
+						 					newHeight = UNum*subHeight+(UNum-1)*subBoxGap;
+						 					index = i+UNum-1;
+						 				}
+						 			}
+						 			//alert(item.nodeTable.nodeName+"------"+item.groupNode+"---"+item.nodeTable.alarm);
+						 			var subColor="#80B167";//绿色
+						 			//是本节点组的显示（红色or绿色） 非本节点组显示灰色
+						 			if(item.groupNode){
+						 				if(item.nodeTable.alarm){//节点如果异常则显示红色
+						 					subColor="#FF0000";
+						 				}
+						 			}else{
+						 				subColor="#939393";//灰色
+						 			}
+						 			
+						 			//只有告警节点才可以单击显示告警信息
+						 			if(item.groupNode &&item.nodeTable.alarm){
+						 			//节点如果异常则显示红色
+						 				var node = raphaelBox.rect(subBoxStartX,subBoxY,subWidth,newHeight).attr({stroke: "#CEDBEF",'stroke-width':0.1,title:title,text:param, fill: subColor});
+						 				node.id = "u"+i;
+						 				window.top.$("#nodeBoxs").append("<input type='hidden' id="+node.id+" value=''>");
+						 				$("input[id="+node.id+"]").val(param);
+								 			node.click(function(){
+							   				//	var param = this.attr("text");
+							   					var selector= "#"+this.id;
+							   					var param = $(selector).val();
+							   					var nodeip = item.nodeTable.nodeIp;
+							   					var nodeType = item.nodeTable.nodeType;
+							   					getAlarmInfo(param,nodeip,nodeType);
+											}).mouseover(function(){
+												this.animate({"stroke-width":2},100);
+											}).mouseout(function(){
+												this.animate({"stroke-width":0.1},100);
+											});
+						 			}else{
+						 				raphaelBox.rect(subBoxStartX,subBoxY,subWidth,newHeight).attr({stroke: "#CEDBEF",'stroke-width':0.1,title:title,text:param, fill: subColor})
+								 			.mouseover(function(){
+												this.animate({"stroke-width":2},100);
+											}).mouseout(function(){
+												this.animate({"stroke-width":0.1},100);
+											});
+						 			}
+						 			
+						 			//写节点机在机柜中的序号,放入数组中
+						 			if(item.groupNode){
+						 				nodeIndex++;
+						 				nodeIndexs[nodeIndex]={"x":subBoxStartX-5,"y":subBoxY+5};
+						 			}
+						 			
+						 		}else{
+						 			var title="i18n_snr.message.UBit_n81i"+item.nodeposition;
+						 			raphaelBox.rect(subBoxStartX,subBoxY,subWidth,newHeight).attr({stroke: "#CEDBEF",'stroke-width':0.1,title:title, fill: "#ffffff"})
+						 			.mouseover(function(){
+										this.animate({"stroke-width":2},100);
+									}).mouseout(function(){
+										this.animate({"stroke-width":0.1},100);
+									});
+						 		}
+						 	});
+						 	
+						 	//写节点机在机柜中的序号
+						 	var nodeShowInd = 0;
+						 	for(var i = 1;i<=nodeIndex;i++){
+						 		if(nodeIndexs[i] != null &&nodeIndexs[i] != ""){
+						 			nodeShowInd++;
+						 			raphaelBox.text(nodeIndexs[i].x,nodeIndexs[i].y,nodeShowInd).attr({'font-size':12,fill:"#000000"});
+						 		}
+						 	}
+						 	window.top.layer.open({
+						 		type: 1,
+						 		title: params[1],
+						 		area:['206px', 'auto'],
+						 		content: window.top.$("#nodeBoxs")
+						 	})
+						 }
+					}
+				})
 		}
 		
 		
 		function getAlarmInfo(param,nodeip,nodeType){
+			if(nodeType== 0){
+				var url ="<c:url value='/detection/detectionWarning.do?action=query&ip="+nodeip+"&levelAlarm=1"+param+"+&type=3Droom'/>";
+			}else if(nodeType == 1){
+				var url ="<c:url value='/detection/detectionWarning.do?action=queryNE&ip="+nodeip+"&levelAlarm=1"+param+"+&type=3Droom'/>";
+			}
+			window.top.layer.open({
+		 		type: 1,
+		 		area:['900px', '600px'],
+		 		content: window.top.$("#alarmInfo")
+		 	})
+			window.top.$("#I6").html("");
+			window.top.$("#I6").attr("src",url);
+		}
+		
+		/* function getAlarmInfo(param,nodeip,nodeType){
 			if(nodeType== 0){
 				var url ="<c:url value='/detection/detectionWarning.do?action=query&ip="+nodeip+"&levelAlarm=1"+param+"+&type=3Droom'/>";
 			}else if(nodeType == 1){
@@ -348,7 +488,7 @@ body {
 			$("#I3").html("");
 			$("#I3").attr("src",url);
 			$("#alarmInfo").dialog("open");
-		}
+		} */
 		</script>
 
 	</head>