第七次作业--实现数据库的增删改操作

已于 2024-05-15 11:38:53 修改
阅读量311 收藏 3
点赞数 7
分类专栏： Web应用技术 文章标签： 数据库
于 2024-05-14 22:54:02 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/w_peifang/article/details/138873527
版权

一、代码文件

Poet实体类

package com.wust.pojo;

import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;

@AllArgsConstructor
@NoArgsConstructor
@Data
public class Poet {
    private Integer id;
    private String name;
    private String  gender;
    private String dynasty;
    private String title;
    private String style;
}

Result实体类

package com.wust.pojo;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
@Data
@AllArgsConstructor
@NoArgsConstructor
public class Result {
    private Integer code;
    private String message;
    private Object data;
    public static Result success(Object data){
        return new Result(1,"success",data);
    }
    public static Result success(){
        return new Result(1,"success",null);
    }
    public static Result error(String mas){
        return new Result(0,"mes",null);
    }
}

PoetMapper

package com.wust.mapper;
import com.wust.pojo.Poet;
import org.apache.ibatis.annotations.Delete;
import org.apache.ibatis.annotations.Insert;
import org.apache.ibatis.annotations.Mapper;
import org.apache.ibatis.annotations.Select;
import org.springframework.web.bind.annotation.PathVariable;
import java.util.List;
@Mapper
public interface PoetMapper {
    // 查询所有数据信息
    @Select("select * from poet")
    public List<Poet> findAll11();

    // 删除一条信息
    @Delete("delete from poet where id=#{id}")
    public int delete11(Integer id);

//    @Select("select * from poet where id=#{id}")
//    public List<Poet> poetFindById11(Integer id);

    // 添加一条数据
    @Insert("insert into poet(name, gender, dynasty, title, style) values (#{name},#{gender},#{dynasty},#{title},#{style})")
    public int addPoet11(Poet poet);

}

PoetServiceA

package com.wust.service.impl;

import com.wust.mapper.PoetMapper;
import com.wust.pojo.Poet;
import com.wust.service.PoetService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import java.util.List;
@Service
public class PoetServiceA implements PoetService {

    @Autowired
    private PoetMapper poetMapper;

    // 操作一 查询所有数据信息
    @Override
    public List<Poet> findAll22() {
        List<Poet> allPoet = poetMapper.findAll11();
        allPoet.stream().forEach(poet -> {
            String gender = poet.getGender();
            if (gender.equals("1")){
                poet.setGender("男");
            }else if (gender.equals("2")){
                poet.setGender("女");
            }
        });
        return allPoet;
    }

    // 操作二 删除一条数据
    @Override
    public int delete22(Integer id){
        return poetMapper.delete11(id);
    }

    // 添加一条
    @Override
    public boolean addPoet22(Poet poet){
        int result = poetMapper.addPoet11(poet);
        return result == 1;
    }
}

PoetController

package com.wust.controller;

import com.wust.pojo.Poet;
import com.wust.pojo.Result;
import com.wust.service.impl.PoetServiceA;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import java.util.List;

@RestController
public class PoetController {

    @Autowired
    private PoetServiceA poetService;

    // 操作一 查询
    @RequestMapping("/poetFindAll")
    public Result findAll33(){
        List<Poet> allPoet = poetService.findAll22();
        return Result.success(allPoet);
//        return allPoet;
    }

    @RequestMapping("/poetDelete")
    public void delete33(Integer id){
        poetService.delete22(id);
    }

    @RequestMapping("/addPoet")
    public Result addPoet33(@RequestBody Poet poet){
        boolean result = poetService.addPoet22(poet);
        if(result){
            // 成功 等于1
            return Result.success();
        }else {
            return Result.error("添加失败。");
        }

    }
}

delete_find.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>poetFindAll</title>
</head>

<link rel="stylesheet" href="element-ui/index.css">
<script src="./js/vue.js"></script>
<script src="./js/axios-0.18.0.js"></script>
<script src="./element-ui/index.js"></script>

<body>
<h1 align="center">诗人信息delete_find 11</h1>
<div id="app" align="center">
  <a href="add_poet.html">添加</a>
  <table border="1px" cellspacing="0" align="center">
    <tr align="center">
      <td>id</td>
      <td>name</td>
      <td>gender</td>
      <td>dynasty</td>
      <td>title</td>
      <td>style</td>
      <td>操作</td>
    </tr>
    <tr v-for="poet in allPoet" align="center">
      <td>{{poet.id}}</td>
      <td>{{poet.name}}</td>
      <td>{{poet.gender}}</td>
      <td>{{poet.dynasty}}</td>
      <td>{{poet.title}}</td>
      <td>{{poet.style}}</td>
      <td>
        删除 修改
<!--        <button type="button" @click="deleteByBtn(poet.id)">删除</button>-->
        <button type="button" @click="deleteByBtn(poet.id)">删除</button>
      </td>
    </tr>
  </table>

</div>


</body>
</html>
<script>
  new Vue({
    el:"#app",
    data(){
      return {
        allPoet:[]
      }
    },
    mounted(){
      axios.get("/poetFindAll").then(res =>{
        if (res.data.code) {
          this.allPoet = res.data.data;
        }
      });
    },
    methods:{

      findAll:function (){
        var _this = this;
        axios.get("/poetFindAll",{}).then(function (response){
          _this.allPoet = response.data.data;
        }).catch(function (error){
          console.log(error);
        })
      },

      deleteByBtn:function (id){
        var _this = this;
        if (window.confirm("确定删除？")){
          axios.post('/poetDelete?id='+id).then(function (response){
            alert("删除成功！")
            // _this.mounted();  使用这个貌似也能删除只是删除之后必须刷新才能显示删除之后的数据
            _this.findAll();
          }).catch(function (error){
            console.log(error);
          });
        }
      }
    }
  });
</script>

add_poet.html 数据信息添加时的表单前端页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>添加诗人信息</title>
</head>
<body>
<div id="app">
    <table border="1px">
        <tr>
            <td>姓名</td>
            <td><input type="text" v-model="poet.name"></td>
        </tr>
        <tr>
            <td>性别</td>
            <td>
                <input type="radio" name="gender" v-model="poet.gender">男
                <input type="radio" name="gender" v-model="poet.gender">女
            </td>
        </tr>
        <tr>
            <td>朝代</td>
            <td><input type="text" v-model="poet.dynasty"></td>
        </tr>
        <tr>
            <td>头衔</td>
            <td><input type="text" v-model="poet.title"></td>
        </tr>
        <tr>
            <td>风格</td>
            <td><input type="text" v-model="poet.style"></td>
        </tr>
        <tr>
            <td></td>
            <td><input type="button" @click="addPoet" value="增加"></td>
        </tr>
    </table>
<!--    <form style="border: 2px">-->
<!--        姓名：<input type="text" v-model="poet.name"><br>-->
<!--        性别：-->
<!--        <input type="radio" name="gender" v-model="poet.gender">男-->
<!--        <input type="radio" name="gender"  v-model="poet.gender">女<br>-->
<!--        朝代：<input type="text" v-model="poet.dynasty"><br>-->
<!--        头衔：<input type="text" v-model="poet.title"><br>-->
<!--        风格：<input type="text" v-model="poet.style"><br>-->
<!--        <p>-->
<!--            <input type="button" @click="addPoet" value="新增">-->
<!--            <button type="button">取消</button>-->
<!--        </p>-->
<!--    </form>-->
</div>
</body>

<script>
    new Vue({
        el:"#app",
        data:{
            poet:{
                "name":"",
                "gender":"",
                "dynasty":"",
                "title":"",
                "style":"",
            }
        },

        methods:{
            addPoet(){
                var url = "addPoet"
                axios.post(url,this.poet).then(res=>{
                    var baseResult = res.data
                    if (baseResult.code == 1){
                        location.href="delete_find.html"
                    }else {
                        alert(baseResult.message)
                    }
                }).catch(err=>{
                    console.error(err);
                })
            }
        }
    })
</script>
</html>

二、实现删除操作

 

1365d2d84fcf4936925faf533049183a.png

成功删除

4f834eea6580423bbce67b851ddf2da2.png

三、实现新增操作

新添加诗人数据信息

d0ebb82e1f084edfb406e87ca549396f.png

 

成功添加

043d3952c49441c0af5a286b45d2b067.png

 

Perfect_www
关注
专栏目录
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值