ops / monitor-ui · Commits

Go to a project

Authored by fanzelei
Commit a29f988b80983b73ce2c97eeea3f1a1e0ad4910e 1 parent 4d709f14

tree

Inline Side-by-side
Showing 3 changed files with 65 additions and 8 deletions
eclipse.preferences.version=1
encoding//src/main/java=UTF-8
encoding/<project>=UTF-8
... ...
... ... @@ -41,9 +41,9 @@
<!-- 左侧菜单项 -->
<div id="sidebar">
<ul>
<li class="active"><a href="#"><i class="icon icon-home"></i> <span>Dashboard</span></a></li>
<li><a href="#" onclick="clickMenuToPage(this)" ><i class="icon icon-th"></i> <span>Tables</span></a></li>
<li><a href="#" onclick="clickMenuToPage('/jsp/host/hostInfoList.jsp')" ><i class="icon icon-th"></i> <span>主机信息</span></a></li>
<li class=""><a href="#"><i class="icon icon-home"></i> <span>Dashboard</span></a></li>
<li class="active" onclick="clickMenuToPage('/jsp/table.jsp')"><a href="#" ><i class="icon icon-th"></i> <span>Tables</span></a></li>
<li class="" onclick="clickMenuToPage('jsp/host/hostInfoList.jsp')"><a href="#" ><i class="icon icon-th"></i> <span>主机信息</span></a></li>
</ul>
</div>
<!-- 右侧具体内容 -->
... ... @@ -53,6 +53,7 @@
<script type="text/javascript">
function clickMenuToPage(page){
$(this).addClass("active");
//加载左侧内容
$("#content").load(contextPath+page);
}
... ...
... ... @@ -18,10 +18,21 @@
<h5>Dynamic table</h5>
</div>
<!-- 树 -->
<div ></div>
<div id="continer" style="margin-top: 45px; float: left;margin-top: 120px;"></div>
<div style="margin-top: 45px; float: left;margin-top: 54px;border: dashed;width: 300px;color: #D3D3D3;height: 580px;">
<div class="widget-title">
<h5>Tree Title</h5>
</div>
<ul class="ui-widget ui-helper-clearfix" id="icons" style="float: left;margin-left: 165px;">
<li title=".ui-icon-plusthick" class="ui-state-default ui-corner-all" onclick="deletebtn()"><span class="ui-icon ui-icon-plusthick"></span></li>
</ul>
<ul class="ui-widget ui-helper-clearfix" id="icons" style="margin-right: 12px;">
<li title=".ui-icon-minusthick" class="ui-state-default ui-corner-all" onclick="editbtn()"><span class="ui-icon ui-icon-minusthick"></span></li>
</ul>
<div id="continer" ></div>
</div>
<!-- 列表 -->
<div class="widget-content nopadding" style="margin-left: 250px;">
<div class="widget-content nopadding" style="margin-left: 300px;">
<div class="widget-title" style="height: 53px;">
<div>
<div class="form-inline" role="form" id="inBoxQueryDiv" style=" margin-top: 12px;margin-left: 25px;float: left;">
... ... @@ -37,6 +48,38 @@
</div>
<button id="addBtn" class="btn btn-primary" style="margin-top: 12px;margin-left: 500px;">新增</button>
</div>
<div class="widget-box">
<div class="widget-title">
<h5>Modal dialogs</h5>
</div>
<div class="widget-content">
<a href="#myModal" data-toggle="modal" class="btn btn-primary">Modal dialog</a>
<a href="#myAlert" data-toggle="modal" class="btn btn-danger">Alert</a>
<div id="myModal" class="modal hide">
<div class="modal-header">
<button data-dismiss="modal" class="close" type="button">×</button>
<h3>Modal header</h3>
</div>
<div class="modal-body">
<p>One fine body…</p>
</div>
</div>
<div id="myAlert" class="modal hide">
<div class="modal-header">
<button data-dismiss="modal" class="close" type="button">×</button>
<h3>Alert modal</h3>
</div>
<div class="modal-body">
<p>Lorem ipsum dolor sit amet...</p>
</div>
<div class="modal-footer">
<a data-dismiss="modal" class="btn btn-primary" href="#">Confirm</a>
<a data-dismiss="modal" class="btn" href="#">Cancel</a>
</div>
</div>
</div>
</div>
</div>
<div id="table"></div>
</div>
... ... @@ -110,10 +153,10 @@
//主方法，运用递归实现
function createTree(jsons,pid){
if(jsons != null){
var ul = '<ul class="" style="width: 250px;" >' ;
var ul = '<ul class="" style="width: 120px;" >' ;
for(var i=0;i<jsons.length;i++){
if(jsons[i].pid == pid){
ul += '<input type="checkbox" name="checkBox" value='+jsons[i].id+' style="float: left;margin-top: 6px;width:10px;height:10px;"><li class="tree" value='+jsons[i].id+'>' + jsons[i].name + "</li>" ;
ul += '<input type="checkbox" name="checkBox" value='+jsons[i].id+' style="float: left;margin-top: 6px;width:10px;height:10px;"><li class="tree" value='+jsons[i].id+'><a href="#">' + jsons[i].name + "</a></li>" ;
ul += createTree(jsons,jsons[i].id);
}
}
... ... @@ -133,5 +176,17 @@
}) ;
}) ;
var dom = document.getElementById("icons");
var str = dom.getAttribute("style");
str = str.replace(/height\b\s*\:\s*\d+\px;?/ig, "");
dom.setAttribute("style",str);
function deletebtn(){
alert(1);
}
function editbtn(){
alert(2);
}
</script>
 
\ No newline at end of file
... ...