java springboot VUE 在线学习平台系统开发mysql数据库web结构java编程计算机网页源码maven项目前后端分离
一、源码特点
springboot VUE 在线学习平台系统是一套完善的完整信息管理类型系统 前后端分离,结合springboot框架和VUE完成本系统,对理解JSP java编程开发语言有帮助系统采用springboot框架
(MVC模式开发),系统具有完整的源代码和数据库,系统主要采用B/S模式开发。
java springboot VUE 在线学习平台系统开
前段主要技术 vue
后端主要技术 Springboot java
数据库 mysql
开发工具 IDEA JDK1.8
环境需要
1.运行环境:最好是java jdk 1.8,我们在这个平台上运行的。其他版本理论上也可以 不建议。
2.IDE环境:推荐IDEA;
3.tomcat环境:Tomcat 7.x,8.x,9.x版本均可,但本系统不需要
4.硬件环境:windows 7/8/10 1G内存以上;;
5.数据库:MySql 5.7、8.0等版本均可;
6.是否Maven项目: 否;查看源码目录中是否包含pom.xml;若包含,则为maven项目,否则为非maven项目
使用说明
1. 使用Navicat或者其它工具,在mysql中创建对应sql文件名称的数据库,并导入项目的sql文件;
2. 使用IDEA导入项目;
3. 将项目中xuexi\src\main\resources 下的 application.properties 配置文件中的数据库配置改为自己的配置;
数据库支持 mysql5.0 到5.6 ,如果需要5.7 到8.0 需要二次转换升级
4.vscode 开vue项目工程
5.vue 项目启动 npm run serve
vue 版本 2.9.6
node 版本 16.14.2
二、功能介绍
前台主要功能:
课程浏览、课程视频浏览
公告浏览
问题提出、查看
课程提交、查看
后台主要功能:
(1)管理员管理:对管理员信息进行添加、删除、修改和查看
(2)教师管理:对教师信息进行添加、删除、修改和查看
(3)学生管理:对学生信息进行添加、删除、修改和查看
(4)课程管理:对课程信息进行添加、删除、修改和查看
(5)课程视频管理:对课程视频信息进行添加、删除、修改和查看
(6)订单管理:对订单信息进行添加、删除、修改和查看
(7)评价管理:对评价信息进行添加、删除、修改和查看
(8)订单视频管理:对订单视频信息进行添加、删除、修改和查看
(9)问题管理:对问题信息进行添加、删除、修改和查看
(10)公告管理:对公告信息进行添加、删除、修改和查看
数据库设计
CREATE TABLE `gly` (
`glyid` int(11) NOT NULL auto_increment,
`yhm` VARCHAR(40) default NULL COMMENT '用户名',
`mm` VARCHAR(40) default NULL COMMENT '密码',
`xm` VARCHAR(40) default NULL COMMENT '姓名', PRIMARY KEY (`glyid`)
) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
CREATE TABLE `jiaoshi` (
`jsid` int(11) NOT NULL auto_increment,
`yhm` VARCHAR(40) default NULL COMMENT '用户名',
`mm` VARCHAR(40) default NULL COMMENT '密码',
`xm` VARCHAR(40) default NULL COMMENT '姓名',
`lxdh` VARCHAR(40) default NULL COMMENT '联系电话',
`lxdz` VARCHAR(40) default NULL COMMENT '联系地址',
`zy` VARCHAR(40) default NULL COMMENT '专业',
`byxx` VARCHAR(40) default NULL COMMENT '毕业学校',
`tx` VARCHAR(40) default NULL COMMENT '头像', PRIMARY KEY (`jsid`)
) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
CREATE TABLE `xuesheng` (
`xsid` int(11) NOT NULL auto_increment,
`yhm` VARCHAR(40) default NULL COMMENT '用户名',
`mm` VARCHAR(40) default NULL COMMENT '密码',
`nc` VARCHAR(40) default NULL COMMENT '昵称',
`lxdh` VARCHAR(40) default NULL COMMENT '联系电话',
`lxdz` VARCHAR(40) default NULL COMMENT '联系地址', PRIMARY KEY (`xsid`)
) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
CREATE TABLE `kecheng` (
`kcid` int(11) NOT NULL auto_increment,
`lsh` VARCHAR(40) default NULL COMMENT '流水号',
`kcmc` VARCHAR(40) default NULL COMMENT '课程名称',
`sm` VARCHAR(4000) default NULL COMMENT '说明',
`tp` VARCHAR(40) default NULL COMMENT '图片',
`tj` VARCHAR(40) default NULL COMMENT '推荐',
`jg` VARCHAR(40) default NULL COMMENT '价格',
`js` VARCHAR(40) default NULL COMMENT '教师',
`zt` VARCHAR(40) default NULL COMMENT '状态',
`fbsj` VARCHAR(40) default NULL COMMENT '发布时间', PRIMARY KEY (`kcid`)
) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
CREATE TABLE `kcsp` (
`kcspid` int(11) NOT NULL auto_increment,
`kc` VARCHAR(40) default NULL COMMENT '课程',
`spmc` VARCHAR(40) default NULL COMMENT '视频名称',
`spwj` VARCHAR(40) default NULL COMMENT '视频文件',
`sm` VARCHAR(40) default NULL COMMENT '说明',
`scsj` VARCHAR(40) default NULL COMMENT '上传时间', PRIMARY KEY (`kcspid`)
) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
CREATE TABLE `dingdan` (
`ddid` int(11) NOT NULL auto_increment,
`ddh` VARCHAR(40) default NULL COMMENT '订单号',
`kc` VARCHAR(40) default NULL COMMENT '课程',
`jg` VARCHAR(40) default NULL COMMENT '价格',
`yh` VARCHAR(40) default NULL COMMENT '用户',
`tjsj` VARCHAR(40) default NULL COMMENT '提交时间',
`zt` VARCHAR(40) default NULL COMMENT '状态',
`zs` VARCHAR(40) default NULL COMMENT '证书',
`zszt` VARCHAR(40) default NULL COMMENT '证书状态', PRIMARY KEY (`ddid`)
) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
CREATE TABLE `pingjia` (
`pjid` int(11) NOT NULL auto_increment,
`dd` VARCHAR(40) default NULL COMMENT '订单',
`kc` VARCHAR(40) default NULL COMMENT '课程',
`pj` VARCHAR(40) default NULL COMMENT '评价',
`yh` VARCHAR(40) default NULL COMMENT '用户',
`pjsj` VARCHAR(40) default NULL COMMENT '评价时间', PRIMARY KEY (`pjid`)
) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
CREATE TABLE `ddsp` (
`ddspid` int(11) NOT NULL auto_increment,
`dd` VARCHAR(40) default NULL COMMENT '订单',
`sp` VARCHAR(40) default NULL COMMENT '视频',
`wc` VARCHAR(40) default NULL COMMENT '完成', PRIMARY KEY (`ddspid`)
) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
CREATE TABLE `wenti` (
`wtid` int(11) NOT NULL auto_increment,
`bt` VARCHAR(40) default NULL COMMENT '标题',
`nr` VARCHAR(40) default NULL COMMENT '内容',
`yh` VARCHAR(40) default NULL COMMENT '用户',
`js` VARCHAR(40) default NULL COMMENT '教师',
`zt` VARCHAR(40) default NULL COMMENT '状态',
`hf` VARCHAR(40) default NULL COMMENT '回复',
`tjsj` VARCHAR(40) default NULL COMMENT '提交时间', PRIMARY KEY (`wtid`)
) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
CREATE TABLE `gonggao` (
`ggid` int(11) NOT NULL auto_increment,
`bt` VARCHAR(40) default NULL COMMENT '标题',
`nr` VARCHAR(40) default NULL COMMENT '内容',
`fbsj` VARCHAR(40) default NULL COMMENT '发布时间', PRIMARY KEY (`ggid`)
) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
java代码设计
/**公告列表 查询gonggao**/@GetMapping("list")public Result list(@RequestParam(value = "pageNum",defaultValue = "1") int page,@RequestParam(value = "pageSize",defaultValue = "10") int szie,@RequestParam(defaultValue = "") String bt) {Result res=new Result();List list=null;String sql="";try{if(bt!=null&&!bt.equals("")){sql+=" and bt like '%"+bt+"%'";//符合条件 拼接sql 标题}list=gonggaodao.querylist(sql,page,szie);//查询gonggao表数据返回 list对象res.setCode(200);res.setMessage("查询成功");res.setData(tl.ltoj(list));list=gonggaodao.querylist(sql);res.setNum(list.size());}catch(Exception e){e.printStackTrace();;}return res;}/**公告列表 查询gonggao* */@GetMapping("listpage")public Result listpage(@RequestParam(defaultValue = "") String bt) {Result res=new Result();List list=null;String sql="";if(bt!=null&&!bt.equals("")){sql+=" and bt like '%"+bt+"%'";//符合条件 拼接sql 标题}try{list=gonggaodao.querylist(sql);//查询gly 表数据返回 list对象res.setCode(200);res.setMessage("查询成功");res.setData(tl.ltoj(list));}catch(Exception e){e.printStackTrace();;}return res;}/**公告添加方法 对表 gonggao 进行添加* */@PostMapping(value = "add")public Result add(@RequestBody gonggao bean){Result res=new Result();try{if(bean.getGgid()!=null&&!bean.getGgid().equals("")){gonggaodao.update(bean);//执行 修改 gonggao 添加操作res.setMessage("操作成功");}else{gonggaodao.add(bean);//执行 添加gonggao 添加操作res.setMessage("添加成功");}}catch(Exception e){e.printStackTrace();;}res.setCode(200);//System.out.println(res);return res;}
vue 代码设计
<el-table :data="tableData" border stripe :header-cell-class-name="'headerBg'" @selection-change="handleSelectionChange"><el-table-column label="序号" width="80"type="index":index="indexMethod"></el-table-column><el-table-column prop="bt" label="标题" width="120"></el-table-column><el-table-column prop="nr" label="内容" width="220"></el-table-column><el-table-column prop="fbsj" label="发布时间" width="140"></el-table-column><el-table-column label="操作" width="280" align="center"><template slot-scope="scope"><el-button type="info" @click="handleDetail(scope.row)">详情 <i class="el-icon-reading"></i></el-button><el-button type="success" @click="handleEdit(scope.row)">编辑 <i class="el-icon-edit"></i></el-button><el-popconfirmclass="ml-5"confirm-button-text='确定'cancel-button-text='我再想想'icon="el-icon-info"icon-color="red"title="您确定删除吗?"@confirm="del(scope.row.ggid)"><el-button type="danger" slot="reference">删除 <i class="el-icon-remove-outline"></i></el-button></el-popconfirm></template></el-table-column></el-table><div style="padding: 10px 0"><el-pagination@size-change="handleSizeChange"@current-change="handleCurrentChange":current-page="pageNum":page-sizes="[2, 5, 10, 20]":page-size="pageSize"layout="total, sizes, prev, pager, next, jumper":total="total"></el-pagination></div><el-dialog title="公告信息" :visible.sync="dialogFormVisible" width="30%" ><el-form :model="form" :rules="rules" ref="beanForm" label-width="80px" size="small" ><el-form-item label="标题" prop="bt" ><el-input v-model="form.bt" ></el-input></el-form-item><el-form-item label="内容" prop="nr" ><el-input v-model="form.nr" rows="5" type="textarea" ></el-input></el-form-item><el-form-item label="发布时间" prop="fbsj" ><el-input v-model="form.fbsj" ></el-input></el-form-item></el-form><div slot="footer" class="dialog-footer"><el-button @click="dialogFormVisible = false">取 消</el-button><el-button type="primary" @click="save">确 定</el-button></div></el-dialog><el-dialog title="查看公告信息" :visible.sync="dialogDetailVisible" width="30%" ><el-form :model="form" :rules="rules" ref="beanForm" label-width="80px" size="small" ><el-form-item label="标题" prop="bt" required>{{form.bt}}</el-form-item><el-form-item label="内容" prop="nr" required>{{form.nr}}</el-form-item><el-form-item label="发布时间" prop="fbsj" required>{{form.fbsj}}</el-form-item></el-form><div slot="footer" class="dialog-footer"><el-button @click="dialogDetailVisible = false">关闭</el-button></div></el-dialog>
三、注意事项
1、管理员账号:admin密码:admin 数据库配置文件DBO.java
2、开发环境为IDEA开发 vscode开发vue,数据库为mysql,使用java语言开发后端 vue 开发前端。
3、数据库文件名是jspxuexi.sql 系统名称xuexi
4、地址:http://128.0.0.1:8080/login
四 系统实现
java springboot VUE 在线学习平台系统开发mysql数据库web结构java编程计算机网页源码maven项目前后端分离相关推荐
- asp.net摄影网站系统VS开发sqlserver数据库web结构c#编程计算机网页源码项目
一.源码特点 ASP.NET C# 摄影网站系统 是一套完善的web设计管理系统,系统具有完整的源代码和数据库,系统主要采用B/S模式开发.开发环境为vs2010,数据库为sqlser ...
- asp.net网上商城系统VS开发sqlserver数据库web结构c#编程计算机网页源码项目
一.源码特点 asp.net 网上商城系统是一套完善的web设计管理系统,系统具有完整的源代码和数据库,系统主要采用B/S模式开发,开发环境为vs2010,数据库为sqlserver2 ...
- asp.net课程网站系统VS开发sqlserver数据库web结构c#编程计算机网页源码项目
一.源码特点 asp.net 课程网站系统 是一套完善的web设计管理系统,系统具有完整的源代码和数据库,系统主要采用B/S模式开发,开发环境为vs2010,数据库为sqlserver ...
- 计算机毕业设计asp.net考勤管理系统VS开发sqlserver数据库web结构c#编程计算机网页源码项目
一.源码特点 ASP.NET C# 考勤管理系统 是一套完善的web设计管理系统,系统具有完整的源代码和数据库,系统主要采用B/S模式开发,开发环境为vs2010,数据库为sqlser ...
- asp.net医院信息管理系统VS开发sqlserver数据库web结构c#编程计算机网页源码项目
一.源码特点 asp.net 医院信息管理系统是一套完善的web设计管理系统,系统具有完整的源代码和数据库,系统主要采用B/S模式开发,开发环境为vs2010,数据库为sqlserve ...
- 计算机毕业设计asp.net电脑彩票销售管理系统VS开发sqlserver数据库web结构c#编程计算机网页源码项目
一.源码特点 asp.net 电脑彩票销售管理系统 是一套完善的web设计管理系统,系统具有完整的源代码和数据库,系统主要采用B/S模式开发,开发环境为vs2010,数据库为sqlse ...
- asp.net练车管理系统VS开发sqlserver数据库web结构c#编程计算机网页源码项目
一.源码特点 ASP.NET C# 练车管理系统 是一套完善的web设计管理系统,系统具有完整的源代码和数据库,系统主要采用B/S模式开发,开发环境为vs2010,数据库为sqlser ...
- asp.netNBA信息管理系统VS开发sqlserver数据库web结构c#编程计算机网页源码项目详细设计
一.源码特点 asp.net NBA信息管理系统 是一套完善的web设计管理系统,系统具有完整的源代码和数据库,开发环境为vs2010,数据库为sqlserver2008,使用c#语言 ...
- 计算机毕业设计asp.net考试安排管理系统VS开发sqlserver数据库web结构c#编程计算机网页源码项目
一.源码特点 asp.net 考试安排管理系统 是一套完善的web设计管理系统,系统具有完整的源代码和数据库,系统主要采用B/S模式开发,开发环境为vs2010,数据库为sqlserver2 ...
最新文章
- 《OpenCV3编程入门》学习笔记6 图像处理(四)形态学滤波(2):开运算、闭运算、形态学梯度、顶帽、黑帽
- python成绩管理系统界面-python实现简易版学生成绩管理系统
- Web.xml配置Error Page不能够转发的问题分析及解决
- C++ 在一个类中用指针的形式申请堆内存构造出另一个类并访问私有成员变量(包括智能指针版本)
- 今天,GitHub 挂了!
- java朗控点异常_Java语言基础(day_04)
- jdbc 连接 mysql 时的中文乱码问题
- 计算机工程制图cad,物流工程制图CAD计算机绘图指导教程
- 微信小程序后端用python_微信小程序后端开发用python
- 健身运动App需求分析
- git从本地添加项目到远程仓库
- 企业微信开源系统,让开发者快速搭建基于企业微信的私域流量运营系统
- 操作系统实验一到实验九合集(哈工大李治军)
- Java中的十大组织
- shell——正则表达式
- OpenCV学习17_ 分水岭算法
- python中的_和__
- 用户行为分析的背景以及几种模型分析、实例分析——淘宝用户行为分析
- DB2: SQL0902C A system error occurred. Subsequent SQL statements cannot be processed. IBM software
- Java案例----统计字符串个数(String类)
热门文章
- 面试阿里Android研发岗,已拿到offer,这些知识点该放出来了
- html ajax实现分页代码,用jQuery中的ajax分页实现代码
- 拿起笔来做刀枪 · 序言
- Vue--网易云音乐移动端项目复盘
- 【红队靶场】利用redis未授权写入,docker提权逃逸,ms17-010,横向拿下域控
- zoj 1010 Area (叉积求面积 与 跨立相交实验判断相交)
- 虚拟机Failed to lock the file 和Reason: The file is too large错误的解决方法
- matlab 开环系统 求相位裕度,用MATLAB进行控制系统的..
- 408王道数据结构强化——应用题
- 浅谈Javac编译原理