如何在 QWeb 报告中显示图像？

Question

我扩展了 'report.external_layout_footer' qweb 视图以显示图像。

下面是我在文件 reports/external_layout.xml:

中的代码

    <template id="report_footer_custom" inherit_id="report.external_layout_footer">
        <xpath expr="//div[@class='footer']" position="replace">
            <div class="footer">
                    <img t-att-src="'data:image/jpeg;base64,/var/www/cbl_openerp/openerp/cap_addons/cap_sale/img/footer.jpeg'"/>
                    <ul class="list-inline">
                        <li>Page:</li>
                        <li>
                            <span class="page"/>
                        </li>
                        <li>/</li>
                        <li>
                            <span class="topage"/>
                        </li>
                    </ul>
                </div>
        </xpath>
    </template>

这是我的 openerp.py 内容：

...
"depends": ["base","sale","report"],
...
"data": ['sale.xml',
        'reports/reports.xml',
        'reports/external_layout.xml',
        'reports/informations_prestation.xml',
        'views/product_template.xml',
        'filter.xml'],
...
"images":['img/footer.jpeg',],
...

但是当我打印销售订单时，我无法在页面底部查看我的图片。

有人有什么建议吗？

Answer 1

只需尝试下面的代码并设置模块中的图像路径，然后运行它。

<template id="report_footer_custom"inherit_id="report.external_layout_footer">
    <xpath expr="//div[@class='footer']" position="replace">
        <div class="footer">
            <img class="img img-responsive" src="/sale_order_report/static/src/img/header.jpg"/>
            <ul class="list-inline">
                <li>Page:</li>
                <li><span class="page"/></li>
                <li>/</li>
                <li><span class="topage"/></li>
            </ul>
        </div> 
    </xpath>
</template>

我这边在 QWeb 报告自定义页脚中工作正常

Answer 2

如果您想使用非静态图像，您可以按照以下方法代替。

以公司标志为例：

<img
  t-attf-src="data:image/*;base64,{{company.logo}}"
  t-att-alt="company.name"
  />

使用 mime 类型 "image/*" 将允许您使用不同格式的图像，而不仅仅是 jpeg 或 png。

然后由于odoo默认渲染二进制数据为base64，你可以简单地在base64,之后追加图像的内容。

Answer 3

以下代码片段也适用于 QWeb 报告 (Odoo v10)。

<span t-field="o.product_id.image_medium" t-field-options="{'widget': 'image'}"/>

...其中 o.product_id.image_medium 是动态字段。

Answer 4

这适用于使用 odoo12 或近似版本的任何人。报告模块是 web 而不是 report。 Odoo 引入了样式化报告，此代码段扩展了其中的每一个。

<?xml version='1.0' encoding='utf-8'?>
<odoo>
    <data noupdate="0">
        <!-- The external layout background header -->
        <template id="external_layout_background_inherit" inherit_id="web.external_layout_background">

            <xpath expr="//div[@class='header']" position="replace">
                <div class="header">
                    <div class="o_background_header">
                        <div class="row" style="width: 100%; margin: 0 auto;">
                            <img src="extend_layout/static/src/img/header.jpg" style="width:100%;" />
                        </div>
                    </div>
                </div>
            </xpath>

        </template>

        <!-- The external layout boxed header -->
        <template id="external_layout_boxed_inherit" inherit_id="web.external_layout_boxed">

            <xpath expr="//div[@class='header']" position="replace">
                <div class="header">
                    <div class="o_boxed_header">
                        <div class="row" style="width: 100%; margin: 0 auto;">
                            <img src="extend_layout/static/src/img/header.jpg" style="width:100%;" />
                        </div>
                    </div>
                </div>
            </xpath>

        </template>

        <!-- The external layout clean header -->
        <template id="external_layout_clean_inherit" inherit_id="web.external_layout_clean">

            <xpath expr="//div[@class='header']" position="replace">
                <div class="header">
                    <div class="o_clean_header">
                        <div class="row" style="width: 100%; margin: 0 auto;">
                            <img src="extend_layout/static/src/img/header.jpg" style="width:100%;" />
                        </div>
                    </div>
                </div>
            </xpath>

        </template>

        <!-- The external layout standad header -->
        <template id="external_layout_standard_inherit" inherit_id="web.external_layout_standard">

            <xpath expr="//div[@class='header']" position="replace">
                <div class="header">
                    <div class="row" style="width: 100%; margin: 0 auto;">
                        <img src="extend_layout/static/src/img/header.jpg" style="width:100%;" />
                    </div>
                </div>
            </xpath>

        </template>

        <!-- Remove company address from the reports -->
        <template id="address_layout_inherit" inherit_id="web.address_layout">

            <xpath expr="//div[@class='address row']" position="replace">
                <div style="height: 50px;"></div>
            </xpath>

        </template>
    </data>
</odoo>

如何在 QWeb 报告中显示图像？

How to display an image in a QWeb report?

pdf

openerp

odoo

qweb