livecms/datatables

Live CMS Datatables

v0.1.1 2018-09-04 20:00 UTC

This package is not auto-updated.

Last update: 2024-09-15 05:49:49 UTC


README

这是什么?

此包可以处理 Javascript DataTables。

功能

  • 包含一些改进的完整的 Yajra DataTables 功能。请参阅 文档

注意

如何使用?

通过 composer 安装

composer require livecms/datatables

发布配置文件

php artisan vendor:publish --provider="LiveCMS\DataTables\DataTablesServiceProvider"

编辑 'datatables.php' 配置文件。

DataTables 类

定义 : DataTables(LiveCMS\DataTables\HasDataTables $object, $url, array $fields = null)

定义基础查询

您可以创建一个新的类或使用现有的类。您需要做的是实现接口 LiveCMS\DataTables\HasDataTables 并创建一个方法:toDataTablesQuery()。此方法必须返回 Laravel 查询构建器、关系、集合或 API 资源集合。

use App\Http\Resources\SportResource;
use App\Sport;
use LiveCMS\DataTables\HasDataTables;

class SportDataTables implements HasDataTables
{
    public function toDataTablesQuery()
    {
        // use one of these types
        return app(Sport::class)->newQuery(); // Builder
        return app(Sport::class)->players(); // Relation
        return Sport::get(); // Collection
        return SportResource::collection(Sport::get()); // API Resource Collection
    }
}

定义字段

通过数组定义字段。例如:您有字段:id, name, is_active, action,其中 id, nameis_active 在您的模型数据中,而 action 字段是一个包含操作按钮(如 编辑和删除 按钮)的自定义字段。

然后您的字段将如下所示,以下是对其的解释

$fields = [
    'ID',
    'Sport Name' => 'name',
    'Is Active' => [
        'display' => function ($isActive) {
            return new \Illuminate\Support\HtmlString(
                $isActive ? '<strong>True</strong>' : '<strong>False</strong>';
            );
        }
    ],
    'Action' => function ($row) {
        return new \Illuminate\Support\HtmlString(
            '<button data-id="'.$row->id.'">Edit</button><button data-id="'.$row->id.'">Delete</button>';
        );
    }
];

您可以将字段放置在实现 HasDataTables 接口的类中的 getDataTablesFields() 方法中,例如。

use Illuminate\Support\HtmlString;
use LiveCMS\DataTables\HasDataTables;

class SportDataTables implements HasDataTables
{
    ....

    public function getDataTablesFields()
    {
        return [
            'ID',
            'Sport Name' => 'name',
            'Is Active' => [
                'display' => function ($isActive) {
                    return new HtmlString(
                        $isActive ? '<strong>True</strong>' : '<strong>False</strong>';
                    );
                }
            ],
            'Action' => function ($row) {
                return new HtmlString(
                    '<button data-id="'.$row->id.'">Edit</button><button data-id="'.$row->id.'">Delete</button>';
                );
            }
        ];
    }
}

或在调用 DataTables 类时的第三个参数中。请参阅 定义

字段定义说明

数组中的每个单独的字段将自动转换为以下默认形式

  1. 字段存在于数据库中
    'Label' => [
        'name' => 'label', // field name or will use lower case of label if not defined
        'data' => 'label', // data name or will use lower case of label if not defined
        'orderable' => true, // if this field is not orderable, set false,
        'searchable' => true, // if this field is not searchable, set false
        'display' => function ($value) {
            return new \Illuminate\Support\HtmlString('<span class="rounded">value</span>');
        ,
        // if you want to mark up the value, use display.
        
    ],
  1. 字段不存在于数据库中或自定义字段
    'Label' => function ($row) {
        return 'anything';
    },

注意:不要忘记使用类 \Illuminate\Support\HtmlString 来取消对 HTML 代码的转义

让我们开始吧

控制器

use LiveCMS\DataTables\DataTables;

class SportController extends Controller
{
    protected $dataTables;

    public function __construct(SportDataTables $sportDataTables)
    {
        $dataTablesUrl = url('/admin/sport/data'); // route('routename')
        $this->dataTables = new DataTables($sportDataTables, $dataTablesUrl);
    }

    public function getIndex()
    {
        $this->dataTables->renderView();
        return view('admin.sports.index');
    }

    public function postData(Request $request)
    {
        return $this->dataTables->renderData();
    }

}

视图:文件:admin/sports/index.blade.php

    <table id="datatables" class="table table-striped table-no-bordered table-hover" cellspacing="0" width="100%" style="width:100%">
        <thead>
            <tr>
                @foreach ($dataTablesCaptions as $field)
                <th @if (strtolower($field) == 'action') class="text-right" @endif>{{ $field }}</th>
                @endforeach
            </tr>
        </thead>
        <tbody>
        </tbody>
    </table>

    <script type="text/javascript">
        $(document).ready(function() {
            $('#datatables').DataTable({!! $dataTablesView !!});
        });
    </script>

许可

MIT

贡献

将该存储库分叉并提交拉取请求

问题和讨论

请创建新的问题或查看已关闭的问题。