Spring+RestFul+Vue多表（学校，老师，类型）

世昌愿世昌盛

已于 2023-10-26 09:23:25 修改

阅读量224

点赞数

文章标签： spring restful vue.js

于 2021-11-01 18:02:01 首次发布

本文链接：https://blog.csdn.net/Harden_zsc/article/details/121083662

版权

数据库SQL（有三个表：校区表，老师表，类型表）：

 CREATE TABLE `t_school`  (
`id` int(11) NOT NULL AUTO_INCREMENT,
`school_name` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
PRIMARY KEY (`id`) USING BTREE
);

INSERT INTO `t_school` VALUES (1, '沭阳校区');
INSERT INTO `t_school` VALUES (2, '南京校区');
INSERT INTO `t_school` VALUES (3, '上海校区');
INSERT INTO `t_school` VALUES (4, '北京校区');

CREATE TABLE `t_teacher`  (
`id` int(11) NOT NULL AUTO_INCREMENT,
`teacher_name` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
`pwd` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
`sex` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
`salary` decimal(10, 2) NULL DEFAULT NULL,
`type_id` int(11) NULL DEFAULT NULL,
`school_id` int(11) NULL DEFAULT NULL,
`hire_date` date NULL DEFAULT NULL,
`remark` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
PRIMARY KEY (`id`) USING BTREE
) ;
INSERT INTO `t_teacher` VALUES (1, 'tom', '123', '男', 5000.00, 1, 1, '2020-02-03', 'tom是优秀老师');
INSERT INTO `t_teacher` VALUES (2, 'lucy', '123', '女', 10000.00, 2, 2, '2020-06-09', 'lucy很优秀');


CREATE TABLE `t_type`  (
`id` int(11) NOT NULL AUTO_INCREMENT,
`city` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
PRIMARY KEY (`id`) USING BTREE
);

INSERT INTO `t_type` VALUES (1, '辅导员');
INSERT INTO `t_type` VALUES (2, '助理讲师');
INSERT INTO `t_type` VALUES (3, '主讲老师');
INSERT INTO `t_type` VALUES (4, '财务老师');
INSERT INTO `t_type` VALUES (5, '后勤老师');

前期准备：
application.yml:

#端口号
server:
  port: 8081
#服务名
spring:
  thymeleaf:
    prefix: classpath:/templates/
    mode: html5
    encoding: utf-8
    suffix: .html
    cache: false
  mvc:
    static-path-pattern: /**
  datasource:
    driverClassName: com.mysql.cj.jdbc.Driver
    url: jdbc:mysql://127.0.0.1:3306/ssm_db3?useUnicode=true&characterEncoding=UTF-8&serverTimezone=GMT&autoReconnect=true&useSSL=false
    username: root
    password: root
    druid: #druid 连接池配置
      initial-size: 1       #初始化连接池大小
      min-idle: 1           #最小连接数
      max-active: 20        #最大连接数
      test-on-borrow: true  #获取连接时候验证，会影响性能
  servlet:
    multipart:
      #设置总上传的数据大小
      max-request-size: 100MB
      #单个文件大小
      maxFileSize: 30MB
    #热部署模块
    devtools:
      restart:
        enabled: true
        additional-paths: src/main/java
        exclude: test/**
  jackson:
    time-zone: GMT+8
    date-format: yyyy-MM-dd HH:mm:ss

#pagehelper分页插件
pagehelper:
  helperDialect: mysql
  reasonable: true
  supportMethodsArguments: true
  params: count=countSql
#开启log4j打印SQL语句
logging:
  level:
    com:
      omitkit:
        mapper: debug

返回值Java类型：BaseResult.java

package com.czxy.Vo;

import java.util.HashMap;
import java.util.Map;

public class BaseResult<T> {

    //成功状态码
    public static final int OK = 1;
    //失败状态码
    public static final int ERROR = 0;

    //返回码
    private Integer code;
    //返回消息
    private String message;

    //存放数据
    private T data;
    //其他数据
    private Map<String,Object> other = new HashMap<>();

    public BaseResult() {

    }

    public BaseResult(Integer code, String message) {
        this.code = code;
        this.message = message;
    }
    public BaseResult(Integer code, String message, T data) {
        this.code = code;
        this.message = message;
        this.data = data;
    }

    /**
     * 快捷成功BaseResult对象
     * @param message
     * @return
     */
    public static BaseResult ok(String message){
        return new BaseResult(BaseResult.OK , message);
    }

    public static BaseResult ok(String message, Object data){
        return new BaseResult(BaseResult.OK , message, data );
    }

    /**
     * 快捷失败BaseResult对象
     * @param message
     * @return
     */
    public static BaseResult error(String message){
        return new BaseResult(BaseResult.ERROR , message);
    }

    /**
     * 自定义数据区域
     * @param key
     * @param msg
     * @return
     */
    public BaseResult append(String key , Object msg){
        other.put(key , msg);
        return this;
    }

    public Integer getCode() {
        return code;
    }

    public String getMessage() {
        return message;
    }

    public T getData() {
        return data;
    }

    public Map<String, Object> getOther() {
        return other;
    }
}

pom文件:pom.xml

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>

    <groupId>org.example</groupId>
    <artifactId>exam_project1919</artifactId>
    <version>1.0-SNAPSHOT</version>

    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.5.5</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>
    <properties>
        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
        <java.version>1.8</java.version>
        <mybatis.starter.version>1.3.2</mybatis.starter.version>
        <mapper.starter.version>2.0.2</mapper.starter.version>
        <pageHelper.starter.version>1.2.5</pageHelper.starter.version>
        <mysql.version>8.0.26</mysql.version>
        <durid.starter.version>1.1.10</durid.starter.version>
        <mybatis.plus.version>3.4.0</mybatis.plus.version>
        <swagger.version>2.7.0</swagger.version>
        <jwt.jjwt.version>0.9.0</jwt.jjwt.version>
        <jwt.joda.version>2.9.7</jwt.joda.version>
        <beanutils.version>1.9.3</beanutils.version>
    </properties>
    <!-- 3 锁定版本-->
    <dependencyManagement>
        <dependencies>
            <!-- mybatis启动器 -->
            <dependency>
                <groupId>org.mybatis.spring.boot</groupId>
                <artifactId>mybatis-spring-boot-starter</artifactId>
                <version>${mybatis.starter.version}</version>
            </dependency>
            <!-- 通用Mapper启动器 -->
            <dependency>
                <groupId>tk.mybatis</groupId>
                <artifactId>mapper-spring-boot-starter</artifactId>
                <version>${mapper.starter.version}</version>
            </dependency>
            <!-- 分页助手启动器 -->
            <dependency>
                <groupId>com.github.pagehelper</groupId>
                <artifactId>pagehelper-spring-boot-starter</artifactId>
                <version>${pageHelper.starter.version}</version>
            </dependency>

            <!-- mybatis plus-->
            <dependency>
                <groupId>com.baomidou</groupId>
                <artifactId>mybatis-plus-boot-starter</artifactId>
                <version>${mybatis.plus.version}</version>
            </dependency>
            <dependency>
                <groupId>com.baomidou</groupId>
                <artifactId>mybatis-plus-annotation</artifactId>
                <version>${mybatis.plus.version}</version>
            </dependency>


            <!-- mysql驱动 -->
            <dependency>
                <groupId>mysql</groupId>
                <artifactId>mysql-connector-java</artifactId>
                <version>${mysql.version}</version>
            </dependency>

            <!-- Druid连接池 -->
            <dependency>
                <groupId>com.alibaba</groupId>
                <artifactId>druid-spring-boot-starter</artifactId>
                <version>${durid.starter.version}</version>
            </dependency>

            <!--swagger2-->
            <dependency>
                <groupId>io.springfox</groupId>
                <artifactId>springfox-swagger2</artifactId>
                <version>${swagger.version}</version>
            </dependency>
            <dependency>
                <groupId>io.springfox</groupId>
                <artifactId>springfox-swagger-ui</artifactId>
                <version>${swagger.version}</version>
            </dependency>

            <!--jwt-->
            <!--JavaBean工具类，用于JavaBean数据封装-->
            <dependency>
                <groupId>commons-beanutils</groupId>
                <artifactId>commons-beanutils</artifactId>
                <version>${beanutils.version}</version>
            </dependency>

            <!--jwt工具-->
            <dependency>
                <groupId>io.jsonwebtoken</groupId>
                <artifactId>jjwt</artifactId>
                <version>${jwt.jjwt.version}</version>
            </dependency>

            <!--joda 时间工具类 -->
            <dependency>
                <groupId>joda-time</groupId>
                <artifactId>joda-time</artifactId>
                <version>${jwt.joda.version}</version>
            </dependency>
        </dependencies>
    </dependencyManagement>

    <dependencies>
        <!--web起步依赖-->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <!-- mybatis启动器 -->
        <dependency>
            <groupId>org.mybatis.spring.boot</groupId>
            <artifactId>mybatis-spring-boot-starter</artifactId>
        </dependency>
        <!-- 通用Mapper启动器 -->
        <dependency>
            <groupId>tk.mybatis</groupId>
            <artifactId>mapper-spring-boot-starter</artifactId>
        </dependency>
        <!-- 分页助手启动器 -->
        <dependency>
            <groupId>com.github.pagehelper</groupId>
            <artifactId>pagehelper-spring-boot-starter</artifactId>
        </dependency>
        <!-- mysql驱动 -->
        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
        </dependency>

        <!-- Druid连接池 -->
        <dependency>
            <groupId>com.alibaba</groupId>
            <artifactId>druid-spring-boot-starter</artifactId>
        </dependency>

        <!--swagger2-->
        <dependency>
            <groupId>io.springfox</groupId>
            <artifactId>springfox-swagger2</artifactId>
        </dependency>

        <dependency>
            <groupId>io.springfox</groupId>
            <artifactId>springfox-swagger-ui</artifactId>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-devtools</artifactId>
            <optional>true</optional>
        </dependency>
        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>
    </dependencies>

</project>

mian.js:
在这里插入图片描述

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import axios from "axios"
axios.defaults.baseURL="http://localhost:8081"
Vue.prototype.$http= axios
Vue.config.productionTip = false

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app')

后端项目结构：
在这里插入图片描述
学校增删改查：
JavaBean：

package com.czxy.domain;

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

import javax.persistence.Id;
import javax.persistence.Table;

@Table(name = "t_school")
@Data
@AllArgsConstructor
@NoArgsConstructor
public class School {
     @Id
    private Integer id;
     private String school_name;
}

dao层:

package com.czxy.dao;

import com.czxy.domain.School;
import tk.mybatis.mapper.common.Mapper;
@org.apache.ibatis.annotations.Mapper
public interface SchoolMapper extends Mapper<School> {
}

service层：

package com.czxy.service;

import com.czxy.domain.School;

import java.util.List;

public interface SchoolService {
    List<School> selectAll();

    School selectById(String id);

    Boolean edit(School school);

    Boolean Delete(String id);

    Boolean add(School school);
}

service实例类：

package com.czxy.service.impl;

import com.czxy.dao.SchoolMapper;
import com.czxy.domain.School;
import com.czxy.service.SchoolService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;

import java.util.List;

@Service
@Transactional
public class SchoolServiceImpl implements SchoolService {
    @Autowired
    private SchoolMapper schoolMapper;

    @Override
    public List<School> selectAll() {
        return schoolMapper.selectAll();
    }

    @Override
    public School selectById(String id) {
        return schoolMapper.selectByPrimaryKey(id);
    }

    @Override
    public Boolean edit(School school) {
        return schoolMapper.updateByPrimaryKey(school)==1;
    }

    @Override
    public Boolean Delete(String id) {
        return schoolMapper.deleteByPrimaryKey(id)==1;
    }

    @Override
    public Boolean add(School school) {
        return schoolMapper.insert(school)==1;
    }
}

controller层:

package com.czxy.controller;

import com.czxy.domain.School;
import com.czxy.service.SchoolService;
import com.czxy.vo.BaseResult;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;

import java.util.List;

@RestController
@CrossOrigin
@RequestMapping("/school")
public class SchoolController {
    @Autowired
    private SchoolService schoolService;

    @GetMapping
    public BaseResult selectAll() {
        List<School> list = schoolService.selectAll();
        if (list != null) {
            return BaseResult.ok("查询成功", list);
        }
        return BaseResult.error("查询失败");
    }

    @GetMapping("/selectById/{id}")
    public BaseResult selectById(@PathVariable("id") String id) {
        System.out.println(id);
        School school = schoolService.selectById(id);
        if (school != null) {
            return BaseResult.ok("查询成功", school);
        }
        return BaseResult.error("查询失败");
    }

    @PutMapping
    public BaseResult edit(@RequestBody School school) {
        Boolean f = schoolService.edit(school);
        if (f) {
            return BaseResult.ok("修改成功");
        }
        return BaseResult.error("修改失败");
    }

    @DeleteMapping("/del/{id}")
    public BaseResult Delete(@PathVariable("id") String id) {
        Boolean f = schoolService.Delete(id);
        if (f) {
            return BaseResult.ok("删除成功");
        }
        return BaseResult.error("删除失败");
    }
    @PostMapping
    public BaseResult add(@RequestBody School school) {
        Boolean f = schoolService.add(school);
        if (f) {
            return BaseResult.ok("添加成功");
        }
        return BaseResult.error("添加失败");
    }
}

前端结构：
在这里插入图片描述
App.vue:

<template>
  <div id="app">
    <div id="nav">
      <router-link to="/">Home</router-link> |
      <router-link to="/school">学校管理</router-link> |
      <router-link to="/teacher">老师管理</router-link>
    </div>
    <router-view/>
  </div>
</template>

<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
}

#nav {
  padding: 30px;
}

#nav a {
  font-weight: bold;
  color: #2c3e50;
}

#nav a.router-link-exact-active {
  color: #42b983;
}
</style>

router->index.js:

import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'

Vue.use(VueRouter)

const routes = [{
    path: '/',
    name: 'Home',
    component: Home
  },
  {
    path: '/about',
    name: 'About',
    component: () => import( /* webpackChunkName: "about" */ '../views/About.vue')
  }, {
    path: '/school',
    name: 'School',
    component: () => import( /* webpackChunkName: "about" */ '../views/SchoolList.vue')
  }, {
    path: '/TeacherEdit/:id',
    name: 'TeacherEdit',
    component: () => import( /* webpackChunkName: "about" */ '../views/TeacherEdit.vue')
  }, {
    path: '/TeacherAdd',
    name: 'TeacherAdd',
    component: () => import( /* webpackChunkName: "about" */ '../views/TeacherAdd.vue')
  }, {
    path: '/teacher',
    name: 'Teacher',
    component: () => import( /* webpackChunkName: "about" */ '../views/TeacherList.vue')
  }, {
    path: '/schoolAdd',
    name: 'schoolAdd',
    component: () => import( /* webpackChunkName: "about" */ '../views/schoolAdd.vue')
  }, {
    path: '/schoolEdit/:id',
    name: 'schoolEdit',
    component: () => import( /* webpackChunkName: "about" */ '../views/schoolEdit.vue')
  },
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

export default router

SchoolList.vue:

<template>
  <div>
    学校管理
    <router-link to="/TeacherAdd">添加学校</router-link>
    <table border="1">
      <tr>
        <th>学校ID</th>
        <th>学校名称</th>
        <th>操作</th>
      </tr>
      <tr v-for="(school, index) in schoolList" :key="index">
        <td>{{ school.id }}</td>
        <td>{{ school.school_name }}</td>
        <td>
          <router-link :to="`/schoolEdit/` + school.id">修改</router-link> |
          <a href="#" @click.prevent="DeleteSchool(school.id)">删除</a>
        </td>
      </tr>
    </table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      schoolList: [],
      school: {
        id: "",
        school_name: "",
      },
    };
  },
  methods: {
    init() {
      this.$http
        .get("/school")
        .then((res) => {
          this.schoolList = res.data.data;
          console.info(res);
        })
        .catch((err) => {
          console.error(err);
        });
    },
    DeleteSchool(id) {
      if (confirm("是否删除？")) {
        this.$http
          .delete("/school/del/" + id)
          .then((res) => {
            console.log(res);
            this.init();
          })
          .catch((err) => {
            console.error(err);
          });
      }
    },
  },
  created() {
    this.init();
  },
};
</script>

<style>
</style>

schoolEdit.vue:

<template>
  <div>
    ID:<input type="text" v-model="school.id"  readonly/> <br />
    学校名称:<input type="text" v-model="school.school_name" /><br/>
    提交：<button @click="edit()">修改</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      school: {
        id: "",
        school_name: "",
      },
    };
  },
  methods: {
    selectById(id) {
    //   alert(id);
      this.$http
        .get("/school/selectById/" + id)
        .then((res) => {
          console.log(res);
          this.school = res.data.data;
        })
        .catch((err) => {
          console.error(err);
        });
    },
    edit() {
         this.$http
        .put("/school",this.school)
        .then((res) => {
          console.log(res);
          this.$router.push("/school")
        })
        .catch((err) => {
          console.error(err);
        });
    },
  },
  created() {
    var id = this.$route.params.id;
    this.selectById(id);
  },
};
</script>

<style>
</style>

schoolAdd.vue:

<template>
  <div>
    <!-- ID:<input type="text" v-model="school.id" /> <br /> -->
    学校名称:<input type="text" v-model="school.school_name"/><br/>
    提交：<button @click="add()">添加</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      school: {
        school_name: "",
      },
    };
  },
  methods: {
    add() {
         this.$http
        .post("/school",this.school)
        .then((res) => {
          console.log(res);
          this.$router.push("/school")
        })
        .catch((err) => {
          console.error(err);
        });
    },
  },
 
};
</script>

<style>
</style>

学校的增删改查就到这了

接下来是老师的多条件分页查询，修改，增加，批量删除：

controller:

package com.czxy.controller;

import com.czxy.domain.Teacher;
import com.czxy.service.TeacherService;
import com.czxy.vo.BaseResult;
import com.czxy.vo.TeacherVo;
import com.github.pagehelper.PageInfo;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;

@RestController
@CrossOrigin
@RequestMapping("/teacher")
public class TeacherController {
    @Autowired
    private TeacherService teacherService;

    @PostMapping("/condition/{pageNum}/{pageSize}")
    public BaseResult condition(
            @PathVariable("pageNum") Integer pageNum,
            @PathVariable("pageSize") Integer pageSize,
            @RequestBody TeacherVo teacherVo) {
        System.out.println(teacherVo);
        PageInfo<Teacher> pageInfo = teacherService.condition(pageSize, pageNum, teacherVo);
        return BaseResult.ok("查询成功", pageInfo);
    }

    @GetMapping("/selectById/{id}")
    public BaseResult selectById(@PathVariable("id") String id) {
        Teacher teacher = teacherService.selectById(id);
        if (teacher != null) {
            return BaseResult.ok("查询成功", teacher);
        }
        return BaseResult.error("查询失败");
    }

    @PutMapping
    public BaseResult edit(@RequestBody Teacher teacher) {
        Boolean f = teacherService.edit(teacher);
        if (f) {
            return BaseResult.ok("修改成功");
        }
        return BaseResult.error("修改失败");
    }

    @DeleteMapping("/del/{id}")
    public BaseResult Delete(@PathVariable("id") String id) {
        Boolean f = teacherService.Delete(id);
        if (f) {
            return BaseResult.ok("删除成功");
        }
        return BaseResult.error("删除失败");
    }

    @DeleteMapping("/dels/{delids}")
    public BaseResult Deletes(@PathVariable("delids") String delids) {
        String[] split = delids.split(",");
        Boolean f = true;
        for (String s : split) {
            f = teacherService.Delete(s);
        }
        if (f) {
            return BaseResult.ok("删除成功");
        }
        return BaseResult.error("删除失败");

    }

    @PostMapping
    public BaseResult add(@RequestBody Teacher teacher) {
        Boolean f = teacherService.add(teacher);
        if (f) {
            return BaseResult.ok("添加成功");
        }
        return BaseResult.error("添加失败");
    }
}



-----------------------------------------------------------------



package com.czxy.controller;

import com.czxy.domain.T_Type;
import com.czxy.service.T_typeService;
import com.czxy.vo.BaseResult;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import java.util.List;

@RestController
@CrossOrigin
@RequestMapping("/t_type")
public class T_typeController {
    @Autowired
    private T_typeService t_typeService;
    @GetMapping
    public BaseResult selectAll(){
        List<T_Type> list = t_typeService.selectAll();
        if (list != null) {
            return BaseResult.ok("查询成功", list);
        }
        return BaseResult.error("查询失败");
    }
}

dao层：

package com.czxy.dao;

import com.czxy.domain.Teacher;
import tk.mybatis.mapper.common.Mapper;
@org.apache.ibatis.annotations.Mapper
public interface TeacherMapper extends Mapper<Teacher> {
}
------------------------------------------------------------------------------------
package com.czxy.dao;

import com.czxy.domain.T_Type;
import tk.mybatis.mapper.common.Mapper;
@org.apache.ibatis.annotations.Mapper
public interface T_typeMapper extends Mapper<T_Type> {
}

domain(JavaBean):

package com.czxy.domain;

import com.fasterxml.jackson.annotation.JsonFormat;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;

import javax.persistence.Id;
import javax.persistence.Table;
import java.util.Date;

@Table(name = "t_teacher")
@Data
@AllArgsConstructor
@NoArgsConstructor
public class Teacher {
    //   CREATE TABLE `t_teacher`  (
//            `id` int(11) NOT NULL AUTO_INCREMENT,
//  `teacher_name` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
//  `pwd` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
//  `sex` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
//  `salary` decimal(10, 2) NULL DEFAULT NULL,
//  `type_id` int(11) NULL DEFAULT NULL,
//  `school_id` int(11) NULL DEFAULT NULL,
//  `hire_date` date NULL DEFAULT NULL,
//  `remark` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
//    PRIMARY KEY (`id`) USING BTREE
//) ;
    @Id
    private Integer id;
    private String teacher_name;
    private String pwd;
    private String sex;
    private Double salary;
    private Integer type_id;
    private Integer school_id;
    @JsonFormat(pattern = "yyyy-MM-dd" ,timezone = "GMT+8")
    private Date hire_date;
    private String remark;
    private School school;
    private T_Type t_type;
}
==========================================================================
package com.czxy.domain;

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

import javax.persistence.Id;
import javax.persistence.Table;

@Table(name = "t_type")
@Data
@AllArgsConstructor
@NoArgsConstructor
public class T_Type {
    //    CREATE TABLE `t_type`  (
//            `id` int(11) NOT NULL AUTO_INCREMENT,
//  `city` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,
//    PRIMARY KEY (`id`) USING BTREE
//);
    @Id
    private Integer id;
    private String city;
}

teacherVo(条件查询):

package com.czxy.vo;

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

@Data
@AllArgsConstructor
@NoArgsConstructor
public class TeacherVo {
    private String t_Name;
    private String school;
    private String minSalary;
    private String maxSalary;
    private String startTime;
    private String endTime;
}

service:

package com.czxy.service;

import com.czxy.domain.Teacher;
import com.czxy.vo.TeacherVo;
import com.github.pagehelper.PageInfo;

public interface TeacherService {
    PageInfo<Teacher> condition(Integer pageSize, Integer pageNum, TeacherVo teacherVo);

    Teacher selectById(String id);

    Boolean edit(Teacher teacher);

    Boolean Delete(String id);

    Boolean add(Teacher teacher);
}


==============================================================================================


package com.czxy.service;

import com.czxy.domain.T_Type;

import java.util.List;

public interface T_typeService {
    List<T_Type> selectAll();
}

serviceImpl实现类

package com.czxy.service.impl;

import com.czxy.dao.SchoolMapper;
import com.czxy.dao.T_typeMapper;
import com.czxy.dao.TeacherMapper;
import com.czxy.domain.Teacher;
import com.czxy.service.TeacherService;
import com.czxy.vo.TeacherVo;
import com.github.pagehelper.PageHelper;
import com.github.pagehelper.PageInfo;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;
import tk.mybatis.mapper.entity.Example;

import java.util.List;

@Service
@Transactional
public class TeacherServiceImpl implements TeacherService {
    @Autowired
    private TeacherMapper teacherMapper;
    @Autowired
    private T_typeMapper t_typeMapper;
    @Autowired
    private SchoolMapper schoolMapper;

    @Override
    public PageInfo<Teacher> condition(Integer pageSize, Integer pageNum, TeacherVo teacherVo) {
        Example example = new Example(Teacher.class);
        Example.Criteria criteria = example.createCriteria();
        if (teacherVo.getT_Name() != null && !"".equals(teacherVo.getT_Name())) {
            criteria.andLike("teacher_name", "%"+teacherVo.getT_Name()+"%");
        }
        if (teacherVo.getSchool() != null && !"".equals(teacherVo.getSchool())) {
            criteria.andEqualTo("school_id", teacherVo.getSchool());
        }
        if (teacherVo.getMinSalary() != null && !"".equals(teacherVo.getMinSalary())) {
            criteria.andGreaterThanOrEqualTo("salary", teacherVo.getMinSalary());
        }
        if (teacherVo.getMaxSalary() != null && !"".equals(teacherVo.getMaxSalary())) {
            criteria.andLessThanOrEqualTo("salary", teacherVo.getMaxSalary());
        }
        if (teacherVo.getStartTime() != null && !"".equals(teacherVo.getStartTime())) {
            criteria.andGreaterThanOrEqualTo("hire_date", teacherVo.getStartTime());
        }
        if (teacherVo.getEndTime() != null && !"".equals(teacherVo.getEndTime())) {
            criteria.andLessThanOrEqualTo("hire_date", teacherVo.getEndTime());
        }
        PageHelper.startPage(pageNum, pageSize);
        List<Teacher> teachers = teacherMapper.selectByExample(example);
        for (Teacher teacher : teachers) {
            teacher.setSchool(schoolMapper.selectByPrimaryKey(teacher.getSchool_id()));
            teacher.setT_type(t_typeMapper.selectByPrimaryKey(teacher.getType_id()));
        }

        return new PageInfo<>(teachers);
    }

    @Override
    public Teacher selectById(String id) {
        return teacherMapper.selectByPrimaryKey(id);
    }

    @Override
    public Boolean edit(Teacher teacher) {
        return teacherMapper.updateByPrimaryKey(teacher)==1;
    }

    @Override
    public Boolean Delete(String id) {
        return teacherMapper.deleteByPrimaryKey(id)==1;
    }

    @Override
    public Boolean add(Teacher teacher) {
        return teacherMapper.insert(teacher)==1;
    }
}
======================================================================
package com.czxy.service.impl;

import com.czxy.dao.T_typeMapper;
import com.czxy.domain.T_Type;
import com.czxy.service.T_typeService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;

import java.util.List;

@Service
@Transactional
public class T_typeServiceImpl implements T_typeService {
    @Autowired
    private T_typeMapper t_typeMapper;

    @Override
    public List<T_Type> selectAll() {
        return t_typeMapper.selectAll();
    }
}

前端：

teacherList.vue

<template>
  <div>
    <!-- {{teacherList}} -->
    <!-- {{schoolList}} -->
    老师管理<br />
    <router-link to="/TeacherAdd">添加老师</router-link>
    <form action="">
      姓名：<input type="text" v-model="teacherVo.t_Name" /> 学校:<select
        v-model="teacherVo.school"
      >
        <option value="">请选择</option>
        <option
          v-for="(school, index) in schoolList"
          :key="index"
          :value="school.id"
        >
          {{ school.school_name }}
        </option></select
      ><br />
      薪资：<input type="text" v-model="teacherVo.minSalary" />-<input
        type="text"
        v-model="teacherVo.maxSalary"
      /><br />
      入职时间：<input type="text" v-model="teacherVo.startTime" />-<input
        type="text"
        v-model="teacherVo.endTime"
      />
      <br />
      <button @click.prevent="condition(1)">查询</button>
    </form>
    <table border="1">
      <tr>
        <th></th>
        <th>ID</th>
        <th>姓名</th>
        <th>密码</th>
        <th>性别</th>
        <th>工资</th>
        <th>学校</th>
        <th>入职时间</th>
        <th>类型</th>
        <th>备注</th>
        <th>操作</th>
      </tr>
      <tr v-for="(teacher, index) in teacherList" :key="index">
        <td><input type="checkbox" v-model="ids" :value="teacher.id" /></td>
        <td>{{ teacher.id }}</td>
        <td>{{ teacher.teacher_name }}</td>
        <td>{{ teacher.pwd }}</td>
        <td>{{ teacher.sex }}</td>
        <td>{{ teacher.salary }}</td>
        <td>{{ teacher.school.school_name }}</td>
        <td>{{ teacher.hire_date }}</td>
        <td>{{ teacher.t_type.city }}</td>
        <td>{{ teacher.remark }}</td>
        <td>
          <router-link :to="`/TeacherEdit/` + teacher.id">修改</router-link> |
          <a href="#" @click.prevent="DeleteTeacher(teacher.id)">删除</a>
        </td>
      </tr>
    </table>
    <button @click="deletes()">批量删除</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      ids: [],
      teacherList: [],
      teacher: {
        id: "",
        teacher_name: "",
        pwd: "",
        sex: "",
        salary: "",
        t_type: "",
        school: "",
        hire_date: "",
        type_id: "",
        school_id: "",
        remark: "",
      },
      pageInfo: {
        pageNum: 1,
        pageSize: 5,
      },
      teacherVo: {
        t_Name: "",
        school_id: "",
        minSalary: "",
        maxSalary: "",
        startTime: "",
        endTime: "",
      },
      schoolList: [],
      school: {
        id: "",
        school_name: "",
      },
      t_type: {
        id: "",
        city: "",
      },
    };
  },
  methods: {
    deletes() {
      if (confirm("是否删除")) {
        var delids = this.ids.join(",");
      this.$http.delete("/teacher/dels/"+delids)
      .then(res => {
          console.log(res)
          this.condition(1)
      })
      .catch(err => {
          console.error(err); 
      })
      }
    },
    selectAllSchool() {
      this.$http
        .get("/school")
        .then((res) => {
          this.schoolList = res.data.data;
          console.info(res);
        })
        .catch((err) => {
          console.error(err);
        });
    },
    condition(pageNum) {
      if (pageNum) {
        this.pageInfo.pageNum = pageNum;
      }
      //   alert(this.teacherVo.t_Name)
      this.$http
        .post(
          "/teacher/condition/" +
            this.pageInfo.pageNum +
            "/" +
            this.pageInfo.pageSize,
          this.teacherVo
        )
        .then((res) => {
          this.teacherList = res.data.data.list;
          console.info(res);
        })
        .catch((err) => {
          console.error(err);
        });
    },
    DeleteTeacher(id) {
      if (confirm("是否删除？")) {
        this.$http
          .delete("/teacher/del/" + id)
          .then((res) => {
            console.log(res);
            this.condition(1);
          })
          .catch((err) => {
            console.error(err);
          });
      }
    },
  },
  created() {
    this.condition(1);
    this.selectAllSchool();
  },
};
</script>

<style>
</style>

teacherEidt.vue:

<template>
  <div>
    老师名字:<input type="text" v-model="teacher.teacher_name"  /> <br />
    老师密码:<input type="text" v-model="teacher.pwd" /><br />
    性别<input type="radio" value="男" name="gender" v-model="teacher.sex" />男
    <input type="radio" value="女" name="gender" v-model="teacher.sex" />女<br/>
    类型：<select v-model="teacher.type_id">
      <option v-for="(type, index) in t_typeList" :key="index" :value="type.id">{{ type.city }}</option>
    </select><br />
    学校：<select v-model="teacher.school_id">
      <option v-for="(school, index) in schoolList" :key="index" :value="school.id">{{ school.school_name }}</option>
    </select><br />
    入职时间:<input type="text" v-model="teacher.hire_date" /><br />
    薪资:<input type="text" v-model="teacher.salary" /><br />
    备注:<input type="text" v-model="teacher.remark" /><br />
  <button @click.prevent="edit()">提交</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      t_typeList: [],
      t_type: {
        id: "",
        city: "",
      },
      schoolList: [],
      school: {
        id: "",
        school_name: "",
      },
      teacher: {
        id: "",
        teacher_name: "",
        pwd: "",
        sex: "",
        salary: "",
        t_type: "",
        school: "",
        hire_date: "",
        type_id: "",
        school_id: "",
        remark: "",
      },
    };
  },
  methods: {
    selectAllSchool() {
      this.$http
        .get("/school")
        .then((res) => {
          this.schoolList = res.data.data;
          console.info(res);
        })
        .catch((err) => {
          console.error(err);
        });
    }, selectAllType() {
      this.$http
        .get("/t_type")
        .then((res) => {
          this.t_typeList = res.data.data;
          console.info(res);
        })
        .catch((err) => {
          console.error(err);
        });
    },
    selectById(id) {
      //   alert(id);
      this.$http
        .get("/teacher/selectById/" + id)
        .then((res) => {
          console.log(res);
          this.teacher = res.data.data;
        })
        .catch((err) => {
          console.error(err);
        });
    },
    edit() {
      this.$http
        .put("/teacher",this.teacher)
        .then((res) => {
          console.log(res);
          this.$router.push("/teacher");
        })
        .catch((err) => {
          console.error(err);
        });
    },
  },
  created() {
    var id = this.$route.params.id;
    this.selectById(id);
    this.selectAllType();
    this.selectAllSchool();
  },
};
</script>

<style>
</style>

teacherAdd.vue:

<template>
  <div>
    老师名字:<input type="text" v-model="teacher.teacher_name"  /> <br />
    老师密码:<input type="text" v-model="teacher.pwd" /><br />
    性别<input type="radio" value="男" name="gender" v-model="teacher.sex" />男
    <input type="radio" value="女" name="gender" v-model="teacher.sex" />女<br/>
    类型：<select v-model="teacher.type_id">
      <option v-for="(type, index) in t_typeList" :key="index" :value="type.id">{{type.city}}</option>
    </select><br />
    学校：<select v-model="teacher.school_id">
      <option v-for="(school, index) in schoolList" :key="index" :value="school.id">{{school.school_name}}</option>
    </select><br />
    入职时间:<input type="text" v-model="teacher.hire_date" /><br />
    薪资:<input type="text" v-model="teacher.salary" /><br />
    备注:<input type="text" v-model="teacher.remark" /><br />
  <button @click.prevent="add()">提交</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      t_typeList: [],
      t_type: {
        id: "",
        city: "",
      },
      schoolList: [],
      school: {
        id: "",
        school_name: "",
      },
      teacher: {
        id: "",
        teacher_name: "",
        pwd: "",
        sex: "",
        salary: "",
        // t_type: "",
        // school: "",
        hire_date: "",
        type_id: "",
        school_id: "",
        remark: "",
      },
    };
  },
  methods: {
    selectAllSchool() {
      this.$http
        .get("/school")
        .then((res) => {
          this.schoolList = res.data.data;
          console.info(res);
        })
        .catch((err) => {
          console.error(err);
        });
    }, selectAllType() {
      this.$http
        .get("/t_type")
        .then((res) => {
          this.t_typeList = res.data.data;
          console.info(res);
        })
        .catch((err) => {
          console.error(err);
        });
    },
    add() {
      this.$http
        .post("/teacher", this.teacher)
        .then((res) => {
          console.log(res);
          this.$router.push("/teacher");
        })
        .catch((err) => {
          console.error(err);
        });
    },
  },
   created() {
    this.selectAllType();
    this.selectAllSchool();
  },
 
};
</script>

<style>
</style>

到这里就已经结束了，希望对大家有帮助

世昌愿世昌盛

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Spring+RestFul+Vue多表（学校，老师，类型）

数据库SQL（有三个表：校区表，老师表，类型表）： CREATE TABLE `t_school` (`id` int(11) NOT NULL AUTO_INCREMENT,`school_name` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL,PRIMARY KEY (`id`) USING.
复制链接

扫一扫