Versões comparadas

Versão antiga 1

changes.mady.by.user Sabrina Zimmermann

Gravado em

comparado com

Nova versão 2

changes.mady.by.user Rodrigo Nicolás González

Gravado em

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.





AR - Diseñador de comprobantes



Contenido

Índice


Descripcion

Fiscal Flow ofrece la posibilidad de diseñar los comprobantes a disponibilizar a los clientes, definiendo plantillas en formato HTML.

...

Al acceder a la opción "Detalle" se puede ver la información original y la resultando, identificándose en forma resaltada los datos modificados. Es especialmente útil para recuperar las versiones anteriores de una plantilla modificada, si al hacer cambios no obtuvimos los resultados esperados.

HTML y XML

Esta opción está disponible para cada plantilla del listado y permite definir el contenido del comprobante.
  

                                          Image RemovedImage Added


La información se solicita en dos secciones:

  • Primer recuadro: Estilos: tanto el comprobante PDF como el HTML, deberán poseer estilos en formato CSS, respetando la siguiente plantilla:

    Bloco de código
    languagexml
    <html lang="es">
	<head>
		<style>
			<!--todos los estilos-->
		</style>
	</head>
	<body>
		{body}
	</body>
</html>


  • Segundo recuadroSeccion XML: detalle del comprobante en HTML. Permite definir una estructura de encabezado-cuerpo-pie de página. La estructura básica es la siguiente:

    <header>
        <table class="table-container">
        <!CONTENIDO DE LA CABECERA>
        </table>
    </header>

    <body>
        <table class="table-container">
        <!CONTENIDO DEL CUERPO>
        </table>
    </body>

    <footer>
        <table class="table-container">
        <!CONTENIDO DEL PIE DE PAGINA>
        </table>
    </footer>

    NOTA: No remover los tags: <header/>, <body /> y <footer/> ya que permiten la correcta segmentación de las partes del comprobante dentro del PDF generado.

    Adicionalmente se pueden incluir los lo siguientes tags, para modelar el contenido del comprobante:

    <table>

    Representa una tabla, igual que en HTML, y puede tener los siguientes atributos:

    • class: nombre del estilo.

    <row>

    Representa una fila dentro de una tabla, es en HTML, el atributo TR y debe ir siempre dentro de un tag table, y puede tener los siguientes atributos:

    • class: nombre del estilo.
    • itemsHeader: significa que es la cabecera de la tabla de items, que debe reperitse por cada página.
    • filter: en caso de que no quiera mostrarse la sección bajo determinada condición. Posee 3 componentes:
      • el atributo por el cual filtrar: puede ser cualquier atributo recibido en la colección documentInfo, del fiscalDocument
      • el comparador: 
        • eq para IGUAL
        • ne para DISTINTO
      • el valor con el cual comparar.

    En el caso de que no se reciba el atributo utilizado en el filter o que no tenga valor, se oculta el row.

    Ejemplos:

    • Mostrar una sección si es cliente fidelidado.
      • Para eso, debería haber enviado un tag "clienteFidelizado" dentro de la colección documentInfo con un valor, por ejemplo, "true". 
      • El filtro sería: filter="clienteFidelizado:eq:true"
    • NO mostrar una sección si es cliente fidelidado.
      • Para eso, debería haber enviado un tag "clienteFidelizado" dentro de la colección documentInfo con un valor, por ejemplo: "true".
      • El filtro sería: filter = "clienteFidelizado:ne:true"
    • Mostrar la seccion si el cliente tiene dirección de envío (cualquiera sea).
      • Para eso, debería haber enviado un tag "dirección" dentro de la colección documentInfo con un valor, por ejemplo: "Av. Libertador 32056, Olivos, Buenos Aires".
      • El filtro sería: filter = "dirección:ne:**************************" (colocar cualquier valor que no se recibiría). Si se recibe cualquier cosa, menos estos asteriscos, se muestra el contenido)

    <column>

    Representa una columna dentro de una tabla, siempre va dentro de un atributo <row> es en HTML, el atributo TD, y puede tener los siguientes atributos:

    • class: nombre del estilo.
    • colspan: indica cuántas columnas ocupa, dentro de la fila, es el atributo colspan del tag td del html.

    <container>

    Representa un contenedor (un DIV), es en HTML, el atributo DIV, y puede tener los siguientes atributos:

    • class: nombre del estilo.

    <repeater>

    Representa una sección de la plantilla que se repite, basada en una colección, por ejemplo, items.

    Por ejemplo: 

    Bloco de código
    <repeater entity="fiscalDocument" prop="items" max="20" header="itemsHeader">
    • entity: la entidad:
      • items
      • paymentMethod
      • relatedTaxes
      • relatedOtherTaxes
      • optionals
      • relatedInvoices
    • prop: el atributo que se repetirá
    • max: la máxima cantidad de lineas por página
    • filter: en caso de que no quiera repetiese toda la colección, se agregará el tag filter, que posee 3 componentes:
      • el campo por el cual filtrar
      • el comparador (eq o ne)
      • Uno o mas valores separados por ";"
    • Ejemplo: filtrar registros cuyo campo code sea igual a 4 | filter="code:eq:4"
    • Ejemplo filtrar registros cuyo campo code NO sea igual a 4 | filter="code:ne:4"
    • Ejemplo: filtrar registros cuyo campo code sea 4 o 8 | filter="code:eq:4;8"

    <field>

    Representa un campo con información, puede ser de una entidad (por ejemplo, de la factura o el cliente) o simplemente un texto (label).

    Hay fields de distinto tipo, definidos por el tag "control". Para cada uno de ellos se utilizan distintos tags para modelar el comportamiento, siendo los comunes a todos:

    • control: define el tipo de field. Representa el tipo de contenido que se mostrará en el comprobante, pudiendo ser:
      • label: un texto, por ejemplo, el nombre del cliente, una dirección.
      • image: una imagen, por ejemplo el logo, el qr.
      • table: una tabla, por ejemplo, el listado de productos, detalle de descuentos.
    • class: nombre del estilo.

    • type: tipo de dato que se mostrará, trabaja en conjunto con el atributo "format", siendo disponibles las siguientes opciones:

      • string: un texto. Formatos disponibles:

        • left: rellena a izquierda con un valor definido. Ejemplo: Muestra el código del tipo de comprobante, completando con "0" a izquierda:

          • <field control="label" type="string" class="invoice-type-code" entity="invoiceType" prop="code" prefix="COD: " format="left.3.0"/>

        • replace: permite modificar un caracter por otro. Ejemplo: Muestra la cantidad de un ítem cambiando el signo "." por ","
          •  <field control="label" type="string" entity="item" prop="qty" format="replace/./,"/>

      • number: un numero. Formatos disponibles:

        • "negative": invierte el signo del número. 

        • Ejemplo: <field control="label" type="number" entity="relatedOtherTax" prop="aliquot" class="inline" prefix=" (" suffix=" %)" />

      • money: un importe. Aplica formato '$ 0,0.00'. Formatos disponibles:

        • "negative": invierte el signo del número. Ejemplo: importe de descuentos en negativo:

        • <field control="label" type="money" entity="fiscalDocument" prop="discountAmount" format="negative" />
      • date: una fecha, aplica formato DD/MM/YYYY. Ejemplo: Fecha del comprobante:
        • <field control="label" type="date" entity="fiscalDocument" prop="invoiceDate" prefix="Fecha: " class="company-header"/>
      • datetime: aplica formato DD/MM/YYYY HH:mm:ss
    • format: ver opciones diponibles según atributo "type".

    Campos de texto: <field control="label">

    Permite definir elementos de texto en el comprobante, cuyo valor puede provenir de una entidad o ser un texto fijo. En ambos casos requiere definir una entidad (tag "entity") y la propiedad de dicha entidad (tag "prop").

  • Para insertar un texto fijo, se utiliza el siguiente formato:

    <field control="label" type="string" entity="text" prop="Contenido a mostrar"/>


  • Para obtener el contenido de una entidad se debe definir el tag "entity", basadas en el contenido recibido al autorizar un comprobante (el listado completo de entidades y sus atributos se puede consultar en el detalle del servicio de autorización (Ver: FiscalFlow Server - Servicios Facturación electrónica , sección Servicio Factura Electrónica> Servicios específicos> authorize > Request)
    • tag entity: opciones disponibles
      • company: datos de la compañía.
      • channel: datos de la unidad de negocio.
      • store: datos de la tienda.
      • fiscalDocument: comprobante.
      • invoiceType: datos del tipo de comprobante.
      • customer: datos del cliente.
      • taxCategory: categoría impositiva del cliente
      • documentType: datos del tipo de documento del cliente
      • relatedTax: impuesto.
      • relatedOtherTax: otros impuestos.
      • promotion: promociones
      • benefit: benficios.
      • paymentMethod: medios de pago.
      • optional: opcionales
      • relatedInvoice: comprobantes asociados.
    • tag prop: es el atributo de la entidad que queremos mostrar. Ejemplo, fiscalDocument.authorizationCode para mostrar el CAE o customer.businessName para mostrar el cliente.

...

  • Promociones. Ejemplo:

    • <field control="table" type="string" entity="fiscalDocument" prop="discountSummary" format="negative"/>/>

      El tag format es opcional, de no informarse se muestran los importes sin signo.

      El estilo de este componentes se puede editar en:

      .table-discounts{
          float:left;
      }


Campos Calculados

        Permite realizar operaciones aritméticas entre campos. Las operaciones permitidas son Suma, resta, multiplicación y división ( +, -, * y /). Para poder realizar operaciones entre dos o mas campos se deberá indicar en el atributo entity = "math" y en el valor value la operación de los campos a realizar, por ejemplo:

                        <field entity="math" value="item.qty * item.unitPrice" type="money"/>

Tener en cuenta que si queremos realizar operaciones en campos donde existe mas de un registro, como puede llegar a ser los items, debe estar contenido dentro de un   <repeater> como se explico anteriormente, por ejemplo:

   <repeater entity="fiscalDocument" prop="items" max="15">

               <field entity="math" value="item.qty * item.unitPrice" type="money"/>

    </repeater>

Boton descarga PDF

Se podra incluir en los template que llegan por email (Template QR HTML), un boton el cual permitirá descargar el PDF del comprobante.

Para poder incluirlo se deberan agregar el atributo control="button" y  download="pdf".

Por ejemplo:

    <field control="button" label="Descargar PDF" download="pdf"/> 

En el atributo label se le podrá indicar el nombre del boton.

Ejemplo de boton en envio de mail:


Image Added