EasyUi代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>layout.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="themes/icon.css">
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="jquery.easyui.min.js"></script>
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<script type="text/javascript">
//通用的跳转 MyTitle标签 myUrl路径
function urlClick(MyTitle,myUrl){
//判断标签页是否存在
var falg=$("#tt").tabs("exists",MyTitle)
if(!falg){
$("#tt").tabs("add",{
title:MyTitle,
closable:true,
//<ifram></iframe>
content:'<iframe frameborder=0 width="100%" height="100%" src="'+myUrl+'"></iframe>'
})
}
//存在就直接打开
$("#tt").tabs("select",MyTitle);
}
</script>
</head>
<body>
<body style="margin: 1px">
<!-- 布局 -->
<div class="easyui-layout" style="width:100%;height:100%;" >
<!-- 上面的部分 -->
<div data-options="region:'north'" style="height:15%; background-image: url(4545.jpg);background-repeat: round;">
<div style="height:85%"></div>
<div style="text-align:right;width:80%;heigth:80%"><a href="" ><font color=red>安全退出</font></a></div>
</div>
<!-- 左边部分 -->
<div data-options="region:'west',split:true" title="导航菜单" style="width:17%;">
<div class="easyui-accordion" style="width:100%;height:85%;">
<div title="权限管理" style="padding:10px;">
<table style="font-size:14px" id="table">
<tr><td id="tr2"><a href="javascript:urlClick('用户管理','aaa.html')" style="text-decoration: none"><img alt="" src="themes/icons/man.png">用户管理</a></td></tr>
<!-- 同项目下的html -->
<tr><td id="tr1"><a href="javascript:urlClick('学生管理','curd.html')" style="text-decoration: none"><img alt="" src="themes/icons/search.png">学生管理</a></td></tr>
</table>
</div>
<div title="系统设置" style="padding:10px;">
</div>
</div>
</div>
<!-- 中间部分显示内容 -->
<div data-options="region:'center'">
<div id="tt" class="easyui-tabs" style="width:100%;height:100%">
<div title="欢迎使用" style="padding:10px"></div>
</div>
</div>
</div>
</body>
</body>
</html>
分页的工具类
//数据库的总记录数(数据库查询) 注意变量名写死
private Integer total;
//每页的数据放入该集合中 注意变量名写死
private List rows;
以上的两个字段名的变量要写死
package cn.et.food.utils;
import java.util.List;
public class PageTools {
/**
*
*
* @param curPage 页面传入的当前页
* @param totalCount 数据库查询的总记录数
* @param pageCount 每页显示的条数
*/
public PageTools(Integer curPage,Integer totalCount,Integer pageCount){
this.curPage=curPage;
this.total=totalCount;
this.pageCount=pageCount==null?this.pageCount:pageCount;
//上一页
this.prePage=(curPage==1?1:curPage-1);
//总页数
this.totalPage=totalCount%this.pageCount==0?totalCount/this.pageCount:(totalCount/this.pageCount+1);
//下一页
this.nextPage=(curPage==totalPage)?totalPage:(curPage+1);
//数据库第几页每页显示的数据 开始索引和结束索引
this.startIndex=(curPage-1)*this.pageCount+1;
this.endIndex=curPage*this.pageCount;
}
/**
* 当前页(动态 由页面传递)
*/
private Integer curPage;
/**
* 上一页
* prePage=(curPage==1?1:curPage-1)
*
*/
private Integer prePage;
/**
* 下一页
* nextPage=(nextPage==totalPage)?totalPage:(curPage+1)
*
*
*/
private Integer nextPage;
//每页显示的条数
private Integer pageCount=10;
/**
* 总页数
* totalPage=(totalCount%pageCount==0?totalCount/pageCount:(totalCount/pageCount+1)
*
*/
private Integer totalPage;
//数据库的总记录数(数据库查询) 注意变量名写死
private Integer total;
//每页的数据放入该集合中 注意变量名写死
private List rows;
/**
* 数据库开始索引和结束索引
*
* startIndex=(curPage-1)*PageCount+1
* endIndex=curPage*pageCount
*
*/
private int startIndex;
private int endIndex;
public int getStartIndex() {
return startIndex;
}
public void setStartIndex(int startIndex) {
this.startIndex = startIndex;
}
public int getEndIndex() {
return endIndex;
}
public void setEndIndex(int endIndex) {
this.endIndex = endIndex;
}
public List getRows() {
return rows;
}
public void setRows(List rows) {
this.rows = rows;
}
public Integer getCurPage() {
return curPage;
}
public void setCurPage(Integer curPage) {
this.curPage = curPage;
}
public Integer getPrePage() {
return prePage;
}
public void setPrePage(Integer prePage) {
this.prePage = prePage;
}
public Integer getNextPage() {
return nextPage;
}
public void setNextPage(Integer nextPage) {
this.nextPage = nextPage;
}
public Integer getPageCount() {
return pageCount;
}
public void setPageCount(Integer pageCount) {
this.pageCount = pageCount;
}
public Integer getTotalPage() {
return totalPage;
}
public void setTotalPage(Integer totalPage) {
this.totalPage = totalPage;
}
public Integer getTotal() {
return total;
}
public void setTotalt(Integer total) {
this.total = total;
}
public static void main(String[] args) {
int curPage=6;
int totalCount=27;
int pageCount=5;
PageTools pt=new PageTools(curPage, totalCount, pageCount);
System.out.println(pt.getNextPage());
System.out.println(pt.getPrePage());
System.out.println(pt.getTotalPage());
System.out.println(pt.getStartIndex());
System.out.println(pt.getEndIndex());
}
}
完整代码下载链接 https://github.com/panhaigang/EsayUi 含有多种内容 树结构 分页 布局等
curd的数据库结构
树结构的数据库的结构
1、部门数据
2、员工数据
树结构的效果图
3125
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
