头部和脚部
数据表格支持往头部和脚部两个区块填入你想要的内容
$grid->header(function ($collection) {return 'header';});$grid->footer(function ($collection) {return 'footer';});
其中闭包函数的参数$collection为Illuminate\Support\Collection类实例,是当前页表格数据,下面是两个不同场景的使用举例
头部
$grid->header(function ($collection) use ($grid) {$query = Model::query();// 拿到表格筛选 where 条件数组进行遍历$grid->model()->getQueries()->unique()->each(function ($value) use (&$query) {if (in_array($value['method'], ['paginate', 'get', 'orderBy', 'orderByDesc'], true)) {return;}$query = call_user_func_array([$query, $value['method']], $value['arguments'] ?? []);});// 查出统计数据$data = $query->get();// 自定义组件return new Card($data);});
自定义头部展示的组件实现
<?phpuse Illuminate\Contracts\Support\Renderable;use Dcat\Admin\Admin;class Card implements Renderable{public static $js = ['xxx/js/card.min.js',];public static $css = ['xxx/css/card.min.css',];protected $data;public function __construct($data){$this->data = $data;}public function script(){return <<<JSconsole.log('所有JS脚本都加载完了');$('xxx').card();JS;}public function render(){// 在这里可以引入你的js或css文件Admin::js(static::$js);Admin::css(static::$css);// 需要在页面执行的JS代码// 通过 Admin::script 设置的JS代码会自动在所有JS脚本都加载完毕后执行Admin::script($this->script());return view('...', ['data' => $this->data])->render();}}
脚部
一个比较常见的场景是在数据表格的脚部显示统计信息,比如在订单表格的脚部加入收入统计,可以参考下面的代码实现:
$grid->footer(function ($collection) use ($grid) {$query = Model::query();// 拿到表格筛选 where 条件数组进行遍历$grid->model()->getQueries()->unique()->each(function ($value) use (&$query) {if (in_array($value['method'], ['paginate', 'get', 'orderBy', 'orderByDesc'], true)) {return;}$query = call_user_func_array([$query, $value['method']], $value['arguments'] ?? []);});// 查出统计数据$data = $query->get();return "<div style='padding: 10px;'>总收入 : $data</div>";});
如果有比较复杂的脚部需要显示,也可以使用视图对象或者封装成一个类来实现。
