Relatórios em PDF¶

Às vezes, as tabelas não são reconhecidas adequadamente como tal devido a estruturas complexas. Nesses casos, você ainda pode modificá-las manualmente no XML do relatório. Por exemplo, com um pedido de vendas, você pode encontrar a seguinte estrutura no XML (simplificada para fins de documentação):

<!-- table root element -->
<table>
    <!-- thead = table header, the row with column titles -->
    <thead>
        <!-- table row element -->
        <tr>
            <!-- table header element -->
            <th>Name</th>
            <th>Price</th>
        </tr>
    </thead>
    <!-- table body, the main content -->
    <tbody>
        <!-- we create a row for each subrecord with t-foreach -->
        <tr t-foreach="record.some_relation_ids" t-as="line">
            <!-- for each line, we output the name and price as table cells -->
            <td t-out="line.name"/>
            <td t-out="line.price"/>
        </tr>
    </tbody>
</table>

Para modificar uma tabela, você deve garantir que cada linha tenha o mesmo número de células de dados. Por exemplo, no caso acima, é necessário adicionar uma célula na seção de cabeçalho (com, por exemplo, o título da coluna) e outra na seção de corpo com o conteúdo do campo (geralmente, com uma diretiva t-out ou t-field).

<table> <!-- table root element -->
    <thead> <!-- thead = table header, the row with column titles -->
        <tr> <!-- table row element -->
            <th>Name</th> <!-- table header element -->
            <th>Price</th>
            <th>Category</th>
        </tr>
    </thead>
    <tbody>  <!-- table body, the main content -->
        <tr t-foreach="record.some_relation_ids" t-as="line">  <!-- we create a row for each subrecord with t-foreach -->
            <td t-out="line.name"/>  <!-- for each line, we output the name and price as table cells -->
            <td t-out="line.price"/>
            <td t-out="line.category_id.display_name"/>
        </tr>
    </tbody>
</table>

Nota

As células podem abranger várias linhas ou colunas. Para obter mais informações, acesse o site da Mozilla Developer Network.

Por exemplo, você pode modificar o relatório de Cotação/Pedido para adicionar uma coluna para exibir a categoria do produto na tabela principal:

<table class="table table-sm o_main_table table-borderless mt-4">
    <!-- In case we want to repeat the header, remove "display: table-row-group" -->
    <thead style="display: table-row-group">
        <tr>
            <th name="th_description" class="text-start">Description</th>
            <th>Product Category</th>
            <th name="th_quantity" class="text-end">Quantity</th>
            <th name="th_priceunit" class="text-end">Unit Price</th>
[...]
            <tr t-att-class="'bg-200 fw-bold o_line_section' if line.display_type == 'line_section' else 'fst-italic o_line_note' if line.display_type == 'line_note' else ''">
                <t t-if="not line.display_type">
                    <td name="td_name"><span t-field="line.name">Bacon Burger</span></td>
                    <td t-out="line.product_id.categ_id.display_name"/>
                    <td name="td_quantity" class="text-end">
                        <span t-field="line.product_uom_qty">3</span>
                        <span t-field="line.product_uom">units</span>
                        <span t-if="line.product_packaging_id">

Para adicionar uma tabela em XML, você precisa saber os nomes dos campos e objetos que quer acessar e exibir. Como exemplo, vamos adicionar uma tabela que detalha os marcadores em um pedido de vendas:

<!-- table root element -->
<table class="table">
    <!-- thead = table header, the row with column titles -->
    <thead>
        <!-- table row element -->
        <tr>
            <!-- table header element -->
            <th>ID</th>
            <th>Name</th>
        </tr>
    </thead>
    <!-- table body, the main content -->
    <tbody>
        <!-- we create a row for each subrecord with t-foreach -->
        <tr t-foreach="doc.tag_ids" t-as="tag">
            <!-- for each line, we output the name and price as table cells -->
            <td t-out="tag.id"/>
            <td t-out="tag.name"/>
        </tr>
    </tbody>
</table>

Se quiser mostrar/ocultar conteúdo com base em condições específicas, você pode adicionar manualmente instruções de controle if/else no XML do relatório.

Por exemplo, se você quiser ocultar uma tabela de dados personalizada se não houver marcadores, poderá usar o atributo t-if para definir a condição, que é então avaliada como Verdadeira ou Falsa. A tabela não será exibida se não houver cotações na cotação.

<!-- table root element -->
<table class="table" t-if="len(doc.tag_ids) > 0">
    <!-- thead = table header, the row with column titles -->
    <thead>
        <!-- table row element -->
        <tr>
            <!-- table header element -->
            <th>ID</th>
            <th>Name</th>
        </tr>
    </thead>
    <!-- table body, the main content -->
    <tbody>
        <!-- we create a row for each subrecord with t-foreach -->
        <tr t-foreach="doc.tag_ids" t-as="tag">
            <!-- for each line, we output the name and price as table cells -->
            <td t-out="tag.id"/>
            <td t-out="tag.name"/>
        </tr>
    </tbody>
</table>

Se quiser exibir outro bloco caso a instrução t-if seja avaliada como Falsa, você poderá especificá-lo usando a instrução t-else. O bloco t-else deve seguir diretamente o bloco t-if na estrutura do documento. Não há necessidade de especificar nenhuma condição no atributo t-else. Como exemplo, vamos mostrar uma mensagem rápida explicando que não há marcadores na cotação:

<!-- table root element -->
<table class="table" t-if="len(doc.tag_ids) > 0">
    <!-- thead = table header, the row with column titles -->
    <thead>
        <!-- table row element -->
        <tr>
            <!-- table header element -->
            <th>ID</th>
            <th>Name</th>
        </tr>
    </thead>
    <!-- table body, the main content -->
    <tbody>
        <!-- we create a row for each subrecord with t-foreach -->
        <tr t-foreach="doc.tag_ids" t-as="tag">
            <!-- for each line, we output the name and price as table cells -->
            <td t-out="tag.id"/>
            <td t-out="tag.name"/>
        </tr>
    </tbody>
</table>
<div class="text-muted" t-else="">No tag present on this document.</div>

Ao usar a notação t-if/t-else, o editor de relatórios reconhece que essas seções são mutuamente exclusivas e devem ser exibidas como blocos condicionais:

Você pode alternar as condições usando o editor para visualizar o resultado:

Se quiser ter várias opções, você também pode usar as diretivas t-elif para adicionar condições intermediárias. Por exemplo, é assim que o título dos relatórios de pedidos de vendas muda com base na condição do documento subjacente.

<h2 class="mt-4">
    <span t-if="env.context.get('proforma', False) or is_pro_forma">Pro-Forma Invoice # </span>
    <span t-elif="doc.state in ['draft','sent']">Quotation # </span>
    <span t-else="">Order # </span>
    <span t-field="doc.name">SO0000</span>
</h2>

O título Fatura Pro-Forma é usado dependendo de algumas condições contextuais. Se essas condições não forem atendidas e a situação do documento for provisório ou enviado, será usada Cotação. Se nenhuma dessas condições for atendida, o título do relatório será Pedido.

Trabalhar com imagens em um relatório pode ser um desafio, pois o controle preciso sobre o tamanho e o comportamento da imagem nem sempre é óbvio. É possível inserir campos de imagem usando o editor de relatórios (usar o comando /Field), mas inseri-los em XML usando a diretiva t-field e os atributos t-options que a acompanham proporciona melhor controle de dimensionamento e posicionamento.

Por exemplo, o código a seguir gera o campo image_128 do produto da linha como uma imagem de 64px de largura (com uma altura automática baseada na proporção da imagem).

<span t-field="line.product_id.image_128" t-options-widget="image" t-options-width="64px"/>

As seguintes opções estão disponíveis para widgets de imagem:

• largura: largura da imagem, geralmente em pixels ou unidades de comprimento CSS (por exemplo, rem) (deixe em branco para largura automática).

• altura: altura da imagem, geralmente em pixels ou unidades de comprimento CSS (ex.: rem) (deixe em branco para altura automática).

• classe: Classes CSS aplicadas no marcador img; Classes do Bootstrap estão disponíveis.

• alt: texto alternativo da imagem

• estilo: atributo de estilo; permite que você substitua estilos mais livremente do que com as classes do Bootstrap.

Esses atributos devem conter cadeias de caracteres, ou seja, texto entre aspas dentro de aspas, por exemplo, t-options-width="'64px'" (ou, alternativamente, uma expressão Python válida).

Por exemplo, vamos adicionar uma coluna com a imagem do produto na tabela de cotação:

<table class="table table-sm o_main_table table-borderless mt-4">
    <thead style="display: table-row-group">
        <tr>
            <th>Image</th>
            <th name="th_description" class="text-start">Description</th>
            <th>Product Category</th>
            <th name="th_quantity" class="text-end">Quantity</th>
            <th name="th_priceunit" class="text-end">Unit Price</th>
[...]
        <t t-foreach="lines_to_report" t-as="line">
            <t t-set="current_subtotal" t-value="current_subtotal + line.price_subtotal"/>
            <tr t-att-class="'bg-200 fw-bold o_line_section' if line.display_type == 'line_section' else 'fst-italic o_line_note' if line.display_type == 'line_note' else ''">
                <t t-if="not line.display_type">
                   <td>
                       <span t-field="line.product_template_id.image_128"
                             t-options-widget="'image'"
                             t-options-width="'64px'"
                             t-options-class="'rounded-3 shadow img-thumbnail'"
                           />
                   </td>
                    <td name="td_name"><span t-field="line.name">Bacon Burger</span></td>
                    <td t-out="line.product_id.categ_id.display_name"/>

O atributo t-options-width restringe a largura da imagem a 64 pixels, e as classes o Bootstrap usadas em t-options-class criam uma borda semelhante a uma miniatura com cantos arredondados e uma sombra.