员工管理系统 - 增删改查

entity
查询所有功能
- 查询所有的页面 emplist.html
保存员工
- 保存员工的页面 addEmp.html
删除员工
修改员工
- 根据id查询员工
- 修改员工信息
- 更新员工页面 updateEmp.html
总结

Github地址：https://github.com/szluyu99/ems_thymeleaf

基于 springboot + thymeleaf + mybatis 的员工管理系统 —— 登录与注册功能

前面我们已经实现了注册与登录功能，整体的开发流程从 entity -> dao -> service -> controller 已经很详细了，这篇博客就不按照那么详细的流程记录了，根据这个流程看代码自己体会吧。

entity

在 com.yusael.entity 下创建 Emp.java：

@Data
@AllArgsConstructor
@NoArgsConstructor
@ToString
public class Emp {private String id;private String name;private String salary;private Double age;private Date bir;
}

查询所有功能

在 com.yusal.dao包下创建 EmpDAO.java 接口：

package com.yusael.dao;import com.yusael.entity.Emp;
import java.util.List;public interface EmpDAO {List<Emp> findAll(); // 查询所有
}

在 resources/com/yusael/mapper 下创建 EmpDAOMapper.xml：

<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.yusael.dao.EmpDAO"><!--查询所有--><select id="findAll" resultType="Emp">select id, name, salary, age, bir from t_emp</select></mapper>

在 com.yusael.service 包下创建 EmpService.java 接口：

package com.yusael.service;import com.yusael.entity.Emp;
import java.util.List;public interface EmpService {List<Emp> findAll();
}

在 com.yusael.service 包创建 EmpServiceImpl.java 中增加：

package com.yusael.service;import com.yusael.dao.EmpDAO;
import com.yusael.entity.Emp;
import org.springframework.beans.factory.annotation.Autowired;
import java.util.List;public class EmpServiceImp implements EmpService {@Autowiredprivate EmpDAO empDAO;@Overridepublic List<Emp> findAll() {return empDAO.findAll();}
}

com.yusael.controller 包下创建 EmpController.java：

package com.yusael.controller;import com.yusael.entity.Emp;
import com.yusael.service.EmpService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import java.util.List;@Controller
@RequestMapping("/emp")
public class EmpController {@Autowiredprivate EmpService empService;@GetMapping("findAll")public String findAll(Model model) {List<Emp> emps = empService.findAll();model.addAttribute("emps", emps);return "/ems/emplist";}
}

查询所有的页面 emplist.html

这里的页面只有 .html，css 和 img 可以去看完整的项目：https://github.com/szluyu99/ems_thymeleaf。

emplist.html：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns:th="http://www.thymeleaf.org"><head><title>emplist</title><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><link rel="stylesheet" type="text/css" th:href="@{/css/style.css}" /></head><body><div id="wrap"><div id="top_content"> <div id="header"><div id="rightheader"><p>2009/11/20<br /></p></div><div id="topheader"><h1 id="title"><a href="#">main</a></h1></div><div id="navigation"></div></div><div id="content"><p id="whereami"></p><h1>Welcome <span th:text="${session.user.username}"/>!</h1><table class="table"><tr class="table_header"><td>ID</td><td>Name</td><td>Salary</td><td>Age</td><td>Bir</td><td>Operation</td></tr><tr  th:class=${empStat.odd}?'row1':'row2' th:each="emp,empStat : ${emps}"><td><span th:text="${emp.id}"/></td><td><span th:text="${emp.name}"/></td><td><span th:text="${emp.salary}"/></td><td><span th:text="${emp.age}"/></td><td><span th:text="${#dates.format(emp.bir,'yyyy-MM-dd')}"/></td><td><a th:href="@{/emp/delete(id=${emp.id})}">delete emp</a>&nbsp;|&nbsp;<a th:href="@{/emp/find(id=${emp.id})}">update emp</a></td></tr></table><p><input type="button" class="button" value="Add Employee" onclick="location.href='/ems/toSave'"></p></div></div><div id="footer"><div id="footer_bg">ABC@126.com</div></div></div></body>
</html>

至此，接着上篇文章的登录功能，点击 Submit 以后，可以跳转到查询所有的界面了。

运行 EmsApplication.java，浏览器网址输入 http://localhost:8989/ems/index，跳转到登录界面，输入用户名和密码（没有就注册），点击 Submit。

成功跳转到了查询所有的页面，但是此时数据中没有数据，所以显示为空。

保存员工

com.yusal.dao包： EmpDAO.java 接口中增加一个方法：

void save(Emp emp);

resources/com/yusael/mapper 目录下： EmpDAOMapper.xml 增加如下代码：

<!--保存员工-->
<insert id="save" parameterType="Emp">insert into t_emp values (#{id}, #{name}, #{salary}, #{age}, #{bir})
</insert>

com.yusael.service 包：EmpService.java 接口增加一个方法：

void save(Emp emp);

com.yusael.service 包：EmpServiceImpl.java 增加一个方法实现：

@Override
public void save(Emp emp) {emp.setId(UUID.randomUUID().toString());empDAO.save(emp);
}

com.yusael.controller 包：EmpController.java 增加：

@GetMapping("/save")
public String findAll(Emp emp) {empService.save(emp);return "redirect:/emp/findAll";
}

保存员工的页面 addEmp.html

addEmp.html：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns:th="http://www.thymeleaf.org"><head><title>add Emp</title><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><link rel="stylesheet" type="text/css"href="css/style.css" /></head><body><div id="wrap"><div id="top_content"><div id="header"><div id="rightheader"><p>2009/11/20<br /></p></div><div id="topheader"><h1 id="title"><a href="#">Main</a></h1></div><div id="navigation"></div></div><div id="content"><p id="whereami"></p><h1>add Emp info:</h1><form th:action="@{/emp/save}" method="post"><table cellpadding="0" cellspacing="0" border="0"class="form_table"><tr><td valign="middle" align="right">name:</td><td valign="middle" align="left"><input type="text" class="inputgri" name="name" /></td></tr><tr><td valign="middle" align="right">salary:</td><td valign="middle" align="left"><input type="text" class="inputgri" name="salary" /></td></tr><tr><td valign="middle" align="right">age:</td><td valign="middle" align="left"><input type="text" class="inputgri" name="age" /></td></tr><tr><td valign="middle" align="right">bir:</td><td valign="middle" align="left"><input type="text" class="inputgri" name="bir" /></td></tr></table><p><input type="submit" class="button" value="Confirm" /></p></form></div></div><div id="footer"><div id="footer_bg">ABC@126.com</div></div></div></body>
</html>

至此，保存员工功能已经完成，之前我们完成到查询所有功能，在查询所有的页面上点击 Add Employee 进入保存员工页面：

在保存员工的页面输入信息，点击 Confirm：

点击确认以后，员工信息已经成功保存到数据库，并且页面自动给跳转回查询所有界面。

删除员工

com.yusal.dao包： EmpDAO.java 接口中增加一个方法：

void delete(String id);

resources/com/yusael/mapper 目录下： EmpDAOMapper.xml 增加如下代码：

<!--删除员工-->
<delete id="delete" parameterType="String">delete from t_empwhere id = #{id}
</delete>

com.yusael.service 包：EmpService.java 接口增加一个方法：

void delete(String id);

com.yusael.service 包：EmpServiceImpl.java 增加一个方法实现：

@Override
public void delete(String id) {empDAO.delete(id);
}

com.yusael.controller 包：EmpController.java 增加：

@GetMapping("/delete")
public String delete(String id) {empService.delete(id);return "redirect:/emp/findAll";
}

至此，删除员工的功能已经完成。
之前我们曾经往员工表中添加了一个信息，现在让我们尝试去删除它，在查询所有页面，点击 delete emp，删除该条员工记录。

点击 delete emp 后跳转回查询所有的页面，并且该条记录成功被删除。

修改员工

修改员工由两个部分组成：根据id查询员工，修改员工信息。

根据id查询员工

com.yusal.dao 包： EmpDAO.java 接口中增加一个方法：

Emp find(String id);

resources/com/yusael/mapper 目录下： EmpDAOMapper.xml 增加如下代码：

<!--根据id查询员工-->
<select id="find" parameterType="String" resultType="Emp">select id, name, salary, age, birfrom t_empwhere id = #{id}
</select>

com.yusael.service 包：EmpService.java 接口增加一个方法：

Emp find(String id);

com.yusael.service 包：EmpServiceImpl.java 增加一个方法实现：

@Override
public Emp find(String id) {return empDAO.find(id);
}

com.yusael.controller 包：EmpController.java 增加：

// 根据id查询员工
@GetMapping("/find")
public String find(String id, Model model) {Emp emp = empService.find(id);model.addAttribute("emp", emp);return "/ems/updateEmp";
}

至此，我们可以通过点击 update emp，跳转到修改员工的页面：

此时以及可以跳转到修改员工信息的页面了，但是真正的修改操作还没有去做，下面我们将去完善这个功能。

修改员工信息

com.yusal.dao 包： EmpDAO.java 接口中增加一个方法：

void update(Emp emp);

resources/com/yusael/mapper 目录下： EmpDAOMapper.xml 增加如下代码：

<!--修改员工信息-->
<update id="update" parameterType="Emp">update t_emp set name = #{name}, salary = #{salary}, age = #{age}, bir = #{bir}where id = #{id}
</update>

com.yusael.service 包：EmpService.java 接口增加一个方法：

void update(Emp emp);

com.yusael.service 包：EmpServiceImpl.java 增加一个方法实现：

@Override
public void update(Emp emp) {empDAO.update(emp);
}

com.yusael.controller 包：EmpController.java 增加：

// 修改员工信息
@PostMapping("/update")
public String update(Emp emp) {empService.update(emp);return "redirect:/emp/findAll";
}

至此，我们完成了修改员工信息的功能。

刚刚我们点击 update emp，进入了修改员工信息的页面：

我们将信息修改过后，点击 Confirm。

点击 Confirm，跳转回查询所有页面，可以看到信息已经修改了。

更新员工页面 updateEmp.html

updateEmp.html：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns:th="http://www.thymeleaf.org"><head><title>update Emp</title><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><link rel="stylesheet" type="text/css" th:href="@{/css/style.css}" /></head><body><div id="wrap"><div id="top_content"><div id="header"><div id="rightheader"><p>2009/11/20<br /></p></div><div id="topheader"><h1 id="title"><a href="#">Main</a></h1></div><div id="navigation"></div></div><div id="content"><p id="whereami"></p><h1>update Emp info:</h1><form th:action="@{/emp/update}" method="post"><table cellpadding="0" cellspacing="0" border="0"class="form_table"><tr><td valign="middle" align="right">id:</td><td valign="middle" align="left"><span th:text="${emp.id}"/><input type="hidden" th:value="${emp.id}" name="id"></td></tr><tr><td valign="middle" align="right">name:</td><td valign="middle" align="left"><input type="text" class="inputgri" name="name" th:value="${emp.name}"/></td></tr><tr><td valign="middle" align="right">salary:</td><td valign="middle" align="left"><input type="text" class="inputgri" name="salary" th:value="${emp.salary}"/></td></tr><tr><td valign="middle" align="right">age:</td><td valign="middle" align="left"><input type="text" class="inputgri" name="age" th:value="${emp.age}"/></td></tr><tr><td valign="middle" align="right">bir</td><td valign="middle" align="left"><input type="text" class="inputgri" name="bir" th:value="${#dates.format(emp.bir,'yyyy/MM/dd')}"/></td></tr></table><p><input type="submit" class="button" value="Confirm" /></p></form></div></div><div id="footer"><div id="footer_bg">ABC@126.com</div></div></div></body>
</html>

至此，整个员工管理系统开发完毕。

总结

可以看到，利用 spring boot 开发一个小系统的流程是十分简单的；

只要搭建好整个系统的架构，完成一个功能，后续添加功能是十分方便的。

最重要的不是细节，是对整体架构的把握。

基于springboot+thymeleaf+mybatis的员工管理系统 —— 增删改查相关推荐

基于springboot+thymeleaf+mybatis的员工管理系统 —— 登录与注册
员工管理系统 - 登录与注册功能创建项目 pom.xml 数据库表设计和环境准备建表SQL application.properties 用户注册与登录功能 entity dao service ...
基于 Springboot 和 Mybatis 的后台管理系统 BootD
源码名称:基于 Springboot 和 Mybatis 的后台管理系统 BootD 下载地址:https://www.chtml.cn/product/show/10867 项目介绍面向学习型的开 ...
Maynor手把手教你完成一个SpringBoot+Vue+Element实现的SPA商品管理系统(增删改查)
Maynor手把手教你完成一个SpringBoot+Vue+Element实现的SPA商品管理系统(增删改查) 前言完整代码三连后私信我获取~ 撸了一上午完成的SPA商品管理系统,求三连! B站演 ...
WEB阶段7:综合练习-联系人管理系统-增删改查查询分页
综合练习-联系人管理系统-增删改查&查询分页回顾能够说出过滤器的作用解决全局乱码问题用户权限访问控制用户输入文本内容进行过滤能够编写过滤器创建一个类实现javax.servlet ...
无需编程，基于微软mssql数据库零代码生成CRUD增删改查RESTful API接口
无需编程,基于微软mssql数据库零代码生成CRUD增删改查RESTful API接口回顾通过之前一篇文章无需编程,基于甲骨文oracle数据库零代码生成CRUD增删改查RESTful API接 ...
C语言学生管理系统增删改查
基于C语言和txt文件的增删改查转载请注明出处 1.背景本系统基于学生信息管理,完成了学生的信息的读取.增加.删除.修改.查询.本身意义可能不大,但是有很多学生再刚开始学习的时候,往往布置的大作业 ...
Java-GUI编程实战之管理系统 Day3【学生管理系统GUI设计、学生管理系统增删改查、项目MVC结构介绍、Java技能图谱】
视频.课件.源码[链接:https://pan.baidu.com/s/13ffqGDzH-DZib6-MFViW3Q 提取码:zjxs] Java-GUI编程实战之管理系统 Day1[项目开发流程. ...
dept在Java里面_EmpDeptManager 在JavaEE环境下搭建三大框架体系实现员工的增删改查系统 Develop 261万源代码下载- www.pudn.com...
文件名称: EmpDeptManager下载收藏√ [ 5 4 3 2 1 ] 开发工具: Java 文件大小: 39 KB 上传时间: 2016-07-08 下载次数: 0 提供者 ...
servlet mysql insert_servlet+mybatis 实现mysql的增删改查实例
古人云:温故而知新.趁周末,重新来学习了一遍servlet + mybatis 实现mysql的增删改查,算是对自己学习的一个总结和记录. 开门见山,首先我们来看一下项目目录结构: 不难发现这是一个m ...

基于springboot+thymeleaf+mybatis的员工管理系统 —— 增删改查

员工管理系统 - 增删改查

entity

查询所有功能

查询所有的页面 emplist.html

保存员工

保存员工的页面 addEmp.html

删除员工

修改员工

根据id查询员工

修改员工信息

更新员工页面 updateEmp.html

总结

基于springboot+thymeleaf+mybatis的员工管理系统 —— 增删改查相关推荐

最新文章

热门文章