Skip to content

Commit ca9b0de

Browse files
nguyenntphnguyenntph
committed
[IMP] awesome_dashboard: Generic dashboard
1 parent 868a1fa commit ca9b0de

File tree

8 files changed

+127
-30
lines changed

8 files changed

+127
-30
lines changed

‎awesome_dashboard/static/src/dashboard/dashboard.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { useService } from "@web/core/utils/hooks";
44
import { Layout } from "@web/search/layout";
55
import { DashboardItem } from "./dashboard_item/dashboard_item";
66
import { PieChart } from "./pie_chart/pie_chart";
7+
import dashboard_items from "./dashboard_items";
78

89
class AwesomeDashboard extends Component {
910
static template = "awesome_dashboard.AwesomeDashboard";
@@ -13,6 +14,7 @@ class AwesomeDashboard extends Component {
1314
this.action = useService("action");
1415
this.statisticService = useService("statistics");
1516
this.statistics = useState(this.statisticService);
17+
this.items = dashboard_items;
1618
}
1719

1820
openLeads() {

‎awesome_dashboard/static/src/dashboard/dashboard.xml‎

Lines changed: 7 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -14,35 +14,13 @@
1414
Leads
1515
</button>
1616
</t>
17-
<div class="d-flex">
18-
<DashboardItem>
19-
Average amount of t-shirt by order this month
20-
<t t-set-slot="value" t-esc="statistics.average_quantity"/>
21-
</DashboardItem>
22-
<DashboardItem size="2">
23-
Average time for an order to go from 'new' to 'sent' or 'cancelled'
24-
<t t-set-slot="value" t-esc="statistics.average_time"/>
25-
</DashboardItem>
26-
<DashboardItem>
27-
Number of new orders this month
28-
<t t-set-slot="value" t-esc="statistics.nb_new_orders"/>
29-
</DashboardItem>
30-
</div>
31-
<div class="d-flex align-items-start">
32-
<DashboardItem>
33-
Number of cancelled orders this month
34-
<t t-set-slot="value" t-esc="statistics.nb_cancelled_orders"/>
35-
</DashboardItem>
36-
<DashboardItem>
37-
Total amount of new orders this month
38-
<t t-set-slot="value" t-esc="statistics.total_amount"/>
39-
</DashboardItem>
40-
<DashboardItem size="2">
41-
Shirt orders by size
42-
<t t-set-slot="value">
43-
<PieChart data="statistics.orders_by_size"/>
44-
</t>
45-
</DashboardItem>
17+
<div class="d-flex align-items-start flex-wrap">
18+
<t t-foreach="items" t-as="item" t-key="item.id">
19+
<DashboardItem size="item.size || 1">
20+
<t t-set="itemProp" t-value="item.props ? item.props(statistics) : {'data': statistics}"/>
21+
<t t-component="item.Component" t-props="itemProp" />
22+
</DashboardItem>
23+
</t>
4624
</div>
4725
</Layout>
4826
</t>

‎awesome_dashboard/static/src/dashboard/dashboard_item/dashboard_item.xml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
</t>
1212
</h5>
1313
<h1 class="text-success">
14-
<t t-slot="value"/>
14+
<t t-slot="value"/>
1515
</h1>
1616
</div>
1717
</div>

‎awesome_dashboard/static/src/dashboard/dashboard_items.js‎

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
import { PieChartCard } from "./pie_chart_card/pie_chart_card";
2+
import { NumberCard } from "./number_card/number_card";
3+
4+
export default [
5+
{
6+
id: "average_quantity",
7+
description: "Average amount of t-shirt",
8+
size: 1,
9+
Component: NumberCard,
10+
props: (data) => ({
11+
title: "Average amount of t-shirt by order this month",
12+
value: data.average_quantity,
13+
}),
14+
},
15+
{
16+
id: "average_time",
17+
description: "Average order time",
18+
size: 2,
19+
Component: NumberCard,
20+
props: (data) => ({
21+
title: "Average time for an order to go from 'new' to 'sent' or 'cancelled'",
22+
value: data.average_time,
23+
}),
24+
},
25+
{
26+
id: "nb_new_orders",
27+
description: "New orders",
28+
size: 2,
29+
Component: NumberCard,
30+
props: (data) => ({
31+
title: "Number of new orders this month",
32+
value: data.nb_new_orders,
33+
}),
34+
},
35+
{
36+
id: "nb_cancelled_orders",
37+
description: "Average amount of t-shirt",
38+
size: 1,
39+
Component: NumberCard,
40+
props: (data) => ({
41+
title: "Number of cancelled orders this month",
42+
value: data.nb_cancelled_orders,
43+
}),
44+
},
45+
{
46+
id: "total_amount",
47+
description: "Total new orders",
48+
size: 1,
49+
Component: NumberCard,
50+
props: (data) => ({
51+
title: "Total amount of new orders this month",
52+
value: data.total_amount,
53+
}),
54+
},
55+
{
56+
id: "orders_by_size",
57+
description: "Shirt orders by size",
58+
size: 2,
59+
Component: PieChartCard,
60+
props: (data) => ({
61+
title: "Shirt orders by size",
62+
value: data.orders_by_size,
63+
}),
64+
},
65+
]

‎awesome_dashboard/static/src/dashboard/number_card/number_card.js‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import { Component } from "@odoo/owl";
2+
3+
export class NumberCard extends Component {
4+
static template = "awesome_dashboard.NumberCard";
5+
static props = {
6+
title: String,
7+
value: Number,
8+
}
9+
}

‎awesome_dashboard/static/src/dashboard/number_card/number_card.xml‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<?xml version="1.0" encoding="UTF-8" ?>
2+
<templates xml:space="preserve">
3+
4+
<t t-name="awesome_dashboard.NumberCard">
5+
<div class="card-title">
6+
<h5>
7+
<t t-esc="props.title"/>
8+
</h5>
9+
<h1 class="text-success">
10+
<t t-esc="props.value"/>
11+
</h1>
12+
</div>
13+
</t>
14+
15+
</templates>
16+

‎awesome_dashboard/static/src/dashboard/pie_chart_card/pie_chart_card.js‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import { Component } from "@odoo/owl";
2+
import { PieChart } from "../pie_chart/pie_chart";
3+
4+
export class PieChartCard extends Component {
5+
static template = "awesome_dashboard.PieChartCard";
6+
static components = { PieChart };
7+
static props = {
8+
title: String,
9+
value: Object,
10+
}
11+
}

‎awesome_dashboard/static/src/dashboard/pie_chart_card/pie_chart_card.xml‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<?xml version="1.0" encoding="UTF-8" ?>
2+
<templates xml:space="preserve">
3+
4+
<t t-name="awesome_dashboard.PieChartCard">
5+
<div class="card-title">
6+
<h5>
7+
<t t-esc="props.title"/>
8+
</h5>
9+
<div>
10+
<PieChart data="props.value"/>
11+
</div>
12+
</div>
13+
</t>
14+
15+
</templates>
16+

0 commit comments

Comments
 (0)