Customize buttons and pass values in the tree view of odoo12
Code example:
template.xml:
<?xml version="1.0" encoding="UTF-8"?>
<template id="template" xml:space="preserve">
<t t-name="WageManageListView.employee_performance_manage">
<button type="button" class="btn btn-secondary employee_performance_manage_submit_review">
Batch Submit for Review
</button>
<button type="button" class="btn btn-secondary employee_performance_manage_review_confirmed" groups="wage_manage.performance_review_group">
Batch Confirm Review
</button>
</t>
<t t-extend="ListView.buttons" t-name="WageManageListView.employee_performance_manage_buttons">
<t t-jquery="button.o_list_button_add" t-operation="after">
<t t-js="ctx">
if (window.odoo._modules.indexOf("base_import") >= 0) {
r.push(context.engine.tools.call(context, 'ImportView.import_button', dict));
};
</t>
<t t-call="WageManageListView.employee_performance_manage"/>
</t>
</t>
</template>
Create the corresponding JS file, mainly to listen to the buttons defined above and operate the backend based on the triggered events.
odoo.define('employee.performance.manage.tree.button', function (require) {
"use strict";
let ListController = require('web.ListController');
let ListView = require('web.ListView');
let viewRegistry = require('web.view_registry');
let EmployeePerformanceManageViewController = ListController.extend({
buttons_template: 'WageManageListView.employee_performance_manage_buttons',
renderButtons: function () {
this._super.apply(this, arguments);
if (this.$buttons) {
var self = this;
// Submit for Review
this.$buttons.on('click', '.employee_performance_manage_submit_review', function () {
let view_type = self.viewType;
let actived_ids = [];
let state = self.model.get(self.handle, {raw: true});
for (let i = 0; i < $('tbody .o_list_record_selector input').length; i++) {
if ($('tbody .o_list_record_selector input')[i].checked === true) {
actived_ids.push(state.res_ids[i]);
}
}
console.log(actived_ids);
// At this point, the IDs of the selected items have been obtained, and you can call the backend method, or open a new page or a new wizard.
let ctx = state.context;
ctx['active_ids'] = actived_ids;
// I have opened a new wizard here, passing the selected ID through the context for corresponding processing.
self.do_action({
type: 'ir.actions.act_window',
res_model: 'employee.performance.manage.review',
target: 'new',
views: [[false, 'form']],
context: {
view_type: view_type,
active_ids: actived_ids,
},
},{
on_reverse_breadcrumb: function () {
self.reload();
},
on_close: function () {
self.reload();
}
});
});
// Confirm Review
this.$buttons.on('click', '.employee_performance_manage_review_confirmed', function () {
let view_type = self.viewType;
let actived_ids = [];
let state = self.model.get(self.handle, {raw: true});
for (let i = 0; i < $('tbody .o_list_record_selector input').length; i++) {
if ($('tbody .o_list_record_selector input')[i].checked === true) {
actived_ids.push(state.res_ids[i]);
}
}
// At this point, the IDs of the selected items have been obtained, and you can call the backend method, or open a new page or a new wizard.
let ctx = state.context;
ctx['active_ids'] = actived_ids;
// I have opened a new wizard here, passing the selected ID through the context for corresponding processing.
self.do_action({
type: 'ir.actions.act_window',
res_model: 'employee.performance.manage.confirmed',
target: 'new',
views: [[false, 'form']],
context: {
view_type: view_type,
active_ids: actived_ids,
},
},{
on_reverse_breadcrumb: function () {
self.reload();
},
on_close: function () {
self.reload();
}
});
});
}
}
});
let EmployeePerformanceeView = ListView.extend({
config: _.extend({}, ListView.prototype.config, {
Controller: EmployeePerformanceManageViewController,
}),
});
viewRegistry.add('employee_performance_manage_class', EmployeePerformanceeView);
});
Process the passed id:
# -*- coding: utf-8 -*-
import logging
from odoo import api, fields, models
from odoo.exceptions import UserError
_logger = logging.getLogger(__name__)
class EmployeePerformanceTran(models.TransientModel):
_name = 'employee.performance.manage.review'
_description = "Batch submit for review"
performance_ids = fields.Many2many('employee.performance.manage', 'performance_manage_review_list_rel', string='Employee Performance Management')
@api.multi
def submit_review(self):
TRANSLATED SEGMENT:
Batch Submit for Review
:return:
TRANSLATED SEGMENT:
self.ensure_one()
self.performance_ids.write({'state': 'wait'})
return {'type': 'ir.actions.act_window_close'}
@api.model
def default_get(self, fields):
context = dict(self._context or {})
view_type = context.get('view_type')
active_ids = context.get('active_ids')
if not active_ids:
raise UserError("No records selected for submission!")
result = super(EmployeePerformanceTran, self).default_get(fields)
if 'performance_ids' in fields:
result['performance_ids'] = [(6, 0, active_ids)]
return result
This article omits some imported files and other operations. The most important part is the JS file that displays buttons on the front end through JavaScript and passes values to the backend for processing upon button clicks.
Additionally, I saw a relatively detailed article: https://blog.csdn.net/tsoTeo/article/details/90716027 You can refer to it.
Rendering:
treeshutu2.png
treeshutu2.png
treeshitu.png
Source: https://www.sxfblog.com/index.php/archives/568.html
