1. 概述
適用場景：安裝了「FVS大屏編輯模式」插件的使用者，可參考本文了解 FVS 範本製作。
注：不支援行動端。
1.1 版本
| 報表伺服器版本 | 插件版本 |
|---|---|
| 11.0.9 | V1.12.0 |
1.2 預期效果
本文將介紹 FVS 範本中使用 表格組件 和 日期時間元件 實現日曆翻頁效果。預覽效果如下圖所示：
1.3 實現思路
在表格中使用公式表現日期，設定參數和相應的日期時間元件，透過超連結點選事件改變元件值並查詢來實現翻頁效果。
2. 範例
2.1 新建範本
點選設計器左上角「檔案>新建大屏報表」，建立一張空白大屏，可自訂名稱和尺寸。如下圖所示：
2.2 設計日期時間元件
新增一個日期時間元件到畫布中，設定名稱為 date ，即表示參數為 date ；
設定字號為 16px ，格式下拉選擇「年-月」和「yyyy-MM」，預設值設定為公式：=TODAY() 。
如下圖所示：
2.3 設計表格
2.3.1 新增表格
新增一個表格，點選「編輯組件」進入表格編輯介面。如下圖所示：
2.3.2 日曆樣式設計
這裏主要說明日曆實現方式，具體樣式設計不做贅述。
1）當前日期
在儲存格中插入公式 =FORMAT(TODAY(),"yyyy年MM月dd日 EEEEE") ，獲取當前日期並轉換格式，公式說明可參考 日期的特殊格式轉換 。
2）輔助資料
為了實現日曆效果，需要藉助輔助資料。
B3 儲存格插入公式為 =$date，獲取參數 date 的值，在「儲存格元素」中設定其格式為「日期型」，手動輸入 yyyy年MM月。
B4 儲存格插入公式為 =WEEKDAY(DATEINMONTH($date,1))，獲取參數 date 日期所在月的第一天並傳回其星期數，傳回值為介於0到6之間的某一整數，分別代表星期中的某一天（從星期日到星期六）。
C4 儲存格插入公式為 =DAYSOFMONTH($date)，獲取參數 date 日期所在月包含的天數。
注：設定完成後將第 4 行隱藏。
3）日期排列
B5-H5 儲存格按星期日到星期六的順序進行排列。
B6 儲存格插入公式為 =IF(B4 = 0,1,"")，表示若參數 date 日期所在月的第一天傳回的星期數是 0，則顯示數字為 1，表示這個月的第一天是星期日。
C6 儲存格插入公式為 =IF(B4 <= 1,1 - B4 + 1,"")， 若 B4=0 ，則 C6=2，若 B4=1，則 C6=1 。D6-H6 儲存格與 C6 儲存格同理，依次類推即可。
B7-H9 儲存格插入公式即簡單的累加，詳情請參見範本
B10 儲存格插入公式為 =IF(H9 + 1 <= C4,H9 + 1,"") ，C10-C12 儲存格依次類推。其原理為：H9 儲存格最大可能為 28，最小可能為 22,；而 C4 儲存格最小為 28，最大為 31，故從 B10 儲存格開始，以 H9 為參照執行公式。
更多內容請參見範本，如下圖所示：
4）設定當天日期高亮
選中日曆主體所有的日期儲存格，增加條件屬性，選擇背景顏色，作用物件為「當前格子」。選擇「公式」，分別輸入並「新增」三個公式：$$$=day(now()) and month(B3)==month(B2) and year(B3)==year(B2) ，表示儲存格值為當日的日期時背景色變色。如下圖所示：
2.3.3 設定翻頁超連結
在 C13、D13、F13、G13 儲存格中分別寫入「上年、上月、下月、下年」。
選中 C13 儲存格，新增一個 JavaScript 腳本型別超連結，新增參數 a，參數值為公式
=FORMAT(YEARDELTA(B3,-1),"yyyy-MM") 。
輸入 JavaScript 代碼：
如下圖所示：
另外 3 個儲存格中 JS 代碼相同，參數 a 的值分別為：
上年：FORMAT(YEARDELTA(B3,-1),"yyyy-MM")
上月：FORMAT(MONTHDELTA(B3,-1),"yyyy-MM")
下月：FORMAT(MONTHDELTA(B3,1),"yyyy-MM")
下年：FORMAT(YEARDELTA(B3,1),"yyyy-MM")
注：首次設定超連結後儲存格樣式改變，可自行修改。
2.3.4 表格內容雙向鋪滿
設定完成後，點選左上角「傳回大屏範本」，設定表格內容適應方式為「雙向鋪滿」，點選設計器右上角「儲存」即可。如下圖所示：
2.4 效果預覽
點選右上角「預覽」，效果如 1.2 節預期效果所示。
3. 範本下載
點選下載範本：FVS表格實現日曆翻頁效果.fvs
