Passo 9: Configurando um Painel Administrativo

5.0 version
Maintained

Configurando um Painel Administrativo

Adicionar as próximas conferências ao banco de dados é tarefa dos administradores do projeto. Um painel administrativo é uma seção protegida do site onde os administradores do projeto podem gerenciar os dados do site, moderar os comentários enviados e muito mais.

Como podemos criar isso rápido? Usando um bundle que é capaz de gerar um painel administrativo baseado no modelo do projeto. O EasyAdmin se encaixa perfeitamente nessa tarefa.

Configurando o EasyAdmin

Primeiro, adicione o EasyAdmin como uma dependência do projeto:

1
$ symfony composer req "admin:^2.0"

Para configurar o EasyAdmin, um novo arquivo de configuração foi gerado por meio da sua receita do Flex:

config/packages/easy_admin.yaml
1
2
3
4
5
6
#easy_admin:
#    entities:
#        # List the entity class name you want to manage
#        - App\Entity\Product
#        - App\Entity\Category
#        - App\Entity\User

Quase todos os pacotes instalados têm uma configuração como esta dentro do diretório config/packages/. Na maioria das vezes, os valores padrão foram escolhidos cuidadosamente para funcionar na maioria das aplicações.

Descomente as primeiras linhas e adicione as classes de modelo do projeto:

config/packages/easy_admin.yaml
1
2
3
4
easy_admin:
    entities:
        - App\Entity\Conference
        - App\Entity\Comment

Acesse o painel administrativo gerado em /admin. Boom! Uma interface de administração agradável e rica em recursos para conferências e comentários:

Dica

Porque o backend está acessível em /admin? Esse é o prefixo padrão configurado em config/routes/easy_admin.yaml:

config/routes/easy_admin.yaml
1
2
3
4
easy_admin_bundle:
    resource: '@EasyAdminBundle/Controller/EasyAdminController.php'
    prefix: /admin
    type: annotation

Você pode mudá-lo para o que preferir.

Adicionar conferências e comentários ainda não é possível, pois você terá um erro: Object of class App\Entity\Conference could not be converted to string. O EasyAdmin tenta exibir a conferência relacionada aos comentários, mas só pode fazê-lo se houver uma string representando a conferência. Corrija-o adicionando um método __toString() na classe Conference:

patch_file
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
--- a/src/Entity/Conference.php
+++ b/src/Entity/Conference.php
@@ -43,6 +43,11 @@ class Conference
         $this->comments = new ArrayCollection();
     }

+    public function __toString(): string
+    {
+        return $this->city.' '.$this->year;
+    }
+
     public function getId(): ?int
     {
         return $this->id;

Faça o mesmo para a classe Comment:

patch_file
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
--- a/src/Entity/Comment.php
+++ b/src/Entity/Comment.php
@@ -48,6 +48,11 @@ class Comment
      */
     private $photoFilename;

+    public function __toString(): string
+    {
+        return (string) $this->getEmail();
+    }
+
     public function getId(): ?int
     {
         return $this->id;

Agora você pode adicionar/modificar/excluir conferências diretamente do painel administrativo. Use-o e adicione pelo menos uma conferência.

Adicione alguns comentários sem fotos. Defina a data manualmente por enquanto; iremos preencher a coluna createdAt automaticamente em um passo posterior.

Personalizando o EasyAdmin

O painel administrativo padrão funciona bem, mas pode ser personalizado de muitas maneiras para melhorar a experiência. Vamos fazer algumas mudanças simples para demonstrar as possibilidades. Substitua a configuração atual pela seguinte:

config/packages/easy_admin.yaml
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
easy_admin:
    site_name: Conference Guestbook

    design:
        menu:
            - { route: 'homepage', label: 'Back to the website', icon: 'home' }
            - { entity: 'Conference', label: 'Conferences', icon: 'map-marker' }
            - { entity: 'Comment', label: 'Comments', icon: 'comments' }

    entities:
        Conference:
            class: App\Entity\Conference

        Comment:
            class: App\Entity\Comment
            list:
                fields:
                    - author
                    - { property: 'email', type: 'email' }
                    - { property: 'createdAt', type: 'datetime' }
                sort: ['createdAt', 'ASC']
                filters: ['conference']
            edit:
                fields:
                    - { property: 'conference' }
                    - { property: 'createdAt', type: datetime, type_options: { attr: { readonly: true } } }
                    - 'author'
                    - { property: 'email', type: 'email' }
                    - text

Nós substituímos a seção design para adicionar ícones aos itens do menu e para adicionar um link de volta para a página inicial do site.

Para a seção Comment, listar os campos nos permite ordená-los da forma que quisermos. Alguns campos foram ajustados, como definir a data de criação para somente-leitura. A seção filters define quais filtros devem ser expostos acima do campo de pesquisa comum.

Estas personalizações são apenas uma pequena introdução às possibilidades oferecidas pelo EasyAdmin.

Brinque com a área de administração, filtre os comentários por conferência ou pesquise comentários por e-mail, por exemplo. O único problema é que qualquer um pode acessar o backend. Não se preocupe, vamos protegê-lo em uma etapa futura.

1
$ symfony run psql -c "TRUNCATE conference RESTART IDENTITY CASCADE"

  • « Previous Passo 8: Descrevendo a Estrutura de Dados
  • Next » Passo 10: Construindo a Interface de Usuário

This work, including the code samples, is licensed under a Creative Commons BY-NC-SA 4.0 license.