day49_运行监控、CK插件整合、进度条

项目第二天（运行监控）

1：项目页面登录框架

（1）index.jsp
转发到指定包下的页面

<jsp:forward page="/WEB-INF/page/menu/index.jsp"/>

（2）menu/index.jsp
提供用户名和密码的登录页面
（3）menu/home.jsp
学会使用框架和完成页面的布局。

标题是menu/title.jsp
左侧菜单是menu/left.jsp
frame框架改变是menu/change.jsp
显示的功能页面时menu/loading.jsp

<FRAMESET border=0 frameSpacing=0 rows=82,* frameBorder=0 id="mainparent">
<FRAME name=topFrame src="${pageContext.request.contextPath }/menu/title.jsp" noResize scrolling=no>
<FRAMESET id="main" border="0" frameSpacing="0" frameBorder="0" cols="153,1%,*">
<FRAME name="leftFrame" src="${pageContext.request.contextPath }/menu/left.jsp" noResize>
<frame name="changeButton" src="${pageContext.request.contextPath }/menu/change.jsp" frameBorder=0 marginHeight=0 marginWidth=0 scrolling=no noresize>
<FRAME name="mainFrame" src="${pageContext.request.contextPath }/menu/loading.jsp" >
</FRAMESET>
</FRAMESET>

这里home.jsp和title.jsp,left.jsp,change.jsp,loading.jsp是父子关系。

（4）menu/title.jsp
显示的上方的标题（包括显示日期，当前操作人，功能包括返回首页，重新登录）

（5）menu/left.jsp
显示左侧的功能菜单：
即页面显示：

在这里，我们使用jquery的ztree插件，使用ztree加载的步骤：
第一步：在left.jsp中添加：

<script language="JavaScript" src="${pageContext.request.contextPath }/script/jquery-1.4.2.js"></script>
<script language="JavaScript" src="${pageContext.request.contextPath }/script/jquery-ztree-2.5.js"></script>
<script language="JavaScript" src="${pageContext.request.contextPath }/script/menuData.js"></script>
<script language="JavaScript" src="${pageContext.request.contextPath }/script/tree.js"></script>
<link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath }/css/menu.css" />
<link rel="stylesheet" href="${pageContext.request.contextPath }/css/zTreeStyle/zTreeStyle.css" type="text/css">

添加：
<TABLE border=0 width="20">
    <TR>
        <TD width=340px align=center valign=top>
        <div class="zTreeDemoBackground">
            <ul id="menuTree" class="tree" ></ul>
        </div>      
        </TD>
    </TR>
</TABLE>

其中ul表示组件，ztree加载后的树型菜单就是放置在该ul的定义的组件中，其中ul要指定id的属性。

第二步：tree.js中的配置

var menu = {
    setting: {
        isSimpleData: true,
        treeNodeKey: "mid",
        treeNodeParentKey: "pid",
        showLine: true,
        root: {
            isRoot: true,
            nodes: []
        }
    },
    loadMenuTree: