2系统开发环境
2.1vue技术
Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式JavaScript框架。 [5] 与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用（SPA）提供驱动
Vue.js目前最火的的一个前端框架，三大主流前端框架之一。
Vue.js是一套构建用户界面的框架（一套完整的解决方案，对项目侵入性大，中途 需要跟换框架则需要重构整个项目），只关注视图层，易上手，有配套的第三方类库。提高开发效率，帮助减少不必要的dom操作；双向数据绑定，通过框架提供的指 令，前端只需要关注业务逻辑，不再关心dom如何渲染。
2.2JAVA技术
Java编程语言具有跨平台、分布式、可移植等多种特性，很多平台Java都能运行，世界各地都能够运行Java编写的程序。1995年，开发出了JAVA编程语言。JAVA编程语言具有多种特性，例如：简单、安全、可移植、鲁棒性（Robust）、编写能效高、线程多等。在互联网飞速发展的时代，Java编程语言应用也越来越普遍[19]。它的特点具有：
一、面向对象：JAVA适用于分布式环境，JAVA能够完全面向对象，包括对象的设计及联系；
二、分布式：JAVA工作的同时，带动其他计算节点工作，只要有网络，就可以访问其他对象；
三、健壮性：JAVA能够自动处理垃圾和异常，并且机制类型强；
四、安全性：当指针和内存被删除时，非法的内存就可以避免。
2.3MYSQL数据库
数据库在每个网站的开发中都是必不可少的，过去数据库只具有数据的保存和管理功能，但随着后来的不断更新和迭代，目前的数据库不仅能够进行数据的处理，而且还能够储存不计其数的数据[20]。
该高校办公室行政事务管理系统所使用的就是MYSQL数据库，当初是微软公司开发出的MYSQL数据库。MYSQL数据库总共建立了十几个相对应的表，它们之间独立联系，数据库和程序是密不可分的[21]。
MYSQL数据库的特点包括：能够应用于多种操作系统中；查询SQL时优化了算法，搜索速度提高的不少；还可以进行数据库的管理、控制、优化等操作；一个数据库可以记录不计其数的数据。
2.4B/S结构
当前比较流行的网络化结构模式是B/S（浏览器/服务器）结构，它能够在服务器上面集中系统的所有核心功能，使系统开发人员的工作变得简单，并且开发出的系统也更容易使用和后期维护。用于比较熟悉的浏览器有360浏览器、谷歌浏览器、QQ浏览器等，用于比较熟悉的数据库有sqlserver、mysql数据库等，上边这些数据库和浏览器都可以安装在客户端上。B/S结构没有什么限制，并且还不需要专门的安装软件，只要笔记本、电脑有网络就能够访问系统。采用B/S结构开发的程序，比较好维护，只需要在客户端就可处理，不需要非得在服务器上处理，并且跟用户的交互性比较好，刷新浏览器就可进行数据信息的实时更新[22]。B/S架构如图2-1所示：

图2-1 B/S模式架构图
2.5SSM框架技术
该高校办公室行政事务管理系统是基于Spring、SpringMVC、Mybatis框架开发出来的。
2004年，Spring 框架才第一次亮相，后面也进行了很多次的更新。Spring框架包括SpringCore、Spring AOP、Spring ORM、Spring DAO、Spring Web Flow、Spring Context和Spring Web MVC等七个模块，企业应用程序就是通过这七个模块气筒不同的平台来进行开发的，Spring Web MVC中的各个元素之间形成了松散耦合[23-25]。

4系统设计
4.1系统概要设计
本文通过B/S结构(Browser/Server,浏览器/服务器结构)开发的该高校办公室行政事务管理系统，B/S结构的优点很多，例如：开发容易、强的共享性、便于维护等，只要有网络，用户可以随时随地进行使用。
系统工作原理如图4-1所示。

图4-1 系统工作原理图
4.2系统结构设计
系统结构设计就像一个树状结构一样，一个树干有很多分支，大任务相当于树干，小任务相当于树枝，只有需求分析信息弄清楚之后，才能保证每个小任务都能实现目标，对初步设计好的系统再进行不断优化，最终得到一个具体现实的系统结构。
管理员功能模块和用户功能模块是该高校办公室行政事务管理系统的两大部分，系统结构如图4-2所示。

图4-2 系统结构图
4.3 数据库设计
开发一个系统也需要提前设计数据库。这里的数据库是相关数据的集合，存储在一起的这些数据也是按照一定的组织方式进行的。目前，数据库能够服务于多种应用程序，则是源于它存储方式最佳，具备数据冗余率低的优势。虽然数据库为程序提供信息存储服务，但它与程序之间也可以保持较高的独立性。总而言之，数据库经历了很长一段时间的发展，从最初的不为人知，到现在的人尽皆知，其相关技术也越发成熟，同时也拥有着坚实的理论基础。
4.3.1 数据库概念设计
这部分内容需要借助数据库关系图来完成，也需要使用专门绘制数据库关系图的工具，比如Visio工具就可以设计E-R图（数据库关系图）。设计数据库，也需要按照设计的流程进行，首先还是要根据需求完成实体的确定，分析实体具有的特征，还有对实体间的关联关系进行确定。最后才是使用E-R模型的表示方法，绘制本系统的E-R图。不管是使用亿图软件，还是Visio工具，对于E-R模型的表示符号都一样，通常矩形代表实体，实体间存在的关系用菱形符号表示，实体的属性也就是实体的特征用符号椭圆表示。最后使用直线将矩形，菱形和椭圆等符号连接起来。接下来就开始对本系统的E-R图进行绘制。
（1）下图是会议室申请实体和其具备的属性。

图4.1 会议室申请实体属性图
（2）下图是教师实体和其具备的属性。

图4.2 教师实体属性图
（3）下图是字典表实体和其具备的属性。

图4.3 字典表实体属性图
（4）下图是办公物资实体和其具备的属性。

图4.4 办公物资实体属性图
（5）下图是办公物资申请实体和其具备的属性。

图4.5 办公物资申请实体属性图
（6）下图是会议室实体和其具备的属性。

图4.6 会议室实体属性图
（7）下图是请假申请实体和其具备的属性。

图4.7 请假申请实体属性图
（8）下图是离职申请实体和其具备的属性。

图4.8 离职申请实体属性图
（9）下图是办公室实体和其具备的属性。

图4.9 办公室实体属性图
（10）下图是办公室申请实体和其具备的属性。

图4.10 办公室申请实体属性图
（11）下图是印章实体和其具备的属性。

图4.11 印章实体属性图
（12）下图是印章添加申请实体和其具备的属性。

图4.12 印章添加申请实体属性图
（13）下图是用户表实体和其具备的属性。

图4.13 用户表实体属性图
（14）下图是印章申请实体和其具备的属性。

图4.14 印章申请实体属性图
4.2.1数据库表设计
采用MYSQL数据库对该高校办公室行政事务管理系统的数据进行存储，数据库中所包括的各个数据库表的详细信息如下所示：

表4.1办公室表
序号 列名 数据类型 说明 允许空
1 Id Int id 否
2 bangongshi_name String 办公室房间号 是
3 bangongshi_address String 详细地址 是
4 jiaoshi_id Integer 使用教师 是
5 create_time Date 创建时间 是
表4.2办公室申请表
序号 列名 数据类型 说明 允许空
1 Id Int id 否
2 jiaoshi_id Integer 申请教师 是
3 bangongshi_id Integer 申请办公室 是
4 insert_time Date 申请时间 是
5 bangongshi_shenqing_yesno_types Integer 申请结果 是
6 create_time Date 创建时间 是
表4.3办公物资表
序号 列名 数据类型 说明 允许空
1 Id Int id 否
2 bangongwuzi_uuid_number String 物资编号 是
3 bangongwuzi_name String 物资名称 是
4 bangongwuzi_types Integer 物资类型 是
5 jiaoshi_id Integer 使用教师 是
6 create_time Date 创建时间 是
表4.4办公物资申请表
序号 列名 数据类型 说明 允许空
1 Id Int id 否
2 jiaoshi_id Integer 申请教师 是
3 bangongshi_id Integer 申请办公物资 是
4 insert_time Date 申请时间 是
5 bangongwuzi_shenqing_yesno_types Integer 申请结果 是
6 create_time Date 创建时间 是
表4.5字典表表
序号 列名 数据类型 说明 允许空
1 Id Int id 否
2 dic_code String 字段 是
3 dic_name String 字段名 是
4 code_index Integer 编码 是
5 index_name String 编码名字 是
6 super_id Integer 父字段id 是
7 beizhu String 备注 是
8 create_time Date 创建时间 是
表4.6会议室表
序号 列名 数据类型 说明 允许空
1 Id Int id 否
2 huiyishi_uuid_number String 会议室编号 是
3 huiyishi_address String 会议室地址 是
4 huiyishi_size String 会议室大小 是
5 huiyishi_types Integer 会议室类型 是
6 zhuangtai_types Integer 会议室状态 是
7 create_time Date 创建时间 是
表4.7会议室申请表
序号 列名 数据类型 说明 允许空
1 Id Int id 否
2 jiaoshi_id Integer 申请教师 是
3 huiyishi_id Integer 申请办公物资 是
4 insert_time Date 申请时间 是
5 huiyishi_shenqing_yesno_types Integer 申请结果 是
6 create_time Date 创建时间 是
表4.8教师表
序号 列名 数据类型 说明 允许空
1 Id Int id 否
2 jiaoshi_name String 教师姓名 是
3 jiaoshi_id_number String 身份证号 是
4 jiaoshi_phone String 手机号 是
5 jiaoshi_photo String 照片 是
6 jiaoshi_delete Integer 假删 是
7 create_time Date 创建时间 是
表4.9离职申请表
序号 列名 数据类型 说明 允许空
1 Id Int id 否
2 jiaoshi_id Integer 申请教师 是
3 insert_time Date 离职申请时间 是
4 lizhi_content String 离职原因 是
5 jiaoshi_lizhi_yesno_types Integer 审核结果 是
6 create_time Date 创建时间 是
表4.10请假申请表
序号 列名 数据类型 说明 允许空
1 Id Int id 否
2 jiaoshi_id Integer 申请教师 是
3 insert_time Date 请假时间 是
4 qingjia_time Date 请假结束时间 是
5 jiaoshi_qingjia_yesno_types Integer 审核结果 是
6 qingjia_content String 请假原因 是
7 create_time Date 创建时间 是
表4.11印章表
序号 列名 数据类型 说明 允许空
1 Id Int id 否
2 yinzhang_uuid_number String 印章编号 是
3 yinzhang_name String 印章名称 是
4 create_time Date 创建时间 是
表4.12印章申请表
序号 列名 数据类型 说明 允许空
1 Id Int id 否
2 jiaoshi_id Integer 申请教师 是
3 yinzhang_id Integer 申请办公物资 是
4 insert_time Date 申请时间 是
5 yinzhang_shenqing_yesno_types Integer 申请结果 是
6 create_time Date 创建时间 是
表4.13印章添加申请表
序号 列名 数据类型 说明 允许空
1 Id Int id 否
2 jiaoshi_id Integer 申请教师 是
3 yinzhang_name String 印章名称 是
4 yinzhang_file String 材料 是
5 insert_time Date 申请时间 是
6 yinzhangadd_shenqing_yesno_types Integer 申请结果 是
7 yinzhang_shenqing_content String 添加原因 是
8 create_time Date 创建时间 是
表4.14用户表表
序号 列名 数据类型 说明 允许空
1 Id Int id 否
2 username String 用户名 是
3 password String 密码 是
4 role String 角色 是
5 addtime Date 新增时间 是