warslett/table-builder-bundle

一个用于将Warslett/TableBuilder集成到您的symfony应用的symfony包。表格构建、表格抽象和表格渲染。

安装数: 2,369

依赖者: 0

建议者: 0

安全: 0

星星: 1

关注者: 2

分支: 1

开放问题: 1

类型:symfony-bundle

0.3.0 2022-04-18 14:55 UTC

This package is auto-updated.

Last update: 2024-09-18 20:38:53 UTC


README

warslett/table-builder:

Latest Stable Version Build Status codecov Mutation testing badge Psalm coverage Total Downloads Latest Unstable Version License: MIT

warslett/table-builder-bundle:

Latest Stable Version Total Downloads Latest Unstable Version License: MIT

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) }}

这将渲染您的表格,并具有内置的分页和排序功能。

rendered 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