Skip to content

Commit 0d4258d

Browse files
alap-odooalap-odoo
committed
[IMP] awesome_dashboard: added buttons and statistics data to dashboard module
Created customer and lead buttons and given their respective click events. Moreover, the cards were added to the dashboard component. Further, the statistics are added in the dashboard through an RPC call.
1 parent c5223ba commit 0d4258d

File tree

5 files changed

+133
-3
lines changed

5 files changed

+133
-3
lines changed

‎awesome_dashboard/static/src/dashboard.js

Lines changed: 29 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,38 @@
11
/** @odoo-module **/
22

3-
import { Component } from "@odoo/owl";
3+
import { Component, useState, onWillStart } from "@odoo/owl";
44
import { registry } from "@web/core/registry";
5+
import { Layout } from "@web/search/layout";
6+
import { useService } from "@web/core/utils/hooks";
7+
import { DashboardItem } from "./dashboardItem/dashboarditem";
8+
import { rpc } from "@web/core/network/rpc";
59

610
class AwesomeDashboard extends Component {
711
static template = "awesome_dashboard.AwesomeDashboard";
12+
13+
static components = { Layout, DashboardItem };
14+
15+
setup() {
16+
this.action = useService("action");
17+
this.state = useState({ statistics: null });
18+
19+
onWillStart(async () => {
20+
this.state.statistics = await rpc("/awesome_dashboard/statistics");
21+
});
22+
}
23+
24+
openCustomerView() {
25+
this.action.doAction("base.action_partner_form")
26+
}
27+
28+
openLeadsView() {
29+
this.action.doAction({
30+
type: 'ir.actions.act_window',
31+
target: 'current',
32+
res_model: 'crm.lead',
33+
views: [[false, 'list'], [false, 'form']],
34+
})
35+
}
836
}
937

1038
registry.category("actions").add("awesome_dashboard.dashboard", AwesomeDashboard);

‎awesome_dashboard/static/src/dashboard.scss

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
.o_dashboard{
2+
background-color: gray;
3+
}
4+
.o_dashboard_stat_block {
5+
text-align: center;
6+
margin-bottom: 24px;
7+
}
8+
9+
.o_dashboard_stat_label {
10+
font-weight: normal;
11+
margin-bottom: 10px;
12+
display: block;
13+
}
14+
15+
.o_dashboard_stat_value {
16+
font-size: 48px;
17+
color: #228B22;
18+
font-weight: bold;
19+
}

‎awesome_dashboard/static/src/dashboard.xml

Lines changed: 63 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,69 @@
1-
<?xml version="1.0" encoding="UTF-8" ?>
1+
<?xml version="1.0" encoding="UTF-8"?>
22
<templates xml:space="preserve">
33

44
<t t-name="awesome_dashboard.AwesomeDashboard">
5-
hello dashboard
5+
<Layout className="'o_dashboard h-100'" display="{controlPanel: {} }">
6+
<t t-set-slot="control-panel-create-button">
7+
<button type="button" class="btn btn-primary o-kanban-button-new"
8+
t-on-click="openCustomerView"
9+
>Customer</button>
10+
<button type="button" class="btn btn-primary o-kanban-button-new"
11+
t-on-click="openLeadsView"
12+
>Leads</button>
13+
</t>
14+
<div class="dashboard-items">
15+
<DashboardItem>
16+
<div class="o_dashboard_stat_block">
17+
<span class="o_dashboard_stat_label">
18+
<strong>New Orders This Month:</strong>
19+
</span>
20+
<span class="o_dashboard_stat_value">
21+
<t t-esc="state.statistics?.nb_new_orders" />
22+
</span>
23+
</div>
24+
</DashboardItem>
25+
<DashboardItem>
26+
<div class="o_dashboard_stat_block">
27+
<span class="o_dashboard_stat_label">
28+
<strong>Total Amount This Month:</strong>
29+
</span>
30+
<span class="o_dashboard_stat_value">
31+
<t t-esc="state.statistics?.total_amount" />
32+
</span>
33+
</div>
34+
</DashboardItem>
35+
<DashboardItem>
36+
<div class="o_dashboard_stat_block">
37+
<span class="o_dashboard_stat_label">
38+
<strong>Avg. T-Shirts per Order:</strong>
39+
</span>
40+
<span class="o_dashboard_stat_value">
41+
<t t-esc="state.statistics?.average_quantity" />
42+
</span>
43+
</div>
44+
</DashboardItem>
45+
<DashboardItem>
46+
<div class="o_dashboard_stat_block">
47+
<span class="o_dashboard_stat_label">
48+
<strong>Cancelled Orders:</strong>
49+
</span>
50+
<span class="o_dashboard_stat_value">
51+
<t t-esc="state.statistics?.nb_cancelled_orders" />
52+
</span>
53+
</div>
54+
</DashboardItem>
55+
<DashboardItem>
56+
<div class="o_dashboard_stat_block">
57+
<span class="o_dashboard_stat_label">
58+
<strong>Avg. Time New → Sent/Cancelled:</strong>
59+
</span>
60+
<span class="o_dashboard_stat_value">
61+
<t t-esc="state.statistics?.average_time" />
62+
</span>
63+
</div>
64+
</DashboardItem>
65+
</div>
66+
</Layout>
667
</t>
768

869
</templates>

‎awesome_dashboard/static/src/dashboardItem/dashboarditem.js

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import { Component } from "@odoo/owl"
2+
3+
export class DashboardItem extends Component {
4+
static template = "awesome_dashboard.DashboardItem"
5+
6+
static props = {
7+
size: { type: Number, optional: true, default: 1 },
8+
slots: {
9+
type: Object,
10+
shape: { default: true },
11+
},
12+
}
13+
}

‎awesome_dashboard/static/src/dashboardItem/dashboarditem.xml

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<?xml version="1.0" encoding="UTF-8"?>
2+
<templates xml:space="preserve">
3+
<t t-name="awesome_dashboard.DashboardItem">
4+
<t t-set="itemSize" t-value="props.size or 1"/>
5+
<div t-attf-style="width: #{18 * itemSize}rem; background: #fff; border-radius: 0.75rem; box-shadow: 0 2px 8px rgba(0,0,0,0.07); padding: 1rem; margin: 1rem; display: inline-flex; justify-content: center; vertical-align: top; min-height: 3rem;">
6+
<t t-slot="default"/>
7+
</div>
8+
</t>
9+
</templates>

0 commit comments

Comments
 (0)