学成在线--day03 CMS页面管理开发

2023-05-16

学成在线 第3天 讲义-CMS页面管理开发

1 自定义条件

1.1 需求分析 
在页面输入查询条件,查询符合条件的页面信息。
查询条件如下:
站点Id:精确匹配
模板Id:精确匹配
页面别名:模糊匹配
...

自定义模板查询,根据站点ID,模板ID等各种属性得查询都是将其封装到一个对象里面,然后给对象设置属性,最后,在查询对象进行得赋值操作,模糊查询得时候,要先构造出来模糊查询得条件,在根据查询得条件封装到对应得查询条件器里面最好,最好在执行查询方法。

 //自定义模板查询
    @Test
    public void findByExample(){
        int page=0;
        int size=10;
        Pageable pageable=PageRequest.of(page,size);
        CmsPage cmsPage=new CmsPage();
       // cmsPage.setSiteId("5a751fab6abb5044e0d19ea1");//设置站点得ID
        //模糊查询
        cmsPage.setPageAliase("轮播");
        ExampleMatcher exampleMatcher=ExampleMatcher.matching();
        exampleMatcher= exampleMatcher.withMatcher("pageAliase",ExampleMatcher.GenericPropertyMatchers.contains());
        Example<CmsPage> example=Example.of(cmsPage,exampleMatcher);

        Page<CmsPage> all = cmsPageRepository.findAll(example, pageable);
        List<CmsPage> content = all.getContent();
        System.out.println(content);

    }

后台Service根据条件查询的接口

     //如果查询条件为空,则新建
        if (queryPageRequest==null){
            queryPageRequest=new QueryPageRequest();
        }
        //构建查询器
        ExampleMatcher exampleMatcher=ExampleMatcher.matching().withMatcher("pageAliase",ExampleMatcher.GenericPropertyMatchers.contains());
        CmsPage cmsPage=new CmsPage();
        //如果SiteId不为空
        if (StringUtils.isNotEmpty(queryPageRequest.getSiteId()))
        {
            cmsPage.setSiteId(queryPageRequest.getSiteId());
        }
        //如果TemplagtId不为空
        if (StringUtils.isNotEmpty(queryPageRequest.getTemplateId())){
            cmsPage.setTemplateId(queryPageRequest.getTemplateId());
        }
        //如果PageAliase不为空
        if (StringUtils.isNotEmpty(queryPageRequest.getPageAliase())){
            cmsPage.setPageAliase(queryPageRequest.getPageAliase());
        }
        //构建查询器
        Example example=Example.of(cmsPage,exampleMatcher);
        if (page<=0){
            page=0;
        }
        if (size<=0){
            size=10;
        }
        //构建分页对象
        PageRequest pageRequest = PageRequest.of(page, size);
        Page all = cmsPageRepository.findAll(example, pageRequest);
        QueryResult<CmsPage> queryResult=new QueryResult<>();
        List content = all.getContent();
        long totalElements = all.getTotalElements();
        queryResult.setList(content);
        queryResult.setTotal(totalElements);
        return new QueryResponseResult(CommonCode.SUCCESS,queryResult);
    }

 请求成功

前端页面的自定义查询条件的添加,当接口查询成功之后,前端页面的接口和后端的接口对接即可,还是比较简单的

page_list中的前端代码:其实最重要的事Stringfy这个前端函数的应用,是把字符串拼接组合一下,这个的应用非常重要

   query(){
        page_list(this.param.page,this.param.size,this.param).then(res=>{
          console.log(res.queryResult.list)
          this.list=res.queryResult.list;
          this.total=res.queryResult.total;
          this.siteList=res.queryResult.list;
          console.log(this.siteList)
        });
      },
export const page_list=(page,size,queryparam)=>{
    let params=  querystring.stringify(queryparam);
  return http.requestQuickGet(apiUrl+'/cms/page/list/'+page+'/'+size+''+'/?'+params);
}

还有一点就是这个page是从0开始的,所以一开始的时候搜所这个轮播是没有的,代码没有过BUG,只是把page=0这个条件给忽略了需要从后台才能加上

 

创建唯一索引

新增页面的接口编写,pageService

 public CmsPageResult insertCmsPage(CmsPage cmsPage) {
        //检查cmspage在数据库中是否存在,如果不存在就新增
        CmsPageResult result = cmsPageRepository.findBySiteIdAndPageWebPathAndPageName(cmsPage.getSiteId(), cmsPage.getPageWebPath(), cmsPage.getPageName());
        if (result==null){
            cmsPage.setPageId(null);
            CmsPage cmsPage1 = cmsPageRepository.save(cmsPage);
            return new CmsPageResult(CommonCode.SUCCESS,cmsPage1);
        }
        return new CmsPageResult(CommonCode.FAIL,null);
    }

完成测试:

 

 关于返回路由带上参数,其实大部分还是涉及到了Vue的相关的知识,多学一些练一练手

添加gobakc返回按钮的代码:


<el-button type="primary" @click="go_back" >返回</el-button>  

接下来就是定义go_back方法,这个页面主要也就是页面校验信息规则的添加已经页面的部分新增表单的完善,整体的功能部分还是关于Vue的知识的应用,涉及到的后端的知识不多

  go_back(){
          this.$router.push(
            {
              path:'/cms/page/list',
              query:{
                page:this.$route.query.page,
                siteId:this.$route.query.siteId
              }
            }
          )
        },


==========================================
created() {
      this.param.page=Number.parseInt(this.$route.query.page||1),
      this.param.siteId=this.$route.query.siteId || ''
    },

完成测试

新增页面的表单提交:

 addSubmit(){
          this.$refs.pageForm.validate(validate=>{
            if (validate){
              this.$confirm('您确定要提交么?, 是否继续?', '提示', {
              }).then(() => {
                page_add(this.pageForm).then(res=>{
                  if (res.success){
                    this.$message({
                      type: 'success',
                      message: '提交成功!'
                    });
                    this.$refs['pageForm'].resetFields();
                  }
                })
              })
            }else {
              this.$message.error("提交失败")
            }
          })
      }

更新页面要根据ID查询出来这个实体对象,之后在根据这个实体对象更新出来具体的值得内容之后便可以进行更新得操作了 

Cotroller &Service中得部分代码:

================================Controller=================
 @Override
    @GetMapping("/get/{id}")
    public CmsPage findById(@PathVariable("id") String id) {
            return pageService.findById(id);
    }

    @Override
    @PutMapping("/edit/{id}")
    public CmsPageResult edit(@PathVariable("id") String id,@RequestBody CmsPage cmsPage) {
        return pageService.edit(id,cmsPage);
    }
================================Service=================
    public CmsPage findById(String id) {
        Optional<CmsPage> cmsPage = cmsPageRepository.findById(id);
        if (cmsPage.isPresent()){
            CmsPage cmsPage1 = cmsPage.get();
            return cmsPage1;
        }
        return null;
    }

    public CmsPageResult edit(String id, CmsPage cmsPage) {
        CmsPage one = this.findById(id);
        if (one!=null){
            one.setTemplateId(cmsPage.getTemplateId());//更新所属站点 
            one.setSiteId(cmsPage.getSiteId()); //更新页面别名 
            one.setPageAliase(cmsPage.getPageAliase()); //更新页面名称 
            one.setPageName(cmsPage.getPageName()); //更新访问路径 
            one.setPageWebPath(cmsPage.getPageWebPath()); //更新物理路径 
            one.setPagePhysicalPath(cmsPage.getPagePhysicalPath()); 
            CmsPage save = cmsPageRepository.save(one);
            return new CmsPageResult(CommonCode.SUCCESS,save);
        }
        return new CmsPageResult(CommonCode.FAIL,null);
    }

完成测试:

页面修改得前端代码,因为大部分得页面模板都一样,所以这个时候直接复制前一个模板就可以了,首先得思路和后端得思路一样需要将页面中需要编辑得信息,回显到页面中,然后在执行保存得按钮,在修改前得得代码得时候,第一步先将页面复制进来,之后,在index.js中添加路由,定义字节点,之后在cmsApi中定义请求根据ID查询得方法和edit保存 得ajax请求,这个路由相关得就定义完了,有个比较重要得地方,就是根据ID查询数据回显得时候,需要传入这条记录得ID值,所以在定义路由得时候要把ID这个变量跟到后面,这样在LIST这个页面用路由得方法得时候,可以直接在后面拼ID,就很方便得查询回显得数据了

 

前得代码定义完毕之后可以直接进行测试了:

数据回显成功:

开始数据编辑:提交成功,之后编辑成功

删除操作得相关代码:

   public ResponseResult delByID(String id) {
        Optional<CmsPage> cmsPage = cmsPageRepository.findById(id);
        if (cmsPage.isPresent()){
            cmsPageRepository.deleteById(id);
            return new ResponseResult(CommonCode.SUCCESS);
        }
        return new ResponseResult(CommonCode.FAIL);
    }

前端执行删除操作,前端得操作基本和编辑得操作一样,只要把ID获取到,直接发送请求到后台就可以直接删除了

  del(pageId){
        this.$confirm('您确定要删除么?, 是否继续?', '提示', {
        }).then(() => {
          page_del(pageId).then(res=>{
            if (res.success){
              this.$message({
                type: 'success',
                message: '删除成功!'
              });
            }
          })
        })
      },

 

可预知异常得补货,因为要针对不同得情况,设置出来不同得异常信息,以便给用户更友好得提示

代码设计得时候分为了CunstomerException抛出异常类,以及异常捕获类,这些都是工具类,只要把这工具类设计到异常出现得地方,就可以避免少些try ,catch

真对不可预知异常,处理得时候也是真对不同的情况,来处理的,主要思路是封装到一个map,中map中已经有的是针对框架跑出来的异常,重写或覆盖掉框架抛出的异常,就可以实现自定义异常,个人感觉这个自定义抛出异常的处理的方式还是很不友好,但是课程中展示的解决的方式还是很特别的一种解决方式,也是学习的一种方式

public class CustomException  extends RuntimeException{

    //错误代码
    ResultCode resultCode;

    /**
     * Constructs a new runtime exception with {@code null} as its
     * detail message.  The cause is not initialized, and may subsequently be
     * initialized by a call to {@link #initCause}.
     */
    public CustomException(ResultCode resultCode) {
        this.resultCode = resultCode;
    }

    public ResultCode getResultCode() {
        return resultCode;
    }

    public void setResultCode(ResultCode resultCode) {
        this.resultCode = resultCode;
    }
}
public class ExceptionCast {
    public static void cast(ResultCode resultCode){
        throw new CustomException(resultCode);
    }
}
@ControllerAdvice
public class ExceptionCatch {
    private static  final Logger LOGGER=LoggerFactory.getLogger(ExceptionCatch.class);

    private static ImmutableMap<Class<? extends Throwable>,ResultCode> EXCEPTION;
    public static ImmutableMap.Builder<Class<? extends Throwable>,ResultCode>builder= ImmutableMap.builder();



    @ExceptionHandler(CustomException.class)
    @ResponseBody
    public ResponseResult customerException(CustomException customer){
        LOGGER.error("errors--------"+customer.getMessage());
        ResultCode resultCode = customer.getResultCode();
        return new ResponseResult(resultCode);
    }

    @ExceptionHandler(CustomException.class)
    @ResponseBody
    public ResponseResult Exception(CustomException customer){
        LOGGER.error("errors--------"+customer.getMessage());
        if (EXCEPTION==null){
            EXCEPTION=     builder.build();//构建成功
            //找对应得代码,返回给响应给用户,响应9999得移仓
            ResultCode resultCode = EXCEPTION.get(customer.getClass());
            if (resultCode!=null){
                return new ResponseResult(resultCode);
            }else {
                return new ResponseResult(CommonCode.SERVER_ERROR);
            }
        }
        return new ResponseResult(CommonCode.SERVER_ERROR);
    }
    static {
        builder.put(HttpMessageNotReadableException.class,CommonCode.FAIL);
    }
}

 

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

学成在线--day03 CMS页面管理开发 的相关文章

  • Android 使用LottieAnimationView 做启动动画

    lt xml version 61 34 1 0 34 encoding 61 34 utf 8 34 gt lt RelativeLayout xmlns android 61 34 http schemas android com ap
  • Android OkHttp★

    1 OkHttp OkHttp是Square公司开发的一个处理网络请求的开源项目 是目前Android使用最广泛的网络框架 OkHttp的特点 支持HTTP 2并允许对同一主机的所有请求共享一个socket连接 如果非HTTP 2 则通过连
  • Android GestureDetector★★★

    1 GestureDetecor 用户触摸屏幕时会产生许多手势 xff0c 一般通过重写View类的onTouch 方法可以处理一些触摸事件 xff0c 但是这个方法太过简单 xff0c 如果需要处理一些复杂的手势 xff0c 用这个接口就
  • Android canvas

    1 Canvas Canvas指画布 xff0c 表现在屏幕上就是一块区域 xff0c 可以在上面使用各种API绘制想要的东西 canvas内部维持了一个mutable Bitmap xff0c 所以它可以使用颜色值去填充整个Bitmap
  • Android apk打包流程★

    1 apk打包 Android开发中打包apk主要有两种方式 使用Android Studio集成直接生成apk 使用ant工具在命令行方式下打包apk 不管哪种方式 打包apk的本质过程都是一样的 Android的apk包文件包括两部分
  • Android ViewPager用法

    1 适配器PagerAdapter ViewPager使用适配器类将数据和view的处理分离 xff0c ViewPager的适配器叫PagerAdapter xff0c 这是一个抽象类 xff0c 不能实例化 xff0c 所以它有两个子类
  • Android Fragment★★

    1 Fragment fragment译为 碎片 xff0c 是Android 3 0 xff08 API 11 xff09 提出的 xff0c 最开始是为了适配大屏的平板 Fragment看起来和Activity一样 xff0c 是一个用
  • Android设计模式—适配器模式★★★

    1 适配器模式 适配器模式是指把一个类的接口变换成客户端所期待的另一种接口 xff0c 从而使原本因接口不匹配而无法在一起工作的两个类能够在一起工作 适配器模式是为了解决接口不兼容问题的 比如厂商给你的接口和你现有的接口对接不起来 旧的数据
  • Android 类加载机制

    nbsp 1 类加载机制 java文件不是可执行的文件 需要先编译成 class文件才可以被虚拟机执行 而类加载就是指通过类加载器把 class文件加载到虚拟机的内存空间 具体来说是方法区 类通常是按需加载 即第一次使用该类时才加载 Jav
  • Android Bitmap防止内存溢出

    1 Bitmap 在Android开发中经常会使用到Bitmap xff0c 而Bitmap使用不当很容易引发OOM Bitmap占用内存大小的计算公式为 xff1a 图片宽度 图片高度 一个像素点所占字节数 xff0c 因此减小这三个参数
  • Swift NSAttributedString的使用

    NSMutableAttributedString let testAttributes 61 NSAttributedStringKey foregroundColor UIColor blue NSAttributedStringKey
  • Android ViewStub

    1 ViewStub ViewStub是一个可用于性能优化的控件 xff0c 它是一个不可见的 零尺寸的View xff0c 可以在运行时进行延迟加载一个布局文件 xff0c 从而提高显示速率 viewstub和include比较像 xff
  • Android Jetpack—LiveData和数据倒灌

    1 LiveData LiveData是Android Jetpack包提供的一种可观察的数据存储器类 xff0c 它可以通过添加观察者被其他组件观察其变更 不同于普通的观察者 xff0c LiveData最重要的特征是它具有生命周期感知能
  • Gradle build 报错:Received status code 400 from server: Bad Request

    全部错误是这样的 xff1a Could not GET 39 https dl google com dl android maven2 com android tools build gradle 3 1 2 gradle 3 1 2
  • 排列组合详解

    在笔试题中看到的一个选择题 用1 3的瓷砖密铺3 20的地板有几种方式 xff1f 排列组合问题 排列和组合问题 xff0c 其实是两种问题 xff0c 区分它们的原则是是否需要考虑顺序的不同 排列问题 xff0c 考虑顺序 xff1b 组
  • SCKKRS-关键词、关键短语提取

    1 简介 SCKKRS Self supervised Contextual Keyword and Keyphrase Retrieval with Self Labelling 本文根据2019年 Self supervised Con
  • kali安装vnc

    一 安装x11vnc 1 经过N多次的实验 xff0c kali一直报错 xff0c tightvncserver一直报错 怎么配置都是黑屏 xff0c 奔溃 最后退而求其次 xff0c 安装x11vnc 2 很简单的命令 sudo apt
  • 计算机硬件技术基础第一章总结

    1 1 计算机发展概述 1 1 1 计算机的发展简史 第一台计算机 xff1a ENIAC 第一代 xff1a 电子管数字计算机 xff08 1946 1958 xff09 逻辑元件 xff1a 真空电子管体积大 xff0c 功耗高 xff
  • CentOS7安装Oracle JDK1.8

    JDK1 8下载地址 https www oracle com java technologies javase javase8 archive downloads html 需要登录之后才能下载文件 xff0c 下载jdk 8u202 l
  • Ubuntu 16.04 安装 rtl8812au系列 (DWA-182) wireless adapter driver

    Ubuntu 16 04 安装 rtl8812au系列 DWA 182 wireless adapter driver 刚刚开始使用Linux xff0c 一脸懵逼 xff0c 命令行搞得一愣一愣的 xff0c 不过熟悉了之后就好很多了 一

随机推荐

  • SpringBoot项目启动失败报错Annotation-specified bean name ‘xx‘ for bean class [xxx] conflicts with existing

    问题描述 xff1a 项目启动就会报 xff1a Annotation specified bean name xx for bean class xxx conflicts with existing non compatible bea
  • Visual Studio高效实用的扩展工具、插件

    说明 xff1a 对一个有想法的程序员来说 xff0c 善于使用一款高效的开发工具是很重要的 xff0c 今天给大家介绍的是宇宙第一IDE vs用起来很不错的开发工具 xff0c 假如大家觉得不错也可以尝试的用用 xff0c 毕竟对于我们这
  • java琐事

    并发编程 并发的意义 并发通常是提高运行在单处理器上的程序的性能 如果程序中的某个任务因为该程序控制范围之外的某些条件 I O 而导致不能继续执行 xff0c 那么这个任务或线程就阻塞了 如果没有并发 xff0c 整个程序都讲停下来 从性能
  • java类的初始化和实例化的初始化(类的初始化过程)

    Java类的加载顺序 父类静态代变量 父类静态代码块 子类静态变量 子类静态代码块 父类非静态变量 xff08 父类实例成员变量 xff09 父类构造函数 子类非静态变量 xff08 子类实例成员变量 xff09 子类构造函数 上面的说法也
  • 最优吞吐量和最短停顿时间

    在实践活动中 xff0c 我们通过最优吞吐量和最短停顿时间来评价jvm系统的性能 吞吐量越高算法越好 暂停时间越短算法越好 首先让我们来明确垃圾收集 GC 中的两个术语 吞吐量 throughput 和暂停时间 pause times JV
  • sql执行慢的原因有哪些,如何进行sql优化?

    一 导致SQL执行慢的原因 1 硬件问题 如网络速度慢 xff0c 内存不足 xff0c I O吞吐量小 xff0c 磁盘空间满了等 2 没有索引或者索引失效 xff08 一般在互联网公司 xff0c DBA会在半夜把表锁了 xff0c 重
  • 阿里java开发手册2019年最新版619(华山版)PDF下载

    链接 https pan baidu com s 1ANvBu1hidnvRCZILDGXuQA 密码 ugq8
  • Mockito:org.mockito.exceptions.misusing.InvalidUseOfMatchersException

    org span class token punctuation span mockito span class token punctuation span exceptions span class token punctuation
  • 一个简单通用的基于java反射实现pojo转为fastjson对象的方法

    最近在公司工作需要实现一个工具实现一个pojo转为fastjson对象的通用工具 xff0c 直接上源码 span class token comment 通用的pojo转为Json对象的方法 64 author ZFX 64 date20
  • Java魔法类:Unsafe应用解析

    这个美团大神对于Unsafe的分析很全面 https tech meituan com 2019 02 14 talk about java magic class unsafe html
  • Linux X-Window Error: Can‘t open display: :0

    问题过程描述 许多经常部署Oracle数据的管理员经常需要对数据库软件进行部署 xff0c 但大多数都是通过远程部署的方式进行部署 xff0c 使用远程部署有两种方式 xff0c 一种是通过脚本部署 xff0c 另一种就是通过图形化进行部署
  • maven打包生成war跳过单元测试

    maven将项目打包成war包的命令是 mvn install 或mvn package 每次生成war包时会进行所以的单元测试 xff0c 如果想跳过单元测试直接生成war包有以下3种方式 方法1 xff1a 在pom xml中加入如下代
  • 程序员每天工作多少个小时_程序员每天实际工作几个小时?

    程序员每天工作多少个小时 您如何看待 xff0c 程序员每天实际工作多长时间 xff1f 大多数人会说答案是8到9个小时 有人说他们每天工作12个小时或更长时间 尽管这是正确的 xff0c 但它并不是大多数程序员实际工作的数量 xff0c
  • ubuntu 显示缺少库文件 libcom_err.so.2 解决办法

    运行任何代码都显示 xff1a error while loading shared libraries libcom err so 2 cannot open shared object file No such file or dire
  • 记CVTE第一次面试

    首先说明一下博主是一个大三的学生 xff0c 专业计算机科学与技术 xff0c 主学的方向是Web后台开发 xff0c 主语言是Java 前几天看到CVTE有校园招聘实习生 xff0c 就报名参加了 xff0c 做了CVTE的笔试题 xff
  • Java Socket 编程那些事(1)

    前言 最近在准备面试和笔试的一些东西 xff0c 回去翻看了Java关于IO的基础 xff0c 发现很多基础还是没有记牢固 xff0c 现在回头重新学习 xff0c 就从socket通讯开始吧 xff0c 虽然说现在企业很少直接编写sock
  • Redis集群的原理和搭建

    前言 Redis 是我们目前大规模使用的缓存中间件 xff0c 由于它强大高效而又便捷的功能 xff0c 得到了广泛的使用 单节点的Redis已经就达到了很高的性能 xff0c 为了提高可用性我们可以使用Redis集群 本文参考了Rdis的
  • Java多线程爬虫爬取京东商品信息

    前言 网络爬虫 xff0c 是一种按照一定的规则 xff0c 自动地抓取万维网信息的程序或者脚本 爬虫可以通过模拟浏览器访问网页 xff0c 从而获取数据 xff0c 一般网页里会有很多个URL 爬虫可以访问这些URL到达其他网页 xff0
  • 关于js中的“Uncaught SyntaxError: Unexpected token

    我在js中为一个已经定义的数组重新定义新的一个维度的数组时 xff0c 调试器这样报错 只说结果 xff1a 肯定是在给已经定义的数组中的元素重新定义下一维度时 xff0c 多在前面加了一个 var 就像下面的这样 xff1a var gr
  • 学成在线--day03 CMS页面管理开发

    学成在线 第3天 讲义 CMS页面管理开发 1 自定义条件 1 1 需求分析 在页面输入查询条件 xff0c 查询符合条件的页面信息 查询条件如下 xff1a 站点Id xff1a 精确匹配 模板Id xff1a 精确匹配 页面别名 xff