开发课程分页查询接口,课程前后段数据对接,课程新增和编辑功能,课程删除功能 #4
Merged
p89sifnku
merged 4 commits from dev1 into master 2 years ago
@ -0,0 +1,52 @@
|
||||
package com.example.controller;
|
||||
|
||||
import com.example.common.Result;
|
||||
import com.example.entity.Course;
|
||||
import com.example.service.CourseService;
|
||||
import com.github.pagehelper.PageInfo;
|
||||
import org.springframework.web.bind.annotation.*;
|
||||
|
||||
import javax.annotation.Resource;
|
||||
|
||||
@RestController
|
||||
@RequestMapping("/course")
|
||||
public class CourseController {
|
||||
|
||||
@Resource
|
||||
private CourseService courseService;
|
||||
/**
|
||||
* 分页条件查询课程
|
||||
*/
|
||||
@GetMapping("/selectPage")
|
||||
public Result selectPage(@RequestParam(defaultValue = "1") Integer pageNum,
|
||||
@RequestParam(defaultValue = "5") Integer pageSize,
|
||||
Course course){
|
||||
PageInfo<Course> pageInfo = courseService.selectPage(pageNum, pageSize,course);
|
||||
return Result.success(pageInfo);
|
||||
}
|
||||
/**
|
||||
* 新增课程
|
||||
*/
|
||||
@PostMapping("/add")
|
||||
public Result add(@RequestBody Course course){
|
||||
courseService.add(course);
|
||||
return Result.success();
|
||||
}
|
||||
/**
|
||||
* 更新课程
|
||||
*/
|
||||
@PutMapping("/update")
|
||||
public Result update(@RequestBody Course course){
|
||||
courseService.updateById(course);
|
||||
return Result.success();
|
||||
}
|
||||
|
||||
/**
|
||||
* 删除课程
|
||||
*/
|
||||
@DeleteMapping("/delete/{id}")
|
||||
public Result delete(@PathVariable Integer id){
|
||||
courseService.deleteById(id);
|
||||
return Result.success();
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,58 @@
|
||||
package com.example.entity;
|
||||
|
||||
public class Course {
|
||||
private Integer id;
|
||||
private String name;
|
||||
private String no;
|
||||
private String descr;
|
||||
private String times;
|
||||
private String teacher;
|
||||
|
||||
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 getNo() {
|
||||
return no;
|
||||
}
|
||||
|
||||
public void setNo(String no) {
|
||||
this.no = no;
|
||||
}
|
||||
|
||||
public String getDescr() {
|
||||
return descr;
|
||||
}
|
||||
|
||||
public void setDescr(String descr) {
|
||||
this.descr = descr;
|
||||
}
|
||||
|
||||
public String getTimes() {
|
||||
return times;
|
||||
}
|
||||
|
||||
public void setTimes(String times) {
|
||||
this.times = times;
|
||||
}
|
||||
|
||||
public String getTeacher() {
|
||||
return teacher;
|
||||
}
|
||||
|
||||
public void setTeacher(String teacher) {
|
||||
this.teacher = teacher;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,21 @@
|
||||
package com.example.mapper;
|
||||
|
||||
import com.example.entity.Course;
|
||||
import org.apache.ibatis.annotations.Delete;
|
||||
import org.apache.ibatis.annotations.Insert;
|
||||
import org.apache.ibatis.annotations.Select;
|
||||
import org.apache.ibatis.annotations.Update;
|
||||
|
||||
import java.util.List;
|
||||
|
||||
public interface CourseMapper {
|
||||
@Select("select * from course where name like concat('%',#{name},'%') and no like concat('%',#{no},'%') and teacher like concat('%',#{teacher},'%') order by id desc")
|
||||
List<Course> selectAll(Course course);
|
||||
@Insert("insert into course (name, no, descr, times, teacher) values(#{name},#{no},#{descr},#{times},#{teacher})")
|
||||
void insert(Course course);
|
||||
@Update("update course set name=#{name},no=#{no},descr=#{descr},times=#{times},teacher=#{teacher} where id=#{id}")
|
||||
void updateById(Course course);
|
||||
|
||||
@Delete("delete from course where id=#{id}")
|
||||
void deleteById(Integer id);
|
||||
}
|
||||
@ -0,0 +1,36 @@
|
||||
package com.example.service;
|
||||
|
||||
import com.example.entity.Course;
|
||||
import com.example.mapper.CourseMapper;
|
||||
import com.github.pagehelper.PageHelper;
|
||||
import com.github.pagehelper.PageInfo;
|
||||
import org.springframework.stereotype.Service;
|
||||
|
||||
import javax.annotation.Resource;
|
||||
import java.util.List;
|
||||
|
||||
@Service
|
||||
public class CourseService {
|
||||
@Resource
|
||||
private CourseMapper courseMapper;
|
||||
|
||||
|
||||
//total是查询总数 list是数据列表
|
||||
public PageInfo<Course> selectPage(Integer pageNum, Integer pageSize,Course course){
|
||||
PageHelper.startPage(pageNum,pageSize);
|
||||
List<Course> coursesList = courseMapper.selectAll(course);
|
||||
return PageInfo.of(coursesList);
|
||||
}
|
||||
//新增数据
|
||||
public void add(Course course) {
|
||||
courseMapper.insert(course);
|
||||
}
|
||||
|
||||
public void updateById(Course course) {
|
||||
courseMapper.updateById(course);
|
||||
}
|
||||
|
||||
public void deleteById(Integer id) {
|
||||
courseMapper.deleteById(id);
|
||||
}
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -0,0 +1,3 @@
|
||||
// node_modules/element-plus/es/components/tag/style/index.mjs
|
||||
import "C:/system of information/git/vue/node_modules/element-plus/theme-chalk/src/tag.scss";
|
||||
//# sourceMappingURL=chunk-3TXWDNGO.js.map
|
||||
@ -0,0 +1,7 @@
|
||||
{
|
||||
"version": 3,
|
||||
"sources": ["../../element-plus/es/components/tag/style/index.mjs"],
|
||||
"sourcesContent": ["import '../../base/style/index.mjs';\r\nimport 'element-plus/theme-chalk/src/tag.scss';\r\n//# sourceMappingURL=index.mjs.map\r\n"],
|
||||
"mappings": ";AACA,OAAO;",
|
||||
"names": []
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
// node_modules/element-plus/es/components/popper/style/index.mjs
|
||||
import "C:/system of information/git/vue/node_modules/element-plus/theme-chalk/src/popper.scss";
|
||||
//# sourceMappingURL=chunk-6XXACKVZ.js.map
|
||||
@ -0,0 +1,7 @@
|
||||
{
|
||||
"version": 3,
|
||||
"sources": ["../../element-plus/es/components/popper/style/index.mjs"],
|
||||
"sourcesContent": ["import '../../base/style/index.mjs';\r\nimport 'element-plus/theme-chalk/src/popper.scss';\r\n//# sourceMappingURL=index.mjs.map\r\n"],
|
||||
"mappings": ";AACA,OAAO;",
|
||||
"names": []
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
// node_modules/element-plus/es/components/button/style/index.mjs
|
||||
import "C:/system of information/git/vue/node_modules/element-plus/theme-chalk/src/button.scss";
|
||||
//# sourceMappingURL=chunk-BJFB2CUW.js.map
|
||||
@ -0,0 +1,7 @@
|
||||
{
|
||||
"version": 3,
|
||||
"sources": ["../../element-plus/es/components/button/style/index.mjs"],
|
||||
"sourcesContent": ["import '../../base/style/index.mjs';\r\nimport 'element-plus/theme-chalk/src/button.scss';\r\n//# sourceMappingURL=index.mjs.map\r\n"],
|
||||
"mappings": ";AACA,OAAO;",
|
||||
"names": []
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
// node_modules/element-plus/es/components/checkbox/style/index.mjs
|
||||
import "C:/system of information/git/vue/node_modules/element-plus/theme-chalk/src/checkbox.scss";
|
||||
//# sourceMappingURL=chunk-D3CWYFF3.js.map
|
||||
@ -0,0 +1,7 @@
|
||||
{
|
||||
"version": 3,
|
||||
"sources": ["../../element-plus/es/components/checkbox/style/index.mjs"],
|
||||
"sourcesContent": ["import '../../base/style/index.mjs';\r\nimport 'element-plus/theme-chalk/src/checkbox.scss';\r\n//# sourceMappingURL=index.mjs.map\r\n"],
|
||||
"mappings": ";AACA,OAAO;",
|
||||
"names": []
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
// node_modules/element-plus/es/components/tooltip/style/index.mjs
|
||||
import "C:/system of information/git/vue/node_modules/element-plus/theme-chalk/src/tooltip.scss";
|
||||
//# sourceMappingURL=chunk-FJTOK54K.js.map
|
||||
@ -0,0 +1,7 @@
|
||||
{
|
||||
"version": 3,
|
||||
"sources": ["../../element-plus/es/components/tooltip/style/index.mjs"],
|
||||
"sourcesContent": ["import '../../base/style/index.mjs';\r\nimport 'element-plus/theme-chalk/src/tooltip.scss';\r\nimport '../../popper/style/index.mjs';\r\n//# sourceMappingURL=index.mjs.map\r\n"],
|
||||
"mappings": ";AACA,OAAO;",
|
||||
"names": []
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
// node_modules/element-plus/es/components/input/style/index.mjs
|
||||
import "C:/system of information/git/vue/node_modules/element-plus/theme-chalk/src/input.scss";
|
||||
//# sourceMappingURL=chunk-INT4LFCS.js.map
|
||||
@ -0,0 +1,7 @@
|
||||
{
|
||||
"version": 3,
|
||||
"sources": ["../../element-plus/es/components/input/style/index.mjs"],
|
||||
"sourcesContent": ["import '../../base/style/index.mjs';\r\nimport 'element-plus/theme-chalk/src/input.scss';\r\n//# sourceMappingURL=index.mjs.map\r\n"],
|
||||
"mappings": ";AACA,OAAO;",
|
||||
"names": []
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
// node_modules/element-plus/es/components/overlay/style/index.mjs
|
||||
import "C:/system of information/git/vue/node_modules/element-plus/theme-chalk/src/overlay.scss";
|
||||
//# sourceMappingURL=chunk-KR333NDQ.js.map
|
||||
@ -0,0 +1,7 @@
|
||||
{
|
||||
"version": 3,
|
||||
"sources": ["../../element-plus/es/components/overlay/style/index.mjs"],
|
||||
"sourcesContent": ["import '../../base/style/index.mjs';\r\nimport 'element-plus/theme-chalk/src/overlay.scss';\r\n//# sourceMappingURL=index.mjs.map\r\n"],
|
||||
"mappings": ";AACA,OAAO;",
|
||||
"names": []
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
// node_modules/element-plus/es/components/scrollbar/style/index.mjs
|
||||
import "C:/system of information/git/vue/node_modules/element-plus/theme-chalk/src/scrollbar.scss";
|
||||
//# sourceMappingURL=chunk-RSYYQNY4.js.map
|
||||
@ -0,0 +1,7 @@
|
||||
{
|
||||
"version": 3,
|
||||
"sources": ["../../element-plus/es/components/scrollbar/style/index.mjs"],
|
||||
"sourcesContent": ["import '../../base/style/index.mjs';\r\nimport 'element-plus/theme-chalk/src/scrollbar.scss';\r\n//# sourceMappingURL=index.mjs.map\r\n"],
|
||||
"mappings": ";AACA,OAAO;",
|
||||
"names": []
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
// node_modules/element-plus/es/components/base/style/index.mjs
|
||||
import "C:/system of information/git/vue/node_modules/element-plus/theme-chalk/src/base.scss";
|
||||
//# sourceMappingURL=chunk-SHI5Q57K.js.map
|
||||
@ -0,0 +1,7 @@
|
||||
{
|
||||
"version": 3,
|
||||
"sources": ["../../element-plus/es/components/base/style/index.mjs"],
|
||||
"sourcesContent": ["import 'element-plus/theme-chalk/src/base.scss';\r\n//# sourceMappingURL=index.mjs.map\r\n"],
|
||||
"mappings": ";AAAA,OAAO;",
|
||||
"names": []
|
||||
}
|
||||
@ -1,40 +1,148 @@
|
||||
<template>
|
||||
<div class="card" style="margin-bottom: 10px">
|
||||
<el-input v-model="data.name" style="width: 240px" placeholder="请输入课程名称查询" :prefix-icon="Search"/>
|
||||
<el-button type="primary" style="margin-left: 10px">查 询</el-button>
|
||||
<el-button type="info" >重 置</el-button>
|
||||
<el-input v-model="data.name" style="width: 240px;margin-right:10px" placeholder="请输入课程名称查询" :prefix-icon="Search"/>
|
||||
<el-input v-model="data.no" style="width: 240px;margin-right: 10px" placeholder="请输入课程编号查询" :prefix-icon="Search"/>
|
||||
<el-input v-model="data.teacher" style="width: 240px" placeholder="请输入任课老师查询" :prefix-icon="Search"/>
|
||||
<el-button type="primary" style="margin-left: 10px" @click="load">查 询</el-button>
|
||||
<el-button type="info" @click="reset">重 置</el-button>
|
||||
</div>
|
||||
<div class="card" style="margin-bottom: 10px">
|
||||
<div style="margin-bottom: 10px">
|
||||
<el-button type="primary" >新 增</el-button>
|
||||
<el-button type="primary" @click="handleAdd">新 增</el-button>
|
||||
</div>
|
||||
<div>
|
||||
<el-table :data="data.tableData" style="width: 100%">
|
||||
<el-table-column prop="id" label="序号" width="180" />
|
||||
<el-table-column prop="name" label="课程名称" width="180" />
|
||||
<el-table-column prop="no" label="课程编号" width="180" />
|
||||
<el-table-column prop="id" label="序号" width="70" />
|
||||
<el-table-column prop="name" label="课程名称" />
|
||||
<el-table-column prop="no" label="课程编号" />
|
||||
<el-table-column prop="descr" label="课程描述" />
|
||||
<el-table-column prop="times" label="课时" />
|
||||
<el-table-column prop="teacher" label="任课老师" />
|
||||
<el-table-column>
|
||||
<template #default="scope">
|
||||
<el-button type="primary" size="small" plain>编 辑</el-button>
|
||||
<el-button type="danger" size="small" plain>删 除</el-button>
|
||||
<el-button type="primary" size="small" plain @click="handleEdit(scope.row)">编 辑</el-button>
|
||||
<el-button type="danger" size="small" plain @click="del(scope.row.id)">删 除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="card">
|
||||
<el-pagination background layout="prev, pager, next" :total="1000" />
|
||||
<el-pagination v-model:current-page="data.pageNum" v-model:page-size="data.pageSize"
|
||||
@current-change = "handleCurrentChange"
|
||||
background layout="prev, pager, next" :total="data.total" />
|
||||
</div>
|
||||
|
||||
<el-dialog width="35%" v-model="data.formVisible" title="课程信息" >
|
||||
<el-form :model="data.form" label-width="100px" label-position="right" style="padding-right:40px">
|
||||
<el-form-item label="课程名称" >
|
||||
<el-input v-model="data.form.name" autocomplete="off" />
|
||||
</el-form-item>
|
||||
<el-form-item label="课程编号" >
|
||||
<el-input v-model="data.form.no" autocomplete="off" />
|
||||
</el-form-item>
|
||||
<el-form-item label="课程描述" >
|
||||
<el-input v-model="data.form.descr" autocomplete="off" />
|
||||
</el-form-item>
|
||||
<el-form-item label="课时" >
|
||||
<el-input v-model="data.form.times" autocomplete="off" />
|
||||
</el-form-item>
|
||||
<el-form-item label="任课老师" >
|
||||
<el-input v-model="data.form.teacher" autocomplete="off" />
|
||||
</el-form-item>
|
||||
</el-form>/
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="data.formVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="save">保 存</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import {reactive} from "vue";
|
||||
import {Search} from "@element-plus/icons-vue";
|
||||
import request from "@/utils/request";
|
||||
import {ElMessage, ElMessageBox} from "element-plus";
|
||||
|
||||
const data = reactive({
|
||||
name:'',
|
||||
tableData:[]
|
||||
no:'',
|
||||
teacher:'',
|
||||
tableData:[],
|
||||
total:0,
|
||||
pageSize:2,//每页的个数
|
||||
pageNum: 1, //当前的页码
|
||||
formVisible:false,
|
||||
form:{}
|
||||
})
|
||||
const load =()=>{
|
||||
request.get('course/selectPage',{
|
||||
params:{
|
||||
pageNum:data.pageNum,
|
||||
pageSize:data.pageSize,
|
||||
name:data.name,
|
||||
no:data.no,
|
||||
teacher:data.teacher
|
||||
}
|
||||
}).then((res)=>{
|
||||
data.tableData =res.data?.list || []
|
||||
data.total=res.data?.total || 0
|
||||
})
|
||||
}
|
||||
//调用方法获取数据
|
||||
load()
|
||||
|
||||
|
||||
const handleCurrentChange = (pageNum)=>{
|
||||
//翻页的时候重新加载数据即可
|
||||
load()
|
||||
}
|
||||
const reset =()=>{
|
||||
data.name = ''
|
||||
data.no = ''
|
||||
data.teacher = ''
|
||||
load()
|
||||
}
|
||||
|
||||
const handleAdd = () => {
|
||||
data.form = {}
|
||||
data.formVisible = true
|
||||
}
|
||||
|
||||
|
||||
//保存数据到后台
|
||||
const save=()=>{
|
||||
request.request({
|
||||
url:data.form.id?'/course/update':'/course/add',
|
||||
method:data.form.id?'PUT':'POST',
|
||||
data:data.form
|
||||
}).then(res => {
|
||||
if(res.code === '200'){
|
||||
load()//重新获取数据
|
||||
data.formVisible=false;
|
||||
ElMessage.success("操作成功")
|
||||
}else{
|
||||
ElMessage.error(res.msg)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const handleEdit=(row)=>{
|
||||
data.form=JSON.parse(JSON.stringify(row))
|
||||
data.formVisible=true
|
||||
}
|
||||
|
||||
const del = (id)=>{
|
||||
ElMessageBox.confirm('删除数据数据后无法恢复','确认删除吗',{type:'warning'}).then(() => {
|
||||
request.delete('course/delete/' + id).then((res)=>{
|
||||
if(res.code === '200'){
|
||||
load()//重新获取数据
|
||||
ElMessage.success("操作成功")
|
||||
}else{
|
||||
ElMessage.error(res.msg)
|
||||
}
|
||||
})
|
||||
}).catch(res=>{})
|
||||
}
|
||||
</script>
|
||||
Loading…
Reference in new issue