若依框架文档开发手册----开发中常用功能模块

Dear 丶 2023-09-23 23:59 144阅读 0赞

**目录**

前端

add.html

时间框

大文本框

Ajax校验

自定义校验

回显选中图片

JS对添加下拉列元素

edit.html

下拉列

回显时间

list.html

搜索栏

时间框

mapper.xml

Table表格

格式化时间

前端

表格匹配字典值

表格增加.减少功能项

全局

其他

关闭标签页

输入框锁定

弹出某页面

JS校验空值

JS绑定input事件

自定义AJAX

添加Class元素

操作结果提示

回显选中图片

Thymeleaf

后端

系统

当前用户

定时器

新增定时器

Controller

关于权限

Service

Dao

Mapper

属性封装

集合遍历

多参数:

其他

BigDecimal使用

MYSQL

--------------------

## **前言:** ##

> 接触若依也很长时间了从1.0到现在的4.0 期间一直想写个手册 但一直没有很好地切入点 最近在开发新系统 正好根据开发中遇到或者使用到的内容作为切入点来进行写文档 可能会有些混乱 一开始先写上准备后续再排版精修 推荐Git拉取,方便文档实时更新
> 
> CSDN过来的同学注意 文档已经停止在CSDN的维护

> **目录结构:**
> 
> 大致分为前端、后端，前端根据使用的页面add、edit、list来进行详细划分，后端根据三层加上其他特殊内容点划分

# 前端 #

## add.html ##

下拉列

// 1 其中t_vip_user_details_vip_type 为字典表的字典类型 可前往-系统管理-->字段管理 --> 添加新的字典
    <div class="form-group">
                <label class="col-sm-3 control-label">VIP用户类别：</label>
                <div class="col-sm-8">
                    <select id="xxxxx" name="xxxxx" class="form-control m-b"
                            th:with="type=${@dict.getType('t_vip_user_details_vip_type')}">
                        <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
                    </select>
                </div>
            </div>
    
    
    // 2 取非字典的数据(model)
            <div class="form-group">
                <label class="col-sm-3 control-label">司机：</label>
                <div class="col-sm-8">
    		<select id="xxxx" name="xxxx" class="form-control m-b">
                  <option value="">--请选择(非必选)--</option>
                  <option th:each="xxxx : ${xxxxList}" th:text="${xxxx.name}" th:value="${xxxx.id}"></option>
            </select>
                </div>
            </div>
    
    //3 使下拉列带有搜索功能:引入该JS即可
    https://www.cnblogs.com/tianxinyu/p/9988763.html
    
    select的class样式为
    <div th:include="include::footer"></div>
    // 该JS需要在include下方
    <script th:src="@{/ajax/libs/select/select2.js}"></script>

## **时间框** ##

<div class="form-group">
        <label class="col-sm-3 control-label">设备到期时间：</label>
        <div class="col-sm-8">
            <div class="input-group date">
               <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
               <input name="xxxxx" class="time-input" placeholder="yyyy-MM-dd" type="text">
            </div>
        </div>
    </div>

## 大文本框 ##

## Ajax校验 ##

$("#form-motorman-add").validate({
            rules: {
                name: {
                    required: true,
                },
                identityCard: {
                    required: true,
                    isIdentity: true,
                    remote: {
                        url: ctx + "iot/motorman/checkIdentityCard",
                        type: "post",
                        dataType: "json",
                        data: {
                            name: function () {
                                return $.common.trim($("#identityCard").val());
                            },
                            id: ''
                        },
                        dataFilter: function (data, type) {
                            return $.validate.unique(data);
                        }
                    }
                },
                contactPhone: {
                    required: true,
                    isPhone: true
                },
            },
            messages: {
                "identityCard": {
                    remote: "身份证号已存在"
                },
            }
        });

/**
    		 * 校验身份证
    		 */
    		@PostMapping("/checkIdentityCard")
    		@ResponseBody
    		public Integer checkIdentityCard(String identityCard, Integer id)
    		{
                // 存在
                return CommonEnum.EXIST.getCode();
                // 不存在
                return CommonEnum.EXIST.NOT_EXIST();
            }

package com.ruoyi.common.constant;
    import lombok.Getter;
    /**
     * @author: 童小纯
     * @Date: 2019-08-08 10:24
     * @Description: < 通用校验是否存在返回状态码 >
     */
    @Getter
    public enum CommonEnum
    	{
    		/**
    		 * 用户是否存在返回码
    		 */
    		EXIST(1, "存在"), NOT_EXIST(0, "不存在");
    		private Integer code;
    		private String msg;
    
    		CommonEnum(Integer code, String msg)
    			{
    				this.code = code;
    				this.msg = msg;
    			}
    	}

## 自定义校验 ##

jQuery.validator.addMethod("isAllNumber", function (value, element) {
            var loginName = $("#loginName").val();
            var patrn = /^[0-9]*$/;
            if (patrn.test(loginName)) {
                return false;
            } else {
                return true;
            }
        }, "用户名不能为纯数字");
    
    
    $("#form-product-edit").validate({
            rules: {
                    loginName: {
                    required: true,
                    // 自定义属性 属性名要和上方的一参一样
                    isAllNumber: true,
                },
            
            }
        });

## 回显选中图片 ##

> 在下方已经写过了
> 
> 路径:前端 --> 其他 --> 回显选中图片
> 
> 如果需要**放大回显图片**可以看
> 
> 前端 --> 其他 --> 放大图片

## JS对添加下拉列元素 ##

http://ourjs.com/detail/5be7fa5cac52fe63eba502af 看这种方式 很好用

## edit.html ##

## 下拉列 ##

## 回显时间 ##

<div class="form-group">
                <label class="col-sm-3 control-label">合同到期日期：</label>
                <div class="col-sm-8" >
                    <input id="xxxxxx" name="xxxxxx" class="time-input" type="text" readonly   th:value="${#dates.format(xx.xxxxxx,'yyyy-MM-dd HH:mm:ss')}">
                </div>
            </div>

## list.html ##

### 搜索栏 ###

下拉列

<li>
       用户状态：<select name="status" th:with="type=${@dict.getType('sys_normal_disable')}">
                	<option value="">所有</option>
               		<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
               </select>
    </li>
    
    
    //2: 下拉列带搜索功能 主要是select class加了form-control 属性
    // 然后引入
    //  <script th:src="@{/ajax/libs/select/select2.css}"></script>
    //  <script th:src="@{/ajax/libs/select/select2.js}"></script>
    
    
    <li style="width: 280px;">
        <p>设备类别: </p>
         <select name="equipmentType" id="equipmentType" th:with="type=${@dict.getType('t_equipment_equipment_type')}" class="form-control">
           <option value="">所有</option>
             <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
          </select>
        </li>

![02c6c85aae4e4fbe9f32dab4ec11e3fa.png][]

**sys\_normal\_disable** **为字典类型值 字典类型值一般为表名字段名来命名防止出现重复**

## 时间框 ##

> 根据开始时间结束时间搜索
> 
> 如果使用的是MybatisPlus版本 注意后台接收数据需要创建Vo对象 或者直接使用Map对象来进行接收**开始时间** 和 **结束时间** 不然会报错的哈

\*\*Html: \*\*

**Vo:**

注意set  get方法和普通实体类有区别
    这么写的原因是防止前端没有传入开始时间和结束时间
    然后mapper.xml 这样去判断就会报错  因为params是null 可以在这个判断外边再加一层if判断params是否为空即可解决  但还是推荐 下边这种方式写get set方法

/** 请求参数 */
    		private Map<String, Object> params;
    		/** get()*/
    		public Map<String, Object> getParams(){if (params == null){params = new HashMap<>();}return params;}
    		/** set() */
    		public void setParams(Map<String, Object> params){this.params = params;}

## **mapper.xml** ##

<if test="params.beginTime != null and params.beginTime !=''">
          AND date_format(xxxxx,'%y%m%d') >= date_format(#{params.beginTime},'%y%m%d')
    </if>
    
    <if test="params.endTime != null and params.endTime  !='' ">
          AND date_format(xxxxx,'%y%m%d') <= date_format(#{params.endTime},'%y%m%d')
     </if>

## Table表格 ##

**刷新表格**

// 这是封装好的方法  不需要在去调用原生的JS了
    $.table.refresh();

**按钮颜色**

> 后边加上 btn-xs 样式会使按钮缩小

深蓝色    btn btn-primary
    	浅蓝色    btn btn-info
    	绿色     	btn btn-success
    	黄色      btn btn-warning
    	红色      btn btn-danger
    	透明      btn btn-link
    	默认		btn btn-default

**自定义按钮颜色**

> > 有时候bootstrap提供的按钮颜色并不能完全满足系统的需要 只有仅限的几个 所以在这时候需要增加自定义的按钮颜色
> > 
> > 下边是两个在线生成bootstrap按钮颜色的网址
> > 
> > [blog.koalite.com/bbg/v2/][blog.koalite.com_bbg_v2]
> > 
> > [twitterbootstrap3buttons.w3masters.nl/][twitterbootstrap3buttons.w3masters.nl]
> > 
> > 以下为增加一个紫色按钮的示例

> 1.  创建一个.css文件
> 2.  将下方的css复制到css文件中
> 3.  页面引入该css文件
> 4.  页面创建个按钮

**第二步所需要的代码:**

.btn-sample {
        color: #FFFFFF;
        text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
        background-color: #611BBD;
        *background-color: #611BBD;
        background-image: -moz-linear-gradient(top, #AF4CE8, #611BBD);
        background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#AF4CE8), to(#611BBD));
        background-image: -webkit-linear-gradient(top, #AF4CE8, #611BBD);
        background-image: -o-linear-gradient(top, #AF4CE8, #611BBD);
        background-image: linear-gradient(to bottom, #AF4CE8, #611BBD);
        background-repeat: repeat-x;
        border-color: #611BBD;
        border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#AF4CE8', endColorstr='#611BBD', GradientType=0);
        filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    }
    
    .btn-sample:hover,
    .btn-sample:focus,
    .btn-sample:active,
    .btn-sample.active,
    .btn-sample.disabled,
    .btn-sample[disabled] {
        color: #FFFFFF;
        background-color: #611BBD;
        *background-color: #003bb3;
    }

**按钮大小**

<div class="container">
            <button class="btn btn-primary">btn-primary</button>
            <button class="btn btn-warning btn-xs">btn-warning</button>
            <button class="btn btn-success btn-sm">btn-success</button>
            <button class="btn btn-info btn-lg">btn-info</button>
        </div>

# 格式化时间 #

/** 合同创建日期 */
    		@JsonFormat(pattern = "yyyy-MM-dd", timezone="GMT+8")
    		private Date contractCreateTime;

## **前端** ##

th:value="*{#dates.format(reserveTime,'yyyy-MM-dd HH:mm:ss')}"

**设置默认排序列**

sortName: 'createTime',
    sortOrder: "desc",

**例:**

**![72bbfd65676f4934b7512694e9dc0714.png][]**

## 表格匹配字典值 ##

var userType = [[${@dict.getType('sys_user_user_type')}]];
    
     // 在table相关属性字段的操作
         {
             field: 'userType',
             title: '类型',
             align: "left",
             formatter: function (value, item, index) {
             return $.table.selectDictLabel(userType, value);
             }
          },

## **表格增加.减少功能项** ##

单页

> 若依的table是用BootstarpTable 而且若依也BootStarpTable简单封装了 如果想要去掉 table右上角的 下载 列表刷新搜索 几个按钮该怎么做呢?也很简单 增加这几个的属性该并为false即可:

![6fd421170442464eb113be2f4bd3e322.png][]

## 全局 ##

> 找到 **ry-ui.js** 将这几个属性设置为false即可

![af3f99400db442b1a7ffc38fa2217289.png][]

**表格初始化完成后执行的回调**

其实就是BootstarpTable的回调函数 网上有很多介绍 这里直接放怎么使用就不介绍了

onLoadSuccess: function (data) {    
    }

**用法:**

**表格固定左|右列后,滚动条被覆盖的bug以及解决**

找到bootstrap-table-fixed-columns.js 的224行 heigth属性值减13就好了

更改后:

this.$fixedBody.css({
      width: this.$fixedHeader.width(),
      height: height-13,
      top: top + 1
    }).show();

## 其他 ##

JS循环

> 添加个链接这个博主写的很详细
> 
> [blog.csdn.net/qq\_41899174…][blog.csdn.net_qq_41899174]

**validator**

**1、动态校验提示信息**

来源:

$.validator.addMethod('PD_password', function (value, element) {
        var len = value.length;
        if(len<6){
            $(element).data('error-msg','长度不能少于6位');
            return false;
        }
        if(len>15){
            $(element).data('error-msg','长度不能大于15位');
            return false;
        }
        return true;
    }, function(params, element) {
        return $(element).data('error-msg');
    });

2、**清空提示信息**

$("#form-consignor-add").validate().resetForm();

3、单独校验指定输入框

// 某个表单里的指定行
    $("#form-xxx").validate().element($("#xxx"))

4、validate使用tooltip提示错误信息

$("#form-add").validate({
            rules: {
            },
            // 下边这些是重要的
            unhighlight: function (element, errorClass, validClass) { //验证通过
                $(element).tooltip('destroy').removeClass(errorClass);
            },
            errorPlacement: function (error, element) {
                if ($(element).next("div").hasClass("tooltip")) {
                    $(element).attr("data-original-title", $(error).text()).tooltip("show");
                } else {
                    $(element).attr("title",
                        $(error).text()).tooltip("show");
                }
            },
    
    
        });

**放大图片**

> 有时候为了页面美观显示的图片比较小 只能看到缩略图 但是在某些情况下又想看到放大后的图片 这时候就需要图片放大功能了 layui的就不介绍了 这里介绍两种其他的
> 
>  *  放大镜方法图片(鼠标悬浮在缩略图上就可以放大)
>  *  弹出层放大图片(点击弹出遮罩层,放大图片)

**放大镜放大:**

> 使用 [jQuery Zoom Plugin][]插件
> 
> github: [github.com/elevateweb/…][github.com_elevateweb]
> 
> 文档地址: [www.myfreax.com/elevatezoom…][www.myfreax.com_elevatezoom]

**Html**

**JQuery**

有六种显示效果 根据需要选择 推荐第一种 如果需要可以访问文档看它的其他属性

$('#zoom_01').elevateZoom({});//默认效果 
     
    $('#zoom_01').elevateZoom({ //内置镜头 
        zoomType: "inner",//类型：内置镜头 
        cursor: "crosshair", //光标：十字 
        zoomWindowFadeIn: 500,//镜头窗口淡入速度 
        zoomWindowFadeOut: 750 //镜头窗口淡出速度 
    }); 
     
    $("#zoom_01").elevateZoom({ //镜头聚焦 
        zoomType: "lens",//类型：透镜效果 
        lensShape: "round", //透镜形状：圆形 
        lensSize: 200 //透镜尺寸：长和宽：200px 
    }); 
     
    $("#zoom_01").elevateZoom({ //淡入/淡出设置 
        zoomWindowFadeIn: 500,//镜头窗口淡入速度 
        zoomWindowFadeOut: 500,//镜头窗口淡出速度 
        lensFadeIn: 500,//透镜淡入速度 
        lensFadeOut: 500//透镜淡出速度 
    }); 
     
    $("#zoom_01").elevateZoom({ //动画 
        easing: true //是否开启动画效果 
    }); 
     
    $("#zoom_01").elevateZoom({ //鼠标滚动 
        scrollZoom: true //是否开启鼠标滚动 
    });

**弹出层放大:**

> 这个就是弹出一个遮罩层 显示图片 没什么好说的直接是上代码吧
> 
> 原文链接: [blog.csdn.net/m0\_37865510…][blog.csdn.net_m0_37865510]

**缩略图位置:**

注意class为:pimg 下边会用到 
    <img  src='images/image1.png'  class="pimg"/>

在html最下边 添加下边这一段代码(**遮罩层**)

注意:**z-index:2;** 为遮罩层显示的高度如果想显示在最上层直接将2改为9999就行了

**JS:**

**新建标签页**

> 若依已经对创建新的标签页已经进行封装 JS方法为: createMenuItem()

**1、 $.modal.openTab()**

现在 在ry-ui.js里已经又对新建菜单页(createMenuItem)进行了封装

// 方式1 打开新的选项卡
    function dept() {
    	var url = ctx + "system/dept";
    	$.modal.openTab("部门管理", url);
    }
    // 方式2 选卡页同一页签打开
    function dept() {
    	var url = ctx + "system/dept";
    	$.modal.parentTab("部门管理", url);
    }
    // 方式3 html创建
    <a class="menuItem" href="/system/dept">部门管理</a>

**2、createMenultem**

// 要打开的地址
    var url=prefix+"/details?userId="+userId;
    
    // 调用createMenuItem()方法 1参:要打开的地址 ,2参:标签页名称
    createMenuItem(url, "用户详情");

> **注意**:
> 
> 1.  如果提示调用 createMenuItem of undefined 那就记得引入 common.js 生成的代码里默认会引入
> 2.  提示random of undefined 就引入ry-ui.js

> **方法源代码:**
> 
> 源代码就不贴出来了 贴出来也没什么意义 位置:

common.js  -->  createMenuItem(dataUrl, menuName)

## 关闭标签页 ##

// 源代码在index.js里
      $('.tabCloseCurrent').on('click', function () {
            $('.page-tabs-content').find('.active i').trigger("click");
        });
    
    // common.js增加了一个 closeItem方法
    	function closes() {
            // 关闭当前页
        	closeItem();
            // 关闭指定Item页, 123为指定的选项卡Id
            closeItem(123);
    	}

## 输入框锁定 ##

> 这个相信大家都会 还是再写一下吧 这段话是从网站上直接复制过来的
> 
> **disabled** 属性规定应该禁用 input 元素，被禁用的 input 元素，不可编辑，不可复制，不可选择，不能接收焦点,后台也不会接收到传值。设置后文字的颜色会变成灰色。disabled 属性无法与

//disabled 属性无法与 <input type="hidden">一起使用。
    示例：<input type="text" disabled="disabled" />

> **readonly** 属性规定输入字段为只读可复制，但是，用户可以使用Tab键切换到该字段，可选择,可以接收焦点，还可以选中或拷贝其文本。后台会接收到传值. readonly 属性可以防止用户对值进行修改。

// readonly 属性可与 <input type="text"> 或 <input type="password"> 配合使用。
    示例：<input type="text" readonly="readonly">

> **readonly unselectable="on"** 该属性跟disable类似，input 元素，不可编辑，不可复制，不可选择，不能接收焦点，设置后文字的颜色也会变成灰色，但是后台可以接收到传值。

示例：<input type="text"  readonly  unselectable="on" >

## 弹出某页面 ##

**弹窗**

// 弹出添加用户积分日志页面
    function open_account_log(userId) {
        // 1. 调用方法弹出
        $.modal.open("用户积分修改", '/system/accountDetailsLog/add');
        // 2. 指定弹窗宽高(后两个参数分别为宽,高)
            $.modal.open("用户积分修改", '/system/accountDetailsLog/add','80','120');
    
    }

## JS校验空值 ##

function isEmpty(obj){
        if(typeof obj == "undefined" || obj == null || obj == ""){
            return true;
        }else{
            return false;
        }
    }

## JS绑定input事件 ##

> js绑定input事件而不是使用改变值的change事件
> 
> 可以实现输入值后就做某些操作 而不是在输入完然后失去焦点再进行触发

// 输入框自动去空格  其中propertychange 是对ie9以下浏览器的支持
        $(".form-control").bind("input propertychange", function () {
                $(this).val($(this).val().replace(/\s*/g, ""));
            }
        );

## 自定义AJAX ##

> 这里是使用解绑按钮来进行示例
> 
> 解绑操作不需要弹窗 如果直接调用封装好的修改的方法或者操作成功处理操作成功的方法会关闭弹窗刷新父级页面 导致全局刷新 这样写就可以 既可以向后台执行想要执行的操作 也可以弹出消息提醒 又不导致全局刷新 只刷新Table表格

// 上传文件
                function sendFile(file, obj) {
                    var data = new FormData();
                    data.append("file", file);
                    $.ajax({
                        type: "POST",
                        url: ctx + "common/upload",
                        data: data,
                        cache: false,
                        contentType: false,
                        processData: false,
                        dataType: 'json',
                        success: function (result) {
                            if (result.code == web_status.SUCCESS) {
                                $(obj).summernote('editor.insertImage', result.url, result.fileName);
                            } else {
                                $.modal.alertError(result.msg);
                            }
                        },
                        error: function (error) {
                            $.modal.alertWarning("图片上传失败。");
                        }
                    });
                }

## 添加Class元素 ##

.abc{
      background: red;
      }
    test div
        var div = document.getElementById('d1');
        div.classlist.add("abc");      //添加
        div.classlist.remove("abc");   //删除

## 操作结果提示 ##

// 需要引入 ry-ui.js文件 content为提示文字
    <script th:src="@{/ruoyi/js/ry-ui.js?v=3.2.0}"></script>
    
    // 错误
      $.modal.msg(content, modal_status.FAIL);
    // 成功
     $.modal.msg(content, modal_status.SUCCESS);

## 回显选中图片 ##

> 如果需要**放大回显图片**可以看
> 
> 前端 --> 其他 --> 放大图片

> 回显浏览器选中的图片
> 
> 如果在选择文件的时候,只想显示图片文件可以这样写

**HTML示例:**

**JS:**

function changepic(obj) {
            var reads = new FileReader();
            f = document.getElementById('file').files[0];
            reads.readAsDataURL(f);
            reads.onload = function (e) {
                document.getElementById('show').src = this.result;
            };
        }

**JS创建集合对象**

// js中创建集合
    var list=[];
    // js中创建cs对象
    var cs = {
        id=1,
        name='admin',
        password01='admin'
    }
    //保存对象
    list.push( cs );

**显示隐藏HTML**

> 隐藏html代码块 分为两种方式隐藏
> 
> 1.  style="visibility: hidden;" (隐藏但是位置会占用)
> 2.  style="display: none;" (隐藏并且位置会释放)

<span id='vip_user_input'> hello</span>

// visibility: none
    document.getElementById("id").style.visibility="hidden";//隐藏
    
    document.getElementById("id").style.visibility="visible";//显示
    
    
    
    
    // display: none
    var userType =2;
      if (userType == 2) {
      //获取要显示的div对象
     document.getElementById('id').style.display = "block"; //显示
      } else {
      document.getElementById('id').style.display = "none";  // 隐藏
      }

**Js版本**

$("#id").hide();// 隐藏
      $("#id").show();// 显示

**页面加载完成执行**

> 页面加载完成执行有两种加载时机
> 
> 1.  页面所有资源加载完成后执行 (包括图片或者其他资源)
> 2.  页面的Dom结构在家完成就开始执行

//1 资源加载完成才执行 (图片资源等等)
    window.onload = function() { 
    }; 
    
    //2 Dom加载完成就执行
    $(document).ready(function() { 
    }); 
    
    //2.1 简写
    $(function() {
    });

**默认全屏打开添加页**

## Thymeleaf ##

标签

> 1.all:删除包含标签和所有的孩子。
> 
> 2.body:不包含标记删除,但删除其所有的孩子。
> 
> 3.tag:包含标记的删除,但不删除它的孩子。
> 
> 4.all-but-first:删除所有包含标签的孩子,除了第一个。
> 
> 5.none:什么也不做。这个值是有用的动态评估。

![cfb7ae3b3e114c12b7302a52f05321fd.png][]

![55bc4c16401f450d985614a4ea39c933.png][]

![c613e3b7e5e643f191341e8e5f9a99be.png][] **循环**

<tr  th:each="user,userStat : ${list}">  
                    <td th:text="${user.userName}">Onions</td>  
                    <td th:text="${user.email}">test@test.com.cn</td>  
                    <td th:text="${user.isAdmin}">yes</td>  
                     <th th:text="${userStat.index}">状态变量：index</th>  
                    <th th:text="${userStat.count}">状态变量：count</th>  
                    <th th:text="${userStat.size}">状态变量：size</th>  
                    <th th:text="${userStat.current.userName}">状态变量：current</th>  
                    <th th:text="${userStat.even}">状态变量：even****</th>  
                    <th th:text="${userStat.odd}">状态变量：odd</th>  
                    <th th:text="${userStat.first}">状态变量：first</th>  
                    <th th:text="${userStat.last}">状态变量：last</th>  
        </tr>

**判断**

<th:block th:if="...">
    	<div id="div1">
    	</div>
    	<div id="div2">
    	</div>
    </th:block>

**JS取值**

// 注意script属性
    <script th:inline="javascript">
        var message = [[${message}]];
        console.log(message);
    
    // 注意 这种也可以取值 并且取出的值为字符串类型  作用嘛
    // 举例 比如在加载页面的icon的时候 如果直接取值fa fa-user-o 就会报错  但是如果在去之前外边加上''那取出的值就是字符串类型 
          // 设置icon图标
        var one_icon = $('#one_icon');
    	// 正确赋值
        one_icon.addClass('[[${oneIcon}]]');
    	// 报错
    	one_icon.addClass([[${oneIcon}]]);
    </script>

**th:onclick**

传递单个参数

th:οnclick="searchHot([[${hot.name}]])"

传递多个Model中参数

th:οnclick="'javascript:searchHot(\''+${hot.name}+'\',\''+${hot.hotType}+'\')'"

传递一个Model中参数 一个非Model中参数

th:οnclick="'javascript:searchHot(\''+${hot.name}+'\','+this+')'"

**格式化时间**

th:value="*{#dates.format(reserveTime,'yyyy-MM-dd HH:mm:ss')}"

**截取字符串**

msg.content为被截取的字符串 15为截取长度
    <span th:utext="${#strings.abbreviate( msg.content,15)}"></span>

**其他-网络文章**

> [blog.csdn.net/zoubo0812/a…][blog.csdn.net_zoubo0812_a]

**JQuery相关**

返回上页

function goBack() {
        window.history.go(-1);
    }

# 后端 #

## 系统 ##

### 当前用户 ###

对当前登录用户的操作已经进行了封装
    
    有获取当前登陆用户 获取当前登录用户ID 等这里不贴源码了
    
    该工具类位置:
    
    com.ruoyi.framework.util.ShiroUtils

### 定时器 ###

关闭定时器

> 有时候定时器大家并不一定需要用到 又想把定时器阉割掉 时怎么做呢? 难道要删大量的定时器相关代码吗? 很显然不需要只需要将定时器在启动时初始化的注解注释掉就可以了

![8ac090432a3a4894ba5cee17009200b5.png][]

## 新增定时器 ##

![f9209bdd08844687bfdc0ac6f63d6bd2.png][]

![0e69585684bc42c0881c747c648bd43e.png][]

**在系统监控 --> 定时任务 -->新增定时任务**

**![a55c767020394624bf37a8baf95e3093.png][]**

## Controller ##

### 关于权限 ###

> 若依框架使用的是Shiro来进行权限控制
> 
> 下边介绍一下在Controller新增一个请求地址 然后使这个地址被管理需要做那些操作

> 1.  添加注解
> 2.  插入sql
> 3.  按钮控制

## Service ##

## Dao ##

## Mapper ##

## 属性封装 ##

> 发现一篇很有意思的关于封装返回的文章 大概看了一下 这里记录一下 有时间再看
> 
> [www.cnblogs.com/stefanking/…][www.cnblogs.com_stefanking]

> 说到Mapper不得不说一下vo封装 之前都是写一个association然后再写相应的属性的result 然后导致mapper文件 全是result
> 
> 这里介绍一下封装的时候引入本文件的其他 或**其他文件**里的

**POJO:**

// 继承原实体类得到原实体类的所有属性
    @Data
    public class EquipmentVo extends Equipment implements Serializable
    	{
    	//增加两个属性
    		/** 供应商 */
    		private Supplier supplier;
    
    		/** 所属用户 */
    		private SysUser sysUser;
    
    	}

**association** 标签中的属性

property:	vo中的属性名
    column:		该属性id对应的的字段名[非必须]
    javaType:	该属性的Java类型
    resultMap:	引入的本文件的话就是resultMap 的id
    			resultMap的id 引入其他文件的resultMap 时是xml文件所对应的Dao的全路径加					resultMap的Id

例:

> **注意:**
> 
> **Association和Collection使用时机区别:**
> 
> **Association 在一对一,多对一时使用**
> 
> **Collection 在一对多,多对多时使用**
> 
> 在association标签中 javaType属性指向的是**实体类的属性**
> 
> 在collection标签中 javaType属性指向的是**集合的类型** ofType指向的是集合的泛型类型

**Mapper:**

## 集合遍历 ##

单参数

**Dao:**

Integer selectEquipmentNumber(List<Integer> statusList);

**XML:**

<foreach collection="list" item="status" index="index" separator="or" open="(" close=")">
             equipment_status = #{item}
    </foreach>

## 多参数: ##

**Dao:**

**XML:**

## 其他 ##

MP忽略null值

// 修改时忽略null 和空值
        @TableField(strategy = FieldStrategy.IGNORED)
        private BigDecimal discountPrice;

## BigDecimal使用 ##

> 直接复制过来的就不在重复写了
> 
> 注意除法 divide 是重载的方法 如果直接 a.divide(b) 的话可能会出现该异常:
> 
> **\[ Non-terminating decimal expansion; no exact representable decimal result.\]**
> 
> 相当于10/3 无法除尽 尽量指定小数长度和规则

BigDecimal bignum1 = new BigDecimal("10");  
    BigDecimal bignum2 = new BigDecimal("5");  
    BigDecimal bignum3 = null;  
      
    // 加法  
    bignum3 =  bignum1.add(bignum2);       
    System.out.println("和 是：" + bignum3);  
      
    // 减法  
    bignum3 = bignum1.subtract(bignum2);  
    System.out.println("差  是：" + bignum3);  
      
    // 乘法  
    bignum3 = bignum1.multiply(bignum2);  
    System.out.println("积  是：" + bignum3);  
      
    // 除法  
    bignum3 = bignum1.divide(bignum2);  
    System.out.println("商  是：" + bignum3);
    
    // 除法2
    // scale表示保留小数位数 roundingMode表示为小数模式
    divide(BigDecimal divisor, int scale, RoundingMode roundingMode) ;
    
    BigDecimal bignum3 = bignum1.divide(bignum2，10，ROUND_HALF_DOWN);

**小数模式常量**

> **ROUND\_CEILING=如果 BigDecimal 是正的，则做 ROUND\_UP 操作；如果为负，则做 ROUND\_DOWN 操作。  
> ROUND\_DOWN=从不在舍弃(即截断)的小数之前增加数字。  
> ROUND\_FLOOR=如果 BigDecimal 为正，则作 ROUND\_UP ；如果为负，则作 ROUND\_DOWN 。  
> ROUND\_HALF\_DOWN=若舍弃部分> .5，则作 ROUND\_UP；否则，作 ROUND\_DOWN 。  
> ROUND\_HALF\_EVEN=如果舍弃部分左边的数字为奇数，则作 ROUND\_HALF\_UP ；如果它为偶数，则作ROUND\_HALF\_DOWN 。  
> ROUND\_HALF\_UP=若舍弃部分>=.5，则作 ROUND\_UP ；否则，作 ROUND\_DOWN 。  
> ROUND\_UNNECESSARY=该“伪舍入模式”实际是指明所要求的操作必须是精确的,因此不需要舍入操作。  
> ROUND\_UP=总是在非 0 舍弃小数(即截断)之前增加数字。**

正整数判断

BigDecimal bigDecimal = new BigDecimal();
    int num = bigDecimal.signum();
    // num是-1, 负数
    // num是0, 零
    // num是1，正数

**比较大小**

BigDecimal a = new BigDecimal (101);
    BigDecimal b = new BigDecimal (111);
     
    //使用compareTo方法比较
    //注意：a、b均不能为null，否则会报空指针
    if(a.compareTo(b) == -1){
        System.out.println("a小于b");
    }
     
    if(a.compareTo(b) == 0){
        System.out.println("a等于b");
    }
     
    if(a.compareTo(b) == 1){
        System.out.println("a大于b");
    }
     
    if(a.compareTo(b) > -1){
        System.out.println("a大于等于b");
    }
     
    if(a.compareTo(b) < 1){
        System.out.println("a小于等于b");
    }

**转String**

// 浮点数的打印 10000000000
            System.out.println(new BigDecimal("10000000000").toString());
    
            // 普通的数字字符串 100.000
            System.out.println(new BigDecimal("100.000").toString());
    
            // 去除末尾多余的0 1E+2
            System.out.println(new BigDecimal("100.000").stripTrailingZeros().toString());
    
            // 避免输出科学计数法 100
            System.out.println(new BigDecimal("100.000").stripTrailingZeros().toPlainString());

## MYSQL ##

获取时间

> **mysql查询当前系统时间不保留时分秒，保留时分秒，当前时间加一天，当前时间减少一天等**
> 
> 转发至CSDN **原文链接 :**[blog.csdn.net/liu\_yulong/…][blog.csdn.net_liu_yulong]

SELECT
    	CURDATE( ),
    	now( ),
    	CURTIME( ),
    	date_sub( CURDATE( ), INTERVAL 1 DAY ) yestorday,
    	date_sub( CURDATE( ), INTERVAL 1 DAY ) today 
    FROM
    	DUAL;

![19a988be212743b595c39ddd052f08a2.png][]

SELECT
    	CURDATE( ) date,
    	now( ) dateTime,
    	DATE_FORMAT( now( ), '%Y-%m-%d' ) dateFmt,
    	DATE_FORMAT( now( ), '%Y-%m-%d' ) dateTimeFmt,
    	DATE_FORMAT( now( ), '%Y-%m-%d %H:%i:%s' ) daymins,
    	CURTIME( ) times,
    	date_sub( CURDATE( ), INTERVAL 1 DAY ) Yesterday ,
    	date_sub( CURDATE( ), INTERVAL 0 DAY ) Today  ,
    	date_sub( CURDATE( ), INTERVAL 1 DAY ) Tomorrow 
    FROM
    	DUAL;

![2fd7019bfde644e78b443d3d5403b83d.png][]

[02c6c85aae4e4fbe9f32dab4ec11e3fa.png]: https://img-blog.csdnimg.cn/02c6c85aae4e4fbe9f32dab4ec11e3fa.png
[blog.koalite.com_bbg_v2]: https://link.juejin.cn?target=https%3A%2F%2Fblog.koalite.com%2Fbbg%2Fv2%2F
[twitterbootstrap3buttons.w3masters.nl]: https://link.juejin.cn?target=http%3A%2F%2Ftwitterbootstrap3buttons.w3masters.nl%2F
[72bbfd65676f4934b7512694e9dc0714.png]: https://img-blog.csdnimg.cn/72bbfd65676f4934b7512694e9dc0714.png
[6fd421170442464eb113be2f4bd3e322.png]: https://img-blog.csdnimg.cn/6fd421170442464eb113be2f4bd3e322.png
[af3f99400db442b1a7ffc38fa2217289.png]: https://img-blog.csdnimg.cn/af3f99400db442b1a7ffc38fa2217289.png
[blog.csdn.net_qq_41899174]: https://link.juejin.cn/?target=https%3A%2F%2Fblog.csdn.net%2Fqq_41899174%2Farticle%2Fdetails%2F82797089
[jQuery Zoom Plugin]: https://link.juejin.cn/?target=http%3A%2F%2Fwww.elevateweb.co.uk%2Fimage-zoom%2F
[github.com_elevateweb]: https://link.juejin.cn/?target=https%3A%2F%2Fgithub.com%2Felevateweb%2Felevatezoom
[www.myfreax.com_elevatezoom]: https://link.juejin.cn/?target=https%3A%2F%2Fwww.myfreax.com%2Felevatezoom-image-zoom%2F
[blog.csdn.net_m0_37865510]: https://link.juejin.cn/?target=https%3A%2F%2Fblog.csdn.net%2Fm0_37865510%2Farticle%2Fdetails%2F84636488
[cfb7ae3b3e114c12b7302a52f05321fd.png]: https://img-blog.csdnimg.cn/cfb7ae3b3e114c12b7302a52f05321fd.png
[55bc4c16401f450d985614a4ea39c933.png]: https://img-blog.csdnimg.cn/55bc4c16401f450d985614a4ea39c933.png
[c613e3b7e5e643f191341e8e5f9a99be.png]: https://img-blog.csdnimg.cn/c613e3b7e5e643f191341e8e5f9a99be.png
[blog.csdn.net_zoubo0812_a]: https://link.juejin.cn/?target=https%3A%2F%2Fblog.csdn.net%2Fzoubo0812%2Farticle%2Fdetails%2F54906297%23commentBox
[8ac090432a3a4894ba5cee17009200b5.png]: https://img-blog.csdnimg.cn/8ac090432a3a4894ba5cee17009200b5.png
[f9209bdd08844687bfdc0ac6f63d6bd2.png]: https://img-blog.csdnimg.cn/f9209bdd08844687bfdc0ac6f63d6bd2.png
[0e69585684bc42c0881c747c648bd43e.png]: https://img-blog.csdnimg.cn/0e69585684bc42c0881c747c648bd43e.png
[a55c767020394624bf37a8baf95e3093.png]: https://img-blog.csdnimg.cn/a55c767020394624bf37a8baf95e3093.png
[www.cnblogs.com_stefanking]: https://link.juejin.cn/?target=https%3A%2F%2Fwww.cnblogs.com%2Fstefanking%2Farticles%2F5092474.html
[blog.csdn.net_liu_yulong]: https://link.juejin.cn/?target=https%3A%2F%2Fblog.csdn.net%2Fliu_yulong%2Farticle%2Fdetails%2F90447555
[19a988be212743b595c39ddd052f08a2.png]: https://img-blog.csdnimg.cn/19a988be212743b595c39ddd052f08a2.png
[2fd7019bfde644e78b443d3d5403b83d.png]: https://img-blog.csdnimg.cn/2fd7019bfde644e78b443d3d5403b83d.png