关于这个选项卡，说两句自己摸索拍坑的过程。官方文档中：
_2.TAB过滤选项卡
在一键生成CRUD时，如果表中存在status字段且为ENUM类型，则会生成相应的TAB过滤选项卡，如果需要生成其它字段的过滤选项卡则可以在使用php think crud时使用--headingfilterfield=你的字段名称来指定字段_
也就是说你可以使用任何enum字段来crud自动生成这个选项卡，默认是status字段。但是它是怎么运作的，我们来尝试解析一下，有关代码如下

<div class="panel-heading">        {:build_heading(null,FALSE)}        <ul class="nav nav-tabs" data-field="status">            <li class="{:$Think.get.status === null ? 'active' : ''}"><a href="#t-all" data-value="" data-toggle="tab">{:__('All')}</a></li>            {foreach name="statusList" item="vo"}            <li class="{:$Think.get.status === (string)$key ? 'active' : ''}"><a href="#t-{$key}" data-value="{$key}" data-toggle="tab">{$vo}</a></li>            {/foreach}        </ul>    </div>

上面代码中关键的几个部分就是：1、class="nav nav-tabs"，js会用这个类来绑定tab的事件。2、{foreach name="statusList" item="vo"}这是控制器controller/xxx.php传过来的数组。getStatusList()是model/xxx.php模型的方法，这些看一下代码应该好理解。

$this->view->assign("statusList", $this->model->getStatusList());

现在我们把html里面的内容简化一下，相当于我们给statuelist一些值。
<div class="panel-heading">

    {:build_heading(null,FALSE)}    <ul class="nav nav-tabs" data-field="status">        <li class="active"><a href="#t-all" data-value="" data-toggle="tab">{:__('All')}</a></li>        <li ><a href="#t-A" data-value="1" data-toggle="tab">第一个</a></li>        <li ><a href="#t-B" data-value="2" data-toggle="tab">第二个</a></li>        <li ><a href="#t-C" data-value="3" data-toggle="tab">第三个</a></li>    </ul></div>

这里用到的逻辑部分，其实就是class="nav nav-tabs" data-field="status" data-value，其他的都只是用于显示的，到这里可能有一些朋友就不知道下一步在哪儿了。在require_table.js里面：290行左右

// 绑定TAB事件                $('.panel-heading [data-field] a[data-toggle="tab"]', table.closest(".panel-intro")).on('shown.bs.tab', function (e) {                    var field = $(this).closest("[data-field]").data("field");//从这里可以看出 在view层的html里面，你设置的data-field字段                    var value = $(this).data("value");                    var object = $("[name='" + field + "']", table.closest(".bootstrap-table").find(".commonsearch-table"));                    //这里fa处理的方式是把所设置的字段和值传入到commonsearch里面，也就是点击表格左上角那个搜索的放大镜弹出的那个通用搜索，就等同于你在commonsearch里面填充了字段值，执行了通用搜索。（看起来是这样哈，如果不是，请指正）                    if (object.prop('tagName') == "SELECT") {                        $("option[value='" + value + "']", object).prop("selected", true);                    } else {                        object.val(value);                    }                    table.trigger("uncheckbox");                    table.bootstrapTable('refresh', {pageNumber: 1});                    return false;                });

到此，基本上就是 开发者示例里面关于 tab标签页的逻辑。
但是这样逻辑必须指定模型中的某一列，也就是data-field="status"这里，这就存在一个问题，那如果你的选项卡想要显示的内容跟两列或者多列有关呐？这种方式就不号整了。所以，要自定义，我的想法是舍弃data-field="status"。
自定义一个tab选项卡
我们不要data-field了，那字段的参数就要挪到js里面去设置，去设置表格的queryParams，这个地方在fa社区的“一张图看懂fastadmin表格”的示例代码也有。
前端直接写出你要的选型卡：

<div class="panel-heading">        {:build_heading(null,FALSE)}        <ul class="nav nav-tabs">            <li class="active"><a href="#t-all" data-value="" data-toggle="tab">{:__('All')}</a></li>            <li ><a href="#t-A" data-value="1" data-toggle="tab">第一个</a></li>            <li ><a href="#t-B" data-value="2" data-toggle="tab">第二个</a></li>            <li ><a href="#t-C" data-value="3" data-toggle="tab">第三个</a></li>        </ul>    </div>

在对应的js里面绑定tab的事件

$('.panel-heading a[data-toggle="tab"]').on('shown.bs.tab', function (e) {                var value = $(this).data("value");                var options = table.bootstrapTable('getOptions');                        options.pageNumber = 1;                        options.queryParams = function (params) {                            var filter = {};//直接设空的filter，op                            var op = {};                            switch(value){                                case 'all':                                    break;//如果tab的value是all，那就是没有附加参数，就什么也不做                                case '1':                                    filter.字段1 =  '字段1的值';                                    filter.字段2 = '字段2的值';                                    op.leavedate = '=';//这里的op不一定是=，也可以是range，>,<，之类的，具体的有兴趣可以去看一下/app/common/controller/backend.php，里面的buildparams函数，你会在里面找到答案                                    op.backdate = '=';                                    break;                                case '2':                                     filter.字段3 =  '字段3的值';                                    filter.字段4 = '字段4的值';                                    op.leavedate = '<=';//                                    op.backdate = '>=';                                    break                                case '3':                                        filter.字段5 =  '字段5的值';                                    filter.字段6 = '字段6的值';                                    op.leavedate = '=';//                                    op.backdate = '=';                                    break;                                default:                                    break;                                }                                //下面就要把filter，op序列化之后写进params对象，bootstrapTable('refresh', {})会用新的params去请求后端服务器，这里如果我说的不够清楚的话，可以看一下浏览器开发者工具里面对应的url。                            params.filter = JSON.stringify(filter);                            params.op = JSON.stringify(op);                            return params;                        };                        table.bootstrapTable('refresh', {});                        return false;                            });

第二种方式亲测可用。但是这种方式，可能会让commonsearch失效，因为相当于在显示表格的时候每次都把filter和op重置了。但是如果把var filter={},替换成var filter = params.filter，然后再去追加filter.新字段和op.新字段应该就和通用搜索不冲突了，具体我没试过，还希望大神指正。
当然，如果你觉得这样麻烦，也可以在后台控制器的index里面自己写一个后台的筛选逻辑，我也试过是可以的。
到此结束了，第一次写这种文章，也不知道表达的是否明白，希望对fastadmin的初学者有所帮助。

希望以上内容对你有所帮助！如果还有其他问题，请随时提问。 各类知识收集 拥有多年CMS企业建站经验，对 iCMS， Fastadmin， ClassCMS， LeCMS， PbootCMS， PHPCMS， 易优CMS， YzmCMS， 讯睿CMS， 极致CMS， Wordpress， HkCMS， YznCMS， WellCMS， ThinkCMF， 等各类cms的相互转化，程序开发，网站制作，bug修复，程序杀毒，插件定制都可以提供最佳解决方案。