行的使用和扩展
<h1>行的使用和扩展</h1>
<h3>启用或禁用默认操作按钮</h3>
<p><code>model-grid</code>默认有四个行操作<code>编辑</code>、<code>快捷编辑</code>、<code>删除</code>和<code>详情</code>，可以通过下面的方式关闭它们：</p>
<pre><code class="language-php">use Dcat\Admin\Grid;
$grid-&gt;actions(function (Grid\Displayers\Actions $actions) {
$actions-&gt;disableDelete();
$actions-&gt;disableEdit();
$actions-&gt;disableQuickEdit();
$actions-&gt;disableView();
});
// 也可以通过以下方式启用或禁用按钮
$grid-&gt;disableDeleteButton();
$grid-&gt;disableEditButton();
$grid-&gt;disableQuickEditButton();
$grid-&gt;disableViewButton();</code></pre>
<h3>切换行操作按钮显示方式</h3>
<p>全局默认的行操作按钮显示方式可以通过配置参数<code>admin.grid.grid_action_class</code>参数进行配置，目前支持的行操作按钮显示方式有以下两种：</p>
<ul>
<li><code>Dcat\Admin\Grid\Displayers\DropdownActions</code> 下拉菜单方式</li>
<li><code>Dcat\Admin\Grid\Displayers\Actions</code> 图标展开方式</li>
<li><code>Dcat\Admin\Grid\Displayers\ContextMenuActions</code> 鼠标右键显示下拉菜单</li>
</ul>
<pre><code class="language-php"> ...
'grid' =&gt; [
/*
|--------------------------------------------------------------------------
| The global Grid action display class.
|--------------------------------------------------------------------------
*/
'grid_action_class' =&gt; Dcat\Admin\Grid\Displayers\DropdownActions::class,
],
...</code></pre>
<p>在控制器中切换显示方式</p>
<pre><code class="language-php">use Dcat\Admin\Grid;
public function grid()
{
return Grid(new Model(), function (Grid $grid) {
$grid-&gt;setActionClass(Grid\Displayers\Actions::class);
...
});
}</code></pre>
<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>获取当前行数据</h3>
<p>可以通过传入的<code>$actions</code>参数来获取当前行的数据：</p>
<pre><code class="language-php">use Dcat\Admin\Grid;
$grid-&gt;actions(function (Grid\Displayers\Actions $actions) {
// 当前行的数据数组
$rowArray = $actions-&gt;row-&gt;toArray();
// 当前行的某个字段的数据
$email = $actions-&gt;row-&gt;email;
// 获取当前行主键值
$id = $actions-&gt;getKey();
});</code></pre>
<h3>添加自定义按钮</h3>
<p>如果有自定义的操作按钮，可以通过下面的方式添加：</p>
<pre><code class="language-php">use Dcat\Admin\Grid;
$grid-&gt;actions(function (Grid\Displayers\Actions $actions) {
// append一个操作
$actions-&gt;append('&lt;a href=&quot;&quot;&gt;&lt;i class=&quot;fa fa-eye&quot;&gt;&lt;/i&gt;&lt;/a&gt;');
// append一个复杂操作
$actions-&gt;append(new Copy());
// prepend一个操作
$actions-&gt;prepend('&lt;a href=&quot;&quot;&gt;&lt;i class=&quot;fa fa-paper-plane&quot;&gt;&lt;/i&gt;&lt;/a&gt;');
}</code></pre>
<h3>添加复杂操作按钮</h3>
<p>如果有比较复杂的操作，可以参考下面的方式：</p>
<p>先定义行操作类继承<code>Dcat\Admin\Grid\RowAction</code></p>
<p>> {tip} 动作类更详细的用法，请参考<a href="action.md">动作基本使用</a>以及<a href="action-grid.md">数据表格动作</a>。</p>
<pre><code class="language-php">&lt;?php
namespace App\Admin\Extensions;
use Dcat\Admin\Grid\RowAction;
class CheckRow extends RowAction
{
/**
* 返回字段标题
*
* @return string
*/
public function title()
{
return 'Check row';
}
/**
* 添加JS
*
* @return string
*/
protected function script()
{
return &lt;&lt;&lt;JS
$('.grid-check-row').on('click', function () {
// Your code.
console.log($(this).data('id'));
});
JS;
}
public function html()
{
// 获取当前行数据ID
$id = $this-&gt;getKey();
// 获取当前行数据的用户名
$username = $this-&gt;row-&gt;username;
// 这里需要添加一个class, 和上面script方法对应
$this-&gt;setHtmlAttribute(['data-id' =&gt; $id, 'email' =&gt; $username, 'class' =&gt; 'grid-check-row']);
return parent::html();
}
}</code></pre>
<p>然后添加操作：</p>
<pre><code class="language-php">$grid-&gt;actions([new CheckRow()]);
// 也可以通过这种方式添加
$grid-&gt;actions(function (Grid\Displayers\Actions $actions) {
$actions-&gt;append(new CheckRow());
}</code></pre>
<h3>操作按钮需要与API交互</h3>
<p>如果你的操作类需要与后台接口交互，则可以在你的操作类中加上<code>handle</code>方法，这样就可以很方便的在同一个类里面处理完所有逻辑</p>
<p>> {tip} 动作类更详细的用法，请参考<a href="action.md">动作基本使用</a>以及<a href="action-grid.md">数据表格动作</a>。</p>
<pre><code class="language-php">&lt;?php
namespace App\Admin\RowActions;
use Dcat\Admin\Grid\RowAction;
use Illuminate\Http\Request;
use Illuminate\Database\Eloquent\Model;
class Copy extends RowAction
{
protected $model;
public function __construct(string $model = null)
{
$this-&gt;model = $model;
}
/**
* 标题
*
* @return string
*/
public function title()
{
return 'Copy';
}
/**
* 设置确认弹窗信息，如果返回空值，则不会弹出弹窗
*
* 允许返回字符串或数组类型
*
* @return array|string|void
*/
public function confirm()
{
return [
// 确认弹窗 title
&quot;您确定要复制这行数据吗？&quot;,
// 确认弹窗 content
$this-&gt;row-&gt;username,
];
}
/**
* 处理请求
*
* @param Request $request
*
* @return \Dcat\Admin\Actions\Response
*/
public function handle(Request $request)
{
// 获取当前行ID
$id = $this-&gt;getKey();
// 获取 parameters 方法传递的参数
$username = $request-&gt;get('username');
$model = $request-&gt;get('model');
// 复制数据
$model::find($id)-&gt;replicate()-&gt;save();
// 返回响应结果并刷新页面
return $this-&gt;response()-&gt;success(&quot;复制成功: [{$username}]&quot;)-&gt;refresh();
}
/**
* 设置要POST到接口的数据
*
* @return array
*/
public function parameters()
{
return [
// 发送当前行 username 字段数据到接口
'username' =&gt; $this-&gt;row-&gt;username,
// 把模型类名传递到接口
'model' =&gt; $this-&gt;model,
];
}
}
</code></pre>
<p>使用</p>
<pre><code class="language-php">use App\Models\User;
$grid-&gt;actions([new Copy(User::class)]);
// 也可以通过这种方式添加
$grid-&gt;actions(function (Grid\Displayers\Actions $actions) {
$actions-&gt;append(new Copy(User::class));
}</code></pre>
<h2>表单弹窗</h2>
<p>请参考文档<a href="widgets-form.md#modal">工具表单 - 弹窗</a></p>