基于SpringBoot视频点播系统的设计与实现--论文pf

admin 管理员组

文章数量: 887021

文章目录

• • springboot511基于SpringBoot视频点播系统的设计与实现
• 第1章 绪论
• • 1.1选题动因
  • 1.2目的和意义
  • 1.3论文结构安排
• 第2章 开发环境与技术
• • 2.2 Java语言技术
  • 2.3 SpringBoot框架
  • 2.4 B/S模式框架
• 第3章 系统分析
• • 3.1 系统可行性分析
  • • 3.1.1技术可行性分析
    • 3.1.2经济可行性分析
    • 3.1.3运行可行性分析
• 第4章 系统设计
• • 4.1界面设计原则
  • 4.2功能结构设计
  • 4.3数据库设计
  • • 4.3.2 数据库物理设计
• 第5章 系统实现
• • • 5.1用户信息管理
    • 5.2 视频信息管理
    • 5.3论坛信息管理
    • 5.1公告信息管理
• • • • DictionaryServiceImpl.java
      • ShipinController.java
      • ChatServiceImpl.java
      • add-or-update.vue
    • 声明

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客服聊天表

第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.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.apachemons.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>

声明

本博客适用于广泛的学术和教育用途，包括但不限于个人学习、开发设计，产品设计。仅供学习参考，旨在为读者提供深入理解和学术研究的材料。

本文标签： 视频点播系统 论文 SpringBoot PF