odoo的one2many底部自带了一套按钮:'保存并关闭','保存并新建','取消','移除' 但是如果有时候不想要自带的按钮怎么办呢?
首先想到的肯定是footer标签覆盖原来的footer标签,但是你会发现此时会出现两个可能的问题:
1.自定义的按钮渲染成功,但是点击按钮会连带把父级的form表单一起关闭
2.按钮渲染上去,但是点击不起作用
解决办法:
1.仍然是先添加footer标签覆盖原来的footer标签,不同的是,现在不直接写button,而是用widget去修改内容,如下:
<footer>
<widget name="apply_query_footer_button" />
</footer>
2.在static文件中加入apply_query_footer_button.html文件,内容如下:
<div id="apply_query_footer" v-show="mode" style="display: flex">
<div>
<el-button type="primary" @click="query_save">保存</el-button>
</div>
<div style="margin-left: 20px">
<el-button type="info" @click="query_cancel">取消</el-button>
</div>
</div>
3.后端模型中加入如下函数:
def get_apply_query_footer_html(self):
'''
获取供应商查询页面底部按钮的html
'''
path = BASE_DIR + '/' + '/static/vue_template/' + 'apply_query_footer_button' + '.html'
with open(path, 'r', encoding="utf8") as f:
content = f.read()
return content
4.最后一步,在static文件中新建js文件apply_query_footer_button.js,内容如下:
odoo.define('apply_query_footer_button', function (require) {
"use strict";
var Widget = require('web.Widget');
var widget_registry = require('web.widget_registry');
var data_manager = require('web.data_manager');
var session = require('web.session');
var apply_query_footer_button = Widget.extend({
// events: {
// 'click .apply_save': function (event) {
// var self = this;
// var action_id = $(event.currentTarget).attr("action");
// if (action_id) {
// data_manager.load_action(action_id).then(function (result) {
// result.res_id = self.id;
// self.do_action(result)
// })
// } else {
// this.do_action({
// name: '详情',
// type: 'ir.actions.act_window',
// view_type: 'form',
// view_mode: 'form',
// res_id: this.id,
// res_model: this.model,
// views: [[false, 'form']],
// target: $(event.currentTarget).attr("target") || 'current',
// context: {'edit': false},
// flags: {mode: 'readonly'}
// })
// }
// },
// 'click .apply_cancel': function (event) {
// debugger
// this.do_action({type: 'ir.actions.act_window_close'})
// },
//
// },
init: function (parent, options, params) {
this._super(parent, options, params);
},
start: function () {
var self = this;
var isEdit = false
if (self.__parentedParent.state.data.id) {
isEdit = false
} else {
isEdit = true
};
// this._super.apply(this, arguments).then(function () {
self._rpc({
model: 'standing_book.apply',
method: 'get_apply_query_footer_html',
args: [[self.res_id]]
}).then(function (html) {
setTimeout(function () {
self._replaceElement($(html));
new Vue({
el: '#apply_query_footer',
data() {
return {
name: '',
mode: isEdit,
}
},
methods: {
query_save:function () {
self.__parentedParent.__parentedParent.__parentedParent.form_view.saveRecord(self.__parentedParent.__parentedParent.__parentedParent.form_view.handle, {
stayInEdit: true,
reload: false,
savePoint: this.shouldSaveLocally,
viewType: 'form',
}).then(function (changedFields) {
// record might have been changed by the save (e.g. if this was a new record, it has an
// id now), so don't re-use the copy obtained before the save
var record = self.__parentedParent.__parentedParent.__parentedParent.form_view.model.get(self.__parentedParent.__parentedParent.__parentedParent.form_view.handle);
self.__parentedParent.__parentedParent.__parentedParent.on_saved(record, !!changedFields.length);
}).then(self.__parentedParent.__parentedParent.__parentedParent.close.bind(self.__parentedParent.__parentedParent.__parentedParent));
},
query_cancel: function () {
self.__parentedParent.do_action({type: 'ir.actions.act_window_close'})
}
}
})
}, 100)
})
// })
},
});
widget_registry.add('apply_query_footer_button', apply_query_footer_button);
return apply_query_footer_button
});
完成