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

这篇具有很好参考价值的文章主要介绍了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.toymoban.com/news/detail-420660.html

到了这里,关于odoo 开发入门教程系列-QWeb简史的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • odoo17 | Qweb模板简介

    到目前为止,我们的房地产模块的界面设计还相当有限。构建列表视图很简单,因为只需要字段列表。表单视图也是如此:尽管使用了几个标签,如 group标签或 page标签 ,但在设计方面几乎没什么可做的。 然而,如果我们想为我们的应用程序提供独特的外观,就必须更进一步

    2024年01月18日
    浏览(35)
  • 第3章_瑞萨MCU零基础入门系列教程之开发环境搭建与体验

    本教程基于韦东山百问网出的 DShanMCU-RA6M5开发板 进行编写,需要的同学可以在这里获取: https://item.taobao.com/item.htm?id=728461040949 配套资料获取:https://renesas-docs.100ask.net 瑞萨MCU零基础入门系列教程汇总 : https://blog.csdn.net/qq_35181236/article/details/132779862 本章目标: 搭建 Renesas 的

    2024年02月09日
    浏览(44)
  • 视频教程 | 长安链推出系列视频教程合集(入门)

    区块链技术脱离数字货币实现产业化应用的时间还相对短,处于逐步融入产业化发展的初期;同时区块链技术涉及到密码学、存储、网络、共识算法等多个领域,是一门跨学科、复合型的技术。“新”和“复合”使得部分开发者,尤其是刚开始面对数字化转型的行业开发者对

    2023年04月17日
    浏览(67)
  • ActiveMQ详细入门教程系列

    两个系统或两个客户端之间进行消息传送,利用高效可靠的消息传递机制进行平台无关的数据交流,并基于数据通信来进行分布式系统的集成。通过提供消息传递和消息排队模型,它可以在分布式环境下扩展进程间的通信。 消息中间件,总结起来作用有三个: 异步化提升性

    2024年02月15日
    浏览(45)
  • WPF入门教程系列一——基础

    一、 前言            最近在学习WPF,学习WPF首先上的是微软的MSDN,然后再搜索了一下网络有关WPF的学习资料。为了温故而知新把学习过程记录下来,以备后查。这篇主要讲WPF的开发基础,介绍了如何使用Visual Studio 2013创建一个WPF应用程序。 首先说一下学习WPF的基础知

    2024年02月07日
    浏览(51)
  • 【PyTorch教程】pytorch入门系列 ——土堆教程的目录及索引

    一、几句题外话 深度学习上手已经很长时间了,还记得最初的入门是跟着 B站up小土堆 的一步步学起来的,从起初的环境配置,到现在调整整个模型的进阶,非常感谢土堆的贡献。 写这个博客的初衷是为了自己 看着方便 ,由于多台电脑多个环境下查看这些内容很麻烦,所以

    2024年03月17日
    浏览(50)
  • 数据仓库系列:StarRocks 入门培训教程

    其它文章请参考 数据仓库系列:StarRocks 下一代高性能分析数据仓库的架构、数据存储及表设计 数据仓库系列:StarRocks的简单试用及与clickhouse的对比 数据仓库系列:如何将StarRocks集群与Jupyter集成? StarRocks 是一款MPP DB, 对标ClickHouse、Vertica、Teradata、Greenplum,在查询性能上远

    2024年02月11日
    浏览(69)
  • Midjourney学习系列之一 —— 保姆级入门教程

    继ChatGPT之后,AI绘图网站Midjourney也已经火出圈了。鉴于其强大的绘图能力和极低的使用门槛,Midjourney已经在事实上被各行各业的人作为辅助工具了,更重要的是,它绝对是一个非常理想的学习AI技术的引路人。 因此我在文章《一文了解AI绘图所有,含福利》中呼吁,每一个大

    2024年02月11日
    浏览(47)
  • WPF入门教程系列三十 ——DataGrid验证

    WPF入门教程系列目录 WPF入门教程系列二——Application介绍 WPF入门教程系列三——Application介绍(续) WPF入门教程系列四——Dispatcher介绍 WPF入门教程系列五——Window 介绍 WPF入门教程系列十一——依赖属性(一) WPF入门教程系列十五——WPF中的数据绑定(一)            DataG

    2024年02月12日
    浏览(37)
  • 【瑞萨零基础入门】瑞萨MCU零基础入门系列教程(更新连载中)

    得益于瑞萨强大的MCU、强大的软件开发工具(e² studio),也得益于瑞萨和RA生态工作室提供的支持,我们团队编写了《ARM嵌入式系统中面向对象的模块编程方法》,全书37章,将近500页: 讲解面向对象编程在单片机开发中的使用 结合FSP软件包实例分析外设驱动 讲解如何使用RASC配

    2024年02月09日
    浏览(42)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包