Como modificar a interface da web usando o Web Screen Painter

casm173
O WSP (Web Screen Painter - Pintor da Tela da Web) permite modificar formulários da web de acordo com os requisitos de seu site, sem programação.
Alguns formulários do Gerenciamento de conhecimento não podem ser modificados na exibição de design do WSP. Para esses formulários, existem opções alternativas que proporcionam a personalização, tais como:
  • Exibição de documento -- o modelo de documento usado para a criação de documentos determina o conteúdo desta página. Esses modelos podem ser modificados na guia Administração, em Documentos, Modelos de documento.
  • Lista de documentos de categorias de conhecimento -- é possível modificar essa página usando o WSP, mas ela é também gerenciada pelas preferências do usuário. A tela "preferências" permite aplicar a personalização por usuário para definir quais propriedades do documento devem ser exibidas na lista de documentos e quantos documentos devem ser exibidos por página.
Siga estas etapas:
  1. Modificar um formulário
    O WSP sempre salva as alterações no servidor onde o WSP está instalado. Quando você salva um arquivo, ele se torna acessível a outros usuários do WSP em uma sessão de visualização, mas fica invisível aos usuários comuns do CA SDM. Isso ocorre porque o WSP salva todos os arquivos no diretório site/mods/wsp e esse diretório não é usado por uma sessão normal do CA SDM.
  2. Se estiver fazendo alterações no formulário da web no sistema de teste, migre do sistema de teste para o sistema de produção.
  3. (Se necessário) Excluir os formulários depois da publicação.
Verifique os pré-requisitos
Verifique os pré-requisitos a seguir antes de iniciar a personalização:
  • O esquema que você deseja adicionar nos formulários da web foi modificado.
  • (Apenas para a configuração de disponibilidade avançada) verificar os pré-requisitos a seguir para publicar os formulários da web com êxito:
    • (Recomendado) Os serviços do CA SDM estão ativos e em execução em todos os servidores do CA SDM. Caso contrário, o WSP publica apenas nos servidores do CA SDM que estiverem ativos e em execução.
    • (Obrigatório) Ao menos uma instância do web engine deve estar em execução em cada servidor do CA SDM .
Iniciar o WSP
Inicie o WSP para modificar os formulários da web.
Siga estas etapas:
  1. Efetue logon no computador onde o WSP está instalado.
  2. Inicie o WSP.
    • (Windows) Clique em Iniciar, Programas, CA, Service Desk Manager, WSP.
    • (UNIX) Insira o comando
      pdm_wsp
      com $NX_ROOT/bin no caminho.
      No UNIX, é necessário ter o Firefox instalado para usar o WSP.
    A janela de logon do WSP é aberta.
  3. Digite suas credenciais.
    O WSP exibe o formulário principal.
Selecionar o formulário a ser modificado
É possível criar um formulário ou abrir um formulário existente para modificá-lo. Selecione uma das seguintes opções:
Criar um formulário
Criar um formulário no WSP.
Siga estas etapas:
  1. Clique em Arquivo, Novo.
    A caixa de diálogo Novo formulário é exibida.
  2. Preencha os campos a seguir conforme apropriado:
    • Interface ou tipo de arquivo
      Indica o tipo de arquivo do formulário. Por exemplo, para criar um formulário HTMPL, selecione uma interface (Analista, Cliente, Funcionário, Padrão ou PDA). Para criar um formulário de outro tipo de arquivo, selecione o tipo diretamente (folha de estilos CSS, HTML ou JavaScript). Ao selecionar uma interface ou um tipo de arquivo, o WSP exibirá uma lista de todos os modelos disponíveis para o tipo de arquivo selecionado no campo Nome do arquivo.
    • Grupo de formulários
      Indica o grupo de formulários (conforme definido para a instalação do CA SDM) no qual deseja criar o formulário ou arquivo. Se você não definiu grupos de formulários, somente o grupo de formulários PADRÃO será listado.
    • Nome de arquivo
      Indica o modelo para a interface ou o tipo de arquivo selecionado. Um modelo contém os requisitos básicos para um novo formulário ou arquivo do tipo desejado.
    • Selecione uma tabela para nova lista ou formulário de detalhes
      Indica as tabelas do CA SDM para as quais é possível criar uma lista ou um formulário de detalhes. Este campo é preenchido de acordo com a sua seleção de uma interface (Analista, Cliente, Funcionário, Padrão ou PDA).
      Só pode existir um formulário de detalhes ou de lista por tabela em um grupo de formulários; portanto, você deve editar um formulário existente (em vez de criar um novo) para tabelas que já têm um formulário. Se quiser ter várias versões de um formulário, crie um ou mais grupos de formulários para guardar as versões adicionais.
  3. Clique em Novo.
  4. O formulário é exibido para suas personalizações. As duas guias a seguir são exibidas:
    1. Design
      Disponível para formulários de detalhes, formulários de lista e formulários de barra de menus, além de mostrar os controles do formulário dispostos aproximadamente da maneira como serão vistos pelo usuário. Não é uma imagem da aparência do formulário para um usuário final. Para tal imagem, selecione
      Ferramentas
      ,
      Visualizar
      .
    2. Origem
      Um editor no estilo Bloco de notas, em que você pode revisar e editar o código-fonte de um formulário. Alguns formulários podem ser editados somente na guia Origem. Para esses formulários, a janela de edição é aberta na guia Origem; a guia Design fica desativada.
    O relatório está pronto para personalização.
    Quando você criar ou editar um formulário de detalhes ou de formulário de lista, use os prefixos list_ e detail_ para nomear o arquivo HTMPL. For example, use list_test.htmp" e detail_test.htmpl. Esse prefixo permite visualizar corretamente um formulário. Ao salvar um modelo de detalhe com um nome personalizado, você também deve editar manualmente a marca . Por exemplo, <PDM_WSP mode=edit preview="test.htmpl+OP=CREATE_NEW" factory=cr>.
Abrir um formulário existente
Abra um formulário existente no WSP para modificá-lo.
Siga estas etapas:
  1. Selecione Arquivo, Abrir.
    A caixa de diálogo Abrir formulário é exibida.
  2. Selecione a Interface (Analista, Cliente, Funcionário, Padrão) ou o Tipo de arquivo (folha de estilos CSS, JavaScript ou HTML) e o grupo de formulários que contém o formulário que deseja editar.
  3. Selecione o formulário desejado na lista ou digite o nome dele na caixa de texto.
    Quando você digita um nome na caixa de texto, o WSP automaticamente rola a lista até o primeiro nome correspondente aos caracteres especificados. Para restringir a lista de arquivos exibidos, você pode usar a lista suspensa Arquivos com status:
    • Modificado pelo site com mudanças não publicadas (+)
      Restringe a lista aos arquivos que foram modificados com o WSP, mas que ainda não foram publicados. Esses arquivos são identificados com um sinal de adição (+) depois do nome do arquivo.
    • Modificado pelo site (*)
      Restringe a lista aos formulários modificados no site, tanto publicados quanto não publicados. Os arquivos não publicados são identificados com um sinal de adição (+) depois do nome do arquivo. As modificações de site publicadas são identificadas por um asterisco (*) depois do nome do arquivo.
    • Todas
      Mostra a lista sem nenhuma restrição. Os arquivos não publicados são identificados com um sinal de adição (+) depois do nome do arquivo. As modificações de site publicadas são identificadas por um asterisco (*) depois do nome do arquivo.
  4. Clique em Abrir.
    O formulário é exibido e está pronto para personalização.
Modificar um formulário
Depois de abrir o formulário que deseja editar no WSP, você poderá usar a barra de ferramentas, comandos de menu e atalhos para personalizá-lo. É possível executar a seguinte personalização:
  • Inserir um controle
  • Editar propriedades de controle
  • Modificar barras de menu
  • Modificar folhas de estilos
  • Modificar um formulário de visualização sensível ao mouse
  • Modificar a lista de grade de dados em um formulário de lista
  • Modificar o bloco de notas em formulários de detalhes
  • Modificar arquivos HTML e JavaScript
Inserir um controle
Adicione um controle no formulário. Por exemplo, adicione uma caixa de texto no formulário.
Os controles que podem ser inseridos nos formulários de lista e de detalhes são os seguintes:
Controle
Ícone
Descrição
Inserir linha
BSVC_r12.1--Inserting a Control
Faz o controle selecionado ser o último na linha atual (move os controles seguintes para a próxima linha).
Excluir linha
N/A
Exclui todos os controles situados na mesma linha que o controle atualmente selecionado.
Caixa de texto
BSVC_r12.1--Inserting a Control (2)
Insere uma caixa de texto com uma ou várias linhas para edição de uma sequência de caracteres ou um campo de texto.
Lista suspensa
BSVC_r12.1--Inserting a Control (3)
Insere uma lista suspensa para editar um campo validado em relação a uma tabela.
Pesquisar
BSVC_r12.1--Inserting a Control (4)
Insere um controle de pesquisa para editar um campo validado em relação a uma tabela. O controle consiste em uma caixa de texto com um hiperlink no rótulo que exibe um formulário selecionado.
Botão
BSVC_r12.1--Inserting a Control (12)
Insere um botão.
Pesquisa hierárquica
BSVC_r12.1--Inserting a Control (5)
Semelhante a um controle de pesquisa, exceto que é usado para um campo com seletor hierárquico (como categoria de solicitação).
Data
BSVC_r12.1--Inserting a Control (6)
Insere um campo de data. O controle consiste em uma caixa de texto com um hiperlink no rótulo que exibe um seletor de data.
Os seguintes controles adicionais estão disponíveis somente para formulários de detalhes:
Controle
Ícone
Descrição
Caixa de seleção
BSVC_r12.1--Inserting a Control (7)
Insere uma caixa de seleção.
Editor de HTML
BSVC_r12.1--Inserting a Control (8)
Insere um editor de HTML para um campo de texto que contém HTML.
Caixa de texto somente leitura
BSVC_r12.1--Inserting a Control (9)
Insere um campo de texto não editável.
Pesquisa somente leitura
BSVC_r12.1--Inserting a Control (10)
Insere um campo de pesquisa não editável. O campo é exibido como um hiperlink que mostra o formulário de detalhes que o define.
Somente leitura
BSVC_r12.1--Inserting a Control (11)
Insere um campo de data não editável.
Bloco de notas
BSVC_r12.1--Inserting a Control (13)
Insere um bloco de notas. Pode existir apenas um bloco de notas em um formulário de detalhes; portanto, esse controle pode ser inserido somente em formulários que ainda não contenham um bloco de notas.
O seguinte controle adicional está disponível somente para formulários de lista:
Controle
Ícone
Descrição
Lista
BSVC_r12.1--Inserting a Control (14)
Insere uma lista. Pode existir apenas uma lista em um formulário de lista; portanto, esse controle pode ser inserido somente em novos formulários de lista.
Siga estas etapas:
  1. Clique com o botão direito do mouse no formulário, no local onde deseja adicionar o controle e selecione Inserir controle.
    Uma lista suspensa é exibida.
  2. Selecione as opções da caixa de diálogo Inserir controle.
    O controle é colocado no formulário.
  3. Selecione Ferramentas, Visualizar para verificar como o formulário será exibido para o usuário final. Embora assemelhe-se a uma janela padrão do CA SDM, e a maioria dos botões e menus seja funcional, ela não é uma sessão padrão e você não deve tentar usá-la desse modo.
  4. Clique em Arquivo, Salvar.
    Os controles são adicionados em um formulário.
Inserir opções à caixa de diálogo de controle
Abra a caixa de diálogo Inserir controle no menu Arquivo. A caixa de diálogo lista todos os controles de UI apropriados para a seção do formulário selecionado para edição.
A caixa de diálogo contém as seguintes opções:
  • Inserir antes
    Insere o controle selecionado na lista antes do controle selecionado no momento no formulário base, e o torna o novo controle selecionado.
  • Inserir após
    Insere o controle selecionado na lista depois do controle selecionado no momento no formulário base, e o torna o novo controle selecionado.
  • Voltar
    Move o controle atualmente selecionado para o controle que o precede no formulário.
  • Próximo
    Move o controle atualmente selecionado para o controle que o sucede no formulário.
  • Propriedades
    Abre a caixa de diálogo Propriedades para o controle selecionado no momento.
  • Fechar
    Fecha o formulário Inserir controle.
  • Fechar formulário após a inserção
    (Ativado) Insere o controle selecionado e fecha a caixa de diálogo Inserir controle quando você clica em Inserir antes ou Inserir após.
    (Desativado) Insere o controle selecionado quando você clica em Inserir antes ou Inserir após. A caixa de diálogo Inserir controle permanece aberta para inserção de controles adicionais ou solicitação de propriedades para o controle atualmente selecionado. Depois de limpar a caixa de seleção, a caixa de seleção Fechar formulário após a inserção fica desmarcada até que você selecione-a novamente ou encerre sua sessão do Web Screen Painter.
    Padrão:
    ativado
Editar propriedades de controles
Editar as propriedades de um controle.
Siga estas etapas:
  1. Selecione o controle e pressione F4.
    A caixa de diálogo Propriedades é exibida.
  2. Altere as propriedades conforme apropriado. Por exemplo, a propriedade Legenda especifica o rótulo de cabeçalho que será exibido acima de um controle. Para especificar essa propriedade, digite o valor desejado na célula à direita da propriedade.
  3. Feche a caixa de diálogo Propriedades.
  4. Selecione Ferramentas, Visualizar para verificar como o formulário será exibido para o usuário final. Embora assemelhe-se a uma janela padrão do CA SDM, e a maioria dos botões e menus seja funcional, ela não é uma sessão padrão e você não deve tentar usá-la desse modo.
  5. Clique em Arquivo, Salvar.
    As propriedades do controle são modificadas e o formulário é salvo.
Modificar barras de menu
Os formulários cujos nomes começam com
menubar_
definem uma barra de menus. A Exibição de design de uma barra de menus mostra o menu na parte superior. Você pode clicar em um item de menu para descer o menu, mas não pode editar a barra de menus diretamente na Exibição de design. Para editar uma barra de menus, clique duas vezes no item de menu para exibir o Designer de menus.
Os menus (e formulários de barra de menus) são usados somente na interface do analista. As interfaces do cliente e do funcionário usam uma "barra de inicialização" que contêm links reais e não listas suspensas. Para modificar a barra de inicialização do cliente ou do funcionário, edite o formulário std_body_site.htmpl na interface adequada.
Siga estas etapas:
  1. Selecione Ferramentas, Designer de menus ou clique duas vezes no menu mostrado na guia Design de um formulário de barra de menus.
    A caixa de diálogo Designer de menus é exibida.
  2. Preencha os campos na caixa de diálogo Designer de menus para adicionar ou editar os itens de menu. Para obter mais informações sobre como adicionar itens de menu, consulte o tópico Funções úteis em itens de menu.
  3. Clique em OK para fechar a caixa de dialogo.
  4. Selecione Ferramentas, Visualizar para verificar como o formulário será exibido para o usuário final. Embora assemelhe-se a uma janela padrão do CA SDM, e a maioria dos botões e menus seja funcional, não se trata de uma sessão padrão, e você não deve tentar usá-la desse modo.
  5. Clique em Arquivo, Salvar.
    A barra de menus foi modificada no formulário.
Caixa de diálogo Design de menus
A caixa de diálogo Designer de menus é exibida quando você escolhe o Designer de menus no menu Ferramentas, ou quando clica duas vezes no menu mostrado na guia Design de um formulário de barra de menus. Use a caixa de diálogo Designer de menus para adicionar uma barra de menus, menus, submenus e comandos de menu ao formulário aberto.
É possível acessar o Designer de menus apenas ao editar formulários HTMPL com nomes que comecem por menubar_, tal como menubar_admin.htmpl.
A caixa de diálogo Editor de menus contém os seguintes controles:
  • Lista de menus
    Na lista de menus, selecione o item de menu que você deseja modificar. Para alterar o rótulo do menu, por exemplo, selecione um rótulo de menu da lista, digite um novo nome na caixa de texto Legenda e clique em Aplicar. Você pode adicionar, inserir, excluir e mover os itens de menu usando os controles no Designer de menus.
    Apenas um nível de recuo é possível.
  • Legenda
    Digite o nome do item de menu selecionado. Consulte a propriedade para obter mais informações.
  • Função
    Digite a função de JavaScript a ser executada quando o usuário clicar no menu. Veja a descrição da propriedade Função para obter mais detalhes, incluindo algumas funções predefinidas que podem ser úteis em menus.
  • ID
    Digite a ID de HTML/JavaScript a ser atribuída ao item de menu.
  • Tecla de acesso
    Digite uma lista de caracteres que instrua sobre a seleção de teclas de acesso do CA SDM para esse item de menu. A tecla de acesso é sublinhada na legenda do menu quando exibida. O CA SDM normalmente seleciona a primeira tecla na legenda do menu que não esteja sendo usada como uma tecla de atalho. Você pode especificar um ou mais caracteres para restringir a seleção a esses caracteres, ou especificar um ou mais caracteres precedidos por uma explicação para impedir a seleção desses caracteres.
  • Imagem
    Digite o local da imagem que você deseja exibir ao lado do item de menu.
  • Interno
    Selecione essa opção para especificar que o JavaScript chamado pela função deve ser executado no contexto da janela atual (que pode ser uma janela pop-up de detalhes). Deixe essa opção desmarcada para especificar que a função deve ser executada no contexto do formulário principal.
  • Variável
    Digite a variável de JavaScript a ser atribuída ao item de menu.
  • Barra de ferramentas
    Adiciona um ícone da barra de ferramentas e uma dica de ferramenta que correspondem a um item de menu que não é de nível superior.
  • Arquivo de ícone
    Identifica o local do ícone da barra de ferramentas.
  • Gratificação
    Especifica o texto da dica de ferramenta.
Funções úteis em itens de menu
O CA SDM fornece uma barra de menus na maioria dos formulários para controlar suas funções. A barra de menu é gerada por um formulário HTMPL com um nome de formulário menubar_
xx
.htmpl. Recomendamos o uso do WSP para a modificação das barras de menu existentes e a definição de novas barras.
As seguintes funções predefinidas podem ser úteis para scripts chamados por itens de menu:
  • upd_frame(form)
    Carrega um novo formulário no quadro de conteúdo da janela principal.
  • create_new(factory, use_template, width, height [,args])
    Exibe um formulário para definir um novo registro.
    Popup_window(name, form[, width, height [,features [,args]] ])
    Exibe uma nova janela.
  • showDetailWithPersid(persid)
    Exibe um registro de detalhes.
Os seguintes termos e definições aplicam-se às funções anteriores:
  • Formulário
    Pode ser um nome de arquivo HTMPL no formato xxx.htmp ou um código de operação (por exemplo, CREATE_NEW).
  • fábrica
    É o nome de um objeto de banco de dados.
  • use_template
    Pode ser verdadeiro ou falso.
  • width
    Representa a largura de formulário desejada ou zero por padrão.
  • height
    Representa a altura de formulário desejada ou é zero por padrão.
  • recursos
    Representa uma lista de recursos da janela, no mesmo formato usado com a função padrão window.open.
  • args
    Representa um ou mais argumentos no formato "keyword=value" da operação especificada para o formulário.
  • persid
    É uma ID persistente no formato factory:ID.
Modificar folhas de estilos
Você pode usar o WSP para editar ou criar arquivos CSS (folha de estilos em cascata).
Por motivos de desempenho, as folhas de estilos do CA SDM são fornecidas de duas formas: arquivos individuais (como search_filter.css) e arquivos de combinação que agrupam vários arquivos individuais com comentários e remoção do excesso de espaço em branco (como analyst_styles.css). O WSP sempre edita os arquivos individuais; você não pode editar um arquivo de combinação diretamente. Quando você publica modificações de folha de estilos, o WSP cria automaticamente o arquivo de combinação associado, se necessário.
Siga estas etapas:
  1. Crie ou abra o arquivo de folha de estilos CSS.
    O WSP mostrará a exibição de origem da folha de estilos.
  2. Você pode editar diretamente na exibição de origem ou exibir o Designer de estilos selecionando Ferramentas, Designer de estilos.
  3. Preencha os campos na caixa de diálogo Designer de estilos, conforme apropriado. Existem vários atributos de estilo, como margem e borda, que não podem ser vistos nem editados no Designer de estilos. Esses atributos devem ser editados na Exibição de código-fonte.
  4. Clique em OK no Designer de estilos.
    O WSP reformata a folha de estilos e atualiza a exibição de origem.
  5. Clique em Arquivo, Salvar.
    A folha de estilos é modificada.
Caixa de diálogo Designer de estilos
O Designer de estilos permite modificar ou personalizar folhas de estilos. Por padrão, a caixa de diálogo Designer de estilos é aberta na guia Fonte e cor e contém os seguintes controles:
  • Classes de estilo
    Na lista suspensa, selecione um elemento de estilo que deseja modificar.
  • Adicionar
    Clique para adicionar uma nova classe de estilo.
  • Renomear
    Clique para renomear a classe de estilo selecionada na lista suspensa Classes de estilo.
  • Excluir
    Clique para excluir a classe de estilo selecionada na lista suspensa Classes de estilo.
  • Fontes instaladas
    Essa propriedade lista as fontes instaladas no sistema. Clique nas setas para a direita e para a esquerda para mover-se entre as fontes selecionadas na lista Fontes instaladas e na lista Fontes selecionadas.
  • Fontes selecionadas
    Esta propriedade especifica uma lista hierárquica de fontes preferidas que um navegador usa para obter o elemento de classe de estilo. Um navegador usa a primeira fonte na lista instalada no sistema sendo executado.
    Clique nas setas para cima e para baixo para mover-se para cima e para baixo nas fontes selecionadas na hierarquia.
  • Tamanho da fonte
    Selecione o tamanho da fonte na lista suspensa.
  • Negrito
    Selecione um estilo de fonte na lista suspensa.
  • Itálico
    Selecione um estilo de fonte na lista suspensa.
  • Sem efeitos
    Selecione essa opção se não quiser qualquer decoração de texto ou efeitos especiais.
  • Sublinhado
    Selecione essa opção se quiser que o texto seja sublinhado.
  • Tachado
    Selecione essa opção se quiser que o texto apareça riscado por uma linha.
  • Linha sobreposta
    Selecione essa opção se quiser que o texto apareça com uma linha acima dele.
  • Cor do primeiro plano
    Selecione a cor do primeiro plano para o elemento de texto clicando no botão Procurar à direita da propriedade Cor do primeiro plano. Em seguida, selecione a cor desejada na Paleta de cores e clique em OK.
  • Cor do plano de fundo
    Selecione a cor do plano de fundo para o elemento de texto clicando no botão Procurar à direita da propriedade Cor do plano de fundo. Em seguida, selecione a cor desejada na Paleta de cores e clique em OK.
  • Transparente
    Selecione essa opção se quiser que o plano de fundo do elemento de estilo seja transparente.
Um exemplo do elemento de estilo é exibido na área de visualização na parte inferior do diálogo.
Para definir a posição do elemento de estilo, clique na guia Posição. A guia Posição contém os seguintes controles:
  • Posição
    Na lista suspensa, selecione uma das posições para o elemento. A propriedade de posição coloca um elemento em uma posição estática, absoluta ou relativa. Selecionar um valor Estático colocará o elemento de acordo com o fluxo normal. Selecionar um valor Absoluto colocará o elemento em qualquer lugar em uma página. Selecionar um valor Relativo moverá o elemento de acordo com sua posição normal.
  • À esquerda
    Digite um valor para a margem esquerda na caixa de texto para o elemento. Selecione um tamanho na lista suspensa. Essa propriedade é desativada quando a posição selecionada é Estática.
  • Superior
    Digite um valor para a margem superior na caixa de texto para o elemento. Selecione um tamanho na lista suspensa. Essa propriedade é desativada quando a posição selecionada é Estática.
  • Largura
    Digite um valor para a largura na caixa de texto para o elemento. Selecione um tamanho na lista suspensa.
  • Altura
    Digite um valor para a altura na caixa de texto para o elemento. Selecione um tamanho na lista suspensa.
  • Z-índice
    Digite um valor para a ordem de pilha na caixa de texto para o elemento. Um elemento com ordem de pilha maior estará sempre na frente de um elemento com ordem de pilha menor. Índice Z funciona apenas com elementos que apresentam posição absoluta
Os elementos podem ter ordens de pilha negativas.
Clique na guia Outro para definir algumas propriedades específicas do elemento. A guia Outro contém os seguintes controles:
  • Visibilidade
    Selecione o tipo da visibilidade do elemento na lista suspensa. A propriedade Visibilidade define como o conteúdo de um elemento será exibido caso ultrapasse sua área.
  • Estouro
    Selecione o tipo de estouro do elemento na lista suspensa. A propriedade Estouro determina o que acontecerá se o conteúdo de um elemento ultrapassar sua área definida.
  • Exibir
    Selecione o tipo da exibição para o elemento na lista suspensa. A propriedade Exibir define como um elemento será exibido.
  • Cursor
    Selecione o tipo de cursor para o elemento na lista suspensa. A propriedade Cursor especifica o tipo de cursor a ser exibido quando o usuário aponta para um elemento.
  • OK
    Clique para fechar essa caixa de diálogo e salve suas mudanças.
  • Cancelar
    Clique para fechar a caixa de diálogo Designer de estilos.
Modificar um formulário de visualização sensível ao mouse
As visualizações sensíveis ao mouse permitem exibir detalhes da chave dentro do formulário atual, sem a necessidade de clicar em um link ou abrir uma nova página da web. A visualização sensível ao mouse é exibida ao posicionar o cursor sobre um link do objeto em uma lista ou um formulário detalhado para um determinado período de tempo. Ao mover o mouse pelo link antes do tempo de atraso expirar, não é possível visualizar. A visualização sensível ao mouse é exibida por padrão em todas as listas e formulários de detalhes no modo somente leitura.
Pode-se criar visualizações sensíveis ao mouse para formulários que não tenham os formulários preview_ por padrão. Também é possível criar visualizações sensíveis ao mouse para formulários personalizados criados no ambiente do CA SDM.
Os seguintes formulários com visualização sensível ao mouse estão disponíveis:
  • preview_chg.htmpl (Requisição de mudança)
  • preview_cnt.htmpl (Contato)
  • preview_cr.htmpl (Solicitação)
  • preview_in.htmpl (Incidente)
  • preview_iss.htmpl (Ocorrência)
  • preview_KD.htmpl (Documento de conhecimento)
  • preview_nr.htmpl (Item de configuração)
  • preview_pr.htmpl (Problema)
Siga estas etapas:
  1. Abra um dos seguintes formulários para a personalização:
    • Abra um formulário existente que não tem o formulário preview_ por padrão. Por exemplo, detail_loc.htmpl
    • Abrir um formulário de visualização sensível ao mouse. Por exemplo, preview_chg.htmpl.
  2. Modificar o formulário. Por exemplo, adicione ou remova os controles personalizados do formulário.
  3. Clique em Arquivo, Salvar como, especifique um nome de arquivo usando o prefixo preview_ e clique em Salvar. Por exemplo, digite preview_loc.htmpl.
    O formulário de visualização sensível ao mouse é criado e modificado.
Modificar a lista de grade de dados em um formulário de lista
As listas de grade de dados permite exibir o conteúdo de uma página do produto em um formulário de lista sem abrir uma nova página. Este controle limitado por dados lista os itens na origem de dados em uma tabela para que você possa selecionar e classificar itens, bem como buscar dados. Por exemplo, as opções expandir e recolher no formulário de lista de incidentes.
Siga estas etapas:
  1. Abra um formulário de lista.
  2. Localize a área em azul, próximo aos campos com rótulo no final do formulário na exibição do Design. Caso prefira a exibição da Origem, a grade de dados aparece entre as seguintes linhas do código:
    <PDM_MACRO name=lsStart> <PDM_MACRO name=lsEnd>
    O exemplo abaixo mostra a área da grade de dados na exibição do Design:
2173363.PNG
O sinal de adição na área da grade de dados representa o início da seção de expansão da linha (os campos exibidos apenas quando um usuário clica no sinal de adição na linha, dentro da grade de formulários de lista). O código abaixo gera o sinal de adição na exibição de origem:
<PDM_MACRO name=lsCol attr=open_date label="Open Date" sort="DESC" startrow=yes>
O parâmetro
startrow=yes
especifica o início de uma linha e inicia a seção de expansão da linha.
  • Arraste e solte as colunas para movê-las em uma lista. Pode-se mover colunas entre a parte principal da linha e a seção de expansão. Não é possível mover um controle existente depois da área de grade.
  • Para inserir uma coluna de lista, clique com o botão direito do mouse em um controle ou em qualquer lugar no fundo azul, e selecione Inserir coluna ou Inserir controle.
    • Ao selecionar a opção Inserir coluna, o WSP insere uma coluna à esquerda do controle atualmente selecionado.
    • Ao selecionar a opção Inserir controle, o WSP exibe a caixa de diálogo Inserir controle que permite adicionar o controle desejado ao formulário.
  • Selecione Ferramentas, Visualizar para verificar como o formulário será exibido para o usuário final. Embora assemelhe-se a uma janela padrão do CA SDM, e a maioria dos botões e menus seja funcional, ela não é uma sessão padrão e você não deve tentar usá-la desse modo.
  • Clique em Arquivo, Salvar.
    A lista de grade de dados é modificada no formulário de lista.
Modificar o bloco de notas em formulários de detalhes
O controle das guias aninhadas (bloco de notas) permite expandir ou recolher detalhes dentro do formulário atual. Por exemplo, use o controle para personalizar a maneira como você organiza as guias no formulário detalhado do incidente. Na opção Design View, é possível usar o controle de bloco de notas para adicionar guias aninhadas a um formulário de detalhes que ainda não contenha uma. Clique duas vezes no Controle de bloco de notas para modifica-lo. Use o recurso de arrastar e soltar para adicionar, inserir e excluir as guias de bloco de notas e alterar suas legendas. Você também pode usar os botões de seta para cima e para baixo a fim de reorganizar guias alterando a posição da guia atualmente selecionada. A caixa de seleção Nova linha especifica se a guia selecionada inicia uma nova linha no cabeçalho do bloco de notas.
Siga estas etapas:
  1. Abra um formulário de detalhes.
  2. Localize a área em azul do formulário na exibição do Design que contém o primeiro rótulo numerado.
    Caso prefira a exibição da Origem, a área do bloco de notas aparece entre as seguintes linhas do código:
    <PDM_MACRO name=startNotebook hdr=cng_nb>
    <PDM_MACRO name=endNotebook>
    No CA SDM r12.6, um bloco de notas pode conter guias aninhadas. No Web Screen Painter, uma guia de alto nível, ou seja, uma guia com outras guias, é chamada de grupo de guias. O Web Screen Painter exibe um grupo de guias, na forma de uma barra sólida azul escura com números no centro, que abrange toda a área azul do bloco de notas. Uma guia de baixo nível, ou seja, uma guia que não apresenta outras guias, é chamada de guia. O Web Screen Painter exibe guias de baixo nível no formato de retângulos com cantos arredondados.
  3. Clique em uma guia para selecioná-la. Ao selecionar uma guia, um link para o índice da guia fica em destaque e é exibido na parte inferior do bloco de notas.
    Pode-se mover as guias e os grupos de guias dentro de um bloco de notas, por meio da função de arrastar e soltar. Ao mover um grupo de guias, move-se todas as guias dentro do grupo.
  4. Para inserir uma guia ou grupos de guias, clique com o botão direito do mouse em um controle ou em qualquer lugar no fundo azul do bloco de notas, e selecione Inserir guia, Inserir grupo de guias ou Inserir controle.
    Ao selecionar Inserir guia ou Inserir grupo de guias, o Web Screen Painter insere uma guia ou grupo de guias à esquerda do controle atualmente selecionado. Ao selecionar a opção Inserir controle, o WSP exibe a caixa de diálogo Inserir controle que permite adicionar o controle desejado ao formulário.
  5. Selecione Ferramentas, Visualizar para verificar como o formulário será exibido para o usuário final. Embora assemelhe-se a uma janela padrão do CA SDM, e a maioria dos botões e menus seja funcional, ela não é uma sessão padrão e você não deve tentar usá-la desse modo.
    Clique em Arquivo, Salvar.
Modificar arquivos HTML e JavaScript
É possível usar a Exibição de código-fonte do WSP para editar formulários HTML e JavaScript. Abra um arquivo HTML ou JavaScript e faça as alterações necessárias.
Observação: por motivos de desempenho, alguns arquivos JavaScript do CA SDM são fornecidos de duas formas: arquivos individuais (como window_manager.js) e arquivos de combinação que agrupam um número de arquivos individuais com comentários e excesso de espaço em branco removido (como std_head.js). O WSP sempre edita os arquivos individuais; você não pode editar um arquivo de combinação diretamente. Quando você publica alterações de script, o WSP cria automaticamente o arquivo de combinação associado, se necessário.
Migrar do sistema de teste para o sistema de produção.
Um dos objetivos de projeto do WSP era torná-lo seguro para desenvolver e testar modificações de formulários em um banco de dados de produção. Recursos como árvore de diretórios somente de WSP no servidor, processos de servidor WSP dedicados e sessões de visualização somente leitura oferecem suporte a esse objetivo. No entanto, muitos usuários preferem desenvolver suas modificações de formulários em um sistema de testes independente e, em seguida, migrá-los para um sistema de produção separado quando estiverem concluídos.
  1. Copie do subdiretório site/mods/www/htmpl adequado, no sistema de testes, para o mesmo subdiretório site/mods/wsp/project, no sistema de produção, os formulários HTMPL a serem migrados.
  2. Copie do subdiretório site/mods/www/wwwroot adequado, no sistema de testes, para o mesmo subdiretório site/mods/www/wwwroot/wsp/project, no sistema de produção, os arquivos CSS, JavaScript e HTML a serem migrados.
    Certifique-se de copiar os arquivos e formulários nos seguintes servidores do sistema de produção, dependendo da sua configuração do CA SDM:
    • Convencional:
      servidor principal
    • Disponibilidade avançada:
      servidor em segundo plano
É possível usar qualquer método de cópia de arquivos aceito pelo sistema operacional para executar a cópia descrita nas etapas 1 e 2 acima. Os usuários do Windows devem substituir a barra invertida (\) pela barra (/) nos caminhos de diretório mostrados.
Publicar as alterações do formulário
Quando estiver satisfeito com as alterações, você poderá disponibilizá-las a todos os usuários do CA SDM publicando-as. A publicação atualiza todos os servidores do CA SDM com formulários novos ou revisados.
Siga estas etapas:
  1. Selecione Arquivo, Publicar.
    Se houver mudanças não salvas, o WSP solicitará que elas sejam salvas e, em seguida, exibirá uma caixa de diálogo de confirmação mostrando todas as mudanças pendentes do Web Screen Painter (incluindo aquelas salvas em sessões anteriores ou por outros usuários do ). Por padrão, todas as mudanças são selecionadas para publicação. É possível alterar a seleção de alterações a serem publicadas clicando nelas.
  2. Quando estiver satisfeito com a seleção, clique OK
    .
  3. (Configuração de disponibilidade avançada apenas) Se o web engine não estiver em execução em qualquer servidor do CA SDM, uma mensagem de erro será exibida com a lista de servidores do CA SDM que o WSP não publicou. Conclua as seguintes etapas:
    1. Configure o servidor do CA SDM (o servidor especificado na mensagem de erro) para fazer as correções.
    2. Edite o arquivo no WSP para adicionar um caractere de espaço em branco na macro <PDM_IF 0> e salve-o.
    3. Volte para a etapa 1 para publicar o formulário web.
      Se não quiser alterar a configuração, é necessário copiar manualmente a pasta nx_root/site/mods/uww do servidor em segundo plano para todos os outros servidores.
  4. (Configuração de disponibilidade avançada apenas) Se o servidor em segundo plano travar durante a publicação, recupere a alterações do formulário HTMPL.
  5. (Para formulários de visualização sensível ao mouse) Execute o seguinte comando depois de publicar as alterações:
    pdm_webcache - H
    O cache da web é atualizado. O WSP disponibiliza as alterações selecionadas para todos os usuários ativos em todos os servidores.
É possível excluir somente formulários modificados pelo site. As solicitações de exclusão de um formulário publicado anteriormente são aplicadas quando você publica as alterações. Para cancelar uma solicitação de exclusão pendente, selecione Arquivo, Cancelar exclusão de formulário. Você pode desfazer alterações em um formulário após a publicação.
Recuperar as alterações do HTMPL
É possível recuperar as alterações de esquema do HTMPL se o servidor em segundo plano falhar durante a publicação.
É recomendável não executar as etapas de recuperação diretamente no ambiente de produção. Primeiramente, certifique-se de validá-las no ambiente de teste ou de desenvolvimento.
Siga estas etapas:
  1. Vá para o seguinte diretório no servidor em segundo plano travado:
    $NX_ROOT$/site/mods/www/wwwroot/wsp/project/web
  2. Copie todo o conteúdo da pasta da web.
  3. Efetue logon no novo servidor em segundo plano e cole todo o conteúdo copiado na pasta $NX_ROOT$/site/mods/www/wwwroot/wsp/project/web.
  4. Continue a publicação das alterações no novo servidor em segundo plano.