README

Symfony3 的 Ajax 网格

示例

使用 Twitter Bootstrap，jQuery Bootstrap Datepicker 以及 Faker 生成假数据。

要求

1. Twitter Bootstrap（非必需）
   • 如果您选择不使用 Twitter Bootstrap，则需要创建自己的样式。
2. jQuery Bootstrap Datepicker（非必需）
   • 如果您选择不使用 Bootstrap Datepicker，请在配置中禁用默认的日期选择器 "use_datepicker"。

安装

1. 在 composer 文件中将它作为依赖项添加

   "require": {
       "pedro-teixeira/grid-bundle":"dev-master"
   }

2. 将其添加到您的 Kernel 中

   // application/ApplicationKernel.php
   public function registerBundles()
   {
       $bundles = array(
           new PedroTeixeira\Bundle\GridBundle\PedroTeixeiraGridBundle()
       );
    }

3. 将其添加到您的资产配置中

   # application/config/config.yml
   assetic:
       bundles: [ PedroTeixeiraGridBundle ]

4. 将资产添加到您的布局中

   {% stylesheets
       '@PedroTeixeiraGridBundle/Resources/public/css/grid.css'
   %}
   <link href="{{ asset_url }}" type="text/css" rel="stylesheet" media="screen" />
   {% endstylesheets %}

   {% javascripts
       '@PedroTeixeiraGridBundle/Resources/public/js/grid.js'
   %}
   <script type="text/javascript" src="{{ asset_url }}"></script>
   {% endjavascripts %}

5. （可选）调整配置

   # application/config/config.yml
   pedro_teixeira_grid:
       defaults:
           date:
               use_datepicker:     true
               date_format:        'dd/MM/yy'
               date_time_format:   'dd/MM/yy HH:mm:ss'
           pagination:
               limit:              20
           export:
               enabled:            true
               path:               '/tmp/'

   配置 "use_datepicker" 将设置输入类型为 "text" 并将 jQuery 插件 "datepicker()"附加到过滤器上。

创建您的网格

1. 创建网格类

   在您的包中创建一个名为 "Grid" 的文件夹（或您想要的任何命名空间）并创建您的网格定义类。

   <?php
   
   namespace PedroTeixeira\Bundle\TestBundle\Grid;
   
   use PedroTeixeira\Bundle\GridBundle\Grid\GridAbstract;
   
   /**
    * Test Grid
    */
   class TestGrid extends GridAbstract
   {
       /**
        * {@inheritdoc}
        */
       public function setupGrid()
       {
           $this->addColumn('Hidden Field')
               ->setField('hidden')
               ->setIndex('r.hidden')
               ->setExportOnly(true);
   
           $this->addColumn('ID')
               ->setField('id')
               ->setIndex('r.id')
               ->getFilter()
                   ->getOperator()
                       ->setComparisonType('equal');
   
           $this->addColumn('Created At')
               ->setField('createdAt')
               ->setIndex('r.createdAt')
               ->setFilterType('date_range')
               ->setRenderType('date');
   
           $this->addColumn('Name')
               ->setField('name')
               ->setIndex('r.name');
   
           $this->addColumn('Number')
               ->setField('number')
               ->setIndex('r.number')
               ->setFilterType('number_range');
   
           $this->addColumn('Options')
               ->setField('option')
               ->setIndex('r.options')
               ->setFilterType('select')
               ->getFilter()
                   ->setOptions(array(
                       'key' => 'value'
                   ));
   
           $this->addColumn('Action')
               ->setTwig('PedroTeixeiraTestBundle:Test:gridAction.html.twig')
               ->setFilterType(false);
       }
   }

2. 在控制器中使用网格工厂

   <?php
   
   namespace PedroTeixeira\Bundle\TestBundle\Controller;
   
   use Symfony\Bundle\FrameworkBundle\Controller\Controller;
   use Symfony\Component\HttpFoundation\Request;
   
   use Sensio\Bundle\FrameworkExtraBundle\Configuration\Route;
   use Sensio\Bundle\FrameworkExtraBundle\Configuration\Template;
   
   use JMS\SecurityExtraBundle\Annotation\Secure;
   
   /**
    * Default controller
    */
   class DefaultController extends Controller
   {
       /**
        * @Route("/", name="test")
         * @Template()
         *
         * @return array
         */
       public function indexAction(Request $request)
       {
           /** @var \Doctrine\ORM\EntityRepository $repository */
           $repository = $this->getDoctrine()->getRepository('PedroTeixeiraTestBundle:TestEntity');
           $queryBuilder = $repository->createQueryBuilder('r');
   
           /** @var \PedroTeixeira\Bundle\TestBundle\Grid\TestGrid $grid */
           $grid = $this->get('pedroteixeira.grid')->createGrid('\PedroTeixeira\Bundle\TestBundle\Grid\TestGrid', $request);
           $grid->setQueryBuilder($queryBuilder);
   
           if ($grid->isResponseAnswer()) {
               return $grid->render();
           }
   
           return array(
               'grid'   => $grid->render()
           );
       }
   }

3. 在模板中渲染

   {{ pedroteixeira_grid(grid) }}

   或者如果您想分别渲染网格的 HTML 和 JS

    {{ pedroteixeira_grid_html(grid) }}
    
    ...
    
    {{ pedroteixeira_grid_js(grid) }}

理解

• 网格
• 列
  • 渲染
  • 过滤器

持续集成

在本地执行 Travis 上执行的检查

composer install
find ./Grid ./DependencyInjection ./Twig -name "*.php" -exec php -l {} \;
./bin/phpcs --extensions=php --standard=PSR2 ./Grid ./DependencyInjection ./Twig