当前位置:   article > 正文

1964springboot VUE小程序在线学习管理系统开发mysql数据库uniapp开发java编程计算机网页源码maven项目

1964springboot VUE小程序在线学习管理系统开发mysql数据库uniapp开发java编程计算机网页源码maven项目

一、源码特点
  springboot VUE uniapp 小程序 在线学习管理系统是一套完善的完整信息管理类型系统,结合springboot框架uniapp和VUE完成本系统,对理解vue java编程开发语言有帮助系统采用springboot框架(MVC模式开发),系统具有完整的源代码和数据库,系统主要采用B/S模式开发。

微信小程序在线学习管理系统


前段主要技术 vue 
后端主要技术 Springboot java
数据库 mysql
开发工具 IDEA  JDK1.8 
微信小程序 uniapp 开发的微信小程序
环境需要

1.运行环境:最好是java jdk 1.8,我们在这个平台上运行的。其他版本理论上也可以 不建议。

2.IDE环境:推荐IDEA;

3.硬件环境:windows 7/8/10 1G内存以上;;

5.数据库:MySql 5.0 到 5.5 等版本均可 需要高版本 如mysql8.0 需要修改数据连接配置,以及maven中的mysql 驱动包;

6.是Maven项目;查看源码目录中是否包含pom.xml;

使用说明

1. 使用Navicat或者其它工具,在mysql中创建对应sql文件名称的数据库,并导入项目的sql文件 数据库字符集gb2312;

2. 使用IDEA导入项目;

3. 将项目中shequ\src\main\resources 下的 application.properties 配置文件中的数据库配置改为自己的配置;
数据库支持 mysql5.0 到5.5 ,如果需要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)提交作业管理:对提交作业信息进行删除、修改和查看
前端(微信小程序功能)主要包括:
(1)用户登录
(2)班级浏览、提交班级评价、查看已经提交的评价信息
(3)提交投诉建议、查看已经提交的投诉建议
(4)浏览资料信息、并且可以下载资料文件
(5)浏览作业、并且提交作业信息、查看已经提交的作业
(6)可以通过系统调用的ai接口(百度ai接口)针对自己的一些常见的问题(如,如何提交自己的成绩进行问答)
(7)个人信息修改

数据库设计

  1. CREATE TABLE `gly` (
  2. `glyid` int(11) NOT NULL auto_increment,
  3. `yhm` VARCHAR(40) default NULL COMMENT '用户名',
  4. `mm` VARCHAR(40) default NULL COMMENT '密码',
  5. `xm` VARCHAR(40) default NULL COMMENT '姓名', PRIMARY KEY (`glyid`)
  6. ) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
  7. CREATE TABLE `banji` (
  8. `bjid` int(11) NOT NULL auto_increment,
  9. `bjmc` VARCHAR(40) default NULL COMMENT '班级名称', PRIMARY KEY (`bjid`)
  10. ) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
  11. CREATE TABLE `jiaoshi` (
  12. `jsid` int(11) NOT NULL auto_increment,
  13. `yhm` VARCHAR(40) default NULL COMMENT '用户名',
  14. `mm` VARCHAR(40) default NULL COMMENT '密码',
  15. `xm` VARCHAR(40) default NULL COMMENT '姓名',
  16. `lxdh` VARCHAR(40) default NULL COMMENT '联系电话',
  17. `lxdz` VARCHAR(40) default NULL COMMENT '联系地址',
  18. `bj` VARCHAR(40) default NULL COMMENT '班级', PRIMARY KEY (`jsid`)
  19. ) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
  20. CREATE TABLE `xuesheng` (
  21. `xsid` int(11) NOT NULL auto_increment,
  22. `yhm` VARCHAR(40) default NULL COMMENT '用户名',
  23. `mm` VARCHAR(40) default NULL COMMENT '密码',
  24. `xm` VARCHAR(40) default NULL COMMENT '姓名',
  25. `lxdh` VARCHAR(40) default NULL COMMENT '联系电话',
  26. `lxdz` VARCHAR(40) default NULL COMMENT '联系地址',
  27. `bj` VARCHAR(40) default NULL COMMENT '班级',
  28. `jrsj` VARCHAR(40) default NULL COMMENT '加入时间',
  29. `zt` VARCHAR(40) default NULL COMMENT '状态', PRIMARY KEY (`xsid`)
  30. ) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
  31. CREATE TABLE `bjpj` (
  32. `bjpjid` int(11) NOT NULL auto_increment,
  33. `bj` VARCHAR(40) default NULL COMMENT '班级',
  34. `pj` VARCHAR(40) default NULL COMMENT '评价',
  35. `yh` VARCHAR(40) default NULL COMMENT '用户',
  36. `pjsj` VARCHAR(40) default NULL COMMENT '评价时间', PRIMARY KEY (`bjpjid`)
  37. ) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
  38. CREATE TABLE `tsjy` (
  39. `tsjyid` int(11) NOT NULL auto_increment,
  40. `bt` VARCHAR(40) default NULL COMMENT '标题',
  41. `nr` VARCHAR(40) default NULL COMMENT '内容',
  42. `yh` VARCHAR(40) default NULL COMMENT '用户',
  43. `tjsj` VARCHAR(40) default NULL COMMENT '提交时间',
  44. `zt` VARCHAR(40) default NULL COMMENT '状态', PRIMARY KEY (`tsjyid`)
  45. ) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
  46. CREATE TABLE `zllx` (
  47. `zllxid` int(11) NOT NULL auto_increment,
  48. `lx` VARCHAR(40) default NULL COMMENT '类型', PRIMARY KEY (`zllxid`)
  49. ) ENGINE=InnoDB DEFAULT CHARSET=gb2312;
  50. CREATE TABLE `ziliao` (
  51. `zlid` int(11) NOT NULL auto_increment,
  52. `zlmc` VARCHAR(40) default NULL COMMENT '资料名称',
  53. `lx` VARCHAR(40) default NULL COMMENT '类型',
  54. `lb` VARCHAR(40) default NULL COMMENT '类别',
  55. `sm` VARCHAR(40) default NULL COMMENT '说明',
  56. `scsj` VARCHAR(40) default NULL COMMENT '上传时间',
  57. `fj` VARCHAR(40) default NULL COMMENT '附件', PRIMARY KEY (`zlid`)
  58. ) ENGINE=InnoDB DEFAULT CHARSET=gb2312;

后台控制类设计

  1. /**教师列表 查询jiaoshi
  2. *
  3. */
  4. @GetMapping("list")
  5. public Result list(@RequestParam(value = "pageNum",defaultValue = "1") int page,
  6. @RequestParam(value = "pageSize",defaultValue = "10") int szie,
  7. @RequestParam(defaultValue = "") String yhm,
  8. @RequestParam(defaultValue = "") String js
  9. ) {
  10. Result res=new Result();
  11. List list=null;
  12. String sql="";
  13. try{
  14. if(yhm!=null&&!yhm.equals("")){
  15. sql+=" and yhm like '%"+yhm+"%'";//符合条件 拼接sql 用户名
  16. }
  17. list=jiaoshidao.querylist(sql,page,szie);//查询jiaoshi表数据返回 list对象
  18. res.setCode(200);
  19. res.setMessage("查询成功");
  20. res.setData(tl.ltoj(list));
  21. list=jiaoshidao.querylist(sql);
  22. res.setNum(list.size());
  23. }catch(Exception e){
  24. e.printStackTrace();;
  25. }
  26. return res;
  27. }
  28. /**教师列表 查询jiaoshi
  29. *
  30. */
  31. @GetMapping("listpage")
  32. public Result listpage(
  33. @RequestParam(defaultValue = "") String yhm
  34. ) {
  35. Result res=new Result();
  36. List list=null;
  37. String sql="";
  38. if(yhm!=null&&!yhm.equals("")){
  39. sql+=" and yhm like '%"+yhm+"%'";//符合条件 拼接sql 用户名
  40. }
  41. try{
  42. list=jiaoshidao.querylist(sql);//查询gly 表数据返回 list对象
  43. res.setCode(200);
  44. res.setMessage("查询成功");
  45. res.setData(tl.ltoj(list));
  46. }catch(Exception e){
  47. e.printStackTrace();;
  48. }
  49. return res;
  50. }
  51. /**教师添加方法 对表 jiaoshi 进行添加
  52. *
  53. */
  54. @PostMapping(value = "add")
  55. public Result add(@RequestBody jiaoshi bean){
  56. Result res=new Result();
  57. String sql="";
  58. ResultSet rs=null;
  59. int num=0;
  60. DBO db=new DBO();
  61. try{
  62. if(bean.getJsid()!=null&&!bean.getJsid().equals("")){
  63. jiaoshidao.update(bean);//执行 修改 jiaoshi 添加操作
  64. res.setMessage("操作成功");
  65. res.setCode(200);
  66. }else{
  67. sql="select count(1) as num from jiaoshi where yhm='"+bean.getYhm()+"'";
  68. rs=db.query(sql);
  69. if(rs.next()){
  70. num=rs.getInt("num");
  71. }
  72. if(num>0){
  73. res.setMessage("注册失败、用户名重复");
  74. res.setCode(201);
  75. }else {
  76. jiaoshidao.add(bean);//执行 添加jiaoshi 添加操作
  77. res.setMessage("注册成功");
  78. res.setCode(200);
  79. }
  80. }
  81. }catch(Exception e){
  82. e.printStackTrace();;
  83. }
  84. //System.out.println(res);
  85. return res;
  86. }
  87. /**教师删除方法 对表jiaoshi 进行删除
  88. *
  89. */
  90. @DeleteMapping("del/{id}")
  91. public Result del( @PathVariable String id){
  92. Result res=new Result();
  93. try{
  94. jiaoshidao.delete(id);//执行 删除jiaoshi 方法
  95. }catch(Exception e){
  96. e.printStackTrace();;
  97. }
  98. res.setCode(200);
  99. res.setMessage("删除成功");
  100. return res;
  101. }
  102. /**教师查看方法 对表 jiaoshi 进行查看
  103. *
  104. */
  105. @GetMapping("detail")
  106. public Result detail(@RequestParam String id){
  107. Result res=new Result();
  108. Map<String, String> map = new HashMap<>();
  109. jiaoshi bean=new jiaoshi();//初始对象教师
  110. try{
  111. map=jiaoshidao.getjiaoshiMap(id);//查询获得当前教师对象
  112. res.setCode(200);
  113. res.setMessage("查询成功");
  114. res.setData(tl.mtoj(map));
  115. System.out.println(tl.mtoj(map));
  116. }catch(Exception e){
  117. e.printStackTrace();;
  118. }
  119. return res;
  120. }
  121. /**教师修改页面 对表 jiaoshi 进行查看
  122. *
  123. */
  124. @GetMapping("modifypage")
  125. public Result modifypage(@RequestParam String id){
  126. Result res=new Result();
  127. Map<String, String> map = new HashMap<>();
  128. tool tl=new tool();
  129. try{
  130. map=jiaoshidao.getjiaoshiMap(id);//获取jiaoshi 对象
  131. //String str=obj.toString();
  132. res.setCode(200);
  133. res.setMessage("查询成功");
  134. res.setData(tl.mtoj(map));//赋值
  135. }catch(Exception e){
  136. e.printStackTrace();;
  137. }
  138. return res;
  139. }

vue端设计

  1. </div>
  2. <el-table :data="tableData" border stripe :header-cell-class-name="'headerBg'" @selection-change="handleSelectionChange">
  3. <el-table-column label="序号" width="80"
  4. type="index"
  5. :index="indexMethod">
  6. </el-table-column>
  7. <el-table-column prop="lsh" label="流水号" width="120"></el-table-column>
  8. <el-table-column prop="zymc" label="作业名称" width="220"></el-table-column>
  9. <el-table-column prop="fbsj" label="发布时间" width="160"></el-table-column>
  10. <el-table-column label="操作" width="320" align="center">
  11. <template slot-scope="scope">
  12. <el-button type="info" @click="handleDetail(scope.row)">详情 <i class="el-icon-reading"></i></el-button>
  13. <el-button type="success" @click="handleEdit(scope.row)">编辑 <i class="el-icon-edit"></i></el-button>
  14. <el-popconfirm
  15. class="ml-5"
  16. confirm-button-text='确定'
  17. cancel-button-text='我再想想'
  18. icon="el-icon-info"
  19. icon-color="red"
  20. title="您确定删除吗?"
  21. @confirm="del(scope.row.zyid)"
  22. >
  23. <el-button type="danger" slot="reference">删除 <i class="el-icon-remove-outline"></i></el-button>
  24. </el-popconfirm>
  25. </template>
  26. </el-table-column>
  27. </el-table>
  28. <div style="padding: 10px 0">
  29. <el-pagination
  30. @size-change="handleSizeChange"
  31. @current-change="handleCurrentChange"
  32. :current-page="pageNum"
  33. :page-sizes="[2, 5, 10, 20]"
  34. :page-size="pageSize"
  35. layout="total, sizes, prev, pager, next, jumper"
  36. :total="total">
  37. </el-pagination>
  38. </div>
  39. <el-dialog title="作业信息" :visible.sync="dialogFormVisible" width="40%" >
  40. <el-form :model="form" :rules="rules" ref="beanForm" label-width="180px" size="small" >
  41. <el-form-item label="流水号" prop="lsh" >
  42. <el-input v-model="form.lsh" disabled ></el-input>
  43. </el-form-item>
  44. <el-form-item label="作业名称" prop="zymc" >
  45. <el-input v-model="form.zymc" ></el-input>
  46. </el-form-item>
  47. <el-form-item label="说明" prop="sm" >
  48. <el-input v-model="form.sm" type="textarea" rows="5" ></el-input>
  49. </el-form-item>
  50. <el-form-item label="附件" prop="fj" >
  51. <el-input v-model="form.fj" disabled style="width: 120px" ></el-input><el-button type="primary" @click="dialogFileVisible = true">上传</el-button>
  52. </el-form-item>
  53. <el-form-item label="发布时间" prop="fbsj" >
  54. <el-input v-model="form.fbsj" disabled ></el-input>
  55. </el-form-item>
  56. </el-form>
  57. <div slot="footer" class="dialog-footer">
  58. <el-button @click="dialogFormVisible = false">取 消</el-button>
  59. <el-button type="primary" @click="save">确 定</el-button>
  60. </div>
  61. </el-dialog>
  62. <el-dialog title="查看作业信息" :visible.sync="dialogDetailVisible" width="30%" >
  63. <el-form :model="form" :rules="rules" ref="beanForm" label-width="80px" size="small" >
  64. <el-form-item label="流水号" prop="lsh" required>
  65. {{form.lsh}}
  66. </el-form-item>
  67. <el-form-item label="作业名称" prop="zymc" required>
  68. {{form.zymc}}
  69. </el-form-item>
  70. <el-form-item label="说明" prop="sm" required>
  71. {{form.sm}}
  72. </el-form-item>
  73. <el-form-item label="附件" prop="fj" required>
  74. <a :href="'http://'+serverIp+':9090/file/download?filename='+ form.fj" target="" style="text-decoration:none;">下载</a>
  75. </el-form-item>
  76. <el-form-item label="发布时间" prop="fbsj" required>
  77. {{form.fbsj}}
  78. </el-form-item>
  79. </el-form>
  80. <div slot="footer" class="dialog-footer">
  81. <el-button @click="dialogDetailVisible = false">关闭</el-button>
  82. </div>
  83. </el-dialog>
  84. <el-dialog title="附件" :visible.sync="dialogFileVisible" width="30%" >
  85. <el-upload
  86. class="upload-demo"
  87. :action="uploadAction"
  88. :on-preview="handlePreview"
  89. :on-remove="handleRemove"
  90. :before-remove="beforeRemove"
  91. :on-success="handleAvatarSuccess"
  92. multiple
  93. :limit="1"
  94. :on-exceed="handleExceed"
  95. :file-list="fileList">
  96. <el-button size="small" type="primary">点击上传</el-button>
  97. <!--div slot="tip" class="el-upload__tip">上传文件,且不超过500kb</div-->
  98. </el-upload>
  99. </el-dialog>
  100. </div>
  101. </template>
  102. <script>
  103. import {serverIp} from "../../public/config";
  104. import * as util from "../../public/util.js";
  105. export default {
  106. name: "zuoye",
  107. data() {
  108. return {
  109. serverIp: serverIp,
  110. tableData: [],
  111. fileList: [],
  112. total: 0,
  113. pageNum: 1,
  114. pageSize: 10,
  115. lsh: "",
  116. form: {},
  117. dialogFormVisible: false,
  118. dialogDetailVisible:false,
  119. dialogFileVisible:false,
  120. multipleSelection: [],
  121. uploadAction: "http://"+serverIp+":9090/file/upload",
  122. vis: false,
  123. rules: {
  124. lsh: [
  125. { required: true, message: '请输入流水号', trigger: 'blur' }
  126. ],
  127. zymc: [
  128. { required: true, message: '请输入作业名称', trigger: 'blur' }
  129. ],
  130. sm: [
  131. { required: true, message: '请输入说明', trigger: 'blur' }
  132. ],
  133. fj: [
  134. { required: true, message: '请输入附件', trigger: 'blur' }
  135. ],
  136. fbsj: [
  137. { required: true, message: '请输入发布时间', trigger: 'blur' }
  138. ],
  139. }
  140. }
  141. },
  142. created() {
  143. this.load()
  144. },
  145. methods: {
  146. indexMethod(index) {
  147. return index+1;
  148. },
  149. load() {
  150. this.request.get("/zuoye/list", {
  151. params: {
  152. pageNum: this.pageNum,
  153. pageSize: this.pageSize,
  154. lsh: this.lsh,
  155. }
  156. }).then(res => {
  157. console.log(res.data)
  158. this.tableData = JSON.parse(res.data)
  159. this.total =res.num
  160. })
  161. },
  162. save() {
  163. //保存方法
  164. this.$refs['beanForm'].validate((valid) => {
  165. if (valid) { // 表单校验合法
  166. this.request.post("/zuoye/add", this.form).then(res => {
  167. // 表单校验合法
  168. if (res.code == '200') {
  169. this.$message.success(res.message)
  170. this.dialogFormVisible = false
  171. this.load()
  172. } else {
  173. this.$message.error(res.message)
  174. }
  175. })
  176. }
  177. });
  178. },
  179. handleAdd() {

uniapp设计

  1. <uni-section title="提交过的作业信息" type="line">
  2. <uni-list>
  3. <uni-list-chat v-for="(item,index) in listData" :key="item.tsjyid" :title="item.bt" :note="item.zymc"
  4. :time="item.tjsj" :clickable="true" :avatarList="avatar(index+1)" :badge-text="item.zt" @click="onClick(item.tjzyid)"></uni-list-chat>
  5. </uni-list>
  6. </uni-section>
  7. </view>
  8. </template>
  9. <script>
  10. export default {
  11. components: {},
  12. data() {
  13. return {
  14. listData: [],
  15. avatarList: [{
  16. url: '/static/tousu.png'
  17. }]
  18. }
  19. },
  20. onLoad() {
  21. this.getList()
  22. },
  23. methods: {
  24. onClick(id) {
  25. // alert(id);
  26. uni.navigateTo({
  27. url:'/pages/zuoye/tjzydetail?id='+id
  28. })
  29. },
  30. avatar(count) {
  31. let arr = []
  32. this.avatarList.forEach((item, index) => {
  33. if (index < count) {
  34. arr.push(item)
  35. }
  36. })
  37. return arr
  38. },
  39. getList() {
  40. this.request({
  41. url: '/tjzy/listpage',
  42. method: 'GET',
  43. data:{yh:uni.getStorageSync('yhm')}
  44. }).then(res => {
  45. //console.log("data="+res.data)
  46. this.listData = JSON.parse(res.data)
  47. })
  48. },
  49. }
  50. }
  51. </script>
  52. <style lang="scss" >
  53. .chat-custom-right {
  54. flex: 1;
  55. /* #ifndef APP-NVUE */
  56. display: flex;
  57. /* #endif */
  58. flex-direction: column;
  59. justify-content: space-between;
  60. align-items: flex-end;
  61. }
  62. .chat-custom-text {
  63. font-size: 12px;
  64. color: #999;
  65. }
  66. </style>

三、注意事项
1、管理员账号:admin密码:admin 数据库配置文件\src\main\resources\application.properties
2、开发环境为IDEA开发,数据库为mysql,使用java语言开发。
3、数据库文件名是javastudy.sql 系统名称study
4、地址:http://128.0.0.1:8080/login

四 系统实现

需要源码 其他的定制服务  下方联系卡片↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 或者私信作者

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/空白诗007/article/detail/758619
推荐阅读
相关标签
  

闽ICP备14008679号