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',
        ],
    },

实现效果如下：