列的基本使用
<h1>列的基本使用</h1>
<h3>设置列为可排序 (sortable)</h3>
<pre><code class="language-php">$grid-&gt;column('id')-&gt;sortable();</code></pre>
<p>表格字段支持关联关系表字段以及<code>json</code>字段的排序</p>
<p>> 注意，关联关系仅支持<code>hasOne</code>以及<code>belongsTo</code>两种类型的字段排序，并且不支持多层级嵌套！</p>
<pre><code class="language-php">// 关联关系表字段排序
$grid-&gt;column('profile.age')-&gt;sortable();
// 指定需要排序的字段名称
$grid-&gt;column('my_age')-&gt;sortable('profile.age');
// json字段排序
$grid-&gt;column('options.price')-&gt;sortable('options-&gt;price');
// 关联关系表的 json 字段排序
$grid-&gt;column('profile.options.price')-&gt;sortable('profile.options-&gt;price');</code></pre>
<p>支持<code>MySql</code>的<code>order by cast(`{field}` as {type})</code>用法</p>
<pre><code class="language-php">$grid-&gt;column('profile.age')-&gt;sortable(null, 'SIGNED');
$grid-&gt;column('profile.options.price')-&gt;sortable('profile.options-&gt;price', 'SIGNED');</code></pre>
<h4>设置默认排序</h4>
<pre><code class="language-php">$grid-&gt;model()-&gt;orderBy('id', 'desc');</code></pre>
<p>这个功能也支持关联关系表字段排序，注意这里仅支持<code>一对一</code>以及<code>一对多</code>关联关系</p>
<pre><code class="language-php">$grid-&gt;model()-&gt;orderBy('profile.age');</code></pre>
<h3>设置列的宽度 (width)</h3>
<p>设置列的宽度，当字段内容过长时可以使用这个方法限制列宽度</p>
<pre><code class="language-php">// px
$grid-&gt;column('long_text')-&gt;width('300px');
// 百分比
$grid-&gt;column('long_text')-&gt;width('15%');</code></pre>
<h3>固定列 (fixColumns)</h3>
<p>通过 <code>fixColumns</code> 方法可以给表格设置固定列，第一个参数表示固定从头开始的前三列，第二个参数表示固定从后往前数的两列，（第二个参数可不传，默认为-1）</p>
<pre><code class="language-php">$grid-&gt;fixColumns(2, -2);</code></pre>
<p>效果</p>
<p><img src="https://cdn.learnku.com/uploads/images/202007/12/38389/8aKnpG11g4.gif!large" alt="" /></p>
<h3>获取行序号 (index)</h3>
<p>序号从 <code>0</code> 开始计算</p>
<pre><code class="language-php">// 在 display 回调中使用
$grid-&gt;column('序号')-&gt;display(function () {
return $this-&gt;_index + 1;
});
// 在行操作 action 中使用
$grid-&gt;actions(function ($actions) {
$index = $this-&gt;_index;
...
});</code></pre>
<h3>设置td标签HTML属性 (setAttributes)</h3>
<pre><code class="language-php">$grid-&gt;column('email')-&gt;setAttributes(['name' =&gt; '...'])</code></pre>
<h3>设置表格头HTML属性 (setHeaderAttributes)</h3>
<p>设标题的<code>html</code>属性</p>
<pre><code class="language-php">// 修改颜色
$grid-&gt;column('name')-&gt;setHeaderAttributes(['style' =&gt; 'color:#5b69bc']);</code></pre>
<h3>设置列选择器 (字段显示或隐藏 showColumnSelector)</h3>
<p>此功能默认不启用</p>
<pre><code class="language-php">// 开启字段选择器功能
$grid-&gt;showColumnSelector();
// 设置默认隐藏字段
$grid-&gt;hideColumns(['field1', ...]);</code></pre>
<p><img src="https://cdn.learnku.com/uploads/images/202004/26/38389/MTgikMeV1o.png!large" alt="" /></p>
<p><a name="column-selector-store"></a></p>
<h4>存储驱动 (持久化)</h4>
<p>在配置文件<code>config/admin.php</code>可以配置存储列选择器状态的方式，支持的存储方式如下</p>
<ul>
<li><code>Dcat\Admin\Grid\ColumnSelector\SessionStore</code> 列选择器状态数据保存在<code>session</code>中，仅在登陆状态中有效</li>
<li><code>Dcat\Admin\Grid\ColumnSelector\CacheStore</code> 列选择器状态数据保存在<a href="https://laravel.com/docs/8.x/cache#driver-prerequisites">Laravel Cache</a>缓存系统中，最长可保存<code>300</code>天，并可以通过<code>admin.grid.column_selector.store_params.driver</code>可以配置缓存驱动，默认为<code>file</code></li>
</ul>
<pre><code class="language-php"> 'grid' =&gt; [
...
'column_selector' =&gt; [
'store' =&gt; Dcat\Admin\Grid\ColumnSelector\SessionStore::class,
'store_params' =&gt; [
'driver' =&gt; 'file',
],
],
],</code></pre>
<h3>设置列提示信息 (help)</h3>
<p><code>Grid\Column::help</code>参数：</p>
<ul>
<li>$help <code>string</code> 提示内容</li>
<li>$style <code>string</code> 提示窗背景颜色，支持<code>green</code>、 <code>blue</code>、<code>red</code>、<code>purple</code></li>
<li>$placement <code>string</code> 提示窗位置，支持<code>top</code>、<code>left</code>、<code>right</code>、<code>bottom</code></li>
</ul>
<p><img src="https://cdn.learnku.com/uploads/images/202004/26/38389/MTgikMeV1o.png!large" alt="" /></p>
<pre><code class="language-php">$grid-&gt;column('id')-&gt;help('提示信息');</code></pre>
<h3>设置列搜索</h3>
<p>通过<code>Grid\Column::filter</code>方法可以给列设置一个过滤器，可以很方便的根据这一列进行数据表格过滤操作，具体使用方法请参考<a href="model-grid-column-filter.md">列过滤器</a>。</p>
<p><img src="https://cdn.learnku.com/uploads/images/202004/26/38389/8zNK7CHS3V.png!large" alt="" /></p>
<h3>扩展列功能</h3>
<p>通过<code>Grid\Column::macro</code>方法可以扩展列方法。</p>
<p>在 <code>app/Admin/bootstrap.php</code> 中添加以下代码</p>
<pre><code class="language-php">use Dcat\Admin\Grid;
// $value 是当前字段的值
// $p1、$p2 是自定义参数
Grid\Column::macro('myHeader', function ($value, $p1, $p2 = null) {
// MyHeader 需要实现 Illuminate\Contracts\Support\Renderable 接口
// 当然这里也可以直接传字符串
return $this-&gt;addHeader(new MyHeader($this, $p1, $p2));
});</code></pre>
<p><code>MyHeader</code> 类</p>
<pre><code class="language-php">use Dcat\Admin\Grid\Column;
use Illuminate\Contracts\Support\Renderable;
class MyHeader implements Renderable
{
public function __construct(Column $column, $p1, $p2)
{
...
}
public function render()
{
...
}
}</code></pre>
<p>使用</p>
<pre><code class="language-php">$grid-&gt;column('user')-&gt;myHeader($p1, $p2);
$grid-&gt;column('first_name')-&gt;myHeader($p1);</code></pre>