@TOC
ssm458实验室管理与排课系统+vue
第1章 绪论
1.1 课题背景
二十一世纪互联网的出现，改变了几千年以来人们的生活，不仅仅是生活物资的丰富，还有精神层次的丰富。时代进步的标志，就是让人们过上更好的生活。在互联网诞生之前，地域位置往往是人们思想上不可跨域的鸿沟，信息的传播速度极慢，信息处理的速度和要求还是通过人们骑马或者是信鸽传递，这些信息传递都是不可控制的，中间很有可能丢失，信息的传递水平决定了人们生活的水平。现如今，大家都在用互联网来实现自己的目的，从内部管理设置计算机管理，提高内部信息管理水平，从外部市场也可以用计算机获取相关数据进行处理，如今各行各业已经严重依赖于计算机了。
本课题研究和开发实验室管理与排课系统，让安装在计算机上的该系统变成管理人员的小帮手，提高实验室信息与排课信息处理速度，规范实验室信息与排课信息处理流程，让管理人员的产出效益更高。
1.2 课题意义
传统处理数据，必须是一张张纸，然后处理完毕又是统计在一张张纸上面，不断的重复处理，最终有个结果给最高层作为参考，这个模式在互联网没有出现之前，是一种常见的事情，信息管理的效率提不上去，那就用人才，人多力量大，是一个以前人们的常识。计算机的诞生就是发现了人多力量大的不足，比如高端计算人才的培养已经跟不上使用了，所以人们研究出专门帮助人们计算的机器，就是计算机的前身，到了互联网时代，人们发现完全可以让程序供应商提供解决方案，自己挑选自己合适的方案来提高自己的产出比。于是市面上就出现了各种各样的依靠程序处理信息的解决方案。
本课题研发的实验室管理与排课系统，就是提供实验室信息与排课信息处理的解决方案，它可以短时间处理完信息，并且只需要使用者动动鼠标和键盘就能获取自己需要的信息，并且这些信息都有专门的存储设备，而且数据的备份和迁移都可以设定为无人值守，从人力角度和信息处理角度以及信息安全角度，实验室管理与排课系统是完胜传统纸质操作的，所以实验室管理与排课系统就是如此的值得信赖。
1.3 研究内容
本文对实验室管理与排课系统的设计与实现分成六个章节进行描述。
第1章：研究实验室管理与排课系统的背景，以及开发实验室管理与排课系统的意义。
第2章：对开发实验室管理与排课系统的环境还有技术进行说明。
第3章：分析实验室管理与排课系统的可行性，性能，流程以及功能。
第4章：设计实验室管理与排课系统的功能结构，设计数据库E-R图以及对数据表的存储结构进行设计。
第5章：实现实验室管理与排课系统的功能并进行功能界面展示。
第6章：对系统测试进行阐述，以及对本系统部分功能进行检测。
第2章 开发环境与技术
本章节对开发实验室管理与排课系统需要搭建的开发环境，还有实验室管理与排课系统开发中使用的编程技术等进行阐述。
2.1 Java语言
Java语言是当今为止依然在编程语言行业具有生命力的常青树之一。Java语言最原始的诞生，不仅仅是创造者感觉C语言在编程上面很麻烦，如果只是专注于业务逻辑的处理，会导致忽略了各种指针以及垃圾回收这些操作，导致出现问题需要解决的时间往往大于正常编程处理业务逻辑的时间，这些是非常浪费时间的。Java语言的创造者就完美的解决了这个问题，把指针处理和垃圾处理全部自动化，虽然这会损失一些性能，但是随着计算机硬件的不断发展，这些性能是可以忽略考虑的。并且C语言是针对硬件开发的语言，在符合条件的硬件上面进行编程可以最大化利用硬件的性能，但是随着硬件的变化或者操作系统的变更，如果还是用C语言的话需要对整个程序进行重新编程，只有随着市场变化而变化的语言才是符合潮流，符合生存规律的语言。Java语言的创造者就针对C语言的缺点专门开发了Java语言。让Java语言不管是在什么样的环境里都是可以运行，因为在Java语言运行外面套了一个壳，也就是虚拟机，只要是Java虚拟机能安装的电脑都可以运行Java的程序。
2.2 MYSQL数据库
MySQL数据库是关系型数据库的一种，也是传统的行式数据模式，获取一些数据是先一行一行的获取，然后一行一行的显示，与最近大数据兴起的列式数据库有着明显的不同。行式数据库主要是处理最重要的数据逻辑部分，并且必须是有效数据，这样每一处的数据关联都是不可损坏，如果对数据安全性比较高的肯定是需要选择MySQL数据库，列式数据库的发明仅仅是因为读取效率高，与传统的MySQL数据库比起来在数据写入方面并不会高明到哪里。MySQL虽然比起oracle或者SQL SERVER来讲，安装包只是几十兆甚至几百兆，有点小，但是功能并不会弱到哪里，严格遵循SQL标准语法。MySQL的数据存放形式从大向小的说是数据库最大，然后是表，每个表里面存放数据是有一定的规则的，数据存放是表格形式的，也就是说有横也有竖，横着的为行，一般表示一条数据，每个表都有字段，而字段是以列的形式存在，这样能保证一条数据每一个字段对应的是相同数据类型的数据。表与表之间还可以进行关联，进行分表操作，如果一条数据相关项目属性太多，那么可以把有效的相关联系做成关联，可以设定是否唯一。
2.3 IDEA开发工具
IDEA是捷克共和国的Java程序员开发人员创造的一个开发软件，刚开始主要是对于用Eclipse软件他们用得不顺手，所以直接开发了这款软件。之所以不顺手原因在于没有代码提升功能，原因是Eclipse只是把代码提示作为一种插件形式的存在，如果有些程序开发人员不清楚代码提示插件可能会出问题，并且代码提示只是用来作为插件，所以功能上有所欠缺。IDEA不仅仅代码提示做的很好，在代码重构上面更上如虎添翼，程序开发人员可以选择一段代码然后IDEA就会对代码进行分解重构，有效的把代码弄得更够层次感，复用性更高，用着更简洁和方便，大大的减少了代码工作量，提升了代码开发效率。当然，IDEA对于使用者这么好，肯定也是有目的的，原因在于插件越多越友好，就需要花费大量的金钱来使用，所以说IDEA使用主要是看自己喜好。
2.4 Spring Boot框架
Spring Boot是一种不需要代码生成的一种框架，并且可以不需要配置任何的XML文件就可以，因为Spring Boot里面自带了很多接口，只需要配置不同的接口就会自动的应用并且识别需要的依赖，在配置方面非常的方便，使用起来感觉像没有用到框架的感觉。Spring Boot有很多默认的配置文件，并且可以对默认的配置文件进行修改，可以设置为自动加载，可以对异常处理分为全局异常处理和默认异常处理。Spring Boot使用过程中就像是使用什么直接注册什么，所谓的注册也就是在对应的类和方法上面进行一个特殊的声明即可。
第3章 系统分析
本文作者在确定了研究的课题之后，从各大数字图书馆下载文献来阅读，并了解同类型的网站具备的大致功能，然后与本系统用户的实际需求结合进行分析，得出本系统要研究的具体功能与性能。虽然分析系统这一阶段性工作主要是确定功能，但它却影响着后面系统开发环节的进展，它也是系统开发流程中比较重要的一个环节。
3.1 可行性分析
以下部分是从三个角度来进行可行性分析，确保开发成功的前提是有可行性分析，只有进行提前分析，符合程序开发流程才不至于开发过程的中断。
3.1.1 技术可行性
在技术实现层次，分析了好几种技术实现方法，并且都有对应的成功案例，也有很多开源模块可以进行参考，所以从技术可行性分析来讲，实现实验室管理与排课系统是没有问题的。
3.1.2 经济可行性
对于身为学生的开发者而言，在经济资源上面可用者很少，为了开发实验室管理与排课系统，通过从技术分析发现可以用自己用的电脑进行开发，并且学校机房的配置也可以达到要求。最重要的是技术资源一般都是开源免费使用的，因此得出结论，经济方面是具有可行性的。
3.1.3 操作可行性
实验室管理与排课系统的具体实现，本身参考人类的正常操作逻辑，把常用的操作习惯当做主要的导航实现，可以让使用者更快速的理解并且上手操作，实现符合逻辑的操作流程是操作可行性的具体体现。
以上就是从不同的角度来分析，确保了实验室管理与排课系统的正常开展。
3.2 系统流程
实验室管理与排课系统投入使用后，其各个功能的内部操作逻辑需要使用者通过流程图来进行了解。
3.2.1 操作流程
使用者在操作实验室管理与排课系统中，应该按照本系统提供的操作流程（图3.1即为本系统的操作流程图）进行操作，这样可以减少使用者操作中出现的错误，从而节省进入实验室管理与排课系统的时间。
图3.1 系统操作流程
3.2.2 登录流程
实验室管理与排课系统通过登录功能（图3.2即为其登录的流程）引导使用者进入指定的功能操作区，也避免非本系统的用户享受本系统提供的服务以及查看本系统提供的信息，从而保障本系统用户的安全使用。
图3.2 登录流程
3.2.3 删除信息流程
实验室管理与排课系统在经过长期使用后，会产生很多的数据信息。为了腾出存储空间存放更多的数据，本系统数据库中存储的数据，一些没有参考价值的数据需要进行删除（图3.3即为删除信息的流程），删除数据过程中，为避免误删，使用者要根据系统的提示来决定是否删除数据。
图3.3 删除信息流程
3.2.4 添加信息流程
实验室管理与排课系统提供可视化的功能操作区，非常方便使用者进行数据操作，当使用者往系统中录入数据时（图3.4即为添加信息的流程），本系统也会进行数据合法性的判断，符合要求的数据才能够在数据库指定表中进行登记。
图3.4 添加信息流程
3.3 性能需求
在需求分析中就应该对项目所需服务器性能进行分析，这样才符合正常的分析流程。只谈功能需求不谈性能需求，是一件很严重的事情，可能会导致使用过程中出现一系列不可预测的问题，所以性能需求也是需要考虑的重要项。
下面就是从几个方面来进行系统的性能分析，从每个角度来分析系统性能。
(1)系统数据的容量：从数据角度来分析，每个表和每个数据库，达到的数据量到一定的程度，是否需要分表或者是分库，超过了数据的设定限度，可能会导致数据反映迟钝，容错量增加。
(2)数据精度的要求：需要对需求分析里面数据设定环节，考虑相应的数据精度问题，需要发现数据是常用的精度还是非常用的精度，进而设定不同的数值。数据的精度问题，会直接导致设计的性能问题。
(3)时间响应要求：从用户提交操作，到页面反映，中间有个数据处理的问题，如果数据量大，那么考虑索引问题和分库问题，数据量再大就要考虑增加列式数据库的问题，这些都要根据数据量的增加以及逻辑的严密性来进行判断，才能符合用户的要求，毕竟响应时间太久操作起来也不舒服。
系统的性能需求从业务需求之初就能大致了解到性能需求相关的概念，再从系统性能需求来逐条实现，可以让设计的系统有使用价值。
3.4 功能需求
实验室管理与排课系统根据使用权限的角度进行功能分析，并运用用例图来展示各个权限需要操作的功能。
图3.5即为管理员用例图，管理员权限操作的功能包括管理设备借出，设备损坏的信息，管理实验室以及实验室排课的信息，管理实验台以及实验台使用记录信息等。
图3.5 管理员用例图
图3.6即为老师用例图，老师权限操作的功能包括对设备，实验台，实验室，学生出勤，学生成绩等信息的管理。
图3.6 老师用例图
图3.7即为学生用例图，学生权限操作的功能包括查看成绩，查看实验室排课信息，管理学生出勤信息等。
图3.7 学生用例图
第4章 系统设计
系统的设计一切都是为了用户的使用，虽然用户使用过程中可能只是面对着浏览器进行各种操作，但是不代表着系统对于用户在浏览器上的操作不进行处理，所以说，设计一个系统需要考虑到方方面面。
4.1 功能结构设计
图4.1即为设计的管理员功能结构，管理员权限操作的功能包括管理设备借出，设备损坏的信息，管理实验室以及实验室排课的信息，管理实验台以及实验台使用记录信息等。
图4.1 管理员功能结构
图4.2即为设计的老师功能结构，老师权限操作的功能包括对设备，实验台，实验室，学生出勤，学生成绩等信息的管理。
图4.2 老师功能结构
图4.3即为设计的学生功能结构，学生权限操作的功能包括查看成绩，查看实验室排课信息，管理学生出勤信息等。
图4.3 学生功能结构
4.2 数据库设计
实验室管理与排课系统运行中产生的数据需要按照提前设置的存储规则进行保存，而这个存储规则则是在数据库的设计中进行设置的。通常情况下，为了更好的配合系统运行，也要给用户带来良好的使用体验，设计一个很好的数据库是必须的，因为它能减少用户的等待时间，还可以对系统的请求在最短时间内进行响应。所以，对数据库设计时，需要花费一定的时间来分析系统对于数据存储的要求以及存储的具体数据，然后设计具体的存储规则，保证数据库能够对系统的各种数据请求进行及时回应，缩短数据处理时间，并在一定程度上降低数据冗余，节省存储空间。
4.2.1 数据库概念设计
实体-联系图还有一个名称即E-R图，是Entity Relationship Diagram各英文单词首字母的缩写，它这种概念模型通常用于对现实世界进行描述。同时它还是一种能够直观表达数据中实体，联系，属性的有效手段。绘制E-R图能够选择的工具也有很多，但是Office Visio 这款软件在E-R图的绘制上一般都是作为首选工具，因为它是基于可视化处理，使用它创建E-R图非常简单。使用基本的E-R图构成元素，比如椭圆，菱形，矩形，还有实线段来表达对应的信息，椭圆代表属性，即实体的特征，矩形代表实体，即数据库中的一个具体数据表，菱形代表实体中相互关系，实线段主要是完成椭圆，矩形，菱形的连接，基于这样的方式即可完成对本系统的E-R图进行完整绘制。
（1）图4.4即为实验室排课这个实体所拥有的属性值。
图4.4 实验室排课实体属性图
（2）图4.5即为成绩这个实体所拥有的属性值。
图4.5 成绩实体属性图
（3）图4.6即为学生这个实体所拥有的属性值。
图4.6 学生实体属性图
- 图4.7即为管理员这个实体所拥有的属性值。
图4.7 管理员实体属性图
- 图4.8即为上面介绍的实体中存在的联系。
图4.8 实体间关系E-R图
4.2.2 数据库物理设计
本小节主要任务即是根据上述内容进行数据存储结构的设计，也就是在数据库中设计存放本系统的数据的数据表，设计数据表时，需要对各个字段进行确定，通常来说，一个实体与一张数据表相对应，实体的属性就用来表示字段名称，不同的字段表示的数据类型以及取值都不相同，这里需要根据系统实际数据的情况进行设置，同时也需要在具体表中确定该表的主键，以及该表各个字段是否能够保持空等进行说明，设计完成一张数据表的结构之后，在保存时同样要命名，尽量选择英文名称进行命名并保存，方便今后系统对数据表进行数据存储访问时，在提高数据存储效率的同时，还不容易导致系统出错。接下来就对设计的数据表进行展示。
表4.1 成绩表
| 字段 | 注释 | 类型 | 空 |
|---|---|---|---|
| id (主键) | 主键 | int(11) | 否 |
| xuesheng_id | 学生 | int(11) | 是 |
| shiyanshipaike_id | 实验室排课 | int(11) | 是 |
| chengji_leixing_types | 类型 | int(11) | 是 |
| chengji_number | 分数 | int(11) | 是 |
| chengji_time | 考试时间 | timestamp | 是 |
| insert_time | 录入时间 | timestamp | 是 |
| create_time | 创建时间 | timestamp | 是 |
表4.2 老师表
| 字段 | 注释 | 类型 | 空 |
|---|---|---|---|
| id (主键) | 主键 | int(11) | 否 |
| username | 账户 | varchar(200) | 是 |
| password | 密码 | varchar(200) | 是 |
| laoshi_uuid_number | 工号 | varchar(200) | 是 |
| laoshi_name | 老师姓名 | varchar(200) | 是 |
| laoshi_phone | 老师手机号 | varchar(200) | 是 |
| laoshi_photo | 老师头像 | varchar(200) | 是 |
| sex_types | 性别 | int(11) | 是 |
| laoshi_content | 老师介绍 | text | 是 |
| laoshi_email | 电子邮箱 | varchar(200) | 是 |
| create_time | 创建时间 | timestamp | 是 |
表4.3 设备表
| 字段 | 注释 | 类型 | 空 |
|---|---|---|---|
| id (主键) | 主键 | int(11) | 否 |
| shiyanshi_id | 实验室 | int(11) | 是 |
| shebei_name | 设备名称 | varchar(200) | 是 |
| shebei_types | 设备类型 | int(11) | 是 |
| shebei_number | 设备数量 | int(11) | 是 |
| shebei_content | 设备介绍 | text | 是 |
| insert_time | 添加时间 | timestamp | 是 |
| create_time | 创建时间 | timestamp | 是 |
表4.4 设备借出表
| 字段 | 注释 | 类型 | 空 |
|---|---|---|---|
| id (主键) | 主键 | int(11) | 否 |
| shebei_id | 设备 | int(11) | 是 |
| xuesheng_id | 学生 | int(11) | 是 |
| shebeijiechu_number | 借出数量 | int(11) | 是 |
| shebeijiechu_content | 备注 | text | 是 |
| jiechu_time | 借出时间 | timestamp | 是 |
| guihuan_time | 归还时间 | timestamp | 是 |
| insert_time | 添加时间 | timestamp | 是 |
| create_time | 创建时间 | timestamp | 是 |
表4.5 设备损坏表
| 字段 | 注释 | 类型 | 空 |
|---|---|---|---|
| id (主键) | 主键 | int(11) | 否 |
| shebei_id | 设备 | int(11) | 是 |
| shebeisunhuai_number | 设备损坏数量 | int(11) | 是 |
| shebeisunhuai_content | 备注 | text | 是 |
| insert_time | 报损时间 | timestamp | 是 |
| create_time | 创建时间 | timestamp | 是 |
表4.6 实验室表
| 字段 | 注释 | 类型 | 空 |
|---|---|---|---|
| id (主键) | 主键 | int(11) | 否 |
| shiyanshi_uuid_number | 实验室编号 | varchar(200) | 是 |
| shiyanshi_weizhi | 所在位置 | varchar(200) | 是 |
| shiyanshi_renshu | 容纳人数 | int(11) | 是 |
| shiyanshikemu_types | 实验科目 | int(11) | 是 |
| shiyanshi_content | 实验室介绍 | text | 是 |
| create_time | 创建时间 | timestamp | 是 |
表4.7 实验室排课表
| 字段 | 注释 | 类型 | 空 |
|---|---|---|---|
| id (主键) | 主键 | int(11) | 否 |
| shiyanshi_id | 实验室 | int(11) | 是 |
| laoshi_id | 老师 | int(11) | 是 |
| banji_types | 班级 | int(11) | 是 |
| xingqi_types | 星期 | int(11) | 是 |
| jieshu_types | 节数 | int(11) | 是 |
| insert_time | 添加时间 | timestamp | 是 |
| create_time | 创建时间 | timestamp | 是 |
表4.8 实验台表
| 字段 | 注释 | 类型 | 空 |
|---|---|---|---|
| id (主键) | 主键 | int(11) | 否 |
| shiyanshi_id | 实验台 | int(11) | 是 |
| shiyantai_bianhao | 实验台编号 | varchar(200) | 是 |
| shiyantai_name | 实验台名称 | varchar(200) | 是 |
| shiyantai_weizhi | 所在位置 | varchar(200) | 是 |
| shiyantai_content | 备注 | text | 是 |
| insert_time | 添加时间 | timestamp | 是 |
| create_time | 创建时间 | timestamp | 是 |
表4.9 实验台使用记录表
| 字段 | 注释 | 类型 | 空 |
|---|---|---|---|
| id (主键) | 主键 | int(11) | 否 |
| shiyantai_id | 实验台 | int(11) | 是 |
| xuesheng_id | 学生 | int(11) | 是 |
| shiyantaishiyong_content | 备注 | text | 是 |
| insert_time | 使用时间 | timestamp | 是 |
| create_time | 创建时间 | timestamp | 是 |
表4.10 管理员表
| 字段 | 注释 | 类型 | 空 |
|---|---|---|---|
| id (主键) | 主键 | bigint(20) | 否 |
| username | 用户名 | varchar(100) | 否 |
| password | 密码 | varchar(100) | 否 |
| role | 角色 | varchar(100) | 是 |
| addtime | 新增时间 | timestamp | 否 |
表4.11 学生表
| 字段 | 注释 | 类型 | 空 |
|---|---|---|---|
| id (主键) | 主键 | int(11) | 否 |
| username | 账户 | varchar(200) | 是 |
| password | 密码 | varchar(200) | 是 |
| xuesheng_uuid_number | 学号 | varchar(200) | 是 |
| xuesheng_name | 学生姓名 | varchar(200) | 是 |
| xuesheng_phone | 学生手机号 | varchar(200) | 是 |
| xuesheng_photo | 学生头像 | varchar(200) | 是 |
| sex_types | 性别 | int(11) | 是 |
| banji_types | 班级 | int(11) | 是 |
| xuesheng_content | 学生介绍 | text | 是 |
| xuesheng_email | 电子邮箱 | varchar(200) | 是 |
| create_time | 创建时间 | timestamp | 是 |
表4.12 学生出勤表
| 字段 | 注释 | 类型 | 空 |
|---|---|---|---|
| id (主键) | 主键 | int(11) | 否 |
| xuesheng_id | 学生 | int(11) | 是 |
| shiyanshikemu_types | 实验科目 | int(11) | 是 |
| insert_time | 出勤时间 | date | 是 |
| xueshengchuqin_content | 备注 | text | 是 |
| create_time | 创建时间 | timestamp | 是 |
第5章 系统实现
编程人员在搭建的开发环境中，运用编程技术实现本系统设计的各个操作权限的功能。在本节中，就展示部分操作权限的功能与界面。
5.1 管理员功能实现
5.1.1 老师管理
图5.1 即为编码实现的老师管理界面，管理员在该界面中具备新增老师信息，为老师账户重置密码，修改老师信息，查询老师信息等操作权限。
图5.1 老师管理界面
5.1.2 学生管理
图5.2 即为编码实现的学生管理界面，管理员在该界面中新增学生，查询学生，为学生账号重置密码。
图5.2 学生管理界面
5.1.3 实验室排课管理
图5.3 即为编码实现的实验室排课管理界面，管理员在该界面中新增实验室排课信息，对实验室排课信息进行更改，包括更改所在位置，节数，班级等信息。
图5.3 实验室排课管理界面
5.1.4 设备借出管理
图5.4 即为编码实现的设备借出管理界面，管理员在该界面中对设备借出的信息进行新增，可以在本界面编辑，删除，查询设备借出的信息。
图5.4 设备借出管理界面
5.2 老师功能实现
5.2.1 成绩管理
图5.5 即为编码实现的成绩管理界面，老师在该界面中新增学生的考试时间，考试分数等信息，在本界面编辑，查询学生的成绩信息。
图5.5 成绩管理界面
5.2.2 学生出勤管理
图5.6 即为编码实现的学生出勤管理界面，老师在该界面中负责新增学生的出勤信息，包括实验科目，出勤时间等信息的登记，在本界面老师可以查询，编辑，删除学生的出勤信息。
图5.6 学生出勤管理界面
5.2.3 设备损坏管理
图5.7 即为编码实现的设备损坏管理界面，老师在该界面中对损坏的设备信息进行登记，可以查询损坏的设备信息。
图5.7 设备损坏管理界面
5.3 学生功能实现
5.3.1 实验室排课查看
图5.8 即为编码实现的实验室排课查看界面，学生在该界面中查询实验室排课信息，对实验室排课的信息进行查看。
图5.8 实验室排课查看界面
5.3.2 成绩查看
图5.9 即为编码实现的成绩查看界面，学生在该界面中对学生的成绩进行查询，对学生的成绩的详情进行查看。
图5.9 成绩查看界面
5.3.3 学生出勤管理
图5.10 即为编码实现的学生出勤管理界面，学生在该界面中对学生的出勤信息进行登记，查询，删除等操作。
图5.10 学生出勤管理界面
ShiyanshiServiceImpl.java
package com.service.impl;
import com.utils.StringUtil;
import org.springframework.stereotype.Service;
import java.lang.reflect.Field;
import java.util.*;
import com.baomidou.mybatisplus.plugins.Page;
import com.baomidou.mybatisplus.service.impl.ServiceImpl;
import org.springframework.transaction.annotation.Transactional;
import com.utils.PageUtils;
import com.utils.Query;
import org.springframework.web.context.ContextLoader;
import javax.servlet.ServletContext;
import javax.servlet.http.HttpServletRequest;
import com.dao.ShiyanshiDao;
import com.entity.ShiyanshiEntity;
import com.service.ShiyanshiService;
import com.entity.view.ShiyanshiView;
/**
* 实验室 服务实现类
*/
@Service("shiyanshiService")
@Transactional
public class ShiyanshiServiceImpl extends ServiceImpl<ShiyanshiDao, ShiyanshiEntity> implements ShiyanshiService {
@Override
public PageUtils queryPage(Map<String,Object> params) {
if(params != null && (params.get("limit") == null || params.get("page") == null)){
params.put("page","1");
params.put("limit","10");
}
Page<ShiyanshiView> page =new Query<ShiyanshiView>(params).getPage();
page.setRecords(baseMapper.selectListView(page,params));
return new PageUtils(page);
}
}
ChengjiServiceImpl.java
package com.service.impl;
import com.utils.StringUtil;
import org.springframework.stereotype.Service;
import java.lang.reflect.Field;
import java.util.*;
import com.baomidou.mybatisplus.plugins.Page;
import com.baomidou.mybatisplus.service.impl.ServiceImpl;
import org.springframework.transaction.annotation.Transactional;
import com.utils.PageUtils;
import com.utils.Query;
import org.springframework.web.context.ContextLoader;
import javax.servlet.ServletContext;
import javax.servlet.http.HttpServletRequest;
import com.dao.ChengjiDao;
import com.entity.ChengjiEntity;
import com.service.ChengjiService;
import com.entity.view.ChengjiView;
/**
* 成绩 服务实现类
*/
@Service("chengjiService")
@Transactional
public class ChengjiServiceImpl extends ServiceImpl<ChengjiDao, ChengjiEntity> implements ChengjiService {
@Override
public PageUtils queryPage(Map<String,Object> params) {
if(params != null && (params.get("limit") == null || params.get("page") == null)){
params.put("page","1");
params.put("limit","10");
}
Page<ChengjiView> page =new Query<ChengjiView>(params).getPage();
page.setRecords(baseMapper.selectListView(page,params));
return new PageUtils(page);
}
}
XueshengServiceImpl.java
package com.service.impl;
import com.utils.StringUtil;
import org.springframework.stereotype.Service;
import java.lang.reflect.Field;
import java.util.*;
import com.baomidou.mybatisplus.plugins.Page;
import com.baomidou.mybatisplus.service.impl.ServiceImpl;
import org.springframework.transaction.annotation.Transactional;
import com.utils.PageUtils;
import com.utils.Query;
import org.springframework.web.context.ContextLoader;
import javax.servlet.ServletContext;
import javax.servlet.http.HttpServletRequest;
import com.dao.XueshengDao;
import com.entity.XueshengEntity;
import com.service.XueshengService;
import com.entity.view.XueshengView;
/**
* 学生 服务实现类
*/
@Service("xueshengService")
@Transactional
public class XueshengServiceImpl extends ServiceImpl<XueshengDao, XueshengEntity> implements XueshengService {
@Override
public PageUtils queryPage(Map<String,Object> params) {
if(params != null && (params.get("limit") == null || params.get("page") == null)){
params.put("page","1");
params.put("limit","10");
}
Page<XueshengView> page =new Query<XueshengView>(params).getPage();
page.setRecords(baseMapper.selectListView(page,params));
return new PageUtils(page);
}
}
add-or-update.vue
<template>
<div class="addEdit-block">
<el-form
class="detail-form-content"
ref="ruleForm"
:model="ruleForm"
:rules="rules"
label-width="80px"
:style="{backgroundColor:addEditForm.addEditBoxColor}"
>
<el-row>
<el-col :span="12">
<el-form-item class="input" v-if="type!='info'" label="用户名" prop="username">
<el-input v-model="ruleForm.username"
placeholder="用户名" clearable :readonly="ro.username"></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="用户名" prop="username">
<el-input v-model="ruleForm.username"
placeholder="用户名" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12">
<el-form-item class="input" v-if="type!='info'" label="密码" prop="password">
<el-input v-model="ruleForm.password"
placeholder="密码" clearable :readonly="ro.password"></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="密码" prop="password">
<el-input v-model="ruleForm.password"
placeholder="密码" readonly></el-input>
</el-form-item>
</div>
</el-col>
</el-row>
<el-form-item class="btn">
<el-button v-if="type!='info'" type="primary" class="btn-success" @click="onSubmit">提交</el-button>
<el-button v-if="type!='info'" class="btn-close" @click="back()">取消</el-button>
<el-button v-if="type=='info'" class="btn-close" @click="back()">返回</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import styleJs from "../../../utils/style.js";
// 数字，邮件，手机，url，身份证校验
import { isNumber,isIntNumer,isEmail,isPhone, isMobile,isURL,checkIdCard } from "@/utils/validate";
export default {
data() {
let self = this
var validateIdCard = (rule, value, callback) => {
if(!value){
callback();
} else if (!checkIdCard(value)) {
callback(new Error("请输入正确的身份证号码"));
} else {
callback();
}
};
var validateUrl = (rule, value, callback) => {
if(!value){
callback();
} else if (!isURL(value)) {
callback(new Error("请输入正确的URL地址"));
} else {
callback();
}
};
var validateMobile = (rule, value, callback) => {
if(!value){
callback();
} else if (!isMobile(value)) {
callback(new Error("请输入正确的手机号码"));
} else {
callback();
}
};
var validatePhone = (rule, value, callback) => {
if(!value){
callback();
} else if (!isPhone(value)) {
callback(new Error("请输入正确的电话号码"));
} else {
callback();
}
};
var validateEmail = (rule, value, callback) => {
if(!value){
callback();
} else if (!isEmail(value)) {
callback(new Error("请输入正确的邮箱地址"));
} else {
callback();
}
};
var validateNumber = (rule, value, callback) => {
if(!value){
callback();
} else if (!isNumber(value)) {
callback(new Error("请输入数字"));
} else {
callback();
}
};
var validateIntNumber = (rule, value, callback) => {
if(!value){
callback();
} else if (!isIntNumer(value)) {
callback(new Error("请输入整数"));
} else {
callback();
}
};
return {
addEditForm:null,
id: '',
type: '',
ro:{
username : false,
password : false,
role : false,
},
ruleForm: {
username: '',
password: '',
},
rules: {
username: [
{ required: true, message: '用户名不能为空', trigger: 'blur' },
],
password: [
{ required: true, message: '密码不能为空', trigger: 'blur' },
],
role: [
],
}
};
},
props: ["parent"],
computed: {
},
created() {
this.addEditForm = styleJs.addStyle();
this.addEditStyleChange()
this.addEditUploadStyleChange()
},
methods: {
// 下载
download(file){
window.open(`${file}`)
},
// 初始化
init(id,type) {
if (id) {
this.id = id;
this.type = type;
}
if(this.type=='info'||this.type=='else'){
this.info(id);
}else if(this.type=='cross'){
var obj = this.$storage.getObj('crossObj');
for (var o in obj){
if(o=='username'){
this.ruleForm.username = obj[o];
this.ro.username = true;
continue;
}
if(o=='password'){
this.ruleForm.password = obj[o];
this.ro.password = true;
continue;
}
if(o=='role'){
this.ruleForm.role = obj[o];
this.ro.role = true;
continue;
}
}
}
},
// 多级联动参数
info(id) {
this.$http({
url: `users/info/${id}`,
method: "get"
}).then(({ data }) => {
if (data && data.code === 0) {
this.ruleForm = data.data;
//解决前台上传图片后台不显示的问题
let reg=new RegExp('../../../upload','g')//g代表全部
} else {
this.$message.error(data.msg);
}
});
},
// 提交
onSubmit() {
this.$refs["ruleForm"].validate(valid => {
if (valid) {
this.$http({
url: `users/${!this.ruleForm.id ? "save" : "update"}`,
method: "post",
data: this.ruleForm
}).then(({ data }) => {
if (data && data.code === 0) {
this.$message({
message: "操作成功",
type: "success",
duration: 1500,
onClose: () => {
this.parent.showFlag = true;
this.parent.addOrUpdateFlag = false;
this.parent.usersCrossAddOrUpdateFlag = false;
this.parent.search();
this.parent.contentStyleChange();
}
});
} else {
this.$message.error(data.msg);
}
});
}
});
},
// 获取uuid
getUUID () {
return new Date().getTime();
},
// 返回
back() {
this.parent.showFlag = true;
this.parent.addOrUpdateFlag = false;
this.parent.usersCrossAddOrUpdateFlag = false;
this.parent.contentStyleChange();
},
addEditStyleChange() {
this.$nextTick(()=>{
// input
document.querySelectorAll('.addEdit-block .input .el-input__inner').forEach(el=>{
el.style.height = this.addEditForm.inputHeight
el.style.color = this.addEditForm.inputFontColor
el.style.fontSize = this.addEditForm.inputFontSize
el.style.borderWidth = this.addEditForm.inputBorderWidth
el.style.borderStyle = this.addEditForm.inputBorderStyle
el.style.borderColor = this.addEditForm.inputBorderColor
el.style.borderRadius = this.addEditForm.inputBorderRadius
el.style.backgroundColor = this.addEditForm.inputBgColor
})
document.querySelectorAll('.addEdit-block .input .el-form-item__label').forEach(el=>{
el.style.lineHeight = this.addEditForm.inputHeight
el.style.color = this.addEditForm.inputLableColor
el.style.fontSize = this.addEditForm.inputLableFontSize
})
// select
document.querySelectorAll('.addEdit-block .select .el-input__inner').forEach(el=>{
el.style.height = this.addEditForm.selectHeight
el.style.color = this.addEditForm.selectFontColor
el.style.fontSize = this.addEditForm.selectFontSize
el.style.borderWidth = this.addEditForm.selectBorderWidth
el.style.borderStyle = this.addEditForm.selectBorderStyle
el.style.borderColor = this.addEditForm.selectBorderColor
el.style.borderRadius = this.addEditForm.selectBorderRadius
el.style.backgroundColor = this.addEditForm.selectBgColor
})
document.querySelectorAll('.addEdit-block .select .el-form-item__label').forEach(el=>{
el.style.lineHeight = this.addEditForm.selectHeight
el.style.color = this.addEditForm.selectLableColor
el.style.fontSize = this.addEditForm.selectLableFontSize
})
document.querySelectorAll('.addEdit-block .select .el-select__caret').forEach(el=>{
el.style.color = this.addEditForm.selectIconFontColor
el.style.fontSize = this.addEditForm.selectIconFontSize
})
// date
document.querySelectorAll('.addEdit-block .date .el-input__inner').forEach(el=>{
el.style.height = this.addEditForm.dateHeight
el.style.color = this.addEditForm.dateFontColor
el.style.fontSize = this.addEditForm.dateFontSize
el.style.borderWidth = this.addEditForm.dateBorderWidth
el.style.borderStyle = this.addEditForm.dateBorderStyle
el.style.borderColor = this.addEditForm.dateBorderColor
el.style.borderRadius = this.addEditForm.dateBorderRadius
el.style.backgroundColor = this.addEditForm.dateBgColor
})
document.querySelectorAll('.addEdit-block .date .el-form-item__label').forEach(el=>{
el.style.lineHeight = this.addEditForm.dateHeight
el.style.color = this.addEditForm.dateLableColor
el.style.fontSize = this.addEditForm.dateLableFontSize
})
document.querySelectorAll('.addEdit-block .date .el-input__icon').forEach(el=>{
el.style.color = this.addEditForm.dateIconFontColor
el.style.fontSize = this.addEditForm.dateIconFontSize
el.style.lineHeight = this.addEditForm.dateHeight
})
// upload
let iconLineHeight = parseInt(this.addEditForm.uploadHeight) - parseInt(this.addEditForm.uploadBorderWidth) * 2 + 'px'
document.querySelectorAll('.addEdit-block .upload .el-upload--picture-card').forEach(el=>{
el.style.width = this.addEditForm.uploadHeight
el.style.height = this.addEditForm.uploadHeight
el.style.borderWidth = this.addEditForm.uploadBorderWidth
el.style.borderStyle = this.addEditForm.uploadBorderStyle
el.style.borderColor = this.addEditForm.uploadBorderColor
el.style.borderRadius = this.addEditForm.uploadBorderRadius
el.style.backgroundColor = this.addEditForm.uploadBgColor
})
document.querySelectorAll('.addEdit-block .upload .el-form-item__label').forEach(el=>{
el.style.lineHeight = this.addEditForm.uploadHeight
el.style.color = this.addEditForm.uploadLableColor
el.style.fontSize = this.addEditForm.uploadLableFontSize
})
document.querySelectorAll('.addEdit-block .upload .el-icon-plus').forEach(el=>{
el.style.color = this.addEditForm.uploadIconFontColor
el.style.fontSize = this.addEditForm.uploadIconFontSize
el.style.lineHeight = iconLineHeight
el.style.display = 'block'
})
// 多文本输入框
document.querySelectorAll('.addEdit-block .textarea .el-textarea__inner').forEach(el=>{
el.style.height = this.addEditForm.textareaHeight
el.style.color = this.addEditForm.textareaFontColor
el.style.fontSize = this.addEditForm.textareaFontSize
el.style.borderWidth = this.addEditForm.textareaBorderWidth
el.style.borderStyle = this.addEditForm.textareaBorderStyle
el.style.borderColor = this.addEditForm.textareaBorderColor
el.style.borderRadius = this.addEditForm.textareaBorderRadius
el.style.backgroundColor = this.addEditForm.textareaBgColor
})
document.querySelectorAll('.addEdit-block .textarea .el-form-item__label').forEach(el=>{
// el.style.lineHeight = this.addEditForm.textareaHeight
el.style.color = this.addEditForm.textareaLableColor
el.style.fontSize = this.addEditForm.textareaLableFontSize
})
// 保存
document.querySelectorAll('.addEdit-block .btn .btn-success').forEach(el=>{
el.style.width = this.addEditForm.btnSaveWidth
el.style.height = this.addEditForm.btnSaveHeight
el.style.color = this.addEditForm.btnSaveFontColor
el.style.fontSize = this.addEditForm.btnSaveFontSize
el.style.borderWidth = this.addEditForm.btnSaveBorderWidth
el.style.borderStyle = this.addEditForm.btnSaveBorderStyle
el.style.borderColor = this.addEditForm.btnSaveBorderColor
el.style.borderRadius = this.addEditForm.btnSaveBorderRadius
el.style.backgroundColor = this.addEditForm.btnSaveBgColor
})
// 返回
document.querySelectorAll('.addEdit-block .btn .btn-close').forEach(el=>{
el.style.width = this.addEditForm.btnCancelWidth
el.style.height = this.addEditForm.btnCancelHeight
el.style.color = this.addEditForm.btnCancelFontColor
el.style.fontSize = this.addEditForm.btnCancelFontSize
el.style.borderWidth = this.addEditForm.btnCancelBorderWidth
el.style.borderStyle = this.addEditForm.btnCancelBorderStyle
el.style.borderColor = this.addEditForm.btnCancelBorderColor
el.style.borderRadius = this.addEditForm.btnCancelBorderRadius
el.style.backgroundColor = this.addEditForm.btnCancelBgColor
})
})
},
addEditUploadStyleChange() {
this.$nextTick(()=>{
document.querySelectorAll('.addEdit-block .upload .el-upload-list--picture-card .el-upload-list__item').forEach(el=>{
el.style.width = this.addEditForm.uploadHeight
el.style.height = this.addEditForm.uploadHeight
el.style.borderWidth = this.addEditForm.uploadBorderWidth
el.style.borderStyle = this.addEditForm.uploadBorderStyle
el.style.borderColor = this.addEditForm.uploadBorderColor
el.style.borderRadius = this.addEditForm.uploadBorderRadius
el.style.backgroundColor = this.addEditForm.uploadBgColor
})
})
},
}
};
</script>
<style lang="scss">
.editor{
height: 500px;
& /deep/ .ql-container {
height: 310px;
}
}
.amap-wrapper {
width: 100%;
height: 500px;
}
.search-box {
position: absolute;
}
.addEdit-block {
margin: -10px;
}
.detail-form-content {
padding: 12px;
}
.btn .el-button {
padding: 0;
}</style>
声明
本博客适用于广泛的学术和教育用途，包括但不限于个人学习、开发设计，产品设计。仅供学习参考，旨在为读者提供深入理解和学术研究的材料。
扫一扫
3715
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
