Odoo14 自定义widget小部件
阅读原文时间:2023年07月08日阅读:1

不多说先上源码。

1 odoo.define('my_company_users_widget', function (require) {
2 "use strict";
3
4 var AbstractField = require('web.AbstractField');
5 var fieldRegistry = require('web.field_registry');
6
7 var core = require('web.core');
8 var qweb = core.qweb;
9
10 var FieldCompanyUser = AbstractField.extend({
11 className: 'o_kanban_view',//当前控件使用的是哪个scss类。这个类里边包含了你所有使用到的样式。这样的好处是,你编写的小部件可移植变强
12 tagName: 'div',//设置你的根元素
13 supportedFieldTypes: ['many2many'],//设置你的小部件可以用在什么字段上。
14 events: {//这是事件。当点击了这个class元素的时候触发clickCard
15 'click .oe_kanban_global_click': 'clickCard',
16 },
17 init: function () {//初始化
18 this._super.apply(this, arguments);
19 },
20 _getImageURL: function (model, field, id, placeholder) {//这个方法是用生成访问图片的url
21 id = (_.isArray(id) ? id[0] : id) || null;
22 var isCurrentRecord = this.modelName === model && this.recordData.id === id;
23 var url;
24 if (isCurrentRecord && this.record[field] && this.record[field].raw_value && !utils.is_bin_size(this.record[field].raw_value)) {
25 // Use magic-word technique for detecting image type
26 url = 'data:image/' + this.file_type_magic_word[this.record[field].raw_value[0]] + ';base64,' + this.record[field].raw_value;
27 } else if (placeholder && (!model || !field || !id || (isCurrentRecord && this.record[field] && !this.record[field].raw_value))) {
28 url = placeholder;
29 } else {
30 var session = this.getSession();
31 var params = {
32 model: model,
33 field: field,
34 id: id
35 };
36 if (isCurrentRecord) {
37 params.unique = this.record.__last_update && this.record.__last_update.value.replace(/[^0-9]/g, '');
38 }
39 url = session.url('/web/image', params);
40 }
41 return url;
42 },
43 willStart: function () {//这里准备好你的数据
44 var self = this;
45 this.data_users = [];
46
47 var DataPromise = this._rpc({//调用model方法
48 model: 'res.groups',
49 method: 'get_company_users',
50 args: [[self.record.res_id],self.record.res_id]
51 }).then(function (result){
52 var i = 0;
53 for (i=0;i<result.length;i++){
54 result[i].image_url = self._getImageURL('res.users', 'image_128', result[i].id, '');
55 console.log(result[i].image_url);
56 };
57 self.data_users = result
58 console.log('result');
59 console.log(result);
60 });
61
62 return Promise.all([this._super.apply(this, arguments), DataPromise]);
63 },
64
65 _renderEdit: function () {
66 this.$el.empty();//这是编辑的时候显示内容。这里我将它置空了。所以在编辑的时候该控件直接不见了
67 },
68
69 _renderReadonly: function () {
70 this.$el.empty();//先置空控件内容。
71 var CompanyUsers = qweb.render('OWLFieldCompanyUsers', {widget: this});
72 this.$el.append(CompanyUsers);//重新添加控件内容
73
74 },
75 clickCard: function (ev) {//事件
76 var $target = $(ev.currentTarget);
77 var data = $target.data();
78 self = this;
79 this._rpc({
80 model: 'res.users',
81 method: 'get_userform_action',
82 args: [[data.val]]
83 }).then(function (result){
84 self.do_action(result);
85 });
86 }
87
88 });
89
90 fieldRegistry.add('company_users', FieldCompanyUser);//别忘记了注册你的widget
91
92 return {//最后公开你的小部件让其他视图可以使用
93 FieldCompanyUser: FieldCompanyUser,
94 };
95 });

1
2 3 4 5

6 7
8
9 Avatar 10
11
12
    13
  • 14
  • 15
  • 16 17
  • 18
  • 19
  • 20
21
22
23
24
25 26 27

1