CGB2105-Day13
1. 用户管理实现
1.1 用户管理后台搭建
1.1.1 表设计
1.1.2 User的POJO设计
1.1.3 页面调用JS流程
- 生命周期函数
- getUserList()函数定义
1.1.4 用户查询的业务接口文档
- 请求路径: /user/list
- 请求类型: GET
- 请求参数: 后台使用PageResult对象接收
- 请求案例: http://localhost:8091/user/list?query=查询关键字&pageNum=1&pageSize=10
参数名称 | 参数说明 | 备注信息 |
---|---|---|
query | 用户查询的数据 | 可以为null |
pageNum | 分页查询的页数 | 必须赋值不能为null |
pageSize | 分页查询的条数 | 必须赋值不能为null |
- 响应参数: SysResult对象 需要携带分页对象 PageResult
参数名称 | 参数说明 | 备注信息 |
---|---|---|
status | 状态信息 | 200表示服务器请求成功 201表示服务器异常 |
msg | 服务器返回的提示信息 | 可以为null |
data | 服务器返回的业务数据 | 返回值PageResult对象 |
- PageResult 对象介绍
参数名称 | 参数类型 | 参数说明 | 备注信息 |
---|---|---|---|
query | String | 用户查询的数据 | 可以为null |
pageNum | Integer | 查询页数 | 不能为null |
pageSize | Integer | 查询条数 | 不能为null |
total | Long | 查询总记录数 | 不能为null |
rows | Object | 分页查询的结果 | 不能为null |
- 返回值效果
{"status":200,
"msg":"服务器调用成功!",
"data":
{"query":"",
"pageNum":1,
"pageSize":2,
"total":4,
"rows":[
{"created":"2021-02-18T11:17:23.000+00:00",
"updated":"2021-03-26T06:47:20.000+00:00",
"id":1,
"username":"admin",
"password":"a66abb5684c45962d887564f08346e8d",
"phone":"13111112222",
"email":"1235678@qq.com",
"status":true,
"role":null
},
{"created":"2021-02-18T11:17:23.000+00:00",
"updated":"2021-03-13T08:50:30.000+00:00",
"id":2,
"username":"admin123",
"password":"a66abb5684c45962d887564f08346e8d",
"phone":"13111112223",
"email":"1235678@qq.com",
"status":false,
"role":null
}
]
}
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
1.1.5 封装PageResult
说明: 该对象主要的作用,封装分页后的结果 其中的数据需要在业务层 赋值.最后由SysResult对象 携带返回给用户.
@Data
@Accessors(chain = true)
public class PageResult {
private String query; //用户查询的数据
private Integer pageNum; //页数
private Integer pageSize;//每页的条数
private Long total; //总记录数
private Object rows; //分页后的结果
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
1.1.6 编辑UserController
/** * 业务: 实现用户列表的分页查询 * 类型: GET * URL: /user/list * 参数: PageResult对象进行接收 传递了3个参数 * 返回值: SysResult对象(PageResult对象) 返回5个 */ @GetMapping("/list") public SysResult getUserList(PageResult pageResult){//3个
<span class="token comment">//通过业务处理 获取总数/分页后的结果</span> pageResult <span class="token operator">=</span> userService<span class="token punctuation">.</span><span class="token function">getUserList</span><span class="token punctuation">(</span>pageResult<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">return</span> <span class="token class-name">SysResult</span><span class="token punctuation">.</span><span class="token function">success</span><span class="token punctuation">(</span>pageResult<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">//5个</span> <span class="token punctuation">}</span>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
1.1.7 编辑UserServicImpl
/** * 需求: 进行分页查询 总数 分页后的结果 * 知识铺垫: 每页20条 * Sql: select * from user limit 起始位置,每页条数 * 第一页: * select * from user limit 0,20 下标[0-19] * 第二页: * select * from user limit 20,20 下标[20-39] * 第三页: * select * from user limit 40,20 下标[40-59] * 第N页: * select * from user limit (n-1)*rows,rows * @param pageResult * @return * 方法实现: * 1.手写Sql * 2.利用MP方式实现 */ @Override public PageResult getUserList(PageResult pageResult) { //根据参数动态的执行分页查询!!!! int start = (pageResult.getPageNum()-1) * pageResult.getPageSize(); int size = pageResult.getPageSize(); List<User> userList = userMapper.findUserListByPage(start,size); //获取全部记录的总数 利用java 自动拆装箱的规范 long total = userMapper.selectCount(null);
<span class="token keyword">return</span> pageResult<span class="token punctuation">.</span><span class="token function">setTotal</span><span class="token punctuation">(</span>total<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">setRows</span><span class="token punctuation">(</span>userList<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
1.1.8 编辑UserMapper
/**
* @author 刘昱江
* 时间 2021/2/2
*/
public interface UserMapper extends BaseMapper<User> {
/**
* 如果Sql语句比较简单,可以通过直接注解开发.
* @Select("Sql!!!!!")
* @Insert("sql")
* @Update("sql")
* @Delete("sql")
* @param start
* @param size
* @return
*/
@Select("select * from user limit #{start},#{size}")
List<User> findUserListByPage(Integer start, Integer size);
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
1.2 MP方式实现分页查询(API调用!!!)
1.2.1 编辑UserServiceImpl
/** * 以MP的方式分页查询 * 需求: * 1.分页查询 List<user> * 2.获取记录总数 封装pageResult对象 * * @param pageResult * @return */ @Override public PageResult getUserList(PageResult pageResult) { //第一部分 实现数据的封装!!! int pageNum = pageResult.getPageNum(); //获取页面 int pageSize = pageResult.getPageSize();//获取条件 //参数1: page分页对象 Page<User> page = new Page(pageNum,pageSize); //参数2: 分页的查询条件 username模糊查询 //问题: 如果用户没有传递query like关键字 拼接参数 //动态拼接: 传参拼接like condition:true 拼接like条件 // false 不拼接 like关键字 QueryWrapper<User> queryWrapper = new QueryWrapper<>(); //判断用户是否传参 如果传参 返回true 反之 返回false boolean flag = StringUtils.hasLength(pageResult.getQuery()); queryWrapper.like(flag,"username",pageResult.getQuery());
<span class="token comment">//规则: page2个参数 根据分页查询返回 total/分页后的记录 4个参数</span> page <span class="token operator">=</span> userMapper<span class="token punctuation">.</span><span class="token function">selectPage</span><span class="token punctuation">(</span>page<span class="token punctuation">,</span>queryWrapper<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">//根据分页对象,获取想要的结果</span> <span class="token class-name">List</span><span class="token generics"><span class="token punctuation"><</span><span class="token class-name">User</span><span class="token punctuation">></span></span> userList <span class="token operator">=</span> page<span class="token punctuation">.</span><span class="token function">getRecords</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">long</span> total <span class="token operator">=</span> page<span class="token punctuation">.</span><span class="token function">getTotal</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> pageResult<span class="token punctuation">.</span><span class="token function">setTotal</span><span class="token punctuation">(</span>total<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">setRows</span><span class="token punctuation">(</span>userList<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">return</span> pageResult<span class="token punctuation">;</span> <span class="token punctuation">}</span>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
1.2.2 编辑配置类
包路径: com.jt.config
说明: MP如果需要进行分页的查询 ,则必须添加配置类.否则分页不能正常执行.
关于配置类的说明:
SpringBoot整合第三方框架时,提供了配置类的机制, 通过这种机制,第三方框架可以实现定制化的对象的创建.
//1.表示这个类 是一个配置类 目的: 封装对象-交给Spring容器管理 @Configuration public class MybatisPlusConfig {
<span class="token comment">// @Bean 将方法的返回值对象,交给Spring容器管理</span> <span class="token comment">//MP分页机制 Mysql分页语句/Oracle分页语句 为了实现功能复用 需要手动配置</span> <span class="token comment">//根据数据库类型不同 之后动态的生成Sql MP才能调用分页对象</span> <span class="token annotation punctuation">@Bean</span> <span class="token keyword">public</span> <span class="token class-name">MybatisPlusInterceptor</span> <span class="token function">mybatisPlusInterceptor</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{<!-- --></span> <span class="token comment">//定义分页拦截器对象</span> <span class="token class-name">MybatisPlusInterceptor</span> interceptor <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">MybatisPlusInterceptor</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> interceptor<span class="token punctuation">.</span><span class="token function">addInnerInterceptor</span><span class="token punctuation">(</span><span class="token keyword">new</span> <span class="token class-name">PaginationInnerInterceptor</span><span class="token punctuation">(</span><span class="token class-name">DbType</span><span class="token punctuation">.</span>MARIADB<span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">return</span> interceptor<span class="token punctuation">;</span> <span class="token punctuation">}</span>
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
1.2.3 分页后的结果
1.3 用户状态修改
1.3.1 业务接口文档
说明: 用户通过开关 控制 状态 true/false 在数据库中 存储true 用1, 存储false 用0
1.3.2 页面JS分析(了解)
说明: 如果修改状态信息,则必须获取当前行的数据. id/status
作用域插槽: 一般在表格循环遍历时,如果需要获取当前行数据,则采用作用域插槽的方式.
作用域插槽用法:
发起Ajax请求:
async updateStatus(user){
//实现用户状态修改 注意使用模版字符串 ES6中提出的新用法 ${key}
//const {data: result} = await this.$http.put('/user/status/'+user.id+'/'+user.status)
const {data: result} = await this.$http.put(`/user/status/${user.id}/${user.status}`)
if(result.status !== 200) return this.$message.error("用户状态修改失败!")
this.$message.success("用户状态修改成功!")
},
- 1
- 2
- 3
- 4
- 5
- 6
- 7
请求路径:
1.3.3 编辑UserController
1.3.4 编辑UserService
1.4 用户新增
1.4.1 用户JS分析(了解)
1.4.2 业务接口文档说明
1.4.3 编辑UserController
1.4.4 编辑UserService
作业
- 整理后端业务逻辑 有条件的删除代码 重新做一遍
- 完成用户的修改和删除操作/ 详情参考 开发文档或者2104班代码
- 查漏补缺