Webkit Report Engine
Webkit és un motor de renderitzat d'html. La idea de OpenERP és utilitzar webkit per renderitzar html i css, donant format als informes i després descarregar un pdf per a imprimir. Per poder fer aixó, necessita el programa wkhtmltopdf.
Instal·lació en Ubuntu
Aquest manual és per a Ubuntu 14.04 o Debian Wheezy
- El wkhtmltopdf oficial d'Ubuntu falla amb OpenERP. Per tant, cal descarregar-lo de la web oficial:
# wget http://downloads.sourceforge.net/project/wkhtmltopdf/0.12.1/wkhtmltox-0.12.1_linux-wheezy-i386.deb # dpkg -i wkhtmltox-0.12.1_linux-wheezy-i386.deb
- A continuació, cal instal·lar el mòdul report_webkit.
- Cal dir a OpenERP on està el wkhtmltopdf. Cal anar a Configuracion -> Técnico -> Parámetros -> Parámetros del sistema i crear una nova clau webkit_path amb la ruta absoluta del wkhtmltopdf.
- És recomanable fer els nous mòduls en un directori diferent al oficial d'OpenERP. Per tant, es recomana afegir una ruta al addons_path:
# nano /etc/openerp/openerp-server.conf
Afegir:
addons_path = /usr/lib/pymodules/python2.7/openerp/addons,/opt/openerp-custom/addons
- Es reinicia el servici openerp
Informes d'exemple
Crear els nostres informes
Per a crear un infome, cal utilitzar una plantilla mako. També necessitem declarar el report en un xml.
En el cas de l'exemple de school del DIA, aquest sería un informe bàsic per als estudiants:
__openerp__.py:
...
"update_xml" : ['school_view.xml', 'school_report.xml'],
...
school_report.xml
<?xml version="1.0" encoding="utf-8"?>
<openerp>
<data>
<report id="school.report_student"
name="school.student.webkit"
auto="False"
model="school.student"
file="school/report/student.mako"
string="Student"
report_type="webkit"/>
</data>
</openerp>
report/student.mako
<html>
<head>
<style type="text/css">
${css}
div.header {
border-bottom: 2px solid black;
width: 100%;
}
span.header {
display: inline-block;
text-align: left;
font-size: 12;
font-weight: bold;
padding-left: 6px;
}
div.list {
page-break-inside: avoid;
width: 100%;
border-bottom:1px solid gray;
}
span.list {
display: inline-block;
text-align: left;
font-size: 12;
padding-right: 6px;
vertical-align: middle;
margin-top: 7px;
padding-bottom: 2px;
page-break-inside: avoid;
min-height: 30px;
}
</style>
</head>
<body>
%for o in objects :
<div class="address">
<b>${o.name |entity}</b><br/>
%if o.surname :
${o.surname or ''}<br>
%endif
%if o.IDNum :
${o.IDNum or ''}<br>
%endif
<div class="header">
<span class="header" style="width: 40%;">${_("Description")}</span>
<span class="header" style="width: 10%;">${_("Subject")}</span>
<span class="header" style="width: 10%;">${_("Hours Total")}</span>
<span class="header" style="width: 20%;">${_("Website")}</span>
<span class="header" style="width: 10%;">${_("Date")}</span>
</div>
%for line in o.subscriptions :
<div class="list">
<span class="list" style="width: 40%;">${line.name}</span>
<span class="list" style="width: 10%;">${line.subject}</span>
<span class="list" style="width: 10%;">${line.hours_total}</span>
<span class="list" style="width: 20%;">${line.website}</span>
<span class="list" style="width: 10%;">${line.date}</span>
</div>
%endfor
</div>
%endfor
</body>
</html>
Crear Capçaleres i peus
Les capçaleres i els peus són independents del contigut en webkit. Per això, cal crear la capçalera, el peu i els logos.
En primer lloc, cal fer referència al mòdul de webkit per crear les capçaleres i que puguen ser instal·lades:
__openerp__.py:
"depends" : ['base','report_webkit'],
...
"update_xml" : ['school_view.xml', 'school_report.xml', 'report/header_school.xml'],
A continuació, en l'XML del report, cal fer referència a la base:
school_report.xml
webkit_header="school.school_report_header"
Després es crea el fixer header_school.xml. Podem utilitzar els exemples com a base per a modificar.
Si volen un logo personalitzat ha d'estar en base64 com una data més del model ir.header_img
Un XML per a definir els headers ha de ser un record amb els següents camps:
<record id="championship_report_header" model="ir.header_webkit">
<field name="name">Example Report Header</field>
<field name="orientation">Portrait</field>
<field name="format">A4</field>
<field eval="55.0" name="margin_top"/>
<field eval="0.0" name="margin_bottom"/>
<field name="footer_html"><![CDATA[ (html del peu de pàgina) ]]></field>
<field name="html"><![CDATA[ (html de la capçalera i del cos)]]></field>
<field name="css"><![CDATA[ (css) ]]></field>
</record>
Es pot afegir javascript en el html o footer. Però el resultat és un PDF, per tant el javascript no pot ser interactiu.
La orientació pot ser Portrait o Landscape i el format:
A0 A0 5 841 x 1189 mm
A1 A1 6 594 x 841 mm
A2 A2 7 420 x 594 mm
A3 A3 8 297 x 420 mm
A4 A4 0 210 x 297 mm, 8.26 x 11.69 inches
A5 A5 9 148 x 210 mm
A6 A6 10 105 x 148 mm
A7 A7 11 74 x 105 mm
A8 A8 12 52 x 74 mm
A9 A9 13 37 x 52 mm
B0 B0 14 1000 x 1414 mm
B1 B1 15 707 x 1000 mm
B2 B2 17 500 x 707 mm
B3 B3 18 353 x 500 mm
B4 B4 19 250 x 353 mm
B5 B5 1 176 x 250 mm, 6.93 x 9.84 inches
B6 B6 20 125 x 176 mm
B7 B7 21 88 x 125 mm
B8 B8 22 62 x 88 mm
B9 B9 23 33 x 62 mm
B10 :B10 16 31 x 44 mm
C5E C5E 24 163 x 229 mm
Comm10E Comm10E 25 105 x 241 mm, U.S. Common 10 Envelope
DLE DLE 26 110 x 220 mm
Executive Executive 4 7.5 x 10 inches, 190.5 x 254 mm
Folio Folio 27 210 x 330 mm
Ledger Ledger 28 431.8 x 279.4 mm
Legal Legal 3 8.5 x 14 inches, 215.9 x 355.6 mm
Letter Letter 2 8.5 x 11 inches, 215.9 x 279.4 mm
Tabloid Tabloid 29 279.4 x 431.8 mm
Insertar imatges
El webkit accepta logos predefinits e imatges de la base de dades.
Els logos es guarden en base64 en el model ir.header_img. Per guardar un logo es pot incluir en el XML del header, per exemple amb aquesta sintaxi:
<record id="ir_header_img_championlogo" model="ir.header_img">
<field name="name">champion_logo</field>
<field name="type">png</field>
<field name="img">iVBORw0KGgoAAAANSUhEUgAAAMgAAAEbCAYAAACfhcurAAAABmJLR0QAAAAAAAD5Q7t/AAAACXBI
WXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3go
.......... La resta del base64 del logo ...................
</field>
</record>
Una vegada guardat el logo en la base de dades és accesible en la secció logos de webkit del menú configuració.
Per insertar el logo en el mako o en la plantilla header s'ha d'utilitzar el següent helper:
${helper.embed_logo_by_name('champion_logo')}
Però si volem insertar imatges que estàn guardades en la base de dades, hem de fer una etiqueta <img> amb base64:
<img src="data:image/png;base64,[${o.logo}]" />
No és fàcil insertar una imatge directament amb l'etiqueta img i src típiques de HTML ja que és una plantilla mako interpretada per un mòdul de python i les rutes relatives al mòdul no van. Si fiquem la ruta absoluta en el sistema si que funciona, però el mòdul no seria portable. Per tant, si volem imatges fixes podem necessitar ficar-les com a logo de webkit.
Enllaços
http://help.openerp.com/question/4724/how-to-configure-webkit-for-v7/