Daftar Isi

1. Pengantar QWEB dan Odoo
2. Memahami Struktur Template QWEB
3. Membuat Template Laporan Sederhana
4. Menampilkan Konten Dinamis
5. Styling dan Layout Laporan
6. Penggunaan Loop dan Kondisi
7. Integrasi Data dari Model Odoo
8. Export Laporan ke PDF
9. Tips dan Trik Membuat Laporan Profesional
10. Penutup dan Sumber Belajar

1. Pengantar QWEB dan Odoo

QWEB adalah engine templating yang digunakan oleh Odoo untuk membuat laporan dan tampilan web yang dinamis dan fleksibel. Dengan QWEB, Anda dapat membuat laporan yang dapat disesuaikan dengan kebutuhan bisnis Anda, mulai dari faktur, laporan keuangan, hingga dokumen internal lainnya.

Odoo sendiri adalah platform ERP yang sangat populer dan modular, memungkinkan integrasi berbagai aplikasi bisnis dalam satu sistem. Memahami QWEB adalah kunci untuk memaksimalkan kemampuan laporan di Odoo.

2. Memahami Struktur Template QWEB

Template QWEB menggunakan XML sebagai format dasar. Struktur utama terdiri dari tag t yang berfungsi sebagai container logika dan konten. Berikut adalah contoh struktur dasar template QWEB:

<template id="report_example">
  <t t-call="web.html_container">
    <t t-foreach="docs" t-as="doc">
      <div>
        <span><t t-esc="doc.name"/></span>
      </div>
    </t>
  </t>
</template>
      

Penjelasan:

• template: Mendefinisikan template QWEB dengan id unik.
• t-call: Memanggil template lain sebagai container.
• t-foreach: Looping untuk menampilkan data dinamis.
• t-esc: Menampilkan data dengan escape HTML.

3. Membuat Template Laporan Sederhana

Mari kita buat template laporan sederhana yang menampilkan daftar produk dengan nama dan harga.

<template id="report_product_list">
  <t t-call="web.html_container">
    <h2>Daftar Produk</h2>
    <table class="table table-sm">
      <thead>
        <tr>
          <th>Nama Produk</th>
          <th>Harga</th>
        </tr>
      </thead>
      <tbody>
        <t t-foreach="docs" t-as="product">
          <tr>
            <td><t t-esc="product.name"/></td>
            <td><t t-esc="product.list_price"/></td>
          </tr>
        </t>
      </tbody>
    </table>
  </t>
</template>
      

Template ini akan menampilkan tabel produk dengan dua kolom: nama dan harga.

4. Menampilkan Konten Dinamis

QWEB memungkinkan Anda menampilkan konten yang berubah sesuai data yang diterima. Misalnya, menampilkan status produk berdasarkan stok:

<t t-if="product.qty_available > 0">
  <span class="text-green-600">Tersedia</span>
</t>
<t t-else>
  <span class="text-red-600">Habis</span>
</t>
      

Dengan logika ini, laporan Anda akan lebih informatif dan interaktif.

5. Styling dan Layout Laporan

Anda dapat menambahkan kelas CSS untuk mempercantik laporan. Odoo sudah menyediakan beberapa kelas bawaan, namun Anda juga bisa menambahkan kelas Tailwind di template QWEB.

Contoh styling tabel dengan Tailwind:

<table class="min-w-full border border-gray-300 rounded-lg">
  <thead class="bg-gray-100">
    <tr>
      <th class="border border-gray-300 px-4 py-2 text-left">Nama Produk</th>
      <th class="border border-gray-300 px-4 py-2 text-right">Harga</th>
    </tr>
  </thead>
  <tbody>
    <t t-foreach="docs" t-as="product">
      <tr>
        <td class="border border-gray-300 px-4 py-2"><t t-esc="product.name"/></td>
        <td class="border border-gray-300 px-4 py-2 text-right"><t t-esc="product.list_price"/></td>
      </tr>
    </t>
  </tbody>
</table>
      

6. Penggunaan Loop dan Kondisi

Looping dan kondisi sangat penting untuk menampilkan data yang kompleks. Contoh penggunaan nested loop untuk menampilkan kategori dan produk:

<t t-foreach="categories" t-as="category">
  <h3><t t-esc="category.name"/></h3>
  <ul>
    <t t-foreach="category.products" t-as="product">
      <li><t t-esc="product.name"/> - <t t-esc="product.list_price"/></li>
    </t>
  </ul>
</t>
      

Anda juga bisa menggunakan t-if dan t-else untuk kondisi.

7. Integrasi Data dari Model Odoo

Data yang ditampilkan di QWEB berasal dari model Odoo. Anda harus memastikan data yang dikirim ke template sudah lengkap dan sesuai kebutuhan.

Contoh Python method untuk mengirim data produk ke laporan:

@api.model
def _get_report_values(self, docids, data=None):
    products = self.env['product.product'].browse(docids)
    return {
        'docs': products,
    }
      

Data docs ini kemudian bisa diakses di template QWEB.

8. Export Laporan ke PDF

Odoo secara otomatis dapat mengkonversi template QWEB menjadi PDF. Anda hanya perlu mendefinisikan report action yang mengarah ke template tersebut.

Contoh definisi report di XML:

<report
    id="action_report_product"
    model="product.product"
    string="Laporan Produk"
    report_type="qweb-pdf"
    name="module_name.report_product_list"
    file="module_name.report_product_list"
    print_report_name="'Laporan Produk - %s' % (object.name)"
/>
      

Setelah itu, laporan bisa dicetak langsung dari Odoo dalam format PDF.

9. Tips dan Trik Membuat Laporan Profesional

• Gunakan struktur template yang modular dengan t-call untuk reuse komponen.
• Manfaatkan CSS Tailwind untuk styling cepat dan konsisten.
• Selalu escape data dengan t-esc untuk keamanan.
• Gunakan loop dan kondisi untuk menampilkan data dinamis secara efektif.
• Uji laporan dengan berbagai data untuk memastikan tampilannya benar.
• Optimalkan performa dengan hanya mengirim data yang diperlukan ke template.

10. Penutup dan Sumber Belajar

Dengan menguasai QWEB di Odoo, Anda dapat membuat laporan yang tidak hanya informatif tapi juga menarik dan profesional. Teruslah belajar dan eksplorasi dokumentasi resmi Odoo serta komunitas untuk mendapatkan update dan trik terbaru.

Sumber belajar yang direkomendasikan:

• Dokumentasi Resmi QWEB Odoo
• Forum Komunitas Odoo
• Tutorial Video QWEB di YouTube