前端页面分析

下面我们去分析员工账号的启用与禁用。

首先我们来看前端对这部分信息的展示，是根据这里给出的状态值展示的。

我们点进去这个方法

其实还是将具体的请求方法路径写到了一个js里面，这里发送了一个put请求。提交的参数就是id,和status,我们根据提交过来的参数在后来进行接收，并按照数据修改数据库中的字段值。

当我们处理好数据后，前端接收到返回的状态值1,然后会弹出提示说状态修改成功，然后下面会调用一个方法，一定是用于更新数据列表。

这个方法定义在这里，从这里我们可以看到，它这里还是会做一个分页查询。

下面我们分析员工信息的修改。
我们找到这个方法，点进去

可以看到，其实这个请求路径和我们的状态修改是一样的。

于是这样，我们可以写一个统一的方法，那么两者的请求路径和方法是一样的，于是我们可以遇见一个接收参数的形式。我们用实体类型employee来接收前端提交的参数，因为这些参数我们的实体类都有，这样我们就可以进行一个统一的接收。

不过还有一点就是数据信息的回显，也就是啊，我们修改员工信息的时候，表单的原来数据信息可以进行回显。

所以除了基本的淑女更新外，在修改这里我们需要做一个数据回显的后端逻辑功能。

这是整体的一个前端逻辑。下面我们开始对后面的功能逻辑进行一个编写。

后端状态修改与编辑功能开发。

我们前面分析了请求路径。所以这两个功能我们直接在后端统一开启就行了。这个是我们进行更新状态的操作。

 // 根据id修改员工信息
    @PutMapping
    public R_<String> update(@RequestBody  Employee employee)
    {
        employService.updateById(employee);
      

        return R_.success("员工信息修改成功");

    }
1
2
3
4
5
6
7
8
9
10

Mybatis-plus的updateById()方法来更新一条记录时：只会更新不为null的字段，为null的字段会不变。

但是这样会出现一个问题，前端js并不能正确处理id，因为我们的id根据生成策略它是19位的，但是在分页查询的时候后端给前端传给19位long类型的id只能被js处理到16为，这样的话，在我们这里前端获取id提交给后端的时候也就和本来的id对应不上了，于是我们必须想出一种解决办法。

那么我们可以在服务端给前端传送id的时候统一转换为String类型。我们需要一个消息转换器。这个是课程给出的转换器类

package com.jgdabc.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]
 */

/**
 * 将前端发送的数据过于长超过16位时，long的精度为16位，导致精度不准确，例如id为雪花算法的自动生成，
 * 导致前端发出的请求后端的接收的数据精度受到影响，
 * 转换为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)
                .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);
    }
}






1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66

编辑回显的话就是这么一个方法

 @GetMapping("/{id}")
    public R_<Employee> getById(@PathVariable long id)
    {
        Employee emp = employService.getById(id);
        if(emp!=null)
        {
            return R_.success(emp);
        }
       return R_.error("没有查询到对应数据");

    }
1
2
3
4
5
6
7
8
9
10
11