You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

1459 lines
53 KiB

/** @odoo-module */
import { registry} from '@web/core/registry';
import { useService } from "@web/core/utils/hooks";
const { Component, onWillStart, onMounted} = owl
import { jsonrpc } from "@web/core/network/rpc_service";
import { _t } from "@web/core/l10n/translation";
import { session } from "@web/session";
import { WebClient } from "@web/webclient/webclient";
export class CRMDashboard extends Component {
/**
* Sets up the CRM Dashboard component.
* Initializes required services and lifecycle hooks.
*/
setup() {
this.action = useService("action");
this.orm = useService("orm");
onWillStart(this.onWillStart);
onMounted(this.onMounted);
}
/**
* Function triggered before the component starts.
* Perform necessary setup or operations here.
*/
async onWillStart() {
var self = this;
this.login_employee = {};
var def0 = jsonrpc('/web/dataset/call_kw/crm.lead/check_user_group', {
model: 'crm.lead',
method: 'check_user_group',
args: [{}],
kwargs: {},
}).then(function(result) {
if (result == true) {
self.is_manager = true;
} else {
self.is_manager = false;
}
});
var def1 = jsonrpc('/web/dataset/call_kw/crm.lead/get_upcoming_events', {
model: "crm.lead",
method: "get_upcoming_events",
args: [{}],
kwargs: {},
})
.then(function(res) {
self.upcoming_events = res['event'];
self.current_lang = res['cur_lang'];
});
var def2 = jsonrpc('/web/dataset/call_kw/crm.lead/get_top_deals', {
model: "crm.lead",
method: "get_top_deals",
args: [{}],
kwargs: {},
})
.then(function(res) {
self.top_deals = res['deals'];
});
var def3 = jsonrpc('/web/dataset/call_kw/crm.lead/get_monthly_goal', {
model: "crm.lead",
method: "get_monthly_goal",
args: [{}],
kwargs: {},
})
.then(function(res) {
self.monthly_goals = res['goals'];
});
var def4 = jsonrpc('/web/dataset/call_kw/crm.lead/get_top_sp_revenue', {
model: "crm.lead",
method: "get_top_sp_revenue",
args: [{}],
kwargs: {},
})
.then(function(res) {
self.top_sp_revenue = res['top_revenue'];
});
var def5 = jsonrpc('/web/dataset/call_kw/crm.lead/get_country_revenue', {
model: "crm.lead",
method: "get_country_revenue",
args: [{}],
kwargs: {},
})
.then(function(res) {
self.top_country_revenue = res['country_revenue'];
});
var def6 = jsonrpc('/web/dataset/call_kw/crm.lead/get_country_count', {
model: "crm.lead",
method: "get_country_count",
args: [{}],
kwargs: {},
})
.then(function(res) {
self.top_country_count = res['country_count'];
});
var def8 = jsonrpc('/web/dataset/call_kw/crm.lead/get_ratio_based_country', {
model: "crm.lead",
method: "get_ratio_based_country",
args: [{}],
kwargs: {},
})
.then(function(res) {
self.top_country_wise_ratio = res['country_wise_ratio'];
});
var def9 = jsonrpc('/web/dataset/call_kw/crm.lead/get_ratio_based_sp', {
model: "crm.lead",
method: "get_ratio_based_sp",
args: [{}],
kwargs: {},
})
.then(function(res) {
self.top_salesperson_wise_ratio = res['salesperson_wise_ratio'];
});
var def10 = jsonrpc('/web/dataset/call_kw/crm.lead/get_ratio_based_sales_team', {
model: "crm.lead",
method: "get_ratio_based_sales_team",
args: [{}],
kwargs: {},
})
.then(function(res) {
self.top_sales_team_wise_ratio = res['sales_team_wise_ratio'];
});
var def11 = jsonrpc('/web/dataset/call_kw/crm.lead/get_recent_activities', {
model: "crm.lead",
method: "get_recent_activities",
args: [{}],
kwargs: {},
})
.then(function(res) {
self.recent_activities = res['activities'];
});
var def12 = jsonrpc('/web/dataset/call_kw/crm.lead/get_count_unassigned', {
model: "crm.lead",
method: "get_count_unassigned",
args: [{}],
kwargs: {},
})
.then(function(res) {
self.get_count_unassigned = res['count_unassigned'];
});
var def13 = jsonrpc('/web/dataset/call_kw/crm.lead/get_top_sp_by_invoice', {
model: "crm.lead",
method: "get_top_sp_by_invoice",
args: [{}],
kwargs: {},
})
.then(function(res) {
self.top_sp_by_invoice = res['sales_person_invoice'];
});
return $.when(def0, def1, def2, def3, def4, def5, def6, def8, def9, def10, def11, def12, def13);
}
/**
* Handles the change event for income and expense values.
* @param {Event} e - The event object.
*/
on_change_income_expense_values(e) {
e.stopPropagation();
var $target = $(e.target);
var value = $target.val();
if (value == "this_year") {
this.onclick_this_year($target.val());
} else if (value == "this_quarter") {
this.onclick_this_quarter($target.val());
} else if (value == "this_month") {
this.onclick_this_month($target.val());
} else if (value == "this_week") {
this.onclick_this_week($target.val());
}
}
/**
* Handles the click event for the 'this_week' option.
* Calls a JSON-RPC method to retrieve data for the current week.
* Updates the UI to display the relevant information.
* @param {Event} ev - The event object.
*/
onclick_this_week(ev) {
var self = this;
jsonrpc('/web/dataset/call_kw/crm.lead/crm_week', {
model: 'crm.lead',
method: 'crm_week',
args: [{}],
kwargs: {},
})
.then(function(result) {
$('#leads_this_year').hide();
$('#opp_this_year').hide();
$('#exp_rev_this_year').hide();
$('#rev_this_year').hide();
$('#ratio_this_year').hide();
$('#avg_time_this_year').hide();
$('#total_revenue_this_year').hide();
$('#leads_this_quarter').hide();
$('#opp_this_quarter').hide();
$('#exp_rev_this_quarter').hide();
$('#rev_this_quarter').hide();
$('#ratio_this_quarter').hide();
$('#avg_time_this_quarter').hide();
$('#total_revenue_this_quarter').hide();
$('#leads_this_month').hide();
$('#opp_this_month').hide();
$('#exp_rev_this_month').hide();
$('#rev_this_month').hide();
$('#ratio_this_month').hide();
$('#avg_time_this_month').hide();
$('#total_revenue_this_month').hide();
$('#leads_this_week').show();
$('#opp_this_week').show();
$('#exp_rev_this_week').show();
$('#rev_this_week').show();
$('#ratio_this_week').show();
$('#avg_time_this_week').show();
$('#total_revenue_this_week').show();
$('#leads_this_week').empty();
$('#opp_this_week').empty();
$('#exp_rev_this_week').empty();
$('#rev_this_week').empty();
$('#ratio_this_week').empty();
$('#avg_time_this_week').empty();
$('#total_revenue_this_week').empty();
$('#leads_this_week').append('<span>' + result.record + '</span>');
$('#opp_this_week').append('<span>' + result.record_op + '</span>');
$('#exp_rev_this_week').append('<span>' + self.monthly_goals[2] + '&nbsp' + result.record_rev_exp + '</span>');
$('#rev_this_week').append('<span>' + self.monthly_goals[2] + '&nbsp' + result.record_rev + '</span>');
$('#ratio_this_week').append('<span>' + result.record_ratio + '</span>');
$('#avg_time_this_week').append('<span>' + result.avg_time + '&nbspsec' + '</span>');
$('#total_revenue_this_week').append('<span>' + result.opportunity_ratio_value + '</span>');
})
}
/**
* Handles the click event for the 'this_month' option.
* Calls a JSON-RPC method to retrieve data for the current month.
* Updates the UI to display the relevant information.
* @param {Event} ev - The event object.
*/
onclick_this_month(ev) {
var self = this;
jsonrpc('/web/dataset/call_kw/crm.lead/crm_month', {
model: 'crm.lead',
method: 'crm_month',
args: [{}],
kwargs: {},
})
.then(function(result) {
$('#leads_this_year').hide();
$('#opp_this_year').hide();
$('#exp_rev_this_year').hide();
$('#rev_this_year').hide();
$('#ratio_this_year').hide();
$('#avg_time_this_year').hide();
$('#total_revenue_this_year').hide();
$('#leads_this_quarter').hide();
$('#opp_this_quarter').hide();
$('#exp_rev_this_quarter').hide();
$('#rev_this_quarter').hide();
$('#ratio_this_quarter').hide();
$('#avg_time_this_quarter').hide();
$('#total_revenue_this_quarter').hide();
$('#leads_this_week').hide();
$('#opp_this_week').hide();
$('#exp_rev_this_week').hide();
$('#rev_this_week').hide();
$('#ratio_this_week').hide();
$('#avg_time_this_week').hide();
$('#total_revenue_this_week').hide();
$('#leads_this_month').show();
$('#opp_this_month').show();
$('#exp_rev_this_month').show();
$('#rev_this_month').show();
$('#ratio_this_month').show();
$('#avg_time_this_month').show();
$('#total_revenue_this_month').show();
$('#leads_this_month').empty();
$('#opp_this_month').empty();
$('#exp_rev_this_month').empty();
$('#rev_this_month').empty();
$('#ratio_this_month').empty();
$('#avg_time_this_month').empty();
$('#total_revenue_this_month').empty();
$('#leads_this_month').append('<span>' + result.record + '</span>');
$('#opp_this_month').append('<span>' + result.record_op + '</span>');
$('#exp_rev_this_month').append('<span>' + self.monthly_goals[2] + '&nbsp' + result.record_rev_exp + '</span>');
$('#rev_this_month').append('<span>' + self.monthly_goals[2] + '&nbsp' + result.record_rev + '</span>');
$('#ratio_this_month').append('<span>' + result.record_ratio + '</span>');
$('#avg_time_this_month').append('<span>' + result.avg_time + '&nbspsec' + '</span>');
$('#total_revenue_this_month').append('<span>' + result.opportunity_ratio_value + '</span>');
})
}
/**
* Handles the click event for the 'this_quarter' option.
* Calls a JSON-RPC method to retrieve data for the current quarter.
* Updates the UI to display the relevant information.
* @param {Event} ev - The event object.
*/
onclick_this_quarter(ev) {
var self = this;
jsonrpc('/web/dataset/call_kw/crm.lead/crm_quarter', {
model: 'crm.lead',
method: 'crm_quarter',
args: [{}],
kwargs: {},
})
.then(function(result) {
$('#leads_this_year').hide();
$('#opp_this_year').hide();
$('#exp_rev_this_year').hide();
$('#rev_this_year').hide();
$('#ratio_this_year').hide();
$('#avg_time_this_year').hide();
$('#total_revenue_this_year').hide();
$('#leads_this_month').hide();
$('#opp_this_month').hide();
$('#exp_rev_this_month').hide();
$('#rev_this_month').hide();
$('#ratio_this_month').hide();
$('#avg_time_this_month').hide();
$('#total_revenue_this_month').hide();
$('#leads_this_week').hide();
$('#opp_this_week').hide();
$('#exp_rev_this_week').hide();
$('#rev_this_week').hide();
$('#ratio_this_week').hide();
$('#avg_time_this_week').hide();
$('#total_revenue_this_week').hide();
$('#leads_this_quarter').show();
$('#opp_this_quarter').show();
$('#exp_rev_this_quarter').show();
$('#rev_this_quarter').show();
$('#ratio_this_quarter').show();
$('#avg_time_this_quarter').show();
$('#total_revenue_this_quarter').show();
$('#leads_this_quarter').empty();
$('#opp_this_quarter').empty();
$('#exp_rev_this_quarter').empty();
$('#rev_this_quarter').empty();
$('#ratio_this_quarter').empty();
$('#avg_time_this_quarter').empty();
$('#total_revenue_this_quarter').empty();
$('#leads_this_quarter').append('<span>' + result.record + '</span>');
$('#opp_this_quarter').append('<span>' + result.record_op + '</span>');
$('#exp_rev_this_quarter').append('<span>' + self.monthly_goals[2] + '&nbsp' + result.record_rev_exp + '</span>');
$('#rev_this_quarter').append('<span>' + self.monthly_goals[2] + '&nbsp' + result.record_rev + '</span>');
$('#ratio_this_quarter').append('<span>' + result.record_ratio + '</span>');
$('#avg_time_this_quarter').append('<span>' + result.avg_time + '&nbspsec' + '</span>');
$('#total_revenue_this_quarter').append('<span>' + result.opportunity_ratio_value + '</span>');
})
}
/**
* Handles the click event for the 'this_year' option.
* Calls a JSON-RPC method to retrieve data for the current year.
* Updates the UI to display the relevant information.
* @param {Event} ev - The event object.
*/
onclick_this_year(ev) {
var self = this;
jsonrpc('/web/dataset/call_kw/crm.lead/crm_year', {
model: 'crm.lead',
method: 'crm_year',
args: [{}],
kwargs: {},
})
.then(function(result) {
$('#leads_this_quarter').hide();
$('#opp_this_quarter').hide();
$('#exp_rev_this_quarter').hide();
$('#rev_this_quarter').hide();
$('#ratio_this_quarter').hide();
$('#avg_time_this_quarter').hide();
$('#total_revenue_this_quarter').hide();
$('#leads_this_month').hide();
$('#opp_this_month').hide();
$('#exp_rev_this_month').hide();
$('#rev_this_month').hide();
$('#ratio_this_month').hide();
$('#avg_time_this_month').hide();
$('#total_revenue_this_month').hide();
$('#leads_this_week').hide();
$('#opp_this_week').hide();
$('#exp_rev_this_week').hide();
$('#rev_this_week').hide();
$('#ratio_this_week').hide();
$('#avg_time_this_week').hide();
$('#total_revenue_this_week').hide();
$('#leads_this_year').show();
$('#opp_this_year').show();
$('#exp_rev_this_year').show();
$('#rev_this_year').show();
$('#ratio_this_year').show();
$('#avg_time_this_year').show();
$('#total_revenue_this_year').show();
$('#leads_this_year').empty();
$('#opp_this_year').empty();
$('#exp_rev_this_year').empty();
$('#rev_this_year').empty();
$('#ratio_this_year').empty();
$('#avg_time_this_year').empty();
$('#total_revenue_this_year').empty();
$('#leads_this_year').append('<span>' + result.record + '</span>');
$('#opp_this_year').append('<span>' + result.record_op + '</span>');
$('#exp_rev_this_year').append('<span>' + self.monthly_goals[2] + '&nbsp' + result.record_rev_exp + '</span>');
$('#rev_this_year').append('<span>' + self.monthly_goals[2] + '&nbsp' + result.record_rev + '</span>');
$('#ratio_this_year').append('<span>' + result.record_ratio + '</span>');
$('#avg_time_this_year').append('<span>' + result.avg_time + '&nbspsec' + '</span>');
$('#total_revenue_this_year').append('<span>' + result.opportunity_ratio_value + '</span>');
})
}
/**
* Handles the revenue card action.
* Initiates an action to display revenue-related data.
* @param {Event} e - The event object.
*/
revenue_card(e) {
var self = this;
e.stopPropagation();
e.preventDefault();
var options = {
on_reverse_breadcrumb: this.on_reverse_breadcrumb,
};
this.action.doAction({
name: _t("Revenue"),
type: 'ir.actions.act_window',
res_model: 'crm.lead',
view_mode: 'tree,form,calendar',
views: [
[false, 'list'],
[false, 'form']
],
domain: [
['user_id', '=', session.uid],
['type', '=', 'opportunity'],
['stage_id', '=', 4]
],
target: 'current',
}, options)
}
/**
* Initiates an action to display expected revenue data.
* @param {Event} e - The event object.
*/
exp_revenue(e) {
var self = this;
e.stopPropagation();
e.preventDefault();
var options = {
on_reverse_breadcrumb: this.on_reverse_breadcrumb,
};
this.action.doAction({
name: _t("Expected Revenue"),
type: 'ir.actions.act_window',
res_model: 'crm.lead',
view_mode: 'tree,form,calendar',
views: [
[false, 'list'],
[false, 'form']
],
domain: [
['user_id', '=', session.uid],
['type', '=', 'opportunity'],
['active', '=', true]
],
target: 'current',
}, options)
}
/**
* Initiates an action to display unassigned leads data.
* @param {Event} e - The event object.
*/
unassigned_leads(e) {
var self = this;
e.stopPropagation();
e.preventDefault();
var options = {
on_reverse_breadcrumb: this.on_reverse_breadcrumb,
};
this.action.doAction({
name: _t("Unassigned Leads"),
type: 'ir.actions.act_window',
res_model: 'crm.lead',
view_mode: 'tree,form,calendar',
views: [
[false, 'list'],
[false, 'form']
],
domain: [
['user_id', '=', false],
['type', '=', 'lead']
],
context: {
'group_by': 'team_id'
},
target: 'current',
}, options)
}
/**
* Initiates an action to display opportunity data.
* @param {Event} e - The event object.
*/
opportunity(e) {
var self = this;
e.stopPropagation();
e.preventDefault();
var options = {
on_reverse_breadcrumb: this.on_reverse_breadcrumb,
};
this.action.doAction({
name: _t("Opportunity"),
type: 'ir.actions.act_window',
res_model: 'crm.lead',
view_mode: 'tree,form,calendar',
views: [
[false, 'list'],
[false, 'form']
],
domain: [
['user_id', '=', session.uid],
['type', '=', 'opportunity']
],
target: 'current',
})
}
/**
* Initiates an action to display leads assigned to the current user.
* @param {Event} e - The event object.
*/
my_lead(e) {
var self = this;
e.stopPropagation();
e.preventDefault();
var options = {
on_reverse_breadcrumb: this.on_reverse_breadcrumb,
};
this.action.doAction({
name: _t("My Leads"),
type: 'ir.actions.act_window',
res_model: 'crm.lead',
view_mode: 'tree,form,calendar',
views: [
[false, 'list'],
[false, 'form']
],
domain: [
['user_id', '=', session.uid]
],
target: 'current',
}, options)
}
/**
* Handles the reverse breadcrumb action.
* Updates the breadcrumb, fetches updated data, and reloads the dashboard.
*/
on_reverse_breadcrumb() {
var self = this;
WebClient.do_push_state({});
this.update_cp();
this.fetch_data().then(function() {
self.$('.o_hr_dashboard').reload();
self.render_dashboards();
});
}
/**
* Lifecycle hook triggered when the component is mounted.
* Renders various charts and graphs upon mounting.
*/
async onMounted() {
this.renderElement();
this.funnel_chart();
this.render_annual_chart_graph();
this.render_sales_activity_graph();
this.render_leads_month_graph();
this.render_revenue_count_pie();
this.render_campaign_leads_graph();
this.render_medium_leads_graph();
this.render_source_leads_graph();
this.onclick_lost_last_12months();
this.render_lost_leads_by_stage_graph();
}
/**
* Renders a doughnut chart to display lost leads categorized by stage.
* Fetches data via JSON-RPC and generates a chart using Chart.js.
*/
render_lost_leads_by_stage_graph() {
var self = this
var ctx = $(".lost_leads_by_stage_graph");
jsonrpc('/web/dataset/call_kw/crm.lead/get_lost_lead_by_stage_pie', {
model: "crm.lead",
method: "get_lost_lead_by_stage_pie",
args: [{}],
kwargs: {},
}).then(function(arrays) {
var data = {
labels: arrays[1],
datasets: [{
label: "",
data: arrays[0],
backgroundColor: [
"#003f5c",
"#2f4b7c",
"#f95d6a",
"#665191",
"#d45087",
"#ff7c43",
"#ffa600",
"#a05195",
"#6d5c16"
],
borderColor: [
"#003f5c",
"#2f4b7c",
"#f95d6a",
"#665191",
"#d45087",
"#ff7c43",
"#ffa600",
"#a05195",
"#6d5c16"
],
borderWidth: 1
}, ]
};
//options
var options = {
responsive: true,
title: false,
legend: {
display: true,
position: "bottom",
labels: {
fontColor: "#333",
fontSize: 16
}
},
scales: {
yAxes: [{
gridLines: {
color: "rgba(0, 0, 0, 0)",
display: false,
},
ticks: {
min: 0,
display: false,
}
}]
}
};
//create Chart class object
var chart = new Chart(ctx, {
type: "doughnut",
data: data,
options: options
});
});
}
/**
* Handles the change event for the total lost CRM selection.
* Determines the selected timeframe and triggers the respective method.
* @param {Event} e - The event object.
*/
change_total_loosed_crm(e) {
e.stopPropagation();
var $target = $(e.target);
var value = $target.val();
if (value == "lost_last_12months") {
this.onclick_lost_last_12months($target.val());
} else if (value == "lost_last_6months") {
this.onclick_lost_last_6months($target.val());
} else if (value == "lost_last_month") {
this.onclick_lost_last_month($target.val());
}
}
/**
* Handles the click event for the 'lost_last_month' option.
* Calls a JSON-RPC method to retrieve total lost CRM data for the last month.
* Generates a bar chart to represent the lost CRM data.
* @param {Event} ev - The event object.
*/
onclick_lost_last_month(ev) {
var self = this;
self.initial_render = true;
jsonrpc('/web/dataset/call_kw/crm.lead/get_total_lost_crm', {
model: "crm.lead",
method: "get_total_lost_crm",
args: ['1'],
kwargs: {},
}).then(function(result) {
var ctx = document.getElementById("canvas").getContext('2d');
// Define the data
var lost_reason = result.month // Add data values to array
var count = result.count;
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: lost_reason, //x axis
datasets: [{
label: 'Count', // Name the series
data: count, // Specify the data values array
backgroundColor: '#66aecf',
borderColor: '#66aecf',
barPercentage: 0.5,
barThickness: 6,
maxBarThickness: 8,
minBarLength: 0,
borderWidth: 1, // Specify bar border width
type: 'bar', // Set this data to a line chart
fill: false
}]
},
options: {
scales: {
y: {
beginAtZero: true
}
},
responsive: true, // Instruct chart js to respond nicely.
maintainAspectRatio: false, // Add to prevent default behaviour of full-width/height
}
});
});
}
/**
* Handles the click event for displaying total lost CRM data for the last 6 months.
* Retrieves and displays the data using Chart.js in a bar chart format.
* @param {Event} ev - The event object.
*/
onclick_lost_last_6months(ev) {
var self = this;
self.initial_render = true;
jsonrpc('/web/dataset/call_kw/crm.lead/get_total_lost_crm', {
model: "crm.lead",
method: "get_total_lost_crm",
args: ['6'],
kwargs: {},
}).then(function(result) {
var ctx = document.getElementById("canvas").getContext('2d');
// Define the data
var lost_reason = result.month // Add data values to array
var count = result.count;
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: lost_reason, //x axis
datasets: [{
label: 'Count', // Name the series
data: count, // Specify the data values array
backgroundColor: '#66aecf',
borderColor: '#66aecf',
barPercentage: 0.5,
barThickness: 6,
maxBarThickness: 8,
minBarLength: 0,
borderWidth: 1, // Specify bar border width
type: 'bar', // Set this data to a line chart
fill: false
}]
},
options: {
scales: {
y: {
beginAtZero: true
}
},
responsive: true, // Instruct chart js to respond nicely.
maintainAspectRatio: false, // Add to prevent default behaviour of full-width/height
}
});
});
}
/**
* Handles the click event for displaying total lost CRM data for the last 12 months.
* Retrieves and displays the data using Chart.js in a bar chart format.
* If the user is a manager, it fetches data for the last 12 months.
* @param {Event} ev - The event object.
*/
onclick_lost_last_12months(ev) {
var self = this;
if (self.is_manager == true) {
self.initial_render = true;
jsonrpc('/web/dataset/call_kw/crm.lead/get_total_lost_crm', {
model: "crm.lead",
method: "get_total_lost_crm",
args: ['12'],
kwargs: {},
}).then(function(result) {
var ctx = document.getElementById("canvas").getContext('2d');
// Define the data
var lost_reason = result.month // Add data values to array
var count = result.count;
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: lost_reason, //x axis
datasets: [{
label: 'Count', // Name the series
data: count, // Specify the data values array
backgroundColor: '#66aecf',
borderColor: '#66aecf',
barPercentage: 0.5,
barThickness: 6,
maxBarThickness: 8,
minBarLength: 0,
borderWidth: 1, // Specify bar border width
type: 'bar', // Set this data to a line chart
fill: false
}]
},
options: {
scales: {
y: {
beginAtZero: true
},
},
responsive: true, // Instruct chart js to respond nicely.
maintainAspectRatio: false, // Add to prevent default behaviour of full-width/height
}
});
});
};
}
/**
* Renders a doughnut chart to display lost leads categorized by reason.
* Fetches data via JSON-RPC and generates a chart using Chart.js.
*/
render_lost_leads_graph() {
var self = this;
var ctx = $(".lost_leads_graph");
jsonrpc('/web/dataset/call_kw/crm.lead/get_lost_lead_by_reason_pie', {
model: "crm.lead",
method: "get_lost_lead_by_reason_pie",
args: [{}],
kwargs: {},
}).then(function(arrays) {
var data = {
labels: arrays[1],
datasets: [{
label: "",
data: arrays[0],
backgroundColor: [
"#003f5c",
"#2f4b7c",
"#f95d6a",
"#665191",
"#d45087",
"#ff7c43",
"#ffa600",
"#a05195",
"#6d5c16"
],
borderColor: [
"#003f5c",
"#2f4b7c",
"#f95d6a",
"#665191",
"#d45087",
"#ff7c43",
"#ffa600",
"#a05195",
"#6d5c16"
],
borderWidth: 1
}, ]
};
//options
var options = {
responsive: true,
title: false,
legend: {
display: true,
position: "bottom",
labels: {
fontColor: "#333",
fontSize: 16
}
},
scales: {
yAxes: [{
gridLines: {
color: "rgba(0, 0, 0, 0)",
display: false,
},
ticks: {
min: 0,
display: false,
}
}]
}
};
//create Chart class object
var chart = new Chart(ctx, {
type: "doughnut",
data: data,
options: options
});
});
}
/**
* Renders a doughnut chart to display leads categorized by their source.
* Fetches data via JSON-RPC and generates a chart using Chart.js.
*/
render_source_leads_graph() {
var self = this
var ctx = $(".source_lead");
jsonrpc('/web/dataset/call_kw/crm.lead/get_the_source_pie', {
model: "crm.lead",
method: "get_the_source_pie",
args: [{}],
kwargs: {},
}).then(function(arrays) {
var data = {
labels: arrays[1],
datasets: [{
label: "",
data: arrays[0],
backgroundColor: [
"#003f5c",
"#2f4b7c",
"#f95d6a",
"#665191",
"#d45087",
"#ff7c43",
"#ffa600",
"#a05195",
"#6d5c16"
],
borderColor: [
"#003f5c",
"#2f4b7c",
"#f95d6a",
"#665191",
"#d45087",
"#ff7c43",
"#ffa600",
"#a05195",
"#6d5c16"
],
borderWidth: 1
}, ]
};
//options
var options = {
responsive: true,
title: false,
legend: {
display: true,
position: "right",
labels: {
fontColor: "#333",
fontSize: 14
}
},
scales: {
yAxes: [{
gridLines: {
color: "rgba(0, 0, 0, 0)",
display: false,
},
ticks: {
min: 0,
display: false,
}
}]
}
};
//create Chart class object
var chart = new Chart(ctx, {
type: "doughnut",
data: data,
options: options
});
});
}
/**
* Renders a doughnut chart to display leads categorized by their medium.
* Fetches data via JSON-RPC and generates a chart using Chart.js.
*/
render_medium_leads_graph() {
var self = this
var ctx = $(".medium_leads");
jsonrpc('/web/dataset/call_kw/crm.lead/get_the_medium_pie', {
model: "crm.lead",
method: "get_the_medium_pie",
args: [{}],
kwargs: {},
}).then(function(arrays) {
var data = {
labels: arrays[1],
datasets: [{
label: "",
data: arrays[0],
backgroundColor: [
"#003f5c",
"#2f4b7c",
"#f95d6a",
"#665191",
"#d45087",
"#ff7c43",
"#ffa600",
"#a05195",
"#6d5c16"
],
borderColor: [
"#003f5c",
"#2f4b7c",
"#f95d6a",
"#665191",
"#d45087",
"#ff7c43",
"#ffa600",
"#a05195",
"#6d5c16"
],
borderWidth: 1
}, ]
};
//options
var options = {
responsive: true,
title: false,
legend: {
display: true,
position: "right",
labels: {
fontColor: "#333",
fontSize: 14
}
},
scales: {
yAxes: [{
gridLines: {
color: "rgba(0, 0, 0, 0)",
display: false,
},
ticks: {
min: 0,
display: false,
}
}]
}
};
//create Chart class object
var chart = new Chart(ctx, {
type: "doughnut",
data: data,
options: options
});
});
}
/**
* Renders a doughnut chart to display leads categorized by their campaign source.
* Fetches data via JSON-RPC and generates a chart using Chart.js.
*/
render_campaign_leads_graph() {
var self = this
var ctx = $(".campaign_source");
jsonrpc('/web/dataset/call_kw/crm.lead/get_the_campaign_pie', {
model: "crm.lead",
method: "get_the_campaign_pie",
args: [{}],
kwargs: {},
}).then(function(arrays) {
var data = {
labels: arrays[1],
datasets: [{
label: "",
data: arrays[0],
backgroundColor: [
"#003f5c",
"#2f4b7c",
"#f95d6a",
"#665191",
"#d45087",
"#ff7c43",
"#ffa600",
"#a05195",
"#6d5c16"
],
borderColor: [
"#003f5c",
"#2f4b7c",
"#f95d6a",
"#665191",
"#d45087",
"#ff7c43",
"#ffa600",
"#a05195",
"#6d5c16"
],
borderWidth: 1
}, ]
};
//options
var options = {
responsive: true,
title: false,
legend: {
display: true,
position: "bottom",
labels: {
fontColor: "#333",
fontSize: 14
}
},
scales: {
yAxes: [{
gridLines: {
color: "rgba(0, 0, 0, 0)",
display: false,
},
ticks: {
min: 0,
display: false,
}
}]
}
};
//create Chart class object
var chart = new Chart(ctx, {
type: "doughnut",
data: data,
options: options
});
});
}
/**
* Renders a doughnut chart to display revenue count data.
* Fetches data via JSON-RPC and generates a chart using Chart.js.
*/
render_revenue_count_pie() {
var self = this;
var ctx = $(".revenue_count_pie_canvas");
jsonrpc('/web/dataset/call_kw/crm.lead/revenue_count_pie', {
model: "crm.lead",
method: "revenue_count_pie",
args: [{}],
kwargs: {},
}).then(function(arrays) {
var data = {
labels: arrays[1],
datasets: [{
label: "",
data: arrays[0],
backgroundColor: [
"#003f5c",
"#ff7c43",
"#f95d6a"
],
borderColor: [
"#003f5c",
"#ff7c43",
"#f95d6a"
],
borderWidth: 1
}, ]
};
//options
var options = {
responsive: true,
title: false,
legend: {
display: true,
position: "bottom",
labels: {
fontColor: "#333",
fontSize: 16
}
},
scales: {
yAxes: [{
gridLines: {
color: "rgba(0, 0, 0, 0)",
display: false,
},
ticks: {
min: 0,
display: false,
}
}]
}
};
//create Chart class object
var chart = new Chart(ctx, {
type: "doughnut",
data: data,
options: options
});
});
}
/**
* Renders a doughnut chart to display leads created each month.
* Fetches data via JSON-RPC and generates a chart using Chart.js.
*/
render_leads_month_graph() {
var self = this
var ctx = $(".lead_month");
jsonrpc('/web/dataset/call_kw/crm.lead/get_lead_month_pie', {
model: "crm.lead",
method: "get_lead_month_pie",
args: [{}],
kwargs: {},
}).then(function(arrays) {
var data = {
labels: arrays[1],
datasets: [{
label: "",
data: arrays[0],
backgroundColor: [
"#003f5c",
"#2f4b7c",
"#f95d6a",
"#665191",
"#d45087",
"#ff7c43",
"#ffa600",
"#a05195",
"#6d5c16"
],
borderColor: [
"#003f5c",
"#2f4b7c",
"#f95d6a",
"#665191",
"#d45087",
"#ff7c43",
"#ffa600",
"#a05195",
"#6d5c16"
],
borderWidth: 1
}, ]
};
//options
var options = {
responsive: true,
title: false,
legend: {
display: true,
position: "right",
labels: {
fontColor: "#333",
fontSize: 16
}
},
scales: {
yAxes: [{
gridLines: {
color: "rgba(0, 0, 0, 0)",
display: false,
},
ticks: {
min: 0,
display: false,
}
}]
}
};
//create Chart class object
var chart = new Chart(ctx, {
type: "doughnut",
data: data,
options: options
});
});
}
/**
* Renders a doughnut chart to display sales activity data.
* Fetches data via JSON-RPC and generates a chart using Chart.js.
*/
render_sales_activity_graph() {
var self = this
var ctx = $(".sales_activity");
jsonrpc('/web/dataset/call_kw/crm.lead/get_the_sales_activity', {
model: "crm.lead",
method: "get_the_sales_activity",
args: [{}],
kwargs: {},
}).then(function(arrays) {
var data = {
labels: arrays[1],
datasets: [{
label: "",
data: arrays[0],
backgroundColor: [
"#003f5c",
"#2f4b7c",
"#f95d6a",
"#665191",
"#d45087",
"#ff7c43",
"#ffa600",
"#a05195",
"#6d5c16"
],
borderColor: [
"#003f5c",
"#2f4b7c",
"#f95d6a",
"#665191",
"#d45087",
"#ff7c43",
"#ffa600",
"#a05195",
"#6d5c16"
],
borderWidth: 1
}, ]
};
//options
var options = {
responsive: true,
title: false,
legend: {
display: true,
position: "right",
labels: {
fontColor: "#333",
fontSize: 16
}
},
scales: {
yAxes: [{
gridLines: {
color: "rgba(0, 0, 0, 0)",
display: false,
},
ticks: {
min: 0,
display: false,
}
}]
}
};
//create Chart class object
var chart = new Chart(ctx, {
type: "doughnut",
data: data,
options: options
});
});
}
/**
* Renders a bar chart to display annual target data.
* Fetches data via JSON-RPC and generates a chart using Chart.js.
*/
render_annual_chart_graph() {
var self = this
var ctx = $(".annual_target");
jsonrpc('/web/dataset/call_kw/crm.lead/get_the_annual_target', {
model: "crm.lead",
method: "get_the_annual_target",
args: [{}],
kwargs: {},
}).then(function(arrays) {
var data = {
labels: arrays[1],
datasets: [{
label: "",
data: arrays[0],
backgroundColor: [
"#003f5c",
"#f95d6a",
"#ff7c43",
"#6d5c16"
],
borderColor: [
"#003f5c",
"#f95d6a",
"#ff7c43",
"#6d5c16"
],
borderWidth: 1
}, ]
};
//options
var options = {
responsive: true,
title: false,
scales: {
yAxes: [{
ticks: {
min: 0
}
}]
}
};
//create Chart class object
var chart = new Chart(ctx, {
type: "bar",
data: data,
options: {
responsive: true,
maintainAspectRatio: false,
legend: {
display: false //This will do the task
},
}
});
});
}
/**
* Renders a funnel chart displaying lead stage data.
* Fetches data via JSON-RPC and generates a chart using Highcharts.
*/
funnel_chart() {
jsonrpc('/web/dataset/call_kw/crm.lead/get_lead_stage_data', {
model: "crm.lead",
method: "get_lead_stage_data",
args: [{}],
kwargs: {},
}).then(function(callbacks) {
Highcharts.chart("container", {
chart: {
type: "funnel",
},
title: false,
credits: {
enabled: false
},
plotOptions: {
series: {
dataLabels: {
enabled: true,
softConnector: true
},
center: ['45%', '50%'],
neckWidth: '40%',
neckHeight: '35%',
width: '90%',
height: '80%'
}
},
series: [{
name: "Number Of Leads",
data: callbacks,
}],
});
});
}
/**
* Fetches lead details via JSON-RPC and appends the data to specific HTML elements.
*/
renderElement(ev) {
var self = this;
jsonrpc('/web/dataset/call_kw/crm.lead/lead_details_user', {
model: "crm.lead",
method: "lead_details_user",
args: [{}],
kwargs: {},
}).then(function(result) {
$('#leads_this_month').append('<span>' + result.record + '</span>');
$('#opp_this_month').append('<span>' + result.record_op + '</span>');
$('#exp_rev_this_month').append('<span>' + self.monthly_goals[2] + '&nbsp' + result.record_rev_exp + '</span>');
$('#rev_this_month').append('<span>' + self.monthly_goals[2] + '&nbsp' + result.record_rev + '</span>');
$('#ratio_this_month').append('<span>' + result.record_ratio + '</span>');
$('#avg_time_this_month').append('<span>' + result.avg_time + '&nbspsec' + '</span>');
$('#total_revenue_this_month').append('<span>' + result.opportunity_ratio_value + '</span>');
$('#target').append('<span>' + result.target + '</span>');
$('#ytd_target').append('<span>' + result.ytd_target + '</span>');
$('#difference').append('<span>' + result.difference + '</span>');
$('#won').append('<span>' + result.won + '</span>');
})
}
}
CRMDashboard.template = "CRMdashboard"
registry.category("actions").add("crm_dashboard", CRMDashboard)