文章仅展示部分内容，详细的毕设论文和演示视频源代码可以私信我的扣扣

毕 业 设 计（论 文）

题目：基于vue的程序设计课程可视化教学系统设计与实现

摘 要
使用旧方法对程序设计课程可视化教学信息进行系统化管理已经不再让人们信赖了，把现在的网络信息技术运用在程序设计课程可视化教学信息的管理上面可以解决许多信息管理上面的难题，比如处理数据时间很长，数据存在错误不能及时纠正等问题。
这次开发的基于vue的程序设计课程可视化教学系统管理员，教师，学生。管理员功能有个人中心，学生管理，教师管理，作业信息管理，学生选题管理，作业提交管理，管理员管理。教师发布作业，学生选择作业，然后进行提交作业，教师审批作业。经过前面自己查阅的网络知识，加上自己在学校课堂上学习的知识，决定开发系统选择B/S模式这种高效率的模式完成系统功能开发。这种模式让操作员基于浏览器的方式进行网站访问，采用的主流的Java语言这种面向对象的语言进行基于vue的程序设计课程可视化教学系统程序的开发，在数据库的选择上面，选择功能强大的MySQL数据库进行数据的存放操作。
基于vue的程序设计课程可视化教学系统被人们投放于现在的生活中进行使用，该款管理类软件就可以让管理人员处理信息的时间介于十几秒之间。在这十几秒内就能完成信息的编辑等操作。有了这样的管理软件，程序设计课程可视化教学信息的管理就离无纸化办公的目标更贴近了。

关键词：基于vue的程序设计课程可视化教学系统；Java；MySQL；SSM框架

Abstract
The use of the old method to systematically manage the visualized teaching information of programming courses is no longer trusted by people. Applying the current network information technology to the management of visualized teaching information of programming courses can solve many problems in information management, such as processing The data takes a long time, and data errors cannot be corrected in time.
The Vue-based programming course visualized teaching system administrators, teachers, and students developed this time. Administrator functions include personal center, student management, teacher management, homework information management, student topic selection management, homework submission management, and administrator management. The teacher posts the work, the students select the work, and then submit the work, and the teacher approves the work. After the network knowledge I checked before, plus the knowledge I learned in the school classroom, I decided to choose the B/S mode as a high-efficiency mode for the development system to complete the system function development. This mode allows the operator to access the website based on the browser. The mainstream Java language, an object-oriented language, is used for the development of the Vue-based programming course visual teaching system program. In the selection of the database, the selection is powerful. MySQL database for data storage operations.
The visual teaching system of programming courses based on Vue is put into use by people in their current lives. This management software can allow managers to process information within a dozen seconds. Information editing and other operations can be completed within these ten seconds. With such management software, the management of visualized teaching information for programming courses is closer to the goal of paperless office.
Key Words：Visual teaching system for programming courses based on vue; Java; MySQL; SSM framework

目 录
目 录 III
1 绪论 1
1.1 研究背景 1
1.2目的和意义 1
1.3 论文结构安排 2
2 相关技术 4
2.1 SSM框架介绍 4
2.2 VUE框架 4
2.3 MySQL数据库介绍 5
2.4 JAVA语言介绍 6
3 系统分析 7
3.1系统可行性分析 7
3.1.1 技术可行性分析 7
3.1.2 经济可行性分析 7
3.1.3 运行可行性分析 7
3.2系统性能分析 8
3.2.1 系统安全性 8
3.2.2 数据完整性 8
3.2.3系统可扩展性 9
3.3系统流程分析 9
3.3.1系统登录流程 10
3.3.2信息添加流程 11
3.3.3信息删除流程 11
4 系统设计 13
4.1系统概要设计 13
4.2系统功能结构设计 13
4.3数据库设计 14
4.3.1数据库E-R图设计 14
4.3.2 数据库表结构设计 15
5 系统实现 19
5.1 作业信息管理 19
5.2 学生选题管理 19
5.3 作业提交管理 20
5.4 作业审核管理 20
6系统测试 21
6.1 本系统测试  21
6.1.1登录功能测试 21
6.1.2修改密码功能测试 22
6.2测试结果分析 22
结 论 23
参考文献 25
致 谢 26

1 绪论
1.1 研究背景
现在大家正处于互联网加的时代，这个时代它就是一个信息内容无比丰富，信息处理与管理变得越加高效的网络化的时代，这个时代让大家的生活不仅变得更加地便利化，也让时间变得更加地宝贵化，因为每天的每分钟，每秒钟这些时间都能让人们处理大批量的日常事务，这些场景，是之前的手工模式无法与之相抗衡的。对于程序设计课程可视化教学信息的管理来说，传统的通过纸质文档记录信息的方式已经落后了，依靠手工管理这些信息，不仅花费较长的工作时间，在对记录各种信息的文档进行信息统计以及信息核对操作时，也不能及时保证信息的准确性，基于这样的办公低效率环境下，对于程序设计课程可视化教学信息的处理就要提出新的解决方案。因为这个时代的信息一直都在高速发展，要是不抱着发展的观念看待事情，极有可能被这个市场快速遗忘，甚至被无情地淘汰掉。所以尽早开发一款基于vue的程序设计课程可视化教学系统进行信息的快速处理，既跟上了时代的发展脚步，也能让自己的核心竞争力有所提升。
1.2目的和意义
互联网加的时代一方面是加快信息的发展，另一方面也是对传统行业进行筛选，能够继续发展的，肯定是那些能够充分运用互联网技术进行自身升级改革的行业。那些停步不前的行业只能就此结束，进而被大家所遗忘。这次设计出来的基于vue的程序设计课程可视化教学系统，它不仅能够让管理人员在信息增加，信息的编辑等事务处理上，节省很多的时间，也会砍掉一部分的人工成本，节省不必要开支的资金。另外，此系统的操作界面是可视化的界面，管理人员无需付费培训就能尽快上手。基于vue的程序设计课程可视化教学系统的开发意义如下：
1、管理人员再也不用在查询信息上花费大量宝贵的时间了，通过信息关键词字段就可以在几秒内获取需要的信息，在各种突发事件面前管理人员也不用慌张，可以从容淡定地处理各种相关信息。
2、该系统在每天的24小时期间都是不会停止服务的，只要有信息操作的需要，管理人员都能使用常用的360浏览器，或者百度浏览器，2345浏览器等大众浏览器都能登录系统，然后操作对应的功能。
3、有了这款信息管理类操作软件，所有需要进行处理的数据不用在纸质版本的文档上进行记载，而是基于电脑进行信息录入。
4、程序设计课程可视化教学信息都是通过网站进行显示，其实质是这些信息都保存在网站对应的数据库里面。只要操作员不去恶意删除信息，那么这些信息将会永久保存。
1.3 论文结构安排
编写基于vue的程序设计课程可视化教学系统相对应的论文，其实就是对开发完成的程序进行再次解读的过程。本论文从七个方面的内容讲解了开发的程序，具体内容如下：
第一个部分：就是论文的绪论，这个部分就是介绍在什么样的背景下开发的程序，以及这个程序开发出来具有什么意义等内容。
第二个部分：就是介绍开发这个程序使用了什么技术，使用什么数据库保存程序的数据信息，程序开发的语言是使用的什么语言等内容。
第三个部分：就是介绍这个程序开发在现实生活的可行性问题，也讲述了程序开发需要设置什么功能等内容。
第四个部分：就是已经知晓程序的大致功能，需要对程序的功能进行更为严格的细分，也需要出具相应的功能结构图，同时，也要设计程序对应的数据库，包括数据库里面的数据表的设计等内容。
第五个部分：就是在系统的编码阶段，需要使用编程语言完成程序的功能，完成程序的界面设计，最终以界面实现的效果图展示设计成果等内容。
第六个部分：就是程序已经完成了开发的前提之下，需要检测程序的各个模块是否衔接正常，程序各个功能能否在网络等一切外部条件正常的情况下运行，这期间要是出现任何错误都需要及时记录并在后期进行修补完善。
第七个部分：就是论文最后的总结部分，描述遇到的问题，采用的解决思路等内容。

2 相关技术
2.1 SSM框架介绍
SSM框架是有Spring+SpringMVC+MyBatis组成。
Spring
Spring是一个开源框架，Spring是于2003年兴起的一个轻量级的Java开发框架，由Rod Johnson在其著作Expert One-On-One J2EE Development and Design中阐述的部分理念和原型衍生而来。它是为了解决企业应用开发的复杂性而创建的。Spring使用基本的JavaBean来完成以前只可能由EJB完成的事情。然而，Spring的用途不仅限于服务器端的开发。从简单性、可测试性和松耦合的角度而言，任何Java应用都可以从Spring中受益。简单来说，Spring是一个轻量级的控制反转(IoC)和面向切面(AOP)的容器框架。
SpringMVC
Spring MVC属于SpringFrameWork的后续产品，已经融合在Spring Web Flow里面。Spring MVC分离了控制器、模型对象、分派器以及处理程序对象的角色，这种分离让它们更容易进行定制。
MyBatis
MyBatis本是apache的一个开源项目iBatis,2010年这个项目由apache software foundation迁移到了google code，并且改名为MyBatis。MyBatis是一个基于Java的持久层框架。iBATIS提供的持久层框架包括SQL Maps和Data Access Objects(DAO)MyBatis消除了几乎所有的JDBC代码和参数的手工设置以及结果集的检索。MyBatis使用简单的XML或注解用于配置和原始映射，将接口和Java的POJOs(Plain Old Java Objects，普通的Java对象)映射成数据库中的记录。
2.2 VUE框架
Vue.js（读音 /vjuː/, 类似于 view） 是一套构建用户界面的渐进式框架。
Vue 只关注视图层， 采用自底向上增量开发的设计。
Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
2.3 MySQL数据库介绍
有了程序功能的操作，也需要对程序操作的各个功能所产生的数据信息存放在一个固定的仓库里面，这个所谓的仓库就是大家最熟悉的程序开发需要使用的数据库了，数据库能够发展到至今的模样，其实也是经历了很多的变化历程的，在最开始由于数据信息处理的需要开始推出最低级的数据管理，这个阶段也是数据库早期的人工管理的阶段，后来也经历了文件管理的阶段，这个阶段的数据管理因为信息不能够进行共享，加上管理的数据对配套的程序产生了较强的依赖性，在数据信息管理上也存在很多数据的重复记载造成数据冗余等问题。所以为了解决上述一系列文件管理阶段所产生的数据管理的问题，对数据管理方式进行了全方位的升级改造，也就让数据管理进入了一个全新的阶段——数据库系统的阶段。这个阶段也是数据库管理数据的一个全新的相当高级的阶段。
说到数据库，也不得不说数据库的模型，数据库拥有的数据模型有网状，还有层次，以及关系型这三样数据库模型。网状的结构就是把记录的每条信息都比喻成一个点，点跟点之间也有联系，最终就形成了一个像网一样的结构，就是所谓的网状数据模型。也有对数据记录使用树状结构的方式进行数据保存，这个就是层次数据模型，关系数据库模型运用在现在市面上常见的数据库当中了，像本系统开发使用的MySQL数据库，还有安装过程比较复杂的Sqlserver数据库，也有一些比较小巧的关系型数据库，像Access数据库，FoxPro数据库等数据库。这样的关系型数据库将数据表里面的行还有列进行相互关联形成一个二维矩阵的方式来保存程序所产生的数据信息。
本次之所以选择MySQL数据库来当程序数据存放的仓库，则是因为此数据库安装不用费时，也不需要各种百度信息去解决安装过程中出现的任何问题，而且由于自己的电脑内存比较小，才4个G，为了更好的开发项目程序，针对低配置的电脑选择MySQL数据库也是情理之中。
2.4 JAVA语言介绍
在1995年这一年的5月份，著名的Sun Microsystems公司在程序开发设计上面郑重推出一种面向对象开发的程序设计语言——Java，最开始的时候Java是由詹姆斯.高斯林这位伟大的JAVA之父来进行主导，但是在后来由于各种原因，让甲骨文公司这个针对商业程序创建了oracle大型数据库的公司收购了Java。Java的平台总共算下来有3个，分别为javaME和javaSE以及javaEE这3个java平台。下面将对其进行分别介绍。
1.在电脑桌面程序的开发上面需要选择JavaME，这个用得也比较多。
2.企业也会根据工作以及业务需要开发各种软件，那么就会选用JavcEE这个支持企业版软件的开发的Java平台，JavcEE主攻运用在企业领域上面的web应用，JavcEE也在javaSE的基础上获得了比如jsp技术 ，Servlet技术等程序开发技术的支持。
3.现在生活中手机的普及化，也使得手机端这样的移动设备的软件的兴起，JavaME这个迷你版java平台就能运用于移动端的软件开发操作。