Anexação de arquivos a registros de páginas do portal

  • Versão de lançamento: Yokohama
  • Atualizado 30 de jan. de 2025
  • 6 min. de leitura

    • Os anexos podem ser adicionados aos registros das páginas do portal navegando no sistema de arquivos, colando arquivos da área de transferência ou arrastando e soltando arquivos.

    Por padrão, vários widgets do sistema de base aceitam anexos de usuários do portal usando um ou mais desses métodos. Para modificar como os usuários do portal podem adicionar anexos, você pode clonar e editar widgets para personalizar a experiência de anexo de arquivo, conforme descrito nos procedimentos a seguir.

    Para rastrear como os usuários do portal anexam arquivos a registros de páginas no portal, consulte o evento SP File Attach em Análise da experiência do usuário para Portal de serviços. Para obter mais informações sobre os eventos disponíveis, consulte Portal de serviços eventos.

    Adicionar anexos colando ou soltando arquivos

    Permita que os usuários do portal anexem arquivos colando ou soltando arquivos na caixa de diálogo Adicionar anexos.

    Antes de Iniciar

    Por padrão, os widgets do sistema base Formulário, Anexos de tíquete, Conversas de tíquete e Item do catálogo SC oferecem suporte à adição de anexos colando ou soltando arquivos na caixa de diálogo Adicionar anexos em vez de apenas navegar pelo sistema de arquivos.

    Para configurar esta funcionalidade para outros widgets, você pode clonar ou criar um widget que ofereça suporte à adição de anexos com a diretiva sp-attachment-button. Para obter mais informações sobre como clonar widgets, consulte Clonar um widget.

    Nota:
    Os widgets do sistema base são somente leitura para que você possa se beneficiar de atualizações futuras. Para fazer mudanças, você pode clonar widgets do sistema de base. No entanto, os widgets clonados são considerados personalizados e não se beneficiam de atualizações futuras dos widgets dos quais foram clonados.

    Função necessária: sp_admin ou administrador

    Procedimento

    1. Navegar até Tudo > Portal de serviços > Configuração do Portal de serviços.
    2. Selecione Editor de widgets.
    3. No menu Editar um widget existente, selecione o widget que você clonou.
    4. No modelo HTML do widget, localize o elemento sp-attachment-button.
    5. Configure atributos para o elemento sp-attachment-button.
      • modal: habilita o suporte a copiar e colar e arrastar e soltar quando definido como verdadeiro.

        Para desativar o suporte a copiar e colar e arrastar e soltar, defina como falso.

      • supported-extensions: exibe uma lista de extensões de arquivo compatíveis para anexos na parte inferior da caixa de diálogo Adicionar anexos.

        Para listar as extensões de arquivo compatíveis especificadas pela propriedade do sistema glide.attachment.extensions, defina-a como {{::data.supportedAttachmentExtensions}}.

      <sp-attachment-button modal="true" supported-extensions="{{::data.supportedAttachmentExtensions}}"></sp-attachment-button>
    6. Selecione Save (Salvar).

    Resultado

    Em uma página com o widget, você pode colar ou soltar arquivos na caixa de diálogo Adicionar anexo para anexá-los ao registro, conforme mostrado no exemplo a seguir.

    Nota:
    Esta funcionalidade não é compatível com experiências móveis. A colagem de anexos não é compatível com o Firefox.

    Opção para escolher, soltar ou colar arquivos na caixa de diálogo Adicionar anexos

    Adicionar uma zona de arrastar e soltar para anexar arquivos

    Permita que os usuários do portal soltem anexos em uma zona dedicada de uma página para anexar arquivos rapidamente a um registro.

    Antes de Iniciar

    Para configurar uma zona de arrastar e soltar anexos em uma página, você deve clonar ou criar um widget que ofereça suporte à adição de anexos chamando attachmentHandler definido para uma instância de nowAttachmentHandler em seu client script. Para obter um exemplo de um widget como este, consulte Widget de formulário. Para obter mais informações sobre como clonar widgets, consulte Clonar um widget.

    Nota:
    Os widgets do sistema base são somente leitura para que você possa se beneficiar de atualizações futuras. Para fazer mudanças, você pode clonar widgets do sistema de base. No entanto, os widgets clonados são considerados personalizados e não se beneficiam de atualizações futuras dos widgets dos quais foram clonados.

    Função necessária: sp_admin ou administrador

    Por Que e Quando Desempenhar Esta Tarefa

    Por padrão, os usuários do portal podem adicionar anexos em várias páginas do sistema base selecionando o ícone Adicionar anexos (Ícone de anexo) para abrir a caixa de diálogo Adicionar anexos. Com uma zona de arrastar e soltar anexos, os usuários do portal podem adicionar anexos com menos cliques. Por exemplo, você pode soltar anexos em uma área de uma solicitação de catálogo ou em um formulário.

    Neste exemplo, a zona é uma área sobre o corpo de um widget de formulário. A zona só fica visível ao mover um arquivo sobre ela.
    Figura 1. Zona de anexo em um widget
    Arrastando um arquivo sobre a zona de anexo em um widget de formulário

    Procedimento

    1. Navegar até Tudo > Portal de serviços > Configuração do Portal de serviços.
    2. Selecione Editor de widgets.
    3. No menu Editar um widget existente, selecione o widget que você clonou para adicionar a zona de anexo.
    4. No modelo HTML do widget, adicione a diretiva sp-attachment-picker attachment-handler="attachmentHandler" como um atributo de um elemento <div> ou <section>.
      A zona pode incluir o widget inteiro ou apenas parte dele.
      <div sp-attachment-picker attachment-handler="attachmentHandler">
    5. Opcional: Configure atributos para a diretiva sp-attachment-picker.
      • disable-picker-overlay="true": desativa a exibição de uma sobreposição sobre a zona de anexo quando você arrasta um arquivo sobre ela. Por padrão, a sobreposição está habilitada.
      • onFilePck: implementa a lógica personalizada acionando um evento quando qualquer arquivo é selecionado. Defina o valor como uma função que usa as referências de todos os arquivos selecionados como uma matriz como o primeiro parâmetro. Por exemplo, on-file-pick="attachFiles($files)". Exemplos de lógica personalizada que podem ser implementados incluem a visualização dos arquivos, validações personalizadas ou lógica de carregamento personalizada. Se este atributo estiver configurado, o atributo attachment-handler="attachmentHandler" não será necessário e poderá ser removido.
    6. Opcional: Oculte a zona de anexos em dispositivos móveis.
      1. Adicione a diretiva ng-if="isDesktopBrowser" à diretiva sp-attachment-picker. 
        <div sp-attachment-picker attachment-handler="attachmentHandler" ng-if="isDesktopBrowser">
      2. No Client script do widget, adicione o script a seguir. 
        $scope.isNative = cabrillo.isNative();
$scope.isMobileBrowser = spUtil.isMobile() && !$scope.isNative;
$scope.isDesktopBrowser = !$scope.isNative && !$scope.isMobileBrowser;
    7. Selecione Save (Salvar).

    Resultado

    Em uma página com o widget, você pode arrastar um ou mais arquivos selecionados sobre a zona de anexos e soltá-los para anexá-los ao registro.

    Adicionar uma seção de anexos a um widget

    Permita que os usuários do portal colem, soltem ou naveguem até arquivos em uma seção de um widget para anexar arquivos rapidamente a um registro.

    Antes de Iniciar

    Para configurar uma seção de anexos em um widget, você deve clonar ou criar um widget que ofereça suporte à adição de anexos chamando attachmentHandler set para uma instância de nowAttachmentHandler em seu client script. Para obter um exemplo de um widget como este, consulte Widget de formulário. Para obter mais informações sobre como clonar widgets, consulte Clonar um widget.

    Nota:
    Os widgets do sistema base são somente leitura para que você possa se beneficiar de atualizações futuras. Para fazer mudanças, você pode clonar widgets do sistema de base. No entanto, os widgets clonados são considerados personalizados e não se beneficiam de atualizações futuras dos widgets dos quais foram clonados.

    Função necessária: sp_admin ou administrador

    Por Que e Quando Desempenhar Esta Tarefa

    Por padrão, os usuários do portal podem adicionar anexos em várias páginas do sistema base selecionando o ícone Adicionar anexos (Ícone de anexo) para abrir a caixa de diálogo Adicionar anexos. Com uma seção de anexos, os usuários do portal podem adicionar anexos com menos cliques.

    Neste exemplo, a seção de anexos é adicionada à parte inferior de um widget de item do catálogo.
    Figura 2. Seção de anexo em um widget
    Uma seção para adicionar anexos no widget de item do catálogo

    Procedimento

    1. Navegar até Tudo > Portal de serviços > Configuração do Portal de serviços.
    2. Selecione Editor de widgets.
    3. No menu Editar um widget existente, selecione o widget que você clonou para adicionar a seção de anexo.
    4. No modelo HTML do widget, adicione a diretiva sp-attachment-picker como um elemento onde você deseja que a seção de anexos apareça. 
      <sp-attachment-picker attachment-handler="attachmentHandler"></sp-attachment-picker>
    5. Opcional: Configure atributos para a diretiva sp-attachment-picker.
      • disable-picker-overlay="true": desativa a exibição de uma sobreposição sobre a seção de anexo quando você arrasta um arquivo sobre ela. Por padrão, a sobreposição está habilitada.
      • onFilePck: implementa a lógica personalizada acionando um evento quando qualquer arquivo é selecionado. Defina o valor como uma função que usa as referências de todos os arquivos selecionados como uma matriz como o primeiro parâmetro. Por exemplo, on-file-pick="attachFiles($files)". Exemplos de lógica personalizada que podem ser implementados incluem a visualização dos arquivos, validações personalizadas ou lógica de carregamento personalizada.
    6. Opcional: Oculte a seção de anexos em dispositivos móveis.
      1. Adicione a diretiva ng-if="isDesktopBrowser" à diretiva sp-attachment-picker. 
        <sp-attachment-picker attachment-handler="attachmentHandler" ng-if="isDesktopBrowser"></sp-attachment-picker>
      2. No Client script do widget, adicione o script a seguir. 
        $scope.isNative = cabrillo.isNative();
$scope.isMobileBrowser = spUtil.isMobile() && !$scope.isNative;
$scope.isDesktopBrowser = !$scope.isNative && !$scope.isMobileBrowser;
    7. Selecione Save (Salvar).

    Resultado

    Em uma página com o widget, você pode colar ou soltar um ou mais arquivos selecionados na seção de anexos para anexá-los ao registro.

    Nota:
    A colagem de anexos não é compatível com o Firefox.