SpringBoot案例-修改员工-查询回显

根据页面原型,明确需求

页面原型

SpringBoot案例-修改员工-查询回显_第1张图片

需求

在员工信息栏的右侧存在一个编辑按钮,点击该按钮可以对员工信息进行修改,但是修改之前,会出现上述页面,将员工原有的信息进行展示回显。

阅读接口文档

接口文档的链接如下:

https://hkm-web.oss-cn-beijing.aliyuncs.com/%E6%8E%A5%E5%8F%A3%E6%96%87%E6%A1%A3

思路分析

实现的编辑窗口回显员工已有信息的操作也比较简单,主要是通过id对员工信息进行查询,具体的要求可以参照接口文档中的具体内容。

接口功能实现

控制层(Controller类)

具体关键代码如下:

    @GetMapping("/emps/{id}")
    /**
     * 根据id查询员工信息
     *
     * @param id
     * @return
     */
    public Result SelectByID(@PathVariable Integer id) {
        Emp emp = empService.SelectByID(id);
        System.out.println(emp);
        return Result.success(emp);
    }

业务层(Service类)

具体关键代码如下

业务类

Emp SelectByID(Integer id);

业务实现类

    // todo 根据id查询员工信息
    @Override
    public Emp SelectByID(Integer id) {
        Emp emp = empMapper.SelectByID(id);
        return emp;
    }

持久层(Mapper类)

具体代码如下

    Emp SelectByID(Integer id);

 Mapper接口类的映射文件

具体关键代码

   
    

接口测试

使用postman进行接口调试,具体的请求路径及参数如下:

运行结果如下:

SpringBoot案例-修改员工-查询回显_第2张图片

SpringBoot案例-修改员工-查询回显_第3张图片

前后端联调

运行教程提供的nginx项目,访问前端页面,nginx项目具体文件链接如下:

https://hkm-web.oss-cn-beijing.aliyuncs.com/Nginx

 具体运行结果如下:

SpringBoot案例-修改员工-查询回显_第4张图片

运行成功 

 

你可能感兴趣的:(Java,Web学习跟踪笔记,spring,boot,后端,java)