odoo14 使用ir.actions.client 自定义弹窗内容

ir.actions.client 介绍

ir.actions.client 是odoo actions事件的一种,触发一个在客户端实现(即js文件中定义的函数,通过core.action_registry.add(tag,函数名) 注册到odoo中)动作

  • tag -- action在客户端的标识符,一般是一个专用的字符串,在js文件中注册该动作时指定。
  • params (可选) -- 用来传给客户端动作的,字典格式
  • target (可选) -- current:当前内容区打开action;fullscreen:以全屏模式打开;new:以新窗口打开。
  • context-- 作为额外数据,传递给客户端函数。

实现方式主要有一下几步:

1. 通过继承扩展的方式建立一个m_custome_list.js,里面主要是关联qweb视图,对qweb页面传递数据,渲染视图

在 项目目录/static/src/js 建立 m_custome_list.js 文件

  • m_custome_list.js
odoo.define('custom_page.demo', function (require) {
    "use strict";

    var AbstractAction = require('web.AbstractAction');
    var core = require('web.core');

    var CustomPageDemo = AbstractAction.extend({
        // 对某个类关联click事件
        events: {'click .demo-submit': '_onSubmitClick',
        'click .db_add_data': '_onAddData'},

        // 初始化,可以在action 里传入参数
        init: function (parent, action, option) {
            // 保存传递的参数
            this.params = action.params;
            this._super.apply(this, arguments);
        },

        // 渲染视图
        renderElement: function () {
            this._super.apply(this, arguments);
            // 渲染qwb 视图,并传值
            this.$('.o_content').html(
                core.qweb.render('DemoPage', {'params': this.params}));
        },

        _onSubmitClick: function (e) {
            e.stopPropagation();
            alert('Submit clicked!');
        },

        // 添加一条数据
        _onAddData: (e)=> {
            e.stopPropagation();
            window.alert('添加成功');
        },
    });

    // add方法对动作进行注册,第一个参数表示注册的动作名,第二个参数是要注册的动作对象;
    core.action_registry.add('custom_page.demo', CustomPageDemo);

    return CustomPageDemo;

});
2. 编写一个qweb视图,用来承载需要显示的数据样式

在 项目目录/static/src/xml 建立 m_custome_list.xml 文件

<?xml version="1.0" encoding="UTF-8"?>
<templates id="template" xml:space="preserve">

    <t t-name="DemoPage">
        <div style="margin:0 auto; text-align:center;" class="o_content">
            <table class="table table-striped">
                <tr>
                    <th>标题</th>
                    <th>内容</th>
                    <th>创建日期</th>
                </tr>
                <t t-foreach="params.contentList" t-as="item">
                    <tr>
                        <td><t t-esc="item.title"/></td>
                        <td><t t-esc="item.content"/></td>
                        <td><t t-esc="item.date"/></td>
                    </tr>
                </t>
            </table>

            <button type="button" class="db_add_data btn btn-primary">增加数据</button>
        </div>
    </t>

</templates>
3. 在需要显示client的model,调用显示client方法

model 调用client方法, 在model关联的xml视图页面,增加一个按钮,绑定show_list方法,也可以在任何方法中返回client和返回actions.window 一样

    def show_list(self):
        content_list = [
            {'title': '内容一', 'content': '我是内容一一,在想看看1', 'date': '2021-08-08'},
            {'title': '内容二', 'content': '我是内容二二,在想看看2', 'date': '2021-08-09'},
            {'title': '内容三', 'content': '我是内容三三,在想看看3', 'date': '2021-08-10'},
            {'title': '内容四', 'content': '我是内容四四,在想看看4', 'date': '2021-08-11'},
        ]
        info = {
            'title': '测试列表循环',
            'contentList': content_list
        }
        return {
            'type': 'ir.actions.client',
            'name': '列表信息',
            'tag': 'custom_page.demo',
            'params': info,
            'target': 'new',
        }
4. 加载自己写的m_custome_list.js文件

在 项目目录/views/ 建立 js_and_css.xml 文件, 用来加载自己写的js,别忘了在mainfast.py 中加载这个js_and_css.xml

<?xml version="1.0" encoding="UTF-8"?>
<odoo>
    <template id="assets_end" inherit_id="web.assets_backend">
        <xpath expr="." position="inside">
            <script src="/customtree/static/src/js/m_custome_list.js" type="text/javascript"/>
        </xpath>
    </template>
</odoo>

5. 在mainfast.py 中加载自己写的qweb文件 m_custome_list.xml
'data': [
        'security/ir.model.access.csv',
        'views/js_and_css.xml',
        'views/views.xml',
    ],
'qweb': [
        'static/src/xml/base.xml'
    ],
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 211,042评论 6 490
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 89,996评论 2 384
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 156,674评论 0 345
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,340评论 1 283
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,404评论 5 384
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,749评论 1 289
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,902评论 3 405
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,662评论 0 266
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,110评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,451评论 2 325
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,577评论 1 340
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,258评论 4 328
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,848评论 3 312
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,726评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,952评论 1 264
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,271评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,452评论 2 348

推荐阅读更多精彩内容