java高级数据驱动的原神祈愿记录管理系统

目录

1.运行环境

2.功能概述

3.技术类型

4.实现过程以及代码

1.创建项目

2. 选择依赖

3.项目结构

4.配置数据库

5. Model层

6.Repository层

7.Service层

1.创建一个名为EmployeeService的设备服务接口,并定义设备管理的基本操作,并在接口中添加自定义的查询方法

2.创建一个名为EmployeeServiceImpl的设备服务实现类,实现EmployeeService接口中的方法,并注入EmployeeRepository实例

8.Controller层

9.视图层

5.原神祈愿记录管理系统效果图

6.总结 


1.运行环境

IDE - IDEA

Spring Boot 3+

Spring Framework 6+

Maven

Java 17

Spring Data JPA ( Hibernate)

Thymelea

2.功能概述

  1. 设备模型:定义设备的属性,例如设备类型、设备名称、初始状态等。至少应该有3个以上的属性
  2. 添加设备:允许用户输入设备信息,并将设备信息添加到数据库或持久化存储中
  3. 删除设备:根据设备ID或其他唯一标识符,删除指定的设备记录。
  4. 添加设备:允许用户修改设备的属性信息,并更新到数据库或持久化存储中。
  5. 查找设备:提供自定义查询条件(例如设备类型、设备名称等),根据查询条件检索设备信息,并显示查询结果。
  6. 分页:将设备信息分页显示,以便用户能够浏览和管理大量设备信息。用户可以指定每页显示的设备数量,并根据需要切换到不同的页码。
  7. 排序:允许用户按照指定的字段对设备进行排序,例如按设备名称、设备类型等进行升序或降序排序。

3.技术类型

Springboot +JPA+thymeleaf+MySQL+ BootStrap

4.实现过程以及代码

1.创建项目

2. 选择依赖

对应的maven依赖如下(在项目文件pom.xml)中查看

<dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-data-jpa</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-devtools</artifactId>
            <scope>runtime</scope>
            <optional>true</optional>
        </dependency>
        <dependency>
            <groupId>com.mysql</groupId>
            <artifactId>mysql-connector-j</artifactId>
            <scope>runtime</scope>
        </dependency>

3.项目结构

4.配置数据库

添加到项目路径/src/main/resources/application.properties中,用户名,密码照自己的更改

spring.datasource.url=jdbc:mysql://localhost:3306/testdb?useSSL=false&serverTimezone=UTC&useLegacyDatetimeCode=false
spring.datasource.username=root
spring.datasource.password=123456
spring.jpa.properties.hibernate.dialect =org.hibernate.dialect.MySQLDialect
spring.jpa.hibernate.ddl-auto = update
logging.level.org.hibernate.SQL=DEBUG
logging.level.org.hibernate.type=TRACE

5. Model层

创建一个名为Role角色实体类,并使用JPA注解进行数据映射

代码如下:

package com.example.finalhomework.model;

import jakarta.persistence.*;
import lombok.Data;

@Data
@Entity
@Table(name = "roles")
public class Role {

    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private long id;

    @Column(name = "role_number")
    private String roleNumber;

    @Column(name = "role_nicknames")
    private String roleNicknames;

    @Column(name = "character_rating")
    private String characterRating;

    @Column(name = "weapon_type")
    private String weaponType;

    @Column(name = "role_attributes")
    private String roleAttributes;
}

6.Repository层

创建一个继承自JpaRepositoryEmployeeRepository接口,用于进行设备数据的CRUD操作。你可以在接口中添加自定义的查询方法,以便根据设备类型、设备名称等查询设备

代码如下:

package com.example.finalhomework.repository;

import com.example.finalhomework.model.Role;
import org.springframework.data.jpa.repository.JpaRepository;
import org.springframework.stereotype.Repository;
import java.util.List;

@Repository
public interface EmployeeRepository extends JpaRepository<Role, Long>{
    List<Role> findByRoleNumber(String keyword);
}

7.Service层

1.创建一个名为EmployeeService的设备服务接口,并定义设备管理的基本操作,并在接口中添加自定义的查询方法

代码如下:

package com.example.finalhomework.service;

import java.util.List;

import com.example.finalhomework.model.Role;
import org.springframework.data.domain.Page;

public interface EmployeeService {

    //获取所有的员工
    List <Role> getAllEmployees();

    //新增/更新一个员工
    void saveEmployee(Role role);


    //获取指定ID的员工
    Role getEmployeeById(long id);

    //删除指定ID的员工
    void deleteEmployeeById(long id);

    //分页
    Page<Role> findPaginated(int pageNo, int pageSize, String sortField, String sortDirection);


    List<Role> searchEmployees(String keyword);


}

2.创建一个名为EmployeeServiceImpl的设备服务实现类,实现EmployeeService接口中的方法,并注入EmployeeRepository实例

代码如下:

package com.example.finalhomework.service;

import java.util.List;
import java.util.Optional;

import com.example.finalhomework.model.Role;
import com.example.finalhomework.repository.EmployeeRepository;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.data.domain.Page;
import org.springframework.data.domain.PageRequest;
import org.springframework.data.domain.Pageable;
import org.springframework.data.domain.Sort;
import org.springframework.stereotype.Service;


@Service
public class EmployeeServiceImpl implements EmployeeService {

    @Autowired
    private EmployeeRepository employeeRepository;

    @Override
    public List <Role> getAllEmployees() {
        return employeeRepository.findAll();
    }

    @Override
    public void saveEmployee(Role role) {
        this.employeeRepository.save(role);
    }

    @Override
    public Role getEmployeeById(long id) {
        //调用数据访问层查找指定ID的角色,返回Optional对象
        Optional <Role> optional = employeeRepository.findById(id);

        Role role = null;
        //如果存在指定id的角色
        if (optional.isPresent()) {
            //从Optional对象中获取角色对象
            role = optional.get();
        } else {
            //否则抛出运行时异常
            throw new RuntimeException(" 找不到员工ID :: " + id);
        }
        return role;
    }

    @Override
    public void deleteEmployeeById(long id) {
        this.employeeRepository.deleteById(id);
    }

    @Override
    public Page<Role> findPaginated(int pageNo, int pageSize, String sortField, String sortDirection) {
        //设置排序参数,升序ASC/降序DESC?
        Sort sort = sortDirection.equalsIgnoreCase(Sort.Direction.ASC.name())
                    ? Sort.by(sortField).ascending()
                    : Sort.by(sortField).descending();

         //根据页号/每页记录数/排序依据返回某指定页面数据。
        Pageable pageable = PageRequest.of(pageNo - 1, pageSize, sort);
        return this.employeeRepository.findAll(pageable);
    }

    @Override
    public List<Role> searchEmployees(String keyword) {
        // 在数据库中执行根据关键字查询的操作,并返回结果列表
        return employeeRepository.findByRoleNumber(keyword); // 假设按照的RoleNumber查询
    }
}

8.Controller层

创建一个名为EmployeeController的控制器,用于处理设备管理相关的请求,并使用Thymeleaf模板引擎渲染视图。在控制器中注入EmployeeService实例,并实现对应的请求处理方法

代码如下:

package com.example.finalhomework.controller;

import com.example.finalhomework.model.Role;
import com.example.finalhomework.service.EmployeeService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.data.domain.Page;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.*;

import java.util.List;


@Controller
public class EmployeeController {

    @Autowired
    private EmployeeService employeeService;


    @GetMapping("/")
    public String viewHomePage(Model model) {
        return findPaginated(1, "roleNumber", "asc", model);
    }

    @GetMapping("/showNewEmployeeForm")
    public String showNewEmployeeForm(Model model) {
        // 创建模型属性来绑定表单数据
        Role role = new Role();
        model.addAttribute("role", role);
        return "new_employee";
    }

    @PostMapping("/saveEmployee")
    public String saveEmployee(@ModelAttribute("Role") Role role) {
        // save employee to database
        employeeService.saveEmployee(role);
        return "redirect:/";
    }

    @GetMapping("/showFormForUpdate/{id}")
    public String showFormForUpdate(@PathVariable(value = "id") long id, Model model) {

        // 从服务中获取角色
        Role role = employeeService.getEmployeeById(id);

        //将employee设置为模型属性以预填充表单
        model.addAttribute("role", role);
        return "update_employee";
    }

    @GetMapping("/deleteEmployee/{id}")
    public String deleteEmployee(@PathVariable(value = "id") long id) {

        // 调用delete employee方法
        this.employeeService.deleteEmployeeById(id);
        return "redirect:/";
    }

    @GetMapping("/search")
    public String searchEmployees(@RequestParam("keyword") String keyword, Model model) {
        List<Role> searchResults = employeeService.searchEmployees(keyword);
        model.addAttribute("listRoleClasss", searchResults);
        return "index";
    }




    //获取分页数据
    @GetMapping("/page/{pageNo}")
    public String findPaginated(@PathVariable (value = "pageNo") int pageNo,
                                @RequestParam("sortField") String sortField,
                                @RequestParam("sortDir") String sortDir,
                                Model model) {
        int pageSize = 5;

        Page<Role> page = employeeService.findPaginated(pageNo, pageSize, sortField, sortDir);
        List<Role> listRoles = page.getContent();

        model.addAttribute("currentPage", pageNo);
        model.addAttribute("totalPages", page.getTotalPages());
        model.addAttribute("totalItems", page.getTotalElements());

        model.addAttribute("sortField", sortField);
        model.addAttribute("sortDir", sortDir);
        model.addAttribute("reverseSortDir", sortDir.equals("asc") ? "desc" : "asc");

        model.addAttribute("listRoleClasss", listRoles);
        return "index";
    }
}

9.视图层

创建设备管理相关的HTML视图,使用Thymeleaf和Bootstrap进行页面布局和渲染

Index.html

代码如下:

<!DOCTYPE html>
<html lang="com" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>原神祈愿记录</title>

    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container my-2">
    <h1>原神祈愿记录</h1>

    <a th:href = "@{/showNewEmployeeForm}" class="btn btn-primary btn-sm mb-3">添加角色 </a>

    <table border="1" class = "table table-striped table-responsive-md">
        <thead>
        <tr>
            <th>
                <a th:href="@{'/page/' + ${currentPage} + '?sortField=roleNumber&sortDir=' + ${reverseSortDir}}">
                    角色编号</a>
            </th>
            <th>
                <a th:href="@{'/page/' + ${currentPage} + '?sortField=roleNicknames&sortDir=' + ${reverseSortDir}}">
                    角色昵称</a>
            </th>
            <th>
                <a th:href="@{'/page/' + ${currentPage} + '?sortField=characterRating&sortDir=' + ${reverseSortDir}}">
                    角色星级</a>
            </th>
            <th>
                <a th:href="@{'/page/' + ${currentPage} + '?sortField=weaponType&sortDir=' + ${reverseSortDir}}">
                    武器类型</a>
            </th>
            <th>
                <a th:href="@{'/page/' + ${currentPage} + '?sortField=roleAttributes&sortDir=' + ${reverseSortDir}}">
                    角色属性</a>
            </th>
            <th> 操作 </th>
        </tr>
        </thead>
        <tbody>
        <tr th:each="role : ${listRoleClasss}">
            <td th:text="${role.roleNumber}"></td>
            <td th:text="${role.roleNicknames}"></td>
            <td th:text="${role.characterRating}"></td>
            <td th:text="${role.weaponType}"></td>
            <td th:text="${role.roleAttributes}"></td>
            <td> <a th:href="@{/showFormForUpdate/{id}(id=${role.id})}" class="btn btn-primary">更新记录</a>
                <a th:href="@{/deleteEmployee/{id}(id=${role.id})}" class="btn btn-danger">删除记录</a>
            </td>
        </tr>
        </tbody>
    </table>

    <!-- 搜索表单 -->
    <form action="/search" method="get" class="my-3">
        <div class="input-group">
            <input type="text" name="keyword" class="form-control" placeholder="角色编号">
            <div class="input-group-append">
                <button type="submit" class="btn btn-primary">搜索</button>
            </div>
        </div>
    </form>

    <div th:if = "${totalPages > 1}">
        <div class = "row col-sm-10">
            <div class = "col-sm-3">
                角色数量: [[${totalItems}]] 名
            </div>
            <div class = "col-sm-5">
					<span th:each="i: ${#numbers.sequence(1, totalPages)}">
						<a th:if="${currentPage != i}" th:href="@{'/page/' + ${i}+ '?sortField=' + ${sortField} + '&sortDir=' + ${sortDir}}">[[${i}]]</a>
						<span th:unless="${currentPage != i}">[[${i}]]</span>  &nbsp; &nbsp;
					</span>
            </div>
            <div class = "col-sm-1">
                <a th:if="${currentPage < totalPages}" th:href="@{'/page/' + ${currentPage + 1}+ '?sortField=' + ${sortField} + '&sortDir=' + ${sortDir}}">上页</a>
                <span th:unless="${currentPage < totalPages}"></span>
            </div>

            <div class="col-sm-1">
                <a th:if="${currentPage < totalPages}" th:href="@{'/page/' + ${totalPages}+ '?sortField=' + ${sortField} + '&sortDir=' + ${sortDir}}">下页</a>
                <span th:unless="${currentPage < totalPages}">尾页</span>

            </div>
            <a th:href="@{/}"> 返回首页</a>
        </div>
    </div>
</div>
</body>
</html>

New_employee.html

代码如下:

<!DOCTYPE html>
<html lang="com">
<head>
    <meta charset="UTF-8">
    <title>添加角色</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">
</head>

<body>
<div class="container">
    <h1>添加角色系统</h1>
    <hr>
    <h2>角色信息</h2>

    <form action="#" th:action="@{/saveEmployee}" th:object="${role}" method="POST">
        <input type="text" th:field="*{roleNumber}" placeholder=" 角色编号" class="form-control mb-4 col-4">

        <input type="text" th:field="*{roleNicknames}" placeholder="角色昵称" class="form-control mb-4 col-4">

        <input type="text" th:field="*{characterRating}" placeholder="角色星级" class="form-control mb-4 col-4">

        <input type="text" th:field="*{weaponType}" placeholder="武器类型" class="form-control mb-4 col-4">

        <input type="text" th:field="*{roleAttributes}" placeholder="角色属性" class="form-control mb-4 col-4">
        <button type="submit" class="btn btn-info col-2">确认添加</button>
    </form>

    <hr>

    <a th:href="@{/}"> 返回首页</a>
</div>
</body>

</html>

Update_employee.html

代码如下:

<!DOCTYPE html>
<html lang="com">
<head>
    <meta charset="UTF-8">
    <title>更新角色信息</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">

   </head>

<body>
<div class="container">
    <h1>更新角色信息系统</h1>
    <hr>
    <h2>更新角色信息</h2>

    <form action="#" th:action="@{/saveEmployee}" th:object="${role}" method="POST">

        <!-- Add hidden form field to handle update -->
        <input type="hidden" th:field="*{id}" />

        <input type="text" th:field="*{roleNumber}" class="form-control mb-4 col-4">

        <input type="text" th:field="*{roleNicknames}" class="form-control mb-4 col-4">

        <input type="text" th:field="*{characterRating}" class="form-control mb-4 col-4">

        <input type="text" th:field="*{weaponType}" class="form-control mb-4 col-4">

        <input type="text" th:field="*{roleAttributes}" class="form-control mb-4 col-4">

        <button type="submit" class="btn btn-info col-2"> 确认更新</button>
    </form>

    <hr>

    <a th:href="@{/}"> 返回首页</a>
</div>
</body>

</html>

5.原神祈愿记录管理系统效果图

首页

 排序

分页

 

 查询

 添加角色


 

 更新角色信息

6.总结 

这是一个简单的项目,也是我的一些学习过程,希望能帮助到你。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值