Passer au contenu principal
Les fragments HTML permettent d’afficher des parties de l’interface utilisateur utilisées dans un scénario de traitement de plusieurs documents. Pour créer un nouveau fragment, procédez comme suit :
  1. Dans Dev Studio, cliquez sur Records → Technical → HTML Fragment Create.
  2. Dans les champs Label et Identifier, saisissez la valeur suivante : InvoiceDefaultFragment.
  1. Cliquez sur Create and open.
  2. Dans le champ HTML Source, saisissez le code de votre fragment. Le code à utiliser pour chacun des fragments est indiqué ci-dessous.
Le code de tous les fragments se trouve également dans le dossier d’installation du connecteur, à l’emplacement %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>