dcat admin 查询过滤,搜索框展示,过滤器布局,查询过滤功能,、搜索框展示和过滤器布局的详细说明

查询过滤功能配置

Dcat Admin 提供了一种灵活的方式来配置和展示数据表格的过滤器。可以通过 Grid 的 filter 方法来定义这些过滤器，并且可以通过不同的布局方式来提升用户体验。

1. 基本设置

在 Grid 的 filter 方法中，你可以定义不同类型的过滤器，包括 equal、like、between 等。下面是一个基本示例：

use Dcat\Admin\Grid;

$grid->filter(function (Grid\Filter $filter) {
    // 默认布局
    $filter->equal('id');
    $filter->like('name');
});

2. 面板布局（Panel）

你可以将过滤器的布局切换为面板布局，这样可以使过滤器区域更加清晰和整洁。在面板布局下，过滤器字段会被组织在一个面板内。

php
use Dcat\Admin\Grid;

$grid->filter(function (Grid\Filter $filter) {
    // 切换到面板布局
    $filter->panel();

    // 设置过滤器字段
    $filter->equal('id');
    $filter->like('name');
});

3. 调整字段宽度

当使用面板布局时，你可能需要调整字段的宽度，以适应面板的设计。可以使用 width 方法来设置字段的宽度：

use Dcat\Admin\Grid;

$grid->filter(function (Grid\Filter $filter) {
    // 切换到面板布局
    $filter->panel();

    // 设置过滤器字段，并调整字段宽度
    $filter->equal('id')->width(3);
    $filter->like('name')->width(4);
});

完整示例

下面是一个完整的示例，展示如何在 Dcat Admin 中配置查询、过滤、搜索框展示和过滤器布局：

use Dcat\Admin\Grid;

$grid->filter(function (Grid\Filter $filter) {
    // 切换到面板布局
    $filter->panel();

    // 配置过滤器字段和宽度
    $filter->equal('id')->width(3)->placeholder('请输入ID');
    $filter->like('name')->width(4)->placeholder('请输入名称');
    
    // 添加其他过滤器字段
    $filter->between('created_at')->datetime()->width(4)->placeholder('选择日期范围');
    $filter->in('status')->multipleSelect([1 => '启用', 0 => '禁用'])->width(3);
});

文档说明

1. $filter->panel()：将过滤器切换为面板布局，使所有的过滤器字段在一个面板内显示。这种布局可以使过滤器区域更加清晰、组织良好。

2. width()：设置每个过滤器字段的宽度，以确保布局在面板中看起来合理。宽度单位通常为列数，可以根据实际需要进行调整。

3. placeholder()：为每个过滤器字段设置占位符文本，帮助用户理解输入内容的要求。

4. datetime()：为时间范围过滤器设置时间选择器，提供日期选择功能。

5. multipleSelect()：提供多选下拉框以供用户选择多个选项。

这些配置和示例可以帮助你在 Dcat Admin 中有效地管理和展示查询过滤功能，使用户能够方便地筛选和查找数据。

 效果