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',
   # custom_page.demo就是前面js中定义的事件名
   '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'
    ],

前军教程网

中小站长与DIV+CSS网页布局开发技术人员的首选CSS学习平台

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