基于ssm的简单员工信息管理系统

员工信息管理系统

使用SSM框架搭建的一个简单的员工信息管理系统，实现了基本的增删改查流程

这是完整使用SSM框架开发的一个项目，项目来源于尚硅谷的SSM框架整合教程，其中加入了一些自己的理解，增加了一个搜索功能，这个项目总体来说对于新手是很友好的，涉及到了简单的ajax和jquery，UI搭建，后端SSM环境搭建，简单的业务流程设计（使用JSON交互）

界面UI

系统架构

功能分解

1. 查询和分页显示

2. 新增员工信息功能
   数据校验，需要校验用户名和邮箱是否合法
   前端使用jquery校验，后端使用JSR303校验

3. 修改员工信息功能

4. 单个删除员工

5. 批量删除员工

6. 使用Rest风格的URI

   URI:
   /emp/{id} 　GET　 查询员工
   /emp 　POST 　保存员工
   /emp/{id} 　PUT　 修改员工
   /emp/{id} 　DELETE　 删除员工

7. 高级搜索功能

技术点

• 基础框架：SpringMVC+Spring+MyBatis
• 数据库：MySQL
• 前端框架：BootStrap快速搭建
• 项目依赖管理：Maven
• 分页：pagehelper（Mybatis的工具）
• 逆向工程：MyBatis Generator

数据库表设计

基础环境搭建

1. 创建一个maven工程

2. 引入项目依赖的jar包

   spring
   springmvc
   mybatis
   数据库连接池，驱动包
   其他（jstl，servlet-api，junit）

3. 引入bootstrap前端框架

4. 编写ssm整合的关键配置文件

   ｗeb.xml，spring，springmvc，mybatis，使用mybatis的逆向工程生成对应的bean以及mapper

5. 测试mapper

功能实现

查询

1. 访问index.jsp页面
2. index.jsp页面发送出查询员工列表请求
3. EmployeeController来接受请求，查出员工数据
4. 来到list.jsp页面进行展示
5. pageHelper分页插件完成分页查询功能

查询-ajax

1. index.jsp页面直接发送ajax请求进行员工分页数据的查询
2. 服务器将查出的数据，以json字符串的形式返回给浏览器
3. 浏览器收到js字符串。可以使用js对json进行解析，使用js通过dom增删改改变页面。
4. 返回json。实现客户端的无关性。

新增

1. 在index.jsp页面点击”新增”
2. 弹出添加员工模态框
3. 去数据库查询部门列表，显示在对话框中
4. 用户输入数据，并进行校验

• jquery前端校验，ajax用户名重复校验，重要数据（后端校验(JSR303)，唯一约束）；

5. 完成保存

修改

1. 点击编辑
2. 弹出修改员工的模态框（显示员工信息）
3. 点击更新，完成员工修改

删除

1. 单个删除
2. 批量删除

搜索

1. 点击搜索
2. 弹出高级搜索的模态框
3. 用户填写需要搜索的员工信息
4. 点击搜索，查询出员工信息
5. 点击返回，可返回所有员工信息的首页