瑞吉外卖项目流程-实现员工相关功能

发布于：2023-01-26 ⋅ 阅读:(1297) ⋅ 点赞:(1)

目录

一、新增员工

1、需求分析

2、数据模型

3、代码执行流程

4、代码开发

5、编写全局异常处理器

二、员工信息分页查询

1、需求分析

2、程序流程分析 

3、代码实现及分析

三、启用/禁用员工账号

1、需求分析

2、代码实现分析

1）如何实现只有admin才能看到启用/禁用按钮

2）代码执行过程

3）在EmployeeController.java中编写对应的业务代码

3、问题处理 

四、编辑员工信息

1、需求分析

2、程序执行流程

一、新增员工

1、需求分析

2、数据模型

3、代码执行流程

         在src/main/resources/backend/page/member/list.html中我们设置添加员工功能的按钮：

        然后定义添加方法： 

        可以发现，当传入参数是'add'时，我们会调用window.parent.menuHandle()方法，这个方法是我们之前在index.html中定义过的，用于页面跳转的，我在之前分析页面跳转功能的文章中分析过。当跳转到backend/page/member/add.html中后，我们在页面输入完信息并点击保存按钮时，会执行submitForm方法。

 submitForm方法定义如下：

其中的addEmployee方法我们将其封装到js文件backend/api/member.js中 

可见url和method设置的与本节最开始图中浏览器请求路径以及请求方式正好对应。 

4、代码开发

        在EmployeeController.java中添加新增员工功能的代码。

    /**
     * 新增员工
     * @param employee
     * @return
     */
    @PostMapping
    public R<String> save(HttpServletRequest request,@RequestBody Employee employee){
        log.info("新增员工，员工信息:{}",employee.toString());

        //设置初始密码为123456，并用md5进行加密处理
        employee.setPassword(DigestUtils.md5DigestAsHex("123456".getBytes()));

        //设置创建时间为当前时间
        employee.setCreateTime(LocalDateTime.now());
        //设置更新时间为当前时间
        employee.setUpdateTime(LocalDateTime.now());

        //设置创建人,即当前登陆人的id
        Long empId=(Long) request.getSession().getAttribute("employee");
        employee.setCreateUser(empId);
        //设置更新人,即更新时登陆人的id
        employee.setUpdateUser(empId);

        employeeService.save(employee);

        return R.success("新增员工成功");
    }
}

5、编写全局异常处理器

         前面代码没有对可能出现的异常进行处理，我们通过编写全局异常处理器来进行处理，创建一个处理器文件：com/itheima/reggie/common/GlobalExceptionHandler.java

下面以处理对具有唯一值要求的属性输入了重复的值的异常为例：

package com.itheima.reggie.common;

import lombok.extern.slf4j.Slf4j;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.ControllerAdvice;
import org.springframework.web.bind.annotation.ExceptionHandler;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.bind.annotation.RestController;

import java.sql.SQLIntegrityConstraintViolationException;

/**
 * 全局异常处理
 */
@ControllerAdvice(annotations = {RestController.class, Controller.class})
@ResponseBody
@Slf4j
public class GlobalExceptionHandler {

    @ExceptionHandler(SQLIntegrityConstraintViolationException.class)
    public R<String> exceptionHandler(SQLIntegrityConstraintViolationException ex){
        log.error(ex.getMessage());
        if(ex.getMessage().contains("Duplicate entry")){
            String[] split=ex.getMessage().split(" ");
            String msg=split[2]+"已存在";
            return R.error(msg);
        }
        return R.error("未知错误");
    }
}

其中@ControllerAdvice就是@Controller 的增强版。@ControllerAdvice主要用来处理全局数据，一般搭配@ExceptionHandler、@ModelAttribute以及@InitBinder使用。参数annotations:指定一个或多个注解,被这些注解所标记的Controller会被该@ControllerAdvice管理。

        Spring的@ExceptionHandler可以用来统一处理方法抛出的异常，@ExceptionHandler注解中可以添加参数，参数是某个异常类的class，代表这个方法专门处理该类异常。SQLIntegrityConstraintViolationException代表的异常原因：违反了数据库的唯一约束条件，插入数据时。具有唯一约束条件的字段值重复。代码中将错误信息以空格分隔之后取 split[2] 是因为错误信息会将出问题的约束字段名放在Duplicate entry的后面。

二、员工信息分页查询

1、需求分析

2、程序流程分析 

3、代码实现及分析

        员工管理的页面为src/main/resources/backend/page/member/list.html。整个页面也是通过相应的ElementUI进行页面效果展示，通过Vue实现数据的双线绑定。下面的created()为Vue内置的生命周期函数，当Vue对象创建完对象之后该函数会自动调用，因此当我们希望某些方法在Vue对象创建完就执行，我们可以将内容写在created()中。

上面的init()就是我们自定义的。

 其中的getMemberList()我们封装到了js文件backend/api/member.js中

传给getMemberList的参数params时JSON形式的，但是通过网页的信息我们可以发现，GET请求并不是JSON形式的。

这是因为我们针对GET方式请求，在通过GET方式发送axios请求的时候统一进行处理，将参数重新进行组装，我们将处理代码写在backend/js/request.js中。

在backend/page/member/list.html中的page-sizes是页面中每页显示多少条内容的选项

 在Vue中的pageSize选项则是刚进系统时当页展示几条。

在EmployeeController.java中编写分页功能代码：

 /**
     * 分页功能，基于mybatis-plus
     * @param page
     * @param pageSize
     * @param name
     * @return
     */
    @GetMapping("/page")
    public R<Page> page(int page,int pageSize,String name){
        log.info("page={}, pagesize={} ,name={}",page,pageSize,name);

        //构造分页构造器
        Page pageInfo=new Page(page,pageSize);

        //构造条件构造器
        LambdaQueryWrapper<Employee> queryWrapper=new LambdaQueryWrapper();
        //添加过滤条件
        queryWrapper.like(StringUtils.isNotEmpty(name),Employee::getName,name);
        //添加排序条件
        queryWrapper.orderByDesc(Employee::getUpdateTime);

        //执行查询
        employeeService.page(pageInfo,queryWrapper);
        return R.success(pageInfo);
    }

三、启用/禁用员工账号

1、需求分析

 并且，普通员工登陆后不显示启用/禁用按钮。

2、代码实现分析

1）如何实现只有admin才能看到启用/禁用按钮

        先分析页面是如何实现只有admin才能看到启用/禁用按钮。在backend/page/member/list.html中

2）代码执行过程

在backend/page/member/list.html中

 

点击启用/禁用按钮会执行statusHandle方法

其中enableOrDisableEmployee方法封装在js文件member.js中。

总结来说：

3）在EmployeeController.java中编写对应的业务代码

禁用启用员工账号是对员工的status属性进行修改，因此本质上是一个更新操作，我们写一个通用update方法以用于其他修改行为：

/**
     * 根据id修改员工信息
     */
    @PutMapping
    public R<String> update(HttpServletRequest request,@RequestBody Employee employee){
        log.info(employee.toString());
        Long empId=(Long)request.getSession().getAttribute("employee");
        employee.setUpdateUser(empId);
        employee.setUpdateTime(LocalDateTime.now());
        employeeService.updateById(employee);
        return R.success("员工信息修改成功");
    }

3、问题处理 

        问题：在代码编写完成之后会发现无法修改员工的状态并且系统不报错，这是因为js最多处理16位数字，而我们的员工id在加密后有18位长度，因此无法定位是哪一个员工要改状态。

        解决方法：在服务端给页面响应json数据时进行处理，将long型数据统一转为String字符串，效果如下：

放到com/itheima/reggie/common/JacksonObjectMapper.java

package com.itheima.reggie.common;

import com.fasterxml.jackson.databind.DeserializationFeature;
import com.fasterxml.jackson.databind.ObjectMapper;
import com.fasterxml.jackson.databind.module.SimpleModule;
import com.fasterxml.jackson.databind.ser.std.ToStringSerializer;
import com.fasterxml.jackson.datatype.jsr310.deser.LocalDateDeserializer;
import com.fasterxml.jackson.datatype.jsr310.deser.LocalDateTimeDeserializer;
import com.fasterxml.jackson.datatype.jsr310.deser.LocalTimeDeserializer;
import com.fasterxml.jackson.datatype.jsr310.ser.LocalDateSerializer;
import com.fasterxml.jackson.datatype.jsr310.ser.LocalDateTimeSerializer;
import com.fasterxml.jackson.datatype.jsr310.ser.LocalTimeSerializer;
import java.math.BigInteger;
import java.time.LocalDate;
import java.time.LocalDateTime;
import java.time.LocalTime;
import java.time.format.DateTimeFormatter;
import static com.fasterxml.jackson.databind.DeserializationFeature.FAIL_ON_UNKNOWN_PROPERTIES;

/**
 * 对象映射器:基于jackson将Java对象转为json，或者将json转为Java对象
 * 将JSON解析为Java对象的过程称为 [从JSON反序列化Java对象]
 * 从Java对象生成JSON的过程称为 [序列化Java对象到JSON]
 */
public class JacksonObjectMapper extends ObjectMapper {

    public static final String DEFAULT_DATE_FORMAT = "yyyy-MM-dd";
    public static final String DEFAULT_DATE_TIME_FORMAT = "yyyy-MM-dd HH:mm:ss";
    public static final String DEFAULT_TIME_FORMAT = "HH:mm:ss";

    public JacksonObjectMapper() {
        super();
        //收到未知属性时不报异常
        this.configure(FAIL_ON_UNKNOWN_PROPERTIES, false);

        //反序列化时，属性不存在的兼容处理
        this.getDeserializationConfig().withoutFeatures(DeserializationFeature.FAIL_ON_UNKNOWN_PROPERTIES);


        SimpleModule simpleModule = new SimpleModule()
                .addDeserializer(LocalDateTime.class, new LocalDateTimeDeserializer(DateTimeFormatter.ofPattern(DEFAULT_DATE_TIME_FORMAT)))
                .addDeserializer(LocalDate.class, new LocalDateDeserializer(DateTimeFormatter.ofPattern(DEFAULT_DATE_FORMAT)))
                .addDeserializer(LocalTime.class, new LocalTimeDeserializer(DateTimeFormatter.ofPattern(DEFAULT_TIME_FORMAT)))

                .addSerializer(BigInteger.class, ToStringSerializer.instance)
                //Long转成字符串，以解决js处理Long只能处理前16位的问题
                .addSerializer(Long.class, ToStringSerializer.instance)
                .addSerializer(LocalDateTime.class, new LocalDateTimeSerializer(DateTimeFormatter.ofPattern(DEFAULT_DATE_TIME_FORMAT)))
                .addSerializer(LocalDate.class, new LocalDateSerializer(DateTimeFormatter.ofPattern(DEFAULT_DATE_FORMAT)))
                .addSerializer(LocalTime.class, new LocalTimeSerializer(DateTimeFormatter.ofPattern(DEFAULT_TIME_FORMAT)));

        //注册功能模块 例如，可以添加自定义序列化器和反序列化器
        this.registerModule(simpleModule);
    }
}

 

 我们在WebMvcConfig.java中重写WebMvcConfigurationSupport类的extendMessageConverters方法。

    //扩展mvc框架的消息转换器
    @Override
    protected void extendMessageConverters(List<HttpMessageConverter<?>> converters) {
        //创建消息转换器对象
        MappingJackson2HttpMessageConverter messageConverter=new MappingJackson2HttpMessageConverter();
        //设置对象转换器，底层使用Jackson将Java对象转为json
        messageConverter.setObjectMapper(new JacksonObjectMapper());
        //将上面的消息转换器对象追加到mvc框架的转换器集合中并放到最前面
        converters.add(0,messageConverter);
    }

四、编辑员工信息

1、需求分析

2、程序执行流程

在add.html文件中的生命周期函数中的requestUrlParam()方法是我们自己封装在backend/js/index.js中的方法。

然后可以看出，id有值的话，actionType就被设置为修改操作(edit)，否则是新增操作(add)。如果是新增操作，执行init()方法

 queryEmployeeById()方法就是用来发送ajax请求，尝试通过id查询员工信息。

然后我们要在EmployeeController.java中定义一个方法来处理请求

    @GetMapping("/{id}")
    public R<Employee> getById(@PathVariable Long id){
        log.info("根据id查询员工信息");
        Employee employee=employeeService.getById(id);
        if (employee!=null){
            return R.success(employee);
        }
        return R.error("没有对应工作人员");
    }

 在得到对应员工信息后我们将员工信息赋给ruleForm，它自己就会在页面中进行回显。

提交修改保存的业务代码复用了在编写启用/禁用员工账号功能时写的通用update方法。

本文含有隐藏内容，请 开通VIP 后查看

网站公告

今日签到

点亮在社区的每一天
去签到

热门文章

最新发布