springboot511基于SpringBoot视频点播系统的设计与实现
第1章 绪论
1.1选题动因
当前的网络技术，软件技术等都具备成熟的理论基础，市场上也出现各种技术开发的软件，这些软件都被用于各个领域，包括生活和工作的领域。随着电脑和笔记本的广泛运用，以及各种计算机硬件的完善和升级，市面上的电脑和笔记本的性能都得到提升，可以支持的软件也逐渐增多，因此，在计算机上安装软件来发挥其高效地信息处理的作用，则很受人们的青睐。对于视频点播系统信息来讲，通过手工形式处理，在面对庞大的信息数量时，就显得不适宜了，首先需要花费的时间比较多，其次数据出错率比较高，而且对错误的数据进行更改也比较困难，最后，检索数据费事费力。因此，为了解决上述问题，有必要建立视频点播系统，来规范视频点播系统信息管理流程，让管理工作可以系统化和程序化，同时，视频点播系统的有效运用可以帮助管理人员准确快速地处理信息。
1.2目的和意义
视频点播系统可以对视频点播系统信息进行集中管理，可以真正避免传统管理的缺陷。视频点播系统是一款运用软件开发技术设计实现的应用系统，在信息处理上可以达到快速的目的，不管是针对数据添加，数据维护和统计，以及数据查询等处理要求，视频点播系统都可以轻松应对。所以，视频点播系统的运用是让视频点播系统信息管理升级的最好方式。它可以实现信息处理的便利化要求，还可以规范信息处理的流程，让事务处理成为管理人员手中的一件简单事，而不是之前手工处理时的困难事。尽管视频点播系统具备较完善的功能，但是也需要管理人员利用闲暇时间提升自身素质以及个人能力，在操作视频点播系统时可以最大化运用视频点播系统提供的功能，让系统在满足高效率处理数据的同时，也能始终稳定运行，还可以确保数据的可靠性与数据处理的质量。
1.3论文结构安排
本文总共分为6个章节，每个章节都对本系统描述了不同的内容。接下来就对本文的研究内容进行阐述。
第1章：这个章节是论文的绪论部分。从选题的背景和意义的角度阐述即将开发的系统。
第2章：这个章节是技术介绍部分。从本系统需要运用的技术知识的角度阐述系统。
第3章：这个章节是系统分析部分。从分析系统可行性，分析系统功能和性能等角度阐述系统。
第4章：这个章节是系统设计部分。从系统功能结构的角度和数据库设计的角度阐述系统。
第5章：这个章节是系统实现部分。从系统功能模块运行效果的角度阐述系统。
第6章：这个章节是系统测试部分。从测试系统功能，系统测试方法的角度阐述系统。
第2章 开发环境与技术
开发视频点播系统需要搭建编程的环境，也需要通过调查，对各个相关技术进行分析，选取适合本系统开发的技术与工具。
2.1 MySQL数据库
本研究与开发的应用程序在数据操作中难以预料，有时候甚至产生变化。没有办法直接在Word中写数据信息，这不但不安全，并且难以达到应用程序的功能。想要实现所需要的文档存储功能，务必选择专业数据库存储软件。绝大多数情况下，应用程序达到的功能并不是特别繁杂，市场中每一个有关数据库手机软件都能实现。但MySQL数据库，安装包小，拼装速度更快，使用便捷，即便拼装难题改善，不用再度安装操作系统，也不影响电子计算机第三方软件的运转，互联网资源损害少，最主要的是功能充分满足设计定位，最终选择了MySQL数据库做为应用软件开发所需要的数据库。
2.2 Java语言技术
Java语言已经存在了25年有余。通过这些年的发展趋势，it行业在市场占有率上仍然占据一半，仍然受到了很多程序员的工作钟爱。许多从业者都是在学习培训。近年来随着从业者的提高，Java语言的位置并没减少，算得上是常青藤。Java语言学习培训比较简单，自然，它是对于C前辈们的 而言的，C 语言非常强劲。Java取消了许多特点，如go这种阐述，也取消了主文件，让所有文件夹全是类，类是二维数组以及各种对象，也使Java处理一些对象的引入和回收利用，让开发者只需建立对象，应用对象，编写代码逻辑，不需要留意性能，让各种各样文件存储给Java自己解决，你能花很多时间科学研究应用软件相互关系，使研发更为集中化，如同跑车驾驶员一样，只要了解各种汽车的性能，实际操作，不需要科学研究如何生产车轮子，使软件开发更为详尽。
2.3 SpringBoot框架
在过去的两三年的Spring生态系统中，最令人兴奋的是Spring Boot框架。或许从取名上能够得知这一框架设计初心：快速开启Spring运用。因此Spring 实质上，Boot应用程序是一个根据Spring框架的应用程序。这是Spring“协议书先于配置”理论的良好实践物质。可以帮助开发者迅速、更有效地搭建根据Spring生态系统的应用程序。
Spring Boot有什么魔法？全自动配置、发展依靠、Actuator、命令行界面(CLI) 是Spring Boot最主要的四个核心特点，在其中CLI是Spring Boot的能选特点尽管功能齐全，却也引入了一套非传统的开发模型，因此本系列文章只注重别的三个特点。如标题，文中是本系列的第一部分，将为您开启Spring Boot大门口，关键为您进一步分析启动过程及全自动配置完成基本原理。把握这一部分主要内容，了解一些Spring框架的基本知识，也会让你游刃有余。
2.4 B/S模式框架
B/S架构是互联网行业区别C/S架构，用以叙述浏览器与服务器之间的架构方式。一般来说，挑选B/S架构的主要原因是维修方便。当软件开发时，能够在本地进行检测。一般综合开发工具都有各自的开发与一键部署。当地浏览器能够及时出效果。测试工程师有专业的网络服务器，仅需布署就可以。假如正中间有什么问题，能够整顿。应用软件更新，只需后台维护编码，顾客依然应用以前的浏览器开展访问，因此用户端十分方便。现在市面上大部分每一个电脑操作系统服务平台只要是有窗口模式，除开命令行操作页面对话框，窗口模式可以放置浏览器，因此一切带窗口模式的计算机操作系统自已的浏览器或其它生产商的浏览器，或挪动浏览器，都能够访问网络服务器。访问网络服务器占用用户端网络资源非常少，不易出差错。即便用户端有问题，也仅需重新装系统，随后组装浏览器就可以。在程序流程性能和用户体验层面，挑选B/S架构开发设计应用软件特别适合如今的社会的主力发展趋向。
第3章 系统分析
3.1 系统可行性分析
3.1.1技术可行性分析
研发设计程序流程挑选面向对象设计、功能齐全、简单实用的Java编程设计核心理念。MySQL数据库存储数据。IDEA工具作为编程软件，Windows 10计算机操作系统作为应用系统，以及数据库可视化工具等技术职称。一般来说，该程序流程的开发能够从技术上开展是可行的。
3.1.2经济可行性分析
开发的程序并不是向着商业程序方向设计与开发的，反而是做为一个新的毕业论文新项目开发的。它主要运用于检测学生在院校所学的知识，并锻练客户使用网络、书籍和其他方式自学能力。因而，程序软件的开发不容易涉及到边际收益，也不会为软件的挑选付钱。你可以在开发软件的官网上下载所需要的手机软件，并依据所需要的安装方法将应用安装到你的电脑里。一般来说，开发这一程序并没有社会经济发展花费。
3.1.3运行可行性分析
由于程序软件就是针对大部分一般操作用户，考虑到他的知识与文化水准，尤其开发了一个可操作度高的程序软件，能够轻而易举地让用户应用，数据可视化操作页面。一般来说，从用户操作程序的角度看，这一程序其实并不难操作。只需用户开启程序，就能避免专职人员学习培训开展程序作用操作，可以得出程序软件能够开发和操作。
3.2 系统流程
3.2.1 操作信息流程
具体操作流程见下图
图3.1 操作流程图
3.2.2 登录信息流程
登录模块流程见下图
图3.2 登录流程图
3.2.3 删除信息流程
删除流程见下图。
图3.3 删除信息流程图
3.3 性能需求分析
需求分析报告包含根据用户实际需求制订功能和定制系统的性能需求分析报告。因而，在一般数据分析系统时，一方面要数据分析系统的作用，另一方面要知道全面的性能。终究，性能更加好的全面的设计设计和开发能够保证系统质量以及可靠性。
下面，从易学易用性、系统时间特性、系统稳定性等多个方面系统性能展开分析表明。
(1)系统容积规定:明确系统进行数据处理方法容量更大化。换句话说，假如系统建立模型容量临界点超出这一临界点，系统可能设备异常。
（2）系统精度规定：明确传送数据所需要的精度值，包含数值计算方法的精度值、数据信息精度系数的设定等。
（3）时长特点规定：系统建立模型有时限要求，那也是系统的时间也特点。一般剖析数据处理方法的时间也，设定用户标准的响应速度，及其系统在超负荷运行中能够偏移的范围值，要提前剖析明确。
（4）适应能力规定：当系统应对系统环境变化时，其融入这些变化的能力也要根据参数信息来反映。比如，应对变动的必须，系统必须通过强调必须设计方案的一个过程或系统来适应变化来反映系统的适应能力。
（5）易学易用性：除开作用应该考虑用户要求外，人机交互设计还要考虑到用户的用户习惯，包含界面风格、页面色彩选择与色彩搭配。尝试让用户接受简单学习后单独实际操作系统。
(6)系统稳定性:针对新手来说，容易出现一个问题，那便是产品设计开发的系统，由于人工操作失误奔溃，有的还会造成电脑崩溃。这种情况也说明了容错机制能力低系统不靠谱。
第4章 系统设计
市面上设计比较好的系统都有一个共同特征，就是主题鲜明突出。通过对页面简洁清晰的布局，让页面的内容，包括文字语言，或者视频图片等元素可以清晰表达出系统的主题。让来访用户无需花费过多精力和时间找寻需要的内容。
4.1界面设计原则
一般来说，大部分用户使用系统，有些是想从系统中获取需要的信息，有些则是使用系统提供的服务。所以，为了改善用户体验，提高系统的使用率，在对系统界面设计时，需要按照下面的原则进行。
第一点，对用户进行分析，了解用户使用系统的目的，以及使用系统的方式，考虑大部分用户的阅读习惯，设计Z字形或F型结构可以方便用户获取信息。
第二点：设计有效的导航，这个包括每个页面上都有导航条的显示，有时也可以在页面的底部设计导航条，当用户进入具体页面时，要设计相应的位置提示，在页面中比较特殊的位置，需要设计返回链接，可以返回上个页面，也可以返回首页等。
第三点：对整个系统要运用统一的设计方案，包括色彩方案的一致性，页面模板的相似性等，对相同操作和专业术语的描述在整个系统中也应该保持一致。
第四点：设计的界面要保证传达的内容清晰准确。要避免在同一个页面设计非常多的内容，另外可以准确对系统内容进行分类，把页面中用户视觉集中的位置，用来显示重要信息。
作为初学者，并没有那么多的设计经验，但是可以运用上面提到的界面设计原则设计出比较好的系统，可以让用户产生良好的使用体验。
4.2功能结构设计
为了让系统的编码可以顺利进行，特意对本系统功能进行细分设计，设计的系统功能结构见下图。
图4.1 系统功能结构图
4.3数据库设计
一般来说，对用户进行调查，了解其需求，主要还是完成功能上的分析设计，殊不知，设计功能时，也要展示对数据库的设计。数据库服务于程序，它可以按照设定的规则对程序的数据进行保存，因此，也可以说数据库就是程序相关数据的集合。为了保证程序的高质量，数据库提供的数据存储服务也需要快速响应，同时数据信息也要安全合法可靠，所以设计一个数据库这样的任务也需要高度重视，并花时间和精力去努力完成。毕竟这影响到后期程序的开发和使用。试想而知，假设设计一个不好的数据库，遇到的问题将会有：第一，面对信息处理，会有着繁琐的业务逻辑，延长事务处理时间。第二：程序编码期间，将会产生更多的代码去完成数据处理的功能，产生大量的数据冗余，而且也不方便注释代码，还会占用更多的存储空间。综上所述，设计出合理的数据库是多么的重要。
（1）下图是客服聊天实体和其具备的属性。
客服聊天实体属性图
（2）下图是论坛实体和其具备的属性。
论坛实体属性图
（3）下图是用户实体和其具备的属性。
用户实体属性图
（4）下图是公告实体和其具备的属性。
公告实体属性图
（5）下图是视频信息实体和其具备的属性。
视频信息实体属性图
（6）下图是视频收藏实体和其具备的属性。
视频收藏实体属性图
（7）下图是视频留言实体和其具备的属性。
视频留言实体属性图
4.3.2 数据库物理设计
作为程序后台的支持，本数据库也需要设计数据存储的结构。而数据存储结构的设计就包括了数据表结构的设计和创建。数据表结构包括了字段，数据类型，还有字段的取值范围等信息。而E-R模型中的实体就是一张表，实体的特征就可以作为该表中的字段，根据本程序信息存储要求，设计每个字段需要的类型，还有该字段的取值范围等。每当设计完成一张数据表，就需要及时保存在数据库里面，并对该设计的数据表准确命名，要求设置的数据表的名称尽量不要是中文，而且要方便记忆。因为在程序编码阶段，通过SQL语句可以把程序里面的数据写入在各个数据表里面，而这个环节需要使用到数据表的名称。如果数据表名称是中文的话，可能会乱码并影响程序运行。下面就以表格形式展示设计的结果。
表4.1客服聊天表
| 序号 | 列名 | 数据类型 | 说明 | 允许空 |
|---|---|---|---|---|
| 1 | Id | Int | id | 否 |
| 2 | yonghu_id | Integer | 提问用户 | 是 |
| 3 | chat_issue | String | 问题 | 是 |
| 4 | issue_time | Date | 问题时间 | 是 |
| 5 | chat_reply | String | 回复 | 是 |
| 6 | reply_time | Date | 回复时间 | 是 |
| 7 | zhuangtai_types | Integer | 状态 | 是 |
| 8 | chat_types | Integer | 数据类型 | 是 |
| 9 | insert_time | Date | 创建时间 | 是 |
| 表4.2字典表 |
| 序号 | 列名 | 数据类型 | 说明 | 允许空 |
|---|---|---|---|---|
| 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.3论坛表 |
| 序号 | 列名 | 数据类型 | 说明 | 允许空 |
|---|---|---|---|---|
| 1 | Id | Int | id | 否 |
| 2 | forum_name | String | 帖子标题 | 是 |
| 3 | yonghu_id | Integer | 用户 | 是 |
| 4 | users_id | Integer | 管理员 | 是 |
| 5 | forum_content | String | 发布内容 | 是 |
| 6 | super_ids | Integer | 父id | 是 |
| 7 | forum_state_types | Integer | 帖子状态 | 是 |
| 8 | insert_time | Date | 发帖时间 | 是 |
| 9 | update_time | Date | 修改时间 | 是 |
| 10 | create_time | Date | 创建时间 | 是 |
| 表4.4公告表 |
| 序号 | 列名 | 数据类型 | 说明 | 允许空 |
|---|---|---|---|---|
| 1 | Id | Int | id | 否 |
| 2 | news_name | String | 公告标题 | 是 |
| 3 | news_types | Integer | 论坛信息 | 是 |
| 4 | news_photo | String | 公告图片 | 是 |
| 5 | insert_time | Date | 添加时间 | 是 |
| 6 | news_content | String | 公告详情 | 是 |
| 7 | create_time | Date | 创建时间 | 是 |
| 表4.5视频信息表 |
| 序号 | 列名 | 数据类型 | 说明 | 允许空 |
|---|---|---|---|---|
| 1 | Id | Int | id | 否 |
| 2 | shipin_name | String | 视频标题 | 是 |
| 3 | shipin_photo | String | 视频封面 | 是 |
| 4 | shipin_video | String | 视频 | 是 |
| 5 | zan_number | Integer | 赞 | 是 |
| 6 | cai_number | Integer | 踩 | 是 |
| 7 | shipin_types | Integer | 视频类型 | 是 |
| 8 | shipin_clicknum | Integer | 视频热度 | 是 |
| 9 | shipin_content | String | 视频介绍 | 是 |
| 10 | shipin_delete | Integer | 逻辑删除 | 是 |
| 11 | insert_time | Date | 录入时间 | 是 |
| 12 | create_time | Date | 创建时间 | 是 |
| 表4.6视频收藏表 |
| 序号 | 列名 | 数据类型 | 说明 | 允许空 |
|---|---|---|---|---|
| 1 | Id | Int | id | 否 |
| 2 | shipin_id | Integer | 视频 | 是 |
| 3 | yonghu_id | Integer | 用户 | 是 |
| 4 | shipin_collection_types | Integer | 类型 | 是 |
| 5 | insert_time | Date | 收藏时间 | 是 |
| 6 | create_time | Date | 创建时间 | 是 |
| 表4.7视频留言表 |
| 序号 | 列名 | 数据类型 | 说明 | 允许空 |
|---|---|---|---|---|
| 1 | Id | Int | id | 否 |
| 2 | shipin_id | Integer | 视频 | 是 |
| 3 | yonghu_id | Integer | 用户 | 是 |
| 4 | shipin_liuyan_text | String | 留言内容 | 是 |
| 5 | insert_time | Date | 留言时间 | 是 |
| 6 | reply_text | String | 回复内容 | 是 |
| 7 | update_time | Date | 回复时间 | 是 |
| 8 | create_time | Date | 创建时间 | 是 |
| 表4.8用户表 |
| 序号 | 列名 | 数据类型 | 说明 | 允许空 |
|---|---|---|---|---|
| 1 | Id | Int | id | 否 |
| 2 | yonghu_name | String | 用户名称 | 是 |
| 3 | yonghu_phone | String | 用户手机号 | 是 |
| 4 | yonghu_id_number | String | 用户身份证号 | 是 |
| 5 | yonghu_photo | String | 用户头像 | 是 |
| 6 | yonghu_email | String | 用户邮箱 | 是 |
| 7 | yonghu_delete | Integer | 逻辑删除 | 是 |
| 8 | insert_time | Date | 添加时间 | 是 |
| 9 | create_time | Date | 创建时间 | 是 |
| 表4.9管理员表 |
| 序号 | 列名 | 数据类型 | 说明 | 允许空 |
|---|---|---|---|---|
| 1 | Id | Int | id | 否 |
| 2 | username | String | 医院名 | 是 |
| 3 | password | String | 密码 | 是 |
| 4 | role | String | 角色 | 是 |
| 5 | addtime | Date | 新增时间 | 是 |
第5章 系统实现
这个环节需要使用前面的设计方案，包括对系统模块的设计，还有对程序后台的数据支持的数据库的设计等。不过这部分内容还是强调系统编码人员的开发能力，要把前面设计的内容通过编码的形式以一个完整的，可以运行的系统呈现出来。
功能模块的实现
5.1用户信息管理
如图5.1显示的就是用户信息管理页面，此页面提供给管理员的功能有：用户信息的查询管理，可以删除用户信息、修改用户信息、新增用户信息，
还进行了对用户名称的模糊查询的条件
图5.1 用户信息管理页面
5.2 视频信息管理
如图5.2显示的就是视频信息管理页面，此页面提供给管理员的功能有：查看已发布的视频信息数据，修改视频信息，视频信息作废，即可删除，还进行了对视频信息名称的模糊查询 视频信息信息的类型查询等等一些条件。
图5.2 视频信息管理页面
5.3论坛信息管理
如图5.3显示的就是论坛信息管理页面，此页面提供给管理员的功能有：根据论坛信息进行条件查询，还可以对论坛信息进行新增、修改、查询操作等等。
图5.3 论坛信息管理页面
5.1公告信息管理
如图5.4显示的就是公告信息管理页面，此页面提供给管理员的功能有：根据公告信息进行新增、修改、查询操作等等。
图5.4 公告信息管理页面
DictionaryServiceImpl.java
package com.service.impl;
import com.utils.StringUtil;
import com.service.DictionaryService;
import com.utils.ClazzDiff;
import org.springframework.beans.BeanUtils;
import org.springframework.beans.factory.annotation.Autowired;
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 org.springframework.lang.Nullable;
import org.springframework.util.Assert;
import com.dao.DictionaryDao;
import com.entity.DictionaryEntity;
import com.service.DictionaryService;
import com.entity.view.DictionaryView;
/**
* 字典 服务实现类
*/
@Service("dictionaryService")
@Transactional
public class DictionaryServiceImpl extends ServiceImpl<DictionaryDao, DictionaryEntity> implements DictionaryService {
@Override
public PageUtils queryPage(Map<String,Object> params) {
Page<DictionaryView> page =new Query<DictionaryView>(params).getPage();
page.setRecords(baseMapper.selectListView(page,params));
return new PageUtils(page);
}
/**
* 赋值给字典表
* @param obj view对象
*/
public void dictionaryConvert(Object obj, HttpServletRequest request) {
try {
if (obj == null) return;
//当前view和entity中的所有types的字段
List<String> fieldNameList = new ArrayList<>();
Class tempClass = obj.getClass();
while (tempClass !=null) {
Field[] declaredFields = tempClass.getDeclaredFields();
for (Field f : declaredFields) {
f.setAccessible(true);
if (f.getType().getName().equals("java.lang.Integer") && f.getName().contains("Types")) {
fieldNameList.add(f.getName());
}
}
tempClass = tempClass.getSuperclass(); //得到父类,然后赋给自己
}
// 获取监听器中的字典表
// ServletContext servletContext = ContextLoader.getCurrentWebApplicationContext().getServletContext();
ServletContext servletContext = request.getServletContext();
Map<String, Map<Integer, String>> dictionaryMap= (Map<String, Map<Integer, String>>) servletContext.getAttribute("dictionaryMap");
//通过Types的值给Value字段赋值
for (String s : fieldNameList) {
Field types = null;
if(hasField(obj.getClass(),s)){
//判断view中有没有这个字段,有就通过反射取出字段
types= obj.getClass().getDeclaredField(s);//获取Types私有字段
}else{
//本表中没有这个字段,说明它是父表中的字段,也就是entity中的字段,从entity中取值
types=obj.getClass().getSuperclass().getDeclaredField(s);
}
Field value = obj.getClass().getDeclaredField(s.replace("Types", "Value"));//获取value私有字段
//设置权限
types.setAccessible(true);
value.setAccessible(true);
//赋值
if (StringUtil.isNotEmpty(String.valueOf(types.get(obj)))) { //types的值不为空
int i = Integer.parseInt(String.valueOf(types.get(obj)));//type
//把s1字符中的所有大写转小写,并在前面加 _
char[] chars = s.toCharArray();
StringBuffer sbf = new StringBuffer();
for(int b=0; b< chars.length; b++){
char ch = chars[b];
if(ch <= 90 && ch >= 65){
sbf.append("_");
ch += 32;
}
sbf.append(ch);
}
String s2 = dictionaryMap.get(sbf.toString()).get(i);
value.set(obj, s2);
} else {
new Exception("字典表赋值出现问题::::"+value.getName());
value.set(obj, "");
}
}
} catch (IllegalAccessException e) {
e.printStackTrace();
} catch (NoSuchFieldException e) {
e.printStackTrace();
} catch (Exception e) {
e.printStackTrace();
}
}
/**
* 判断本实体有没有这个字段
* @param c
* @param fieldName
* @return
*/
public boolean hasField(Class c, String fieldName){
Field[] fields = c.getDeclaredFields();
for (Field f : fields) {
if (fieldName.equals(f.getName())) {
return true;
}
}
return false;
}
}
ShipinController.java
package com.controller;
import java.io.File;
import java.math.BigDecimal;
import java.net.URL;
import java.text.SimpleDateFormat;
import com.alibaba.fastjson.JSONObject;
import java.util.*;
import org.springframework.beans.BeanUtils;
import javax.servlet.http.HttpServletRequest;
import org.springframework.web.context.ContextLoader;
import javax.servlet.ServletContext;
import com.service.TokenService;
import com.utils.*;
import java.lang.reflect.InvocationTargetException;
import com.service.DictionaryService;
import org.apache.commons.lang3.StringUtils;
import com.annotation.IgnoreAuth;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.entity.*;
import com.entity.view.*;
import com.service.*;
import com.utils.PageUtils;
import com.utils.R;
import com.alibaba.fastjson.*;
/**
* 视频信息
* 后端接口
* @author
* @email
*/
@RestController
@Controller
@RequestMapping("/shipin")
public class ShipinController {
private static final Logger logger = LoggerFactory.getLogger(ShipinController.class);
private static final String TABLE_NAME = "shipin";
@Autowired
private ShipinService shipinService;
@Autowired
private TokenService tokenService;
@Autowired
private ChatService chatService;//客服聊天
@Autowired
private DictionaryService dictionaryService;//字典
@Autowired
private ForumService forumService;//论坛
@Autowired
private NewsService newsService;//公告
@Autowired
private ShipinCollectionService shipinCollectionService;//视频收藏
@Autowired
private ShipinLiuyanService shipinLiuyanService;//视频留言
@Autowired
private YonghuService yonghuService;//用户
@Autowired
private UsersService usersService;//管理员
/**
* 后端列表
*/
@RequestMapping("/page")
public R page(@RequestParam Map<String, Object> params, HttpServletRequest request){
logger.debug("page方法:,,Controller:{},,params:{}",this.getClass().getName(),JSONObject.toJSONString(params));
String role = String.valueOf(request.getSession().getAttribute("role"));
if(false)
return R.error(511,"永不会进入");
else if("用户".equals(role))
params.put("yonghuId",request.getSession().getAttribute("userId"));
params.put("shipinDeleteStart",1);params.put("shipinDeleteEnd",1);
CommonUtil.checkMap(params);
PageUtils page = shipinService.queryPage(params);
//字典表数据转换
List<ShipinView> list =(List<ShipinView>)page.getList();
for(ShipinView c:list){
//修改对应字典表字段
dictionaryService.dictionaryConvert(c, request);
}
return R.ok().put("data", page);
}
/**
* 后端详情
*/
@RequestMapping("/info/{id}")
public R info(@PathVariable("id") Long id, HttpServletRequest request){
logger.debug("info方法:,,Controller:{},,id:{}",this.getClass().getName(),id);
ShipinEntity shipin = shipinService.selectById(id);
if(shipin !=null){
//entity转view
ShipinView view = new ShipinView();
BeanUtils.copyProperties( shipin , view );//把实体数据重构到view中
//修改对应字典表字段
dictionaryService.dictionaryConvert(view, request);
return R.ok().put("data", view);
}else {
return R.error(511,"查不到数据");
}
}
/**
* 后端保存
*/
@RequestMapping("/save")
public R save(@RequestBody ShipinEntity shipin, HttpServletRequest request){
logger.debug("save方法:,,Controller:{},,shipin:{}",this.getClass().getName(),shipin.toString());
String role = String.valueOf(request.getSession().getAttribute("role"));
if(false)
return R.error(511,"永远不会进入");
Wrapper<ShipinEntity> queryWrapper = new EntityWrapper<ShipinEntity>()
.eq("shipin_name", shipin.getShipinName())
.eq("shipin_video", shipin.getShipinVideo())
.eq("zan_number", shipin.getZanNumber())
.eq("cai_number", shipin.getCaiNumber())
.eq("shipin_types", shipin.getShipinTypes())
.eq("shipin_delete", 1)
;
logger.info("sql语句:"+queryWrapper.getSqlSegment());
ShipinEntity shipinEntity = shipinService.selectOne(queryWrapper);
if(shipinEntity==null){
shipin.setShipinClicknum(1);
shipin.setShipinDelete(1);
shipin.setInsertTime(new Date());
shipin.setCreateTime(new Date());
shipinService.insert(shipin);
return R.ok();
}else {
return R.error(511,"表中有相同数据");
}
}
/**
* 后端修改
*/
@RequestMapping("/update")
public R update(@RequestBody ShipinEntity shipin, HttpServletRequest request) throws NoSuchFieldException, ClassNotFoundException, IllegalAccessException, InstantiationException {
logger.debug("update方法:,,Controller:{},,shipin:{}",this.getClass().getName(),shipin.toString());
ShipinEntity oldShipinEntity = shipinService.selectById(shipin.getId());//查询原先数据
String role = String.valueOf(request.getSession().getAttribute("role"));
// if(false)
// return R.error(511,"永远不会进入");
if("".equals(shipin.getShipinPhoto()) || "null".equals(shipin.getShipinPhoto())){
shipin.setShipinPhoto(null);
}
if("".equals(shipin.getShipinVideo()) || "null".equals(shipin.getShipinVideo())){
shipin.setShipinVideo(null);
}
shipinService.updateById(shipin);//根据id更新
return R.ok();
}
/**
* 删除
*/
@RequestMapping("/delete")
public R delete(@RequestBody Integer[] ids, HttpServletRequest request){
logger.debug("delete:,,Controller:{},,ids:{}",this.getClass().getName(),ids.toString());
List<ShipinEntity> oldShipinList =shipinService.selectBatchIds(Arrays.asList(ids));//要删除的数据
ArrayList<ShipinEntity> list = new ArrayList<>();
for(Integer id:ids){
ShipinEntity shipinEntity = new ShipinEntity();
shipinEntity.setId(id);
shipinEntity.setShipinDelete(2);
list.add(shipinEntity);
}
if(list != null && list.size() >0){
shipinService.updateBatchById(list);
}
return R.ok();
}
/**
* 批量上传
*/
@RequestMapping("/batchInsert")
public R save( String fileName, HttpServletRequest request){
logger.debug("batchInsert方法:,,Controller:{},,fileName:{}",this.getClass().getName(),fileName);
Integer yonghuId = Integer.valueOf(String.valueOf(request.getSession().getAttribute("userId")));
SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
//.eq("time", new SimpleDateFormat("yyyy-MM-dd").format(new Date()))
try {
List<ShipinEntity> shipinList = new ArrayList<>();//上传的东西
Map<String, List<String>> seachFields= new HashMap<>();//要查询的字段
Date date = new Date();
int lastIndexOf = fileName.lastIndexOf(".");
if(lastIndexOf == -1){
return R.error(511,"该文件没有后缀");
}else{
String suffix = fileName.substring(lastIndexOf);
if(!".xls".equals(suffix)){
return R.error(511,"只支持后缀为xls的excel文件");
}else{
URL resource = this.getClass().getClassLoader().getResource("static/upload/" + fileName);//获取文件路径
File file = new File(resource.getFile());
if(!file.exists()){
return R.error(511,"找不到上传文件，请联系管理员");
}else{
List<List<String>> dataList = PoiUtil.poiImport(file.getPath());//读取xls文件
dataList.remove(0);//删除第一行，因为第一行是提示
for(List<String> data:dataList){
//循环
ShipinEntity shipinEntity = new ShipinEntity();
// shipinEntity.setShipinName(data.get(0)); //视频标题 要改的
// shipinEntity.setShipinPhoto("");//详情和图片
// shipinEntity.setShipinVideo(data.get(0)); //视频 要改的
// shipinEntity.setZanNumber(Integer.valueOf(data.get(0))); //赞 要改的
// shipinEntity.setCaiNumber(Integer.valueOf(data.get(0))); //踩 要改的
// shipinEntity.setShipinTypes(Integer.valueOf(data.get(0))); //视频类型 要改的
// shipinEntity.setShipinClicknum(Integer.valueOf(data.get(0))); //视频热度 要改的
// shipinEntity.setShipinContent("");//详情和图片
// shipinEntity.setShipinDelete(1);//逻辑删除字段
// shipinEntity.setInsertTime(date);//时间
// shipinEntity.setCreateTime(date);//时间
shipinList.add(shipinEntity);
//把要查询是否重复的字段放入map中
}
//查询是否重复
shipinService.insertBatch(shipinList);
return R.ok();
}
}
}
}catch (Exception e){
e.printStackTrace();
return R.error(511,"批量插入数据异常，请联系管理员");
}
}
/**
* 个性推荐
*/
@IgnoreAuth
@RequestMapping("/gexingtuijian")
public R gexingtuijian(@RequestParam Map<String, Object> params, HttpServletRequest request){
logger.debug("gexingtuijian方法:,,Controller:{},,params:{}",this.getClass().getName(),JSONObject.toJSONString(params));
CommonUtil.checkMap(params);
List<ShipinView> returnShipinViewList = new ArrayList<>();
//查看收藏
Map<String, Object> params1 = new HashMap<>(params);params1.put("sort","id");params1.put("yonghuId",request.getSession().getAttribute("userId"));
params1.put("shangxiaTypes",1);
params1.put("shipinYesnoTypes",2);
PageUtils pageUtils = shipinCollectionService.queryPage(params1);
List<ShipinCollectionView> collectionViewsList =(List<ShipinCollectionView>)pageUtils.getList();
Map<Integer,Integer> typeMap=new HashMap<>();//购买的类型list
for(ShipinCollectionView collectionView:collectionViewsList){
Integer shipinTypes = collectionView.getShipinTypes();
if(typeMap.containsKey(shipinTypes)){
typeMap.put(shipinTypes,typeMap.get(shipinTypes)+1);
}else{
typeMap.put(shipinTypes,1);
}
}
List<Integer> typeList = new ArrayList<>();//排序后的有序的类型 按最多到最少
typeMap.entrySet().stream().sorted((o1, o2) -> o2.getValue() - o1.getValue()).forEach(e -> typeList.add(e.getKey()));//排序
Integer limit = Integer.valueOf(String.valueOf(params.get("limit")));
for(Integer type:typeList){
Map<String, Object> params2 = new HashMap<>(params);params2.put("shipinTypes",type);
params2.put("shangxiaTypes",1);
params2.put("shipinYesnoTypes",2);
PageUtils pageUtils1 = shipinService.queryPage(params2);
List<ShipinView> shipinViewList =(List<ShipinView>)pageUtils1.getList();
returnShipinViewList.addAll(shipinViewList);
if(returnShipinViewList.size()>= limit) break;//返回的推荐数量大于要的数量 跳出循环
}
params.put("shangxiaTypes",1);
params.put("shipinYesnoTypes",2);
//正常查询出来商品,用于补全推荐缺少的数据
PageUtils page = shipinService.queryPage(params);
if(returnShipinViewList.size()<limit){//返回数量还是小于要求数量
int toAddNum = limit - returnShipinViewList.size();//要添加的数量
List<ShipinView> shipinViewList =(List<ShipinView>)page.getList();
for(ShipinView shipinView:shipinViewList){
Boolean addFlag = true;
for(ShipinView returnShipinView:returnShipinViewList){
if(returnShipinView.getId().intValue() ==shipinView.getId().intValue()) addFlag=false;//返回的数据中已存在此商品
}
if(addFlag){
toAddNum=toAddNum-1;
returnShipinViewList.add(shipinView);
if(toAddNum==0) break;//够数量了
}
}
}else {
returnShipinViewList = returnShipinViewList.subList(0, limit);
}
for(ShipinView c:returnShipinViewList)
dictionaryService.dictionaryConvert(c, request);
page.setList(returnShipinViewList);
return R.ok().put("data", page);
}
/**
* 前端列表
*/
@IgnoreAuth
@RequestMapping("/list")
public R list(@RequestParam Map<String, Object> params, HttpServletRequest request){
logger.debug("list方法:,,Controller:{},,params:{}",this.getClass().getName(),JSONObject.toJSONString(params));
CommonUtil.checkMap(params);
PageUtils page = shipinService.queryPage(params);
//字典表数据转换
List<ShipinView> list =(List<ShipinView>)page.getList();
for(ShipinView c:list)
dictionaryService.dictionaryConvert(c, request); //修改对应字典表字段
return R.ok().put("data", page);
}
/**
* 前端详情
*/
@RequestMapping("/detail/{id}")
public R detail(@PathVariable("id") Long id, HttpServletRequest request){
logger.debug("detail方法:,,Controller:{},,id:{}",this.getClass().getName(),id);
ShipinEntity shipin = shipinService.selectById(id);
if(shipin !=null){
//点击数量加1
shipin.setShipinClicknum(shipin.getShipinClicknum()+1);
shipinService.updateById(shipin);
//entity转view
ShipinView view = new ShipinView();
BeanUtils.copyProperties( shipin , view );//把实体数据重构到view中
//修改对应字典表字段
dictionaryService.dictionaryConvert(view, request);
return R.ok().put("data", view);
}else {
return R.error(511,"查不到数据");
}
}
/**
* 前端保存
*/
@RequestMapping("/add")
public R add(@RequestBody ShipinEntity shipin, HttpServletRequest request){
logger.debug("add方法:,,Controller:{},,shipin:{}",this.getClass().getName(),shipin.toString());
Wrapper<ShipinEntity> queryWrapper = new EntityWrapper<ShipinEntity>()
.eq("shipin_name", shipin.getShipinName())
.eq("shipin_video", shipin.getShipinVideo())
.eq("zan_number", shipin.getZanNumber())
.eq("cai_number", shipin.getCaiNumber())
.eq("shipin_types", shipin.getShipinTypes())
.eq("shipin_clicknum", shipin.getShipinClicknum())
.eq("shipin_delete", shipin.getShipinDelete())
// .notIn("shipin_types", new Integer[]{102})
;
logger.info("sql语句:"+queryWrapper.getSqlSegment());
ShipinEntity shipinEntity = shipinService.selectOne(queryWrapper);
if(shipinEntity==null){
shipin.setZanNumber(1);
shipin.setCaiNumber(1);
shipin.setShipinClicknum(1);
shipin.setShipinDelete(1);
shipin.setInsertTime(new Date());
shipin.setCreateTime(new Date());
shipinService.insert(shipin);
return R.ok();
}else {
return R.error(511,"表中有相同数据");
}
}
}
ChatServiceImpl.java
package com.service.impl;
import com.utils.StringUtil;
import com.service.DictionaryService;
import com.utils.ClazzDiff;
import org.springframework.beans.BeanUtils;
import org.springframework.beans.factory.annotation.Autowired;
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 org.springframework.lang.Nullable;
import org.springframework.util.Assert;
import com.dao.ChatDao;
import com.entity.ChatEntity;
import com.service.ChatService;
import com.entity.view.ChatView;
/**
* 客服聊天 服务实现类
*/
@Service("chatService")
@Transactional
public class ChatServiceImpl extends ServiceImpl<ChatDao, ChatEntity> implements ChatService {
@Override
public PageUtils queryPage(Map<String,Object> params) {
Page<ChatView> page =new Query<ChatView>(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="auto"
>
<el-row>
<el-col :span="12">
<el-form-item class="input" v-if="type!='info'" label="状态编码" prop="codeIndex">
<el-input v-model="ruleForm.codeIndex"
placeholder="状态编码" clearable :readonly="ro.codeIndex"></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="状态编码" prop="codeIndex">
<el-input v-model="ruleForm.codeIndex"
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="indexName">
<el-input v-model="ruleForm.indexName"
placeholder="状态" clearable :readonly="ro.indexName"></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="状态" prop="indexName">
<el-input v-model="ruleForm.indexName"
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="beizhu">
<el-input v-model="ruleForm.beizhu"
placeholder="备注" clearable :readonly="ro.beizhu"></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="备注" prop="beizhu">
<el-input v-model="ruleForm.beizhu"
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
return {
addEditForm:null,
id: '',
type: '',
ro:{
codeIndex : true,
indexName : false,
superId : false,
beizhu : false,
},
ruleForm: {
codeIndex: '',
indexName: '',
superId : '',
beizhu : '',
},
rules: {
/*beizhu: [
{ required: true, message: '备注不能为空', trigger: 'blur' },
{ pattern: /^[1-9]\d*$/,
message: '备注只能为正整数',
trigger: 'blur'
}
],*/
}
};
},
props: ["parent"],
computed: {
},
created() {
this.addEditForm = styleJs.addStyle();
this.addEditStyleChange()
this.addEditUploadStyleChange()
},
methods: {
// 初始化
init(id,type) {
if (id) {
this.id = id;
this.type = type;
}
if(this.type=='info'||this.type=='else'){
this.info(id);
}else{
//查询最大值 start
this.$http({
url: `dictionary/maxCodeIndex`,
method: "post",
data: {"dicCode":"zhuangtai_types"}
}).then(({ data }) => {
if (data && data.code === 0) {
this.ruleForm.codeIndex = data.maxCodeIndex;
} else {
this.$message.error(data.msg);
}
});
//查询最大值 end
}
},
// 多级联动参数
info(id) {
this.$http({
url: `dictionary/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() {
if((!this.ruleForm.indexName)){
this.$message.error('状态不能为空');
return
}
this.$refs["ruleForm"].validate(valid => {
if (valid) {
let ruleForm = this.ruleForm;
ruleForm["dicCode"]="zhuangtai_types";
ruleForm["dicName"]="状态";
this.$http({
url: `dictionary/${!this.ruleForm.id ? "save" : "update"}`,
method: "post",
data: 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.dictionaryCrossAddOrUpdateFlag = false;
this.parent.search();
this.parent.contentStyleChange();
}
});
} else {
this.$message.error(data.msg);
}
});
}
});
},
// 返回
back() {
this.parent.showFlag = true;
this.parent.addOrUpdateFlag = false;
this.parent.dictionaryCrossAddOrUpdateFlag = 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;
background-color: transparent;
}
.btn .el-button {
padding: 0;
}</style>
声明
本博客适用于广泛的学术和教育用途，包括但不限于个人学习、开发设计，产品设计。仅供学习参考，旨在为读者提供深入理解和学术研究的材料。
594
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
