页面树结构
转至元数据结尾
转至元数据起始

示例说明

在报表中通常会有时间段参数,“开始时间”至“结束时间”,用户需要分别设置两个时间参数。用户通常希望可以点击“最近1周”、“最近1月”、“最近3月”这样的快捷按钮,直接设置两个时间参数。类似上述需求,可以参照如下方法进行设置。参考示例:

设置方法

1、首先在“资源定制”模块中,创建一张灵活分析报表。

2、在浏览器中,选中灵活分析,右键选择 编辑宏 进入报表宏界面。

3、在报表宏界面新建客户端模块。在弹出的新建模块对话框中,选择对象为simpleReport、事件为onRender、并把下面宏代码复制到代码编辑区域。

宏类型

类型

对象

事件

ClientSide

simpleReport

onRender

宏代码

function main(simpleReport, simpleReportContext) {
    //debugger;
    if (!simpleReport.paramPanelObj) {
        return;
    }
 
    // 获得"开始时间"和"结束时间"两个参数对象
    var beginDate = simpleReport.paramPanelObj.findParamByName("开始时间");
    var endDate = simpleReport.paramPanelObj.findParamByName("结束时间");
    var endDateTag = simpleReport.paramPanelObj.getParamTagByParamId(endDate.id);
 
    // 取得所需的开始、结束时间值
    var weekButtonCallback = function() {
        var beginEndDate = getBeginEndDate("最近1周");
        // 设置参数值
        simpleReport.setParamValue(beginDate.id, beginEndDate.begin, beginEndDate.begin);
        simpleReport.setParamValue(endDate.id, beginEndDate.end, beginEndDate.end);
    };
    var monthButtonCallback = function() {
        var beginEndDate = getBeginEndDate("最近30天");
        // 设置参数值
        simpleReport.setParamValue(beginDate.id, beginEndDate.begin, beginEndDate.begin);
        simpleReport.setParamValue(endDate.id, beginEndDate.end, beginEndDate.end);
    };
    var allButtonCallback = function() {
        var beginEndDate = getBeginEndDate("全部");
        // 设置参数值
        simpleReport.setParamValue(beginDate.id, beginEndDate.begin, beginEndDate.begin);
        simpleReport.setParamValue(endDate.id, beginEndDate.end, beginEndDate.end);
    };
 
    // 在"结束时间"后添加快捷按钮
    var paramTable = simpleReport.paramPanelObj.layoutTable;
    var lastCell;
    for (var i = 0; i < paramTable.rows.length; i++) {
        var cell = paramTable.rows[i].insertCell( - 1);
        if (i == paramTable.rows.length - 1) {
            lastCell = cell;
        }
    }
    lastCell.appendChild(createButton("最近1周", weekButtonCallback));
    lastCell.appendChild(createButton("最近30天", monthButtonCallback));
    lastCell.appendChild(createButton("全部", allButtonCallback));
};
 
// 创建按钮对象
function createButton(caption, callback) {
    var btnElem = document.createElement("input");
    btnElem.type = "button";
    btnElem.value = caption;
    //btnElem.className = "queryview-toolbar-button";
    //btnElem.style.background = "url(./img/button/button_bgicon_add.gif) no-repeat top right";
    //btnElem.style.border = "1px solid #A1ACB9";
    //btnElem.style.padding = "2px 0 0 0";
    btnElem.style.margin = "0 1px 0 1px";
    btnElem.style.width = "80px";
    btnElem.style.height = "24px";
    btnElem.onclick = callback;
    return btnElem;
};
 
// 获取时间值
function getBeginEndDate(type) {
    var begin, end, today = new Date();
 
    switch (type) {
    case "最近1周":
        begin = DateFormat(new Date(today.setDate(today.getDate() - 7)), "yyyy-MM-dd");
        end = DateFormat(new Date(), "yyyy-MM-dd");
        break;
    case "最近30天":
        begin = DateFormat(new Date(today.setMonth(today.getMonth() - 1)), "yyyy-MM-dd");
        end = DateFormat(new Date(), "yyyy-MM-dd");
        break;
    case "全部":
        begin = "1900-01-01";
        end = DateFormat(new Date(), "yyyy-MM-dd");
        break;
    }
    return {
        "begin": begin,
        "end": end
    };
};
 
/**   
 * 对日期格式化  
 * DateFormat("yyyy-MM-dd hh:mm:ss.S") ==> 2006-07-02 08:09:04.423   
 * DateFormat("yyyy-MM-dd E HH:mm:ss") ==> 2009-03-10 二 20:09:04   
 * DateFormat("yyyy-MM-dd EE hh:mm:ss") ==> 2009-03-10 周二 08:09:04   
 * DateFormat("yyyy-MM-dd EEE hh:mm:ss") ==> 2009-03-10 星期二 08:09:04   
 * DateFormat("yyyy-M-d h:m:s.S") ==> 2006-7-2 8:9:4.18   
 */
function DateFormat(dt, fmt) {
    var o = {
        "M+": dt.getMonth() + 1,
        //月份     
        "d+": dt.getDate(),
        //日     
        "h+": dt.getHours() % 12 == 0 ? 12 : dt.getHours() % 12,
        //小时     
        "H+": dt.getHours(),
        //小时     
        "m+": dt.getMinutes(),
        //分     
        "s+": dt.getSeconds(),
        //秒     
        "q+": Math.floor((dt.getMonth() + 3) / 3),
        //季度     
        "S": dt.getMilliseconds() //毫秒     
    };
    var week = {
        "0": "/u65e5",
        "1": "/u4e00",
        "2": "/u4e8c",
        "3": "/u4e09",
        "4": "/u56db",
        "5": "/u4e94",
        "6": "/u516d"
    };
    if (/(y+)/.test(fmt)) {
        fmt = fmt.replace(RegExp.$1, (dt.getFullYear() + "").substr(4 - RegExp.$1.length));
    }
    if (/(E+)/.test(fmt)) {
        fmt = fmt.replace(RegExp.$1, ((RegExp.$1.length > 1) ? (RegExp.$1.length > 2 ? "/u661f/u671f": "/u5468") : "") + week[dt.getDay() + ""]);
    }
    for (var k in o) {
        if (new RegExp("(" + k + ")").test(fmt)) {
            fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
        }
    }
    return fmt;
};

关键对象总结

  • 获取灵活分析报表中的参数对象:simpleReport.paramPanelObj.findParamByName("开始时间");
  • 设置报表参数值:simpleReport.setParamValue(endDate.id, beginEndDate.end, beginEndDate.end);

 

  • 无标签