JS實現決策報表快取最後一次查詢條件

阿新 • • 發佈：2022-12-11

問題描述

決策報表在開啟時希望引數控制元件的值可以預設是上一次頁面關閉前最後一次查詢所選擇的值。

解決方案

每次點選查詢後將引數值儲存到瀏覽器快取中（適用於控制元件在引數欄內），或每次控制元件值發生改變後將引數值儲存到瀏覽器快取中（適用於控制元件在報表體內）。

報表開啟時從瀏覽器快取中將引數值讀取出來並賦值給對應的控制元件。

注：該方案僅支援同一臺電腦下讀取快取，不同電腦快取的結果也不一致。

示例一：引數欄版

儲存引數

開啟需要配置的模板，點選引數欄中「查詢」按鈕。
點選「新增事件」新增一個「點選」事件。
在事件編輯框中新增引數，並寫入對應的JavaScript指令碼。

其中，引數名為fr_name

，引數值為公式formletName。

JavaScript 程式碼如下：

var localStorageObj = {};
var widgetsKeys = ["AREA", "PROVINCE", "CITY"]; // 指定需要快取的引數及引數順序
widgetsKeys.forEach(
  key => {
    localStorageObj[key] = _g().getParameterContainer().getWidgetByName(key).getValue();
  }
)
// 將引數名與引數值拼接成JSON物件並轉換成字串快取到瀏覽器快取中，將fr_name引數encodeURL後轉為Base64編碼作為快取的key值
localStorage.setItem(btoa(encodeURI(fr_name)), JSON.stringify(localStorageObj));

從快取中讀取引數

點選右上角「元件設定」中「para」元件。
點選「新增事件」新增一個「初始化後」事件。
在事件編輯框中新增引數，並寫入對應的JavaScript指令碼。

其中，引數名為fr_name，引數值為公式formletName。

JavaScript 程式碼如下：

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]); })
};

示例二：報表體內版

儲存引數

開啟需要配置的模板，選中需要快取的控制元件。
點選「新增事件」新增一個「編輯結束」事件。
在事件編輯框中新增引數，並寫入對應的JavaScript指令碼。

注：如果需要快取的控制元件是多個，那麼需要重複上述操作到每個控制元件中。

其中，引數名為fr_name，引數值為公式formletName。

JavaScript 程式碼如下：

var localStorageObj = {};
var widgetsKeys = ["AREA", "PROVINCE", "CITY"]; // 指定需要快取的引數及引數順序
widgetsKeys.forEach(
  key => {
    localStorageObj[key] = _g().getWidgetByName(key).getValue();
  }
)
// 將引數名與引數值拼接成JSON物件並轉換成字串快取到瀏覽器快取中，將fr_name引數encodeURL後轉為Base64編碼作為快取的key值
localStorage.setItem(btoa(encodeURI(fr_name)), JSON.stringify(localStorageObj));

從快取中讀取引數

點選右上角「元件設定」中「body」元件。
點選「新增事件」新增一個「初始化後」事件。
在事件編輯框中新增引數，並寫入對應的JavaScript指令碼。

其中，引數名為fr_name，引數值為公式formletName。

JavaScript 程式碼如下：

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().getWidgetByName(key).setValue(storageJson[key]); })

  };
}, 100)