<%@ page language="java" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!doctype html>
<html>
<head>
<base href="<%=basePath%>">
<meta charset="UTF-8">
<title>苏州太湖新城管廊综合信息管理</title>
<link type="text/css" rel="stylesheet" href="bootstrap/bootstrap.css">
<link type="text/css" rel="stylesheet" href="css/index.css">
</head>
<body>
<div class="header">
<h3>
苏州太湖新城管廊综合信息管理
</h3>
</div>
<div class="container-fluid">
<div class="row">
<div class="col-lg-2 col-md-2 col-sm-2 col-xs-2 left-nav">
<ul class="list-group">
<li class="list-group-item level-1">管廊综合信息管理</li>
<li class="list-group-item level-2 selected" id="power">配电柜<img alt="" src="images/left.png" class="icon-right"></li>
<li class="list-group-item level-2" id="light">照明<img alt="" src="images/left.png" class="icon-right"></li>
<li class="list-group-item level-2" id="fan">风机<img alt="" src="images/left.png" class="icon-right"></li>
<li class="list-group-item level-2" id="well">井盖<img alt="" src="images/left.png" class="icon-right"></li>
<li class="list-group-item level-2" id="pump">水泵<img alt="" src="images/left.png" class="icon-right"></li>
<li class="list-group-item level-2" id="water">爆管液位<img alt="" src="images/left.png" class="icon-right"></li>
<li class="list-group-item level-2" id="ch4">甲烷<img alt="" src="images/left.png" class="icon-right"></li>
<li class="list-group-item level-2" id="hs">硫化氢<img alt="" src="images/left.png" class="icon-right"></li>
<li class="list-group-item level-2" id="temp">温湿度<img alt="" src="images/left.png" class="icon-right"></li>
<li class="list-group-item level-2" id="o2">氧气<img alt="" src="images/left.png" class="icon-right"></li>
<li class="list-group-item level-2" id="co">一氧化碳<img alt="" src="images/left.png" class="icon-right"></li>
<li class="list-group-item level-2" id="alarm">对射<img alt="" src="images/left.png" class="icon-right"></li>
</ul>
</div>
<div class="col-lg-10 col-md-10 col-sm-10 col-xs-10 right-content">
<iframe id="content" name="content" class="content-frame" src="device/power.jsp"></iframe>
</div>
</div>
</div>
<footer class="footer">版权所有： 技术支持：</footer>
<script type="text/javascript" src="js/jquery-2.1.3.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#power").click(function() {
$("#content").attr("src", "device/power.jsp");
});
// 初始化时右侧的三角图标隐藏
$(".icon-right").hide();
$(".icon-right").eq(0).show();
// 为点中的链接添加选中样式，其他的链接去除样式
$(".level-2").click(function() {
$("#content").attr("src", "device/" + $(this).attr("id") + ".jsp");
$(".level-2, selected").removeClass("selected");
$(".level-2, selected").children(".icon-right").hide();
$(this).addClass("selected");
$(this).children(".icon-right").show();
});
});
</script>
</body>
</html>
