Hola a todos, este proyecto de introducción se basa en un sistema de gestión de libros de segunda mano del campus desarrollado por SpringBoot . Algunas funciones las realizo yo mismo (como: estilo de interfaz, consulta precisa, consulta difusa, exportar a Excel). Este artículo se centra sobre puntos técnicos, informar de antemano los conocimientos previos necesarios para modificar el proyecto!
usar tecnología
El proyecto creado por Maven, la pila de tecnología se compone de SpringBoot+Mybatis+Thymeleaf, en el que el proyecto introduce algún software intermedio, como PageHelper (complemento de paginación), Lombok (configuración de capa de datos), easyexcel (exportación de datos de formulario execel)
-
¿Qué es Lombok?
Usando las anotaciones proporcionadas por Lombok, puede generar rápidamente captadores, establecedores, constructores, etc. de clase. Cuando las variables cambian, ya no necesita modificar estos métodos, y Lombok se encargará de ello.
Por ejemplo, la anotación @AllArgsConstructor del siguiente código es el método de construcción de parámetros completos de la clase generada, y la función de la anotación @Data es agregar métodos getter y setter a las variables miembro de la clase.
@Data
@NoArgsConstructor
@AllArgsConstructor
public class Book {
private int id;
private String name;
private String publisher;
private String code;
private String author;
private double price;
private int newDeg;
private int uId;
private String uname;
private int state;
private String sname;
private Date publishTime;
}
Funciones del sistema
1. Inicio de sesión de usuario (incluido el código de verificación)
2. Gestión de libros usados
3. Gestión de pedidos
4. Gestión de órdenes de cancelación
5. Gestión de la facultad
6. Gestión profesional
7. Gestión de la información del usuario
función breve
-
¿Cuál es la diferencia entre consulta precisa y consulta difusa?
Tome la función de consulta de pedido como ejemplo, la consulta precisa coincidirá con todos los caracteres ingresados por el usuario en la base de datos, lo que es equivalente a donde columna = ? en todas las condiciones de búsqueda. Sin embargo, las condiciones seleccionadas en la lista desplegable aún se consultan con coincidencias exactas
Encuentre el archivo OrderMapper.xml correspondiente a continuación
<!-- 订单精准查询-->
<select id="selectAccuracyOrder" resultType="order">
select o.id as id,o.id_buy as id_buy,u.nickname as nickname,u.tel as tel,u.address as address,
o.book_id as book_id,b.name as name,b.publisher as publisher,b.code as code,b.author as author,b.price as
price,b.newDeg as newDeg,b.uId as uId,
o.time as time,o.state as state,s.name as sname
from orders o inner join
user u on o.id_buy = u.id inner join
state s on o.state = s.id inner join
book b on o.book_id = b.id
<where>
<if test="oid!=null">
and o.id = #{oid}
</if>
<if test="username!=null">
and u.nickname = #{username}
</if>
<if test="status!=null">
and o.state = #{status}
</if>
</where>
</select>
<!-- 订单模糊查询-->
<select id="selectLikeOrder" resultType="order">
select o.id as id,o.id_buy as id_buy,u.nickname as nickname,u.tel as tel,u.address as address,
o.book_id as book_id,b.name as name,b.publisher as publisher,b.code as code,b.author as author,b.price as
price,b.newDeg as newDeg,b.uId as uId,
o.time as time,o.state as state,s.name as sname
from orders o inner join
user u on o.id_buy = u.id inner join
state s on o.state = s.id inner join
book b on o.book_id = b.id
<where>
<if test="oid!=null">
and o.id = #{oid}
</if>
<if test="username!=null">
and u.nickname like concat('%',#{username},'%')
</if>
<if test="status!=null">
and o.state = #{status}
</if>
</where>
</select>
-
¿Cómo exportar datos en forma de archivo de Excel?
EasyExcel es un proyecto simple de código abierto basado en Java que ahorra memoria para leer y escribir Excel , proporcionado por Alibaba, enlace de aprendizaje: sitio web oficial de EasyEcel
Paso 1: Importar coordenadas de easyexcel
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>easyexcel</artifactId>
<version>3.0.5</version>
</dependency>
Paso 2: establezca el nombre de columna y el estilo de la celda (tome como ejemplo la exportación de datos de usuario)
@Data
@ToString
@NoArgsConstructor
@AllArgsConstructor
@ContentStyle(horizontalAlignment = HorizontalAlignmentEnum.CENTER) //水平居中
public class UserExcelData {
@ExcelProperty("编号")
private Integer id;
@ExcelProperty("用户名")
private String username;
@ExcelProperty("姓名")
private String name;
@ExcelProperty("院系")
@ColumnWidth(20)
private String depart;
@ExcelProperty("专业")
@ColumnWidth(20)
private String major;
@ExcelProperty("年级")
@ColumnWidth(10)
private Integer grade;
}
Entre ellos, la anotación @ExcelProperty representa el nombre de la columna correspondiente al valor de la variable miembro exportada, y @ContentStyle es para establecer el estilo de la tabla
Paso 3: Definir el evento de exportación js y escribir la interfaz de back-end
Código central de front-end:
<!-- form搜索输入框 -->
<form th:action="@{/user/query}" method="post" id="queryform">
<div class="content_right_content">
<span>
<input name="btnType" id="btnType" value="1" th:value="${btnType}" hidden>
<input name="pageNum" id="pageNum" value="1" hidden>
用户名：<input type="text" placeholder="请输入用户名" name="username" th:value="${username}">
姓名：<input type="text" placeholder="请输入姓名" name="name" th:value="${name}">
学院：<select name="depart_id">
<option value="0">全部</option>
<option th:value="${depart.id}" th:each="depart:${departList}"
th:selected="${select_depid} == ${depart.id}"
th:text="${depart.name}"></option>
</select>
专业：<select name="major_id">
<option value="0">全部</option>
<option th:value="${major.id}" th:each="major:${majorList}"
th:selected="${select_majorid} == ${major.id}"
th:text="${major.name}"></option>
</select>
<button class="btn btn-success btn-sm" onclick="queryTypeSumbit(1)">精确查询</button>
<button class="btn btn-success btn-sm" onclick="queryTypeSumbit(2)">模糊查询</button>
</span>
</div>
</form>
<a class="btn btn-primary" style="color: white;position: absolute;left: 0" value="1" onclick="exportSumbit()">导出全部数据</a>
Front-end js maneja eventos
function exportSumbit() {
var myform = document.getElementById("queryform");
myform.setAttribute("action", "/user/export");
myform.submit();
}
Trabajo principal: Obtenga el formulario DOM, envíelo automáticamente al controlador de back-end (Controlador), el controlador consultará todos los datos de acuerdo con las condiciones de búsqueda después de recibir la solicitud y luego devolverá los datos al front-end en el forma de un archivo de excel
Controlador de fondo:
/*
导出Execel
*/
@RequestMapping("/user/export")
@ResponseBody
public String exportExcel(@RequestParam(value = "username", required = false) String username,
@RequestParam(value = "name", required = false) String name,
@RequestParam(value = "depart_id", required = false) Integer depart_id,
@RequestParam(value = "major_id", required = false) Integer major_id,
@RequestParam(value = "btnType", defaultValue = "1") Integer btnType,
@RequestParam(defaultValue = "1") Integer pageNum,
@RequestParam(defaultValue = "12") Integer pageSize,
HttpServletResponse response) throws IOException {
List<User> users = null;
if (btnType == 1) {
//精准查询
users = userService.accuracyQueryUser(StringUtils.isEmpty(username) ? null : username, StringUtils.isEmpty(name) ? null : name,
depart_id == null || depart_id == 0 ? null : depart_id, major_id == null || major_id == 0 ? null : major_id);
} else if (btnType == 2) {
//模糊查询(对用户名和姓名模糊查询）
users = userService.likeQueryUser(StringUtils.isEmpty(username) ? null : username, StringUtils.isEmpty(name) ? null : name,
depart_id == null || depart_id == 0 ? null : depart_id, major_id == null || major_id == 0 ? null : major_id);
}
System.out.println("users size : " + users.size());
List<UserExcelData> list = new ArrayList<>();
for (User user : users) {
list.add(new UserExcelData(user.getId(), user.getNickname(), user.getName(), user.getDepartName(), user.getMajorName(), user.getGrade()));
}
//设置响应头信息
response.setContentType("application/vnd.ms-excel");
response.setCharacterEncoding("utf-8");
String fileName = URLEncoder.encode("用户信息", "Utf-8");
response.setHeader("Content-Disposition", "attachment;filename*=UTF-8''" + fileName + ".xlsx");
//获得输出流
ServletOutputStream outputStream = response.getOutputStream();
//工作簿对象
ExcelWriterBuilder writerBuilder = EasyExcel.write(outputStream, UserExcelData.class);
//工作表对象
ExcelWriterSheetBuilder sheet = writerBuilder.sheet();
//导出Excel
sheet.doWrite(list);
outputStream.close();
return "";
}
Mostrar resultados:
Resumen: el uso de EasyExcel para exportar datos no depende de los controles del front-end, o es que el back-end cambia la información del encabezado de respuesta y retroalimenta los datos reales al front-end
Método de adquisición del código fuente
wx "Source Code Inn", responda a "campus" o "second-hand book" para obtener una explicación completa del artículo,
El código fuente se obtiene de la barra de menú "Código fuente" -> "Java"