一、样卷:
一、功能要求
请编写一个程序,完成对员工的管理 ,实现员工列表显示、员工添加功能。
二、具体功能要求及推荐实现步骤
导入一个Web-Maven工程,把工程名改为ems-班级-学号(如:ems-ruanjian222-01),采用前后端分离架构,前端使用HTML+CSS+JS+axios技术,后端采用Servlet+json+c3p0+dbutils技术或者使用SSM框架技术开发此系统,实现步骤如下:
- 创建数据库ems,数据表:员工信息表(employee)、部门信息表(department),设置主键自增,并添加不少于3条测试数据,表结构在下面。
- 创建实体类Employee、Department,根据业务提供需要的构造方法和setter/getter方法。
- 创建C3p0Util数据连接工具类连接数据库或者使用Mybatis配置文件。
- 创建EmployeeDAO类,编写添加员工方法、获取员工列表方法;创建DepartmentDAO,编写获取部门列表的方法。
- 编写Servlet或者SSM架构的接口实现以下功能:
a.实现员工列表查询功能,给前端返回员工列表json字符串;
b.实现获取所有部门的功能,给前端返回所有部门的json串;
c.实现员工添加,给前端返回是否成功的标识;
6.在employee_list.html实现发送获取所有员工的异步请求,并把结果展示出来。
7、在employee_add.html实现获取用户的输入并异步发送给后端,如果添加成功,跳转到列表界面。
开发环境:tomcat9.x.x
二、具体功能要求及推荐实现步骤
2.1.打开基础项目
下载基础项目:https://download.csdn.net/download/daqi1983/88571967,解压后修改项目所在的文件夹为 ems-班级-学号(如:ems-ruanjian222-01),同时修改pom.xml文件中的项目信息,如下:
<artifactId>ems-班级-学号</artifactId>
<version>1.0-SNAPSHOT</version>
<name>ems-班级-学号</name>
2.2.创建数据库ems,数据表:
员工信息表(employee)、部门信息表(department),设置主键自增,并添加不少于3条测试数据,表结构如下:
表名 | employee | |||
列名 | 数据类型(精度范围) | 空/非空 | 约束条件 | 注释 |
id | int | 非空 | PK | 员工id |
name | varchar(50) | 非空 | 员工姓名 | |
phone | varchar(50) | 非空 | 手机号 | |
department_id | int | 非空 | 部门id |
表名 | department | |||
列名 | 数据类型(精度范围) | 空/非空 | 约束条件 | 注释 |
id | int | 非空 | PK | 部门id |
name | varchar(30) | 非空 | 部门名称 |
2.3.创建实体类Employee、Department
根据业务提供需要的构造方法和setter/getter方法。
/**
* 部门实体类
* @author 林辛
* 2021年12月13日
*/
public class Department {
private Integer id;
private String name;//部门名称
public Department(){}
public Integer getId() {
return id;
}
public void setId(Integer id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}
package cn.zptc.entity;
/**
* 员工实体类
* @author 林辛
* 2021年12月13日
*/
public class Employee {
private Integer id;
private String name;//员工姓名
private String phone;//员工手机号码
private Integer departmentId;//员工所属部门Id
private String departmentName;//员工所属部门名称
//补充getter setter方法
public Employee() {
}
public Integer getId() {
return id;
}
public void setId(Integer id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getPhone() {
return phone;
}
public void setPhone(String phone) {
this.phone = phone;
}
public Integer getDepartmentId() {
return departmentId;
}
public void setDepartmentId(Integer departmentId) {
this.departmentId = departmentId;
}
public String getDepartmentName() {
return departmentName;
}
public void setDepartmentName(String departmentName) {
this.departmentName = departmentName;
}
}
2.4.创建EmployeeDAO类
编写添加员工方法 , 获取员工列表方法
public class EmployeeDAO {
// 添加员工方法
public int insertEmployee(Employee employee) throws SQLException {
String sql= "INSERT INTO `ems`.`employee` (`name`,`phone`,`department_id`) VALUES (?,?,?)";
QueryRunner runner= new QueryRunner(C3p0Util.getDataSource());
int row =runner.update(sql, employee.getName(),employee.getPhone(),employee.getDepartmentId());
return row;
}
// 获取员工列表
public List<Employee> selectAllEmployees() throws SQLException {
String sql="SELECT e.`id`,e.`name`,e.`phone`, d.`name` AS departmentName " +
"FROM `employee` e LEFT JOIN `department` d ON e.`department_id` = d.`id`";
QueryRunner runner=new QueryRunner(C3p0Util.getDataSource());
List<Employee> list = runner.query(sql, new BeanListHandler<Employee>(Employee.class));
return list;
}
}
2.5.创建DepartmentDAO
编写获取部门列表的方法。
public class DepartmentDAO {
// 获取所有部门
public List<Department> selectAllDepartments() throws SQLException {
String sql = "select * from department";
QueryRunner runner = new QueryRunner(C3p0Util.getDataSource());
return runner.query(sql, new BeanListHandler<Department>(Department.class));
}
}
2.6.开发并配置相关Servlet(3个)
实现员工列表查询
/**
* 处理"/getAllEmployees"请求。
* 通过EmployeeDAO查询出所有员工,然后转化为json字符串,
* 最后把json串向外输出。
*/
@WebServlet("/getAllEmployees")
public class GetAllEmployeesServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response){
//1. 调用dao查询
EmployeeDAO dao = new EmployeeDAO();
try {
List<Employee> allEmployees = dao.selectAllEmployees();
//2. 将集合转换为JSON数据 序列化
String jsonString = JSON.toJSONString(allEmployees);
//3. 响应数据
response.setContentType("text/json;charset=utf-8");
response.getWriter().write(jsonString);
} catch (Exception e) {
e.printStackTrace();
}
}
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doGet(request, response);
}
}
实现查询所有部门
/**
* 处理"/getAllDepartments"请求
* 先查询出所有的部门信息,然后转化为json串,
* 最后向外输出json串
*/
@WebServlet("/getAllDepartments")
public class GetAllDepartmentsServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response){
//1. 创建dao对象
DepartmentDAO dao = new DepartmentDAO();
try {
List<Department> list = dao.selectAllDepartments();
//2. 将集合转换为JSON数据,也就是序列化
String jsonString = JSON.toJSONString(list);
//3. 响应数据
response.setContentType("text/json;charset=utf-8");
response.getWriter().write(jsonString);
} catch (Exception e) {
e.printStackTrace();
}
}
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doGet(request, response);
}
}
实现员工添加并跳转至列表界面
/**
* 处理“/addEmployee”请求。
* 从request对象中获取新员工信息,
* 通过GSON工具把这些信息封装到员工对象,
* 然后通过EmployeeDAO添加新员工到数据库,
* 最后向外输出添加是否成功的标识。
*/
@WebServlet("/addEmployee")
public class AddEmployeeServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response){
//1. 获取请求体数据
BufferedReader br = request.getReader();
String params = br.readLine();
// 将JSON字符串转为Java对象
Employee employee = JSON.parseObject(params, Employee.class);
//2. 调用dao添加
EmployeeDAO dao = new EmployeeDAO();
try {
dao.addEmployee(employee);
//3. 响应成功标识
response.getWriter().write("success");
} catch (Exception e) {
e.printStackTrace();
//3. 响应失败标识
response.getWriter().write("fail");
}
}
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doGet(request, response);
}
}
2.7.开发员工列表页面employee_list.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>员工列表</title>
</head>
<body>
<a href="employee_add.html"><input type="button" value="新增"></a><br>
<hr>
<table id="brandTable" border="1" cellspacing="0" width="100%">
<tr>
<td bgcolor="#A3E6DF">id</td>
<td bgcolor="#A3D7E6">姓名</td>
<td bgcolor="#A3CCE6">电话</td>
<td bgcolor="#A3CCE6">部门名称</td>
</tr>
</table>
<script src="js/axios-0.18.0.js"></script>
<script>
//1. 当页面加载完成后,发送ajax请求
window.onload = function () {
//2. 发送ajax请求
axios({
method:"get",
url:"http://localhost/getAllEmployees"
}).then(function (resp) {
//获取数据
let list = resp.data;
let tableData = " <tr>\n" +
" <th>id</th>\n" +
" <th>姓名</th>\n" +
" <th>电话</th>\n" +
" <th>部门名称</th>\n" +
" </tr>";
for (let i = 0; i < list.length ; i++) {
let obj = list[i];
tableData += "\n" +
" <tr align=\"center\">\n" +
" <td>"+obj.id+"</td>\n" +
" <td>"+obj.name+"</td>\n" +
" <td>"+obj.phone+"</td>\n" +
" <td>"+obj.departmentName+"</td>\n" +
" </tr>";
}
// 设置表格数据
document.getElementById("brandTable").innerHTML = tableData;
})
}
</script>
</body>
</html>
2.8.员工添加页面(employee_add.html)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>添加员工</title>
</head>
<body>
<h3>添加员工</h3>
<form action="" method="post">
<table width="70%" >
<tr><td >姓名:<input id="name" type="text" name="name" /></td></tr>
<tr><td >手机号:<input id="phone" type="text" name="phone" /></td></tr>
<tr><td id="departments">所属部门:</td></tr>
<tr><td ><input id="btn" type="button" value="添加"/></td></tr>
</table>
</form>
<script src="js/axios-0.18.0.js"></script>
<script>
//1. 当页面加载完成后,发送ajax请求
window.onload = function () {
//2. 发送ajax请求
axios({
method:"get",
url:"http://localhost/getAllDepartments"
}).then(function (resp) {
let list = resp.data;
let departmentData="所属部门:";
for (let i = 0; i < list.length ; i++) {
let obj = list[i];
//<input type="radio" name="departmentId" value="${department.id}" >${department.name}
departmentData += "<input type=\"radio\" name=\"departmentId\" value="+
obj.id +" >"+obj.name;
}
// 设置表格数据
document.getElementById("departments").innerHTML = departmentData;
})
}
//1. 给按钮绑定单击事件
document.getElementById("btn").onclick = function () {
// 将表单数据转为json
var formData = {
name:"",
phone:"",
departmentId:"",
};
// 获取表单数据
let name = document.getElementById("name").value;
// 设置数据
formData.name = name;
// 获取表单数据
let phone = document.getElementById("phone").value;
// 设置数据
formData.phone = phone;
let departmentId = document.getElementsByName("departmentId");
for (let i = 0; i < departmentId.length; i++) {
if(departmentId[i].checked){
//
formData.departmentId = departmentId[i].value ;
}
}
console.log(formData);
//2. 发送ajax请求
axios({
method:"post",
url:"http://localhost/addEmployee",
data:formData
}).then(function (resp) {
// 判断响应数据是否为 success
if(resp.data == "success"){
location.href = "employee_list.html";
}
})
}
</script>
</body>
</html>
完成后的项目:
下载地址:https://download.csdn.net/download/daqi1983/88571903
sql:
CREATE DATABASE /*!32312 IF NOT EXISTS*/`ems` /*!40100 DEFAULT CHARACTER SET utf8mb4 */;
USE `ems`;
/*Table structure for table `department` */
DROP TABLE IF EXISTS `department`;
CREATE TABLE `department` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`name` varchar(30) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8mb4;
/*Data for the table `department` */
insert into `department`(`id`,`name`) values (1,'人力资源部'),(2,'销售部'),(3,'生产部');
/*Table structure for table `employee` */
DROP TABLE IF EXISTS `employee`;
CREATE TABLE `employee` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`name` varchar(30) NOT NULL,
`phone` varchar(30) NOT NULL,
`department_id` int(11) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8mb4;
/*Data for the table `employee` */
insert into `employee`(`id`,`name`,`phone`,`department_id`) values (1,'唐僧','135112345678',1),(2,'孙悟空','13645678932',2),(3,'猪八戒','13812345678',3);
练习
请编写一个程序,完成对商品的管理 ,实现显示所有商品、添加商品功能。
数据库名称:gms
表名 | goods | 商品表 | ||
列名 | 数据类型(精度范围) | 空/非空 | 约束条件 | 注释 |
id | int | 非空 | PK | 商品id |
name | varchar(50) | 非空 | 商品名字 | |
price | float | 非空 | 商品价格 | |
category_id | int | 非空 | 商品所属类别id |
表名 | category | 商品类别表 | ||
列名 | 数据类型(精度范围) | 空/非空 | 约束条件 | 注释 |
id | int | 非空 | PK | 商品类别id |
name | varchar(30) | 非空 | 商品类别名称 |