Desarrollo de PDFs#

En esta sección, encontrará plantillas disponibles, la estructura de archivos necesaria y la configuración requerida para crear sus propios documentos en formato pdf. Además, podrá encontrar ejemplos prácticos, sugerencias y mejores prácticas para mejorar la calidad de sus documentos.

Configuración del entorno#

Para comenzar el desarrollo de PDFs en Linkaform, es importante que prepare y configure su entorno de trabajo. Siga los siguientes apartados para más información.

Administración de Django#

La administración de Django es la interfaz que permite realizar operaciones CRUD (crear, leer, actualizar, borrar) con los registros de las formas. Para configurar la administración de Django, siga los siguientes pasos:

  1. Inicie sesión en prod Administración de Django o desde preprod Administración de Django .

Nota

Solicite a soporte técnico el acceso y las credenciales necesarias de la administración de Django.

El proceso de configuración en producción y preproducción es idéntico. Sin embargo, se recomienda iniciar la configuración en preproducción. Una vez finalizado y seguro de sus cambios, puede transferirlo a producción.

../../_images/pdf16.png

Una vez autenticado, se muestra la interfaz principal de la administración de Django. Observe que tiene acceso a una variedad de recursos, sin embargo, con el propósito de abordar el desarrollo de archivos PDF, la explicación se centra en la sección Pdfdocuments, que consta de dos elementos clave:

Opción

Descripción

Plantillas

Contiene todas las plantillas creadas en la plataforma.

Widgets

Proporciona plantillas adaptadas a los diferentes tipos de datos utilizados.
../../_images/pdf15.png

En cuanto a las plantillas, encontrará la siguientes opciones:

La opción Agregar permite configurar una nueva plantilla. Siga los siguientes pasos:

Name: Nombre de la plantilla.

Nota

Para el nombre de una plantilla se sigue el siguiente estándar:

[nombre_cliente] [-] [nombre_PDF]

Type:

  • Single Record (registro único): Plantilla que se centra en un solo conjunto de datos. Es decir, presenta información de un solo registro del formulario.

  • Multiple Records (múltiples registros): Plantilla para presentar información de múltiples registros pertenecientes al mismo formulario

Importante

Es obligatorio que seleccione el tipo de PDF. Aunque el proceso de configuración es el mismo, la programación difiere según el tipo seleccionado.

Paginate: Permite agregar paginación al documento. Es opcional ya que se puede personalizar en la programación.

../../_images/4.png

Description: Descripción breve que ayuda a diferenciar entre documentos.

Nota

La descripción de un documento está estandarizada con la siguiente notación:

[Template] [de] [nombre_PDF] [para] [nombre_cliente]

Default: Define la plantilla por defecto para la forma cuando no se ha seleccionado ninguna en la Configuración del pdf .

Atención

Este campo suele estar establecido en falso de manera predeterminada.

Header: Código del encabezado del documento en formato XML (requerido).

Body: Código del cuerpo del documento en formato XML (requerido).

Footer: Código del pie de página del documento en formato XML (requerido).

Style: Código de los estilos usados en formato XML (requerido).

Nota

Los campos relacionados al XML son archivos que se desarrollan según el requerimiento del boceto del cliente o el diseño realizado.

Owner: Nombre de la cuenta padre a la que se va asignar la plantilla.

Tip selector Owner

Debido a que el selector Owner contiene muchas opciones de cuentas de usuarios actuales, puede llevar tiempo buscar la cuenta de su interés entre tantas opciones. Para simplificar la búsqueda, siga estos pasos:

  1. Inspeccione la pagina haciendo clic derecho > Inspeccionar o presionando directamente F12.

  2. Presione la opción de seleccionar y ubíquese en la pestaña de Elements de la página para inspeccionar los elementos del DOM en la parte superior izquierda o presione directamente Ctrl + Shift + C.

../../_images/pdf22.png

  1. Haga clic en el selector de Owner.

../../_images/pdf19.png

  1. Abra el elemento que contiene a las opciones del selector.

../../_images/pdf20.png

  1. Presione Ctrl + F e ingrese el nombre o Valor del ID de la cuenta de su interés para buscar entre las opciones.

  2. Haga doble clic en la opción de su interés e ingrese la palabra selected y presione Enter. Automáticamente la opción sera seleccionada.

Importante

Revise que el ID de la opción corresponda a la cuenta de su interés.

../../_images/pdf21.png

La opción Modificar presenta una lista de plantillas existentes actualmente utilizadas por clientes de Linkaform. Para editar una plantilla, simplemente seleccione el nombre de la plantilla de su preferencia.

Para agregar y configurar una nueva plantilla presione la opción Agregar plantilla.

../../_images/pdf17.png

Para eliminar una plantilla, seleccione la casilla o casillas correspondientes y elija la opción en el selector, seguido del botón Ejecutar.

Advertencia

Tenga cuidado y verifique que haya seleccionado la plantilla correcta. Una vez ejecutada la acción, no podrá deshacerse.

../../_images/pdf18.png

Repositorio de PDFs#

El repositorio que contiene los PDFs actuales se encuentra en un repositorio de GitHub . Este repositorio es exclusivo para usuarios de Linkaform, utilice git para realizar cambios y contribuciones locales.

Ver también

Si aún no está familiarizado con Git, se recomienda que revise la documentación de git para obtener más detalles.

Siga las siguientes instrucciones para clonar el repositorio:

  1. Solicite acceso al repositorio de PDFs a través de soporte técnico.

  2. Ingrese al siguiente enlace y clone el repositorio.

  3. Clone directamente utilizando:

    git@github.com:linkaform/PDFTemplates.git

Truco

Se recomienda tener una carpeta exclusiva para repositorios pertenecientes a Linkaform.

Plantillas#

Para el desarrollo de un PDF, se requieren cuatro archivos: un encabezado, cuerpo, pie de página y un archivo de estilos.

Aunque es posible insertar el encabezado, pie de página y estilos directamente en el cuerpo del PDF, así como tener un único archivo de estilos para todos los PDFs de un cliente en específico, se recomienda separar los archivos para mantener un orden y cumplir con los requisitos del administrador de Django .

graph TB A(PDF) A --> B[header.xml] A --> C[body.xml] A --> D[footer.xml] A --> E[style.xml]

En el repositorio PDFTemplates, identifique la carpeta Básico, aquí podrá encontrar plantillas que servirán como base para la creación de nuevos PDFs.

Directory Tree
.
├── Básico
│   └── example_body.xml
│   └── example_footer.xml
│   └── example_header.xml
│   └── example_style.xml

Prudencia

El repositorio PDFTemplates contiene plantillas e información perteneciente a clientes de Linkaform. Si tiene acceso, es importante que considere que la información contenida es de suma importancia y confidencial. Por lo tanto, se solicita que tenga discreción con la información.

Si ya dispone con una carpeta, agregue los archivos necesarios para el nuevo PDF. De lo contrario, cree una nueva carpeta utilizando el nombre de la empresa o cliente como identificador y agregue los archivos necesarios dentro de ella.

Para nombrar a los archivos, utilice el nombre de la empresa o cliente seguido del tipo de archivo. Por ejemplo:

[nombre_cliente] [_] [tipo_archivo] [.xml]

Comercializadora_header.xml

Si dentro de su carpeta tiene más de un PDF, utilice el nombre del PDF seguido del tipo de archivo. Por ejemplo:

[nombre_pdf] [_] [tipo_archivo] [.xml]

gastos_body.xml
Directory Tree
.
├── Comercializadora Pánfilo
│   └── gastos_body.xml
│   └── gastos_footer.xml
│   └── gastos_header.xml
│   └── gastos_style.xml

Estructura de archivos#

Revise las siguientes secciones sobre la estructura de los archivos que componen un PDF. El código es genérico y puede ser utilizado para proyectos futuros según sea necesario.

Importante

En los siguientes ejemplos, observe que se utilizan etiquetas similares a HTML, estas pertenecen a RML. Consulte Report Markup Language (RML) en la documentación para obtener más detalles.

También encontrará líneas que contienen {% %} o {{ }}, las cuales representan etiquetas y variables del lenguaje de plantillas de Django. Para obtener más información consulte la sección Potenciando RML con Django en la documentación.

Estructura body#

El cuerpo del documento es la parte más importante. Similar a HTML, aquí se especifica la estructura de los elementos que compondrán al PDF, tales como tablas, imágenes, texto, etc.

El siguiente bloque de código solamente representa la configuración del documento, que incluyen propiedades como el tamaño de la página, márgenes, tipografía, etc. Sin embargo, para estructurar los elementos del PDF, deberá insertar su propio código entre las etiquetas <story> (líneas 40, 42).

Consejo

Dentro del bloque de código, asegúrese de revisar los comentarios para obtener más contexto sobre cómo se estructura y configura el documento PDF.

 1<?xml version="1.0"?>
 2<!-- Variables de Django - No se mueve-->
 3{% load PrintFields %}
 4{% load set_var %}
 5{% load custom_tags %}
 6<!-- Configuración del documento -->
 7<document filename="Example" xmlns:doc="http://namespaces.zope.org/rml/doc">
 8    <!-- Propiedades informativas del documento -->
 9    <pageInfo pageSize="(21cm,27.5cm)" doc:example="" />
10    <!-- Tipografía del documento -->
11    <docinit>
12        <registerTTFont faceName="Montserrat-Regular" fileName="/srv/backend.linkaform.com/infosync-api/backend/staticfiles/fonts/Montserrat-Regular.ttf" />
13        <registerTTFont faceName="Montserrat-Bold" fileName="/srv/backend.linkaform.com/infosync-api/backend/staticfiles/fonts/Montserrat-Bold.ttf" />
14        <registerTTFont faceName="Montserrat-BoldItalic" fileName="/srv/backend.linkaform.com/infosync-api/backend/staticfiles/fonts/Montserrat-BoldItalic.ttf" />
15    </docinit>
16    <!-- En Template se define el tamaño (pageSize) y margen de la página (frame y sus atributos) -->
17    <template pageSize="(22cm,28cm)" title="Examples" author="LinkaForm">
18        <pageTemplate id="first">
19            <frame id="first"    x1="1.5cm"   y1="1.5cm" width="19cm"   height="25cm"/>
20            <pageGraphics>
21                <setFont name="Montserrat-Regular" size="7.5"/>
22                <setFont name="Montserrat-Regular" size="8"/>
23                <!-- drawCenteredString - No se mueve -->
24                <drawCenteredString x="10.5cm" y="27.8cm">
25                {{direccion}}
26                </drawCenteredString>
27                <!-- Cabecera de documento (opcional) -->
28                {% Header company_logo parent user form Template meta %}
29                <!-- Pie del documento (opcional) -->
30                {% Footer user form Template meta %}
31            </pageGraphics>
32        </pageTemplate>
33    </template>
34    <!-- stylesheet - No se mueve -->
35    <stylesheet>
36        {% autoescape on %}
37        {{ Template.style|safe }}
38        {% endautoescape %}
39    </stylesheet>
40    <story>
41        <!-- Aquí va el código de los elementos del pdf -->
42        <para>Hello world</para>
43    </story>
44</document>

Estructura style#

El archivo style establece los parámetros estéticos necesarios para cada plantilla, definiendo aspectos como colores, dimensiones y otras características estéticas.

1<!-- Ejemplo de estilos básicos de una tabla -->
2<blockTableStyle id="general">
3<lineStyle thickness="0.5" kind="GRID" colorName="#cfd8dc" start="0,0" stop="-1,-1" />
4<blockAlignment value="center" start="0,0" stop="-1,-1"/>
5<blockValign value="middle"/>
6</blockTableStyle>