[IMP] website: improve dashboard header to have a website-related dashboard
This header displays icons that proposes to install other website related applications.
This commit is contained in:
committed by
Thibault Delavallée
parent
79597a2b84
commit
4d1cef1b1f
@@ -9,16 +9,29 @@ class WebsiteBackend(http.Controller):
|
||||
|
||||
@http.route('/website/fetch_dashboard_data', type="json", auth='user')
|
||||
def fetch_dashboard_data(self, date_from, date_to):
|
||||
|
||||
params = request.env['ir.config_parameter']
|
||||
ga_client_id = params.sudo().get_param('google_management_client_id', default='')
|
||||
|
||||
return {
|
||||
'groups': {'system': request.env['res.users'].has_group('base.group_system')},
|
||||
has_group_system = request.env['res.users'].has_group('base.group_system')
|
||||
has_group_designer = request.env['res.users'].has_group('website.group_website_designer')
|
||||
if has_group_system:
|
||||
apps_data = dict((app['name'], app) for app in request.env['ir.module.module'].sudo().search_read(
|
||||
['|', ('name', 'ilike', 'website'), ('application', '=', True)],
|
||||
['id', 'sequence', 'name', 'shortdesc', 'state'],
|
||||
order='sequence ASC'))
|
||||
else:
|
||||
apps_data = {}
|
||||
dashboard_data = {
|
||||
'groups': {
|
||||
'system': has_group_system,
|
||||
'website_designer': has_group_designer
|
||||
},
|
||||
'currency': request.env.user.company_id.currency_id.id,
|
||||
'dashboards': {
|
||||
'visits': {
|
||||
'ga_client_id': ga_client_id,
|
||||
}
|
||||
'apps_data': apps_data,
|
||||
'visits': {},
|
||||
}
|
||||
}
|
||||
if has_group_designer:
|
||||
ga_dashboard = request.env['ir.values'].sudo().get_default('website.config.settings', 'has_google_analytics_dashboard')
|
||||
if ga_dashboard:
|
||||
ga_client_id = request.env['ir.config_parameter'].sudo().get_param('google_management_client_id', default='')
|
||||
dashboard_data['dashboards']['visits']['ga_client_id'] = ga_client_id
|
||||
return dashboard_data
|
||||
|
||||
@@ -6,12 +6,14 @@ var ajax = require('web.ajax');
|
||||
var ControlPanelMixin = require('web.ControlPanelMixin');
|
||||
var core = require('web.core');
|
||||
var Dialog = require('web.Dialog');
|
||||
var formats = require('web.formats');
|
||||
var Model = require('web.Model');
|
||||
var session = require('web.session');
|
||||
var utils = require('web.utils');
|
||||
var web_client = require('web.web_client');
|
||||
var Widget = require('web.Widget');
|
||||
|
||||
var local_storage = require('web.local_storage');
|
||||
|
||||
var _t = core._t;
|
||||
var QWeb = core.qweb;
|
||||
|
||||
@@ -19,7 +21,9 @@ var Dashboard = Widget.extend(ControlPanelMixin, {
|
||||
template: "website.WebsiteDashboardMain",
|
||||
events: {
|
||||
'click .js_link_analytics_settings': 'on_link_analytics_settings',
|
||||
'click .o_dashboard_action': 'on_dashboard_action_clicked',
|
||||
'click .o_dashboard_action': 'on_dashboard_action',
|
||||
'click .o_dashboard_action_form': 'on_dashboard_action_form',
|
||||
'click .o_dashboard_hide_panel': 'on_dashboard_hide_panel',
|
||||
},
|
||||
|
||||
init: function(parent, context) {
|
||||
@@ -28,6 +32,7 @@ var Dashboard = Widget.extend(ControlPanelMixin, {
|
||||
this.date_range = 'week'; // possible values : 'week', 'month', year'
|
||||
this.date_from = moment().subtract(1, 'week');
|
||||
this.date_to = moment();
|
||||
this.hidden_apps = JSON.parse(local_storage.getItem('website_dashboard_hidden_app_ids') || '[]');
|
||||
|
||||
this.dashboards_templates = ['website.dashboard_visits'];
|
||||
this.graphs = [];
|
||||
@@ -107,7 +112,7 @@ var Dashboard = Widget.extend(ControlPanelMixin, {
|
||||
render_dashboards: function() {
|
||||
var self = this;
|
||||
_.each(this.dashboards_templates, function(template) {
|
||||
self.$('.o_website_dashboard').append(QWeb.render(template, {widget: self}));
|
||||
self.$('.o_website_dashboard_content').append(QWeb.render(template, {widget: self}));
|
||||
});
|
||||
},
|
||||
|
||||
@@ -140,7 +145,7 @@ var Dashboard = Widget.extend(ControlPanelMixin, {
|
||||
.append("svg");
|
||||
|
||||
svg
|
||||
.attr("height", '20em')
|
||||
.attr("height", '24em')
|
||||
.datum(chart_values)
|
||||
.call(chart);
|
||||
|
||||
@@ -206,7 +211,7 @@ var Dashboard = Widget.extend(ControlPanelMixin, {
|
||||
|
||||
var self = this;
|
||||
$.when(this.fetch_data()).then(function() {
|
||||
self.$('.o_website_dashboard').empty();
|
||||
self.$('.o_website_dashboard_content').empty();
|
||||
self.render_dashboards();
|
||||
self.render_graphs();
|
||||
});
|
||||
@@ -218,7 +223,7 @@ var Dashboard = Widget.extend(ControlPanelMixin, {
|
||||
this.update_cp();
|
||||
},
|
||||
|
||||
on_dashboard_action_clicked: function (ev) {
|
||||
on_dashboard_action: function (ev) {
|
||||
ev.preventDefault();
|
||||
var $action = $(ev.currentTarget);
|
||||
var additional_context = {};
|
||||
@@ -235,6 +240,32 @@ var Dashboard = Widget.extend(ControlPanelMixin, {
|
||||
});
|
||||
},
|
||||
|
||||
on_dashboard_action_form: function (ev) {
|
||||
ev.preventDefault();
|
||||
var $action = $(ev.currentTarget);
|
||||
this.do_action({
|
||||
name: $action.attr('name'),
|
||||
res_model: $action.data('res_model'),
|
||||
res_id: $action.data('res_id'),
|
||||
views: [[false, 'form']],
|
||||
type: 'ir.actions.act_window',
|
||||
}, {
|
||||
on_reverse_breadcrumb: this.on_reverse_breadcrumb
|
||||
});
|
||||
},
|
||||
|
||||
on_dashboard_hide_panel: function (ev) {
|
||||
ev.preventDefault();
|
||||
ev.stopPropagation();
|
||||
var $action = $(ev.currentTarget);
|
||||
// update hidden module list
|
||||
this.hidden_apps = JSON.parse(local_storage.getItem('website_dashboard_hidden_app_ids') || '[]');
|
||||
this.hidden_apps.push(JSON.parse($action.data('module_id')));
|
||||
local_storage.setItem('website_dashboard_hidden_app_ids', JSON.stringify(this.hidden_apps));
|
||||
// remove box
|
||||
$action.closest(".o_box_item").remove();
|
||||
},
|
||||
|
||||
update_cp: function() {
|
||||
var self = this;
|
||||
if (!this.$searchview) {
|
||||
@@ -535,24 +566,24 @@ var Dashboard = Widget.extend(ControlPanelMixin, {
|
||||
return i % keep_one_of === 0;
|
||||
});
|
||||
},
|
||||
format_number: function(value, symbol) {
|
||||
value = utils.human_number(value);
|
||||
if (symbol === 'currency') {
|
||||
format_number: function(value, type, digits, symbol) {
|
||||
if (type === 'currency') {
|
||||
return this.render_monetary_field(value, this.currency_id);
|
||||
} else {
|
||||
return value + (symbol || '');
|
||||
return formats.format_value(value || 0, {type: type, digits: digits}) + ' ' + symbol;
|
||||
}
|
||||
},
|
||||
render_monetary_field: function(value, currency_id) {
|
||||
var currency = session.get_currency(currency_id);
|
||||
var formatted_value = formats.format_value(value || 0, {type: "float", digits: currency && currency.digits});
|
||||
if (currency) {
|
||||
if (currency.position === "after") {
|
||||
value += currency.symbol;
|
||||
formatted_value += currency.symbol;
|
||||
} else {
|
||||
value = currency.symbol + value;
|
||||
formatted_value = currency.symbol + formatted_value;
|
||||
}
|
||||
}
|
||||
return value;
|
||||
return formatted_value;
|
||||
},
|
||||
|
||||
});
|
||||
|
||||
@@ -27,9 +27,9 @@
|
||||
|
||||
h4 { margin: 0 0 0 8px; }
|
||||
|
||||
h2 { color: @odoo-brand-primary; }
|
||||
h2, h4 { color: @odoo-brand-primary; }
|
||||
|
||||
.col-md-6 {
|
||||
.col-md-5, .col-md-7 {
|
||||
padding: 15px;
|
||||
|
||||
.js_field_selection {
|
||||
@@ -80,12 +80,6 @@
|
||||
.translate(45; 30) !important;
|
||||
}
|
||||
|
||||
g.nv-y.nv-axis, g.nv-x.nv-axis, g.nv-y.nv-axis .nv-axisMaxMin {
|
||||
text {
|
||||
opacity: .3 !important;
|
||||
}
|
||||
}
|
||||
|
||||
g.nv-x.nv-axis .tick > line {
|
||||
opacity: 0 !important;
|
||||
}
|
||||
@@ -122,7 +116,7 @@
|
||||
background-color: @odoo-brand-optional !important;
|
||||
}
|
||||
tr:last-child .legend-color-guide > div {
|
||||
background-color: darken(@odoo-brand-optional, 10%) !important;
|
||||
background-color: darken(@odoo-brand-lightsecondary, 10%) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -139,7 +133,7 @@
|
||||
display: block !important;
|
||||
}
|
||||
@media (min-width: @screen-sm-min) {
|
||||
flex: 0 0 20%;
|
||||
flex: 0 0 16.6%;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -172,7 +166,7 @@
|
||||
color: white;
|
||||
.o_apps_hidden {
|
||||
display: none;
|
||||
&.o_apps_hide_panel {
|
||||
&.o_dashboard_hide_panel {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: 0px;
|
||||
@@ -198,6 +192,10 @@
|
||||
|
||||
.o_dashboard_visits {
|
||||
|
||||
h2 {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.o_demo_background {
|
||||
|
||||
margin-top: 16px;
|
||||
|
||||
@@ -9,6 +9,7 @@
|
||||
<div class="o_dashboards">
|
||||
<div class="container-fluid o_website_dashboard">
|
||||
<t t-call="website.dashboard_header"/>
|
||||
<div class="o_website_dashboard_content"/>
|
||||
</div>
|
||||
</div>
|
||||
</t>
|
||||
@@ -22,17 +23,54 @@
|
||||
Go to Website
|
||||
</div>
|
||||
</a>
|
||||
<t t-if="widget.groups.system">
|
||||
<t t-set="apps" t-value="{
|
||||
'website_crm': {'icon': 'fa-file-text-o', 'help': _('Add a contact form to your Contact Us page.')},
|
||||
'website_sale': {'icon': 'fa-shopping-cart', 'help': _('Sell online to reach new customers.')},
|
||||
'website_blog': {'icon': 'fa-rss-square', 'help': _('Build up a community with an efficient content strategy.')},
|
||||
'website_hr_recruitment': {'icon': 'fa-suitcase', 'help': _('Promote your job announces to attract new talents.')},
|
||||
'website_event': {'icon': 'fa-ticket', 'help': _('Promote your events, manage attendance and sell tickets.')},
|
||||
'im_livechat': {'icon': 'fa-comments-o', 'help': _('Chat with your visitors in real time.')},
|
||||
}"/>
|
||||
</t>
|
||||
<t t-if="! widget.groups.system"><t t-set="apps" t-value="{}"/></t>
|
||||
<t t-set="vignette_max" t-value="6"/>
|
||||
<t t-set="vignette_nbr" t-value="1"/>
|
||||
<t t-foreach="apps" t-as="app">
|
||||
<t t-set="app_data" t-value="widget.dashboards_data.apps_data[app]"/>
|
||||
<t t-set="app_dashboard" t-value="apps[app]"/>
|
||||
<t t-if="vignette_nbr < vignette_max && widget.hidden_apps.indexOf(app_data['id']) == -1 && app_data['state'] == 'uninstalled'">
|
||||
<t t-set="vignette_nbr" t-value="vignette_nbr + 1"/>
|
||||
<a href="#" class="o_box_item o_dashboard_action_form"
|
||||
name="Apps"
|
||||
data-res_model="ir.module.module"
|
||||
t-att-data-res_id="app_data['id']"
|
||||
t-att-title="app_dashboard['help']">
|
||||
<div class="o_inner_box o_apps">
|
||||
<div class="o_apps_show">
|
||||
<i t-attf-class="fa #{app_dashboard['icon']} fa-3x"></i><br/>
|
||||
<t t-esc="app_data['shortdesc']"/>
|
||||
</div>
|
||||
<div class="o_apps_hidden">
|
||||
<i class="fa fa-plus-circle fa-3x"></i><br/>
|
||||
Add this feature
|
||||
</div>
|
||||
<i class="o_apps_hidden o_dashboard_hide_panel fa fa-close" t-att-data-module_id="app_data['id']" title="Remove this suggestion from dashboard"/>
|
||||
</div>
|
||||
</a>
|
||||
</t>
|
||||
</t>
|
||||
</div>
|
||||
</div>
|
||||
</t>
|
||||
|
||||
<t t-name="website.dashboard_visits">
|
||||
<div class="row o_dashboard_visits">
|
||||
<div class="row o_dashboard_visits" t-if="widget.groups.website_designer">
|
||||
<div class="col-xs-12 o_box">
|
||||
<h2>Visits</h2>
|
||||
<div t-if="widget.dashboards_data.visits && widget.dashboards_data.visits.ga_client_id">
|
||||
<div class="row js_analytics_components"/>
|
||||
<a href="#" t-if="widget.groups.system" class="js_link_analytics_settings">Edit my Analytics Client ID</a>
|
||||
<a href="#" class="js_link_analytics_settings">Edit my Analytics Client ID</a>
|
||||
</div>
|
||||
<div t-if="!(widget.dashboards_data.visits && widget.dashboards_data.visits.ga_client_id)" class="col-md-12">
|
||||
<div class="o_demo_background">
|
||||
@@ -40,8 +78,7 @@
|
||||
</div>
|
||||
<div class="o_buttons text-center">
|
||||
<h3>There is no data currently available.</h3>
|
||||
<button t-if="widget.groups.system" class="btn btn-sm btn-primary js_link_analytics_settings center-block mb8">Link my Analytics Account</button>
|
||||
<h5 t-if="!widget.groups.system">You do not have sufficient access rights to configure the Google Analytics account.</h5>
|
||||
<button class="btn btn-sm btn-primary js_link_analytics_settings center-block mb8">Link my Analytics Account</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -60,10 +97,10 @@
|
||||
</div>
|
||||
|
||||
<t t-name="website.DateRangeButtons">
|
||||
<div class="btn-group btn-group-sm o_date_range_buttons">
|
||||
<button class="btn btn-sm btn-default js_date_range active" data-date="week">Week</button>
|
||||
<button class="btn btn-sm btn-default js_date_range" data-date="month">Month</button>
|
||||
<button class="btn btn-sm btn-default js_date_range" data-date="year">Year</button>
|
||||
<div class="btn-group btn-group-sm o_date_range_buttons pull-right">
|
||||
<button class="btn btn-sm btn-default js_date_range active" data-date="week">Last Week</button>
|
||||
<button class="btn btn-sm btn-default js_date_range" data-date="month">Last Month</button>
|
||||
<button class="btn btn-sm btn-default js_date_range" data-date="year">Last Year</button>
|
||||
</div>
|
||||
</t>
|
||||
</templates>
|
||||
|
||||
Reference in New Issue
Block a user