1. 概述
1.1 應用場景
在 FVS視覺化看板中，點選表格標題實現多列排序，並實現點第一下降冪，點第二下升冪，點第三下恢復原狀。效果如下圖所示：
注：決策報表實現方式請參考歷史文檔 决策报表实现特殊多列排序 。
1.2 實現思路
擴展後排序結合 JavaScript 類型的超連結實現，且 JavaScript 有 3 個參數：
參數a：升冪/降冪標記
參數b：當前欄位標記
參數c：上次點選標記
透過 3 個參數的判斷可以實現該特殊多列排序的效果。
2. 範例
2.1 建立範本
1）點選菜單欄「檔案>建立視覺化看板」，保持預設「建立空白看板」選項。
2）視覺化看板名稱自訂為特殊多列排序 ，畫布大小保持預設「1280*720px」。
3）範本樣式選擇「淺色主題一」，點選「建立看板」，如下圖所示：
2.2 準備資料
建立資料集 ds1，SQL 語句為：SELECT * FROM S訂單明細 limit 20
2.3 設計表格
1）點選組件列表欄中的「文字」，將「表格」組件拖入空白畫布中。
2）點選右側配置欄的「編輯組件」按鈕，即可進入組件編輯介面，如下圖所示：
3）進入組件編輯頁面後，如下圖設計表格組件：
2.4 設定擴展後排序
選中 A2 儲存格，如下圖設定升冪類型的擴展後排序，公式為：switch($a,0,"",1,eval($c)*-1,2,eval($c))
2.5 設定JavaScript超連結
1）選中 B1 儲存格，新增 JavaScript 腳本類型的超級連結，需要先設定 3 個參數，然後再寫 JavaScript 程式碼，如下圖所示：
新增的參數如下表所示：
| 參數 | 類型 | 值 |
|---|---|---|
| a | 公式 | $a |
| b | 字串 | b2 |
| c | 公式 | $b |
JavaScript 程式碼如下，使用API refresh 實現表格傳參並重新整理：
if(a==null||b!=c||a.length==0)
{
duchamp.getWidgetByName("表格1_頁面1").refresh({a:1,b:b,c:b})
}
if(a==1&&b==c)
{
duchamp.getWidgetByName("表格1_頁面1").refresh({a:2,b:b,c:b})
}
if(a==2&&b==c)
{
duchamp.getWidgetByName("表格1_頁面1").refresh({a:'',b:b,c:b})
}注：自己範本應用時，記得改程式碼裏面的表格組件名稱。
2）B1 儲存格設定好之後，也給 C1、D1、E1、F1 儲存格設定相似的超連結，除了參數 b 的值不一樣外，其他都相同。
C1、D1、E1、F1 儲存格 JavaScript 超連結參數 b 的值分別是：c2、d2、e2、f2，以 C1 儲存格為例：
最終表格如下圖所示：
2.6 效果預覽
2.6.1 PC 端
儲存範本，點選右上角「預覽」按鈕，效果同本文 1.1 節。
2.6.2 行動端
預覽方式請參考 FVS行動端預覽 ，APP 及 HTML5 端效果如下圖所示：
3. 範本下載
點選下載範本：特殊多欄排序.fvs
