Employee.java：模拟员工表
package com.demo.web.pojo;
import lombok.Data;
import lombok.NoArgsConstructor;
import java.util.Date;
//员工表
@Data
@NoArgsConstructor
public class Employee {
private Integer id;
private String lastName;
private String email;
private Integer gender; //0：女 1：男
private Department department;
private Date birthday;
public Employee(Integer id, String lastName, String email, Integer gender, Department department) {
this.id = id;
this.lastName = lastName;
this.email = email;
this.gender = gender;
this.department = department;
//默认创建日期
this.birthday = new Date();
}
}
EmployeeDao.java：模拟员工数据库数据
package com.demo.web.dao;
import com.demo.web.pojo.Department;
import com.demo.web.pojo.Employee;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Repository;
import java.util.Collection;
import java.util.HashMap;
import java.util.Map;
//员工dao
@Repository
public class EmployeeDao {
//模拟数据库中的数据
private static Map<Integer, Employee> employees = null;
//员工所属部门
@Autowired //自动装配
private DepartmentDao departmentDao;
static {
employees = new HashMap<Integer, Employee>(); //创建一个员工表
employees.put(1001,new Employee(1001,"张三1","123@qq.com",1,new Department(101,"研发部")));
employees.put(1002,new Employee(1002,"张三2","123@qq.com",0,new Department(102,"测试部")));
employees.put(1003,new Employee(1003,"张三3","123@qq.com",1,new Department(103,"运维部")));
employees.put(1004,new Employee(1004,"张三4","123@qq.com",0,new Department(104,"产品部")));
}
//主键自增
private static Integer initId = 1005;
//增加一个员工
public void save(Employee employee) {
if(employee.getId()==null){
employee.setId(initId++);
}
employee.setDepartment(departmentDao.getDepartmentById(employee.getDepartment().getId()));
employees.put(employee.getId(),employee);
}
//查询所有员工信息
public Collection<Employee> getAll() {
return employees.values();
}
//通过id查询员工
public Employee getEmployeeById(Integer id) {
return employees.get(id);
}
//通过id删除员工
public void delete(Integer id) {
employees.remove(id);
}
}
EmployeeController.java：
把模拟数据库的类 @Autowired 自动装配 Bean
调用 EmployeeDao 的方法查询所有员工信息
addAttribute 用于将数据绑定到请求对象中的方法，以便在后续的页面中获取这些数据
返回 emp 目录下的 list.html 页面
import com.demo.web.dao.EmployeeDao;
import com.demo.web.pojo.Employee;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import java.util.Collection;
@Controller
public class EmployeeController {
@Autowired //自动装配
EmployeeDao employeeDao;
@RequestMapping("/emps")
public String list(Model model){
Collection<Employee> employees = employeeDao.getAll();
model.addAttribute("emps",employees);
return "emp/list";
}
}list.html：
<div th:insert="~{commons/commons::topbar}"></div>
<div class="container-fluid">
<div class="row">
<div th:insert="~{commons/commons::sidebar(active='list.html')}"></div>
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 pt-3 px-4">
<h2><a class="btn btn-sm btn-success" th:href="@{/emp}">添加员工</a></h2>
<div class="table-responsive">
<table class="table table-striped table-sm">
<thead>
<tr>
<th>id</th>
<th>lastName</th>
<th>email</th>
<th>gender</th>
<th>department</th>
<th>birthday</th>
<th>option</th>
</tr>
</thead>
<tbody>
<tr th:each="emp:${emps}">
<td th:text="${emp.getId()}"></td>
<td>[[${emp.getLastName()}]]</td>
<td th:text="${emp.getEmail()}"></td>
<td th:text="${emp.getGender()==0?'女':'男'}"></td>
<td th:text="${emp.getDepartment()}"></td>
<td th:text="${#dates.format(emp.getBirthday(), 'yyyy-MM-dd HH:mm:ss')}"></td>
<td>
<!-- <a class="btn btn-sm btn-primary" th:href="@{/emp/}+${emp.getId()}">编辑</a> -->
<a class="btn btn-sm btn-primary">编辑</a>
<a class="btn btn-sm btn-danger">删除</a>
</td>
</tr>
</tbody>
</table>
</div>
</main>
</div>
</div>效果如下：
员工列表展示：
1.提取公共页面
th:fragment="sidebar"
th:replace="~{commons/commons::topbar}"
如果要传递参数，直接使用 () 传参，接收判断即可
2.列表循环展示
添加员工：
1.按钮提交
2.跳转到添加页面
3.添加员工成功
4.返回首页
DepartmentDao.java：
package com.demo.web.dao;
import com.demo.web.pojo.Department;
import org.springframework.stereotype.Repository;
import java.util.Collection;
import java.util.HashMap;
import java.util.Map;
//部门dao
@Repository
public class DepartmentDao {
//模拟数据库中的数据
private static Map<Integer, Department> departments = null;
static {
departments = new HashMap<Integer,Department>(); //创建一个部门表
departments.put(101,new Department(101,"研发部"));
departments.put(102,new Department(102,"测试部"));
departments.put(103,new Department(103,"运维部"));
departments.put(104,new Department(104,"产品部"));
}
//获取所有部门信息
public Collection<Department> getDepartments() {
return departments.values();
}
//通过id获取部门信息
public Department getDepartmentById(Integer id) {
return departments.get(id);
}
}
EmployeeController.java：
import com.demo.web.dao.DepartmentDao;
import com.demo.web.dao.EmployeeDao;
import com.demo.web.pojo.Department;
import com.demo.web.pojo.Employee;
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.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import java.util.Collection;
@Controller
public class EmployeeController {
@Autowired //自动装配
EmployeeDao employeeDao;
@Autowired
DepartmentDao departmentDao;
@RequestMapping("/emps")
public String list(Model model){
Collection<Employee> employees = employeeDao.getAll();
model.addAttribute("emps",employees);
return "emp/list";
}
@GetMapping("/emp")
public String toAddpage(Model model){
//查出所有部门信息
Collection<Department> departments = departmentDao.getDepartments();
model.addAttribute("departments",departments);
return "emp/add";
}
@PostMapping("/emp")
public String addEmp(Employee employee){
employeeDao.save(employee); //调用底层业务方法保存员工信息
return "redirect:/emps";
}
}emp 目录下 add.html：
<div th:insert="~{commons/commons::topbar}"></div>
<div class="container-fluid">
<div class="row">
<div th:insert="~{commons/commons::sidebar(active='list.html')}"></div>
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 pt-3 px-4">
<form th:action="@{/emp}" method="post" >
<div class="form-group" ><label>LastName</label>
<input class="form-control" placeholder="名字" type="text" name="lastName">
</div>
<div class="form-group" ><label>Email</label>
<input class="form-control" placeholder="123@qq.com" type="email" name="email">
</div>
<div class="form-group"><label>Gender</label><br/>
<div class="form-check form-check-inline">
<input class="form-check-input" name="gender" type="radio" value="1">
<label class="form-check-label">男</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" name="gender" type="radio" value="0">
<label class="form-check-label">女</label>
</div>
</div>
<div class="form-group" ><label>department</label>
<select class="form-control" name="department.id">
<option th:each="dept:${departments}" th:text="${dept.getDepartmentName()}" th:value="${dept.getId()}"></option>
</select>
</div>
<div class="form-group" >
<label>Birthday</label>
<input class="form-control" placeholder="2024-08-15" type="text" name="birthday">
</div>
<button class="btn btn-primary" type="submit">添加</button>
</form>
</main>
</div>
</div>效果如下：
时间日期格式化：
# 时间日期格式化
spring.mvc.date-format=yyyy-MM-dd添加成功！
