JS實現決策報表快取上一次瀏覽器查詢參數

1.1 版本

1.2 問題描述

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

1.3 解決方案

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

2. 報表開啟時從瀏覽器快取中將參數值讀取出來並指派給對應的元件。

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

注2：不支援行動端

2.1 儲存參數

1. 開啟需要配置的範本，點選參數欄中「查詢」按鈕。

2. 點選「新增事件」新增一個「點選」事件。

3. 在事件編輯框中新增參數，並寫入對應的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));

2.2 從快取中讀取參數

• 開啟需要配置的範本，點選右上角「組件設定」中「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]); })
};

3.1 儲存參數

1. 開啟需要配置的範本，選中需要快取的元件。

2. 點選「新增事件」新增一個「編輯結束」事件。

3. 在事件編輯框中新增參數，並寫入對應的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));

3.2 從快取中讀取參數

• 點選右上角「組件設定」中「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)

注1：如果需要快取的元件中存在聯動的先後順序關係，在定義widgetsKeys變數時也必須按照聯動的先後順序。

注2：如果元件的資料字典查詢時耗時較長，需要適當增加延時進行指派。

1）範例一：

點選下載範本：決策報表-參數欄.frm

2）範例二：

點選下載範本：決策報表-報表內.frm