第一步创建两张数据库表
员工表:
部门表:
第二步:
使用之前配置的mybatis-generator自动从数据库中生成pojo类与mapper映射文件
首先在配置文件中添加我们的表信息
<!--指定生成那个表--> <table tableName="employee" /> <table tableName="department" />
之后点击运行
在java.com.yang.mapper包中的xml文件需要移动到resources.com.yang.mapper中,这样spring才能找到
接下来我们直接看一个这个插件帮助我们生成的文件
EmployeeMapper
package com.yang.mapper; import com.yang.domain.Employee; import com.yang.domain.QueryVo; import java.util.List; public interface EmployeeMapper { int deleteByPrimaryKey(Integer id); int insert(Employee record); Employee selectByPrimaryKey(Integer id); List<Employee> selectAll(QueryVo queryVo); int updateByPrimaryKey(Employee record); }
EmployeeMapper.xml里面的选择所有以及插入跟更新修改了一下,并添加了一个修改离职状态的数据库操作,但是大体都是差不多的
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd"> <mapper namespace="com.yang.mapper.EmployeeMapper"> <resultMap id="BaseResultMap" type="com.yang.domain.Employee"> <id column="id" jdbcType="INTEGER" property="id" /> <result column="username" jdbcType="VARCHAR" property="username" /> <result column="password" jdbcType="VARCHAR" property="password" /> <result column="hiredate" jdbcType="TIMESTAMP" property="hiredate" /> <result column="phone" jdbcType="VARCHAR" property="phone" /> <result column="email" jdbcType="VARCHAR" property="email" /> <result column="state" jdbcType="BIT" property="state" /> <result column="admin" jdbcType="BIT" property="admin" /> <association property="department" javaType="com.yang.domain.Department" columnPrefix="d_"> <result property="id" column="id" /> <result property="name" column="name" /> </association> </resultMap> <delete id="deleteByPrimaryKey" parameterType="java.lang.Integer"> delete from employee where id = #{id,jdbcType=INTEGER} </delete> <insert id="insert" parameterType="com.yang.domain.Employee"> insert into employee (id, username, password, hiredate, phone, email, state, admin, dep_id) values (#{id,jdbcType=INTEGER}, #{username,jdbcType=VARCHAR}, #{password,jdbcType=VARCHAR}, #{hiredate}, #{phone,jdbcType=VARCHAR}, #{email,jdbcType=VARCHAR}, #{state}, #{admin,jdbcType=BIT}, #{department.id,jdbcType=INTEGER}) </insert> <update id="updateByPrimaryKey" parameterType="com.yang.domain.Employee"> update employee set username = #{username,jdbcType=VARCHAR}, hiredate = #{hiredate,jdbcType=TIMESTAMP}, phone = #{phone,jdbcType=VARCHAR}, email = #{email,jdbcType=VARCHAR}, admin = #{admin,jdbcType=BIT}, dep_id = #{department.id,jdbcType=INTEGER} where id = #{id,jdbcType=INTEGER} </update> <update id="changeState"> update employee set state = false where id=#{id} </update> <select id="selectByPrimaryKey" parameterType="java.lang.Integer" resultMap="BaseResultMap"> select id, username, password, hiredate, phone, email, state, admin, dep_id from employee where id = #{id,jdbcType=INTEGER} </select> <select id="selectAll" resultMap="BaseResultMap"> select e.id, e.username, e.password, e.hiredate, e.phone, e.email, e.state, e.admin, d.id as d_id, d.`name` as d_name from employee as e left join department as d on e.dep_id = d.id <where> <if test="keyword != null and keyword != ‘‘"> and e.username like concat(‘%‘,#{keyword},‘%‘) or e.phone like concat(‘%‘, #{keyword}, ‘%‘) or e.email like concat(‘%‘, #{keyword}, ‘%‘) </if> </where> </select> </mapper>
从上可以得出,这个插件可以帮助我们生成生成增删改查四种操作的迎神文件·映射文件以及domian中的pojo类,只需要再修改一下细节就可以了
生成文件之后,我们看一下关于员工的增删改查
首先看一下前端页面,我们使用的是easyUi,我把js文件封装到一个文件中
// common.js <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/plugins/easyui/uimaker/easyui.css"> <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/plugins/easyui/uimaker/icon.css"> <script type="text/javascript" src="${pageContext.request.contextPath}/static/plugins/easyui/jquery.min.js"></script> <script type="text/javascript" src="${pageContext.request.contextPath}/static/plugins/easyui/jquery.easyui.min.js"></script> <script type="text/javascript" src="${pageContext.request.contextPath}/static/plugins/easyui/easyui-lang-zh_CN.js"></script> <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/base.js"></script> // index.jsp <%-- Created by IntelliJ IDEA. User: yangshixiong Date: 2020/2/8 Time: 上午12:19 To change this template use File | Settings | File Templates. --%> <%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>员工</title> <%--导入公共包以及employee的js文件--%> <%@include file="/static/common/common.jsp" %> <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/employee.js"></script> </head> <body> <%--工具栏--%> <div id="tb"> <a href="#" class="easyui-linkbutton" data-options="iconCls:‘icon-add‘,plain:true" id="add">添加</a> <a href="#" class="easyui-linkbutton" data-options="iconCls:‘icon-edit‘,plain:true" id="edit">编辑</a> <a href="#" class="easyui-linkbutton" data-options="iconCls:‘icon-remove‘,plain:true" id="delete">离职</a> <a href="#" class="easyui-linkbutton" data-options="iconCls:‘icon-reload‘,plain:true" id="reload">刷新</a> <input type="text" name="keyword" style="width: 200px; height: 30px;padding-left: 5px;"> <a class="easyui-linkbutton" iconCls="icon-search" id="searchbtn">查询</a> </div> <%--数据表格承接--%> <table id="dg"></table> <%--对话框--%> <div id="dialog"> <form id="employeeForm"> <%--添加一个隐藏域 编辑--%> <input type="hidden" name="id"> <table align="center" style="border-spacing: 0px 10px"> <tr> <td>用户名:</td> <td><input type="text" name="username" class="easyui-validatebox" data-options="required:true"></td> </tr> <tr id="password"> <td>密码:</td> <td><input type="text" name="password" class="easyui-validatebox"></td> </tr> <tr> <td>手机:</td> <td><input type="text" name="phone" class="easyui-validatebox" data-options="required:true"></td> </tr> <tr> <td>邮箱:</td> <td><input type="text" name="email" class="easyui-validatebox" data-options="required:true,validType:‘email‘"></td> </tr> <tr> <td>入职日期:</td> <td><input type="text" name="hiredate" class="easyui-datebox" data-options="required:true"></td> </tr> <tr> <td>部门:</td> <td><input id="department" name="department.id" placeholder="请选择部门" data-options="required:true"/></td> </tr> <tr> <td>是否管理员:</td> <td><input id="state" name="admin" placeholder="是否为管理员" data-options="required:true"/></td> </tr> </table> </form> </div> </body> </html>
index.js
$(function () { // 员工数据列表 $(‘#dg‘).datagrid({ // 数据请求路径 url: "/employee/list", // 加载列表 columns: [[{field: ‘username‘, title: ‘姓名‘, width: 100, align: ‘center‘}, {field: ‘hiredate‘, title: ‘入职时间‘, width: 100, align: ‘center‘}, {field: ‘phone‘, title: ‘电话‘, width: 100, align: ‘center‘}, {field: ‘email‘, title: ‘邮箱‘, width: 100, align: ‘center‘}, // formatter 接受三个参数 value该字段的值, row该行的内容, index 下标 { field: ‘department‘, title: ‘部门‘, width: 100, align: ‘center‘, formatter: function (value, row, index) { if (value) { return value.name; } } }, { field: ‘state‘, title: ‘状态‘, width: 100, align: ‘center‘, formatter: function (value, row, index) { if (value) { return "在职"; } else { return "<span style=‘color:red‘>离职</span>" } } }, { field: ‘admin‘, title: ‘管理员‘, width: 100, align: ‘center‘, formatter: function (value, row, index) { if (row.admin) { return "是"; }else { return "否"; } } }, ]], // 是否铺满屏幕 fit: true, // 数据列是否自适应 fitColumns: true, // 显示行号 rownumbers: true, // 是否显示翻页 pagination: true, // 只允许选中一条数据 singleSelect: true, // 工具栏 toolbar:"#tb", onClickRow:function (rowIndex,rowData) { /*判断当前行是否是离职状态*/ if(!rowData.state){ /*离职,把离职按钮禁用*/ $("#delete").linkbutton("disable"); }else { /*离职,把离职按钮启用*/ $("#delete").linkbutton("enable"); } } }); // 对话框 $(‘#dialog‘).dialog({ width:350, height:370, // 默认关闭状态 closed:true, // 设置按钮 buttons:[{ text:‘保存‘, handler:function () { // 判断当前是保存还是添加 let id = $("[name=‘id‘]").val(); let url; if(id){ url = ‘/employee/update‘ }else{ url = ‘/employee/add‘ } // 提交表单 $("#employeeForm").form("submit",{ url:url, success:function (data) { data = $.parseJSON(data); if(data.success){ $.messager.alert("提示", data.msg); $("#dialog").dialog("close"); $("#dg").datagrid("reload") }else{ $.messager.alert("警告", data.msg); } } }) } },{ text: ‘关闭‘, handler:function () { $(‘#dialog‘).dialog("close"); } }] }); // 监听添加按钮点击 $("#add").click(function () { // 设置dialog的标题 $("#dialog").dialog("setTitle", "添加员工"); $("#password").show(); // 清空对话框的数据 $("#employeeForm").form("clear"); // 添加密码验证 $("[name=‘password‘]").validatebox({required:true}); // 打开对话框 $("#dialog").dialog("open") }); // 监听编辑按钮点击 $("#edit").click(function () { // 获取当前选中的数据 let rowData = $("#dg").datagrid("getSelected"); if(!rowData){ $.messager.alert("提示", "请选择一条数据进行编辑!"); return } // 取消密码验证并将密码隐藏 $("[name=‘password‘]").validatebox({required: false}); $("#password").hide(); // 弹出对话框 $("#dialog").dialog("setTitle", "编辑员工"); $("#dialog").dialog("open"); // 设置部门回显 rowData["department.id"] = rowData["department"].id; // 回显管理员 rowData["admin"] = rowData["admin"] + ""; // 将数据回显 $("#employeeForm").form("load", rowData) }); /*部门选择 下拉列表*/ $("#department").combobox({ width:150, panelHeight:‘auto‘, editable:false, url:‘/department/list‘, textField:‘name‘, valueField:‘id‘, onLoadSuccess:function () { /*数据加载完毕之后回调*/ $("#department").each(function(i){ let span = $(this).siblings("span")[i]; let targetInput = $(span).find("input:first"); if(targetInput){ $(targetInput).attr("placeholder", $(this).attr("placeholder")); } }); } }); /*是否为管理员选择*/ $("#state").combobox({ width:150, panelHeight:‘auto‘, textField:‘label‘, valueField:‘value‘, editable:false, data:[{ label:‘是‘, value:‘true‘ },{ label:‘否‘, value:‘false‘ }], onLoadSuccess:function () { /*数据加载完毕之后回调*/ $("#state").each(function(i){ let span = $(this).siblings("span")[i]; let targetInput = $(span).find("input:first"); if(targetInput){ $(targetInput).attr("placeholder", $(this).attr("placeholder")); } }); } }); /*设置离职按钮点击*/ $("#delete").click(function () { /*首先获取当前选中行*/ let rowData = $("#dg").datagrid("getSelected"); if(!rowData){ $.messager.alert("提示","选择一行数据进行编辑"); return; } /*提醒用户,是否做离职操作*/ $.messager.confirm("确认","是否做离职操作",function (res) { if(res){ /*做离职操作*/ $.get("/employee/state?id="+rowData.id,function (data) { if (data.success){ $.messager.alert("温馨提示",data.msg); /*重新加载数据表格*/ $("#dg").datagrid("reload"); } else { $.messager.alert("温馨提示",data.msg); } }); } }); }) /*监听搜索按钮点击*/ $("#searchbtn").click(function () { /*获取搜索的内容*/ let keyword = $("[name=‘keyword‘]").val(); /*重新加载列表 把参数keyword传过去*/ $("#dg").datagrid("load",{keyword:keyword}); }); /*监听刷新点击*/ $("#reload").click(function () { /*清空搜索内容*/ let keyword = $("[name=‘keyword‘]").val(‘‘) /*重新加载数据*/ $("#dg").datagrid("load",{}); }); });
根据table的传值,我们封装一个接受参数的pojo类,get,set方法就不贴了
package com.yang.domain; /** * 这个就是我们接受参数的一个类 */ public class QueryVo { // 页码 private Integer page; // 每页条数 private Integer rows; // 关键词 private String keyword; }
以及一个响应pojo类
/** * 响应 */ public class AjaxRes { private boolean success; private String msg; public boolean isSuccess() { return success; } }
最终实现我们的增删改查的controller
package com.yang.web; import com.yang.domain.AjaxRes; import com.yang.domain.Employee; import com.yang.domain.PageListRes; import com.yang.domain.QueryVo; import com.yang.service.EmployeeService; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.ResponseBody; @Controller public class EmployeeController { /*注入业务层*/ @Autowired private EmployeeService employeeService; /*返回employee的jsp文件*/ @RequestMapping("/employee") public String employee(){ return "employee"; } /*返回员工列表*/ @RequestMapping("/employee/list") @ResponseBody // 返回json数据 public PageListRes employeeList(QueryVo queryVo){ return employeeService.getList(queryVo); } /*增加员工*/ @RequestMapping("/employee/add") @ResponseBody public AjaxRes employeeAdd(Employee employee){ return employeeService.insertEmployee(employee); } /*编辑员工*/ @RequestMapping("/employee/update") @ResponseBody public AjaxRes employeeUpdate(Employee employee){ return employeeService.updateEmployee(employee); } /*离职操作*/ @RequestMapping("/employee/state") @ResponseBody public AjaxRes employeeUpdate(Integer id){ return employeeService.changeState(id); } }
看一下service的实现类
package com.yang.service.impl; import com.github.pagehelper.Page; import com.github.pagehelper.PageHelper; import com.yang.domain.AjaxRes; import com.yang.domain.Employee; import com.yang.domain.PageListRes; import com.yang.domain.QueryVo; import com.yang.mapper.EmployeeMapper; import com.yang.service.EmployeeService; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Service; import org.springframework.transaction.annotation.Transactional; import java.util.List; @Service @Transactional // 开启事务,保证事务提交 public class EmployeeServiceImpl implements EmployeeService { /*注入员工查询数据库*/ @Autowired private EmployeeMapper employeeMapper; @Override public PageListRes getList(QueryVo queryVo) { // 使用分页器 Page<Object> page = PageHelper.startPage(queryVo.getPage(), queryVo.getRows()); // 调用mapper查询员工 List<Employee> employees = employeeMapper.selectAll(queryVo); // 封装返回结果 PageListRes pageListRes = new PageListRes(); pageListRes.setTotal(page.getTotal()); pageListRes.setRows(employees); return pageListRes; } /*增加员工*/ @Override public AjaxRes insertEmployee(Employee employee) { employee.setState(true); int result = employeeMapper.insert(employee); AjaxRes ajaxRes = new AjaxRes(); if(result == 1){ ajaxRes.setSuccess(true); ajaxRes.setMsg("插入成功!"); }else{ ajaxRes.setMsg("插入失败,请重试!"); ajaxRes.setSuccess(false); } return ajaxRes; } /*修改员工*/ @Override public AjaxRes updateEmployee(Employee employee) { int result = employeeMapper.updateByPrimaryKey(employee); AjaxRes ajaxRes = new AjaxRes(); if(result == 1){ ajaxRes.setSuccess(true); ajaxRes.setMsg("更新成功!"); }else{ ajaxRes.setMsg("更新失败,请重试!"); ajaxRes.setSuccess(false); } return ajaxRes; } /*修改员工离职状态*/ @Override public AjaxRes changeState(Integer id) { int result = employeeMapper.changeState(id); AjaxRes ajaxRes = new AjaxRes(); if(result == 1){ ajaxRes.setSuccess(true); ajaxRes.setMsg("离职操作成功!"); }else{ ajaxRes.setMsg("离职操作失败,请重试!"); ajaxRes.setSuccess(false); } return ajaxRes; } }
原文地址:https://www.cnblogs.com/yangshixiong/p/12285321.html
时间: 2024-10-13 01:43:15