java--easyUI+struts+JSP实现简单的增删查改

1.数据库工具类

package com.xiaoxiong.util;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.SQLException;

public class ConnUtil {
    //定义连接数据库参数
    private static String drivers = "com.mysql.jdbc.Driver";
    private static String url = "jdbc:mysql://localhost:3306/easyui";
    private static String user = "root";
    private static String password = "a123456";
    private static Connection conn = null;
    
    //连接数据库
    public static Connection getConnection(){
        try {
            //加载驱动
            Class.forName(drivers);
            
            //连接数据库
            conn = DriverManager.getConnection(url, user, password);
            
        } catch (ClassNotFoundException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        } catch (SQLException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
        
        return conn;
    }
    
    //关闭数据库
    public void close(){
        try {
            conn.close();
        } catch (SQLException e) {
            e.printStackTrace();
        }
    }
    
}

package com.xiaoxiong.util;

import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;

/**
 * 执行Sql语句
 * @author user
 *
 */
public class DBUtil {
    //声明JDBC对象
    private Connection conn = null;
    //预编译sql
    private PreparedStatement ps = null;
    //接收查询返回的结果
    private ResultSet rs = null;
    
    //初始化操作，连接数据库
    public void init(){
        conn = ConnUtil.getConnection();
    }
    
    
    /**
     * 执行查询语句
     * @param sql            sql语句
     * @param parameters     参数
     * @return
     */
    public ResultSet executeQuery(String sql, Object...parameters){
        //连接数据库
        init();
        
        try {
            //预编译sql
            ps = conn.prepareStatement(sql);
            System.out.println("============"+sql);
            //为sql传值
            for(int i=1; i<=parameters.length; i++){
                ps.setObject(i, parameters[i-1]);
                System.out.println("-------------->"+parameters[i-1]);
            }
            //执行sql返回结果集
            rs = ps.executeQuery();
            
        } catch (SQLException e) {
            e.printStackTrace();
        } 
        
        return rs;
    }
    
    public int executUpdate(String sql, Object...parameters){
        init();
        
        try {
            ps = conn.prepareStatement(sql);
            for (int i = 1; i <= parameters.length; i++) {
                ps.setObject(i, parameters[i-1]);
            }
            return ps.executeUpdate();
        } catch (SQLException e) {
            e.printStackTrace();
        }
        
        return 0;
    }
    
    //关闭数据库
    public void close(){
        try {
            if(rs!=null){
                rs.close();
            }
            if(ps!=null){
                ps.close();
            }
            if(conn!=null){
                conn.close();
            }
        } catch (SQLException e) {
            e.printStackTrace();
        }
    }
    
}

2.entity类

package com.xiaoxiong.bean;

public class Dept {
    private int deptno;
    private String dname;
    private String loc;
    
    public Dept() {
    }

    public Dept(int deptno, String dname, String loc) {
        super();
        this.deptno = deptno;
        this.dname = dname;
        this.loc = loc;
    }
    
    public int getDeptno() {
        return deptno;
    }
    public void setDeptno(int deptno) {
        this.deptno = deptno;
    }
    public String getDname() {
        return dname;
    }
    public void setDname(String dname) {
        this.dname = dname;
    }
    public String getLoc() {
        return loc;
    }
    public void setLoc(String loc) {
        this.loc = loc;
    }
    
}

package com.xiaoxiong.bean;

import java.util.Date;

public class Emp {
    
    private int empno;
    private String ename;
    private String job;
    private Date hiredate;
    private String mgr;
    private int sal;
    private int comm;
    private int deptno;
    
    public Emp() {
    }

    public Emp(String ename, String job, Date hiredate, String mgr,
            int sal, int comm, int deptno) {
        this.ename = ename;
        this.job = job;
        this.hiredate = hiredate;
        this.mgr = mgr;
        this.sal = sal;
        this.comm = comm;
        this.deptno = deptno;
    }

    public int getEmpno() {
        return empno;
    }

    public void setEmpno(int empno) {
        this.empno = empno;
    }

    public String getEname() {
        return ename;
    }

    public void setEname(String ename) {
        this.ename = ename;
    }

    public String getJob() {
        return job;
    }

    public void setJob(String job) {
        this.job = job;
    }

    public Date getHiredate() {
        return hiredate;
    }

    public void setHiredate(Date hiredate) {
        this.hiredate = hiredate;
    }

    public String getMgr() {
        return mgr;
    }

    public void setMgr(String mgr) {
        this.mgr = mgr;
    }

    public int getSal() {
        return sal;
    }

    public void setSal(int sal) {
        this.sal = sal;
    }

    public int getComm() {
        return comm;
    }

    public void setComm(int comm) {
        this.comm = comm;
    }

    public int getDeptno() {
        return deptno;
    }

    public void setDeptno(int deptno) {
        this.deptno = deptno;
    }
    
}

3.sql处理类

package com.xiaoxiong.dao;

import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import com.xiaoxiong.bean.Dept;
import com.xiaoxiong.bean.Emp;
import com.xiaoxiong.util.DBUtil;

public class EmpDao {
    //实例化一个数据库工具对象
    DBUtil db = new DBUtil();
    private ResultSet rs = null;
    
    public List getAvgSalary(){
        StringBuffer sql = new StringBuffer();
        sql.append("SELECT AVG(e.sal) as avgSalary,e.deptno from emp e GROUP BY e.deptno ");
        
        List list = new ArrayList();
        
        Map map = null;
        
        rs = db.executeQuery(sql.toString());
        System.out.println("查询部门平均薪资！");
        try {
            while(rs.next()){
                map = new HashMap();
                map.put("avgSalary", rs.getInt(1));
                map.put("deptno", rs.getInt(2));
                
                list.add(map);
                System.out.println(rs.getInt(1)+":"+rs.getInt(2));
            }
        } catch (SQLException e) {
            e.printStackTrace();
        }

        System.out.println(list);
        
        return list;
    }
    
    /**
     * 删除用户信息
     * @param empno
     * @return
     */
    public int delete(int empno){
        
        StringBuffer sql = new StringBuffer();
        sql.append("delete from emp where empno = ?");
        
        try {
            return db.executUpdate(sql.toString(), empno);
        } catch (Exception e) {
            e.printStackTrace();
        } finally{
            db.close();
        }
        
        return 0;
    }
    
    /**
     * 添加员工数据
     * @param emp
     * @return
     */
    public int addEmp(Emp emp){
        StringBuffer sql = new StringBuffer();
        sql.append("insert into emp(ename,job,mgr,hiredate,sal,comm,deptno) ");
        sql.append("values(?,?,?,?,?,?,?) ");
        
        try {
            return db.executUpdate(sql.toString(),emp.getEname()
                    ,emp.getJob(),emp.getMgr(),emp.getHiredate(),emp.getSal()
                    ,emp.getComm(),emp.getDeptno());
        } catch (Exception e) {
            e.printStackTrace();
        } finally{
            db.close();
        }
        return 0;
    }
    
    /**
     * 修改员工
     * @param emp
     * @return
     */
    public int update(Emp emp){
        StringBuffer sql = new StringBuffer();
        sql.append("update emp set ename=? ,job=?, mgr=?, hiredate=?, sal=?, comm=?, deptno=? ");
        sql.append("where empno=?");
        
        try {
            return db.executUpdate(sql.toString(), emp.getEname(), emp.getJob(), emp.getMgr(), 
                    emp.getHiredate(), emp.getSal(), emp.getComm(),emp.getDeptno(),emp.getEmpno());
        } catch (Exception e) {
            e.printStackTrace();
        } finally{
            db.close();
        }
        return 0;
    }
    
    /**
     * 查询上级
     * @return
     */
    public List searchMgr(){
        List list = new ArrayList();
        
        StringBuffer sql = new StringBuffer();
        
        sql.append("select empno, ename from emp where job in(?,?,?) ");
        
        rs = db.executeQuery(sql.toString(), "MANAGER","ANALYST","PRESIDENT");
        
        try {
            while(rs.next()){
                Emp emp = new Emp();
                emp.setEmpno(rs.getInt("empno"));
                emp.setEname(rs.getString("ename"));

                list.add(emp);
            }
        } catch (SQLException e) {
            e.printStackTrace();
        } finally{
            db.close();
        }
        
        return list;
    }
    
    
    /**
     * 查询部门信息
     * @return
     */
    public List searchDept(){
        List list = new ArrayList();
        StringBuffer sql = new StringBuffer();
        
        sql.append("select * from dept ");
        
        rs = db.executeQuery(sql.toString());
        
        try {
            while(rs.next()){
                Dept dept = new Dept();
                dept.setDeptno(rs.getInt("deptno"));
                dept.setDname(rs.getString("dname"));
                dept.setLoc(rs.getString("loc"));
                
                list.add(dept);
            }
        } catch (SQLException e) {
            e.printStackTrace();
        } finally{
            db.close();
        }
        
        return list;
    }
    
    /**
     * 查询所有数据
     * @return
     */
    public List getAll(){
        //创建list集合存储查询结果集
        List list = new ArrayList();
        
        //编写sql逻辑，调用DBUtil的executeQuery执行
        StringBuilder sql = new StringBuilder();
        sql.append("select * from emp ");
        
        rs = db.executeQuery(sql.toString()); 
        
        try {
            //迭代出数据，存储到list集合中
            while(rs.next()){
                Emp emp = new Emp();
                emp.setEmpno(rs.getInt("empno"));
                emp.setDeptno(rs.getInt("deptno"));
                emp.setEname(rs.getString("ename"));
                emp.setHiredate(rs.getDate("hiredate"));
                emp.setJob(rs.getString("job"));
                emp.setMgr(rs.getString("mgr"));
                emp.setComm(rs.getInt("comm"));
                emp.setSal(rs.getInt("sal"));
                
                list.add(emp);
            }
        } catch (SQLException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        } finally{
            db.close();
        }
        
        return list;
    }
    
    /**
     * 通过员工名模糊查询
     * @param page
     * @param rows
     * @param name
     * @return
     */
    public List<Emp> searchByName(int page,int rows,String name){
        List<Emp> list = new ArrayList<Emp>();
        
        StringBuffer sql = new StringBuffer();
        sql.append("select * from emp where ename like ? limit ?,?");
        System.out.println("输入查询的用户名为："+name);
        rs = db.executeQuery(sql.toString(), "%" + name + "%", (page-1)*rows, rows);
        System.out.println("模糊查询的结果为："+rs);
        try {
            //迭代出数据，存储到list集合中
            while(rs.next()){
                Emp emp = new Emp();
                emp.setEmpno(rs.getInt("empno"));
                emp.setDeptno(rs.getInt("deptno"));
                emp.setEname(rs.getString("ename"));
                emp.setHiredate(rs.getDate("hiredate"));
                emp.setJob(rs.getString("job"));
                emp.setMgr(rs.getString("mgr"));
                emp.setComm(rs.getInt("comm"));
                emp.setSal(rs.getInt("sal"));
                list.add(emp);
            }
        }catch (SQLException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        } finally{
            db.close();
        }
        
        return list;
    }
    
    /**
     * 分页查询
     * @param page
     * @param rows
     * @return
     */
    public List<Emp> searchPage(int page, int rows){
        List<Emp> list = new ArrayList<Emp>();
        
        System.out.println("page="+page+":rows"+rows);
        
        StringBuilder sql = new StringBuilder();
        sql.append("select * from emp limit ?,? ");
        
        rs = db.executeQuery(sql.toString(), (page-1)*rows, rows);
        
        try {
            //迭代出数据，存储到list集合中
            while(rs.next()){
                Emp emp = new Emp();
                emp.setEmpno(rs.getInt("empno"));
                emp.setDeptno(rs.getInt("deptno"));
                emp.setEname(rs.getString("ename"));
                //日期格式的转换
                emp.setHiredate(rs.getDate("hiredate"));
                emp.setJob(rs.getString("job"));
                emp.setMgr(rs.getString("mgr"));
                emp.setComm(rs.getInt("comm"));
                emp.setSal(rs.getInt("sal"));
                
                list.add(emp);
            }
        } catch (SQLException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        } finally{
            db.close();
        }
        
        return list;
    }
    
    /**
     * 模糊匹配数据的总数
     * @param name
     * @return
     */
    public int getCountByName(String name){
        StringBuilder sql = new StringBuilder();
        sql.append("select count(*) from emp where ename like ?");
        int count = 0;
        
        rs = db.executeQuery(sql.toString(), "%" + name + "%");
        
        try {
            while(rs.next()){
                count = rs.getInt(1);
            }
        } catch (SQLException e) {
            e.printStackTrace();
        } 
        
        return count;
    }
    
    /**
     * 查询总数
     * @return
     */
    public int getCount(){
        StringBuilder sql = new StringBuilder();
        sql.append("select count(*) from emp ");
        int count = 0;
        
        rs = db.executeQuery(sql.toString());
        
        try {
            while(rs.next()){
                count = rs.getInt(1);
            }
        } catch (SQLException e) {
            e.printStackTrace();
        } 
        
        return count;
    }
    
}

4.action类

package com.xiaoxiong.action;

import java.io.IOException;
import java.util.ArrayList;
import java.util.List;

import javax.servlet.http.HttpServletResponse;

import org.apache.struts2.ServletActionContext;

import com.google.gson.Gson;
import com.opensymphony.xwork2.ActionSupport;
import com.xiaoxiong.bean.Dept;
import com.xiaoxiong.dao.EmpDao;

public class DeptAction extends ActionSupport {
    EmpDao dao = new EmpDao();
    /**
     * 查询dept
     * @return
     * @throws IOException
     */
    public String searchDept() throws IOException {
        List<Dept> list = new ArrayList<Dept>();

        Dept dept = new Dept();
        dept.setDeptno(-1);
        dept.setDname("请选择");
        list = dao.searchDept();
        // 将查询到的结果转为json数据
        list.add(0, dept);

        Gson gson = new Gson();
        String json = gson.toJson(list);

        System.out.println(json);
        // 数据回传给浏览器端
        HttpServletResponse response = ServletActionContext.getResponse();
        response.setContentType("text/html");
        response.setCharacterEncoding("utf-8");

        response.getWriter().println(json);
        return this.NONE;
    }
}

package com.xiaoxiong.action;

import java.io.IOException;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletResponse;

import org.apache.struts2.ServletActionContext;

import com.google.gson.Gson;
import com.opensymphony.xwork2.ActionSupport;
import com.opensymphony.xwork2.ModelDriven;
import com.xiaoxiong.bean.Dept;
import com.xiaoxiong.bean.Emp;
import com.xiaoxiong.dao.EmpDao;

public class EmpAction extends ActionSupport implements ModelDriven<Emp> {

    private Emp emp;
    private Integer rows;
    private Integer page;
    private String ename;
    // 实例化一个dao类
    EmpDao dao = new EmpDao();
    
    public String avgSalary() throws IOException{
        List list = new ArrayList();
        
        
        list = dao.getAvgSalary();
        System.out.println("访问avgSalaryAction");
        //转换为json数据
        String json = new Gson().toJson(list);
        
        System.out.println("-------------json"+json);
        ServletResponse response = ServletActionContext.getResponse();
        response.setContentType("text/html; charset=utf-8");
        response.getWriter().println(json);
        
        return this.NONE;
    }
    
    /**
     * 删除模块
     * @return
     * @throws IOException
     */
    public String delete() throws IOException {

        // 创建map存储执行的结果
        Map map = new HashMap();
        // 做异常处理
        try {
            // 修改员工信息
            dao.delete(emp.getEmpno());
            map.put("result", true);
            map.put("message", "数据删除成功");
        } catch (Exception e) {
            map.put("result", false);
            map.put("message", e.getMessage());
        }

        // 将数据转换为json格式
        String json = new Gson().toJson(map);
        ServletResponse response = ServletActionContext.getResponse();
        response.setContentType("text/html; charset=utf-8");
        response.getWriter().println(json);

        return this.NONE;
    }

    /**
     * 修改用户
     * 
     * @return
     * @throws IOException
     */
    public String update() throws IOException {

        // 创建map存储执行的结果
        Map map = new HashMap();
        // 做异常处理
        try {
            // 修改员工信息
            dao.update(emp);

            map.put("result", true);
            map.put("message", "数据修改成功");
        } catch (Exception e) {
            map.put("result", false);
            map.put("message", e.getMessage());
        }

        System.out.println("empno:" + emp.getEmpno() + "ename:"
                + emp.getEname() + "----job:" + emp.getJob() + "----deptno:"
                + emp.getDeptno() + "----mgr:" + emp.getMgr() + "----hiredate:"
                + emp.getHiredate() + "----sal:" + emp.getSal() + "----comm:"
                + emp.getComm());
        String json = new Gson().toJson(map);

        ServletResponse response = ServletActionContext.getResponse();
        response.setContentType("text/html; charset=utf-8");
        response.getWriter().println(json);

        return this.NONE;
    }

    /**
     * 新增用户
     * 
     * @return
     * @throws IOException
     */
    public String save() throws IOException {
        Map map = new HashMap();
        // 做异常处理
        try {
            // 添加员工信息
            dao.addEmp(emp);
            map.put("result", true);
            map.put("message", emp.getEname() + "保存成功");
        } catch (Exception e) {
            map.put("result", false);
            map.put("message", e.getMessage());
        }

        System.out.println("ename:" + emp.getEname() + "----job:"
                + emp.getJob() + "----deptno:" + emp.getDeptno() + "----mgr:"
                + emp.getMgr() + "----hiredate:" + emp.getHiredate()
                + "----sal:" + emp.getSal() + "----comm:" + emp.getComm());

        String json = new Gson().toJson(map);

        ServletResponse response = ServletActionContext.getResponse();
        response.setContentType("text/html; charset=utf-8");
        response.getWriter().println(json);

        return this.NONE;
    }

    /**
     * 查询上级信息
     * 
     * @return
     * @throws IOException
     */
    public String searchMgr() throws IOException {
        
        List<Emp> list = new ArrayList<Emp>();

        Emp emp = new Emp();
        emp.setEmpno(-1);
        emp.setEname("请选择");
        list = dao.searchMgr();
        // 将查询到的结果转为json数据
        // 将请选择数据置顶
        list.add(0, emp);
        // 需要导入gson-2.2.4.jar包
        Gson gson = new Gson();
        String json = gson.toJson(list);

        System.out.println("--------------" + json);
        // 数据回传给浏览器端
        ServletResponse response = ServletActionContext.getResponse();
        response.setContentType("text/html");
        response.setCharacterEncoding("utf-8");

        response.getWriter().println(json);

        return this.NONE;
    }

    /**
     * 分页查询
     * 
     * @return
     * @throws IOException
     */
    public String searchPage() throws IOException {
        
        List<Emp> list = new ArrayList<Emp>();
        int count = 0;
        System.out.println("----------->rows:" + rows + "===page" + page
                + "==ename" + ename);
        ename = emp.getEname();
        if (ename == null) {
            // 查询数据总条数
            count = dao.getCount();
            // rows = page * rows > count ? rows : ((page+1) * rows - count);
            list = dao.searchPage(page, rows);
        } else {
            count = dao.getCountByName(ename);
            list = dao.searchByName(page, rows, ename);
        }

        Map map = new HashMap();
        // 用map结合存储总数居的条数，和list集合
        map.put("total", count);
        map.put("rows", list);

        // 用Gson将map数据转换为json格式数据
        Gson gson = new Gson();
        String json = gson.toJson(map);

        // 将数据发送给浏览器端
        HttpServletResponse response = ServletActionContext.getResponse();
        response.setContentType("text/html");
        response.setCharacterEncoding("utf-8");

        response.getWriter().println(json);

        return this.NONE;
    }

    public Integer getRows() {
        return rows;
    }

    public void setRows(Integer rows) {
        this.rows = rows;
    }

    public Integer getPage() {
        return page;
    }

    public void setPage(Integer page) {
        this.page = page;
    }

    @Override
    public Emp getModel() {
        emp = new Emp();
        return emp;
    }
}

5.struts.xml配置文件

<?xml version="1.0" encoding="UTF-8"?>
<!-- DTD 这是一个用来描述XML文件能写什么标签不能写什么标签的规则文件 -->
<!DOCTYPE struts PUBLIC
        "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
        "http://struts.apache.org/dtds/struts-2.0.dtd">
<struts>
    <package name="empPak" extends="struts-default" namespace="/">
        <action name="searchPage" class="com.xiaoxiong.action.EmpAction" method="searchPage"></action>
        <action name="searchDept" class="com.xiaoxiong.action.DeptAction" method="searchDept"></action>
        <action name="searchMgr" class="com.xiaoxiong.action.EmpAction" method="searchMgr"></action>
        <action name="save" class="com.xiaoxiong.action.EmpAction" method="save"></action>
        <action name="update" class="com.xiaoxiong.action.EmpAction" method="update"></action>
        <action name="delete" class="com.xiaoxiong.action.EmpAction" method="delete"></action>
        <action name="avgSalary" class="com.xiaoxiong.action.EmpAction" method="avgSalary"></action>
    </package>
</struts> 

6.首页index.jsp

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">

<!-- Easyui主题CSS -->
<link rel="stylesheet"
    href="/easyUiProject/style/easyui/ui-pepper-grinder/easyui.css"
    type="text/css"></link>
<!-- 图标CSS -->
<link rel="stylesheet" href="/easyUiProject/style/easyui/icon.css"
    type="text/css"></link>
</head>

<script type="text/javascript" src="/easyUiProject/script/jquery.min.js"></script>
<script type="text/javascript"
    src="/easyUiProject/script/jquery.easyui.min.js"></script>
<style>
.tab-body {
    overflow: hidden;
}
</style>
<script>
var deptnos = [];
var salarys = []
$(function(){
    $.ajax({
        url : "/easyUiProject/avgSalary",
        type : "post",
        dataType : "json",
        success : function(json){
            console.info(json);
            for(var i=0; i<json.length; i++){
                console.info(json[i].deptno+":"+json[i].avgSalary);
                deptnos[i] = json[i].deptno;
                salarys[i] = json[i].avgSalary;
            }
            console.info("部门数据"+deptnos);
            console.info("部门平均薪资"+salarys);
        }
    });
    
    $("#treeFunctions").tree({
        onClick : function(node){
            //在浏览器控制台打印数据
            console.info(node);
            if(node.attributes==null || node.attributes.url==null){
                console.info(node.text+"节点未设置url，本次操作无效");
                return;
            }
            //判断页签是否存在，不存在则创建，存在则激活
            //exists表明指定的面板是否存在，'which'参数可以是选项卡面板的标题或索引。
            var isExists = $("#tabsMain").tabs("exists",node.text);
            if(isExists==false){
                //创建标题
                $("#tabsMain").tabs("add",{
                    title : node.text,    //标题
                    closable : true,      //是否能被关闭
                    //content 内容
                    content : "<iframe src='"+node.attributes.url+"' style='border:0px;width:100%;height:100%'></iframe>",
                    bodyCls : "tab-body"
                })
            }else{
                //激活--->select被选中的
                $("#tabsMain").tabs("select",node.text);
            }
        }
    })
})
</script>
</head>

<body class="easyui-layout">
    <div region="north" style="height: 100px">
        <div style="background-color: red"></div>
    </div>

    <div region="west" title="系统列表" split=true style="width: 300px">
        <div class="easyui-accordion" fit="true" border=false>
            <div title="系统管理平台">
                <ul class="easyui-tree" id="treeFunctions">
                    <li><span>组织机构管理</span>
                        <ul>
                            <!-- Easyui中为树的节点自定义属性使用data-options -->
                            <li data-options="attributes:{'url' : 'http://www.sohu.com'}"><span>部门管理</span></li>
                            <li data-options="attributes:{'url' : 'http://www.163.com'}"><span>组织机构管理</span></li>
                        </ul></li>
                    <li><span>角色管理</span>
                        <ul>
                            <li><span>员工管理</span></li>
                            <li data-options="attributes:{'url':'/easyUiProject/tongj.html'}">
                                <span>部门薪资水平</span>
                            </li>
                            <li data-options="attributes:{'url':'/easyUiProject/emp.html'}">
                                <span>角色管理</span>
                            </li>
                        </ul></li>
                </ul>
            </div>
            <div title="借款人销售系统(BorrowSale-BS)">
                <ul class="easyui-tree">
                    <li><span></span></li>
                </ul>
            </div>
        </div>
    </div>
    <div region="center">
        <div class="easyui-tabs" id="tabsMain" fit="true" border="false">
            <div title="首页"></div>
        </div>
    </div>
</body>
</html>

7.管理界面emp.xml

<!DOCTYPE html>
<html>
  <head>
    <title>emp.html</title>
    
    <meta name="keywords" content="keyword1,keyword2,keyword3">
    <meta name="description" content="this is my page">
    <meta name="content-type" content="text/html; charset=UTF-8">
    
    
    <!-- Easyui主题CSS -->
    <link rel="stylesheet" href="/easyUiProject/style/easyui/ui-pepper-grinder/easyui.css" type="text/css"></link>
    <!-- 图标CSS -->
    <link rel="stylesheet" href="/easyUiProject/style/easyui/icon.css" type="text/css"></link></head>
    
    <script type="text/javascript" src="/easyUiProject/script/jquery.min.js"></script>
    <script type="text/javascript" src="/easyUiProject/script/jquery.easyui.min.js"></script>
    <!-- 国际化，页面信息置为中文 -->
      <script type="text/javascript" src="/easyUiProject/script/easyui-lang-zh_CN.js"></script>
      <!-- 为对话框定义样式 -->
      <style>
          .easyui-textbox , .easyui-datebox , .easyui-numberspinner{
              width:150px
          }
          
          .easyui-combobox {
              width:156px
          }
      </style>
      <script type="text/javascript">
      
      //扩展自定义校验
      $.extend($.fn.validatebox.defaults.rules,{
          ename : { //校验规则名称   
              validator: function(value,param){   //value代表了当前文本框输入的内容
                  var regex = new RegExp("^[A-Z]{1,}( [A-Z]{1,}){0,}$");  //定义正则
                  var result = regex.test(value);
                  return result;
              },    
              message: "输入的类容必须为大写的字母"
          },
            mustselect : {
                validator : function(value,param){
                    if(value == "请选择"){
                        return false;
                    }else{
                        return true;
                    }
                },
                message : "请选择有效选项"
            }
      });
      
      //模糊查询
      $(function(){
          $("#btnQuery").click(function(){
              $("#grdEmp").datagrid("load",{ //页面加载时向服务端发送数据
                  //向服务端发送ename
                  "ename" : $("#txtEname").val()
              });
          });
      });
      
      //增加员工
      $(function(){//文档加载函数
          $("#btnAdd").click(function(){//点击时触发函数
              $("#cmbDept").combobox({    //查询部门信息
                  url:"/easyUiProject/searchDept",  
                  valueField:"deptno",        //基础数据值名称绑定到该下拉列表框。  
                  textField:"dname" ,      //基础数据字段名称绑定到该下拉列表框。
                  value : -1
              }),
              //查询上级领导
              $("#cmbMgr").combobox({
                  url : "/easyUiProject/searchMgr",
                  valueField : "empno",
                  textField : "ename",
                  value : -1
              }),
              $("#frmEmp").attr("opmode" , "save");
          
              $("#dlgEmp").dialog({//创建对话框
                  title : "新增员工",
                  width : 300,   //设置对话框宽度
                  height : 300,  //设置对话框高度
                  modal : true,  //模态对话框,不允许操作除对话框以外的东西（原理，就是添加了一个遮罩层）
                  buttons : "#dlgBtns" //设置底部按钮组
              });
          });
      });
      
      //将表单中的数据提交到服务端。
      $(function(){
          //取消按钮功能
          $("#btnCancel").click(function(){
                $("#frmEmp").form("clear");//清空表单数据
                $("#cmbDept").combobox("setValue" , -1);
                $("#cmbJob").combobox("setValue" , -1);
                $("#cmbMgr").combobox("setValue" , -1);
                $("#dlgEmp").dialog("close");
        });
          //保存按钮功能
        $("#btnSave").click(function(){
            //attr() 如果只有一个参数则是获取数据。
            var opmode = $("#frmEmp").attr("opmode");
            //表单提交功能
            $("#frmEmp").form("submit" , {
                url : "/easyUiProject/"+opmode ,  //数据提交的路径
                success : function(text){
                    //将传送过来的text数据转换为json数据
                    var json = $.parseJSON(text);
                    //对服务端返回的数据进行处理
                    if(json.result == true){
                        //通知提示框
                        $.messager.alert("通知",json.message,"info",function(){
                            $("#dlgEmp").dialog("close");   //关闭对话框
                            $("#grdEmp").datagrid("reload");//重写加载数据
                            $("#frmEmp").form("clear");//清空表单数据
                            //初始化表单数据
                            $("#cmbDept").combobox("setValue" , -1);
                            $("#cmbJob").combobox("setValue" , -1);
                            $("#cmbMgr").combobox("setValue" , -1);
                        });
                    } else{
                        $.messager.alert("错误",json.message,"error");
                    }
                }
            });
        });
    });
      
      //修改用户信息
      $(function(){
          //修改按钮
          $("#btnEdit").click(function(){
              //获取被选中的列信息
              var rec = $("#grdEmp").datagrid("getSelected");
              if(rec == null){
                  $.messager.alert("错误","请选择要修改的员工","error");
                  return;
              }
              //打印出选择列的信息,在浏览器控制台打印
              console.info(rec);
              
              //加载部门选项信息
              $("#cmbDept").combobox({
                  url : "/easyUiProject/searchDept",  //请求的路径
                  textField : "dname",  //下拉选项的文本
                  valueField : "deptno", //下拉选项的value
                  value : -1             //设置默认选项为“请选择”
              });
              
              //加载上级选项信息
              $("#cmbMgr").combobox({
                  url : "/easyUiProject/searchMgr",
                  textField : "ename",
                  valueField : "empno",
                  value : -1
              });
              
              //form组件的load方法会自动将rec对象中的属性找到对应的name组件值回填进去
              $("#frmEmp").form("load", rec);
              
              //设置opmode属性值
              $("#frmEmp").attr("opmode" , "update");
              
              $("#dlgEmp").dialog({
                  title : "修改员工信息",
                  width : 300,
                  height : 300,
                  modal : true, //模态对话框
                  buttons : "#dlgBtns", //设置底部按钮组
                  closable : false //不要出现右上角的关闭符号
              });
          });
      });
      
      //删除用户信息
      $(function(){
          $("#btndelete").click(function(){
              //获取选中列的数据
              var rec = $("#grdEmp").datagrid("getSelected");
              //浏览器控制台输出选中的数据
              console.info(rec);
              if(rec == null){
                  $.messager.alert("错误","请选择要删除的员工列","error");
                  return;
              }else{
                  $.messager.confirm("确认","是否要删除"+rec.ename+"的数据吗？", function(r){
                      if(r==true){//如果选择“确认”
                          //调用ajax传送数据给服务端
                          $.ajax({
                              url : "/easyUiProject/delete?empno="+rec.empno,
                              type : "post",
                              dataType : "json",
                              success : function(json){
                                  if(json.result==true){
                                      $.messager.alert("通知",json.message,"info",function(){
                                          //删除完毕后，刷新列表数据
                                          $("#grdEmp").datagrid("reload");
                                      });
                                  }else{
                                      $.messager.alert("错误",json.message,"error");
                                  }
                              }
                          });
                      }
                  });
              }
          });
      });
      
  </script>

  </head>
  
  <body>
      <!-- toolbar="#tb":将id为tb的对象放到工具栏上
      singleSelect="true"：表示只需要选择一行
      striped=true：斑马纹效果
       -->
    <table id="grdEmp"  class="easyui-datagrid" striped=true singleSelect=true 
     url="/easyUiProject/searchPage" fit=true title="员工信息表" toolbar="#tb" pagination=true>
        <!-- 表头 -->
        <thead>
            <tr>
                  <th data-options="width:50,field:'abc',checkbox:true">员工编号</th>
                  <th data-options="width:100,field:'empno'">员工编号</th>
                  <th data-options="width:100,field:'deptno'">部门编号</th>
                  <th data-options="width:100,field:'ename'">员工姓名</th>
                  <th data-options="width:100,field:'job'">职位</th>
                  <th data-options="width:100,field:'mgr'">领导编号</th>
                  <th data-options="width:100,field:'hiredate'">入职时间</th>
                  <th data-options="width:100,field:'sal'">工资</th>
                  <th data-options="width:100,field:'comm'">津贴</th>
              </tr>
        </thead>
        <!-- 表体 -->
        <tbody>
            
        </tbody>
    </table>
      <!-- 工具栏列表 -->
    <div id="tb">
        <input id="txtEname" type="text" placeholder="请输入要查询的员工姓名" class="easyui-validatebox">
        <a id="btnQuery" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'">查询</a>
        <a id="btnAdd" href="#" class="easyui-linkbutton" iconCls="icon-add">新增</a>
          <a id="btnEdit" href="#" class="easyui-linkbutton" iconCls="icon-edit">修改</a>
          <a id="btndelete" href="#" class="easyui-linkbutton" iconCls="icon-remove">删除</a>
    </div>
    
    <!-- 创建新增表单 -->
    <div id="dlgEmp" style="padding:10px">
        <form id="frmEmp" method="post" opmode=""> <!-- 添加自定义属性opmode来判断是“新增”还是“修改” -->
            <!-- 表单结构 -->
            <table style="width: 100%"><!-- 百分比来设置表单宽度 -->
            
                <tr>
                    <td style="width: 75px">员工姓名</td>
                    <td>
                        <input name="empno" type="hidden"/><!-- 添加隐式参数，便于获取empno -->
                        
                        <!--required="required" 定义为必填字段；validType属性添加表单验证  -->
                        <input type="text" name="ename" class="easyui-textbox" required="required" validType="ename"/>
                    </td>
                </tr>
                <tr>
                    <td>隶属部门</td>
                    <td>
                        <!-- editable="false"：不允许编辑 -->
                        <select name="deptno" id="cmbDept" class="easyui-combobox" editable="false" required="required" validType="mustselect">
                            <option value="-1">请选择</option>
                        </select>
                    </td>
                </tr>
                
                <tr>
                    <td>岗位</td>
                    <td>
                        <!-- editable="false"：不允许编辑 -->
                        <select id="cmbJob" name="job" class="easyui-combobox" editable="false" required="required" validType="mustselect">
                            <option value="-1">请选择</option>
                            <option value="ANALYST">分析师</option>
                              <option value="SALESMAN">销售</option>
                              <option value="CLERK">店员</option>
                              <option value="MANAGER">经理</option>
                              <option value="PRESIDENT">首席执行官</option>
                        </select>
                    </td>
                </tr>
                
                <tr>
                      <td>上级领导</td>
                      <td>
                          <select name="mgr" id="cmbMgr" class="easyui-combobox" editable="false" required="required" validType="mustselect">
                              <option value="-1">请选择</option>
                          </select>
                      </td>
                  </tr>
                  
                  <tr>
                      <td>入职时间</td>
                      <td>
                          <input name="hiredate" id="dd" type="text" class="easyui-datebox" required="required" editable="false"></input>  
                      </td>
                  </tr>
                  
                  <tr>
                      <td>工资</td>
                      <td>
                        <!--min:输入的最小值   max:输入的最大值 precision=0不允许有小数点  -->
                          <input name="sal" class="easyui-numberspinner"  min=0 precision=0 required=true/>
                      </td>
                  </tr>
                  
                  <tr>
                      <td>津贴</td>
                      <td>
                          <!--min:输入的最小值   max:输入的最大值 value=0默认值为0  precision=0不允许有小数点  -->
                          <input name="comm" class="easyui-numberspinner" value=0 min=0 precision=0/>
                      </td>
                  </tr>    
            </table>
        </form>
    </div>
    <!-- 保存取消按钮 -->
    <div id="dlgBtns">
        <!-- 按钮图片属性iconCls -->
        <a id="btnSave" class="easyui-linkbutton" iconCls="icon-ok">保存</a>
        <a id="btnCancel" class="easyui-linkbutton" iconCls="icon-cancel" >取消</a>
    </div>
  </body>
</html>

8.图形统计界面

<!DOCTYPE html>
<html>
<head>
<title>tongj.html</title>

<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">

<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<!-- Easyui主题CSS -->
<link rel="stylesheet"
    href="/easyUiProject/style/easyui/ui-pepper-grinder/easyui.css"
    type="text/css"></link>
<!-- 图标CSS -->
<link rel="stylesheet" href="/easyUiProject/style/easyui/icon.css"
    type="text/css"></link>
</head>

<script type="text/javascript" src="/easyUiProject/script/jquery.min.js"></script>
<script type="text/javascript"
    src="/easyUiProject/script/jquery.easyui.min.js"></script>

<!-- 导入highcharts包 -->
<script type="text/javascript"
    src="/easyUiProject/script/highcharts.js"></script>
<script type="text/javascript"
    src="/easyUiProject/script/exporting.js"></script>
<script>
    var deptnos = [];
    var salarys = [];
    $(document).ready(function() {
        $.ajax({
            url : "/easyUiProject/avgSalary",
            type : "post",
            dataType : "json",
            async: false, //同步操作
            success : function(json) {
                console.info(json);
                for (var i = 0; i < json.length; i++) {
                    console.info(json[i].deptno + ":" + json[i].avgSalary);
                    deptnos[i] = json[i].deptno;
                    salarys[i] = json[i].avgSalary;
                }
                console.info("部门数据" + deptnos);
                console.info("部门平均薪资" + salarys);
            }
        });
        //配置标题
        var title = {
            text : '部门平均工资'
        };
        //配置副标题
        var subtitle = {
            text : 'Source: runoob.com'
        };
        //配置X轴显示的内容
        var xAxis = {
            categories : deptnos
        };
        //配置Y轴显示的内容
        var yAxis = {
            title : {
                text : '工资水平'
            },
            plotLines : [ {
                value : 0,
                width : 1,
                color : '#808080'
            } ]
        };
        //配置提示信息：
        var tooltip = {
            valueSuffix : '$'
        }
        //配置图表向右对齐：
        var legend = {
            layout : 'vertical',
            align : 'left',
            verticalAlign : 'middle',
            borderWidth : 0
        };
        //配置图表要展示的数据。每个系列是个数组，每一项在图片中都会生成一条曲线。
        var series = [ {
            name : '部门平均薪资',
            data : salarys
        } ];
        //创建 json 数据，配置信息
        var json = {};
        json.title = title;
        json.subtitle = subtitle;
        json.xAxis = xAxis;
        json.yAxis = yAxis;
        json.tooltip = tooltip;
        json.legend = legend;
        json.series = series;

        //配置文件
        //Highcharts使用json格式来配置文件
        $('#container').highcharts(json);
    });
</script>
</head>

<body>
    <div id="container" style="width: 550px; height: 400px; margin: 0 auto"></div>
</body>
</html>