JS实现打开报表时默认为最后一次查询参数

问题描述

普通报表在打开时希望参数面板中的参数控件的值可以默认是上一次页面关闭前最后一次查询所选择的值。

解决方案

1. 每次在页面关闭时将参数值保存到浏览器缓存中（适用用非FS平台），或每次点击查询后将参数条值保存到浏览器缓存中（适用FS决策平台）。
2. 报表打开时从浏览器缓存中将参数值读取出来并赋值给对应的控件。

注1：不支持决策报表和移动端报表。

注2：该方案仅支持同一台电脑下读取缓存，不同电脑缓存的结果也不一致。

示例一：通用版

1. 打开需要配置的模板，点击右上角「组件设置」中「para」组件。
2. 点击「添加事件」添加一个「初始化」后事件。
3. 在事件编辑框中添加参数，并写入对应的JavaScript脚本。
   
   

其中，参数名为fr_name，参数值为公式reportName。

JavaScript 代码如下：

// 监测到浏览器页面关闭时将参数栏所有控件当前所选的值保存到localStorage中，将fr_name参数encodeURL后转为Base64编码作为缓存的key值
window.onbeforeunload = function() {
	localStorage.setItem(btoa(encodeURI(fr_name)), _g().getParameterContainer().getSelectValue());
};

// 页面初始化后，根据key值读取缓存值，若存在则将对应的值赋值给对应的控件
setTimeout(function() {
	var storage = localStorage.getItem(btoa(encodeURI(fr_name)));
	if (storage) {
		var storageJson = JSON.parse(storage);
		for (var key in storageJson) {
			_g().getParameterContainer().getWidgetByName(key).setValue(storageJson[key]);
		}
	};
}, 10);

示例二：指定参数版

1. 打开需要配置的模板，点击右上角「组件设置」中「para」组件。
2. 点击「添加事件」添加一个「初始化后」事件。
3. 在事件编辑框中添加参数，并写入对应的JavaScript脚本。

注：若仅指定部分参数读取缓存值或控件之间存在关联关系，推荐使用第二种方案

其中，参数名为fr_name，参数值为公式reportName。

JavaScript 代码如下：

// 监测到浏览器页面关闭时将参数栏所有控件当前所选的值保存到localStorage中，将fr_name参数encodeURL后转为Base64编码作为缓存的key值
window.onbeforeunload = function() {
	localStorage.setItem(btoa(encodeURI(fr_name)), _g().getParameterContainer().getSelectValue());
};

// 页面初始化后，根据key值读取缓存值，再根据指定的控件顺序进行赋值
setTimeout(function() {
	var storage = localStorage.getItem(btoa(encodeURI(fr_name)));
	if (storage) {
		var storageJson = JSON.parse(storage);
		var widgetsKeys = ["AREA","PROVINCE","CITY"]; // 指定需要默认赋值的参数及参数顺序
		widgetsKeys.forEach(key=>{_g().getParameterContainer().getWidgetByName(key).setValue(storageJson[key]);})
	};
}, 10);

示例三：FS决策平台版

目前开放的API中并未包含决策平台页签关闭事件，所以无法监测到报表在决策平台中关闭的事件。因此，如果希望实现同样的效果，则需要在每次点击查询按钮时就将当前的控件参数值全部缓存到浏览器中。

具体操作除示例一与示例二中的内容外，需补充以下步骤：

1. 选中「查询」按钮。
2. 点击「添加事件」，并添加一个「点击」事件。
3. 在事件编辑框中添加参数，并写入对应的JavaScript脚本。

其中，参数名为fr_name，参数值为公式reportName。

JavaScript 代码如下：

// 将fr_name参数encodeURL后转为Base64编码作为缓存的key值,参数栏所有控件当前所选的值作为value值
localStorage.setItem(btoa(encodeURI(fr_name)),_g().getParameterContainer().getSelectValue());

模板下载

1）示例一：

点击下载模板：JS实现模板打开默认带出上一次查询的参数条件（通用版）.cpt

2）示例二：

点击下载模板：JS实现模板打开默认带出上一次查询的参数条件（指定控件及顺序版）.cpt

3）示例三：

点击下载模板：JS实现模板打开默认带出上一次查询的参数条件（决策平台版）.cpt