odoo15自定义小部件widget
添加自定义widget的步骤比较简单,以下三步就可以了:
1、JS实现widget的功能
/*
这个文件(文件名为my_basic_fields.js)要在__manifest__.py中设置,如下:
'assets': {
'web.assets_backend': [
'testaddons/static/src/js/my_basic_fields.js',
],
},
*/
odoo.define('testaddons.my_basic_fields_module', function(require){
var AbstractField = require('web.AbstractField');
var fieldRegistry = require('web.field_registry');
var ColorFields = AbstractField.extend({
className: 'o_field_orderOperate',
tagName: 'span',
isQuickEditable: true,
events: _.extend({}, AbstractField.prototype.events, {
'click': '_onClick',
}),
//处理单击事件
_onClick: function (event) {
event.preventDefault()
let self = this
},
//设置字段值
_renderReadonly: function () {
this.$el.text(this._formatValue(this.value));
},
//页面渲染,这里修改颜色和字体
_render: function () {
this.$el.data('value', this.value).css('color', '#CC6633').
css('font-size', '20px');
return this._super.apply(this, arguments);
}
})
//注册widget,注册后的widget将可以在视图xml中被字段引用,引用格式为:widget="my_basic_fields_widget"
fieldRegistry.add('my_basic_fields_widget', ColorFields);
})
2、在视图中引用,view视图的设置如下:
<field name="name" widget="my_basic_fields_widget"/>
3、设置__manifest__.py,这里是ODOO15的方法
'assets': {
'web.assets_backend': [
'testaddons/static/src/js/my_basic_fields.js',
],
},
实现效果如下: