warslett / table-builder-bundle
一个用于将Warslett/TableBuilder集成到您的symfony应用的symfony包。表格构建、表格抽象和表格渲染。
0.3.0
2022-04-18 14:55 UTC
Requires
- symfony/config: ^5.1|^6.0
- symfony/dependency-injection: ^5.1|^6.0
- symfony/http-kernel: ^5.1|^6.0
- warslett/table-builder: ^0
This package is auto-updated.
Last update: 2024-09-18 20:38:53 UTC
README
warslett/table-builder:
warslett/table-builder-bundle:
Table builder bundle提供了与warslett/table-builder包和symfony框架的集成。此包将在Symfony中注册所需的服务和扩展,以便您可以在symfony项目中以最少的设置使用table-builder包。
安装
composer require warslett/table-builder-bundle warslett/table-builder
文档
完整的文档可在此处找到。
配置
将此包添加到您的config/bundles.php数组中(如果您使用symfony flex,这将为您自动完成)
<?php // config/bundles.php return [ ... WArslett\TableBuilderBundle\TableBuilderBundle::class => ['all' => true], ];
使用
将TableBuilderFactoryInterface服务注入到您的控制器中,以使用适配器构建表格并加载数据
<?php // src/Action/RetrieveUsers.php namespace App\Action; use App\Entity\User; use Doctrine\ORM\EntityManagerInterface; use Symfony\Component\HttpFoundation\Request; use Symfony\Component\HttpFoundation\Response; use Twig; use WArslett\TableBuilder\Column\TextColumn; use WArslett\TableBuilder\DataAdapter\DoctrineOrmAdapter; use WArslett\TableBuilder\TableBuilderFactoryInterface; class RetrieveUsers { private TableBuilderFactoryInterface $tableBuilderFactory; private EntityManagerInterface $entityManager; private Twig\Environment $twigEnvironment; public function __construct( TableBuilderFactoryInterface $tableBuilderFactory, EntityManagerInterface $entityManager, Twig\Environment $twigEnvironment ) { $this->tableBuilderFactory = $tableBuilderFactory; $this->entityManager = $entityManager; $this->twigEnvironment = $twigEnvironment; } public function __invoke(Request $request): Response { $table = $this->tableBuilderFactory->createTableBuilder() ->rowsPerPageOptions([10, 20, 50]) ->defaultRowsPerPage(10) ->add(TextColumn::withProperty('email')->sortable()) ->add(DateTimeColumn::withProperty('last_login') ->format('g:ia jS M Y') ->sortable()) ->add(ActionGroupColumn::withName('actions') ->add(ActionBuilder::withName('update') ->route('user_update', ['id' => 'id'])) // map 'id' parameter to property path 'id' ->add(ActionBuilder::withName('delete') ->route('user_delete', ['id' => 'id']) ->attribute('extra_classes', ['btn-danger']))) ->buildTable('users') ->setDataAdapter(DoctrineOrmAdapter::withQueryBuilder($this->entityManager->createQueryBuilder() ->select('u') ->from(User::class, 'u')) ->mapSortToggle('email', 'u.email') ->mapSortToggle('last_login', 'u.lastLogin')) ->handleSymfonyRequest($request) ; return new Response($this->twigEnvironment->render('table_page.html.twig', [ 'users_table' => $table ])); } }
然后在您的模板中,您可以像这样渲染表格
{# templates/table_page.html.twig #} {# the table twig function takes the table object as a parameter #} {{ table(users_table) }}
这将渲染您的表格,并具有内置的分页和排序功能。
您可以在同一页面上渲染两个表格,它们将独立排序和分页。
配置
# config/packages/table_builder.yaml table_builder: twig_renderer: # you can change the default twig theme here theme_template: 'table-builder/bootstrap4.html.twig' # add custom column value template from a twig template file cell_value_templates: App\TableBuilder\Column\MyCustomColumn: 'my_custom_cell_value_template.html.twig' # add a custom column value template from a block in your theme cell_value_blocks: App\TableBuilder\Column\MyCustomColumn: 'my_custom_cell_value_block' phtml_renderer: # you can change the default phtml theme directory here theme_directory: '%kernel.project_dir%/templates/table-builder' # add custom column value template from a twig template file cell_value_templates: App\TableBuilder\Column\MyCustomColumn: '%kernel.project_dir%/templates/table-builder/my_custom_cell_value_template.phtml'
您还可以使用服务标签注册用于Csv渲染器的单元格值转换器
services: App\TableBuilder\Csv\MyCustomColumnAdapter: tags: - { name: 'table_builder.csv_cell_value_transformer', rendering_type: App\TableBuilder\Column\MyCustomColumn }
主题化
在twig中创建您自己的表格主题
{# templates/my_table_theme.html.twig #} {% extends 'table-builder/bootstrap.4.html.twig' %} {# extend a default theme and just override the blocks you want #} {% block table_element %} <table class="table table-dark"> {# Change the default bootstrap4 theme to use table-dark #} <thead> <tr> {% for heading in table.headings %} {{ table_heading(table, heading) }} {% endfor %} </tr> </thead> <tbody> {% for row in table.rows %} {{ table_row(table, row) }} {% endfor %} </tbody> </table> {% endblock %}
然后只需更新config中的theme_template值为您的新主题模板
文档
完整的文档将在核心存储库的repo中提供https://github.com/warslett/table-builder/blob/master/README.md