基于SpringBoot+Vue健美操评分系统的设计与实现

文末获取联系

开发语言:Java

使用框架:spring boot

前端技术:Vue 、css、element-ui、js

开发工具:IDEA/MyEclipse/Eclipse、Visual Studio Code

数据库:MySQL 5.7/8.0

数据库管理工具:phpstudy/Navicat

JDK版本:jdk1.8

Maven:apache-maven 3.8.1-bin

项目介绍: 

健美操评分系统采用B/S架构,数据库是MySQL。系统的搭建与开发采用了先进的JAVA进行编写,使用了springboot框架。该系统从三个对象:由管理员、裁判员和用户来对系统进行设计构建。主要功能包括首页,个人中心,裁判员管理,用户管理,视频分类管理,健美操管理,评分管理,系统管理等功能进行管理。本系统在一般健美操评分系统的基础上增加了健美操资讯的功能,方便用户快速浏览,是一个高效的、动态的、交互友好的健美操评分系统。

本系统采用的数据库是MySQL,使用java技术开发。在设计过程中,很好地发挥了该开发方式的优势,让实现代码有了良好的可读性,而且使代码的更新和维护更加的方便,操作方便,对以后的维护减少了很多麻烦。系统的顺利开发和实现,对于健美操评分这一方面提供巨大的便利服务,对管理员、裁判员和用户带来了极大的便利,方便大众,为社会的进步与发展提供了一些动力。

功能介绍: 

系统按照用户的实际需求开发而来,贴近生活。从管理员通过正确的账号的密码进入系统,可以使用相关的系统应用。管理员总体负责整体系统的运行维护,统筹协调。

系统整体模块设计:系统分为管理员、裁判员和用户三大角色,系统管理员有最大的权限,整体功能展示如图4-3所示。

部分截图说明: 

系统功能实现

当人们打开系统的网址后,首先看到的就是首页界面。在这里,人们能够看到健美操评分系统的导航条。系统首页界面如图5-1所示:

图5-1 系统首页界面

系统注册:在系统注册页面输入用户注册信息进行注册操作;系统注册页面如图如图5-2所示:

图5-2系统注册页面

健美操:在健美操页面的输入栏中输入视频标题,视频分类进行查询;可以查看健美操详细信息,还可以进行收藏,点赞,评论操作;健美操页面如图5-3所示:

图5-3健美操详细页面

个人中心:在个人中心页面通过填写个人详细信息进行信息更新操作,还可以对我的收藏进行详细操作;如图5-4所示:

图5-4个人中心界面

后台功能实现

管理员功能实现

后台登录,在登录页面选择需要登录的角色,在正确输入用户名和密码后,进入操作系统进行操作;如图5-5所示。

图5-5后台登录界面

管理员进入主界面,主要功能包括对首页,个人中心,裁判员管理,用户管理,视频分类管理,健美操管理,评分管理,系统管理等进行操作。管理员主界面如图5-6所示:

图5-6 管理员主界面

管理员点击用户管理。在用户页面输入用户名进行查询,新增或删除用户列表,并根据需要对用户详情信息进行详情,修改或删除操作;如图5-7所示:

图5-7用户管理界面

管理员点击裁判员管理。在裁判员页面输入裁判账号进行查询,新增或删除裁判员列表,并根据需要对裁判员详情信息进行详情,修改或删除操作;如图5-8所示:

图5-8裁判员管理界面

管理员点击视频分类管理。在视频分类页面输入视频分类进行查询,新增或删除视频分类列表,并根据需要对视频分类详情信息进行详情,修改或删除操作;如图5-9所示:

 

图5-9视频分类管理界面

管理员点击健美操管理。在健美操页面输入视频标题,视频分类进行查询,新增或删除健美操列表,并根据需要对健美操详细信息进行详情,修改,查看评论或删除操作,如图5-10所示:

图5-10健美操管理界面

管理员点击评分管理。在评分管理页面输入视频标题,视频分类进行查询,新增或删除评分管理列表,并根据需要对评分详细信息进行详情,修改或删除操作,如图5-11所示:

图5-11健美操管理界面

用户功能实现

用户进入主界面,主要功能包括对首页,个人中心,健美操管理,评分管理等进行操作。用户主界面如图5-12所示:

图5-12用户主界面

裁判员功能实现

裁判员进入主界面,主要功能包括对首页,个人中心,健美操管理,评分管理等进行操作。裁判员主界面如图5-13所示:

图5-13 裁判员主界面

部分代码: 

/**
 * 上传文件映射表
 */
@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);
		if(StringUtils.isNotBlank(type) && type.equals("1")) {
			ConfigEntity configEntity = configService.selectOne(new EntityWrapper<ConfigEntity>().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<byte[]> 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<byte[]>(FileUtils.readFileToByteArray(file),headers, HttpStatus.CREATED);
			}
		} catch (IOException e) {
			e.printStackTrace();
		}
		return new ResponseEntity<byte[]>(HttpStatus.INTERNAL_SERVER_ERROR);
	}
	
}