html按时间搜索数据功能

html

<input type="text" class="form-control layui-input" id="inputDate" autocomplete="off" placeholder="请选择时间范围">

参数传递

startTime: $("#inputDate").val() != "" ? GetTime($("#inputDate").val().split(" - ")[0]) : "",
endTime: $("#inputDate").val() != "" ? GetTime($("#inputDate").val().split(" - ")[1]) : "",

js方法:将时间字符串转化未时间戳

let StrToDateTime = (value)  => {
    if (value) {
        return (new Date(Date.parse(value.replace(/-/g, "/"))));
    }
    return value;
};

let GetTime = (s) => {
    return StrToDateTime(s).getTime();
};

layui的时间插件

layui.use('laydate', function(){
        var laydate = layui.laydate;
        //执行一个laydate实例  持有
        laydate.render({
            elem: '#inputDate', //指定元素
            type: 'datetime',
            range: true,
            //手动触发change事件
            done: function(value, date, endDate){
                $("#inputDate").change();
            }
        });
    });

sql处理

<if test="startTime != null and startTime != '' and endTime != null and endTime != ''">
  AND EXTRACT(epoch FROM CAST(u.create_time AS TIMESTAMPTZ))*1000 <![CDATA[>= ]]> #{startTime}
  AND EXTRACT(epoch FROM CAST(u.create_time AS TIMESTAMPTZ))*1000 <![CDATA[<= ]]> #{endTime}
</if>