基于SSM+Vue的网络教学平台的设计与实现的设计与实现

末尾获取源码
开发语言:Java
Java开发工具:JDK1.8
后端框架:SSM
前端:采用Vue技术开发
数据库:MySQL5.7和Navicat管理工具结合
服务器:Tomcat8.5
开发软件:IDEA / Eclipse
是否Maven项目:是


目录

一、项目简介

二、系统功能

三、系统项目截图

学生功能模块的实现

管理员功能模块的实现 

教师功能模块的实现 

四、核心代码

登录相关

文件上传

封装


一、项目简介

目前在网络大环境,越来越多高校开始实行网络教学,利用网络教学方式有利于学生更好的学习。

网络教学是指以计算机及网络为基础,来实现教学资源的上传、存储、传播和共享的教学手段。它是一种教学活动,必然存在着一定的学习方式,计算机网络是网络教学实现的技术基础,在过程中运用网络技术,来实现数据的互操作性、共享性,通过网络完成教学资源的管理与维护,使教学资源得到传播、扩展和延伸。网络教学是计算机信息工程、网络技术、计算机技术与现代教育技术发展到一定规模下的产物。网络教学具有方便管理、数据资源共享及可重用性的特点,使学生的学习变的方便,有趣,激发学习性,也是未来教学模式的主要趋势。与其它教学方式对比具有独特性。


二、系统功能

系统架构的整体设计是一个将一个庞大的任务细分为多个小的任务的过程,这些小的任务分段完成后,组合在一起形成一个完整的任务。本网络教学平台的设计与实现主要包括学生功能模块、教师功能模块和管理员功能模块三大部分。

基于SSM+Vue的网络教学平台的设计与实现的设计与实现_第1张图片



三、系统项目截图

学生功能模块的实现

学生进入本系统可查看系统信息。

基于SSM+Vue的网络教学平台的设计与实现的设计与实现_第2张图片

学生在登录时需输入正确的登录用户名和密码,系统会以登录用户名、密码为参数进行登录信息的验证,信息正确则登录成功,反之登录失败。

基于SSM+Vue的网络教学平台的设计与实现的设计与实现_第3张图片 

学生可选择课堂信息查看详情,登录后可进行申请加入、收藏等操作。

基于SSM+Vue的网络教学平台的设计与实现的设计与实现_第4张图片 

学生在试卷列表界面可查看所有试卷,并可选择考试。

基于SSM+Vue的网络教学平台的设计与实现的设计与实现_第5张图片 基于SSM+Vue的网络教学平台的设计与实现的设计与实现_第6张图片

学生可选择签到查看详情信息,登录后可进行签到、评论等。

基于SSM+Vue的网络教学平台的设计与实现的设计与实现_第7张图片

管理员功能模块的实现 

管理员要想进入后台进行管理操作,必须登录系统后台。

基于SSM+Vue的网络教学平台的设计与实现的设计与实现_第8张图片

管理在学生管理界面可查看所有学生信息,并可对其进行修改和删除操作。

基于SSM+Vue的网络教学平台的设计与实现的设计与实现_第9张图片 

管理员可增删改查教师信息。

基于SSM+Vue的网络教学平台的设计与实现的设计与实现_第10张图片 

管理员可增删改查教学资源信息。

基于SSM+Vue的网络教学平台的设计与实现的设计与实现_第11张图片 

教师功能模块的实现 

教师登录后可进入个人信息界面进行修改个人资料。

基于SSM+Vue的网络教学平台的设计与实现的设计与实现_第12张图片

教师可增删改查课堂信息。

基于SSM+Vue的网络教学平台的设计与实现的设计与实现_第13张图片 

教师可增删改查签到信息

基于SSM+Vue的网络教学平台的设计与实现的设计与实现_第14张图片 

教师可增删改查试题信息。

基于SSM+Vue的网络教学平台的设计与实现的设计与实现_第15张图片 


四、核心代码

登录相关


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.MD5Util;
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().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().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().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 params,UserEntity user){
        EntityWrapper ew = new EntityWrapper();
    	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 ew = new EntityWrapper();
      	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().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);
        userService.updateById(user);//全部更新
        return R.ok();
    }

    /**
     * 删除
     */
    @RequestMapping("/delete")
    public R delete(@RequestBody Long[] ids){
        userService.deleteBatchIds(Arrays.asList(ids));
        return R.ok();
    }
}

文件上传

package com.controller;

import java.io.File;
import java.io.FileNotFoundException;
import java.io.IOException;
import java.util.Arrays;
import java.util.Date;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import java.util.Random;
import java.util.UUID;

import org.apache.commons.io.FileUtils;
import org.apache.commons.lang3.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpHeaders;
import org.springframework.http.HttpStatus;
import org.springframework.http.MediaType;
import org.springframework.http.ResponseEntity;
import org.springframework.util.ResourceUtils;
import org.springframework.web.bind.annotation.PathVariable;
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.RestController;
import org.springframework.web.multipart.MultipartFile;

import com.annotation.IgnoreAuth;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.entity.ConfigEntity;
import com.entity.EIException;
import com.service.ConfigService;
import com.utils.R;

/**
 * 上传文件映射表
 */
@RestController
@RequestMapping("file")
@SuppressWarnings({"unchecked","rawtypes"})
public class FileController{
	@Autowired
    private ConfigService configService;
	/**
	 * 上传文件
	 */
	@RequestMapping("/upload")
	public R upload(@RequestParam("file") MultipartFile file,String type) throws Exception {
		if (file.isEmpty()) {
			throw new EIException("上传文件不能为空");
		}
		String fileExt = file.getOriginalFilename().substring(file.getOriginalFilename().lastIndexOf(".")+1);
		File path = new File(ResourceUtils.getURL("classpath:static").getPath());
		if(!path.exists()) {
		    path = new File("");
		}
		File upload = new File(path.getAbsolutePath(),"/upload/");
		if(!upload.exists()) {
		    upload.mkdirs();
		}
		String fileName = new Date().getTime()+"."+fileExt;
		File dest = new File(upload.getAbsolutePath()+"/"+fileName);
		file.transferTo(dest);
		FileUtils.copyFile(dest, new File("C:\\Users\\Desktop\\jiadian\\springbootl7own\\src\\main\\resources\\static\\upload"+"/"+fileName));
		if(StringUtils.isNotBlank(type) && type.equals("1")) {
			ConfigEntity configEntity = configService.selectOne(new EntityWrapper().eq("name", "faceFile"));
			if(configEntity==null) {
				configEntity = new ConfigEntity();
				configEntity.setName("faceFile");
				configEntity.setValue(fileName);
			} else {
				configEntity.setValue(fileName);
			}
			configService.insertOrUpdate(configEntity);
		}
		return R.ok().put("file", fileName);
	}
	
	/**
	 * 下载文件
	 */
	@IgnoreAuth
	@RequestMapping("/download")
	public ResponseEntity download(@RequestParam String fileName) {
		try {
			File path = new File(ResourceUtils.getURL("classpath:static").getPath());
			if(!path.exists()) {
			    path = new File("");
			}
			File upload = new File(path.getAbsolutePath(),"/upload/");
			if(!upload.exists()) {
			    upload.mkdirs();
			}
			File file = new File(upload.getAbsolutePath()+"/"+fileName);
			if(file.exists()){
				/*if(!fileService.canRead(file, SessionManager.getSessionUser())){
					getResponse().sendError(403);
				}*/
				HttpHeaders headers = new HttpHeaders();
			    headers.setContentType(MediaType.APPLICATION_OCTET_STREAM);    
			    headers.setContentDispositionFormData("attachment", fileName);    
			    return new ResponseEntity(FileUtils.readFileToByteArray(file),headers, HttpStatus.CREATED);
			}
		} catch (IOException e) {
			e.printStackTrace();
		}
		return new ResponseEntity(HttpStatus.INTERNAL_SERVER_ERROR);
	}
	
}

封装

package com.utils;

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

/**
 * 返回数据
 */
public class R extends HashMap {
	private static final long serialVersionUID = 1L;
	
	public R() {
		put("code", 0);
	}
	
	public static R error() {
		return error(500, "未知异常,请联系管理员");
	}
	
	public static R error(String msg) {
		return error(500, msg);
	}
	
	public static R error(int code, String msg) {
		R r = new R();
		r.put("code", code);
		r.put("msg", msg);
		return r;
	}

	public static R ok(String msg) {
		R r = new R();
		r.put("msg", msg);
		return r;
	}
	
	public static R ok(Map map) {
		R r = new R();
		r.putAll(map);
		return r;
	}
	
	public static R ok() {
		return new R();
	}

	public R put(String key, Object value) {
		super.put(key, value);
		return this;
	}
}

五、总结

本次的系统开发,让我将之前所学知识(比如JAVA、MYSQL数据库等)联合了起来,融会贯通,得到了很大的提升。毕业设计是考验我们所学知识应用水平的时候,是对我们所学知识的应用巩固和提高的时刻。设计本网络教学平台的设计与实现是对我计算机知识的一次考验,更是对我运用相关知识解决处理现实问题能力的考验,让我通过本次设计开发得到锻炼,提高我的编程能力。尽管遇到了很多的困难,但经过不断的调试,最终圆满的完成了毕业设计。这次锻炼提高了我的实际应用水平,也大大提高了我的动手动脑能力,让我享受了探索的乐趣,成功的喜悦,这对我来说是一笔巨大的财富。

网络教学平台的设计与实现的设计与实现将大学期间所了解到的计算机工程理论知识运用到了本次设计当中来。对计算机的基础学问进行了加强,也加强了我的动手能力,从中学到很多在课堂上学不到的知识。通过本次软件的开发,我深深的认识到开发软件的辛苦,但也享受了解决问题后的喜悦心情,使我的独立思考问题的能力有所增强,同时也培养了我理论联系实际的能力,为今后的工作打下了良好的基础。

 

你可能感兴趣的:(vue.js,网络,前端,java,tomcat,spring,maven)