D06-10 頂部參數面板插件

1. 範本預設參數介面是透過底部參數介面的漏斗過濾按鈕呼叫的，點選後會跳轉到新的頁面編輯參數，再進行查詢。部分使用者可能不習慣該交互，希望參數介面能夠直接在報表主體中顯示，選擇參數等也不需要進行頁面跳轉。如下圖所示。

2. 使用者可以使用頂部參數面板插件，自由選擇參數面板的位置。插件下載請點選：頂部參數面板插件。插件安裝方式，可參考A11-18伺服器-插件管理。

3. 行動端預覽參數介面直接顯示在主體中，選擇參數後，自動重新整理下方的報表資料，適用於資料量不多，參數個數較少且無複雜自訂控制的參數介面範本中。

1

範本設定。

1. 在報表設計器中，可以對 CPT 和 FRM 範本參數介面設定顯示樣式為頂部樣式。

2. 開啟範本【%FR_HOME%\webapps\webroot\WEB-INF\reportlets\demotw\Phone\parameter\參數查詢-phone.cpt】。

3. 點選參數面板，點選行動端，參數面板選擇【頂部】，如下圖所示。

2

行動端預覽。

1. 儲存範本，選擇【行動端預覽】。App 效果與本文章節一中【2預期效果】一致。HTML5預覽效果如下圖所示。

注：部分版本不支援 HTML5 端的頂部參數面板，具體請參考本文章節一【1 版本說明】。

1

資料篩選效果。

1. 若參數面板中存在正文元件時，參數面板選擇【頂部】，頂部顯示篩選按鈕，點選後【從側邊欄進行輸入查詢】，行動端效果預覽效果如下圖所示。

2

元件顯示效果。

1. 插件10.4.975 版本對頂部元件的顯示效果進行了優化，具體的版本要求可以參見章節一中【1 版本說明】，優化點如下。

2. 元件初始化顯示規則如下。元件有預設值：顯示設定的元件值（如果多值元件設定了多個預設值，則顯示第一個值+選中個數）；元件無預設值：按【水印】→【標籤名稱】→【都為空】的順序來顯示，對應的設定位置如下圖1所示。範例效果如下圖2所示。

3. 選中值顯示規則如下。單值元件：切換後顯示選中的值；多值元件：切換後顯示第一個值+選中個數，其中選中個數圖示代替初始化選值圖示，如下圖3所示。

3

條件篩選優化

1. 插件10.4.976 版本對較多篩選條件的顯示效果進行了優化，具體的版本要求可以參見章節一中【1 版本說明】，優化點如下。

2. 多條件篩選。當【條件數<=4】時，所有條件都可以直接顯示在一行，如下圖1所示；當【條件數>4】時，多出的條件會收納到【更多】裏，使用者可以下拉設定其他條件，如下圖2所示。

3. 自動查詢。樣式範本選擇【頂部】時，點選右側的編輯按鈕，可以選擇是否開啓資料自動查詢，如下圖所示。勾選了【自動查詢】，設定了某個條件後，會立即進行查詢，效果如下圖3所示；不勾選【自動查詢】，設定了某個條件後，需要點選右邊的【查詢】按鈕，才能進行查詢，如下圖4所示。