## 表格页面整体结构 表格构建器用于列表页面。 表格页面基础结构包含如下区块： 1. 页面标题。 2. 页面操作按钮。 3. 页面提示区域。 4. Tab切换按钮。 5. 表格顶部操作区域（按钮）。 6. 表格搜索区域（表单搜索）。 7. 表格。表格的列又分为如下类型： 1. 复选框列。 2. 数量索引列。 3. 数据列。 4. 右侧操作栏。 8. 分页栏。 > 以上表格中除了页面标题与表格，其他每一项都可选择展示或不展示（包含列中的复选框、数量索引、操作栏等）。 - 基本使用，创建一个列表页面并渲染： ``` return SBuilder::makeTable() ->fetch(); ``` ## 表格中各个区块添加与设置方法 - 设置页面标题 [setPageTitle]() ``` return SBuilder::makeTable() ->setPageTitle('添加页面') ->fetch(); ``` - ~~页面操作按钮暂不支持设置。~~ - 页面提示区域[setPageTips]() ``` return SBuilder::make('table') ->setPageTitle('添加页面') ->fetch(); ``` - Tab切换按钮 [setNavTab]() 与 [setNavTabCurrent]() ``` return SBuilder::make('table') // 设置tab列表 ->setNavTab([ ['test', '测试tab', '/admin/demo/index'], ['test1', '测试追加tab', '/admin/demo/index1'], ['test2', '测试批量添加tab', '/admin/demo/index2'], ]) // 设置当前选中的tab ->setNavTabCurrent('test') ->fetch(); ``` - 表格顶部操作按钮 [addTopButton]() ``` return SBuilder::make('table') ->addTopButton('add') ->fetch(); ``` - 表格搜索区域 1. 时间段筛选 [addTimeFilter]() ``` return SBuilder::make('table') ->addTimeFilter('create_time') ->fetch(); ``` 2. 设置搜索栏 [setSearch]() ``` return SBuilder::make('table') ->setSearch(['id' => 'ID', 'name' => '姓名', 'mobile' => '手机号']) ->fetch(); ``` - 添加表格的列 1. 添加单列 [addColumn]() ``` return SBuilder::make('table') ->addColumn('name', '姓名') ->addColumn('status', '状态', 'status') ->addColumn('create_time', '创建时间', 'datetime') ->fetch(); ``` 2. 批量添加列 [addColumns]() ``` return SBuilder::make('table') ->addColumns([ ['name', '姓名'], ['status', '状态', 'status'], ['create_time', '创建时间', 'datetime'], ]) ->fetch(); ``` 3. 显示多选框列 [showCheckbox]() ``` return SBuilder::make('table') ->showCheckbox() // 或使用addColumn的快捷方式 ->addColumn('__checkbox__') ->fetch(); ``` 4. 显示数量索引 [showIndex]() ``` return SBuilder::make('table') ->showIndex() // 或使用addColumn的快捷方式 ->addColumn('__index__') ->fetch(); ``` 5. 添加右侧操作栏列 [addColumn]() ``` return SBuilder::make('table') ->addColumn('__btn__') // 或在addColumns中使用 ->addColumns([ ..., // 其他的列 ['__btn__'] ]) ->fetch(); ``` - 设置列表数据获取地址 [setRowListUrl]() > SPHP默认会通过ajax请求获取数据列表，当数据列表接口返回一个分页对象时，前端会自动展示分页控件。 ``` return SBuilder::make('table') ->setRowListUrl(url('getList')) ->fetch(); ``` - 设置列表数据 [setRowList]() > 当然，也可以直接设置列表数据，此时将会关闭ajax获取数据功能。但此种方式目前不兼容分页，因此适用于不需要分页的情况。 ``` return SBuilder::make('table') ->setRowList($list) ->fetch(); ``` ## 附录 1. 页面结构示意图：  ## 通用方法: 1. 页面级方法 - [设置页面标题](https://www.kancloud.cn/evanlee/sphp/1068618) - [添加页面提示信息](https://www.kancloud.cn/evanlee/sphp/1068619) - [设置页面Tab](https://www.kancloud.cn/evanlee/sphp/3183863) - [设置页面背景色](设置页面背景色.md) - [设置是否点击遮罩关闭](设置是否点击遮罩关闭.md) - [添加区块](添加区块.md) 2. 区块级方法 - [设置区块名](设置区块名.md) - [设置区块布局](设置区块布局.md)