【fastadmin】自定义搜索条件及tab切换

前言

在fastadmin框架中，我们可以看到测试管理模块有这样一个功能，他可以将 select 搜索条件放到 tab 栏中，方便我们快速筛选表格信息，一般是 status 字段

但有些时候我们要筛选的条件可能并不是表中的字段，而是一些较为复杂的逻辑，这时候我们需要自定义筛选条件。那么如何将自定义的筛选条件呈现出上面的效果呢？

业务需求

如图所示，该需求设计的表有3张：患者表、管理员表（医生表）、患者-医生关系表，其中患者和医生的关系为多对多。

解决方案

JS中添加自定义搜索条件

columns: [
	// ......
	{
		field: 'belong',		// 自定义搜索字段名
		title: __('Belong'),
		visible: false,			// 不显示在表格列
		switchable: false,		// 不允许切换显示状态
		searchList: {			// 搜素列表
			"my":__('My'),		// 我的病人
			"undistributed":__("Undistributed")		// 未分配的病人
		},
		defaultValue: 'my'		// 默认展示我的病人
	}
}

HTML中添加 tab 控件

<div class="panel-heading">
    {:build_heading(null,FALSE)}
    <ul class="nav nav-tabs" data-field="belong">
        <li><a href="#t-all" data-value="" data-toggle="tab">{:__('All')}</a></li>
        <!-- 默认选中我的病人 -->
        <li class="active"><a href="#t-my" data-value="my" data-toggle="tab">{:__('My')}</a></li>
        <li><a href="#t-undistributed" data-value="undistributed" data-toggle="tab">{:__('Undistributed')}</a></li>
    </ul>
</div>

后端控制器中处理自定义搜索字段

需要重写 index 方法，处理自定义搜索条件。将\app\admin\library\traits\Backend中的index方法复制到控制器中，并修改如下：

    /**
     * 查看
     *
     * @return string|Json
     * @throws \think\Exception
     * @throws DbException
     */
    public function index()
    {
        //设置过滤方法
        $this->request->filter(['strip_tags', 'trim']);
        if (false === $this->request->isAjax()) {
            return $this->view->fetch();
        }
        //如果发送的来源是 Selectpage，则转发到 Selectpage
        if ($this->request->request('keyField')) {
            return $this->selectpage();
        }

        // 处理自定义查询字段 belong
        $filter = $this->request->get("filter", '');
        $filter = (array)json_decode($filter, true);
        $filter = $filter ? $filter : [];
        if (isset($filter['belong'])) {
            if ($filter['belong'] == 'my') {
                $this->model = $this->model->whereIn('id', function ($query) {
                    $query->table('patient_doctor')
                    ->where('doctor_id', $this->auth->id)
                    ->field('patient_id');
                });
            } else if ($filter['belong'] == 'undistributed') {
                $this->model = $this->model->whereNotIn('id', function ($query) {
                    $query->table('patient_doctor')->field('patient_id');
                });
            }

			// 自定义搜索条件处理完毕，须删除，否则后续 $this->buildparams() 处理其他搜索条件时会报错
            unset($filter['belong']);
            $this->request->get(['filter' => json_encode($filter)]);
        }

        [$where, $sort, $order, $offset, $limit] = $this->buildparams();
        $list = $this->model
            ->where($where)
            ->order($sort, $order)
            ->paginate($limit);

        $result = ['total' => $list->total(), 'rows' => $list->items()];
        return json($result);
    }

总结

1. fastadmin 搜索条件写在表格列 columns 中，由于自定义字段只用于搜索筛选，所以设置visible: false 和 switchable: false 使其隐藏且不允许切换显示状态
2. 搜索默认值在JS中设置 defaultValue: 'my'，在HTML中对应控件加上 active 样式
3. 搜索条件在 request 的 filter 参数中，处理完自定义搜索条件后须删除自定义字段，避免影响其它搜索条件的处理

如果本文对你有帮助，请帮忙点个赞呀！