QWeb is a template engine used by Odoo. It is XML based and is used to generate HTML fragments and pages. QWeb was rst introduced in version 7.0 to enable richer kanban views, and with version 8.0, is also used for report generation and CMS website pages.

Qweb是一个用于Odoo的模板引擎。它基础XML用来生成HTML片段和页面。Qweb首先在7.0版本中引入，用来启用富公告栏视图，在8.0版本中用左生成报告以及CMS网站的页面。

Here you will learn about the QWeb syntax and how to use it to create your own kanban views and custom reports.

这里和你会学到QWeb语法，以及如何使用它来创建自己的公告栏视图和自定义报告。

To understand kanban boards, kanban is a word of Japanese origin that is used to represent a work queue management method. It takes inspiration from the Toyota Production System and Lean Manufacturing, and has become popular in the software industry with its adoption in Agile methodologies.

你需要理解kanban board，kanban是一个源自日本的用来表现工作队列管理方法的单词。它从Toyota的生产－高效制造管理系统中启发而来，而且它日益在软件工业中流行开来，以便适应敏捷开发。

The kanban board is a tool to visualize the work queue. Work items are represented by cards that are organized in columns representing the stages of the work process. New work items start on the left-most column and travel through the board until they reach the right-most column, representing completed work.

公告板是一个用来形象化工作队列的工具。

Getting started with kanban board

The simplicity and visual impact of kanban board make them excellent to support simple business processes. A basic example of a kanban board can have three columns, as shown in the following image: “To Do,” “Doing,” and “Done,” but it can of course be extended to whatever speci c process steps we may need:

img:omit
Photo credits: A Scrum board suggesting using kanban by Jeff.lasovski. Courtesy of Wikipedia.

Kanban views are a distinctive Odoo feature, making it easy to implement these boards. Let’s learn how to use them.

Kanban views

In form views, we use mostly speci c XML elements, such as and , and few HTML elements, such as

or . With kanban views, it’s quite the opposite; they are HTML-based templates and support only two Odoo-speci c elements, and .

The HTML can be dynamically generated using the QWeb template engine. It
processes special tag attributes in HTML elements to produce the nal HTML to be
presented in the web client. This brings a lot of control on how to render the content, but also make view design a more complex.

Kanban views are so exible that there can be many different ways to design them, and it can be hard to provide a recipe to follow. A good rule of thumb is to nd an existing kanban view similar to what we want to achieve, and create our new kanban view work based on it.

Looking at the kanban views used in the standard modules, it’s possible to identify two main kanban view styles: vignette and card kanbans.

Examples of vignette style kanban views can be found for Customers, Products, and also Apps & Modules. They usually have no border and are decorated with an image on the left-hand side, as shown in the following image:

img:omit

The card style kanban is usually used to display cards organized in columns for
the process stages. Examples are CRM Opportunities and Project Tasks. The main content is displayed in the card top area and additional information can be displayed in the bottom-right and bottom-left areas, as shown in the following image:

img:omit

We will see the skeleton and typical elements used in both styles of views so that you can feel comfortable adapting them to your particular use cases.

Design kanban views

First thing is to create a new module adding our kanban views to to-do tasks. In a real-world work, situation using a module for this would probably be excessive and they could perfectly well be added directly in the todo_ui module. But for a clearer explanation, we will use a new module and avoid too many, and possibly confusing, changes in already created les. We will name it todo_kanban and create the usual initial les as follows:

1. $ cd ~/odoo-dev/custom-addons
2. $ mkdir todo_kanban
3. $ touch todo_kanban/__init__.py

Now, edit the descriptor le todokanban/_openerp.py as follows:

1. {'name': 'To-Do Kanban',
2. 'description': 'Kanban board for to-do tasks.',
3. 'author': 'Daniel Reis',
4. 'depends': ['todo_ui'],
5. 'data': ['todo_view.xml'] }

Next, create the XML le where our shiny new kanban views will go and set kanban
as the default view on the to-do task’s window action, as shown in the following:

1. <?xml version="1.0"?>
2. <openerp>
3. <data>
4. <!-- Add Kanban view mode to the menu Action: -->
5. <act_window id="todo_app.action_todo_task"
6. name=" To-Do Tasks"
7. res_model="todo.task"
8. view_mode="kanban,tree,form,calendar,gantt,graph"
9. context="{'search_default_filter_my_tasks': True}" />
10. <!-- Add Kanban view -->
11. <record id="To-do Task Kanban" model="ir.ui.view">
12. <field name="name">To-do Task Kanban</field>
13. <field name="model">todo.task</field>
14. <field name="arch" type="xml">
15. <!-- Empty for now, but the Kanban will go here! -->
16. </field>
17. </record>
18. </data>
19. </openerp>

Now we have in place the basic skeleton for our module. The templates used in kanban views and reports are extended using the regular techniques used for other views, for example using XPATH expressions. See Chapter 3, Inheritance – Extending Existing Applications, for more details.

Before starting with the kanban views, we need to add a couple of elds to the to-do
tasks model.

Priority and kanban state 优先级和看板状态

The two fields that are frequently used in kanban views are priority and kanban state. Priority lets users organize their work items, signaling what should be addressed first. Kanban state signals whether a task is ready to move to the next stage or is blocked for some reason. Both are supported by selection elds and have speci c widgets to use on forms and kanban views.

在看板视图中有两个字段经常使用，优先级和看板状态。优先级让用户组织自己的工作事项，信号应该首先被定位。看板状态信号确认任务是否做好了进行下一步的准备，或者是因为某些原因被禁止了。这两个被选择字段都可以在表单和看板视图中使用指定的部件。

To add these fields to our model, we will add a todo_kanban/todo_task.py file, as shown in the following:

要将这些字段添加到模型，如下所示，我们会添加一个todo_kanban/todo_task.py文件：

1. from openerp import models, fields
2. class TodoTask(models.Model):
3. _inherit = 'todo.task'
4. priority = fields.Selection(
5. [('0', 'Low'), ('1', 'Normal'), ('2', 'High')],
6. 'Priority', default='1')
7. kanban_state = fields.Selection(
8. [('normal', 'In Progress'),
9. ('blocked', 'Blocked'),
10. ('done', 'Ready for next stage')],
11. 'Kanban State', default='normal')

Let’s not forget the todo_kanban/__init__.py le that will load the preceding code:

1. from . import todo_model

Kanban view elements 看板视图元素

The kanban view architecture has a top element and the following basic structure: