laravel-admin实现选项卡切换列表

实现效果

业务是 在一个列表中 增加一个详情的按钮 点击按钮之后 跳转到如下页面
这个页面带有选项卡切换的功能

实现过程

首先 laravel-admin的列表默认是只有 编辑 查看 删除的操作按钮
所以我们第一步 就是要给列表页增加一个详情的按钮

先在列表页配置按钮

$grid->actions(
    function (Grid\Displayers\Actions $actions) {
        $actions->add(new Detail());        //详情
    }
);

这个实例化的类就是我们自定义的按钮
为了方便管理，我们另外起一个文件夹在Admin文件夹下创建Actions文件夹
然后创建我们这个模块的文件，比如是Agent
最后创建一个上面我们实例化的类文件 Detail

namespace App\Admin\Actions\Agent;

use Encore\Admin\Actions\RowAction;

class Detail extends RowAction
{
    public $name = '详情';

    public function href()
    {
    	//这里的key就是列表单条数据的id 当作参数 传到我们选项卡的页面
        $key = $this->getKey();
        //这里的路由就是选项卡页面的路由
        return 'agent_list/config/' . $key;
    }
}

配置上述提到的路由

//显示选项卡列表
$router->get('agent/agent_list/config/{agent_id}', 'AgentController@agentInfoIndex');
//选项卡对应功能的提交
$router->put('agent/agent_list/config/{agent_id}', 'AgentController@agentInfoSave');

处理流程

首先是选项卡列表的方法 也就是上面的 agentInfoIndex

/**
* 选项卡切换配置列表
* @param $id
* @param Content $content
* @return Content
*/
public function agentInfoIndex($id, Content $content)
{
   return $content
       ->title($this->title())
       ->description($this->description['index'] ?? trans('admin.list'))
       ->body($this->configTab($id));//通过这里去显示选项卡  这里的id 同样也是上述提到的id
}

选项卡的代码
这里的选项卡呢 我就着重介绍两个
一个选项卡内容是列表 一个选项卡内容是表单

public function configTab($id)
{
    $tab = new Tab();
    //这里就是通过调用一个新的控制器去渲染列表信息 记住这个写法！！！
    $tab->add('这个是列表', (new AgentChildController())->grid()->render());
    //这里就是调用当前控制器下的某个方法实现表单的显示
    $tab->add('这个是表单', $this->agentInfo($id)->edit($id));
    return $tab->render();
}

首先先介绍列表页的控制器
这个控制器就不需要配置路由了！
我只提上主方法 也就是列表方法 grid 其实写法跟普通的列表写法没有什么差别 但是在代码后面需要多一句resource

/**
 * Make a grid builder.
 *
 * @return Grid
 */
public function grid()
{
	//这里就是获取的id
    $id = request()->route()->parameter("agent_id");
    $agentId = AgentModel::query()->where('id', $id)->select('parent_id')->first()->toArray();
    //获取直属下一集的信息
    $agentArr = AgentModel::query()->where('parent_id', $agentId['parent_id'])->select('agent_id')->get()->toArray(
    );
    $agentArr = array_column($agentArr, "agent_id");
    array_push($agentArr, $agentId['parent_id']);
    $grid = new Grid(new AgentModel());
    $grid->model()->where('enable', '<>', Enable::DEL);
    $grid->model()->where('status', '=', AgentStatus::AUDIT_SUCCESS);
    $grid->model()->whereIn('parent_id', $agentArr);
    $grid->disableFilter();
    $grid->disableColumnSelector();
    $grid->disableExport();
    $grid->column('name', '代理名称');
    $grid->column('code', '代理账号');
    $grid->column('create_at', '创建时间')->display(
        function ($time) {
            return date('Y-m-d H:i:s', $time);
        }
    );
    $grid->model()->orderByDesc('id');
    $grid->resource("/admin/agent/agent_list/agent/$id");
    return $grid;
}

接下来是表单

/**
* 根据选项卡显示不一样的内容
* @param $agentId
* @param string $func
*/
public function agentInfo($id)
{
   $form = new Form(new AgentModel());
   $form->setTitle(' ');
   $form->hidden('func', '隐藏提交的选择方法')->default('getAgentOpenTemplate');
   $form->select('agent_template.bond_template_id', '保证金模板')
       ->options(BondTemplateModel::all()->pluck('name', 'bond_template_id'));
   $form->select('agent_template.risk_template_id', '风控模板')
       ->options(RiskTemplateModel::all()->pluck('name', 'risk_template_id'));
   $form->setAction($id);
   return $form;
}

接下来是关于表单的保存
通过上面的设置 我们知道 路由的方法名字是agentInfoSave
其实这里的内容 不需要过于关注代码本身
这里其实就是接收到参数之后
使用model进行保存数据和更新数据 仅此而已！

/**
* 选项卡提交保存
* @param $id
*/
public function agentInfoSave($id)
{
   $params = request()->all();
   $agentInfo = AgentModel::find($id);
   $agentTemplate = AgentTemplateModel::query()
       ->where('agent_template_id', $agentInfo->agent_template_id)
       ->first();
   //如果没有配置 就给这个代理配置一个新的代理模板
   if ($agentInfo->agent_template_id == 0) {
       $params['agent_template_id'] = dk_get_next_id();//手续费模板id
       //插入一个模板
       AgentTemplateModel::query()->insert(
           [
               'agent_template_id'  => $params['agent_template_id'],
               'bond_template_id'   => $params['agent_template']['bond_template_id'],
               'create_at'          => time(),
               'update_at'          => time()
           ]
       );
       //更新这个用户持有的模板
       $res = AgentModel::query()->where('agent_id', $agentInfo->agent_id)
           ->update(['agent_template_id' => $params['agent_template_id']]);
   } else {//如果有配置就进行更新操作
       $agentTemplate->bond_template_id = $params['agent_template']['bond_template_id'];
       $agentTemplate->risk_template_id = $params['agent_template']['risk_template_id'];
       $res = $agentTemplate->save();
   }
   if (!$res) {
       admin_toastr('配置失败', 'error');
   } else {
       admin_toastr('配置成功', 'success');
   }
}

---

至此，选项卡的功能就实现了，
总结一下：

1. 配置一个新的按钮
2. 配置对应的路由
3. 如果有表单的话在配置一个用来保存的路由
4. 渲染列表的时候需要主要语句不能漏掉
5. 参数定义好，个人建议是接收主键ID 不然会有坑！！！

觉得有用的就点个赞加个关注吧！