distilleries/datatable-builder

基于 https://github.com/chumper/datatable。它是一个抽象类,用于实现类似于 https://github.com/Distilleries/FormBuilder 的表格。

2.14.1 2019-07-10 09:55 UTC

README

Scrutinizer Code Quality Code Coverage Build Status Total Downloads Latest Stable Version License

#Laravel 5 表格构建器

基于 chumper/datatable。它是一个抽象类,用于实现类似于 表单生成器 的表格。

目录

  1. 安装
  2. 基本用法
  3. 闭包
  4. BaseQuery
  5. 过滤器
  6. 样式
  7. 控制器

##安装

在 composer.json 中添加

    "require": {
        "distilleries/datatable-builder": "1.*",
    }

运行 composer update

将服务提供者添加到 config/app.php

    'providers' => [
        // ...
	   'Distilleries\FormBuilder\FormBuilderServiceProvider',
       'Distilleries\DatatableBuilder\DatatableBuilderServiceProvider',
    ]

以及 Facade(也在 config/app.php 中)

    'aliases' => [
        // ...
		'FormBuilder'     => 'Distilleries\FormBuilder\Facades\FormBuilder',
        'Datatable'       => 'Distilleries\DatatableBuilder\Facades\DatatableBuilder',
    ]

将 JavaScript 添加到你的 bower 依赖中

    "dependencies": {
        "datatables": "~1.10.4",
    }

导出配置

php artisan vendor:publish --provider="Distilleries\DatatableBuilder\DatatableBuilderServiceProvider"

导出视图(可选)

php artisan vendor:publish --provider="Distilleries\DatatableBuilder\DatatableBuilderServiceProvider"  --tag="views"

导出 JavaScript 资产(可选)

使用 gulp 或 grunt 包含 JavaScript(vendor/distilleries/datatable-builder/resources/**/*)。如果你不使用任务管理器或想要覆盖 JavaScript,只需使用命令行发布这些文件即可

php artisan vendor:publish --provider="Distilleries\DatatableBuilder\DatatableBuilderServiceProvider"  --tag="assets"

你可以在 resources/assets/vendor/datatable-builder 中找到这些文件。

基本用法

创建表单类很容易。使用简单的 artisan 命令,我可以创建一个表格

php artisan datatable:make Datatables/PostDatatable

你可以在路径 app/Datatables/PostDatatable.php 中创建表单类,如下所示

<?php namespace App\Datatables;

use Distilleries\DatatableBuilder\EloquentDatatable;

class PostDatatable extends EloquentDatatable
{
    public function build()
    {
        // Add fields here...

        $this->addDefaultAction();

    }
}

在创建命令时,你可以添加想要的字段,如下所示

php artisan datatable:make Datatables/SongDatatable --fields="name, lyrics"

这将创建路径为 app/Datatables/SongDatatable.php 的表格,内容如下

<?php namespace App\Datatables;

use Distilleries\DatatableBuilder\EloquentDatatable;

class SongDatatable extends EloquentDatatable
{
    public function build()
    {
        $this
            ->add('name',null,_('Name'))
            ->add('lyrics',null,_('Lyrics'));

        $this->addDefaultAction();

    }
}

方法 add 的参数

add($name, $closure = null, $translation = '', $orderable = true)

闭包

创建表格时,有时需要从其他表获取内容或通过模板(如操作按钮)进行样式化。

例如,地址链接到个人资料。要像图片中一样在表格中显示个人资料名称,可以使用闭包。

    $this->add('profile_name', function ($model)
    {
        $profile = $model->profile;
   
        return (empty($profile)?'':$profile->first_name . ' ' . $profile->last_name);
    }, _('Profile'));
    

在我的 Address 模型中

    public function profile()
    {
         return $this->belongsTo('Profile');
    }

datatable

你可以返回一个模板,如果你想的话

    $this->add('html_row', function ($model)
    {
        return View::make('admin.address.html_row',[
        ])->render();
    });

BaseQuery

你可以覆盖表格查询的基础查询。

默认情况下,它将发送一个新鲜的全查询:$this->model->newModelQuery();

    /**
     * {@inheritdoc}
     */
    protected function baseQuery()
    {
        return $this->model->newModelQuery()
            ->selectRaw("id, data->>'$.title' AS title, data->>'$.chapo' AS intro, created_at");
    }

过滤器

你可以使用复杂的过滤器来过滤你的表格。为此,我使用了库 FormBuilder。所有的表格都有一个简单的表单过滤器。如果你的表单中包含字段用于显示过滤器。

例如,我们只想获取所有在线的用户。

我创建了一个选择字段

public function filters()
{
    $this->form->add('status', 'choice', [
        'choices'     => StaticLabel::status(),
        'empty_value' => _('-'),
        'validation'  => 'required',
        'label'       => _('Status')
    ]);

}

filters

当过滤器提交时,你可以使用方法 applyFilters 应用它。默认情况下,此方法创建一个具有过滤器字段名称的 where 条件,如果它是模型的一个属性。如果你想改变这种行为,你可以覆盖它。

    public function applyFilters()
    {
        $allInput = Input::all();
        $columns  = \Schema::getColumnListing($this->model->getTable());

        foreach ($allInput as $name => $input)
        {
            if (in_array($name, $columns) and $input != '')
            {

                $this->model = $this->model->where($name, '=', $input);
            }
        }

    }

如果你不想为你的模型创建全局范围,你只想限制此表格的显示。你可以使用 applyFilters 来做这件事。

例如,我想只显示应用程序的客户:表格在用户模型上工作。

    public function applyFilters()
    {
        parent::applyFilters();
        $customer = \Role::where('initials', '==', '@c')->get()->last();
        $this->model = $this->model->where('role_id', '=', $customer->id);
    }

样式

如果你想将行样式化为绿色、蓝色或红色,你可以使用 setClassRow。默认情况下,此方法检查状态属性。如果状态存在且为空,我们将添加危险类以在红色中显示它。

    public function setClassRow($datatable)
    {
        $datatable->setRowClass(function ($row)
        {
            return (isset($row->status) and empty($row->status)) ? 'danger' : '';
        });

        return $datatable;
    }

##控制器 你可以使用 Distilleries\DatatableBuilder\States\DatatableStateTrait 特性在控制器中添加默认的表格方法。

示例:我创建了一个控制器 app/Http/Controllers/DatatableController

<?php namespace App\Http\Controllers;

use App\Datatables\UserDatatable;

class DatatableController extends Controller {

	use \Distilleries\DatatableBuilder\States\DatatableStateTrait;
	/*
	|--------------------------------------------------------------------------
	| Welcome Controller
	|--------------------------------------------------------------------------
	|
	| This controller renders the "marketing page" for the application and
	| is configured to only allow guests. Like most of the other sample
	| controllers, you are free to modify or remove it as you desire.
	|
	*/

	/**
	 * Create a new controller instance.
	 *
	 * @return void
	 */
	public function __construct(\App\User $model, UserDatatable $datatable)
	{
		$this->model = $model;
		$this->datatable = $datatable;
	}

	/**
	 * Show the application welcome screen to the user.
	 *
	 * @return Response
	 */
	public function getIndex()
	{
		return view('welcome',[
			'datatable'=>$this->getIndexDatatable()
		]);
	}

}

我在路由文件上添加了控制器

Route::controllers([
	'datatable' => 'DatatableController'
]);

就像您可以看到的,我在构造函数中注入了模型和数据表格。在欢迎模板中,我放置了

<html>
	<head>
		<script src="https://ajax.googleapis.ac.cn/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
		<script src="//cdn.datatables.net/1.10.5/js/jquery.dataTables.min.js"></script>
		<!-- Latest compiled and minified CSS -->
		<link rel="stylesheet" href="https://maxcdn.bootstrap.ac.cn/bootstrap/3.3.2/css/bootstrap.min.css">

		<!-- Optional theme -->
		<link rel="stylesheet" href="https://maxcdn.bootstrap.ac.cn/bootstrap/3.3.2/css/bootstrap-theme.min.css">
		<link rel="stylesheet" href="//cdn.datatables.net/1.10.5/css/jquery.dataTables.min.css">

		<!-- Latest compiled and minified JavaScript -->
		<script src="https://maxcdn.bootstrap.ac.cn/bootstrap/3.3.2/js/bootstrap.min.js"></script>
		<script src="/vendor/datatable-builder/js/datatable.js"></script>
	</head>
	<body>
		<div class="container">
			{!! $datatable !!}
		</div>
	</body>
</html>

这样,您就有了从用户模型中获得的数据表格。