☁️快速开发(学生管理进阶完善篇)
🌟🥚介绍一下后端生成的核心代码

最先了解一下我们的列表查询
@ApiOperation("列表")
@GetMapping("/list")
public Q<List<Student>> list(@RequestParam Map<String, Object> params) {
return service.listPage(params, true);
}
看看业务类是怎么实现的📘
看到我们的业务类实现
主要是创建了一个MyQueryWrapper的类对象 调用了一个 ConstructQuery方法 这个方法就是帮我们构建查询条件
✨简单原理是: 通过请求拿到全部的请求参数 然后解析请求参数 与实体类字段去碰撞 如果碰撞上就进行条件查询🔍 原理后面会单独和大家解释
[外部请求] --> [解析模块] | v [请求参数列表] --> [字段匹配器] --> [匹配结果] | v [条件查询构造器] --> [执行查询] --> [返回结果]wrapper.ConstructQuery()
下面就是构建我们的响应
return wrapper.pageResponse(this, queryWrapper);
* 分页对象 底层实现 * * @param service * @return */ public Q<List<T>> pageResponse(IService<T> service, AbstractWrapper wrapper) { Page<T> page = new Page<>(pageNum, pageSize); Page<T> page1 = service.page(page, wrapper); return new Q<List<T>>().ok().q("page",new PageUtils(page1)); }

package com.object.module.stu.controller;
import java.util.Arrays;
import java.util.List;
import java.util.Map;
import com.object.utils.Q;
import javax.annotation.Resource;
import io.swagger.annotations.ApiOperation;
import io.swagger.annotations.Api;
import io.swagger.annotations.ApiParam;
import org.springframework.web.bind.annotation.*;
import java.net.URLEncoder;
import com.alibaba.excel.EasyExcel;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import com.object.module.stu.service.StudentService;
import com.object.module.stu.bean.Student;
/**
* 学生信息表
*
* @author Li~Qing
**/
@RestController
@RequestMapping("/stu/Student")
@Api(tags = "学生信息表接口")
public class StudentController{
@Resource
private StudentService service;
@ApiOperation("列表")
@GetMapping("/list")
public Q<List<Student>> list(@RequestParam Map<String, Object> params) {
return service.listPage(params, true);
}
@ApiOperation("详情")
@GetMapping("/info/{id}")
public Q<Student> info(@PathVariable("id") String id) {
Student bean = service.getById(id);
return new Q<Student >().ok(bean);
}
@ApiOperation("保存")
@PostMapping("/save")
public Q<Boolean> save(@RequestBody Student bean) {
return new Q<Boolean>().ok(service.save(bean));
}
@ApiOperation("修改根据id")
@PostMapping("/update")
public Q<Boolean> update(@RequestBody Student bean) {
return new Q<Boolean>().ok(service.updateById(bean));
}
@ApiOperation("批量操作")
@PostMapping("/batchWord")
public Q<Boolean> update(@RequestBody List<Student> beans) {
return new Q<Boolean>().ok(service.updateBatchById(beans));
}
@ApiOperation("删除根据id")
@PostMapping("/delete")
public Q<Boolean> delete(@RequestBody String[] ids) {
return new Q<Boolean>().ok(service.removeByIds(Arrays.asList(ids)));
}
@ApiOperation("导出")
@GetMapping("export")
public void importExcel(@ApiParam(value = "导出条件", required = true) @RequestParam(required = false) Map<String, Object> params, HttpServletResponse response) throws IOException {
Q<List<Student>> list = service.listPage(params, false);
// 设置响应头
response.setContentType("application/vnd.openxmlformats-officedocument.spreadsheetml.sheet; charset=UTF-8");
response.setCharacterEncoding("UTF-8");
String fileName = URLEncoder.encode("学生信息表.xlsx", "UTF-8");
response.setHeader("Content-Disposition", "attachment; filename=" + fileName);
EasyExcel.write(response.getOutputStream(), Student.class).sheet("学生信息表").doWrite(list.getT());
}
}
找到我们的实体类

在全部的日期上面添加新的注解@JsonFormat(pattern = "yyyy-MM-dd") 时间 加上注解!!!!@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
package com.object.module.stu.bean;
import com.fasterxml.jackson.annotation.JsonFormat;
import lombok.AllArgsConstructor;
import lombok.EqualsAndHashCode;
import lombok.NoArgsConstructor;
import com.alibaba.excel.annotation.ExcelIgnoreUnannotated;
import com.alibaba.excel.annotation.ExcelProperty;
import com.baomidou.mybatisplus.annotation.TableName;
import io.swagger.annotations.ApiModel;
import io.swagger.annotations.ApiModelProperty;
import com.alibaba.excel.annotation.ExcelProperty;
import com.baomidou.mybatisplus.annotation.IdType;
import java.time.LocalDate;
import com.baomidou.mybatisplus.annotation.TableId;
import java.time.LocalDateTime;
import java.io.Serializable;
import lombok.Data;
import com.baomidou.mybatisplus.annotation.TableName;
/**
* <p>
* 学生信息表
* </p>
*
* @since 2025-12-05
*/
@TableName("student")
@ApiModel(value = "Student对象", description = "学生信息表")
@ExcelIgnoreUnannotated
@Data
public class Student implements Serializable {
private static final long serialVersionUID = 1L;
@ApiModelProperty(value = "主键ID")
@ExcelProperty("主键ID")
@TableId(value = "id", type = IdType.AUTO)
private Long id;
@ApiModelProperty(value = "学号,业务唯一标识,如 S20250001")
@ExcelProperty("学号,业务唯一标识,如 S20250001")
private String studentId;
@ApiModelProperty(value = "学生姓名")
@ExcelProperty("学生姓名")
private String name;
@ApiModelProperty(value = "性别:M-男, F-女, O-其他")
@ExcelProperty("性别:M-男, F-女, O-其他")
private String gender;
@ApiModelProperty(value = "出生日期")
@ExcelProperty("出生日期")
@JsonFormat(pattern = "yyyy-MM-dd")
private LocalDate dateOfBirth;
@ApiModelProperty(value = "电子邮箱")
@ExcelProperty("电子邮箱")
private String email;
@ApiModelProperty(value = "手机号码")
@ExcelProperty("手机号码")
private String phone;
@ApiModelProperty(value = "家庭住址")
@ExcelProperty("家庭住址")
private String address;
@ApiModelProperty(value = "入学日期")
@ExcelProperty("入学日期")
@JsonFormat(pattern = "yyyy-MM-dd")
private LocalDate enrollmentDate;
@ApiModelProperty(value = "年级,如 高一、大三、Grade 10")
@ExcelProperty("年级,如 高一、大三、Grade 10")
private String grade;
@ApiModelProperty(value = "专业名称,如 计算机科学与技术")
@ExcelProperty("专业名称,如 计算机科学与技术")
private String major;
@ApiModelProperty(value = "学籍状态:0-在读, 1-毕业, 2-休学, 3-退学")
@ExcelProperty("学籍状态:0-在读, 1-毕业, 2-休学, 3-退学")
private Integer status;
@ApiModelProperty(value = "记录创建时间")
@ExcelProperty("记录创建时间")
@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
private LocalDateTime createdAt;
@ApiModelProperty(value = "记录最后更新时间")
@ExcelProperty("记录最后更新时间")
@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
private LocalDateTime updatedAt;
}
改动一下我们的controller代码

@ApiOperation("保存")
@PostMapping("/save")
public Q<Boolean> save(@RequestBody Student bean) {
bean.setCreatedAt(LocalDateTime.now());
bean.setUpdatedAt(LocalDateTime.now());
bean.setStudentId(UUID.randomUUID().toString().replaceAll("-",""));
return new Q<Boolean>().ok(service.save(bean));
}
@ApiOperation("修改根据id")
@PostMapping("/update")
public Q<Boolean> update(@RequestBody Student bean) {
bean.setUpdatedAt(LocalDateTime.now());
return new Q<Boolean>().ok(service.updateById(bean));
}
🌐 优化一下前端代码
组件文档
优化一下表单
优化性别和学籍状态
找到组件 选择器

修改代码

<a-form-item label="性别" name="gender">
<!-- <a-input v-model:value="currentFormData.gender" /> -->
<a-select v-model:value="currentFormData.gender">
<a-select-option value="M">男</a-select-option>
<a-select-option value="N">女</a-select-option>
</a-select>
</a-form-item>
<a-form-item label="学籍状态" name="status">
<!-- <a-input v-model:value="currentFormData.status" /> -->
<a-select v-model:value="currentFormData.gestatusnder">
<a-select-option value="0">毕业</a-select-option>
<a-select-option value="1">在读</a-select-option>
</a-select>
</a-form-item>
优化日期

<a-form-item label="出生日期" name="dateOfBirth">
<!-- <a-input v-model:value="currentFormData.dateOfBirth" /> -->
<a-date-picker v-model:value="currentFormData.dateOfBirth" valueFormat="YYYY-MM-DD" />
</a-form-item>
<a-form-item label="入学日期" name="enrollmentDate">
<a-input v-model:value="currentFormData.enrollmentDate" valueFormat="YYYY-MM-DD" />
</a-form-item>
修改过后的表单完整代码
<!-- 新增/编辑模态框 -->
<a-modal :title="isEditMode ? '编辑' : '新增'" :open="modalVisible" @ok="handleSubmit" @cancel="handleCancel">
<a-form ref="formRef" :model="currentFormData" :rules="formRules" layout="vertical">
<!-- <a-form-item label="学号" name="studentId">
<a-input v-model:value="currentFormData.studentId" />
</a-form-item> -->
<a-form-item label="学生姓名" name="name">
<a-input v-model:value="currentFormData.name" />
</a-form-item>
<a-form-item label="性别" name="gender">
<!-- <a-input v-model:value="currentFormData.gender" /> -->
<a-select v-model:value="currentFormData.gender">
<a-select-option value="M">男</a-select-option>
<a-select-option value="N">女</a-select-option>
</a-select>
</a-form-item>
<a-form-item label="出生日期" name="dateOfBirth">
<!-- <a-input v-model:value="currentFormData.dateOfBirth" /> -->
<a-date-picker v-model:value="currentFormData.dateOfBirth" />
</a-form-item>
<a-form-item label="电子邮箱" name="email">
<a-input v-model:value="currentFormData.email" />
</a-form-item>
<a-form-item label="手机号码" name="phone">
<a-input v-model:value="currentFormData.phone" />
</a-form-item>
<a-form-item label="家庭住址" name="address">
<a-input v-model:value="currentFormData.address" />
</a-form-item>
<a-form-item label="入学日期" name="enrollmentDate">
<!-- <a-input v-model:value="currentFormData.enrollmentDate" /> -->
<a-date-picker v-model:value="currentFormData.enrollmentDate" />
</a-form-item>
<a-form-item label="年级,如" name="grade">
<a-input v-model:value="currentFormData.grade" />
</a-form-item>
<a-form-item label="专业名称" name="major">
<a-input v-model:value="currentFormData.major" />
</a-form-item>
<a-form-item label="学籍状态" name="status">
<!-- <a-input v-model:value="currentFormData.status" /> -->
<a-select v-model:value="currentFormData.gestatusnder">
<a-select-option value="0">毕业</a-select-option>
<a-select-option value="1">在读</a-select-option>
</a-select>
</a-form-item>
<!-- <a-form-item label="记录创建时间" name="createdAt">
<a-input v-model:value="currentFormData.createdAt" />
</a-form-item>
<a-form-item label="记录最后更新时间" name="updatedAt">
<a-input v-model:value="currentFormData.updatedAt" />
</a-form-item> -->
</a-form>
</a-modal>
预览

优化一下表格显示 转换一下状态值

<!-- 转换状态 -->
<template v-if="column.dataIndex === 'status'">
{{ record.status == 0 ? '在读' : '毕业' }}
</template>
<!-- 转换性别 -->
<template v-if="column.dataIndex === 'gender'">
{{ record.gender == 'M' ? '男' : '女' }}
</template>
最后的预览效果

结尾🈚️
👌如果你跟到这里那么你家学会了如果使用这套框架进行页面的开发
通过上面的开发案例 你就可以进行自己xxx系统开发了 非常的简单是不是
有问题可以随时联系我vx:
