SSM + easyUI 搭建简易的人事管理系统

说明:文章内容全部截选自实验楼项目教程【SSM + easyUI 搭建简易的人事管理系统】的前两节内容~

系统分析

一、实验介绍

项目采用 SSM(Spring + Spring MVC + MyBatis)框架 + easyUI 来开发一个比较简易的人事管理系统,让同学们能够通过实际项目掌握 SSM 项目的开发。在开始实验前,请同学们务必已经掌握 Spring, Spring MVC, MyBatis, easyUI, javaScript 以及 html 等方面的基础知识。

1.1 实验内容

本节课程主要对要开发的人事管理系统进行系统分析,主要包括系统结构、功能分析和开发技术。

1.2 实验知识点

  • 需求分析
  • java EE 分层结构

1.3 课程来源

本课程主要来自两个地方:

  • 项目背景的设计参考自疯狂软件编著的《Spring+MyBatis 企业应用实战》
  • 前端代码大多来自 ZHENFENG13 在 GitHub 上的开源项目 ssm-demo,其地址为 https://github.com/ZHENFENG13/ssm-demo,在该项目页面设计的基础上根据人事管理系统项目的功能需求等方面稍作修改并加以完善

在这里对上述的作者,特别是 ZHENFENG13 表示由衷的感谢。

1.4 代码获取

你可以在Xfce终端下通过下面命令将实验的完整工程项目下载到实验楼环境中,作为参照对比进行学习。

wget http://labfile.oss.aliyuncs.com/courses/824/hrms.tar

注: Maven 的配置,请参考第二节环境搭建。导入 Maven 工程时出现问题可参考第十二节附录:项目工程导入及问题解决进行解决,其中也包括项目开发过程中可能会遇到的问题。

二、实验步骤

2.1 系统功能结构

本人事管理系统主要用于实验楼内部,主要包括如下几个模块:

  • 系统管理
  • 部门管理
  • 职位管理
  • 员工管理
  • 公告管理
SSM + easyUI 搭建简易的人事管理系统_第1张图片
此处输入图片的描述

整个系统包含上述的几个模块,每个模块又包括多个功能:

  1. 系统管理:添加管理员、删除管理员、修改管理员和查询管理员(全部查询和按用户名模糊查询)
  2. 部门管理:添加部门、删除部门、修改部门和查询部门(全部查询和按部门名称模糊查询)
  3. 职位管理:添加职位、删除职位、修改职位和查询职位(全部查询和按职位名称模糊查询)
  4. 员工管理:添加员工、删除员工、修改员工和查询员工(全部查询和按员工编号、员工姓名、部门、职位和性别模糊查询)
  5. 公告管理:添加公告、删除公告、修改公告和查询公告(全部查询和按公告标题模糊查询)

2.2 开发技术

  • Java EE 架构:SSM(Spring + Spring MVC + MyBatis)框架
  • 表现层技术:JSP
  • 前端框架:easyUI
  • 项目管理工具:Maven
  • 数据库:MySQL

2.3 系统结构

本系统采用的是 Java EE 分层结构:

SSM + easyUI 搭建简易的人事管理系统_第2张图片
此处输入图片的描述
  • 表现层:JSP 页面
  • MVC 控制器层:Spring MVC 技术,由一系列控制器组成。
  • 业务逻辑层:Spring 技术,由一系列的业务逻辑对象组成。
  • DAO 层:MyBatis 框架,由一系列的 DAO 组件组成,这些 DAO 实现了对数据库的创建、查询、更新和删除(CRUD)等原子操作。
  • Domain Object 层:由一系列的 POJO(Plain Old Java Object,即普通的、传统的Java对象)组成,是一些简单的 Java Bean 类。
  • 数据库:MySQL 数据库,存储持久化数据。

2.4 预期效果

登录页面:

SSM + easyUI 搭建简易的人事管理系统_第3张图片
此处输入图片的描述

系统主页:

SSM + easyUI 搭建简易的人事管理系统_第4张图片
此处输入图片的描述

功能模块页面:

SSM + easyUI 搭建简易的人事管理系统_第5张图片
此处输入图片的描述

三、实验总结

本节课程主要对人事管理系统的系统结构和功能进行了分析,下一节我们将完成项目环境的搭建。

项目环境搭建

一、实验介绍

1.1 实验内容

本节课程主要用 Maven 搭建项目环境,并添加所需的 jar 包。

1.2 实验知识点

  • Maven 环境搭建
  • Maven 工程创建
  • pom.xml 文件配置

1.3 实验环境

  • Eclipse JavaEE
  • Xfce终端

二、项目文件结构

SSM + easyUI 搭建简易的人事管理系统_第6张图片
此处输入图片的描述

SSM + easyUI 搭建简易的人事管理系统_第7张图片
此处输入图片的描述

SSM + easyUI 搭建简易的人事管理系统_第8张图片
此处输入图片的描述

SSM + easyUI 搭建简易的人事管理系统_第9张图片
此处输入图片的描述

三、实验步骤

3.1 Maven 环境搭建

请打开实验环境桌面上的 Xfce ,输入:

wget http://labfile.oss.aliyuncs.com/courses/33/apache-maven-3.3.9-bin.tar.gz

获取 Maven 最新安装包。
然后解压,继续输入:

tar -zvxf apache-maven-3.3.9-bin.tar.gz

接下来,部署,继续输入:

sudo gedit /etc/profile

用 gedit 编辑器打开 profile 文件,修改 Path 。

在 profile 文件的最后输入:

#set Maven environment
export MAVEN_HOME=/home/shiyanlou/apache-maven-3.3.9
export PATH=${MAVEN_HOME}/bin:${PATH}

设置好 MAVEN_HOME 和 PATH 之后,保存退出。

然后输入:

source /etc/profile

使操作立即生效。

至此,此 Maven 安装完成,继续输入:

mvn -v

显示如图,则安装成功。

SSM + easyUI 搭建简易的人事管理系统_第10张图片
此处输入图片的描述

3.2 导入 Maven 项目所需的包

由于 Maven 新建项目需要很多包,首先会扫描本地仓库,如果没有则需要联网,在中央仓库下载到本地仓库。我们已经把本次项目需要的包已经打包传到服务器上,现在,我们只需要从实验楼下载所要的包,并安放到正确的位置即可。

仍旧在 Xfce 中,输入:

wget http://labfile.oss.aliyuncs.com/courses/824/res.tar.gz

然后,解压:

tar -zxvf res.tar.gz

解压完成后,生成的 .M2 文件夹和之前我们解压的 apache-maven-3.3.9 同在目录: /home/shiyanlou/ 下。已知,默认的 maven 本地仓库在 /home/shiyanlou/.m2/ 下。

.m2 文件夹的默认是隐藏文件夹,若要查看,请点击 视图 ,点击: 显示隐藏文件

SSM + easyUI 搭建简易的人事管理系统_第11张图片
此处输入图片的描述

3.3 创建 Maven 工程

打开 eclipse ,鼠标右键 New -> other ,如图:

SSM + easyUI 搭建简易的人事管理系统_第12张图片
此处输入图片的描述

在里面可以找到 Maven 选项卡,点击 Maven Project , 点击 Next ,如图:

SSM + easyUI 搭建简易的人事管理系统_第13张图片
此处输入图片的描述

勾选 Create a simple project

SSM + easyUI 搭建简易的人事管理系统_第14张图片
此处输入图片的描述

点击 Next。

SSM + easyUI 搭建简易的人事管理系统_第15张图片
此处输入图片的描述

填写:

  • Group Id:项目的组织机构,也是包的目录结构,一般都是域名的倒序,比如 com.shiyanlou
  • Atifact Id :项目实际的名字,比如 hrms
  • Packaging :选择 war
  • Version :项目版本号比如 0.0.1-SNAPSHOT

点击 Finish,完成创建。

SSM + easyUI 搭建简易的人事管理系统_第16张图片
此处输入图片的描述

注:如果是直接下载的 Maven 仓库,这里会报错。

此处输入图片的描述

解决办法:右键选中该问题, 选择 Quick Fix,点击 Finish

SSM + easyUI 搭建简易的人事管理系统_第17张图片
此处输入图片的描述

为了能在 Tomcat 上发布,我们接着完成下面的步骤。

右击项目,选择 properties,找到 Project Facets,点击右侧的链接 Convert to faceted form...

SSM + easyUI 搭建简易的人事管理系统_第18张图片
此处输入图片的描述

勾选 Dynamic Web Module 后,依次点击 ApplyOK

SSM + easyUI 搭建简易的人事管理系统_第19张图片
此处输入图片的描述

这样我们项目目录下多了 WebContent 的目录。

SSM + easyUI 搭建简易的人事管理系统_第20张图片
此处输入图片的描述

然后将 WebContent 目录下的 META-INFWEB-INF 直接剪切到 src/main/webapp 下,并将 WebContent 目录删除。

SSM + easyUI 搭建简易的人事管理系统_第21张图片
此处输入图片的描述

右击项目,选择 properties,选择 Deployment Assembly

SSM + easyUI 搭建简易的人事管理系统_第22张图片
此处输入图片的描述

选择 WebContent,并将它 remove 掉。

SSM + easyUI 搭建简易的人事管理系统_第23张图片
此处输入图片的描述

接着重新指定一个 web 路径,点击 Add,选择 Folder,点击 Next。

SSM + easyUI 搭建简易的人事管理系统_第24张图片
此处输入图片的描述

src/main 下找到 webapp 目录,点击 Finish。

SSM + easyUI 搭建简易的人事管理系统_第25张图片
此处输入图片的描述

继续点击 Add ,选择 Java Build Path Entries

SSM + easyUI 搭建简易的人事管理系统_第26张图片
此处输入图片的描述

将当前 build path 指向 Maven Dependency

SSM + easyUI 搭建简易的人事管理系统_第27张图片
此处输入图片的描述

点击 Apply 和 OK。

最后在 src/main/webapp/WEB-INF 目录下新建一个 web.xml 文件

SSM + easyUI 搭建简易的人事管理系统_第28张图片
此处输入图片的描述

注:如果后面出现 An error has occurred. See error log for more details. Java.lang.NullPointerException 的错误,删除 web.xml 文件重新建立。

警告消除

创建好 Maven 工程后发现有警告:

此处输入图片的描述

解决方法:

右键项目 hrms,选择 Build Path -> Configure Build Path

SSM + easyUI 搭建简易的人事管理系统_第29张图片
此处输入图片的描述

在弹出的窗口中选择 Java Build Path -> Librariesremove 掉 J2SE-1.5 版本的 Library;

SSM + easyUI 搭建简易的人事管理系统_第30张图片
此处输入图片的描述

然后点击 Add Library..

SSM + easyUI 搭建简易的人事管理系统_第31张图片
此处输入图片的描述

在弹出的窗口中选择 JRE System Library

SSM + easyUI 搭建简易的人事管理系统_第32张图片
此处输入图片的描述

接着点击 Installed JREs...

SSM + easyUI 搭建简易的人事管理系统_第33张图片
此处输入图片的描述

在新窗口选择 java 7 的版本,点击 OK;

SSM + easyUI 搭建简易的人事管理系统_第34张图片
此处输入图片的描述

最后点击 Finish 即可消除警告。

SSM + easyUI 搭建简易的人事管理系统_第35张图片
此处输入图片的描述

3.4 配置 pom.xml

注:如果未通过 3.2 的命令下载 Maven 项目所需的包到本地,需进行下面的步骤添加 ueditor 的 jar 包,其他 jar 包的下载也需联网进行。

由于我们项目中使用到的 ueditor 编辑器的 jar 包不存在远程和本地仓库,项目的 pom.xml 中无法添加依赖,导致无法使用 mvn 打包发布,我们需要手动添加到本地仓库。

添加方法:

打开终端输入下面的命令获得 ueditor 的 jar 包,保存到目录 /home/shiyanlou/ 下;

http://labfile.oss.aliyuncs.com/courses/824/ueditor-1.1.2.jar

在终端中输入命令进行 install

mvn install:install-file -Dfile=/home/shiyanlou/ueditor-1.1.2.jar -DgroupId=com.baidu -DartifactId=ueditor -Dversion=1.1.2 -Dpackaging=jar

这样就将 ueditor 的 jar 包手动添加到了本地仓库。

打开 pom.xml 文件,添加项目所需 jar 的依赖,代码如下:


    4.0.0

    com.shiyanlou
    hrms
    0.0.1-SNAPSHOT
    jar

    hrms
    http://maven.apache.org

    

        5.1.25
        3.3.0
        1.2.2
        4.2.0.RELEASE
        UTF-8
        1.2
        true
    

    
        
            junit
            junit
            4.10
            test
        
        
            org.springframework
            spring-test
            ${spring.version}
            test
        

        
        
            commons-logging
            commons-logging
            1.1.3
        
        
            commons-collections
            commons-collections
            3.2.1
        
        
            commons-io
            commons-io
            2.4
        
        
            commons-lang
            commons-lang
            2.6
        
        
        
        
            org.mybatis
            mybatis
            ${mybatis.version}
        
        
            org.mybatis
            mybatis-spring
            ${mybatis-spring.version}
        
        
            mysql
            mysql-connector-java
            ${jdbc.driver.version}
            runtime
        
        
        
        
            org.slf4j
            slf4j-api
            1.7.7
        
        
            org.slf4j
            slf4j-log4j12
            1.7.7
        
        
            log4j
            log4j
            1.2.16
        
        
        
        
            org.aspectj
            aspectjrt
            1.7.4
        
        
            org.aspectj
            aspectjweaver
            1.7.4
        
        
        
        
            org.springframework
            spring-core
            ${spring.version}
        
        
            org.springframework
            spring-beans
            ${spring.version}
        
        
            org.springframework
            spring-context-support
            ${spring.version}
        
        
            org.springframework
            spring-jdbc
            ${spring.version}
        
        
            org.springframework
            spring-tx
            ${spring.version}
        
        
            org.springframework
            spring-webmvc
            ${spring.version}
        

        
            javax.servlet
            javax.servlet-api
            3.1.0
            provided
        
        
            javax.servlet.jsp
            jsp-api
            2.2
        
        
            javax.servlet
            jstl
            1.2
        
    
        
            net.sf.json-lib
            json-lib
            2.2.3
            jdk15
        

        
            com.fasterxml.jackson.core
            jackson-databind
            2.5.3
        

        
            com.alibaba
            fastjson
            1.2.4
        

        
        
            commons-fileupload
            commons-fileupload
            1.3.1
        
        
            commons-codec
            commons-codec
            1.9
        
        
            org.json
            json
            20160810
        
        
            com.baidu
            ueditor
            1.1.2
        

        
            com.alibaba
            druid
            1.0.24
        
    


注:如果没有通过 3.2 节下载 jar 包到本地仓库,则会联网下载配置的依赖 jar。

四、实验总结

到这里我们就完成了整个项目的环境搭建,包括用 Maven 引入 jar 包,下一节我们将完成数据库的设计实现。

参考链接

  • Java EE应用的分层模型
  • 《Spring+MyBatis 企业应用实战》

最后:

以上所有内容均截选自实验楼项目教程【SSM + easyUI 搭建简易的人事管理系统】的前两节内容,该教程总共12节内容,剩下内容如下:

  • 数据库设计实现
  • 持久化实体
  • DAO 层实现
  • Service 层实现
  • Spring 与 MyBatis 整合
  • Controller 层实现
  • 表现层 JSP 页面实现
  • 拦截器及 Spring MVC 整合
  • 运行测试与总结
  • 附录:项目工程导入及问题解决

如果想要查看全部内容,点击【SSM + easyUI 搭建简易的人事管理系统】即可~

你可能感兴趣的:(SSM + easyUI 搭建简易的人事管理系统)