>[danger] 友情提示：構建器目前只支持HisiPHP Pro版本（[我要升級](https://www.hisiphp.com/authorize.html)） HisiPHP的表格構建器是基于Layui的Table模塊渲染的，所以表格的所有配置均與Layui的Table模塊配置一樣。 ## 基礎參數一覽表（config） | 參數 | 類型 | 必須 | 默認 | 說明 | --- | --- | --- | --- | --- | | cols | Array | Y | | 設置表頭，詳見下面的表頭參數一覽表 | | url | string | N | 當前URL | 異步數據接口 | | defaultToolbar | Array | N | \['filter'\] | 表頭工具欄右側圖標,可選值（filter: 顯示篩選圖標，exports: 顯示導出圖標，print: 顯示打印圖標） | | width | Number | N | | 設定容器寬度 | | height | Number | N | | 設定容器高度 | | cellMinWidth | Number | N | | 所有常規單元格的最小寬度 | | done | String | N | | 數據渲染完的回調 | | data | Array | N | | 直接賦值數據展示，設置此參數后url參數配置無效 | | totalRow | Boolean | N | false | 是否開啟合計行區域 | | page | Boolean | N | false | 開啟分頁 | | limit | Number | N | 10 | 每頁顯示的條數 | | limits | Array | N | \[10,20,30,40,50,60,70,80,90\] | 每頁條數的選擇項 | | loading | Boolean | N | true| 是否顯示加載條 | | title | String | N | | 定義 table 的大標題（在文件導出等地方會用到） | | text | Object | N | | 自定義文本，如空數據時的異常提示等 | | skin | Stirng | N | | 用于設定表格風格，可選值： line （行邊框風格），row （列邊框風格），nob （無邊框風格） | | even | Boolean | N | false | 隔行背景 | | size | String | N | | 設定表格尺寸，可選值：sm （小尺寸），lg （大尺寸） | ## 表頭參數一覽表（cols） | 參數 | 類型 | 必須 | 默認 | 說明 | --- | --- | --- | --- | --- | | type | String | N | | 設定列類型，目前只支持：`checkbox`、`switch` | | field | String | N | | 設定字段名，如果無type參數，此參數為必須 | | title | String | N | | 設定標題名稱，如果無type參數，此參數為必須 | | width | Number/String | N | | 設定列寬 | | minWidth | Number | N | 60 | 當前常規單元格的最小寬度 | | LAY\_CHECKED | Boolean | N | false | 是否全選狀態（復選框列開啟后才有效） | | fixed | String | N | | 固定列，可選值有：*left*（固定在左）、*right*（固定在右） | | hide | Boolean | N | false | 是否初始隱藏列 | | totalRow | Boolean | N | false | 是否開啟該列的自動合計功能 | | totalRowText | String | N | | 用于顯示自定義的合計文本 | | sort | Boolean | N | false | 是否允許排序 | | unresize | Boolean | N | false | 是否禁用拖拽列寬 | | edit | String | N | | 單元格編輯類型，可選值：*text*（輸入框） | | event | String | | | 自定義單元格點擊事件名 | | style | String | N | | 自定義單元格樣式（CSS樣式） | | align | String | N | | 單元格排列方式，可選值有：*left*（默認）、*center*（居中）、*right*（居右） | | colspan | Number | N | 1 | 單元格所占列數（一般用于多級表頭） | | rowspan | Number | N | 1 | 單元格所占行數（一般用于多級表頭） | | templet | String | N | | 自定義列模板 | | toolbar | String | N | | 綁定列工具條 | | button | Array | N | | 操作按鈕，請參考下面的解釋 | >[info] 表頭參數type為switch(開關)時，點擊開關按鈕會自動請求當前控制器的status方法（如果控制器未定義此方法，默認調用內置的通用方法） >[info] 表頭參數設置了edit為text時，會自動將當前單元格編輯后的內容發送至當前控制器的setField方法（如果控制器未定義此方法，默認調用內置的通用方法） >[info] 表頭參數button的格式如下： > [ ['title' => '編輯', 'class' => 'layui-btn', url=>url('edit'), param => ['參數名' => '參數值'], options => ['key' => 'value']], ['title' => '刪除', 'class' => 'layui-btn', url=>url('del'), param => ['參數名' => '參數值'], options => ['key' => 'value']], ] 示例代碼： ``` public function table() { $assign['buildTable']['config'] = [ 'page' => true, 'limit' => 20, 'toolbar' => false, 'cols' => [ [ 'type' => 'checkbox', ], [ 'field' => 'id', 'title' => 'ID', 'width' => 100, ], [ 'field' => 'title', 'title' => '客戶名', 'width' => 200, ], [ 'field' => 'area', 'title' => '城市', 'width' => 200, ], [ 'field' => 'create_time', 'title' => '創建時間', 'width' => 200, ], // 操作按鈕：第一種寫法 [ 'title' => '操作', 'templet' => '<div><a href='.url('edit').' class="layui-btn layui-btn-xs layui-btn-normal">編輯</a><a href='.url('del').' class="layui-btn layui-btn-xs layui-btn-danger">刪除</a></div>', ], // 操作按鈕：使用button的寫法【推薦】 [ 'title' => '操作', 'button' => [ [ 'title' => '編輯', 'class' => 'layui-btn layui-btn-xs layui-btn-normal', 'url' => url('edit'), 'param' => [ 'type' => '1', // 固定值示例 'name' => '{{d.title}}',// 使用變量獲取當前列的標題 ],// 擴展參數[選填] 'options' => [],// 擴展數據，此參數主要是給js用的[選填] ], [ 'title' => '刪除', 'class' => 'layui-btn layui-btn-xs layui-btn-danger', 'url' => url('delete'), 'options' => [],// 擴展數據[選填] ], ], ], ]; return $this->assign($assign)->fetch(); } ```