odoo 开发入门教程系列-QWeb简史

QWeb简史

到目前为止,我们的房地产模块的界面设计相当有限。构建列表视图很简单,因为只需要字段列表。表单视图也是如此:尽管使用了一些标记,如<group><page>,但在设计方面几乎没有什么可做的。

然而,如果我们想给我们的应用程序一个独特的外观,就必须更进一步,能够设计新的视图。此外,PDF报告或网站页面等其他功能需要另一个更灵活的工具:模板引擎。

您可能已经熟悉现有的引擎,如Jinja(Python)、ERB(Ruby) 或Twig(PHP)。Odoo自带内置引擎:QWeb模板。QWeb是Odoo使用的主要模板引擎。它是一个XML模板引擎,主要用于生成HTML片段和页面。

你可能已经在Odoo见过 看板,其中的记录以卡片状结构显示。我们将为我们的房地产模块构建这样的视图。

一个具体的示例: 一个看板视图

参考: 本主题关联文档可以查看Kanban.

目标: 本节结束时创建一个房产的看板视图

odoo 开发入门教程系列-QWeb简史

在我们的地产应用程序中,我们希望添加一个看板视图来显示我们的房产。看板视图是标准的Odoo视图(如表单和列表视图),但其结构更灵活。事实上,每张卡片的结构是表单元素(包括基本HTML)和QWeb的混合。看板视图的定义与列表视图和表单视图的定义相似,只是它们的根元素是kanban。看板视图最简单的形式如下:

<kanban>
    <templates>
        <t t-name="kanban-box">
            <div class="oe_kanban_global_click">
                <field name="name"/>
            </div>
        </t>
    </templates>
</kanban>

让我们分解一下这个例子:

  • <templates>:定义QWeb 模板列表。看板视图必须至少定义一个根模板kanban-box,每个记录将呈现一次。
  • <t t-name="kanban-box"><t>是QWeb指令的占位符元素。在本例中,它用于将模板的name设置为kanban-box
  • <div class="oe_kanban_global_click">oe_kanban_global_click<div>可点击,以打开记录
  • <field name="name"/>:这向视图中添加name字段。

练习--制作一个最小的看版视图

根据上述提供的简单例子,为房产创建一个最小化的看板视图。唯一展示的字段为name.

提示: 必须在ir.actions.act_window对应的view_mode中添加 kanban

修改odoo14\custom\estate\views\estate_property_views.xml(注意:以下未展示文件中的所有内容,其它内容保持不变)

    <record id="link_estate_property_action" model="ir.actions.act_window">
        <field name="name">Properties</field>
        <field name="res_model">estate.property</field>
        <field name="view_mode">kanban,tree,form</field><--本次改动新增kanban-->
        <field name="context">{'search_default_state': True}</field>
    </record>
   
    <!-- 本次新增 -->
    <record id="estate_property_kanban" model="ir.ui.view">
        <field name="model">estate.property</field>
        <field name="arch" type="xml">
            <kanban>
                <templates>
                    <t t-name="kanban-box">
                        <div class="oe_kanban_global_click">
                            <field name="name"/>
                        </div>
                    </t>
                </templates>
            </kanban>
        </field>
    </record>

重启服务验证

odoo 开发入门教程系列-QWeb简史

一旦看板视图起作用, 我们可以开始改进它。如果我们想有条件的展示元素,可以使用 t-if指令(查看 Conditionals).

<kanban>
    <field name="state"/>
    <templates>
        <t t-name="kanban-box">
            <div class="oe_kanban_global_click">
                <field name="name"/>
            </div>
            <div t-if="record.state.raw_value == 'new'">
                This is new!
            </div>
        </t>
    </templates>
</kanban>

我们添加了几个东西:

  • t-if: 如果条件为真,渲染<div>元素
  • record: 拥有所有请求字段作为其属性的对象。每个字段都有两个属性 valueraw_value。前者是根据当前用户参数格式化的,后者则是直接通过read()读取的。

在上面的示例中,字段name被添加到<templates>元素中,但state在它之外。当我们需要字段的值但不想在视图中显示它时,可以将其添加到<templates>元素之外。

练习--改善看板视图

添加以下字段到看板视图:expected price, best price, selling price 和tags。注意:best price仅在收到报价时展示,而selling price仅在接受报价时展示

修改odoo14\custom\estate\views\estate_property_views.xml estate_property_kanban

    <record id="estate_property_kanban" model="ir.ui.view">
        <field name="model">estate.property</field>
        <field name="arch" type="xml">
            <kanban>
                <field name="state"/>
                <templates>
                    <t t-name="kanban-box">
                        <div class="oe_kanban_global_click">
                            <field name="name"/>
                            <field name="expected_price"/>
                            <!-- <field name="best_price" t-if="record.state.value == 'Offer Received'"/>-->
                            <div t-if="record.state.value == 'Offer Received'">
                                <field name="best_price"/>
                            </div>
                            <div t-if="record.state.value == 'Offer Accepted'">
                                <field name="selling_price" />
                            </div>
                            <field name="tag_ids"/>
                        </div>
                    </t>
                </templates>
            </kanban>
        </field>
    </record>

注意:这里必须添加<field name="state"/>,否则界面会报类似以下错误:

odoo TypeError: Cannot read properties of undefined (reading 'value')

验证效果

odoo 开发入门教程系列-QWeb简史

让我们对视图做最后的修改:默认情况下,财产必须按类型分组。您可能想看看Kanban中描述的各种选项。

练习--添加默认分组

使用合适的属性对房产分组,默认按类型分组。你必须阻止拖拽和删除。

修改odoo14\custom\estate\views\estate_property_views.xml estate_property_kanban,给<kanban>增加属性

            <kanban default_group_by="state" records_draggable="false">

验证效果

odoo 开发入门教程系列-QWeb简史

看板视图是一个典型的例子,说明从现有视图开始并对其进行微调而不是从头开始总是一个好主意。

参考链接

https://www.odoo.com/documentation/14.0/zh_CN/developer/howtos/rdtraining.html

https://fontawesome.dashgame.com/

原文链接:https://www.cnblogs.com/shouke/p/17253437.html

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:odoo 开发入门教程系列-QWeb简史 - Python技术站

(0)
上一篇 2023年4月22日
下一篇 2023年4月22日

相关文章

  • Python sklearn KFold 生成交叉验证数据集的方法

    Python中的机器学习库scikit-learn(sklearn)提供了KFold方法来生成交叉验证数据集,通过交叉验证评估模型预测性能。KFold方法将数据集划分为K个互斥子集,每次取其中一个子集作为验证集,其余K-1个子集作为训练集,循环K次验证模型。 下面是使用Python中的sklearn库进行KFold交叉验证数据集生成的步骤及示例说明: 步骤1…

    python 2023年6月3日
    00
  • 在Python中对具有多维系数的赫米特级数进行微分

    在Python中对多维系数的赫米特级数进行微分可以使用SymPy库来实现,具体攻略如下: 1. 安装SymPy库 在Python环境下安装SymPy库,可以使用pip命令:pip install sympy。 2. 导入并定义符号 导入SymPy库后,需要定义所需要的符号,使用符号可以让计算机知道需要在哪些变量上进行微分。 import sympy as s…

    python-answer 2023年3月25日
    00
  • 在python中实现调用可执行文件.exe的3种方法

    接下来我会详细讲解在Python中实现调用可执行文件.exe的三种方法。 方法一:使用Python自带的os模块 Python自带的os模块可以用来运行外部程序。通过将可执行文件路径传递给os.system()方法,我们就可以在Python中调用.exe文件。代码如下: import os os.system("path/to/your/execu…

    python 2023年5月30日
    00
  • python语言线程标准库threading.local解读总结

    Python语言线程标准库threading.local解读总结 为什么需要线程局部存储? 多线程编程时,会出现多个线程间共享同一个变量的情况,这时候就需要使用线程局部存储。 以常见的Web应用为例,比如Flask框架,在一个请求过程中,可能需要访问全局的数据库连接,但是如果多个请求同时进行时,就会出现线程安全问题。如果每个请求都带有自己的数据库连接,就不会…

    python 2023年5月19日
    00
  • pyppeteer执行js绕过webdriver监测方法上

    在本攻略中,我们将介绍如何使用pyppeteer执行JavaScript代码绕过webdriver监测方法。webdriver监测方法是一种常见的反爬虫技术,可以检测到使用Selenium等自动化测试工具进行网页操作的行为。我们可以使用pyppeteer库来模拟人类操作,绕过这种监测方法。 以下是一个完整攻略,包括两个示例。 步骤1:安装pyppeteer库…

    python 2023年5月15日
    00
  • Python计算矩阵的和积的实例详解

    Python计算矩阵的和积的实例详解 在计算机科学和数学中,矩阵和积是一种常见的运算操作。在Python中,我们可以使用NumPy库来计算矩阵的和积。 第一步:导入NumPy库 在使用NumPy库之前,我们需要先导入它。 import numpy as np 第二步:创建矩阵 在计算矩阵的和积之前,我们需要先创建两个矩阵。这里我们以两个二维数组为例。 a =…

    python 2023年6月5日
    00
  • 浅谈Python如何获取excel数据

    下面我就为您讲解如何使用Python获取Excel数据。 第一步:安装相关库 在使用Python获取Excel数据之前,我们需要安装相关的库。常用的库有: openpyxl:用于读写Excel文件; pandas:用于数据处理。 在安装之前,我们需要先打开cmd或者Anaconda Prompt,然后运行以下代码安装这两个库: pip install ope…

    python 2023年5月13日
    00
  • 基于Python实现迪杰斯特拉和弗洛伊德算法

    基于Python实现迪杰斯特拉和弗洛伊德算法的完整攻略 迪杰斯特拉和弗洛伊德算法是两种常用的图论算法,用于求解最短路径问题。在Python中,可以使用networkx和numpy库实现迪杰斯特拉和弗洛伊德算法。本文将详细讲解Python实现迪杰斯特拉和弗洛伊德算法的整个攻略,包括算法原理、Python实现过程和示例。 算法原理 迪杰斯特拉算法 迪杰斯特拉算法…

    python 2023年5月14日
    00
合作推广
合作推广
分享本页
返回顶部