> 文档中心 > SpringBoot+MyBatis+MYSQL项目实战四(个人资料修改)

SpringBoot+MyBatis+MYSQL项目实战四(个人资料修改)


SpringBoot+MyBatis+MYSQL项目实战四(个人资料修改)

项目源码地址:电脑商城实战

一:用户资料-----持久层

1.1需要规划SQL语句
根据用户信息的SQL语句

UPDATE t_user SET phone=?, email=?, gender=?, modified_user=?, modified_time=? WHERE uid=?

2.在执行修改用户资料之前,当用户刚打开修改资料的页面时,就应把当前登录的用户信息显示到页面中。显示用户资料可以通过:

SELECT * FROM t_user WHERE uid=?

说明:

1.该查询功能已经实现,无需再次开发;

2.在执行修改用户资料之前,还应检查用户数据是否存在、是否标记为“已删除”,也可以通过以上查询来实现。

1.2 接口与抽象方法
在UserMapper接口中添加updateInfoByUid(User user)方法。

    /**     * 更新用户的数据信息     * @param user 用户的数据     * @return 返回值为受影响的行数     */    Integer updateInfoByUid(User user);

1.3抽象方法的映射
在UserMapper.xml文件中进行映射编写

    <update id="updateInfoByUid">--  if表示条件判断标签,test接收的是一个返回值为boolean类型的条件,如果test条件结果为true则执行if标签内部的语句 UPDATE t_user SET     <if test="phone!=null and phone != ''">phone = #{phone},</if>     <if test="email!=null and phone != ''">email = #{email},</if>     <if test="gender!=null and gender != ''">gender = #{gender},</if>     modified_user = #{modifiedUser},     modified_time = #{modifiedTime} WHERE uid = #{uid}    </update>

1.4单元测试

   @Test    public void updateInfoByUid(){// User testUser = userMapper.findByUid(10);// System.out.println(testUser); User user = new User(); user.setUid(10); user.setPhone("15166970830"); user.setEmail("2032764123@163.com"); user.setGender(1);// System.out.println(testUser.getUsername());// user.setModifiedUser(testUser.getUsername());// user.setModifiedTime(new Date()); userMapper.updateInfoByUid(user);    }

二: 用户-个人资料-业务层

2.1 规划异常

1.关于用户修改个人资料是由两个功能组成的。

  • 打开页面时显示当前登录的用户的信息;

  • 点击修改按钮时更新用户的信息。

2.关于打开页面时显示当前登录的用户的信息,可能会因为用户数据不存在、用户被标记为“已删除”而无法正确的显示页面,则抛出UserNotFoundException异常。

3.关于点击修改按钮时更新用户的信息,在执行修改资料之前仍需再次检查用户数据是否存在、用户是否被标记为“已删除”,则可能抛出UserNotFoundException异常。并且在执行修改资料过程中,还可能抛出UpdateException异常。
2.2接口和抽象方法
主要有两个功能的模块,对应的时两个抽象的方法的设计。

/**     * 根据用户的id查询用户的数据     * @param id     * @return     */    User getByUid(Integer id);    /**     * 更新用户的数据     * @param uid     * @param username     * @param user     */    void changeInfo(Integer uid,String username,User user);

2.3实现抽象方法

    @Override    public User getByUid(Integer id) { User result = userMapper.findByUid(id); if (result ==null || result.getIsDelete() == 1){     throw new UserNotFoundException("用户数据不存在"); } User user = new User(); user.setUsername(result.getUsername()); user.setPhone(result.getPhone()); user.setEmail(result.getEmail()); user.setGender(result.getGender()); return user;    }    /**     * user对象中的数据phone\email\gender,手动的将uid、username封装到user对象中     * @param uid     * @param username     * @param user     */    @Override    public void changeInfo(Integer uid, String username, User user) { User result = userMapper.findByUid(uid); if (result ==null || result.getIsDelete() == 1){     throw new UserNotFoundException("用户数据不存在"); } user.setUid(uid); user.setUsername(username); user.setModifiedUser(username); user.setModifiedTime(new Date()); Integer rows = userMapper.updateInfoByUid(user); if(rows != 1){     throw new UpdateException("跟新数据时产生位置的异常"); }    }

进行单元测试、

 @Test    public void getByUid(){ System.out.println(UserService.getByUid(10));    }    @Test    public void changeInfo(){ User user = new User(); user.setPhone("15166970780"); user.setEmail("2035@163.com"); user.setGender(0); UserService.changeInfo(10,"wangchong",user);    }

三:用户-个人资料-控制层

3.1 设计请求

1.设计用户提交显示当前登录的用户信息的请求,并设计响应的方式。

请求路径:/users/get_by_uid请求参数:HttpSession session请求类型:GET响应结果:JsonResult

2.设计用户提交执行修改用户信息的请求,并设计响应的方式。

请求路径:/users/change_info请求参数:User user, HttpSession session请求类型:POST响应结果:JsonResult

3.2处理请求

   @RequestMapping(value = "/get_by_uid",method = RequestMethod.POST)    public JsonResult<User> getByUid(HttpSession session){ User data = iUserService.getByUid(getuidFromSession(session)); return new JsonResult<>(OK,data);    }    @RequestMapping("/change_info")    public JsonResult<Void> changeInfo(User user,HttpSession session){ // user对象有四部分的数据:username,Phone,Email,gender Integer uid =getuidFromSession(session); String username = getUsernameFromSession(session); iUserService.changeInfo(uid,username,user); return new JsonResult<>(OK);    }

四:用户-个人资料-前端页面

4.1 设计思路

1.在打开userdata.html页面自动发送ajax请求,查询到的数据填充到这个页面。
在这里插入图片描述

2.检测到用户点击修改页面时发送ajax请求
具体实现如下:

/** * 一旦检测到当前页面被加载就会触发ready方法 * $(document).ready(function){ *     // 编写业务代码 * } */$(document).ready(function () {$.ajax({url: "/users/get_by_uid",type: "POST",data : $("#form-change-info").serialize(),dataType: "JSON",success: function (json) {if(json.state == 200){$("#username").val(json.data.username)// 将查询的数据重新设置到空间中$("#phone").val(json.data.phone);$("#email").val(json.data.email);let radio = json.data.gender == 0 ?$("#gender-female") : $("#gender-male");//prop()表示给某个元素添加属性及属性值radio.prop("checked","checked");}else{alert("数据不存在")}},error: function (xhr) {alert("查询用户信息产生未知的异常"+xhr.message);}})})

51银饰网