要求在home组件中嵌入user子级组件,如何实现??
需求:
1.2路由语法 1.3实现父子组件跳转 1.3.1路由填充位router-view标签
1.3.2实现路由间父子关系映射此时为平级关系,如何实现父子关系??
使用children关键字
实现页面
1.2业务接口文档
业务接口文档
1.3编辑VO层package com.jt.vo;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import lombok.experimental.Accessors;
@Data
@Accessors(chain = true)
@NoArgsConstructor
@AllArgsConstructor
public class PageResult {
private String query;//查询数据
private Integer pageNum;//页数
private Integer pageSize;//条数
private Long total;//总数
private Object rows;//查询的结果
}
1.4编辑UserController
@GetMapping("/list")
public SysResult getUserListByPage(PageResult pageResult){
pageResult = userService.getUserListByPage(pageResult);
return SysResult.sucess(pageResult);
}
1.5编辑Service层
@Override
public PageResult getUserListByPage(PageResult pageResult) {
//1.总数
long total = userMapper.findTotal();
//2.分页结果
int size = pageResult.getPageSize(); //条数
int start = (pageResult.getPageNum()-1) * size; //起始位置
String query = pageResult.getQuery(); //查询条件
//查询分页数据
List userList =
userMapper.findUserListByPage(start,size,query);
//将返回值结果进行封装
return pageResult.setTotal(total).setRows(userList);
}
实现页面:
2.用户数据修改 2.1VUE.JS作用域插槽表格展现的数据不全,要获取所有数据需要使用作用域插槽
2.2添加修改事件 2.3用户状态修改接口
业务接口文档
2.4后端代码Controller
@PutMapping("status/{id}/{status}")
public SysResult updateStatusById(User user){
userService.updateStatusById(user);
return SysResult.sucess(null);
}
Service层
@Override
public void updateStatusById(User user) {
userMapper.updateStatusById(user);
}
映射文件
update user set status=#{status} where id=#{id}
3.用户新增操作 3.1业务接口
业务接口文档
3.2编辑Controller层
@PostMapping("/addUser")
public SysResult saveUser(@RequestBody User user){
userService.saveUser(user);
return SysResult.sucess(null);
}
3.3service层
@Override
public void saveUser(User user) {
String password=user.getUsername();
String md5=DigestUtils.md5DigestAsHex(password.getBytes());
//获取当前时间
Date date=new Date();
user.setPassword(md5).setStatus(true).setCreated(date).setUpdated(date);
userMapper.saveUser(user);
}
3.4Mapper
insert into user value(null,#{username},#{password},#{phone},#{email}, #{status},#{created},#{updated})
实现效果
如何获取当前时间??
//获取当前时间
Date date=new Date();
4.数据回显
代码实现
@GetMapping("/{id}")
public SysResult findUserById(@PathVariable Integer id){
User user=userService.findUserById(id);
return SysResult.sucess(user);
}
@Override
public User findUserById(Integer id) {
return userMapper.findUserById(id);
}
@Select("select * from user where id=#{id}")
User findUserById(Integer id);
5.修改用户信息
@PutMapping("updateUser")
public SysResult updateUserById( @RequestBody User user){
userService.updateUserById(user);
return SysResult.sucess(null);
}
6.删除用户数据
后端代码实现
@DeleteMapping("/{id}")
public SysResult deleteUserById(User user){
userService.deleteUserById(user);
return SysResult.sucess(null);
}
@Override
public void deleteUserById(User user) {
int id=user.getId();
userMapper.deleteUserById(id);
}
@Delete("delete from user where id=#{id}")
void deleteUserById(Integer id);



