根据项目需要设计相应实体类

本项目想利用管理员信息管理为例,实现Springboot、Sqlite、Jpa三者结合。所以本项目创建管理员类,以后会增加其他类练习!

import org.springframework.boot.autoconfigure.data.jpa.JpaRepositoriesAutoConfiguration;

import javax.persistence.*;

@Entity
@Table(name = "admin")
public class Admin extends JpaRepositoriesAutoConfiguration {
    @Id
    @GeneratedValue
    @Column(name = "id")
    public Integer id;
    public String name;
    public String password;

    public Admin() {

    }

    public Admin(Integer id, String name, String password) {
        this.id = id;
        this.name = name;
        this.password = password;
    }

    public Integer getId() {
        return id;
    }

    public void setId(Integer id) {
        this.id = id;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getPassword() {
        return password;
    }

    public void setPassword(String password) {
        this.password = password;
    }

    @Override
    public String toString() {
        return "admin{" +
                "id=" + id +
                ", name='" + name + '\'' +
                ", password='" + password + '\'' +
                '}';
    }
}

自定义Repository创建方法

本项目想要使用JPA,必须有Repository方法来集成。由于JPA抛弃了Sqlite数据库的相关方法,所以方法都需要自己设定。

import com.shop.sma.entity.Admin;
import org.springframework.data.jpa.repository.JpaRepository;
import org.springframework.data.jpa.repository.Modifying;
import org.springframework.data.jpa.repository.Query;
import org.springframework.stereotype.Repository;

import javax.transaction.Transactional;

@Repository
@Transactional
public interface AdminRepository extends JpaRepository<Admin, Integer> {
    @Query(value = "select * from admin where name=?1 and password=?2", nativeQuery = true)
    public Admin findAdminByName(String name, String password);

    @Query(value = "insert into admin(name,password) values(?1, ?2)", nativeQuery = true)
    @Modifying
    public int adminInsert(String name, String password);

    @Query(value = "update  admin set password=?1 where name=?2", nativeQuery = true)
    @Modifying
    public int adminUpdate(String password, String name);

    @Query(value = "update  admin set name=?1,password=?2 where id=?3", nativeQuery = true)
    @Modifying
    public int adminEditById(String name, String password, Integer id);

}

Controller层数据处理

本次小项目的Controller层负责Sqlite数据库与前端页面数据交互,并将数据段放入某个特定方法进行应有的处理。

import com.shop.sma.entity.Admin;
import com.shop.sma.mapper.AdminRepository;
import net.sf.json.JSONArray;
import net.sf.json.JSONObject;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;

import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.List;

@Controller
@RequestMapping("/admin")
public class AdminController {

    @Autowired
    AdminRepository adminRepository;
    private Logger logger = LoggerFactory.getLogger(AdminController.class);

    @RequestMapping("/forgetPwd")
    public String edPage() {
        return "/admin/edit";
    }

    @RequestMapping("/edit2")
    public String edPage2() {
        return "/admin/edit2";
    }

    @RequestMapping("/todolist")
    @ResponseBody
    public void getAdminList(HttpServletResponse response) throws IOException {
        List<Admin> adminlist = adminRepository.findAll();
        PrintWriter out = response.getWriter();       //向客户端发送字符数据
        response.setContentType("text/text");          //设置请求以及响应的内容类型以及编码方式
        response.setCharacterEncoding("UTF-8");
        JSONArray json = JSONArray.fromObject(adminlist);   //将newsList对象转换为json对象
        String str = json.toString();                //将json对象转换为字符串
        out.write(str);                     //将str字符传输到前台
    }

    @PostMapping(value = "/toed")
    @ResponseBody
    public String toed(@RequestBody Admin temp) {
        logger.info(temp.getPassword() + " " + temp.getName());
        int num = adminRepository.adminUpdate(temp.getPassword(), temp.getName());
        logger.info(num + "");
        JSONObject jsonObject = new JSONObject();
        if (num != 0) {
            logger.info("运行到result==1");
            jsonObject.put("result", 1);
        } else {
            logger.info("运行到result==0");
            jsonObject.put("result", 0);
        }
        return jsonObject.toString();
    }

    @RequestMapping(value = "/del", method = RequestMethod.POST)
    @ResponseBody
    public void del(@RequestBody Admin temp) {
        logger.info(temp.getName() + " " + temp.getPassword());
        adminRepository.delete(temp);
    }

    @RequestMapping(value = "/toed2", method = RequestMethod.POST)
    @ResponseBody
    public String edit2(@RequestBody Admin admin, HttpServletResponse response) throws IOException {
        logger.info(admin.getId() + " " + admin.getPassword() + " " + admin.getName());
        int num = adminRepository.adminEditById(admin.getName(), admin.getPassword(), admin.getId());
        logger.info(num + "");
        JSONObject jsonObject = new JSONObject();
        if (num != 0) {
            logger.info("运行到result==1");
            jsonObject.put("result", 1);
        } else {
            logger.info("运行到result==0");
            jsonObject.put("result", 0);
        }
        return jsonObject.toString();
    }
}

前端页面处理

前端页面主要是让使用者通过页面环节完成数据操控,本项目就节约。一行数据后,带着添加、删除、修改按钮。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>管理员信息管理界面</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<a href="/reg">添加管理员</a>
<table>
    <thead>
    <tr>
        <th>编号</th>
        <th>名称</th>
        <th>密码</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody id="tables">
    </tbody>
</table>
<script type="text/javascript">
    $(document).ready(function () {
        $.ajax({
            url: "/admin/todolist",//请求地址
            dataType: "json",//数据格式
            type: "post",//请求方式
            async: false,//是否异步请求
            success: function (data) {   //如何发送成功
                $(data).each(function (i, ls) {   //遍历data数组
                      var idTd=$("<td></td>").append(ls.id);
                      var nameTd=$("<td></td>").append(ls.name);
                      var passwordTd=$("<td></td>").append(ls.password);
                      var delBtn = $("<button></button>").addClass("btn btn-danger btn-sm delete_btn")
                            .append($("<span></span>").addClass("glyphicon glyphicon-trash")).append("删除");
                      delBtn.attr("del-id",ls.id);
                       var editBtn = $("<button></button>").addClass("btn btn-danger btn-sm edit_btn")
                            .append($("<span></span>").addClass("glyphicon glyphicon-trash")).append("编辑");
                      editBtn.attr("edit-id",ls.id);
                      var btnTd = $("<td></td>").append(delBtn).append(editBtn);
                      $("<tr></tr>").append(idTd).append(nameTd).append(passwordTd).append(btnTd).appendTo("#tables")
                })
            },
        })
    })

$(document).on("click",".edit_btn",function(){
			            var id = $(this).attr("edit-id");
						 window.location.href="/admin/edit2?id="+id;
			});


	$(document).on("click",".delete_btn",function(){
			            var id = $(this).attr("del-id");
                        var name = $(this).parents("tr").find("td:eq(1)").text();
                        var password = $(this).parents("tr").find("td:eq(2)").text();
					    var jsonStr = {id:id,name: name, password: password}
					    var temp=JSON.stringify(jsonStr);
							if(confirm("确认删除【"+name+"】吗?")){
									//点击确认发送ajax请求
									$.ajax({
										url:"/admin/del",
										type:"post",
										dataType:"json",
										data:temp,
										contentType:'application/json;charset=UTF-8',
										success:function(){
                                            alert("删除成功");
                                        }
									});
						}
			});

</script>
</body>
</html>

本项目编辑按钮,会跳转到新页面完成编辑。代码如下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script>
</head>
<script type="text/javascript">

  function edit() {
      var url=window.location.search;
      var oltid=url.substr(url.indexOf("=")+1);
      alert(oltid);
        var name = $("#name").val();
        var password = $("#password").val();
        var json = {id:oltid,password: password,name: name};
        $.ajax({
            type: "post",
            dataType: "json",
            url: "/admin/toed2",
            async: true,
            data:JSON.stringify(json),
            contentType : "application/json",
            error: function () {
                alert("系统错误");
            },
            success: function (data) {
                if (data.result== "1") {
                    alert("修改成功");
                    window.location.href="/admin/list";
                } else if (data.result == "0") {
                    alert("修改错误");
                }
            }
        })
    }



</script>
<body>
<form enctype="multipart/form-data">
    <label>姓名</label> <input id="name" name="name" type="text">
    <label>密码</label> <input id="password" name="password" type="password">
    <button onclick="edit()" type="button">修改</button>
</form>
</body>
</html>

结语

不是所有的数据库操作都可以用JPA代替,比如说本文说的Sqlite。在使用JPA时,一定视情况使用。

Logo

DAMO开发者矩阵,由阿里巴巴达摩院和中国互联网协会联合发起,致力于探讨最前沿的技术趋势与应用成果,搭建高质量的交流与分享平台,推动技术创新与产业应用链接,围绕“人工智能与新型计算”构建开放共享的开发者生态。

更多推荐