六、员工信息分页+启用/禁用员工账号（前端经典大数/精度丢失问题）

员工信息分页

整体流程：

1、创建mybatisplus配置类

在config包下创建mybatisplusconfig

/**
 * 配置MybatisPlus分页插件
 */
@Configuration
//既然是配置类，要加配置类的注解
public class MybatisPlusConfig {
    @Bean
    public MybatisPlusInterceptor mybatisPlusInterceptor(){//创建MybatisPlus拦截器类
        MybatisPlusInterceptor mybatisPlusInterceptor = new MybatisPlusInterceptor();
        mybatisPlusInterceptor.addInnerInterceptor(new PaginationInnerInterceptor());
        return mybatisPlusInterceptor;
    }
}

2、在EmloyeeController类里面编写函数

    /**
     * 员工信息分页查询
     * @param page
     * @param pageSize
     * @param name
     * @return
     */
    @GetMapping("/page")
    public R page(int page, int pageSize, String name){
        log.info("page={},pagesize={},name={}",page,pageSize,name);
        //构造分页构造器
        Page pageinfo = new Page<>(page,pageSize);
        //构造条件构造器
        LambdaQueryWrapper queryWrapper = new LambdaQueryWrapper();
        //添加过滤条件
        //注意这里的StringUtils是apache.commons.lang包的。
        queryWrapper.like(StringUtils.isNotEmpty(name),Employee::getName,name);
        //添加排序条件
        queryWrapper.orderByDesc(Employee::getUpdateTime);
        //执行查询
        employeeService.page(pageinfo,queryWrapper);
        return R.success(pageinfo);
    }

启用/禁用员工账号

整体流程

 

 

1、在EmployeeController中编写函数

    /**
     * 根据id修改员工信息
     * @param employee
     * @return
     */
    @PutMapping
    public R update(HttpServletRequest request, @RequestBody Employee employee){
        log.info(employee.toString());

        Long empId =(Long)request.getSession().getAttribute("employee");
        employee.setUpdateTime(LocalDateTime.now());
        employee.setUpdateUser(empId);
        employeeService.updateById(employee);
        return R.success("员工信息修改成功");
    }

前端处理大数/精度丢失问题

测试时发现，没有报错，但是也没有禁用成功。观察控制台输出的sql语句。

发现更新数据行数为0.仔细观察后发现，update_user的id值与数据库中的id值最后几位并不相同。

而我们返回浏览器查看我们分页时给页面的响应，确实是数据库中正确的id。

那么说明问题只能出现在前端js处理数据后返回的有错误。事实证明，因为id被设置成了long型，且有19位数字。但是前端js处理long型数字只能精确到前16位，那么最终通过ajax请求提交给服务端时的id就可能出错。

解决方案

我们可以在服务端给页面响应json数据时进行处理，将long型数据统一转换为String类型。

2、将对象映射器文件放在common包下

可以直接下载该资源后放在common包下：https://download.csdn.net/download/zhiaidaidai/88285242

或者在common包下自建一个JacksonObjectMapper ,里面代码如下：

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类型映射位sting类型。
                .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);
    }
}

3、在WebMvcConfig里面重写消息转换器函数

    /**
     * 拓展/重写mvc框架的消息转换器
     * @param converters
     */
    @Override
    protected void extendMessageConverters(List> converters) {
        //创建消息转换器对象
        MappingJackson2HttpMessageConverter messageConverter = new MappingJackson2HttpMessageConverter();
        //设置对象转换器，底层使用Jackson将Java对象转为json
        messageConverter.setObjectMapper(new JacksonObjectMapper());
        //将上面的消息转换器对象追加到mvc框架的转换器集合中。注意第一个参数为索引，其实就相当于优先级。
        // 为了让mvc优先使用我们的自定义转换器，而不是mvc自带的转换器，将index设置为0
        converters.add(0,messageConverter);
    }

总结与测试：

测试员工信息分页与启用/禁用员工账号功能通过。项目的结构最终如图：

项目整体代码： https://download.csdn.net/download/zhiaidaidai/88285261