基于SpringBoot和Vue框架的教代会提案系统的设计与实现

颜治平

摘  要：教代会提案工作是高校民主管理的一个重要内容。在分析传统教代会提案工作现状的基础上，提出了高校教代会提案系统的需求分析，并予以设计实现。系统采用B/S架构，集中部署、分布使用，前端采用Vue框架实现，支持多种主流浏览器，后端采用SpringBoot、Mybatis-Plus等技术构建，采用Oracle数据库来实现数据管理。提案系统具有操作简单、使用方便、易于维护、扩展性强等特点，实现了教代会提案提交自主化、流程处理自动化、信息统计图表化，为高校工会加强教代会提案工作提供了强有力的信息化支持。

关键词：教代会;提案系统;SpringBoot;Vue

中图分类号：TP39          文献标志码：A         文章编号：2095-2945（2020）03-0091-04

Abstract： The proposal of the teachers' congress is an important part of the democratic management of colleges and universities. On the basis of analyzing the status quo of the work of the traditional teaching representative conference， the demand analysis of the proposal system of the college teachers' congress is put forward and designed and implemented. The system adopts B/S architecture， centralized deployment and distributed use. The front-end is implemented by Vue framework， supports a variety of mainstream browsers， and the back-end is built by SpringBoot and Mybatis-Plus technologies. The Oracle database is used to implement data management. The proposal system has the characteristics of simple operation， convenient use， easy maintenance， and strong expandability. It realizes the autonomy of the proposal of the representative conference， the automation of process processing， and the statisticalization of information statistics， which provides powerful information for the university trade unions to strengthen the proposal of the teaching representative conference.

Keywords： teachers' congress; proposal system; SpringBoot; Vue

高校教職工代表大会（教代会）是高校管理体制的一个重要组成部分，是在学校党委领导下，教职工群众发扬主人翁精神，行使民主权利，参与学校民主管理的重要形式。教育部于2012年1月1日起实施了《学校教职工代表大会规定》，要求各个高校每年至少召开一次教职工代表大会[1]。教代会的一项重要内容是处理教代会代表们的建议。教代会代表的建议一般是以提案的方式提交给教代会委员会[2]。传统意义的教代会每年只召开一次，教代会召开前收集代表提案，提案的答复及落实情况要等到下一年开会时反馈。提案以纸质方式提交，处理流程通过人工处理，这种提案处理方式需要投入大量的人力物力，处理周期长，时效性差，提案办结情况不透明[3]。

针对传统提案工作的各种缺点，本文设计并实现了基于SpringBoot和Vue框架的高校教代会提案系统，在原有的提案管理工作方法上，加以信息技术的辅助，这将大大提高教代会工作的效率，节省人力成本，有效地促进提案信息的透明、公开，也有利于促进学校民主管理功能。

1 系统分析

1.1 需求分析

在传统高校教代会一年一次召开的基本模式中，教代会代表在学校教代会会议召开前履行职责，提出一些提案，由于学校范围大，代表们碰头讨论比较困难，加上征集提案时间周期比较长等因素，导致提案的总量不大，提案水平参差不齐。对已处于办理阶段的提案没有很好的方式进行跟踪和监督，办理的结果也不能及时反馈给提案者，导致提案办理不流畅、提案办理结果不透明、提案办结时间过长[4]。针对这些问题，设计网上教代会提案管理平台，通过信息化的手段实现网上提案提交、代表附议、立案受理、分立承办、流程追踪、结果反馈等提案流程的自动化，并实现提案查询、分类、统计、分析等功能。

1.2 用户分析

根据系统需求分析，教代会提案系统应提供校内教职员工对已立案的提案进行查询的功能以及系统用户登录系统后对提案进行处理的功能。校内教职员工可以直接访问教代会提案系统网站，对历年的教代会提案进行浏览查询。在提案征集、提案立案、提案批示、提案承办、提案反馈等提案处理流程中，需要由不同权限的用户来进行流程处理。系统还需要管理员来对用户信息进行管理，对系统的代码进行维护。

通过上述分析，提案系统的用户可分为以下几类：

（1）系统管理员：主要负责创建用户的登录账号和登录密码，为用户分配系统使用权限，维护系统所需代码。

（2）教代会代表：负责起草教代会提案，提案附议，提交初审，提案反馈。

（3）教代会代表团团长：负责本代表团提案初审，提案提交。

（4）工作委员会秘书：负责提案流转。

（5）提案委员会主任：负责审查教代会提案，确定是否立案。

（6）校领导：负责提案批示，提案审阅。

（7）承办单位：根据主管校领导的批示，负责提案的承办。

（8）普通用户：浏览查询历年的教代会提案。

1.3 功能分析

提案办理的工作流程如图1所示。

图1 提案办理工作流程图

根据工作流程图可以得知，提案系统的功能主要包括：提案从起草、附议、初审、提交、立案、批示、承办、审阅、反馈等全周期处理流程，以及为用户提供提案信息的浏览查询。按照提案系统建设的总体原则和目标，根据需求调研的总结，教代会提案系统应主要包括以下几个功能：提案起草、提案附议、提案初审、提案提交、提案立案、领导批示、提案承办、领导审阅、提案反馈、提案处理满意度测评、提案浏览查询、系统管理等。

2 系统设计

2.1 设计目标

提案管理系统建成后，教代会提案办理将实现网上起草、网上附议、网上初审、网上提交、网上立案、网上批阅、网上交办、网上处理和网上公开，从而缩短空间和时间，将代表、提案、提案小组、校领导和行政部门通过网络紧密的联系在一起，提升工作效率，推进学校信息公开和电子政务的发展。

2.2 技术架构

提案系统利用成熟的网络条件和数据库技术，实现了教代会提案的无纸化，自动化，远程化。系统采用兼有开放性和稳定性特点的SpringBoot和Vue框架的开发模式[5]，可以加速系统的开发和扩展，具有维护和升级简单方便、成本低、数据安全、实时同步等优点，同时应用Elment UI使系统拥有良好的用户界面和良好的用户交互体验。

提案系统采用B/S架构，遵从MVC设计思想，并对系统做了详细的划分。因此本系统采用分层结构设计，系统既易于维护，又具有良好的扩展性。系统架构如图2所示，主要包括视图层、控制层、业务逻辑层、数据持久层[6]。通过分层，使得各层专注于本层工作，遵从开闭原则，便于修改和扩展。

图2 技术架构图

下面对各层进行简要介紹。

（1）视图层。本系统为B/S 架构的Web应用，可以通过浏览器直接访问。本层使用Vue和Element UI提供的样式，通过AJAX请求将请求数据传到控制层。

（2）控制层。主要使用Spring MVC 进行拦截，获取用户的请求访问，本层接收到前端传过来的数据后，通过@Autowired注入Service层进行业务逻辑处理。

（3）业务逻辑层。该层主要使用Spring 处理用户访问逻辑，完成各个模块之间的信息处理，并通过调用数据持久层的接口和相关映射XML文件进行数据库的操作。

（4）数据持久层。该层主要使用Mybatis Plus作为数据库访问框架。

（5）数据库。数据库采用Oracle。

2.3 功能模块设计

针对教代会提案系统的设计要求，并结合功能需求分析，对系统的功能进行了设计，划分为系统管理、提案流转、提案查询等三大模块。系统总体功能结构如图3所示。

2.4 增加时间提醒功能

系统对接学校的统一通信平台，通过短信或邮件的发送，增加办理时间提醒功能，将有效提高提案处理效率。时间提醒功能分为待办提醒和催办提醒。

系统用户在提交提案到下一节点办理时，可以选择待办提醒功能，系统在处理提交任务的同时，给下一节点办理用户自动发送待办短信或邮件，提醒用户及时进行办理。如果下一节点用户长时间未办理提案，用户可以进入系统使用催办提醒功能，系统向下一节点用户发送催办短信或邮件，催促用户尽快办理。通过时间提醒功能，可以激励各教代会代表履行好代表职责，促使业务职能部门加快提案的办理流程，整个提案处理流程会大大缩短时间周期。

3 系统实现

3.1 系统技术实现

根据以上的系统分析和系统设计，本文开发的提案管理系统采用Tomcat 9作为Web服务器，采用Oracle 11g数据库管理数据，系统结合了Vue.js前端框架和SpringBoot后端框架的前后端分离的组合架构，并应用JSON格式对前后端交互的数据进行封装，应用Shiro权限管理框架保障授权安全[7]，开发出基于Web的提案管理系统。

3.1.1 前端开发

前端基于Visual Studio Code搭建Vue开发环境。Vue.js是一套数据驱动的用于构建用户界面的，可以自底向上逐层应用的渐进式前端框架。相比于其他主流的JavaScript框架例如AngularJS或React等，Vue.js具有运行效率高、语法简洁、自身占用空间小、上手容易等特点[8]。在前端开发中，应用Elment UI组件进行页面的快速开发。Element UI是一套采用Vue 2.0作为基础框架实现的组件库，能帮助网站页面快速成型。

3.1.2 后端开发

后端使用IntelliJ IDEA 2017作为开发工具，使用SpringBoot来进行项目搭建，完成与前端页面及后台数据库的交互。Spring Boot简化Spring应用的初始搭建及开发过程，默认配置了很多框架的使用方式[9]。

系统使用SpringBoot整合Mybatis Plus进行数据操作[10]。MyBatis Plus是MyBatis 增强工具，在MyBatis 的基础上进行增强，简化开发，提高数据操作效率。后端还集成了Lombok注解、Log4J日志、Druid 数据库连接池等工具。

3.2 系统功能实现

3.2.1 提案管理界面实现

如图4所示，用户在提案管理界面，可以对自己相关的提案根据关键字进行查询，可以查看相关提案的详细信息和流程信息，处理当前流程节点在本人的提案。

3.2.2 提案统计功能实现

提案系统实现了用户需要的多种统计功能，并使用ECharts作为提案统计可视化的实现工具。如图5所示，展现了2019年教代会代表参与提案工作的分布情况。

图5 代表参与提案工作情况分布图

3.3 实际应用情况

提案系统上线后，有效提高了教代会提案的效率。2019年3月25日，学校发布提案征集的通知后，教代会代表们充分利用校园网的优势，利用该系统相互交流，一个月时间内，教代会代表提交有效提案33件，提案提交速度相比往年有较大的提升。

提案系统大大优化了教代会提案工作的操作流程，提高了教代会的管理水平，缩短了提案提交、代表附议、立案受理、分立承办、流程追踪、结果反馈的一系列流程的时间，提高了教代会的提案工作的实效性。同时提案系统为广大教职工提供所有提案的查询浏览，提高了教代会提案的透明度。实施信息化管理平台的优势体现在教代会代表提案的质量提升、各职能部门处理提案的满意度提升以及提案工作透明公开的效能提升。

4 结束语

本文分析传统提案方式效率低下，信息公开不足等问题，基于SpringBoot和Vue框架，設计了高校教代会提案系统，满足学校教代会代表及时提出想要反映的问题和现象的需求，通过提案的网上流转，能有效提高教代会提案的效率，通过提案结果的反馈及公开，能有效加强各职能部门对提案的重视，切实有效地解决提案中提出的问题。

参考文献：

[1]中华人民共和国教育部.学校教职工代表大会规定[EB/OL].http：//www.gov.cn/gongbao/content/2012/content_2161724.htm.2012.

[2]宋宇辉，林春梅.基于ASP.NET的高校教代会提案系统的研究与实现[J].信息与电脑（理论版），2018（1）：101-103.

[3]杨艳，陈晓勇.高校教代会提案管理系统分析与设计[J].天津科技，2017（11）：43-45.

[4]胡煜，延坤.OA系统对高校教代会提案工作的促进[J].新丝路（下旬），2016（10）：101-102.

[5]焦鹏珲.基于SpringBoot和Vue框架的电子招投标系统的设计与实现[D].南京：南京大学，2018.

[6]唐菁敏，高张宝.基于B/S架构的企业综合管理系统的研究与设计[J].信息技术，2019（3）：144-148.

[7]易文康，程骅，程耕国.Shiro框架在Web系统安全性上的改进与应用[J].计算机工程，2018（11）：135-139.

[8]何军，陈倩怡.Vue+Springboot+Mybatis开发消费管理系统[J].电脑编程技巧与维护，2019（2）：87-88+102.

[9]王丹，孙晓宇，杨路斌，等.基于SpringBoot的软件统计分析系统设计与实现[J].软件工程，2019（3）：40-42.

[10]黄伟.API服务中间件的设计与实现[D].成都：电子科技大学，2019.