`

Tiskové šablony (Case Overview)

Sekce "Tisk" v šabloně procesu v aplikaci Team Assistant umožňuje uživatelům definovat a generovat rozvržení tisku pro různé dokumenty související s procesem, včetně Přehledu případů . Tato část podporuje přizpůsobení pomocí HTML & CSS nebo React.js (kombinace HTML a JavaScriptu).

Účel

Sekce "Tisk" se používá ke konfiguraci tisknutelných dokumentů pro proces, což zajišťuje, že uživatelé mohou generovat strukturované výstupy, které jsou v souladu s obchodními požadavky. Tato funkce je užitečná pro vytváření:

  • Shrnutí případů
  • Schvalovací formuláře
  • Zprávy
  • Další výstupy založené na dokumentech

Podporované technologie

  • HTML & CSS + Javascript : Pro jednoduché, statické rozvržení dokumentů.
  • React.js : Pro dynamické vykreslování obsahu, podmíněnou logiku a opakovaně použitelné komponenty.

Implementace

1. Přístup HTML a CSS

Pokud dáváte přednost statickému rozložení, použijte čisté HTML a CSS . Příklad:

<!DOCTYPE html>
 <html>
 <head>
 <style>
 body { font-family: Arial, sans-serif; }
 .header { font-size: 20px; font-weight: bold; }
 .content { margin-top: 10px; }
 </style>
 </head>
 <body>
 <div class="header">Case Overview</div>
 <div class="content">
 <p>Process Name: {processName}</p>
 <p>Case ID: {caseId}</p>
 </div>
 </body>
 </html>

Poznámka: Zástupné symboly jako {processName} a {caseId} budou nahrazeny skutečnými proměnnými procesu.

2. Přístup React.js

Pro pokročilejší rozvržení tisku umožňuje React.js podmíněnou logiku a opakovaně použitelné komponenty. Příklad:

import React from 'react';

 const PrintCaseOverview = ({ processName, caseId }) => {
 return (
 <div>
 <h1>Case Overview</h1>
 <p><strong>Process Name:</strong> {processName}</p>
 <p><strong>Case ID:</strong> {caseId}</p>
 </div>
 );
 };

 export default PrintCaseOverview;

Použití: Ujistěte se, že se komponenta vykresluje v prostředí, které podporuje React.js.

Konfigurace

Konfigurace sekce "Tisk":

  1. Přejděte na položku Šablona .
  2. Vyhledejte sekci Tisk .
  3. Vložte svůj vlastní kód HTML a CSS nebo React.js .
  4. Uložte a otestujte výstup, abyste zajistili správné formátování.

Nejlepší postupy

  • Udržujte rozvržení jednoduchá pro lepší tiskový výkon.
  • Použijte skripty pro vaše obecné komponenty.
  • Optimalizujte obrázky a písma pro čistou kvalitu tisku.
  • Pokud je vyžadován dynamický obsah nebo logika, použijte React.js .

Odstraňování problémů

Problém

Řešení

Obsah se nezobrazuje správně

Ujistěte se, že všechny zástupné symboly ( {variable} ) jsou správně nahrazeny skutečnými daty.

Styly tisku nebyly použity

K přizpůsobení vzhledu tisku použijte @media print v CSS.

Komponenta React se nevykresluje

Ujistěte se, že je React správně integrován do prostředí týmového asistenta.

Anna Gernát Updated by Anna Gernát

Contact

Team assistant (opens in a new tab)

Powered by HelpDocs (opens in a new tab)