Créer les fragments HTML

Les fragments HTML permettent d’afficher les parties de l’interface utilisateur utilisées dans un dossier de traitement multi-document.

Créer un fragment

Démarrer un nouveau fragment

Dans Dev Studio, cliquez sur Records → Technical → HTML Fragment → Create.

Nommer le fragment

Dans les champs Label et Identifier, saisissez le nom du fragment, par exemple InvoiceDefaultFragment.

Capture d’écran du formulaire Pega Create HTML Fragment avec InvocieDefaultFragment saisi dans les champs Label et Identifier et FlexiCapture for Invoices sélectionné comme contexte d’application.

Ouvrir le fragment

Cliquez sur Create and open.

Ajouter le code du fragment

Dans le champ HTML Source, saisissez le code de votre fragment. Le code de chaque fragment est indiqué dans les sections suivantes.

Répétez ces étapes pour chacun des cinq fragments. Le code de tous les fragments se trouve également dans le dossier d’installation du connecteur :

%Installation Path%\Connector for FlexiCapture as a Service with verification\Samples\Code examples\Configure UI\Multi-document\HTML fragments

InvoiceDefaultFragment

<head>
    <meta charset="utf-8" />
        <style>
          * {
            box-sizing: border-box;
          }
          .value {
            color: black; 
          }
          .name{
            color: grey;
          }
          .invoicecolumn {
            float: left;
            width: 50%;
            padding: 10px;
            height: 130px; 
          }
          .row:after {
            content: "";
            display: table;
            clear: both;
          }
        </style>
</head>
<h1>
  Facture <br> <hr>
</h1>
<div class="row">
  <div class="invoicecolumn">
    <p> <span class="name"> Numéro de facture </span> <br> <span class="value"> ---- </span> </p>
    <p> <span class="name"> Date de la facture </span> <br> <span class="value"> ---- </span> </p>
  </div>
  <div class="invoicecolumn">
    <p> <span class="name"> Adresse </span> <br> <span class="value"> ---- </span> </p>
  </div>
</div>
<h4>Tableau de la facture</h4> 
<table style="width:100%">
  <tr>
    <th>Référence</th>
    <th>Désignation</th> 
    <th>Quantité</th>
    <th>Numéro de commande</th>
    <th>Prix unitaire</th> 
    <th>Total</th>
  </tr>
</table>
<p> <span class="name"> Total </span> <br> <span class="value"> ---- </span> </p>
<p> <span class="name"> Entreprise </span> <br> <span class="value"> ---- </span> </p>
<br>

BankingDefaultFragment

<h1>
  Bancaire <br> <hr>
</h1>
<div class="row">
  <div class="bankingcolumn">
    <p> <span class="name"> Nom complet </span> <br> <span class="value"> ---- </span> </p>
    <p> <span class="name"> Ville </span> <br> <span class="value"> ---- </span> </p>
    <p> <span class="name"> Date de naissance </span> <br> <span class="value"> ---- </span> </p>
    <p> <span class="name"> NAS </span> <br> <span class="value"> ---- </span> </p>
  </div>
  <div class="bankingcolumn">
    <p> <span class="name"> Téléphone domicile </span> <br> <span class="value"> ---- </span> </p>
    <p> <span class="name"> Téléphone travail </span> <br> <span class="value"> ---- </span> </p>
    <p> <span class="name"> Nom de l'employeur </span> <br> <span class="value"> ---- </span> </p>
  </div>
</div>
<h4>Adresse</h4> 
<table style="width:100%">
  <tr>
    <th>Type d'adresse</th>
    <th>Pays</th> 
    <th>Code postal</th>
    <th>État</th>
    <th>Rue</th> 
    <th>Ville</th>
  </tr>
</table>
<br>

ContractDefaultFragment

<h1>
  Contrat <br> <hr>
</h1>
<p> <span class="name"> Numéro de contrat </span> <br> <span class="value"> ---- </span> </p>
<p> <span class="name"> Date du contrat </span> <br> <span class="value"> ---- </span> </p>
<br>

LetterDefaultFragment

<h1>
  Lettre <br> <hr>
</h1>
<p> <span class="name"> Date de la lettre </span> <br> <span class="value"> ---- </span> </p>
<p> <span class="name"> Lettre de </span> <br> <span class="value"> ---- </span> </p>
<p> <span class="name"> Lettre à </span> <br> <span class="value"> ---- </span> </p>
<br>

PriceDefaultFragment

<h1>
  Prix <br> <hr>
</h1>
<p> <span class="name"> Entreprise </span> <br> <span class="value"> ---- </span> </p>
<h4>Tableau des prix</h4> 
<table style="width:100%">
  <tr>
    <th>Désignation</th>
    <th>Prix unitaire</th> 
  </tr>
</table>

UiPath

Blue Prism

Automation Anywhere

WinActor

Appian

Pega

M-Files

Laserfiche

NX Manager

Créer un fragment

InvoiceDefaultFragment

BankingDefaultFragment

ContractDefaultFragment

LetterDefaultFragment

PriceDefaultFragment

​Créer un fragment

​InvoiceDefaultFragment

​BankingDefaultFragment

​ContractDefaultFragment

​LetterDefaultFragment

​PriceDefaultFragment

Créer un fragment

InvoiceDefaultFragment

BankingDefaultFragment

ContractDefaultFragment

LetterDefaultFragment

PriceDefaultFragment