Page tree
Skip to end of metadata
Go to start of metadata

Neste passo vamos gerar páginas CRUDs (Create, Read, Update e Delete), onde é possível realizar as quatro operações básicas que o sistema faz no banco de dados. As páginas CRUD são comuns em aplicações web, porque fornece um modelo completo e simples para manipular os dados.

Essa página é parte de um tutorial, veja mais detalhes sobre o conteúdo abordado aqui em Criar projeto.

Visão Geral

Ao gerar um CRUD, uma página é criada contendo os dados da entidade selecionada em uma grade e um formulário para inserir / editar itens; tanto a grade quanto o formulário podem ser personalizados. Como podemos ver na Figura 1.1, essa página vem por padrão com: nome da entidade; campo de busca de itens; botão + ADICIONAR, que abre um formulário vazio; grade com colunas representando alguns atributos dessa entidade e a coluna de ação, que possui os botões de edição e exclusão de item.


Figura 1.1 - CRUD do Cronapp

Etapas

Assistente de View para o Diagrama (Figura 1.2) fica no Diagrama de dados. Ao abrir, devemos seguir algumas poucas etapas de configuração para selecionar as entidades que irão gerar o CRUD e adequar cada página as necessidades do seu projeto. Abaixo as etapas necessárias:

  1. Define o modelo e o endereço onde será criado;

  2. Seleção das entidades;

  3. Configuração de cada entidade:

    1. Seleciona as colunas da grade e

    2. Seleciona os campos do formulário, para a criação ou edição dos itens.

Etapa 1: Template

Para iniciar a funcionalidade Assistente de CRUD para Diagrama, basta clicar no seu botão, destaque 1 da figura 2.1. 

Na área Modelo da primeira tela é possível selecionar o tipo de páginas: CRUD ou formulários de pesquisa, que apenas exibe o conteúdo sem permitir edição. No campo Formulário de Referência deve ser informado a pasta onde será gerado o conteúdo dentro do projeto.


Figura 2.1 - Assistente de view para Diagrama


  1. Assistente de view para o diagrama: abre a janela de configuração.

  2. Lista de seleção dos modelos: permite gerar páginas CRUD ou só de exibição de conteúdo (Pesquisa) para aplicações web ou mobile.

  3. Formulário de Referência: endereço onde serão criados os CRUD, clique no botão "" para abrir a janela de seleção.

  4. Lista de seleção dos diretórios;

  5. Avançar: avança para seleção de entidades.

Etapa 2: Selecionar entidades

Nessa etapa podemos selecionar e personalizar as entidades para gerar os CRUDs. Ao clicar no destaque 2 da figura 2.2, será aberta a janela de personalização da entidade selecionada (etapa 2.1).


Figura 2.2 - Seleção das entidades que irão gerar CRUDs


  1. Lista de entidades: seleção das entidades;

  2. "…": abre a janela de customização da grade e do formulário do CRUD dessa entidade, etapa 3;

  3. Finalizar: conclui o Assistente de view para o diagrama e gera as páginas.

Etapa 3: Personalizar grade e formulário

As janelas da figura 2.3 serão exibidas ao clicar no botão "..." de uma entidade (destaque 2 da figura 2.2). Na primeira janela configuraremos os itens que serão exibidos na listagem da grade, enquanto a segunda janela selecionamos os campos que poderão ser inseridos ou editados no formulário do CRUD.


Figura 2.3 - primeiro selecionamos as colunas da grade e após avançar, os campos do formulário.


  1. Atributos da grade: seleciona os atributos que serão exibidos na grade do CRUD.

  2. ↑↓: ordena as colunas da grade,

  3. Avançar: avança para a janela de configuração dos campos do formulário.

  4. Atributos do formulário: seleciona os atributos no formulário de adição ou edição da entidade.

  5. ↑↓: ordena os campos do formulário;

  6. Campos para relacionamentos N para M*: permite selecionar a entidade de relacionamento ou criar uma entidade relacionada.

  7. Finalizar: retorna à janela de seleção de entidades (Figura 2.2).


*Relacionamento com outras entidades: quando uma entidade se relaciona com outra, é possível exibi-la no formulário das seguintes formas:

  • 1toN: exibe uma caixa de seleção com o atributo da segunda entidade;
  • NtoM: exibe os atributos em forma de lista (caixa de seleção) ou grade. Quando usamos Lista, só podemos selecionar e vincular uma entidade já criada, porém quando usamos Grade, é possível criar a segunda entidade e já fazer o relacionamento entre as duas.

Conflito

Se já existir uma página com mesmo nome após finalizar o Formulário CRUD view (destaque 3 da figura 2.2), o Cronapp abrirá uma janela exibindo as páginas que possuem conflito por alterações.


Figura 2.4 - Conflito ao gerar página já existente

CRUD para uma única classe

As três etapas mostradas acima facilitam a criação de CRUDs para várias classes ao mesmo tempo, porém podemos selecionar apenas uma classe. A vantagem de gerar para apenas uma classe está na opção de informar o nome da página através do campo Escolha o nome do novo arquivo na etapa 1 e ao avançar, passaremos direto para a etapa 3, já que não existem classes para serem selecionadas. (Figura 2.5)


Figura 2.5 - Gerando CRUD somente para a classe Livro



Passos

Em nosso projeto de reserva de livros possuímos dois sistemas: web e mobile, por isso teremos que utilizar o Assistente de CRUD três vezes.

  1. Sistema web para os administradores, páginas Reserva e Livro.
  2. Sistema web para os alunos, página Reserva.
  3. Sistema mobile para os alunos, Tela Reserva.

Abra a funcionalidade Diagrama de dados (lembre-se onde abrir em Diagrama de dados) para seguir os passos abaixo.

Sistema web para Administrador

Siga os passos abaixo para criar as páginas onde os bibliotecários cadastrarão os livros e poderão realizar a reserva para os usuário.

Modelo e diretório


Figura 3.1 - seleção do modelo e local das páginas CRUD


  1. Clique no botão Assistente de View para o diagrama (destaque 1 da figura 3.1).
  2. Selecione o modelo Formulário CRUD web.
  3. Clique no botão "..." do campo Formulário de Referência para abrir a janela de seleção do diretório.
  4. Selecione a pasta admin (src/main/webapp/views/admin) e clique no botão Selecionar.
  5. De volta a janela de seleção de modelos, clique em Avançar.

Entidades

Marque apenas as entidades Livro e Reserva. (Figura 3.2)


Figura 3.2 - Seleção das entidades

Grade e formulário

Vamos iniciar a configuração dos campos da entidade Livro.


Figura 3.3 - Campos da grade e formulário da entidade Livro


  1. Clique no botão "…" (Customizar) da entidade Livro
  2. Selecione apenas os atributos nome, autor e isbn.
  3. Clique em Avançar.
  4. Marque apenas os atributos nomeautor e isbn.
  5. Clique em Finalizar para retornar a janela de seleção de entidades.


Agora configuraremos os campos da entidade Reserva.


Figura 3.4 - Campos da grade e formulário da entidade Reserva


  1. Clique no botão "…" (Customizar) da entidade Reserva
  2. Selecione apenas os atributos user, livro, datareserva, dataemprestimo na janela de configuração da grade.
  3. Clique em Avançar.
  4. Marque apenas os atributos user, livro, datareserva, dataemprestimo na janela de configuração do formulário.
  5. Clique em Finalizar para retornar a janela de seleção de entidades.


Na janela de seleção de entidades (Figura 3.2), clique em Finalizar. A mensagem "Arquivo(s) gerado(s) com sucesso!" deve aparecer.

Sistema web para Aluno

Os alunos só precisarão da tela de reservas.

Modelo e diretório


Figura 4.1 -  Seleção do modelo e local das páginas CRUD


  1. Acesse o menu de contexto da classe Reserva e selecione a opção Criar visão para a entidade (destaque 1 da figura 4.1) para abrir a janela do Assistente.
  2. Selecione o modelo Formulário CRUD web.
  3. Clique no botão "..." do campo Formulário de Referência para abrir a janela de seleção do diretório.
  4. Selecione a pasta Logged (src/main/webapp/views/logged) e clique no botão Selecionar.
  5. De volta a janela de seleção de modelos, informe "minhasReservas" no campo Escolha o nome do novo arquivo.
  6. Clique em Avançar.

Grade e formulário

Vamos iniciar a configuração dos campos da entidade Reserva.


Figura 4.2 - Campos da grade e formulário web da entidade Reserva para o aluno


  1. Selecione apenas os atributos livro e datareserva na janela de configuração da grade.
  2. Clique em Avançar.
  3. Marque apenas o atributo livro na janela de configuração do formulário.
  4. Clique em Finalizar.

A mensagem Arquivo(s) gerado(s) com sucesso! deve aparecer.

Sistema mobile para Alunos

Da mesma forma como fizemos para o sistema web, gerando uma página de reserva para os alunos, iremos gerar a tela de reserva para os alunos no mobile.

Modelo e diretório


Figura 5.1 -  Seleção do modelo e local das páginas CRUD


  1. Acesse o menu de contexto da classe Reserva e selecione a opção Criar visão para a entidade (destaque 1 da figura 5.1) para abrir a janela do Assistente.
  2. Selecione o modelo Formulário CRUD Mobile.
  3. Clique no botão "..." do campo Formulário de Referência para abrir a janela de seleção do diretório.
  4. Selecione a pasta Logged (src/main/mobileapp/www/views/logged) e clique no botão Selecionar.
  5. De volta a janela de seleção de modelos, informe "minhasReservas" no campo Escolha o nome do novo arquivo.
  6. Clique em Avançar.

Grade e formulário

Vamos iniciar a configuração dos campos da entidade Reserva.


Figura 5.2 - Campos da grade e formulário web da entidade Reserva para o aluno


  1. Selecione apenas os atributos livro e datareserva na janela de configuração da lista avançada.
  2. Clique em Avançar.
  3. Marque apenas o atributo livro na janela de configuração do formulário.
  4. Clique em Finalizar.

A mensagem "Arquivo(s) gerado(s) com sucesso!" deve aparecer.

O que fizemos

Geramos 4 páginas a partir das classes do diagrama de dados: 2 páginas web na pasta administrador (admin), 1 página web na pasta autenticado (logged) e 1 tela mobile na pasta logado (logged).


Figura 6.1 - Páginas geradas para o projeto web


  • No labels