乌鸦嘴文档 乌鸦嘴文档
乌鸦嘴社区 (opens new window)
乌鸦嘴社区 (opens new window)
  • 入门

  • 数据列表

    • 表格基本使用
    • 列的基本使用
      • 列的显示和扩展
      • 行的使用和扩展
      • 工具栏
      • 树状表格
      • 组合表头
      • 表格数据源
      • 表格关联关系
      • 查询过滤
      • 列过滤器
      • 表格快捷搜索
      • 表格规格筛选器
      • 数据导出
      • 快捷创建
      • 数据表格行内编辑
      • 数据表格事件
      • 表格字段翻译
      • 数据软删除
      • 头部和脚部
      • 表格异步渲染
    • 数据表单

    • 数据详情

    • 模型树

    • 数据仓库

    • 动作

    • 多语言

    • 开发扩展

    • 页面组件

    • 区块

    • 动作以及表单相应

    • 权限控制

    • 菜单

    • 帮助函数

    • 开发工具

    • 自定义登陆

    • 自定义头部导航

    • 更新日志

    目录

    列的基本使用

    # 列的基本使用

    # 设置列为可排序 (sortable)

    $grid->column('id')->sortable();
    

    表格字段支持关联关系表字段以及json字段的排序

    注意,关联关系仅支持hasOne以及belongsTo两种类型的字段排序,并且不支持多层级嵌套!

    // 关联关系表字段排序
    $grid->column('profile.age')->sortable();
    
    // 指定需要排序的字段名称
    $grid->column('my_age')->sortable('profile.age');
    
    // json字段排序
    $grid->column('options.price')->sortable('options->price');
    // 关联关系表的 json 字段排序
    $grid->column('profile.options.price')->sortable('profile.options->price');
    

    支持MySql的order by cast(`{field}` as {type})用法

    $grid->column('profile.age')->sortable(null, 'SIGNED');
    
    $grid->column('profile.options.price')->sortable('profile.options->price', 'SIGNED');
    

    # 设置默认排序

    $grid->model()->orderBy('id', 'desc');
    

    这个功能也支持关联关系表字段排序,注意这里仅支持一对一以及一对多关联关系

    $grid->model()->orderBy('profile.age');
    

    # 设置列的宽度 (width)

    设置列的宽度,当字段内容过长时可以使用这个方法限制列宽度

    // px
    $grid->column('long_text')->width('300px');
    // 百分比
    $grid->column('long_text')->width('15%');
    

    # 固定列 (fixColumns)

    通过 fixColumns 方法可以给表格设置固定列,第一个参数表示固定从头开始的前三列,第二个参数表示固定从后往前数的两列,(第二个参数可不传,默认为-1)

    $grid->fixColumns(2, -2);
    

    效果

    # 获取行序号 (index)

    序号从 0 开始计算

    // 在 display 回调中使用
    $grid->column('序号')->display(function () {
        return $this->_index + 1;
    });
    
    
    // 在行操作 action 中使用
    $grid->actions(function ($actions) {
        $index = $this->_index;
        
        ...
    });
    

    # 设置td标签HTML属性 (setAttributes)

    $grid->column('email')->setAttributes(['name' => '...'])
    

    # 设置表格头HTML属性 (setHeaderAttributes)

    设标题的html属性

    // 修改颜色
    $grid->column('name')->setHeaderAttributes(['style' => 'color:#5b69bc']);
    

    # 设置列选择器 (字段显示或隐藏 showColumnSelector)

    此功能默认不启用

    // 开启字段选择器功能
    $grid->showColumnSelector();
    
    // 设置默认隐藏字段
    $grid->hideColumns(['field1', ...]);
    

    # 存储驱动 (持久化)

    在配置文件config/admin.php可以配置存储列选择器状态的方式,支持的存储方式如下

    • Dcat\Admin\Grid\ColumnSelector\SessionStore 列选择器状态数据保存在session中,仅在登陆状态中有效
    • Dcat\Admin\Grid\ColumnSelector\CacheStore 列选择器状态数据保存在Laravel Cache (opens new window)缓存系统中,最长可保存300天,并可以通过admin.grid.column_selector.store_params.driver可以配置缓存驱动,默认为file
        'grid' => [
    
            ...
    
            'column_selector' => [
                'store' => Dcat\Admin\Grid\ColumnSelector\SessionStore::class,
                'store_params' => [
                    'driver' => 'file',
                ],
            ],
        ],
    

    # 设置列提示信息 (help)

    Grid\Column::help参数:

    • $help string 提示内容
    • $style string 提示窗背景颜色,支持green、 blue、red、purple
    • $placement string 提示窗位置,支持top、left、right、bottom

    $grid->column('id')->help('提示信息');
    

    # 设置列搜索

    通过Grid\Column::filter方法可以给列设置一个过滤器,可以很方便的根据这一列进行数据表格过滤操作,具体使用方法请参考列过滤器。

    # 扩展列功能

    通过Grid\Column::macro方法可以扩展列方法。

    在 app/Admin/bootstrap.php 中添加以下代码

    use Dcat\Admin\Grid;
    
    // $value 是当前字段的值
    // $p1、$p2 是自定义参数
    Grid\Column::macro('myHeader', function ($value, $p1, $p2 = null) {
        // MyHeader 需要实现 Illuminate\Contracts\Support\Renderable 接口
        // 当然这里也可以直接传字符串
        return $this->addHeader(new MyHeader($this, $p1, $p2));
    });
    

    MyHeader 类

    use Dcat\Admin\Grid\Column;
    use Illuminate\Contracts\Support\Renderable;
    
    class MyHeader implements Renderable
    {
        public function __construct(Column $column, $p1, $p2)
        {
            ...
        }
        
        public function render()
        {
            ...
        }
    }
    

    使用

    $grid->column('user')->myHeader($p1, $p2);
    
    $grid->column('first_name')->myHeader($p1);
    
    表格基本使用
    列的显示和扩展

    ← 表格基本使用 列的显示和扩展→

    Theme by Vdoing | Copyright © 2020-2022 wyz.xyz 宁ICP备15001739号-5
    • 跟随系统
    • 浅色模式
    • 深色模式
    • 阅读模式
    ×