表格查询-时间

## layDate ### 1. 功能 限制表格查询的时间 ### 2. 使用场景 有一些表数据量比较大时, 为了减少服务器压力, 需限制默认只查7天内(或者当天,一个月内)的数据 ### 3. 如何使用 #### 3.1 JS 中需对时间组件做相应的改动 ```javascript layer.ready(function () { layer.msg('数据量较大,默认查询近一周数据', {icon: 6}); }); layDate.render({ elem: '#start', type: 'datetime', range: false, trigger: 'click', format: 'yyyy-MM-dd HH:mm:ss', value: new Date(new Date() - 7 * 24 * 3600 * 1000) }) layDate.render({ elem: '#end', type: 'datetime', range: false, trigger: 'click', format: 'yyyy-MM-dd HH:mm:ss', value: new Date() }) ``` ==注意: 在查询列表时, 也要每次都将限制的时间带过去== ![image.png](https://cos.easydoc.net/27100029/files/ka68nl22.png) #### 3.2 使用函数来获取一个月前的时间戳 限制查询一个月内的数据时可用 ```js onion.lastMonthDateTime() ``` ![image.png](https://cos.easydoc.net/27100029/files/kb930cu3.png) #### 3.3 最大查询天数 表单查询时, 如果涉及到最大支持查询天数, 可以使用 myDate.diff 来比较 ```js $('#formSearch').on('click', function () { var diff = myDate.diff($('#start').val(),$('#end').val()); if (diff > 31) { onion.layer.tipMsg('最大支持查询31天的数据!'); return false; }else { onion.form_search(form, myTable, 'formSearch', 'searchForm'); } }) ``` #### 3.4 myData 的其他使用 1. onion.myDate.format(timeStramp) 传入时间戳, 转化成日期对象, 成功返回对应的日期对象, 失败返回 false 2. onion.myDate.now() 获取当前时间 3. onion.myDate.getYear(date) 传入时间, 返回对应年份, 不传入则返回当前年份 4. onion.myDate.getMonth(date) 传入时间, 返回对应月份, 不传入则返回当前月份 5. onion.myDate.getDay(date) 传入时间, 返回对应日期, 不传入则返回当前日期 6. onion.myDate.parse(date, str, en) 根据格式获取时间, 传入 时间, 格式类型字符串, 是否是中文 ```js var nowDate = onion.myDate.parse(new Date(), 'yyyy-mmmm-dddd hh:mm:ss'); ``` 7. onion.myDate.diff(startDate, endDate) 传入开始时间和结束时间, 返回两者相差的天数 ### 4. api定义 #### 4.1 返回一个月前时间 lastMonthDateTime () ``` javascript onion.lastMonthDateTime = function getLastMonthDateTime() { return new Date(new Date(new Date().toLocaleDateString()).setMonth(new Date().getMonth() - 1)); } ``` #### 4.2 时间工具 myData ```js /** * @desc 日期封装 * * */ function MyDate() {}; /** * @desc 时间戳转化成日期对象 * * @params [timestramp] * * @return [Date | Bool] * * */ MyDate.prototype.format = function (timeStramp) { if (timeStramp) { return new Date(timeStramp); } else { return false; } } /** * 日期解析 * */ MyDate.prototype.now = function () { return new Date(); } /** * 获取年份 * * */ MyDate.prototype.getYear = function (date) { if (date) { return date.getFullYear(); } else { return this.now.getFullYear(); } } /** * 获取月份 * * */ MyDate.prototype.getMonth = function (date) { if (date) { return date.getMonth(); } else { return this.now.getMonth(); } } /** * 获取天数 * * */ MyDate.prototype.getDay = function (date) { if (date) { return date.getDate() } else { return this.now.getDate(); } } /** * @params date [Date] * @params str [String] eg'yyyy-mmmm-dddd hh:mm:ss' * @params en true -> 中文 false and 默认 -> 默认 * * @return 2012年12月12日 12时12分12秒 | 2012-12-12 12:12:12 * */ MyDate.prototype.parse = function (date, str, en) { if (date instanceof Date) { var str = str; var date = date var en = en || false; } else { var en = str || false; var str = date; var date = new Date(); } if (str.split(' ').length === 2) { if (en) { return date.getFullYear() + '年' + (date.getMonth() + 1) + '月' + date.getDate() + '日 ' + date.getHours() + '时' + date.getMinutes() + '分' + date.getSeconds() + '秒'; } else { return date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate() + ' ' + date.getHours() + ':' + date.getMinutes() + ':' + date.getSeconds() } } else { if (en) { if (str.indexOf('-') > 0) { return date.getFullYear() + '年' + (date.getMonth() + 1) + '月' + date.getDate() + '日'; } else { return date.getHours() + '时' + date.getMinutes() + '分' + date.getSeconds() + '秒'; } } else { if (str.indexOf('-') > 0) { return date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate(); } else { return date.getHours() + ':' + date.getMinutes() + ':' + date.getSeconds(); } } } } /** * 日期差 * @params startDate [Date] * @params endDate [Date] * * @return [number] * */ MyDate.prototype.diff = function (startDate, endDate) { var start = new Date(startDate).getTime(); var end = new Date(endDate).getTime(); if (end < start) { return -1; } return (end - start) / (24 * 60 * 60 * 1000); } onion.myDate = new MyDate(); ```