[IMP] awesome_dashboard: added some statistics and caching

Author: yagho-odoo

awesome_dashboard/static/src/dashboard.js

@@ -1,6 +1,6 @@
 /** @odoo-module **/
 
-import { Component } from "@odoo/owl";
+import { Component, onWillStart } from "@odoo/owl";
 import { registry } from "@web/core/registry";
 import { Layout } from "@web/search/layout";
 import { useService } from "@web/core/utils/hooks";
@@ -20,7 +20,12 @@ class AwesomeDashboard extends Component {
     }
 
     setup() {
-      this.action = useService("action");
+        this.action = useService("action");
+        const statsService = useService("awesome_dashboard.getStats");
+
+        onWillStart(async () => {
+            this.result = await statsService.loadStatistics();
+        });
     }
 
     openCustomerKanban() {

awesome_dashboard/static/src/dashboard.xml

@@ -6,8 +6,33 @@
             <Layout className="'o_dashboard h-100'" display="props.display">
                 <button class="btn btn-primary myBtnChange" t-on-click="openCustomerKanban"> Open customer kanban </button>
                 <button class="btn btn-primary myBtnChange" t-on-click="openActivity"> Leads </button>
-                <DashboardItem > long content </DashboardItem>
-                <DashboardItem size="2"> very very very very long content </DashboardItem>
+                <div style="margin-left: 1rem;">
+                    <DashboardItem size="2"> Average quantity sold is : 
+                        <span style="color: green; font-weight: bolder; font-size: 27px;"> 
+                            <t t-esc="result.average_quantity"/>
+                        </span>
+                    </DashboardItem>
+                    <DashboardItem size="2"> Number of new orders this month : 
+                        <span style="color: green; font-weight: bolder; font-size: 27px;"> 
+                            <t t-esc="result.nb_new_orders"/>
+                        </span>
+                    </DashboardItem>
+                    <DashboardItem size="2"> Total amount of new orders this month : 
+                        <span style="color: green; font-weight: bolder; font-size: 27px;"> 
+                            <t t-esc="result.total_amount"/>
+                        </span>
+                    </DashboardItem>
+                    <DashboardItem size="2"> Number of cancelled orders this month : 
+                        <span style="color: green; font-weight: bolder; font-size: 27px;"> 
+                            <t t-esc="result.nb_cancelled_orders"/>
+                        </span>
+                    </DashboardItem>
+                    <DashboardItem size="2"> Average time for an order : 
+                        <span style="color: green; font-weight: bolder; font-size: 27px;"> 
+                            <t t-esc="result.average_time"/>
+                        </span>
+                    </DashboardItem>
+                </div>
             </Layout>
 
         </div>

awesome_dashboard/static/src/dashboard_item/dashboard_item.scss

@@ -1,4 +1,7 @@
 .box {
-    border: 3px;
+    border: 30px black;
+    // border-color: black;
+    border-radius: 10px;
     background-color: white;
+    margin: 1rem;
 }

awesome_dashboard/static/src/dashboard_item/dashboard_item.xml

@@ -2,9 +2,9 @@
 <templates xml:space="preserve">
 
     <t t-name="awesome_dashboard.DashboardItem">
-        <div  class="p-3 box" t-att-style="'width: ' + 18 * props.size + 'rem;'">
+        <span  class="p-3 box" t-att-style="'width: ' + 18 * props.size + 'rem;'">
             <t t-slot="default" />
-        </div>
+        </span>
     </t>
 
 </templates>

awesome_dashboard/static/src/get_statistics.js

@@ -0,0 +1,13 @@
+import { registry } from "@web/core/registry";
+import { rpc } from "@web/core/network/rpc";
+import { memoize } from "@web/core/utils/functions";
+
+export const getStatistics = {
+    async start() {
+        return {
+            loadStatistics: memoize(() => rpc("/awesome_dashboard/statistics")),
+        };    
+    },
+};
+
+registry.category("services").add("awesome_dashboard.getStats", getStatistics);