Tag Archive index

การใช้ Nayjest Grids แบบ advance เพื่อที่จะสามารถค้นหา filter ข้อมูล, export ไฟล์ ออกมาในรูปแบบ .csv และ excel ได้

ติดตั้งโดย

1. เปิดไฟล์ composer.json เพิ่ม[code language=”php” title=”composer.json”]
   …
   "laravelcollective/html": "^5",
   "maatwebsite/excel": "~2.1.0",
   "nayjest/grids": "^1.3.1"
   …
   [/code]
2. Command[code language=”text”]composer update[/code]
3. เปิดไฟล์ \config\app.php เพิ่ม [code language=”php” title=”configpp.php”]
   ‘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’,
   …
   ][/code]

สร้าง grid โดย

1. [code language=”php” title=”\app\Http\Controllers\UsersController.php”]
   <?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,
   ]);
   }

   }
   [/code]

2. สร้าง view \resources\views\users\index.blade.php[code language=”php” title=”\resources\views\users\index.blade.php”]@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[/code]

3. สร้าง route โดยไปที่ \app\Http\routes.php[code language=”php” title=”\app\Http\routes.php”]
   …
   Route::get(‘/users/index’, ‘[email protected]’);
   …[/code]

ทดลองโดยเรียก /users/index ในเครื่องผมคือ http://localhost/laravel52/public/users/index grid แสดงข้อมูลออกมาแล้วแต่ จะส่งออกเป็นไฟล์ csv หรือ excel ยังไงละ ใจเย็นๆครับ อ่าน สร้าง grid ใน laravel แบบ advance ครับ