1. 概述
參數面板上新增元件實現參數查詢時，當設計器中元件的配置項無法滿足使用者的需求時，使用者可以使用 JavaScript 來開發功能，如修改元件樣式、設定元件預設值、修改元件搜尋邏輯、實現參數聯動、實現參數查詢等。
2. API
對元件進行修改時，需要先獲取到元件，那麼如何使用 JavaScript 來獲取到參數面板上的元件呢？可查看：參數面板API、獲取元件
獲取到元件之後，需要對該元件進行操作，如獲取其元件值，指派，設定是否可見等，可查看：元件通用、日期元件專有、按鈕元件專有、下拉框元件專有
3. 範例
| 目錄 | 文檔 | 應用場景 |
|---|---|---|
| 元件樣式和屬性 | CSS修改元件樣式 | 在實際項目中，為了讓 FineReport 報表中的元件和頁面風格一致， 需要修改下元件的顯示樣式。 |
| JS實現按鈕文字豎排顯示 | 顯示在按鈕上的文字可以豎排顯示。 | |
| JS給參數元件新增水印文字 | 元件新增水印的API，可以透過 JS 給元件新增水印。 | |
| JS實現點選任意位置展現下拉框列表 | 將下拉框、下拉複選框設定為點選任意位置即可展開下拉框選項，非預設點選最右側的三角才可以實現下拉。 | |
| JS實現下拉框懸浮顯示實際值 | 下拉框的資料字典中設定了實際值與顯示值，展示的時候只能看到顯示值，希望滑鼠放上去的時候，可以懸浮顯示實際值。 | |
| JS實現下拉複選框預設全選 | 下拉框預設將全部選項選中。 | |
| JS實現複選按鈕組元件預設全選 | 複選按鈕自帶的「支援全選」功能勾選後會出現會出現一個「全選」的按鈕，若不希望出現此按鈕可以新增 JS 實現全選。 | |
| JS實現日期元件查詢天數控制 | 參數面板有2個日期元件，開始時間和結束時間，想要判斷開始時間不能大於結束時間，且兩者間隔不超過30天。 | |
| JS實現參數聯動層級限制彈出提示框 | 多個篩選框，選擇值時有先後順序，使用者選擇時，若不符合先後順序，給出彈窗提示且不允許選擇。 | |
| JS實現開始日期編輯後結束日期增加7天 | 有兩個日期元件分別為開始日期和結束日期，要查詢一個星期的資料，實現選擇開始日期之後，結束日期自動指派為開始日期後7天的日期。 | |
| 元件聯動 | JS實現動態選擇欄並查詢值 | 當報表的資料欄比較多時，可以動態選擇需要的欄並查詢對應的值。 |
| JS根據條件顯示參數元件 | 部分參數元件在沒滿足條件時不顯示，滿足條件後再顯示，如 A 下拉框選擇了內容之後，B 下拉框才顯示出來。 | |
| JS 實現動態隱藏參數以及控制參數面板高度 | 參數元件較多時，這時候可以對一些不常用、不需要展現出來的的元件進行隱藏，當需要展示的時候再使其展示出來。 | |
| JS實現自訂按鈕快速給參數賦指定範圍值 | 週報、月報、季報、年報中有參數查詢時，只需點選某個按鈕，就能準確定位到合適的時間範圍。 | |
| JS實現參數元件指派 | 參數介面中，當一個元件的值取決於另一個元件的值時，就可以透過 JS 條件判斷實現。 | |
| JS實現下拉框選擇後複選框預設全選 | 參數聯動查詢時，選項之間有層級時，希望下拉框選擇值後，複選框可以跟着選中所有和上級相關的值。 | |
| JS實現參數面板顯示對應資料 | 參數面板選擇一次參數之後，可以在參數面板中展現出來對應的其他資料。 | |
| JS實現清空元件內容 | 在使用查詢元件時，有時我們希望能夠快捷重置元件的內容，或者重置所有元件的內容。 | |
| 動態切換年月日查詢報表 | 由於業務的需要，很多情況下需要當滿足某個條件時，某些查詢條件才顯示出來。 | |
| JS實現彈窗後資料回填 | 當某個單選框下拉項比較多時，可以將所有選項做成報表，點選報表中選項即選中。 | |
| JS實現自訂選項彈窗 | 當某個複選框下拉項比較多時，可以將所有選項做成報表，點選報表中選項即選中。 | |
| 動態表 | JS實現點選參數面板按鈕顯示或隱藏資料 | 當報表中列表資料太多時，可透過顯示按鈕隱藏明細資料只顯示統計資料。 |
| JS實現點選按鈕切換Sheet頁 | 填報預覽時，當報表有多個 Sheet 時，可以透過參數面板上按鈕跳轉到指定的 Sheet 。 | |
| 根據參數查看不同報表 | 根據參數值的不同跳轉到不同的範本。 | |
| 其他 | JS實現無需點選查詢按鈕即可自動查詢 | 不點選查詢按鈕，在元件中輸入值後就能查詢結果。 |
| 根據帳號控制查詢資料權限 | 可以採用正文元件、按鈕元件、儲存格複選框自訂一個選項彈窗進行查詢，適用於使用元件時，下拉選項較多，不能全部載入出來的場景。 | |
| JS對於下拉框資料量大的解決方案 | 下拉框複選框中的資料量很大，有上萬條選項時，雖然使用模糊搜尋功能但仍無法在下拉框中載入全部項，可以將所有選項做成報表，點選報表中選項即選中。 |
