计算机java项目推荐 SpringBoot+VUE的线上教学管理平台系统

清疚 2024-02-05 11:40 19阅读 0赞

### 项目背景 ###

在社会快速发展的影响下，使线上教学平台的管理和运营比过去十年更加理性化。依照这一现实为基础，设计一个快捷而又方便的网上线上教学平台系统是一项十分重要并且有价值的事情。对于传统的线上教学平台控制模型来说，网上线上教学平台系统具有许多不可比拟的优势，首先是快速更新线上教学平台的信息，其次是大量信息的管理，最后是高度安全，以及使用简单等特性，这使得线上教学平台系统的管理和运营非常方便。进入21世纪，因为科技和经济的迅速发展，人民群众对非物质层面的精神需求正变得越来越多元化。本系统是为了实现这些目标而提出来的。  
本论文系统地描绘了整个网上线上教学平台的设计与实现，主要实现的功能有以下几点：管理员；首页、个人中心、学员管理、资料类型管理、学习资料管理、交流论坛、我的收藏管理、试卷管理、留言板管理、试题管理、系统管理、考试管理，学员；首页、个人中心、我的收藏管理、留言板管理、考试管理，前台首页；首页、学习资料、交流论坛、试卷列表、留言反馈、个人中心、后台管理等功能，其具有简单的接口，方便的应用，强大的互动，完全基于互联网的特点。  
现代社会的网络和信息技术不断提高，人们的生活水平达到一个新的层次。但由于学员的工作和生活越来越忙，开发出一个网上线上教学平台系统是必然的，简化许多繁琐过程的程序，正是我们所需要的。这篇文章研究了基于Spring  
Boot框架的线上教学平台的开发和实现，从需求分析、总体设计到具体实现，最终完成了整个线上教学平台，从而方便了学员和提高了管理员人员的管理水平。

### 系统设计 ###

##### 系统概要设计 #####

本线上教学平台适合在互联网上进行操作，只要学员能连网，任何时间、任何地点都可以进行系统的操作使用  
![在这里插入图片描述][1beb2e48715c47fbb350d857733f6f21.png]  
整个系统是由多个功能模块组合而成的，要将所有的功能模块都一一列举出来，然后进行逐个的功能设计，使得每一个模块都有相对应的功能设计，然后进行系统整体的设计  
![在这里插入图片描述][9cd2c1204f6d4cffa974f695e434c458.png]  
管理员实体属性图  
![在这里插入图片描述][6b88b9a25b504c70acb9b3a4a26b78d2.png]  
学习资料信息实体属性  
![在这里插入图片描述][fa31893839db40d18e1491dbe2f6571f.png]  
学员信息实体属性  
![在这里插入图片描述][70b9c3c7d3ca48a4afc15714749d194c.png]  
考试记录信息实体属性  
![在这里插入图片描述][6403c5d894e14056aa6fed2916b0cd0e.png]  
试题信息实体属性  
![在这里插入图片描述][b0a4cba6c6f9445798e8fbb99ec1fa4b.png]

### 功能截图 ###

##### 管理员功能模块 #####

管理员登录，通过填写注册时输入的用户名、密码、角色进行登录  
![在这里插入图片描述][9f4e0ac3418b4624a21ef22987cde186.png]  
管理员登录进入线上教学平台可以查看首页、个人中心、学员管理、资料类型管理、学习资料管理、交流论坛、我的收藏管理、试卷管理、留言板管理、试题管理、系统管理、考试管理等信息  
学员管理，在学员管理页面中可以通过填写学号、密码、姓名、性别、头像、邮箱、手机等内容进行详情、修改、删除  
![在这里插入图片描述][6ac676a75f8c422d9cae84d9466cee2c.png]  
可以根据需要对资料类型管理进行详情，修改或删除等详细操作  
![在这里插入图片描述][95aad3a1dc3d4d70bce534d5f896c4c7.png]  
学习资料管理，在学习资料管理页面中可以查看资料名称、资料类型、图片、资料文件、教学视频、发布时间等信息，并可根据需要对已有学习资料管理进行修改或删除等操作  
![在这里插入图片描述][0b40fbf39a2b4c5098211ab592b67a62.png]  
试卷管理，在试卷管理页面中可以查看试卷名称、考试时长、试卷状态等信息，并可根据需要对已有试卷管理进行修改或删除等详细操作  
![在这里插入图片描述][145b08e1c5d0420da135dd410cff8c71.png]  
轮播图；该页面为轮播图管理界面。管理员可以在此页面进行首页轮播图的管理，通过新建操作可在轮播图中加入新的图片，还可以对以上传的图片进行修改操作，以及图片的删除操作  
![在这里插入图片描述][391874c945eb4f4e9fa9002c51b28f73.png]  
试题管理，在试题管理页面中可以查看试卷、试题名称、分值、答案、类型等内容，并且根据需要对已有试题管理进行详情，修改或删除等详细操作  
![在这里插入图片描述][ecb4558dc1a04e36888725363498c895.png]  
考试记录，在考试记录页面中可以查看用户ID、试卷、试题名称、分值、正确答案、考生答案、考生分值等内容，并且根据需要对已有考试记录进行修改或删除等详细操作  
![在这里插入图片描述][6f20c5c8263648239e5bd681e1f9d35c.png]  
留言板管理，在留言板管理页面中可以查看用户名、留言内容、回复内容等内容，并且根据需要对已有留言板管理进行详情，修改或删除等详细操作  
![在这里插入图片描述][f11b4e7223ba4060a508943011fcdabe.png]  
学习资料评论，在学习资料评论页面中可以查看评论内容、回复内容等内容，并且根据需要对已有学习资料评论进行详情，修改或删除等详细操作  
![在这里插入图片描述][ef59279848da439487d05f10850fa824.png]  
公告信息，在公告信息页面中可以查看标题、简介、图片等内容，并且根据需要对已有公告信息进行详情，修改或删除等详细操作  
![在这里插入图片描述][18190d172acc407fb21d6a815c9bdd5f.png]

##### 前台首页功能模块 #####

学员登录、学员注册，通过填写学号、密码、姓名、邮箱、手机等信息进行注册、登录  
![在这里插入图片描述][8ebe76c0fc174769b322e822e33bf6db.png]  
![在这里插入图片描述][3f618e5af01c42e997291969c2c8f515.png]  
线上教学平台，通过系统可以获取首页、学习资料、交流论坛、试卷列表、公告信息、留言反馈、个人中心、后台管理等信息操作内容  
![在这里插入图片描述][473f21c546b54aef8b920804b1c41032.png]  
学习资料，通过内容列表可以获取资料名称、资料类型、图片、资料文件、教学视频、发布时间等信息可进行点我收藏操作  
![在这里插入图片描述][2fef9f8cd912456daf88b96f503adc83.png]  
交流论坛，通过内容列表可以获取标题、类型、内容等信息进行发布帖子操作  
![在这里插入图片描述][07f56fb8b6084350828aa0bd59f9cf47.png]  
试卷列表，通过内容列表可以获取试卷名称、考试时长、创建时间等信息进行考试操作  
![在这里插入图片描述][7e8ea1891f1d4f249f6bf19a575c2c3d.png]  
我的发布，通过内容列表可以获取标题、发布时间等信息进行修改、删除操作  
![在这里插入图片描述][945180f326fe4e4785202cf094bd4e28.png]

##### 学员功能模块 #####

学员点击进入到系统操作界面，可以对首页、个人中心、我的收藏管理、留言板管理、考试管理等功能模块，个人信息：通过列表可以获取学号、密码、姓名、性别、头像、邮箱、手机并进行修改操作  
![在这里插入图片描述][7e6480036f5b453896ae5df60d258f88.png]  
修改密码：通过列表可以获取原密码、新密码、确认密码等信息，进行修改、删除等操作  
![在这里插入图片描述][24881666792c43c4b4a9e538e9f2454d.png]  
我的收藏管理：通过列表可以获取收藏名称、收藏图片等信息，进行修改、删除操作  
![在这里插入图片描述][696ef212cb754e0fb149bdd67311b483.png]  
留言板管理：通过列表可以获取用户名、留言内容、回复内容等信息，进行详情、删除操作  
![在这里插入图片描述][64b129d4c38d4c14ba6bd0295242a39e.png]  
错题本：通过列表可以获取用户ID、试卷、试题名称、分值、正确答案、考生答案、试题分析、考试时间等信息，进行详情、删除操作  
![在这里插入图片描述][99a3bf52a55543f7a9f0c939745fcc4e.png]  
考试记录：通过列表可以获取用户ID、试卷、考试得分等信息，进行详情、删除操作  
![在这里插入图片描述][f5e30ca069e24e918ed77481d5ca2e27.png]

### 相关代码 ###

##### 数据库配置 #####

# Tomcat
    server:
        tomcat:
            uri-encoding: UTF-8
        port: 8080
        servlet:
            context-path: /springbootr1tjf
    
    spring:
        datasource:
            driverClassName: com.mysql.jdbc.Driver
            url: jdbc:mysql://127.0.0.1:3306/springbootr1tjf?useUnicode=true&characterEncoding=utf-8&useJDBCCompliantTimezoneShift=true&useLegacyDatetimeCode=false&serverTimezone=GMT%2B8
            username: root
            password: 123456
    
    #        driverClassName: com.microsoft.sqlserver.jdbc.SQLServerDriver
    #        url: jdbc:sqlserver://127.0.0.1:1433;DatabaseName=springbootr1tjf
    #        username: sa
    #        password: 123456
    
        servlet:
          multipart:
            max-file-size: 10MB
            max-request-size: 10MB
        resources:
          static-locations: classpath:static/,file:static/
    
    #mybatis
    mybatis-plus:
      mapper-locations: classpath*:mapper/*.xml
      #实体扫描，多个package用逗号或者分号分隔
      typeAliasesPackage: com.entity
      global-config:
        #主键类型  0:"数据库ID自增", 1:"用户输入ID",2:"全局唯一ID (数字类型唯一ID)", 3:"全局唯一ID UUID";
        id-type: 1
        #字段策略 0:"忽略判断",1:"非 NULL 判断"),2:"非空判断"
        field-strategy: 2
        #驼峰下划线转换
        db-column-underline: true
        #刷新mapper 调试神器
        refresh-mapper: true
        #逻辑删除配置
        logic-delete-value: -1
        logic-not-delete-value: 0
        #自定义SQL注入器
        sql-injector: com.baomidou.mybatisplus.mapper.LogicSqlInjector
      configuration:
        map-underscore-to-camel-case: true
        cache-enabled: false
        call-setters-on-nulls: true
        #springboot 项目mybatis plus 设置 jdbcTypeForNull (oracle数据库需配置JdbcType.NULL, 默认是Other)
        jdbc-type-for-null: 'null'

##### 控制层（controller） #####

package com.controller;
    
        import java.util.Arrays;
        import java.util.Calendar;
        import java.util.Date;
        import java.util.Map;
        
        import javax.servlet.http.HttpServletRequest;
        
        import org.springframework.beans.factory.annotation.Autowired;
        import org.springframework.stereotype.Controller;
        import org.springframework.web.bind.annotation.GetMapping;
        import org.springframework.web.bind.annotation.PathVariable;
        import org.springframework.web.bind.annotation.PostMapping;
        import org.springframework.web.bind.annotation.RequestBody;
        import org.springframework.web.bind.annotation.RequestMapping;
        import org.springframework.web.bind.annotation.RequestParam;
        import org.springframework.web.bind.annotation.ResponseBody;
        import org.springframework.web.bind.annotation.RestController;
        
        import com.annotation.IgnoreAuth;
        import com.baomidou.mybatisplus.mapper.EntityWrapper;
        import com.entity.TokenEntity;
        import com.entity.UserEntity;
        import com.service.TokenService;
        import com.service.UserService;
        import com.utils.CommonUtil;
        import com.utils.MPUtil;
        import com.utils.PageUtils;
        import com.utils.R;
        import com.utils.ValidatorUtils;
        
        /**
         * 登录相关
         */
        @RequestMapping("users")
        @RestController
        public class UserController{
        
        	
        	@Autowired
        	private UserService userService;
        	
        	@Autowired
        	private TokenService tokenService;
        
        	/**
        	 * 登录
        	 */
        	@IgnoreAuth
        	@PostMapping(value = "/login")
        	public R login(String username, String password, String captcha, HttpServletRequest request) {
        
        		UserEntity user = userService.selectOne(new EntityWrapper<UserEntity>().eq("username", username));
        		if(user==null || !user.getPassword().equals(password)) {
        
        			return R.error("账号或密码不正确");
        		}
        		String token = tokenService.generateToken(user.getId(),username, "users", user.getRole());
        		return R.ok().put("token", token);
        	}
        	
        	/**
        	 * 注册
        	 */
        	@IgnoreAuth
        	@PostMapping(value = "/register")
        	public R register(@RequestBody UserEntity user){
        
        //    	ValidatorUtils.validateEntity(user);
            	if(userService.selectOne(new EntityWrapper<UserEntity>().eq("username", user.getUsername())) !=null) {
        
            		return R.error("用户已存在");
            	}
                userService.insert(user);
                return R.ok();
            }
        
        	/**
        	 * 退出
        	 */
        	@GetMapping(value = "logout")
        	public R logout(HttpServletRequest request) {
        
        		request.getSession().invalidate();
        		return R.ok("退出成功");
        	}
        	
        	/**
             * 密码重置
             */
            @IgnoreAuth
        	@RequestMapping(value = "/resetPass")
            public R resetPass(String username, HttpServletRequest request){
        
            	UserEntity user = userService.selectOne(new EntityWrapper<UserEntity>().eq("username", username));
            	if(user==null) {
        
            		return R.error("账号不存在");
            	}
            	user.setPassword("123456");
                userService.update(user,null);
                return R.ok("密码已重置为：123456");
            }
        	
        	/**
             * 列表
             */
            @RequestMapping("/page")
            public R page(@RequestParam Map<String, Object> params,UserEntity user){
        
                EntityWrapper<UserEntity> ew = new EntityWrapper<UserEntity>();
            	PageUtils page = userService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.allLike(ew, user), params), params));
                return R.ok().put("data", page);
            }
        
        	/**
             * 列表
             */
            @RequestMapping("/list")
            public R list( UserEntity user){
        
               	EntityWrapper<UserEntity> ew = new EntityWrapper<UserEntity>();
              	ew.allEq(MPUtil.allEQMapPre( user, "user")); 
                return R.ok().put("data", userService.selectListView(ew));
            }
        
            /**
             * 信息
             */
            @RequestMapping("/info/{id}")
            public R info(@PathVariable("id") String id){
        
                UserEntity user = userService.selectById(id);
                return R.ok().put("data", user);
            }
            
            /**
             * 获取用户的session用户信息
             */
            @RequestMapping("/session")
            public R getCurrUser(HttpServletRequest request){
        
            	Long id = (Long)request.getSession().getAttribute("userId");
                UserEntity user = userService.selectById(id);
                return R.ok().put("data", user);
            }
        
            /**
             * 保存
             */
            @PostMapping("/save")
            public R save(@RequestBody UserEntity user){
        
        //    	ValidatorUtils.validateEntity(user);
            	if(userService.selectOne(new EntityWrapper<UserEntity>().eq("username", user.getUsername())) !=null) {
        
            		return R.error("用户已存在");
            	}
                userService.insert(user);
                return R.ok();
            }
        
            /**
             * 修改
             */
            @RequestMapping("/update")
            public R update(@RequestBody UserEntity user){
        
        //        ValidatorUtils.validateEntity(user);
            	UserEntity u = userService.selectOne(new EntityWrapper<UserEntity>().eq("username", user.getUsername()));
            	if(u!=null && u.getId()!=user.getId() && u.getUsername().equals(user.getUsername())) {
        
            		return R.error("用户名已存在。");
            	}
                userService.updateById(user);//全部更新
                return R.ok();
            }
        
            /**
             * 删除
             */
            @RequestMapping("/delete")
            public R delete(@RequestBody Long[] ids){
        
                userService.deleteBatchIds(Arrays.asList(ids));
                return R.ok();
            }
        }

##### 业务层（Service） #####

package com.service;
        
        import java.util.List;
        import java.util.Map;
        
        import org.apache.ibatis.annotations.Param;
        
        import com.baomidou.mybatisplus.mapper.Wrapper;
        import com.baomidou.mybatisplus.service.IService;
        import com.entity.UserEntity;
        import com.utils.PageUtils;
    
    
        /**
         * 系统用户
         */
        public interface UserService extends IService<UserEntity> {
        
         	PageUtils queryPage(Map<String, Object> params);
            
           	List<UserEntity> selectListView(Wrapper<UserEntity> wrapper);
           	
           	PageUtils queryPage(Map<String, Object> params,Wrapper<UserEntity> wrapper);
        	   	
        }

##### 数据访问层（Dao） #####

package com.dao;
    
    import java.util.List;
    
    import org.apache.ibatis.annotations.Param;
    
    import com.baomidou.mybatisplus.mapper.BaseMapper;
    import com.baomidou.mybatisplus.mapper.Wrapper;
    import com.baomidou.mybatisplus.plugins.pagination.Pagination;
    import com.entity.UserEntity;
    
    /**
     * 用户
     */
    public interface UserDao extends BaseMapper<UserEntity> {
        
    	
    	List<UserEntity> selectListView(@Param("ew") Wrapper<UserEntity> wrapper);
    
    	List<UserEntity> selectListView(Pagination page,@Param("ew") Wrapper<UserEntity> wrapper);
    	
    }

## 项目获取: ##

[https://gitee.com/sinonfin/L-javaWebSha/tree/master][https_gitee.com_sinonfin_L-javaWebSha_tree_master]

[1beb2e48715c47fbb350d857733f6f21.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/99fc5b6901b94eee9e65b06d651853bf.png
[9cd2c1204f6d4cffa974f695e434c458.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/1e6a476f9ebe489eb78968e7c3f2ebc2.png
[6b88b9a25b504c70acb9b3a4a26b78d2.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/e359763481484ce696cd628a94e05876.png
[fa31893839db40d18e1491dbe2f6571f.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/0e02cb4cfc334114b0c4701bf87478c2.png
[70b9c3c7d3ca48a4afc15714749d194c.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/a9aa1d628b434194b152971819c2b065.png
[6403c5d894e14056aa6fed2916b0cd0e.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/0e08843fc9ea4f76a57a49cc81a31b32.png
[b0a4cba6c6f9445798e8fbb99ec1fa4b.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/848eb688001149c7b29dcb43b7ade430.png
[9f4e0ac3418b4624a21ef22987cde186.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/b2dc4fef2bca4fb09577774479954c2d.png
[6ac676a75f8c422d9cae84d9466cee2c.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/111ecdfa2bcb460fbcbf120602e42fbe.png
[95aad3a1dc3d4d70bce534d5f896c4c7.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/948f917d27ae478aaeeb61d46ef3dbbe.png
[0b40fbf39a2b4c5098211ab592b67a62.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/451d0c5539d049bc939c3f5d8574b30a.png
[145b08e1c5d0420da135dd410cff8c71.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/b955b49eed594984b7196035624cb017.png
[391874c945eb4f4e9fa9002c51b28f73.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/12882ba662774ba3a10c6fdd745a6fcd.png
[ecb4558dc1a04e36888725363498c895.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/4b9e7c7e3e794605a42a4aa6a311a5e0.png
[6f20c5c8263648239e5bd681e1f9d35c.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/58cbd429629e4eac87ba220d9d29ffff.png
[f11b4e7223ba4060a508943011fcdabe.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/45a6e2efea464d7a847de89361da3bb6.png
[ef59279848da439487d05f10850fa824.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/27fdb31a8dec4e6b87a9dfd88662f524.png
[18190d172acc407fb21d6a815c9bdd5f.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/11542ca61c5c4bc890588a4fac6cdbd3.png
[8ebe76c0fc174769b322e822e33bf6db.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/63350b5b17a44ae89ba5f09c5f199fc8.png
[3f618e5af01c42e997291969c2c8f515.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/e8b9741ebff44bb9aa8c21e50e421306.png
[473f21c546b54aef8b920804b1c41032.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/288ec6805ac34d42b4328685a256441f.png
[2fef9f8cd912456daf88b96f503adc83.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/184197a4087449d599a9300e06c9b118.png
[07f56fb8b6084350828aa0bd59f9cf47.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/84eacbc08c004eaf9bd27f6346cd9a1d.png
[7e8ea1891f1d4f249f6bf19a575c2c3d.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/c09935cf6d484018b98673a1c1897bc3.png
[945180f326fe4e4785202cf094bd4e28.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/f6c8682fc72447ffb6e6fd34c0f72046.png
[7e6480036f5b453896ae5df60d258f88.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/51665e93f0c047a7a69ee7c722c494f7.png
[24881666792c43c4b4a9e538e9f2454d.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/d1904a109e7b4b08a125091a76d73ec5.png
[696ef212cb754e0fb149bdd67311b483.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/7b5541fdbce34c18bc6cea160a0234ba.png
[64b129d4c38d4c14ba6bd0295242a39e.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/c48d900a9d064110847ac23c1af353cd.png
[99a3bf52a55543f7a9f0c939745fcc4e.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/0a380bf5051b4cba9acd0379273cc5c3.png
[f5e30ca069e24e918ed77481d5ca2e27.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/05/dfa3c5123cee48698cdf00593ca76344.png
[https_gitee.com_sinonfin_L-javaWebSha_tree_master]: https://gitee.com/sinonfin/L-javaWebSha/tree/master