Skip to main content

Construção de visualizações no Constellation para BAs

6 Tarefas

40 min

 Visível para: All users Applies to: Pega Platform '25
Beginner
Integração de dados
Português Brasileiro

Scenario

Para que os usuários interajam com o aplicativo GoGoRoad, é necessário criar uma interface de usuário (IU). Destacando as vantagens do Constellation durante o desenvolvimento e a manutenção do aplicativo, você, como BA da Pega, defendeu a construção da interface do usuário do aplicativo GoGoRoad usando a arquitetura Constellation. 

Histórias de usuários

Como agente de atendimento ao cliente (CSR) da GoGoRoad, quero selecionar o tipo de serviço solicitado em uma lista dropdown e identificar rapidamente o problema, transmitindo essas informações ao provedor de serviços.

Como agente de atendimento ao cliente da GoGoRoad, quero selecionar o cliente que está fazendo a solicitação de assistência em uma lista dropdown de clientes, acessando rapidamente todas as informações armazenadas sobre o cliente.

Como agente de atendimento ao cliente da GoGoRoad, quero inserir o endereço associado à solicitação de serviço e enviar o prestador de serviço ao local correto. 

Como agente de atendimento ao cliente da GoGoRoad, quero inserir as informações associadas ao veículo que precisa de assistência e transmitir essas informações ao prestador de serviços.

Como agente de atendimento ao cliente da GoGoRoad, quero inserir as informações associadas à forma de pagamento do cliente para que a GoGoRoad e o prestador de serviços sejam pagos pelos serviços prestados.

Como agente de atendimento ao cliente da GoGoRoad, quero selecionar os serviços prestados para a instância de Assistance Request, faturando o cliente corretamente.

Notas técnicas documentadas pelo System Architect

  • A visualização Identify issue contém um novo campo chamado Service type do Picklist Field Type. O campo Service type é obrigatório.
  • A visualização Identify customer contém um dropdown que faz referência ao relacionamento de dados do Customer (AR).
  • A visualização Identify location contém o relacionamento de dados incorporados do Service address (AR).
  • A visualização Identify vehicle contém um novo campo chamado Vehicle information (AR), que faz referência ao objeto de dados Vehicle information como um relacionamento de dados incorporados de registro único.
  • A visualização Enter payment information contém um novo campo chamado Payment information (AR) que faz referência ao objeto de dados Payment information como um relacionamento de dados incorporados de registro único.
  • A visualização Select services performed contém um relacionamento de dados de Selected services (AR) que faz referência ao objeto de dados Selected service como um relacionamento de dados incorporados de vários registros.
  • A visualização Select services performed contém um campo calculado criado anteriormente, chamado Total of services, que é uma soma de todos os serviços selecionados na visualização.

A tabela a seguir apresenta as credenciais necessárias para você concluir o desafio:

Função Nome de usuário Senha
Business Architect author@gogoroad pega123!
Nota: Este desafio não tem um vídeo de demonstração. Consulte as tarefas detalhadas para ver instruções passo a passo de como concluir o desafio.

Você deve iniciar sua própria instância da Pega para concluir este Challenge.

A inicialização pode leva até cinco minutos, portanto tenha paciência.

Detailed Tasks

1 Configurar a visualização Identificar problema

  1. Na instância da Pega para o desafio, insira as seguintes credenciais:
    1. No campo User name, insira author@gogoroad.
    2. No campo Password, insira pega123!.
  2. No painel de navegação do App Studio, clique em Case Types > Assistance Request para abrir o tipo de caso Solicitação de assistência (Assistance Request).
  3. No ciclo de vida do caso Assistance Request, no estágio Create, clique na etapa Identify issue (Identificar problema) e, no painel de propriedades contextuais à direita, clique em Configure user action (Configurar ação do usuário).
  4. Na janela Edit View: Identify issue, na seção Fields, clique em Add > Fields > Create Field (Adicionar > Campos > Criar campo).
    Create field
  5. Na caixa de diálogo Add field caixa de diálogo, no campo Name, digite o Service type.
  6. No campo Type confirme que o padrão do sistema é Picklist.
  7. Na primeira opção da lista de seleção (picklist) Service type (Tipo de serviço), insiraVehicle has a flat tire (Veículo tem um pneu furado).
  8. Clique em Add choice (Adicionar opção).
  9. Repita as etapas 7 a 8 para adicionar as outras opções:
    • Vehicle has a dead battery
    • Vehicle is locked
    • Vehicle is out of gas
    The completed Service type field.
  10. Clique em Enviar (Submit).
  11. Na janela Edit View: identificar o problema, à direita do campo Tipo de serviço, clique no ícone Configure . 
  12. Na janela Configurar campo: tipo de serviço, na seção Conditions, no campo Required, selecione Always.
  13. Clique em Salvar para fechar a caixa de diálogo.
  14. Clique em Submit para salvar a visualização Identify issue.
    Edit Identify issue View

2 Configurar a visualização Identify customer

  1. No ciclo de vida do caso Assistance request, clique na etapa Identify customer  (Identificar cliente). No painel de propriedades contextuais à direita, clique em Configure user action.
  2. Na janela Edit view: Identify customer, na seção Layout, selecione 1 column.
  3. Na seção Fields, clique em Add > Fields.
  4. Na lista Fields , selecione Customer (AR) e clique em Add.
    Add Customer data reference field
  5. Na janela Edit view: Na janela Identify customer , na seção Fields, clique em Customer (AR).
  6. Na caixa de diálogo Editar campo: Customer (AR), preencha o seguinte:
    • Confirme se o campo Mode é Single-select.
    • No campo Display as (Mostrar como), selecione Dropdown.
    • Confirme se o campo Data page (Página de dados) é List Customer (Listar cliente).
    • Confirme se o campo Display field (Campo de exibição) é Account ID (ID da conta).
  7. Clique em Back (Voltar) para fechar a janela Edit field: Customer (AR) .
    Highlighting the back button of the Customer(AR) configuration window
  8. Na janela  Editar visualização: Identify customer , clique em Add > Fields. 
  9. Na caixa de diálogo Fields, expanda o campo Customer (AR).
    Expand customer field
  10. Na caixa de diálogo Customer (AR), clique em Fields.
  11. Na lista de campos de Customer (AR) disponíveis, marque as caixas de seleção para Coverage level, Customer email, Enrollment, e Full name e clique em Add.
  12. À direita do campo Coverage level clique no ícone Configure.
  13. Na janela Configure field: nível de cobertura (CustomerAR) , no campo Edit mode, selecione Read-only e clique em Save.
  14. Repita as etapas 12 e 13 para configurar os campos Customer email, Enrollment e Full name como Read-only.
  15. Use Drag handle  para reordenar os campos Read-only (somente leitura) como Full name, Customer email, Enrollment e Coverage level.
    Identify customer view
  16. À direita do campo Customer (AR) , clique no ícone Configure.
  17. Na janela Configure field: Customer (AR) , no Label field, selecione Custom.
  18. No campo Custom label digite Customer.
  19. Na seção Conditions, no campo Required, selecione Always.
    Configure customer field
  20. Clique em Save.
  21. Clique em Submit para salvar a visualização Identify customer.

3 Configurar a visualização Identificar localização

  1. No ciclo de vida do caso Assistance Request, clique na etapa Identify location e, no painel de propriedades contextuais à direita, clique em Configure user action.
  2. Na janela Edit view: Identify location (Identificar localização), no campo Layout, selecione 1 column.
  3. Na seção Fields, clique em Add > Fields.
  4. Na lista de campos, selecione Service address (AR) e clique em Add.
    Add service address ar field
  5. Na janela Editar visualização: identificar localização, clique em Service address (AR) (Service address).
  6. Na janela Edit View: Service address (AR) , no campo Layout, selecione 1 column.
  7. Na janela Edit View: Service address (AR) , na seção Campos , clique no ícone Remove para remover a visualização Primary fields.
  8. Na seção Fields, clique em Add > Fields.
  9. Na lista de campos, selecione City, State,  e Street e clique em Adicionar.
  10. Usando o botão Drag handle, ordene os campos como Street, City e State. 
    Adding fields to the Service address AR View
  11. Clique em Back para retornar à janela Edit view: Identify location .
  12. À direita do campo Service address (AR) (Service address) clique no ícone Configure.
  13. No campo Label, insira Service address.
  14. Clique em Save.
  15. Clique em Enviar para salvar a visualização Identify location.
    Configure Identify location View

4 Configurar a visualização Identify vehicle

  1. No ciclo de vida do caso Assistance Request, clique na etapa Identify vehicle  e, no painel de propriedades contextuais à direita, clique em Configure user action.
  2. Na janela Edit View: Identify vehicle, na seção Fields, clique em Add > Fields > Create Field.
  3. Na janela Add field, no campo Name,  digite Vehicle information (AR).
  4. No campo Type, selecione Embedded Data.
  5. No campo Data object, selecione Vehicle information.
  6. No campo Options, selecione Single Record.
  7. Clique em Enviar para criar o relacionamento de dados de Informações do veículo (AR).
    The Vehicle information data relationship
  8. Na janela Edit View: identificar veículo, clique em Vehicle information (AR) (Vehicle information).
  9. Na seção Fields, clique no ícone Remove para remover a visualização Primary fields e clique em Add > Fields.
  10. Na lista de campos, selecione Color, Make, Model e Model year e clique em Adicionar.
  11. Arraste o campo Color entre os campos Model e Model year.
    Edit View Vehicle information
  12. Clique em Back para retornar à janela Edit View: Identify vehicle.
  13. À direita do campo Vehicle information (AR) (Vehicle information), clique no ícone Configurar.
  14. Atualize Label para Informações do veículo.
  15. Clique em Save.
  16. Clique em Submit para salvar a visualização Identify vehicle.
    Configure Identify vehicle View

5 Configurar a visualização Enter payment information (Inserir dados de pagamento)

  1. No ciclo de vida do caso Assistance Request, clique na etapa Enter payment information  e, no painel de propriedades contextuais à direita, clique em Configure user action.
  2. Na janela Edit View: Enter payment information (Editar visualização: inserir informações de pagamento), no campo Layout, selecione 1 column.
  3. Na janela Edit View: Enter payment information, na seção Fields, clique em Add > Fields > Create Field.
  4. Na caixa de diálogo Add field, em Name, insira Payment information (AR).
  5. No campo Type, selecione Embedded Data.
  6. No campo Data object, selecione Dados de pagamento.
  7. No campo Options, selecione Single Record.
  8. Clique em Submit para criar o relacionamento de dados Payment information (AR).
    The Payment information (AR) data relationship.
  9. Na janela Edit View: Enter payment information, clique em Payment information (AR) (Payment information).
  10. Na janela Edit View: Payment information (AR), no campo Layout, selecione 1 column.
  11. Na seção Fields, clique no ícone Remove para remover a visualização Primary fields e clique em Add > Fields.
  12. Na lista de campos, selecione Card number, Card type e Expiration date e clique em Adicionar.
  13. Usando o Drag handle, reordene os campos como Card type, Card number e Expiration date.
    Edit Payment information View
     
  14. Clique em Back para retornar à janela Edit view: Enter payment information.
  15. À direita do campo Payment information (AR) (Payment information), clique no ícone Configure.
  16. Na janela Configure field: Payment information (AR) , atualize Label para Payment information.
  17. Clique em Save.
  18. Clique em Submit para salvar a visualização Enter payment information.
    Edit Enter payment information View

6 Configurar a visualização Select services performed

  1. No ciclo de vida do caso Assistance Request, clique na etapa Select services performed  e, no painel de propriedades contextuais à direita, clique em Configure user action.
  2. Na janela Edit View: Select services performed (Editar visualização: Selecionar serviços realizados), no campo Layout, selecione 1 column.
  3. Na seção Fields, clique em Add > Fields.
  4. Na lista de campos, selecione Selected services (AR) e clique em Add.
  5. Na janela Edit View: Select services performed , clique em Selected services (AR).
  6. Na caixa de diálogo Editar campo: Selected services (AR) , no campo Display as , selecione Repeating View.
  7. No campo Record view , selecione Selected service View.
    Edit Selected services field
  8. Clique em Back para retornar à janela Edit View: Select services performed (Selecionar serviços executados).
  9. À direita do campo Selected Services (AR) clique no ícone Configure.
  10. Na caixa de diálogo Configure field: Selected services (AR) (Configurar campo: Serviços selecionados), no campo Label, selecione Custom.
  11. No campo Custom label, insira Selected services.
  12. Clique em Save.
  13. Na janela Edit View: Select services performed, clique em Add > Fields > Total of services > Add.
  14. À direita do campo Total de serviços, clique no ícone Configure.
  15. No campo Edit mode, selecione Read-only e clique em Salvar.
  16. Clique em Submit para salvar a visualização Select services performed.
    Edit Selected services performed View
  17. No ciclo de vida do caso Assistance Request, clique em Save para salvar o trabalho.

Este Desafio serve para praticar o que você aprendeu nos seguintes Módulo:

Disponível na seguinte missão:

Voltar à missão Continuar missão
If you are having problems with your training, please review the Pega Academy Support FAQs.

Este conteúdo foi útil?

Sim
Não

Quer nos ajudar a melhorar esse conteúdo?
Sugerir uma edição

We'd prefer it if you saw us at our best.

Pega Academy has detected you are using a browser which may prevent you from experiencing the site as intended. To improve your experience, please update your browser.

Close Deprecation Notice