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<User>

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

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

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);
					}
				})
			})