反饋已提交
網絡繁忙
经常会有需求按照时间段来查询数据,但有时无法做出时间段的限制而让服务器承受巨大的压力,这时就可以用这个方案来解决。
PC 端报表需要查看某个时间段的数据,但是不能超过指定的天数,如果超过天数或者结束时间大于开始时间则给予用户友情提示。
新建数据集 ds1,输入数据查询语句:
SELECT * FROM 订单 where 1=1
${if(len(start_time)=0,""," and 订购日期>='"+start_time+"'")}
${if(len(end_time)=0,""," and 订购日期<='"+end_time+"'")}
1)如下图设计报表样式,订购日期格式改为日期型,应付金额格式改为数字保留小数点后两位。
2)进入参数面板编辑界面,将参数 start_time 和 end_time 添加到参数面板,绑定日期控件。
3)设置日期区间开始日期的属性,选中 start_time 参数对应的日期控件,属性设置如下图所示:
控件值插入公式:monthdelta($end_time,-1),表示结束日期显示值后推一个月最作为开始日期的默认显示值。
结束日期插入公式:$end_time,表示选取日期区间的开始日期时不能超过日期区间的结束日期。
4)设置日期区间结束日期的属性,选中 endtime 参数对应的日期控件,属性设置如下图所示:
控件值插入指定的日期:2010/04/16,表示以该日期作为结束日期的默认显示值。
结束日期插入公式:TODAY(),表示选取结束日期时不能超过今天。
5)选中参数面板的查询按钮,添加 JS 点击事件,代码如下:
var start = this.options.form.getWidgetByName("start_time").getValue(); //获取start_time控件的值var end = this.options.form.getWidgetByName("end_time").getValue(); //获取end_time控件的值 window.alert = alert; //定义新的alert弹出框样式 function alert(data, callback) { //回调函数 var alert_bg = document.createElement('div'); alert_box = document.createElement('div'), alert_text = document.createElement('div'), alert_btn = document.createElement('div'), textNode = document.createTextNode(data ? data : ''), btnText = document.createTextNode('确 定'); // 控制样式 css(alert_bg, { 'position': 'fixed', 'top': '0', 'left': '0', 'right': '0', 'bottom': '0', 'background-color': 'rgba(0, 0, 0, 0.1)', 'z-index': '999999999' }); css(alert_box, { 'width': '270px', 'max-width': '90%', 'font-size': '16px', 'text-align': 'center', 'background-color': '#fff', 'border-radius': '15px', 'position': 'absolute', 'top': '50%', 'left': '50%', 'transform': 'translate(-50%, -50%)' }); css(alert_text, { 'padding': '10px 15px', 'border-bottom': '1px solid #ddd' }); css(alert_btn, { 'padding': '10px 0', 'color': '#007aff', 'font-weight': '600', 'cursor': 'pointer' }); // 内部结构套入 alert_text.appendChild(textNode); alert_btn.appendChild(btnText); alert_box.appendChild(alert_text); alert_box.appendChild(alert_btn); alert_bg.appendChild(alert_box); // 整体显示到页面内 document.getElementsByTagName('body')[0].appendChild(alert_bg); // 确定绑定点击事件删除标签 alert_btn.onclick = function() { alert_bg.parentNode.removeChild(alert_bg); if (typeof callback === 'function') { callback(); //回调 } } } //定义alert函数中修饰弹出框的CSS函数 function css(targetObj, cssObj) { var str = targetObj.getAttribute("style") ? targetObj.getAttribute('style') : ''; for (var i in cssObj) { str += i + ':' + cssObj[i] + ';'; } targetObj.style.cssText = str; }if( start == "" || start==null){ //判断开始日期是否为空 alert("开始时间不能为空!"); //开始日期参数为空时提示 return false; }; if(end == "" || end==null){ //判断结束日期是否为空 alert("结束时间不能为空!"); //结束日期参数为空时提示 return false; }; if( start > end){ //判断开始日期是否大于结束日期 alert("开始时间不能大于结束时间!"); //开始日期大于结束日期时提示 return false; }var startdate = new Date(start); //将开始日期转化为Date型var enddate = new Date(end); //将结束日期转化成Date型var subdate = (enddate-startdate)/ (1000 *60 *60 *24); //将两个日期相减得出的毫秒数转化为天数if(subdate >= 32){ //判断结束日期是否超过开始日期后一年alert("请输入32天以内的时间!"); //结束日期超过开始日期后的十五天时提示return false;}
注:如果您的报表场景中时间参数不是 start_time 和 end_time,那么需要修改代码中的相应参数。
保存报表,点击分页预览,报表效果如下图所示:
注:不支持移动端 App 实现该功能,H5 端实现该功能参见文档:移动端日期筛选控制。
已完成模板可参见:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Primary\FreeReport\日期控件查询天数控制.cpt
点击下载模板:日期控件查询天数控制.cpt
文 檔回 饋
滑鼠選中內容,快速回饋問題
滑鼠選中存在疑惑的內容,即可快速回饋問題,我們將會跟進處理。
不再提示
10s後關閉