การใช้ Nayjest Grids แบบ advance เพื่อที่จะสามารถค้นหา filter ข้อมูล, export ไฟล์ ออกมาในรูปแบบ .csv และ excel ได้
ติดตั้งโดย
- เปิดไฟล์ composer.json เพิ่ม
composer.json 12345...
"laravelcollective/html"
:
"^5"
,
"maatwebsite/excel"
:
"~2.1.0"
,
"nayjest/grids"
:
"^1.3.1"
...
- Command
1
composer update
- เปิดไฟล์ \config\app.php เพิ่ม
configpp.php 12345678910111213141516'providers'
=> [
...
'Collective\Html\HtmlServiceProvider'
,
'Maatwebsite\Excel\ExcelServiceProvider'
,
'Nayjest\Grids\ServiceProvider'
,
...
'aliases'
=> [
...
'Excel'
=>
'Maatwebsite\Excel\Facades\Excel'
,
'Form'
=>
'Collective\Html\FormFacade'
,
'Grids'
=>
'Nayjest\Grids\Grids'
,
'HTML'
=>
'Collective\Html\HtmlFacade'
,
'Input'
=>
'Illuminate\Support\Facades\Input'
,
...
]
สร้าง grid โดย
-
\app\Http\Controllers\UsersController.php 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164<?php
namespace
App\Http\Controllers;
use
App\user;
use
HTML;
use
Nayjest\Grids\Components\Base\RenderableRegistry;
use
Nayjest\Grids\Components\ColumnHeadersRow;
use
Nayjest\Grids\Components\ColumnsHider;
use
Nayjest\Grids\Components\CsvExport;
use
Nayjest\Grids\Components\ExcelExport;
use
Nayjest\Grids\Components\FiltersRow;
use
Nayjest\Grids\Components\Filters\DateRangePicker;
use
Nayjest\Grids\Components\HtmlTag;
use
Nayjest\Grids\Components\Laravel5\Pager;
use
Nayjest\Grids\Components\OneCellRow;
use
Nayjest\Grids\Components\RecordsPerPage;
use
Nayjest\Grids\Components\RenderFunc;
use
Nayjest\Grids\Components\ShowingRecords;
use
Nayjest\Grids\Components\TFoot;
use
Nayjest\Grids\Components\THead;
use
Nayjest\Grids\EloquentDataProvider;
use
Nayjest\Grids\FieldConfig;
use
Nayjest\Grids\FilterConfig;
use
Nayjest\Grids\Grid;
use
Nayjest\Grids\GridConfig;
class
UsersController
extends
Controller
{
public
function
Index()
{
$query
= (
new
User)
->query();
$grid
=
new
Grid(
(
new
GridConfig)
->setDataProvider(
new
EloquentDataProvider(
$query
)
)
->setName(
'UserIndex'
)
/* grid unque id */
->setPageSize(20)
->setColumns([
(
new
FieldConfig)
->addFilter(
(
new
FilterConfig)
->setOperator(FilterConfig::OPERATOR_LIKE)
)
->setLabel(
'ID'
)
->setName(
'id'
)
/* field */
->setSortable(true)
->setSorting(Grid::SORT_DESC)
,
(
new
FieldConfig)
->addFilter(
(
new
FilterConfig)
->setOperator(FilterConfig::OPERATOR_LIKE)
)
->setLabel(
'Name'
)
->setName(
'name'
)
->setSortable(true)
,
(
new
FieldConfig)
->addFilter(
(
new
FilterConfig)
->setOperator(FilterConfig::OPERATOR_LIKE)
)
->setLabel(
'Email'
)
->setName(
'email'
)
->setSortable(true)
,
(
new
FieldConfig)
->addFilter(
(
new
FilterConfig)
->setOperator(FilterConfig::OPERATOR_LIKE)
)
->setLabel(
'Update Information'
)
->setName(
'count_update'
)
->setSortable(true)
,
(
new
FieldConfig)
->setLabel(
'Created'
)
->setName(
'created_at'
)
->setSortable(true)
,
(
new
FieldConfig)
->setLabel(
'Last Update'
)
->setName(
'updated_at'
)
->setSortable(true),
])
->setComponents([
(
new
THead)
->setComponents([
(
new
ColumnHeadersRow),
(
new
FiltersRow)
->addComponents([
(
new
RenderFunc(
function
() {
return
HTML::style(
'js/daterangepicker/daterangepicker-bs3.css'
)
. HTML::script(
'js/moment/moment-with-locales.js'
)
. HTML::script(
'js/daterangepicker/daterangepicker.js'
)
. "<style>
.daterangepicker td.available.active,
.daterangepicker li.active,
.daterangepicker li:hover {
color:black !important;
font-weight: bold;
}
</style>";
}))
->setRenderSection(
'filters_row_column_created_at'
),
(
new
DateRangePicker)
->setName(
'created_at'
)
->setRenderSection(
'filters_row_column_created_at'
)
->setDefaultValue([
'1990-01-01'
,
date
(
'Y-m-d H:i:s'
)]),
(
new
DateRangePicker)
->setName(
'created_at'
)
->setRenderSection(
'filters_row_column_updated_at'
)
->setDefaultValue([
'1990-01-01'
,
date
(
'Y-m-d H:i:s'
)]),
])
,
(
new
OneCellRow)
->setRenderSection(RenderableRegistry::SECTION_END)
->setComponents([
new
RecordsPerPage,
new
ColumnsHider,
(
new
CsvExport)
->setFileName(
'usersExport_'
.
date
(
'Y-m-d'
))
,
(
new
ExcelExport())
->setFileName(
'usersExport_'
.
date
(
'Y-m-d'
))
,
(
new
HtmlTag)
->setContent(
'<span class="glyphicon glyphicon-refresh"></span> Filter'
)
->setTagName(
'button'
)
->setRenderSection(RenderableRegistry::SECTION_END)
->setAttributes([
'class'
=>
'btn btn-success btn-sm'
,
]),
]),
])
,
(
new
TFoot)
->setComponents([
(
new
OneCellRow)
->setComponents([
new
Pager,
(
new
HtmlTag)
->setAttributes([
'class'
=>
'pull-right'
])
->addComponent(
new
ShowingRecords)
,
]),
])
,
])
);
$grid
=
$grid
->render();
return
view(
'users.index'
, [
'grid'
=>
$grid
,
]);
}
}
- สร้าง view \resources\views\users\index.blade.php
\resources\views\users\index.blade.php 1234567891011@
extends
(
'layouts.app'
)
@section(
'title'
,
'Users'
)
@section(
'main-content'
) <a href=
"{{ url('/excels/form') }}"
>
<button
class
=
"btn btn-success btn-sm"
><span
class
=
"glyphicon glyphicon-upload"
></span> Import Datas</button>
</a> @
if
(!
empty
(
$text
))
<div
class
=
"container"
>{!!
$text
!!}</div>
@
endif
<?=
$grid
;?>
@stop
- สร้าง route โดยไปที่ \app\Http\routes.php
\app\Http\routes.php 123...
Route::get(
'/users/index'
,
'UsersController@index'
);
...
ทดลองโดยเรียก /users/index ในเครื่องผมคือ http://localhost/laravel52/public/users/index grid แสดงข้อมูลออกมาแล้วแต่ จะส่งออกเป็นไฟล์ csv หรือ excel ยังไงละ ใจเย็นๆครับ อ่าน สร้าง grid ใน laravel แบบ advance ครับ