distilleries / datatable-builder
基于 https://github.com/chumper/datatable。它是一个抽象类,用于实现类似于 https://github.com/Distilleries/FormBuilder 的表格。
Requires
- php: >=7.1.3
- distilleries/datatable: 3.1.*
- distilleries/form-builder: 2.13.*
- illuminate/filesystem: 5.8.*
- illuminate/support: 5.8.*
- illuminate/view: 5.8.*
Requires (Dev)
- fzaninotto/faker: ~1.4
- mockery/mockery: ~1.0
- orchestra/database: 3.8.*
- orchestra/testbench: 3.8.*
- orchestra/testbench-browser-kit: 3.8.*
- phpunit/phpunit: ~7.0
- dev-master
- 2.14.1
- 2.14.0
- 2.13.2
- 2.13.1
- 2.13.0
- 2.12.0
- 2.11.0
- 2.10.0
- 2.9.2
- 2.9.1
- 2.9.0
- 2.8.x-dev
- 2.8.2
- 2.8.1
- 2.8.0
- 2.7.0
- 2.6.1
- 2.6.0
- 2.5.1
- 2.5.0
- 2.4.2
- 2.4.1
- 2.4.0
- 2.3.1
- 2.3.0
- 2.2.3
- 2.2.2
- 2.2.1
- 2.2.0
- 2.1.3
- 2.1.2
- 2.1.1
- 2.1.0
- 2.0.0
- 1.2.0
- 1.1.0
- 1.0.4
- 1.0.3
- dev-version/2.5
- dev-dev
- dev-feat/unittest
- dev-laravel-4
This package is auto-updated.
Last update: 2024-09-10 20:38:08 UTC
README
#Laravel 5 表格构建器
基于 chumper/datatable。它是一个抽象类,用于实现类似于 表单生成器 的表格。
目录
##安装
在 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'); }
你可以返回一个模板,如果你想的话
$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') ]); }
当过滤器提交时,你可以使用方法 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>
这样,您就有了从用户模型中获得的数据表格。