Skip to content

Commit

Permalink
[IMP] web, crm: show conversion rate in tooltip for kanban stages
Browse files Browse the repository at this point in the history
  • Loading branch information
@dbh-odoo
dbh-odoo committed Jan 8, 2018
1 parent b4578da commit 6d936a9
Show file tree
Hide file tree
Showing 4 changed files with 66 additions and 11 deletions.
2 changes: 1 addition & 1 deletion addons/crm/views/crm_lead_views.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -287,7 +287,7 @@
<field name="priority" eval="1"/>
<field name="arch" type="xml">
<kanban default_group_by="stage_id" class="o_kanban_small_column o_opportunity_kanban" on_create="crm.create_opportunity_simplified">
<field name="stage_id" options='{"group_by_tooltip": {"requirements": "Description", "legend_priority": "Use of stars"}}'/>
<field name="stage_id" options='{"conversion_rate_tooltip": True, "group_by_tooltip": {"requirements": "Description", "legend_priority": "Use of stars"}}'/>
<field name="color"/>
<field name="priority"/>
<field name="planned_revenue"/>
Expand Down
19 changes: 17 additions & 2 deletions addons/web/static/src/js/views/kanban/kanban_column.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -147,8 +147,7 @@ var KanbanColumn = Widget.extend({
this.$header.find('.o_column_title').text(title);

this.$el.toggleClass('o_column_folded', this.folded && !config.device.isMobile);
var tooltip = this.data.count + _t(' records');
tooltip = '<p>' + tooltip + '</p>' + this.tooltipInfo;
var tooltip = this.getTooltip()
this.$header.find('.o_kanban_header_title').tooltip({html: true}).attr('data-original-title', tooltip);
if (!this.remaining) {
this.$('.o_kanban_load_more').remove();
Expand All @@ -174,12 +173,28 @@ var KanbanColumn = Widget.extend({
this.quickCreateWidget = new RecordQuickCreate(this, width);
this.quickCreateWidget.insertAfter(this.$header);
},
/**
* Generate the tooltip.
*/
getTooltip: function() {
var tooltip = this.data.count + _t(' records');
return '<p>' + tooltip + '</p>' + this.tooltipInfo;;
},
/**
* @returns {Boolean} true iff the column is empty
*/
isEmpty: function () {
return !this.records.length;
},
/**
* Update current tooltip with conversion rate.
* @param {integer} rate percentage of conversion rate
*/
updateConversionTooltip: function(rate) {
var tooltip = this.getTooltip();
tooltip += _.str.sprintf('<div>%s %% %s</div>', rate, _t('conversion'));
this.$header.find('.o_kanban_header_title').attr('data-original-title', tooltip);
},

//--------------------------------------------------------------------------
// Private
Expand Down
32 changes: 24 additions & 8 deletions addons/web/static/src/js/views/kanban/kanban_controller.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -83,8 +83,10 @@ var KanbanController = BasicController.extend({
var data = this.model.get(this.handle, {raw: true});
var grouped = data.groupedBy.length;
if (grouped) {
this.renderer.updateState(data, {noRender: true});
var columnState = this.model.getColumn(id);
return this.renderer.updateColumn(columnState.id, columnState);
return this.renderer.updateColumn(columnState.id, columnState)
.then(this.renderer.updateConversionTooltip.bind(this.renderer));
}
return this.renderer.updateRecord(this.model.get(id));
},
Expand Down Expand Up @@ -173,10 +175,14 @@ var KanbanController = BasicController.extend({
.then(function (column_db_ids) {
return self._resequenceRecords(column.db_id, event.data.ids)
.then(function () {
var state = self.model.get(self.handle);
var defs = []
self.renderer.updateState(state, {noRender: true});
_.each(column_db_ids, function (db_id) {
var data = self.model.get(db_id);
self.renderer.updateColumn(db_id, data);
var data = _.findWhere(state.data, {id: db_id});
defs.push(self.renderer.updateColumn(db_id, data));
});
$.when.apply($, defs).then(self.renderer.updateConversionTooltip.bind(self.renderer));
});
}).fail(this.reload.bind(this));
},
Expand All @@ -196,8 +202,10 @@ var KanbanController = BasicController.extend({
this.model
.toggleActive(record_ids, active_value, column.db_id)
.then(function (db_id) {
var data = self.model.get(db_id);
self.renderer.updateColumn(db_id, data);
var state = self.model.get(self.handle);
var data = _.findWhere(state.data, {id: db_id});
self.renderer.updateState(state, {noRender: true});
self.renderer.updateColumn(db_id, data).then(self.renderer.updateConversionTooltip.bind(self.renderer));
self._updateEnv();
});
}
Expand Down Expand Up @@ -310,8 +318,10 @@ var KanbanController = BasicController.extend({
var self = this;
var column = event.target;
this.model.loadMore(column.db_id).then(function (db_id) {
var data = self.model.get(db_id);
self.renderer.updateColumn(db_id, data);
var state = self.model.get(self.handle);
var data = _.findWhere(state.data, {id: db_id});
self.renderer.updateState(state, {noRender: true});
self.renderer.updateColumn(db_id, data).then(self.renderer.updateConversionTooltip.bind(self.renderer));
self._updateEnv();
});
},
Expand Down Expand Up @@ -355,10 +365,13 @@ var KanbanController = BasicController.extend({
self._updateEnv();

var columnState = self.model.getColumn(db_id);
state = self.model.get(self.handle);
self.renderer.updateState(state, {noRender: true});
return self.renderer.updateColumn(columnState.id, columnState).then(function () {
if (event.data.openRecord) {
self.trigger_up('open_record', {id: db_id, mode: 'edit'});
}
self.renderer.updateConversionTooltip();
});
});
}
Expand All @@ -379,6 +392,9 @@ var KanbanController = BasicController.extend({
var state = this.model.get(this.handle, {raw: true});
var model = state.fields[state.groupedBy[0]].relation;
this.model.resequence(model, event.data.ids, this.handle).then(function () {
state = self.model.get(self.handle);
self.renderer.updateState(state, {noRender: true});
self.renderer.updateConversionTooltip();
self._updateEnv();
});
},
Expand All @@ -391,7 +407,7 @@ var KanbanController = BasicController.extend({
var column = event.target;
this.model.toggleGroup(column.db_id).then(function (db_id) {
var data = self.model.get(db_id);
self.renderer.updateColumn(db_id, data);
self.renderer.updateColumn(db_id, data).then(self.renderer.updateConversionTooltip.bind(self.renderer));
self._updateEnv();
});
},
Expand Down
24 changes: 24 additions & 0 deletions addons/web/static/src/js/views/kanban/kanban_renderer.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -151,6 +151,22 @@ var KanbanRenderer = BasicRenderer.extend({
this.widgets[index] = newColumn;
return newColumn.insertAfter(column.$el).then(column.destroy.bind(column));
},
/**
* Computes conversion rate and update tooltip of all columns with conversion rate.
*/
updateConversionTooltip: function() {
var self = this;
if (this.columnOptions.conversion_rate_tooltip) {
var totalRecords = _.reduce(this.state.data, function(total, data){ return total + data.count; }, 0);
var previousColumnRecords = 0;
_.map(this.state.data, function(group) {
var column = _.findWhere(self.widgets, {db_id: group.id});
var rate = ((totalRecords-previousColumnRecords) / totalRecords * 100).toFixed(2) || 0;
column.updateConversionTooltip(rate)
previousColumnRecords += group.count;
});
}
},
/**
* Updates a given record with its new state.
*
Expand Down Expand Up @@ -235,10 +251,16 @@ var KanbanRenderer = BasicRenderer.extend({
}
});

// Add conversion rate tooltip on all columns
if (this.columnOptions.conversion_rate_tooltip) {
this.updateConversionTooltip();
}

// remove previous sorting
if(this.$el.sortable('instance') !== undefined) {
this.$el.sortable('destroy');
}

if (this.groupedByM2O) {
// Enable column sorting
this.$el.sortable({
Expand Down Expand Up @@ -347,11 +369,13 @@ var KanbanRenderer = BasicRenderer.extend({
this.groupedByM2O = groupByFieldAttrs && (groupByFieldAttrs.type === 'many2one');
var grouped_by_field = this.groupedByM2O && groupByFieldAttrs.relation;
var groupByTooltip = groupByFieldInfo && groupByFieldInfo.options.group_by_tooltip;
var conversionRateTooltip = groupByFieldInfo && groupByFieldInfo.options.conversion_rate_tooltip;
this.columnOptions = _.extend(this.columnOptions, {
draggable: draggable,
group_by_tooltip: groupByTooltip,
grouped_by_m2o: this.groupedByM2O,
relation: grouped_by_field,
conversion_rate_tooltip: conversionRateTooltip,
});
this.createColumnEnabled = this.groupedByM2O && this.columnOptions.group_creatable;
},
Expand Down

0 comments on commit 6d936a9

Please sign in to comment.