Jan 06: [ADD] Initial Commit 'purchase_dashboard_advanced'

purchase_dashboard_advanced/README.rst

@@ -0,0 +1,44 @@
+.. image:: https://img.shields.io/badge/license-LGPL--3-green.svg
+    :target: https://www.gnu.org/licenses/lgpl-3.0-standalone.html
+    :alt: License: LGPL-3
+
+Advanced Purchase Dashboard
+===========================
+A dashboard for keeping track and evaluate various aspects of spending on purchases.
+
+Configuration
+=============
+- No additional configuration needed
+
+Company
+-------
+* `Cybrosys Techno Solutions <https://cybrosys.com/>`__
+
+License
+-------
+General Public License, Version 3 (LGPL v3).
+(https://www.gnu.org/licenses/lgpl-3.0-standalone.html)
+
+Credits
+-------
+* Developer:(V16) Jumana Jabin MP , Contact: odoo@cybrosys.com
+
+Contacts
+--------
+* Mail Contact : odoo@cybrosys.com
+* Website : https://cybrosys.com
+
+Bug Tracker
+-----------
+Bugs are tracked on GitHub Issues. In case of trouble, please check there if your issue has already been reported.
+
+Maintainer
+==========
+.. image:: https://cybrosys.com/images/logo.png
+   :target: https://cybrosys.com
+This module is maintained by Cybrosys Technologies.
+For support and more information, please visit `Our Website <https://cybrosys.com/>`__
+
+Further information
+===================
+HTML Description: `<static/description/index.html>`__

purchase_dashboard_advanced/__init__.py

@@ -0,0 +1,22 @@
+# -*- coding: utf-8 -*-
+#############################################################################
+#
+#    Cybrosys Technologies Pvt. Ltd.
+#
+#    Copyright (C) 2023-TODAY Cybrosys Technologies(<https://www.cybrosys.com>)
+#    Author: Jumana Jabin MP (odoo@cybrosys.com)
+#
+#    You can modify it under the terms of the GNU LESSER
+#    GENERAL PUBLIC LICENSE (LGPL v3), Version 3.
+#
+#    This program is distributed in the hope that it will be useful,
+#    but WITHOUT ANY WARRANTY; without even the implied warranty of
+#    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+#    GNU LESSER GENERAL PUBLIC LICENSE (LGPL v3) for more details.
+#
+#    You should have received a copy of the GNU LESSER GENERAL PUBLIC LICENSE
+#    (LGPL v3) along with this program.
+#    If not, see <http://www.gnu.org/licenses/>.
+#
+#############################################################################
+from . import models

purchase_dashboard_advanced/__manifest__.py

@@ -0,0 +1,51 @@
+# -*- coding: utf-8 -*-
+#############################################################################
+#
+#    Cybrosys Technologies Pvt. Ltd.
+#
+#    Copyright (C) 2023-TODAY Cybrosys Technologies(<https://www.cybrosys.com>)
+#    Author: Jumana Jabin MP (odoo@cybrosys.com)
+#
+#    You can modify it under the terms of the GNU LESSER
+#    GENERAL PUBLIC LICENSE (LGPL v3), Version 3.
+#
+#    This program is distributed in the hope that it will be useful,
+#    but WITHOUT ANY WARRANTY; without even the implied warranty of
+#    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+#    GNU LESSER GENERAL PUBLIC LICENSE (LGPL v3) for more details.
+#
+#    You should have received a copy of the GNU LESSER GENERAL PUBLIC LICENSE
+#    (LGPL v3) along with this program.
+#    If not, see <http://www.gnu.org/licenses/>.
+#
+#############################################################################
+{
+    'name': "Advanced Purchase Dashboard",
+    'version': '16.0.1.0.0',
+    'category': 'Purchases',
+    'summary': 'The Purchase Dashboard provides an detailed overview of your '
+               'purchases in a single screen',
+    'description': 'A dashboard for keeping track and evaluate various '
+                   'aspects of spending on purchases',
+    'author': 'Cybrosys Techno Solutions',
+    'company': 'Cybrosys Techno Solutions',
+    'maintainer': 'Cybrosys Techno Solutions',
+    'website': "https://www.cybrosys.com",
+    'depends': ['purchase'],
+    'data': [
+        'views/purchase_dashboard_advanced_menus.xml'
+    ],
+    'assets': {
+        'web.assets_backend': [
+            'purchase_dashboard_advanced/static/src/xml/*.xml',
+            'purchase_dashboard_advanced/static/src/js/*.js',
+            'purchase_dashboard_advanced/static/src/css/style.css',
+            'https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.bundle.js',
+        ],
+    },
+    'images': ['static/description/banner.jpg'],
+    'license': "LGPL-3",
+    'installable': True,
+    'auto_install': False,
+    'application': False,
+}

purchase_dashboard_advanced/doc/RELEASE_NOTES.md

@@ -0,0 +1,7 @@
+## Module <purchase_dashboard_advanced>
+
+#### 06.01.2024
+#### Version 16.0.1.0.0
+#### ADD
+
+- Initial commit for Advanced Purchase Dashboard

purchase_dashboard_advanced/models/__init__.py

@@ -0,0 +1,23 @@
+# -*- coding: utf-8 -*-
+#############################################################################
+#
+#    Cybrosys Technologies Pvt. Ltd.
+#
+#    Copyright (C) 2023-TODAY Cybrosys Technologies(<https://www.cybrosys.com>)
+#    Author: Jumana Jabin MP (odoo@cybrosys.com)
+#
+#    You can modify it under the terms of the GNU LESSER
+#    GENERAL PUBLIC LICENSE (LGPL v3), Version 3.
+#
+#    This program is distributed in the hope that it will be useful,
+#    but WITHOUT ANY WARRANTY; without even the implied warranty of
+#    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+#    GNU LESSER GENERAL PUBLIC LICENSE (LGPL v3) for more details.
+#
+#    You should have received a copy of the GNU LESSER GENERAL PUBLIC LICENSE
+#    (LGPL v3) along with this program.
+#    If not, see <http://www.gnu.org/licenses/>.
+#
+#############################################################################
+from . import purchase_order
+from . import purchase_order_line

purchase_dashboard_advanced/models/purchase_order.py

@@ -0,0 +1,539 @@
+# -*- coding: utf-8 -*-
+#############################################################################
+#
+#    Cybrosys Technologies Pvt. Ltd.
+#
+#    Copyright (C) 2023-TODAY Cybrosys Technologies(<https://www.cybrosys.com>)
+#    Author: Jumana Jabin MP (odoo@cybrosys.com)
+#
+#    You can modify it under the terms of the GNU LESSER
+#    GENERAL PUBLIC LICENSE (LGPL v3), Version 3.
+#
+#    This program is distributed in the hope that it will be useful,
+#    but WITHOUT ANY WARRANTY; without even the implied warranty of
+#    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+#    GNU LESSER GENERAL PUBLIC LICENSE (LGPL v3) for more details.
+#
+#    You should have received a copy of the GNU LESSER GENERAL PUBLIC LICENSE
+#    (LGPL v3) along with this program.
+#    If not, see <http://www.gnu.org/licenses/>.
+#
+#############################################################################
+import calendar
+from odoo import api, models
+
+
+class PurchaseOrder(models.Model):
+    """Model representing purchase orders and related analytics.Inherits from
+    'purchase.order' model."""
+    _inherit = 'purchase.order'
+
+    @api.model
+    def get_purchase_data(self):
+        """Returns data to the orm call to display the data in the tiles
+        :return: Dictionary with purchase data
+        :rtype: dict"""
+        orders = self.env['purchase.order'].search([('state', 'in', [
+            'purchase', 'done'])])
+        priority_orders = self.env['purchase.order'].search([
+            ('priority', '=', '1')])
+        vendor = list(set(rec.partner_id for rec in orders))
+        return {
+            'purchase_orders': len(orders),
+            'purchase_amount': sum(rec.amount_total for rec in orders),
+            'priority_orders': len(priority_orders),
+            'vendors': len(vendor)
+        }
+
+    def get_yearly_data(self):
+        """Get yearly purchase data.
+        :return: Dictionary with yearly purchase data
+        :rtype: dict"""
+        company = self.env.company.id
+        query = """
+               SELECT COUNT(*) as po_count, SUM(amount_total) as po_sum
+               FROM purchase_order
+               WHERE company_id = %s
+                   AND state IN ('purchase', 'done')
+                   AND date_order >= date_trunc('year', now())
+           """
+        self.env.cr.execute(query, (company,))
+        data = self.env.cr.dictfetchall()
+        query_priority = """
+               SELECT COUNT(*) as priority_count
+               FROM purchase_order po
+               WHERE company_id = %s
+                   AND state IN ('purchase', 'done')
+                   AND EXTRACT(YEAR from date_order) = EXTRACT(YEAR from now())
+                   AND priority = '1'
+           """
+        self.env.cr.execute(query_priority, (company,))
+        priority_orders = self.env.cr.dictfetchall()
+        query_vendors = """
+               SELECT COUNT(DISTINCT partner_id) as vendor_count
+               FROM purchase_order
+               WHERE company_id = %s
+                   AND state IN ('purchase', 'done')
+                   AND date_order < date_trunc('year', now())
+           """
+        self.env.cr.execute(query_vendors, (company,))
+        result = self.env.cr.dictfetchall()
+        if result:
+            previous_vendors = result[0]['vendor_count']
+        else:
+            previous_vendors = 0
+        query_current_vendors = """
+               SELECT COUNT(DISTINCT partner_id) as vendor_count
+               FROM purchase_order
+               WHERE company_id = %s
+                   AND state IN ('purchase', 'done')
+                   AND date_order BETWEEN date_trunc('year', now()) AND now()
+           """
+        self.env.cr.execute(query_current_vendors, (company,))
+        result = self.env.cr.dictfetchall()
+        if result:
+            current_vendors = result[0]['vendor_count']
+        else:
+            current_vendors = 0
+        new_vendors = current_vendors - previous_vendors
+        yearly = {
+            'purchase_orders': data[0]['po_count'],
+            'purchase_amount': data[0]['po_sum'] or 0,
+            'priority_orders': priority_orders[0]['priority_count'],
+            'vendors': new_vendors or 0,
+        }
+        return yearly
+
+    def get_monthly_data(self):
+        """Get monthly purchase data.
+        :return: Dictionary with monthly purchase data
+        :rtype: dict"""
+        company = self.env.company.id
+        query = """
+            SELECT COUNT(*), SUM(amount_total)
+            FROM purchase_order po
+            WHERE company_id = %s
+                AND state IN ('purchase', 'done')
+                AND EXTRACT(YEAR from date_order) = EXTRACT(YEAR from 
+                CURRENT_DATE)
+                AND EXTRACT(MONTH from date_order) = EXTRACT(MONTH from 
+                CURRENT_DATE)
+        """
+        self.env.cr.execute(query, (company,))
+        data = self.env.cr.dictfetchall()
+        query = """
+            SELECT COUNT(*)
+            FROM purchase_order po
+            WHERE company_id = %s
+                AND EXTRACT(YEAR from date_order) = EXTRACT(YEAR from 
+                CURRENT_DATE)
+                AND EXTRACT(MONTH from date_order) = EXTRACT(MONTH from
+                 CURRENT_DATE) 
+                AND priority = '1'
+        """
+        self.env.cr.execute(query, (company,))
+        priority_orders = self.env.cr.dictfetchall()
+        query = """
+            SELECT DISTINCT partner_id
+            FROM purchase_order po
+            WHERE company_id = %s
+                AND state IN ('purchase','done')
+                AND EXTRACT(month from date_order) < EXTRACT(month FROM
+                 CURRENT_DATE)
+        """
+        self.env.cr.execute(query, (company,))
+        previous_vendors = self.env.cr.dictfetchall()
+        previous = []
+        if len(previous_vendors) > 1:
+            previous = [rec['partner_id'] for rec in previous_vendors]
+        else:
+            previous.append(rec for rec in previous_vendors)
+        query = """
+            SELECT DISTINCT partner_id
+            FROM purchase_order po
+            WHERE company_id = %s
+                AND state IN ('purchase','done')
+                AND EXTRACT(YEAR from date_order) = EXTRACT(YEAR FROM
+                 CURRENT_DATE) 
+                AND EXTRACT(month from date_order) = EXTRACT(month FROM
+                 CURRENT_DATE)
+        """
+        self.env.cr.execute(query, (company,))
+        vendors = self.env.cr.dictfetchall()
+        new_vendors = []
+        if vendors:
+            if len(vendors) > 1:
+                for rec in vendors:
+                    if rec['partner_id'] not in previous:
+                        new_vendors.append(rec['partner_id'])
+            else:
+                if vendors not in previous:
+                    new_vendors.append(vendors[0]['partner_id'])
+        monthly = {
+            'purchase_orders': data[0]['count'],
+            'purchase_amount': data[0]['sum'],
+            'priority_orders': priority_orders[0]['count'],
+            'vendors': len(new_vendors),
+            'vendor_id': new_vendors,
+        }
+        return monthly
+
+    def get_weekly_data(self):
+        """Get weekly purchase data.
+        :return: Dictionary with weekly purchase data
+        :rtype: dict"""
+        company = self.env.company.id
+        query = """
+            SELECT COUNT(*), SUM(amount_total), COUNT(CASE WHEN priority = '1' 
+            THEN 1 ELSE NULL END)
+            FROM purchase_order
+            WHERE company_id = %s
+                AND state IN ('purchase', 'done')
+                AND EXTRACT(YEAR from date_order) = EXTRACT(YEAR from 
+                CURRENT_DATE)
+                AND EXTRACT(WEEK from date_order) = EXTRACT(WEEK from 
+                CURRENT_DATE)
+        """
+        self.env.cr.execute(query, [company])
+        data = self.env.cr.fetchone()
+        query = """
+            SELECT DISTINCT partner_id
+            FROM purchase_order
+            WHERE company_id = %s
+                AND state IN ('purchase', 'done')
+                AND EXTRACT(WEEK from date_order) < EXTRACT(WEEK FROM 
+                CURRENT_DATE)
+        """
+        self.env.cr.execute(query, [company])
+        previous_vendors = self.env.cr.dictfetchall()
+        previous = [rec['partner_id'] for rec in previous_vendors]
+        query = """
+            SELECT DISTINCT partner_id
+            FROM purchase_order
+            WHERE company_id = %s
+                AND state IN ('purchase', 'done')
+                AND EXTRACT(YEAR from date_order) = EXTRACT(YEAR FROM 
+                CURRENT_DATE) 
+                AND EXTRACT(WEEK from date_order) = EXTRACT(WEEK FROM 
+                CURRENT_DATE)
+        """
+        self.env.cr.execute(query, [company])
+        vendors = self.env.cr.dictfetchall()
+        new_vendors = [rec['partner_id'] for rec in vendors if rec[
+            'partner_id'] not in previous]
+        weekly = {
+            'purchase_orders': data[0],
+            'purchase_amount': data[1],
+            'priority_orders': data[2],
+            'vendors': len(new_vendors)
+        }
+        return weekly
+
+    def get_today_data(self):
+        """Get purchase data for the current day.
+        :return: Dictionary with purchase data for the current day
+        :rtype: dict"""
+        company = self.env.company.id
+        query = """
+            SELECT
+                COUNT(*) AS purchase_orders,
+                SUM(amount_total) AS purchase_amount,
+                COUNT(*) FILTER (WHERE priority = '1') AS priority_orders
+            FROM purchase_order
+            WHERE
+                company_id = %s
+                AND state IN ('purchase', 'done')
+                AND date_order::date = CURRENT_DATE
+        """
+        self.env.cr.execute(query, (company,))
+        today_data = self.env.cr.dictfetchall()[0]
+        query = """
+            SELECT DISTINCT partner_id
+            FROM purchase_order
+            WHERE
+                company_id = %s
+                AND state IN ('purchase', 'done')
+                AND date_order::date = CURRENT_DATE
+                AND NOT EXISTS (
+                    SELECT 1
+                    FROM purchase_order
+                    WHERE
+                        company_id = %s
+                        AND state IN ('purchase', 'done')
+                        AND date_order::date < CURRENT_DATE
+                        AND partner_id = purchase_order.partner_id)"""
+        self.env.cr.execute(query, (company, company))
+        new_vendors = [r['partner_id'] for r in self.env.cr.dictfetchall()]
+        return {
+            'purchase_orders': today_data['purchase_orders'],
+            'purchase_amount': today_data['purchase_amount'],
+            'priority_orders': today_data['priority_orders'],
+            'vendors': len(new_vendors),
+            'vendor_id': new_vendors,
+        }
+
+    @api.model
+    def get_select_mode_data(self, args):
+        """Get data based on the selected filters
+        :param args: Selected filter
+        :type args: str
+        :return: Data based on the selected filter
+        :rtype: dict or False"""
+        data = {
+            'this_year': self.get_yearly_data,
+            'this_month': self.get_monthly_data,
+            'this_week': self.get_weekly_data,
+            'today': self.get_today_data,
+        }.get(args)
+        return data() if data else False
+
+    def execute_query(self, query, args):
+        """Returns quantity/count regarding the top entities
+        :param query: SQL query to be executed
+        :type query: str
+        :param args: Query parameters
+        :type args: str
+        :return: Query results
+        :rtype: list"""
+        self._cr.execute(query)
+        results = self._cr.dictfetchall()
+        final = []
+        if args == 'top_product':
+            final = [[record.get('total_quantity') for record in results],
+                     [record.get('product_name') for record in results]]
+        elif args == 'top_vendor':
+            final = [[record.get('count') for record in results],
+                     [record.get('name') for record in results]]
+        elif args == 'top_rep':
+            final = [[record.get('count') for record in results],
+                     [record.get('name') for record in results]]
+        return final
+
+    @api.model
+    def get_top_chart_data(self, args):
+        """Get top chart data based on the selected filter.
+         :param args: Selected filter
+        :type args: str
+        :return: Top chart data
+        :rtype: list"""
+        query = ''
+        company_id = self.env.company.id
+        if args == 'top_product':
+            query = f'''
+                SELECT DISTINCT(product_template.name) as product_name,
+                SUM(product_qty) as total_quantity 
+                FROM purchase_order_line 
+                INNER JOIN product_product ON 
+                product_product.id=purchase_order_line.product_id 
+                INNER JOIN product_template ON 
+                product_product.product_tmpl_id = product_template.id 
+                WHERE purchase_order_line.company_id = {company_id} 
+                GROUP BY product_template.id 
+                ORDER BY total_quantity DESC 
+                LIMIT 10
+            '''
+        elif args == 'top_vendor':
+            query = f'''
+                SELECT partner.name, COUNT(po.id) as count
+                FROM purchase_order po
+                JOIN res_partner partner ON po.partner_id = partner.id
+                WHERE po.company_id = {company_id}
+                GROUP BY partner.name
+                ORDER BY count DESC 
+                LIMIT 10
+            '''
+        elif args == 'top_rep':
+            query = f'''
+                SELECT partner.name, COUNT(po.id) as count
+                FROM purchase_order po
+                JOIN res_users users ON po.user_id = users.id
+                JOIN res_partner partner ON users.partner_id = partner.id
+                WHERE po.company_id = {company_id}
+                GROUP BY partner.name
+                ORDER BY count DESC
+                LIMIT 10
+            '''
+        final = self.execute_query(query, args)
+        return final
+
+    @api.model
+    def get_orders_by_month(self):
+        """Get purchase orders grouped by month.
+        :return: Purchase orders by month
+        :rtype: dict"""
+        query = f"""select count(*), EXTRACT(month from date_order) as dates
+            from purchase_order po
+            where company_id = {self.env.company.id} and state = 'purchase'
+            group by dates"""
+        self.env.cr.execute(query, (self.env.company.id,))
+        cr = self.env.cr.dictfetchall()
+        month = []
+        for rec in cr:
+            month.append(int(rec['dates']))
+            rec.update({
+                'count': rec['count'],
+                'dates': calendar.month_name[int(rec['dates'])],
+                'month': int(rec['dates'])
+            })
+        for rec in range(1, 13):
+            if rec not in month:
+                cr.append({
+                    'count': 0,
+                    'dates': calendar.month_name[rec],
+                    'month': rec
+                })
+        cr = sorted(cr, key=lambda i: i['month'])
+        return {
+            'count': [rec['count'] for rec in cr],
+            'dates': [rec['dates'] for rec in cr]
+        }
+
+    @api.model
+    def purchase_vendors(self):
+        """Get a list of purchase vendors.
+        :return: List of purchase vendors in the format
+        [{'id': vendor_id, 'name': vendor_name}]
+        :rtype: list"""
+        company_id = self.env.company.id
+        query = """
+            SELECT partner.id, partner.name
+            FROM purchase_order po
+            INNER JOIN res_partner partner ON po.partner_id = partner.id
+            WHERE po.company_id = %s
+            GROUP BY partner.id
+        """
+        self._cr.execute(query, (company_id,))
+        return self._cr.dictfetchall()
+
+    @api.model
+    def purchase_vendor_details(self, args):
+        """Get purchase details for a specific vendor.
+        :param args: Vendor ID
+        :type args: int
+        :return: Purchase details for the specific vendor
+        :rtype: dict"""
+        company_id = self.env.company.id
+        partner = int(args) if args else 1
+        query = """
+            SELECT count(po.id),SUM(po.amount_total), EXTRACT(MONTH from 
+            po.date_order) as dates 
+            FROM purchase_order po 
+            JOIN res_partner ON res_partner.id = po.partner_id 
+            WHERE po.company_id = %s and po.partner_id = %s 
+            GROUP BY dates
+        """
+        self._cr.execute(query, (company_id, partner))
+        partner_orders = self._cr.dictfetchall()
+        query_draft = """
+            SELECT count(po.id),SUM(po.amount_total), EXTRACT(MONTH from 
+            po.date_order) as dates 
+            FROM purchase_order po 
+            JOIN res_partner ON res_partner.id = po.partner_id 
+            WHERE po.state in ('draft', 'sent') and po.company_id = %s and 
+            po.partner_id = %s 
+            GROUP BY dates"""
+        self._cr.execute(query_draft, (company_id, partner))
+        draft_orders = self._cr.dictfetchall()
+        approve_qry = """
+            SELECT count(po.id),SUM(po.amount_total), EXTRACT(MONTH from 
+            po.date_order) as dates 
+            FROM purchase_order po 
+            JOIN res_partner ON res_partner.id = po.partner_id 
+            WHERE po.state = 'to approve' and po.company_id = %s and 
+            po.partner_id = %s 
+            GROUP BY dates"""
+        self._cr.execute(approve_qry, (company_id, partner))
+        approve_orders = self._cr.dictfetchall()
+        cancel_qry = """
+            SELECT count(po.id),SUM(po.amount_total), EXTRACT(MONTH from 
+            po.date_order) as dates 
+            FROM purchase_order po 
+            JOIN res_partner ON res_partner.id = po.partner_id 
+            WHERE po.state = 'cancel' and po.company_id = %s and po.partner_id 
+            = %s 
+            GROUP BY dates"""
+        self._cr.execute(cancel_qry, (company_id, partner))
+        cancel_orders = self._cr.dictfetchall()
+        all_orders = {
+            'partner_orders': partner_orders, 'draft_orders': draft_orders,
+            'approve_orders': approve_orders, 'cancel_orders': cancel_orders}
+        for order_type, order_list in all_orders.items():
+            order_months = []
+            for rec in order_list:
+                order_months.append(int(rec.get('dates')))
+            for rec in range(1, 13):
+                if rec not in order_months:
+                    vals = {'sum': 0.0, 'dates': rec, 'count': 0}
+                    order_list.append(vals)
+            all_orders[order_type] = sorted(
+                order_list, key=lambda order: order['dates'])
+        value = {
+            'purchase_amount': [record.get('sum') for record in
+                                partner_orders],
+            'po_count': [record.get('count') for record in partner_orders],
+            'draft_amount': [record.get('sum') for record in draft_orders],
+            'draft_count': [record.get('count') for record in draft_orders],
+            'approve_amount': [record.get('sum') for record in approve_orders],
+            'approve_count': [record.get('count') for record in
+                              approve_orders],
+            'cancel_amount': [record.get('sum') for record in cancel_orders],
+            'cancel_count': [record.get('count') for record in cancel_orders],
+            'dates': [record.get('dates') for record in partner_orders],
+        }
+        return value
+
+    @api.model
+    def get_pending_purchase_data(self):
+        """Get pending purchase orders data.
+        :return: Data of pending purchase orders
+        :rtype: dict"""
+        company = self.env.company.id
+        query = """
+            SELECT po.name, po.id, rp.name as partner_name, po.date_planned, 
+            po.amount_total, po.state 
+            FROM purchase_order po 
+            JOIN purchase_order_line pol ON pol.order_id = po.id 
+            JOIN res_partner rp ON rp.id = po.partner_id 
+            WHERE po.date_planned < CURRENT_DATE AND pol.qty_received < 
+            pol.product_qty AND po.company_id = %s
+            GROUP BY po.id, rp.id
+        """
+        self._cr.execute(query, (company,))
+        orders = self._cr.dictfetchall()
+        value = {
+            'order': [rec['name'] for rec in orders],
+            'vendor': [rec['partner_name'] for rec in orders],
+            'amount': [rec['amount_total'] for rec in orders],
+            'date': [rec['date_planned'] for rec in orders],
+            'state': [rec['state'] for rec in orders],
+            'data': [list(val for val in rec.values()) for rec in orders]
+        }
+        return value
+
+    @api.model
+    def get_upcoming_purchase_data(self):
+        """Get upcoming purchase orders data.
+        :return: Data of upcoming purchase orders
+        :rtype: dict"""
+        company = self.env.company.id
+        query = """
+            SELECT po.name, po.id, rp.name as partner_name, po.date_planned, 
+            po.amount_total, po.state 
+            FROM purchase_order po 
+            JOIN purchase_order_line pol ON pol.order_id = po.id 
+            JOIN res_partner rp ON rp.id = po.partner_id 
+            WHERE po.date_planned > CURRENT_DATE AND pol.qty_received < 
+            pol.product_qty AND po.company_id = %s
+            GROUP BY po.id, rp.id
+        """
+        self._cr.execute(query, (company,))
+        orders = self._cr.dictfetchall()
+        value = {
+            'order': [rec['name'] for rec in orders],
+            'vendor': [rec['partner_name'] for rec in orders],
+            'amount': [rec['amount_total'] for rec in orders],
+            'date': [rec['date_planned'] for rec in orders],
+            'state': [rec['state'] for rec in orders],
+            'data': [list(val for val in rec.values()) for rec in orders],
+        }
+        return value

purchase_dashboard_advanced/models/purchase_order_line.py

@@ -0,0 +1,92 @@
+# -*- coding: utf-8 -*-
+#############################################################################
+#
+#    Cybrosys Technologies Pvt. Ltd.
+#
+#    Copyright (C) 2023-TODAY Cybrosys Technologies(<https://www.cybrosys.com>)
+#    Author: Jumana Jabin MP (odoo@cybrosys.com)
+#
+#    You can modify it under the terms of the GNU LESSER
+#    GENERAL PUBLIC LICENSE (LGPL v3), Version 3.
+#
+#    This program is distributed in the hope that it will be useful,
+#    but WITHOUT ANY WARRANTY; without even the implied warranty of
+#    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+#    GNU LESSER GENERAL PUBLIC LICENSE (LGPL v3) for more details.
+#
+#    You should have received a copy of the GNU LESSER GENERAL PUBLIC LICENSE
+#    (LGPL v3) along with this program.
+#    If not, see <http://www.gnu.org/licenses/>.
+#
+#############################################################################
+from odoo import api, models
+
+
+class PurchaseOrderLine(models.Model):
+    """Model representing purchase order lines and related analytics.
+      Inherits from 'purchase.order.line' model."""
+    _inherit = 'purchase.order.line'
+
+    @api.model
+    def product_categ_analysis(self):
+        """Get product category analysis data.
+         :return: Product category analysis data
+         :rtype: dict"""
+        company_id = self.env.user.company_id.id
+        quantity_query = """
+            SELECT product_template.name, SUM(pl.product_qty) as total_quantity
+            FROM purchase_order_line pl
+            JOIN product_product ON pl.product_id = product_product.id
+            JOIN product_template ON product_product.product_tmpl_id = 
+            product_template.id
+            WHERE pl.company_id = %s
+            GROUP BY product_template.name
+        """
+        self._cr.execute(quantity_query, (company_id,))
+        products_quantity = self._cr.fetchall()
+        name, quantity_done = zip(*products_quantity)
+        categories = self.get_categories()
+        value = {'name': name, 'count': quantity_done}
+        return {'values': value, 'category_id': categories}
+
+    def get_categories(self):
+        """Get product categories.
+        :return: Product categories
+        :rtype: list"""
+        category_query = """
+                    SELECT pc.id, pc.name
+                    FROM product_category pc
+                    JOIN product_template pt ON pt.categ_id = pc.id
+                    JOIN product_product pp ON pp.product_tmpl_id = pt.id
+                    JOIN purchase_order_line pl ON pl.product_id = pp.id
+                    WHERE pl.company_id = %s
+                    GROUP BY pc.id, pc.name
+                """
+        self._cr.execute(category_query, (self.env.user.company_id.id,))
+        return self._cr.fetchall()
+
+    @api.model
+    def product_categ_data(self, args):
+        """Get product category data.
+        :param args: Category ID
+        :type args: int
+        :return: Product category data
+        :rtype: dict"""
+        category_id = int(args or 1)
+        company_id = self.env.company.id
+        query = """
+            SELECT product_template.name, SUM(pl.product_qty)
+            FROM purchase_order_line pl
+            INNER JOIN product_product ON pl.product_id = product_product.id
+            INNER JOIN product_template ON product_product.product_tmpl_id = 
+            product_template.id
+            WHERE pl.company_id = %s AND product_template.categ_id = %s
+            GROUP BY product_template.name
+        """
+        self._cr.execute(query, (company_id, category_id))
+        product_move = self._cr.dictfetchall()
+        value = {
+            'name': [record.get('name') for record in product_move],
+            'count': [record.get('sum') for record in product_move],
+        }
+        return value

purchase_dashboard_advanced/static/description/index.html

@@ -0,0 +1,728 @@
+<div style="background-color: #714B67; min-height: 600px; width: 100%; padding: 15px; position: relative;">
+    <!-- TITLE BAR -->
+    <div
+            style="border-bottom: 1px solid #875A7B; padding: 15px; display: flex; justify-content: space-between; align-items: center;">
+        <img src="assets/misc/cybrosys-logo.png" width="42" height="42"
+             style="width: 42px; height: 42px;"/>
+        <div>
+            <div style="color: #7C7BAD; font-size: 14px; font-family: 'Montserrat', sans-serif; font-weight: bold; background-color: white; display: inline-block; padding: 3px 10px; border-radius: 50px;"
+                 class="mr-2">
+                <i class="fa fa-check mr-1"></i>Community
+            </div>
+            <div style="color: #875A7B; font-size: 14px; font-family: 'Montserrat', sans-serif; font-weight: bold; background-color: white; display: inline-block; padding: 3px 10px; border-radius: 50px;"
+                 class="mr-2">
+                <i class="fa fa-check mr-1"></i>Enterprise
+            </div>
+            <div style="color: #875A7B; font-size: 14px; font-family: 'Montserrat', sans-serif; font-weight: bold; background-color: white; display: inline-block; padding: 3px 10px; border-radius: 50px;"
+                 class="mr-2">
+                <i class="fa fa-check mr-1"></i>Odoo.Sh
+            </div>
+        </div>
+    </div>
+    <!-- END OF TITLE BAR -->
+
+    <!-- APP HERO -->
+    <h1 style="color: #FFFFFF; font-weight: bolder; font-size: 50px; text-align: center; margin-top: 50px;">
+        Advanced Purchase Dashboard
+    </h1>
+    <p style="color:#FFFFFF; padding: 8px 15px; text-align: center; font-size: 24px;">
+        A Dashboard For Keeping Track and Evaluate Various Aspects of Spending
+        on Purchases.
+    </p>
+    <!-- END OF APP HERO -->
+    <img src="assets/screenshots/hero.gif"
+         style="width: 75%; height: auto; position: absolute; margin-left: auto; margin-right: auto; top: 45%; left: 12%; right: auto;"/>
+
+</div>
+
+<!-- NAVIGATION SECTION -->
+<div class="d-flex align-items-center"
+     style="border-bottom: 2px solid #714B67; padding: 15px 0px; margin-top: 300px;">
+    <div class="d-flex justify-content-center align-items-center mr-2"
+         style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;">
+        <img src="assets/misc/compass.png"/>
+    </div>
+    <h2 class="mt-2"
+        style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;">
+        Explore This
+        Module</h2>
+</div>
+<div class="row my-4" style="font-family: 'Montserrat', sans-serif;">
+    <div class="col-sm-12 col-md-6 my-3">
+        <a href="#overview">
+            <div class="d-flex justify-content-between align-items-center"
+                 style="background-color: #f5f5f5; padding: 30px; width: 100%;">
+                <div>
+                    <span style="color: #714B67; font-size: 24px; font-weight: 500; display: block;">Overview</span>
+                    <span
+                            style="color: #714B67; font-size: 16px; font-weight: 400; color:#282F33;  display: block;">Learn
+                        more about this
+                        module</span>
+                </div>
+                <img src="assets/misc/right-arrow.png" width="36" height="36"/>
+            </div>
+        </a>
+    </div>
+    <div class="col-sm-12 col-md-6 my-3">
+        <a href="#features">
+            <div class="d-flex justify-content-between align-items-center"
+                 style="background-color: #f5f5f5; padding: 30px; width: 100%;">
+                <div>
+                    <span style="color: #714B67; font-size: 24px; font-weight: 500; display: block;">Features</span>
+                    <span
+                            style="color: #714B67; font-size: 16px; font-weight: 400; color:#282F33;  display: block;">View
+                        features of this
+                        module</span>
+                </div>
+                <img src="assets/misc/right-arrow.png" width="36" height="36"/>
+            </div>
+        </a>
+    </div>
+    <div class="col-sm-12 col-md-6 my-3">
+        <a href="#screenshots">
+            <div class="d-flex justify-content-between align-items-center"
+                 style="background-color: #f5f5f5; padding: 30px; width: 100%;">
+                <div>
+                    <span style="color: #714B67; font-size: 24px; font-weight: 500; display: block;">Screenshots</span>
+                    <span
+                            style="color: #714B67; font-size: 16px; font-weight: 400; color:#282F33;  display: block;">View
+                        screenshots of this
+                        module</span>
+                </div>
+                <img src="assets/misc/right-arrow.png" width="36" height="36"/>
+            </div>
+        </a>
+    </div>
+</div>
+<!-- END OF NAVIGATION SECTION -->
+
+<!-- OVERVIEW SECTION -->
+<div class="d-flex align-items-center"
+     style="border-bottom: 2px solid #714B67; padding: 15px 0px;"
+     id="overview">
+    <div class="d-flex justify-content-center align-items-center mr-2"
+         style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;">
+        <img src="assets/misc/pie-chart.png"/>
+    </div>
+    <h2 class="mt-2"
+        style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;">
+        Overview
+    </h2>
+</div>
+<div class="row"
+     style="font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 14px; line-height: 200%;">
+    <div class="col-sm-12 py-4">
+        A dashboard for keeping track and evaluate various aspects of spending
+        on purchases , We can track Monthly , yearly and vendor details , top
+        products , priority products and upcoming details of purchase.
+    </div>
+</div>
+<!-- END OF OVERVIEW SECTION -->
+
+<!-- FEATURES SECTION -->
+<div class="d-flex align-items-center"
+     style="border-bottom: 2px solid #714B67; padding: 15px 0px;"
+     id="features">
+    <div class="d-flex justify-content-center align-items-center mr-2"
+         style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;">
+        <img src="assets/misc/features.png"/>
+    </div>
+    <h2 class="mt-2"
+        style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;">
+        Features
+    </h2>
+</div>
+<div class="row"
+     style="font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 14px; line-height: 200%;">
+    <div class="col-sm-12 col-md-6">
+        <div class="d-flex align-items-center"
+             style="margin-top: 40px; margin-bottom: 40px">
+            <img src="assets/misc/check-box.png" class="mr-2"/>
+            <span style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Detailed View for Purchases
+                        </span>
+        </div>
+        <div class="d-flex align-items-center"
+             style="margin-top: 30px; margin-bottom: 30px">
+            <img src="assets/misc/check-box.png" class="mr-2"/>
+            <span style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Responsive Views            </span>
+        </div>
+        <div class="d-flex align-items-center"
+             style="margin-top: 30px; margin-bottom: 30px">
+            <img src="assets/misc/check-box.png" class="mr-2"/>
+            <span style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Different Types of Graphs
+            </span>
+        </div>
+        <div class="d-flex align-items-center"
+             style="margin-top: 30px; margin-bottom: 30px">
+            <img src="assets/misc/check-box.png" class="mr-2"/>
+            <span style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Different Types of Tables for Analysing the Records            </span>
+        </div>
+
+    </div>
+</div>
+
+<!-- END OF FEATURES SECTION -->
+
+<!-- SCREENSHOTS SECTION -->
+<div class="row" id="screenshots">
+    <div class="col-md-12"
+         style="border-bottom: 1px solid #d5d5d5 !important; margin: 2rem 0 !important">
+        <h2
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;">
+            <i class="fa fa-image mr-2"></i>Screenshots
+        </h2>
+    </div>
+    <div class="col-lg-12 my-2">
+        <h4 class="mt-2"
+            style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+            Dashboard View</h4>
+
+        <img src="assets/screenshots/1.png"
+             class="img-responsive img-thumbnail border" width="100%"
+             height="auto"/>
+        <img src="assets/screenshots/2.png"
+             class="img-responsive img-thumbnail border" width="100%"
+             height="auto"/>
+    </div>
+    <div class="col-lg-12 my-3">
+        <h4 class="mt-2"
+            style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+            Dashboard Tiles</h4>
+        <p
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #282F33 !important; font-size: 1rem !important;">
+            The Tiles display a list of the purchase orders,Total amount,
+            Priority orders and Vendors based on today,This Week, This Month
+            and This Year
+        </p>
+        <img src="assets/screenshots/3.png"
+             class="img-responsive img-thumbnail border" width="100%"
+             height="auto"/>
+    </div>
+    <div class="col-lg-12 my-3">
+        <h4 class="mt-3"
+            style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+            Top Charts</h4>
+        <p style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #282F33 !important; font-size: 1rem !important;">
+            This is the pie graph for showing the top products, vendors,
+            purchase representatives
+        </p>
+        <img src="assets/screenshots/4.png"
+             class="img-responsive img-thumbnail border" width="100%"
+             height="auto"/>
+    </div>
+
+    <div class="col-lg-12 my-3">
+        <h4 class="mt-3"
+            style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+            Purchases By Month</h4>
+        <p style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #282F33 !important; font-size: 1rem !important;">
+            This bar graph shows the purchases made in each month.
+        </p>
+        <img src="assets/screenshots/5.png"
+             class="img-responsive img-thumbnail border" width="100%"
+             height="auto"/>
+    </div>
+
+    <div class="col-lg-12 my-3">
+        <h4 class="mt-3"
+            style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+            Purchase Vendor Analysis</h4>
+        <p
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #282F33 !important; font-size: 1rem !important;">
+            This is a line graph containing multiple attributes on it. This
+            will show the purchases and its states based on the vendors.
+        </p>
+        <img src="assets/screenshots/6.png"
+             class="img-responsive img-thumbnail border" width="100%"
+             height="auto"/>
+    </div>
+    <div class="col-lg-12 my-3">
+        <h4 class="mt-3"
+            style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+            Product Category Analysis</h4>
+        <p
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #282F33 !important; font-size: 1rem !important;">
+            This is a line graph used to plot the product category analysis. It
+            will demonstrate the quantity of products based on the category
+            selected.
+        </p>
+        <img src="assets/screenshots/7.png"
+             class="img-responsive img-thumbnail border" width="100%"
+             height="auto"/>
+    </div>
+
+    <div class="col-lg-12 my-3">
+        <h4 class="mt-3"
+            style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+            Pending Arrivals</h4>
+        <p
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #282F33 !important; font-size: 1rem !important;">
+            There are pending purchase orders with partial deliveries, where
+            some products have been delivered, but the rest are still awaiting
+            delivery.
+        </p>
+        <img src="assets/screenshots/8.png"
+             class="img-responsive img-thumbnail border" width="100%"
+             height="auto"/>
+    </div>
+    <div class="col-lg-12 my-3">
+        <h4 class="mt-3"
+            style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+            Upcoming Arrivals</h4>
+        <p style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #282F33 !important; font-size: 1rem !important;">
+            This is the table of contents describing the purchase order that is
+            yet to arrive.
+        </p>
+        <img src="assets/screenshots/9.png"
+             class="img-responsive img-thumbnail border" width="100%"
+             height="auto"/>
+    </div>
+    <!-- END OF SCREENSHOTS SECTION -->
+
+
+    <!-- RELATED PRODUCTS -->
+    <div class="d-flex align-items-center"
+         style="border-bottom: 2px solid #714B67; padding: 15px 0px;">
+        <div class="d-flex justify-content-center align-items-center mr-2"
+             style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;">
+            <img src="assets/misc/categories.png"/>
+        </div>
+        <h2 class="mt-2"
+            style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;">
+            Related
+            Products
+        </h2>
+    </div>
+    <div class="row">
+        <div class="col-sm-12">
+            <div id="demo1" class="row carousel slide" data-ride="carousel">
+                <!-- The slideshow -->
+                <div class="carousel-inner" style="padding: 30px;">
+                    <div class="carousel-item" style="min-height: 198.656px;">
+                        <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16"
+                             style="float:left">
+                            <a href="https://apps.odoo.com/apps/modules/16.0/odoo_dynamic_dashboard/"
+                               target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                         style="border-radius: 0px;"
+                                         src="assets/modules/11.png">
+                                </div>
+                            </a>
+                        </div>
+                        <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16"
+                             style="float:left">
+                            <a href="https://apps.odoo.com/apps/modules/16.0/crm_dashboard/"
+                               target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                         style="border-radius: 0px;"
+                                         src="assets/modules/12.png">
+                                </div>
+                            </a>
+                        </div>
+                        <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16"
+                             style="float:left">
+                            <a href="https://apps.odoo.com/apps/modules/16.0/dashboard_pos/"
+                               target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                         style="border-radius: 0px;"
+                                         src="assets/modules/13.png">
+                                </div>
+                            </a>
+                        </div>
+                    </div>
+                    <div class="carousel-item active"
+                         style="min-height: 198.656px;">
+                        <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16"
+                             style="float:left">
+                            <a href="https://apps.odoo.com/apps/modules/16.0/inventory_stock_dashboard_odoo/"
+                               target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                         style="border-radius: 0px;"
+                                         src="assets/modules/14.png">
+                                </div>
+                            </a>
+                        </div>
+                        <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16"
+                             style="float:left">
+                            <a href="https://apps.odoo.com/apps/modules/16.0/project_dashboard_odoo/"
+                               target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                         style="border-radius: 0px;"
+                                         src="assets/modules/15.png">
+                                </div>
+                            </a>
+                        </div>
+                        <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16"
+                             style="float:left">
+                            <a href="https://apps.odoo.com/apps/modules/16.0/portal_dashboard/"
+                               target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                         style="border-radius: 0px;"
+                                         src="assets/modules/16.png">
+                                </div>
+                            </a>
+                        </div>
+                    </div>
+                </div>
+                <!-- Left and right controls -->
+                <a class="carousel-control-prev" href="#demo1"
+                   data-slide="prev"
+                   style="width:35px; color:#000"> <span
+                        class="carousel-control-prev-icon"><i
+                        class="fa fa-chevron-left"
+                        style="font-size:24px"></i></span>
+                </a> <a class="carousel-control-next" href="#demo1"
+                        data-slide="next" style="width:35px; color:#000">
+            <span class="carousel-control-next-icon"><i
+                    class="fa fa-chevron-right"
+                    style="font-size:24px"></i></span>
+            </a>
+            </div>
+        </div>
+    </div>
+    <!-- END OF RELATED PRODUCTS -->
+
+    <!-- OUR SERVICES -->
+
+    <div class="d-flex align-items-center"
+         style="border-bottom: 2px solid #714B67; padding: 15px 0px;">
+        <div class="d-flex justify-content-center align-items-center mr-2"
+             style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;">
+            <img src="assets/misc/star.png"/>
+        </div>
+        <h2 class="mt-2"
+            style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;">
+            Our Services
+        </h2>
+    </div>
+
+    <div class="container my-5">
+        <div class="row">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                     style="background-color: #1dd1a1 !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/cogs.png" class="img-responsive"
+                         height="48px" width="48px">
+                </div>
+                <h6 class="text-center"
+                    style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Customization</h6>
+            </div>
+
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                     style="background-color: #ff6b6b !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/wrench.png" class="img-responsive"
+                         height="48px" width="48px">
+                </div>
+                <h6 class="text-center"
+                    style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Implementation</h6>
+            </div>
+
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                     style="background-color: #6462CD !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/lifebuoy.png" class="img-responsive"
+                         height="48px" width="48px">
+                </div>
+                <h6 class="text-center"
+                    style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Support</h6>
+            </div>
+
+
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                     style="background-color: #ffa801 !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/user.png" class="img-responsive"
+                         height="48px" width="48px">
+                </div>
+                <h6 class="text-center"
+                    style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Hire
+                    Odoo
+                    Developer</h6>
+            </div>
+
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                     style="background-color: #54a0ff  !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/puzzle.png" class="img-responsive"
+                         height="48px" width="48px">
+                </div>
+                <h6 class="text-center"
+                    style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Integration</h6>
+            </div>
+
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                     style="background-color: #6d7680 !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/update.png" class="img-responsive"
+                         height="48px" width="48px">
+                </div>
+                <h6 class="text-center"
+                    style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Migration</h6>
+            </div>
+
+
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                     style="background-color: #786fa6 !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/consultation.png"
+                         class="img-responsive" height="48px" width="48px">
+                </div>
+                <h6 class="text-center"
+                    style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Consultancy</h6>
+            </div>
+
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                     style="background-color: #f8a5c2 !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/training.png" class="img-responsive"
+                         height="48px" width="48px">
+                </div>
+                <h6 class="text-center"
+                    style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Implementation</h6>
+            </div>
+
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                     style="background-color: #e6be26 !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/license.png" class="img-responsive"
+                         height="48px" width="48px">
+                </div>
+                <h6 class="text-center"
+                    style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Licensing Consultancy</h6>
+            </div>
+        </div>
+
+    </div>
+
+    <!-- END OF OUR SERVICES -->
+
+    <!-- OUR INDUSTRIES -->
+
+    <div class="d-flex align-items-center"
+         style="border-bottom: 2px solid #714B67; padding: 15px 0px;">
+        <div class="d-flex justify-content-center align-items-center mr-2"
+             style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;">
+            <img src="assets/misc/corporate.png"/>
+        </div>
+        <h2 class="mt-2"
+            style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;">
+            Our
+            Industries
+        </h2>
+    </div>
+
+    <div class="container my-5">
+        <div class="row">
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                     style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;">
+                    <img src="assets/icons/trading-black.png"
+                         class="img-responsive mb-3" height="48px"
+                         width="48px">
+                    <h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        Trading
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        Easily procure
+                        and
+                        sell your products</p>
+                </div>
+            </div>
+
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                     style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;">
+                    <img src="assets/icons/pos-black.png"
+                         class="img-responsive mb-3" height="48px"
+                         width="48px">
+                    <h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        POS
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        Easy
+                        configuration
+                        and convivial experience</p>
+                </div>
+            </div>
+
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                     style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;">
+                    <img src="assets/icons/education-black.png"
+                         class="img-responsive mb-3" height="48px"
+                         width="48px">
+                    <h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        Education
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        A platform for
+                        educational management</p>
+                </div>
+            </div>
+
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                     style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;">
+                    <img src="assets/icons/manufacturing-black.png"
+                         class="img-responsive mb-3" height="48px"
+                         width="48px">
+                    <h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        Manufacturing
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        Plan, track and
+                        schedule your operations</p>
+                </div>
+            </div>
+
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                     style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;">
+                    <img src="assets/icons/ecom-black.png"
+                         class="img-responsive mb-3" height="48px"
+                         width="48px">
+                    <h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        E-commerce &amp; Website
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        Mobile
+                        friendly,
+                        awe-inspiring product pages</p>
+                </div>
+            </div>
+
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                     style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;">
+                    <img src="assets/icons/service-black.png"
+                         class="img-responsive mb-3" height="48px"
+                         width="48px">
+                    <h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        Service Management
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        Keep track of
+                        services and invoice</p>
+                </div>
+            </div>
+
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                     style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;">
+                    <img src="assets/icons/restaurant-black.png"
+                         class="img-responsive mb-3" height="48px"
+                         width="48px">
+                    <h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        Restaurant
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        Run your bar or
+                        restaurant methodically</p>
+                </div>
+            </div>
+
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                     style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;">
+                    <img src="assets/icons/hotel-black.png"
+                         class="img-responsive mb-3" height="48px"
+                         width="48px">
+                    <h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        Hotel Management
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        An
+                        all-inclusive
+                        hotel management application</p>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <!-- END OF OUR INDUSTRIES -->
+
+    <!-- SUPPORT -->
+    <div class="d-flex align-items-center"
+         style="border-bottom: 2px solid #714B67; padding: 15px 0px;">
+        <div class="d-flex justify-content-center align-items-center mr-2"
+             style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;">
+            <img src="assets/misc/customer-support.png"/>
+        </div>
+        <h2 class="mt-2"
+            style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;">
+            Support
+        </h2>
+    </div>
+    <div class="container mt-5">
+        <div class="row">
+            <div class="col-sm-12 col-md-6">
+                <div style="background-color: #F6F8F9; padding: 30px; display: flex; align-items: center;">
+                    <div class="mr-4"
+                         style="background-color: #714B67; display: inline-block; height: 70px; width: 70px; display: flex; align-items: center; justify-content: center;">
+                        <img src="assets/misc/support.png" height="48"
+                             width="48" style="width: 42px; height: 42px;"/>
+                    </div>
+                    <div>
+                        <h4>Need Help?</h4>
+                        <p style="line-height: 100%;">Got questions or need
+                            help? Get in touch.</p>
+                        <a href="mailto:odoo@cybrosys.com">
+                            <p style="font-weight: 400; font-size: 28px; line-height: 80%; color: #714B67;">
+                                odoo@cybrosys.com</p>
+                        </a>
+                    </div>
+                </div>
+            </div>
+            <div class="col-sm-12 col-md-6">
+                <div style="background-color: #F6F8F9; padding: 30px; display: flex; align-items: center;">
+                    <div class="mr-4"
+                         style="background-color: #2AC44D; display: inline-block; height: 70px; width: 70px; display: flex; align-items: center; justify-content: center;">
+                        <img src="assets/misc/whatsapp.png" height="52"
+                             width="52" style="width: 52px; height: 52px;"/>
+                    </div>
+                    <div>
+                        <h4>WhatsApp</h4>
+                        <p style="line-height: 100%;">Say hi to us on
+                            WhatsApp!</p>
+                        <a href="https://api.whatsapp.com/send?phone=918606827707">
+                            <p style="font-weight: 400; font-size: 28px; line-height: 80%; color: #714B67;">
+                                +91 86068
+                                27707</p>
+                        </a>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-sm-12 my-5 d-flex justify-content-center align-items-center">
+                <img src="assets/misc/logo.png" width="144" height="31"
+                     style="width:144px; height: 31px; margin-top: 40px;"/>
+            </div>
+        </div>
+    </div>
+    <!-- END OF SUPPORT -->
+</div>

purchase_dashboard_advanced/static/src/css/style.css

@@ -0,0 +1,333 @@
+.oh_dashboards{
+    padding-top :15px;
+    background-color: #f8faff !important;
+}
+
+.oh-card h4 {
+    font-size: 1.1rem;
+}
+
+/*    Widget One
+---------------------------*/
+.stat-content {
+    display: inline-block;
+    width: 66%;
+}
+.stat-icon{
+    display: inline-block;
+}
+
+.stat-widget-one .stat-icon {
+    vertical-align: top;
+    margin: auto;
+    width: 100%;
+    color: #01c490;
+}
+.oh-card {
+
+    padding-top: 0px;
+    padding: 0px;
+    margin-bottom: 1.5rem;
+    border-radius: 0px;
+    box-shadow: none;
+    background: none;
+    transition: transform 0.2s ease, box-shadow 0.2s ease;
+    will-change: transform, box-shadow;
+
+}
+.oh-card:hover {
+
+    transform: translateY(-2px) translateZ(0) !important;
+    box-shadow: 0 10px 10px 0 rgba(62, 57, 107, 0.12), 0 0 0 transparent !important;
+
+}
+.oh-data {
+
+    margin-top: 4.5%;
+
+}
+
+.oh-data .oh-card {
+
+    transition: transform 0.2s ease, box-shadow 0.2s ease;
+    will-change: transform, box-shadow;
+    box-shadow: 0 10px 40px 0 rgba(62,57,107,0.07), 0 2px 9px 0 rgba(62,57,107,0.06);
+
+}
+.stat-widget-one .stat-icon i {
+  font-size: 30px;
+  font-weight: 900;
+  display: inline-block;
+  color: #01c490;}
+
+.stat-widget-one .stat-text {
+    font-size: 14px;
+    color: #868e96;
+    font-weight: bold;
+}
+.stat-widget-one .stat-digit {
+  font-size: 24px;
+  color: #02448b; }
+
+.stat-count {
+  font-size: 20px;
+  text-align: center;
+  color: #00438b;}
+
+.stat-title {
+  font-size: 17px;
+  text-align: center;
+  color: #00438b; }
+
+  .oh-data .stat-icon {
+
+    width: 30%;
+    height: 85px;
+    text-align: center;
+    background: #ff8762;
+    color: #fff;
+    width: 32%;
+    padding-top: 2%;
+    font-size: xxx-large;
+
+}
+.stat-widget-one .stat-text {
+    font-size: 14px;
+    color: #ff8762;
+    margin-top: 2.3rem;
+    margin-left: 1rem;
+}
+
+.stat-widget-one .stat-digit {
+    font-size: 26px;
+    color:#993232;
+    margin-left: 1rem;
+    margin-top: -1px;
+    font-family: initial
+}
+
+.stat-widget-one .stat-icon i {
+
+    font-size: 25px;
+    font-weight: 900;
+    display: inline-block;
+    color: #fff;
+
+}
+.stat-widget-one {
+
+    background-color: white;
+    text-align: left;
+
+}
+.stat-widget-one {
+    width: 100%;
+}
+.oh-data .stat-icon {
+
+    width: 30%;
+    height: 85px;
+    text-align: center;
+    padding-top: 2%;
+
+}
+
+h4 .stat-count {
+    font-size: 17px;
+    text-align: center;
+    color: #000 !important;
+    margin-top: 0px;
+    width: 100%;
+    float: left;
+    margin: 0;
+}
+
+.stat-head {
+    text-align: left !important;
+    font-weight: 300;
+    font-size: 15px;
+    margin-bottom: 25px;
+    margin-left: 24px;
+    width: 100%;
+}
+.oh-card-body {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+
+.o_action_manager{
+     overflow-y: scroll !important;
+    max-width:100%;
+ }
+
+.stat_count{
+    margin-top: -89px;
+    margin-left: 35px;
+    font-size: 33px;
+}
+
+
+.stat-head {
+    text-align: left !important;
+    font-weight: 300;
+    font-size: 18px;
+    margin-bottom: 25px;
+    margin-left: 24px;
+    width: 100%;
+    margin-top: 57px;
+    color: black;
+}
+#product_categ_selection{
+    color:black;
+    background-color  : white;
+
+}
+.top_chart{
+    height: fit-content;
+}
+.row.main-section {
+    margin-right: 0px; !important;
+}
+
+.chart-container {
+    border-radius: 0.3rem;
+    padding: 1rem;
+    margin: 1rem auto;
+}
+
+.chart-container.card-shadow {
+    height: 100%;
+}
+
+.half_chart.chart-container.card-shadow {
+	height: 49%;
+}
+#container {
+    height: 400px;
+}
+/*vendor analysis*/
+
+
+#vendor_selection {
+   transform: translateX(223%) translateY(-198%);
+   background: white;
+   width:30%;
+   color:black
+
+}
+
+/*category analysis*/
+
+/*table*/
+.graph_details_table{
+position: absolute;
+  top: 45px;
+  right: 15px;
+
+ background-color: white;
+ border-collapse: collapse;
+ border: 1px solid #ddd;
+
+}
+
+.graph_details_table th{
+background-color:#67b7dc;
+color: white;
+  width: 250px;
+  height: 30px;
+}
+
+.graph_details_table td{
+border: 1px solid #ddd;
+height: 20px;
+}
+
+.graph_details_table tr:nth-child(even){background-color: #f2f2f2;}
+
+.graph_details_table tr:hover {background-color: #ddd;}
+
+.chart-container h2 {
+    font-weight: 700;
+    font-size: 1.690rem;
+}
+
+.hr_notification {
+    background: #f6f7fa;
+    transition: transform 0.2s ease, box-shadow 0.2s ease;
+    will-change: transform, box-shadow;
+    box-shadow: 0 10px 40px 0 rgba(62,57,107,0.07), 0 2px 9px 0 rgba(62,57,107,0.06);
+    height: 316px;
+    overflow-y: auto;
+    margin-bottom: 15px;
+}
+.hr_notification .media {
+    border-bottom: 1px solid #e6e6e6;
+    padding-bottom: 6px;
+    margin-bottom: 10px;
+}
+hr_notification .text-color.display-6 {
+    margin: 0px 0 3px;
+    color: #2d2d2d;
+}
+.hr_notification p {
+    margin: 0 0 1px;
+    color: #666;
+    font-size: 10px;
+}
+.chart_head {
+    font-size: 17px;
+    text-align: center;
+    padding: 12px 0;
+    color: #fff;
+    font-weight: 300;
+    background: #5ebade;
+    margin-bottom: 9px;
+}
+.hr_notification_head {
+    font-size: 17px;
+    text-align: center;
+    padding: 12px 0;
+    color: #fff;
+    font-weight: 300;
+    background: #5ebade;
+    margin-bottom: 9px;
+}
+@media (max-width: 767.98px) {
+    .oh-card{
+        width: 100% !important;
+    }
+    .dashboard_main_section .form-control{
+        width: 85% !important;
+        margin: 15px auto;
+    }
+    .sale_details{
+        position: relative;
+        top: 0px !important;
+        right: 0px !important;
+    }
+    .selling_product_graph_view{
+        margin-top: 5rem;
+    }
+    .hr_notification{
+        min-width: 90% !important;
+    }
+}
+.hr_notification{
+    min-width: 425.683px;
+    min-height: 316px;
+    max-width: 100%;
+}
+.media-body{
+
+    background: #466b8d;
+    float: left;
+    margin: 0;
+    width: 100%
+
+}
+.category{
+  width: 30%;
+  transform: translateX(222%) translateY(-154%);
+  background: white;
+}

purchase_dashboard_advanced/static/src/js/dashboard.js

@@ -0,0 +1,360 @@
+/* @odoo-module*/
+import { registry } from '@web/core/registry';
+import { Component , useRef , useState, onWillStart ,onMounted} from '@odoo/owl'
+import { useService } from "@web/core/utils/hooks";
+import { PurchaseTiles } from './purchaseTile'
+import { session } from "@web/session";
+ var core = require('web.core');
+ var _t = core._t;
+ /**
+ * Class representing the purchase dashboard component.
+ */
+class purchaseDashboard extends  Component {
+    setup() {
+    /**
+         * State variable for purchase-related data.
+         * @type {Object}
+         */
+        this.purchase = useState({})
+        this.action = useService('action')
+        this.selectedVendor = useState({ selected: null })
+        this.root = useRef('root');
+        this.orm = useService('orm')
+        onWillStart(async ()=> {
+            this.purchase.monthlyData = await this.orm.call('purchase.order','get_orders_by_month',[])
+            this.purchase.orders = await this.orm.call('purchase.order','get_monthly_data',['this_month'])
+            this.purchase.pending = await this.orm.call('purchase.order','get_pending_purchase_data',[])
+            this.purchase.upcoming = await this.orm.call('purchase.order','get_upcoming_purchase_data',[])
+            this.purchase.topChart = await this.orm.call('purchase.order','get_top_chart_data',['top_product'])
+            this.purchase.vendors = await this.orm.call('purchase.order','purchase_vendors',[])
+            this.purchase.categoryAnalysis = await this.orm.call('purchase.order.line','product_categ_analysis',[])
+            this.selectedVendor.selected = this.purchase.vendors[0].id
+            await this.getRenderVendorAnalysisData()
+        })
+         onMounted(() => {
+            this.renderProductAnalysis();
+            this.renderVendorAnalysis();
+            this.renderByMonthPurchase();
+            this.renderTopProduct();
+         });
+         console.warn(this)
+    }
+    /**
+     * Handler for selecting a mode.
+     * @param {Object} event - The event object.
+     */
+    async handleOnchangeSelect(event){
+        const option = event.target.value;
+        this.purchase.orders = await this.orm.call('purchase.order','get_select_mode_data',[option])
+    }
+    /**
+     * Handler for changing the product category.
+     * @param {Object} event - The event object.
+     */
+     async handleOnChangeProductCategory(event){
+        const category_id =parseInt(event.target.value);
+        const { count, name } = await this.orm.call('purchase.order.line','product_categ_data',[category_id])
+        this.purchase.categoryAnalysis.values.name = name;
+        this.purchase.categoryAnalysis.count = count;
+        this.renderProductAnalysis()
+     }
+     /**
+     * Render the product analysis chart.
+     */
+     renderProductAnalysis(){
+     const ctx = this.root.el.querySelector("#product_categ_purchases")
+     const label =this.purchase.categoryAnalysis.values.name.map((obj) => obj.en_US)
+                    var count = this.purchase.categoryAnalysis.count;
+                    new Chart(ctx, {
+                        type: 'line',
+                        data: {
+                            labels: label,
+                            datasets: [{
+                                label: 'Quantity Done',
+                                data: count,
+                                backgroundColor: '#003f5c',
+                                borderColor: '#003f5c',
+                                barPercentage: 0.5,
+                                barThickness: 6,
+                                maxBarThickness: 8,
+                                minBarLength: 0,
+                                borderWidth: 1,
+                                type: 'line',
+                                fill: false
+                            }]
+                        },
+                        options: {
+                            scales: {
+                                y: {
+                                    beginAtZero: true
+                                },
+                            },
+                            responsive: true,
+                            maintainAspectRatio: false,
+                        }
+                    });
+                };
+     /**
+     * Fetch and render vendor analysis data.
+     */
+     async getRenderVendorAnalysisData(){
+        this.purchase.renderVendorAnalysisData =  await this.orm.call('purchase.order','purchase_vendor_details',[this.selectedVendor.selected])
+     }
+      /**
+     * Handler for changing the vendor analysis.
+     * @param {Object} event - The event object.
+     */
+     async handleOnChangeVendorAnalysis(event){
+        this.selectedVendor.selected = parseInt(event.target.value)
+        await this.getRenderVendorAnalysisData()
+        this.renderVendorAnalysis()
+     }
+    /**
+     * Render the vendor analysis chart.
+     */
+     renderVendorAnalysis(){
+               const ctx = this.root.el.querySelector("#purchase_vendors")
+              let name = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
+                        let sum =  this.purchase.renderVendorAnalysisData.purchase_amount
+                        let po_count =  this.purchase.renderVendorAnalysisData.po_count
+                        let draft_total =  this.purchase.renderVendorAnalysisData.draft_amount
+                        let draft_count = this.purchase.renderVendorAnalysisData.draft_count
+                        let approve_amount =  this.purchase.renderVendorAnalysisData.approve_amount
+                        let approve_count =  this.purchase.renderVendorAnalysisData.approve_count
+                        let cancel_amount =  this.purchase.renderVendorAnalysisData.cancel_amount
+                        let cancel_count =  this.purchase.renderVendorAnalysisData.cancel_count
+                        let j = 0;
+                        if (window.myChart_year != undefined)
+                            window.myChart_year.destroy();
+                        window.myChart_year = new Chart(ctx, {
+                            type: 'line',
+                            data: {
+                                labels: name,
+                                datasets: [
+                                {
+                                    label: 'Purchase Order Total',
+                                    data: sum,
+                                    backgroundColor: '#0000ff',
+                                    borderColor: '#0000ff',
+                                    barPercentage: 0.5,
+                                    barThickness: 6,
+                                    maxBarThickness: 8,
+                                    minBarLength: 0,
+                                    borderWidth: 1,
+                                    type: 'line',
+                                    fill: false
+                                },
+                                {
+                                    label: 'Draft Order Total',
+                                    data: draft_total,
+                                    backgroundColor: '#71d927',
+                                    borderColor: '#71d927',
+                                    barPercentage: 0.5,
+                                    barThickness: 6,
+                                    maxBarThickness: 8,
+                                    minBarLength: 0,
+                                    borderWidth: 1,
+                                    type: 'line',
+                                    fill: false
+                                },
+                                {
+                                    label: 'To Approve',
+                                    data: approve_amount,
+                                    backgroundColor: '#ff0066',
+                                    borderColor: '#ff0066',
+                                    barPercentage: 0.5,
+                                    barThickness: 6,
+                                    maxBarThickness: 8,
+                                    minBarLength: 0,
+                                    borderWidth: 1,
+                                    type: 'line',
+                                    fill: false
+                                },
+                                {
+                                    label: 'Cancelled Orders',
+                                    data: cancel_amount,
+                                    backgroundColor: '#ffff1a',
+                                    borderColor: '#ffff1a',
+                                    barPercentage: 0.5,
+                                    barThickness: 6,
+                                    maxBarThickness: 8,
+                                    minBarLength: 0,
+                                    borderWidth: 1,
+                                    type: 'line',
+                                    fill: false
+                                },
+                                ]
+                            },
+                            options: {
+                                scales: {
+                                    y: {
+                                        beginAtZero: true
+                                    },
+                                },
+                                responsive: true,
+                                maintainAspectRatio: false,
+                            }
+                        });
+                    }
+     /**
+     * Render the purchase data by month.
+     */
+     renderByMonthPurchase(){
+          const ctx = this.root.el.querySelector("#canvas")
+          var month = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
+                var count = this.purchase.monthlyData.count;
+                new Chart(ctx, {
+                    type: 'bar',
+                    data: {
+                        labels: month,
+                        datasets: [{
+                            label: 'Count',
+                            data: count,
+                            backgroundColor: '#ac3973',
+                            borderColor: '#ac3973',
+                            barPercentage: 0.5,
+                            barThickness: 6,
+                            maxBarThickness: 8,
+                            minBarLength: 0,
+                            borderWidth: 1,
+                            type: 'bar',
+                            fill: false
+                        }]
+                    },
+                    options: {
+                        scales: {
+                            y: {
+                                beginAtZero: true
+                            },
+                        },
+                        responsive: true,
+                        maintainAspectRatio: false,
+                    }
+                });
+     }
+     /**
+     * Handler for changing the top product.
+     * @param {Object} event - The event object.
+     */
+      async handleOnChangeTopProduct(event){
+        const selected_id = event.target.value;
+         this.purchase.topChart = await this.orm.call('purchase.order','get_top_chart_data',[selected_id])
+         this.renderTopProduct()
+     }
+      /**
+     * Render the top product chart.
+     */
+     renderTopProduct(){
+      const ctx = this.root.el.querySelector(".top_pie_chart")
+      if (window.myCharts_top_priority != undefined ){
+        window.myCharts_top_priority.destroy();
+        window.myCharts_top_priority = new Chart(ctx, {
+                    type: "doughnut",
+                    data: data,
+                    options: options
+                });
+      }
+    const label = this.purchase.topChart[1].map((item) => item.en_US || item );
+    const datas = this.purchase.topChart[0];
+      var background_color = [];
+      this.purchase.topChart[0].forEach((div) => {
+                    var randomColor = '#' + Math.floor(Math.random() * 16777215).toString(16);
+                    background_color.push(randomColor)
+                });
+                var randomColor= background_color
+                var data = {
+                    labels : label,
+                    datasets: [{
+                    label: "",
+                    data: datas,
+                    backgroundColor:randomColor,
+                    borderColor:randomColor,
+                    borderWidth: 1
+                    },]
+                };
+                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,
+                            }
+                        }]
+                    }
+                };
+                window.myCharts_top_priority = new Chart(ctx, {
+                    type: "doughnut",
+                    data: data,
+                    options: options
+                });
+        }
+        /**
+     * Navigate to the backend for purchase orders.
+     */
+        goBackend(){
+        this.action.doAction({
+            type: 'ir.actions.act_window',
+            name: _t('Purchase Order'),
+            res_model: 'purchase.order',
+            view_mode: 'tree,form',
+            views: [[false, 'list'],[false, 'form']],
+            target: 'self',
+            domain: [['state','in', ['purchase', 'done']]],
+        });
+    }
+     /**
+     * Handle priority orders.
+     */
+     priorityOrders(){
+      if(this.priority_orders) {
+                var options = {
+                    on_reverse_breadcrumb: self.on_reverse_breadcrumb,
+                };
+                }
+                 this.action.doAction({
+                    type: 'ir.actions.act_window',
+                    name: _t("Priority Order"),
+                    res_model: 'purchase.order',
+                    view_mode: 'tree,form',
+                    views: [[false, 'list'],[false, 'form']],
+                    target: 'self',
+                     domain: [['priority','=', 1]],
+                });
+     }
+     /**
+     * Navigate to the vendor backend.
+     */
+     vendorBackend(){
+         this.action.doAction({
+                type: 'ir.actions.act_window',
+                name: _t('Vendor'),
+                res_model: 'res.partner',
+                view_mode: 'tree,form',
+                views: [[false, 'list'],[false, 'form']],
+                target: 'self',
+                domain: [['id', "in", this.purchase.orders.vendor_id]],
+            });
+     }
+}
+/**
+ * Template for the purchase dashboard component.
+ */
+ purchaseDashboard.template = 'PurchaseDashboard'
+ purchaseDashboard.components = {
+    PurchaseTiles
+ }
+registry.category('actions').add('purchase_dashboard', purchaseDashboard);

purchase_dashboard_advanced/static/src/js/purchaseTile.js

@@ -0,0 +1,10 @@
+/* @odoo-module*/
+import { Component } from '@odoo/owl'
+/**
+ * Class representing purchase tiles component.
+ */
+export class PurchaseTiles extends  Component {}
+/**
+ * Template for the purchase tiles component.
+ */
+PurchaseTiles.template = 'PurchaseTiles'

purchase_dashboard_advanced/static/src/xml/dashboard.xml

@@ -0,0 +1,248 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--Purchase Dashboard view-->
+<templates id="template" xml:space="preserve">
+    <t t-name="PurchaseDashboard" owl="1">
+                <!-- This is the Purchase Dashboard template -->
+        <div class="oh_dashboards" t-ref="root">
+            <div class="container-fluid my-5 o_purchase_dashboard">
+                <section class="dashboard_main" id="main_section">
+                    <div class="col-sm-12 mb-4">
+                        <div class="row">
+                            <div class="col-12 col-sm-12 col-md-8">
+                                <h2 class="section-header">Purchase Dashboard</h2>
+                            </div>
+                            <!--   Filters for tiles -->
+                            <div class="col-12 col-sm-12 col-md-4">
+                                <form class="form-group">
+                                    <select id="select_mode"
+                                            class="form-control"
+                                            t-on-change="handleOnchangeSelect">
+                                        <option id="this_year"
+                                                value="this_year">This Year</option>
+                                        <option id="this_month"
+                                                value="this_month"
+                                                selected="">This Month</option>
+                                        <option id="this_week"
+                                                value="this_week">This Week</option>
+                                        <option id="today"
+                                                value="today">Today</option>
+                                    </select>
+                                </form>
+                            </div>
+                            <!--      Tiles    -->
+                            <t t-set="componentVal" t-value="purchase.orders"/>
+                            <PurchaseTiles icon="'fa fa-shopping-cart'"
+                                           color="'#ff4d94'"
+                                           name="'Purchase Order'"
+                                           value="componentVal.purchase_orders"
+                                           t-on-click="goBackend"/>
+                            <PurchaseTiles icon="'fa fa-money'"
+                                           color="'#99e6ff'"
+                                           name="'Total Amount'"
+                                           value="componentVal.purchase_amount"
+                                           t-on-click="goBackend"/>
+                            <PurchaseTiles icon="'fa fa-star'"
+                                           color="'#aaff80'"
+                                           name="'Priority Orders'"
+                                           value="componentVal.priority_orders"
+                                           t-on-click="priorityOrders"/>
+                            <PurchaseTiles icon="'fa fa-users'"
+                                           color="'#bf80ff'" name="'Vendors'"
+                                           value="componentVal.vendors"
+                                           t-on-click="vendorBackend"/>
+                        </div>
+                    </div>
+                </section>
+                <div class="col-xs-12 col-sm-12 col-lg-12 col-md-12">
+                    <div class="row main-section">
+                        <div class="col-sm-6 col-lg-6 top_chart">
+                            <div class="chart_head"
+                                 style="font-size: 17px;text-align: center;padding: 12px 0;color: #fff;font-weight: 700;background: #0b3c38b0;">
+                                Top Charts
+                            </div>
+                            <div class="top_chart_pie_div half_chart chart-container card-shadow">
+                                <!--   Filters for tiles -->
+                                <div class="col-8 col-sm-8 col-md-4">
+                                    <form class="form-group">
+                                        <select id="select_chart"
+                                                class="form-control"
+                                                t-on-change="handleOnChangeTopProduct">
+                                            <option id="top_product"
+                                                    value="top_product"
+                                                    selected="">Top Product</option>
+                                            <option id="top_vendor"
+                                                    value="top_vendor">Top Vendor</option>
+                                            <option id="top_rep"
+                                                    value="top_rep">Top Purchase Rep.</option>
+                                        </select>
+                                    </form>
+                                </div>
+                                <div class="graph_canvas">
+                                    <canvas class="top_pie_chart" width="200"
+                                            height="120"/>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-sm-6 col-lg-6" id="col-graph">
+                            <div class="chart_head"
+                                 style="font-size: 17px;text-align: center;padding: 12px 0;color: #fff;font-weight: 700;background: #05102eb3;">
+                                Purchases By Month
+                            </div>
+                            <div id="chart">
+                                <canvas id="canvas" width="400" height="400"/>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <br/>
+                <div class="col-xs-12 col-sm-12 col-lg-12 col-md-12">
+                    <div class="row main-section">
+                        <div class="col-sm-6 col-lg-6">
+                            <div class="purchase_prod_categ chart-container card-shadow">
+                                <div class="chart_head"
+                                     style="font-size: 17px;text-align: left;padding: 12px 0;color: #fff;font-weight: 700;background: #669731d4;">
+                                    Purchases Vendor Analysis
+                                </div>
+                                <div class="vendor" style="padding: 12px 0;"
+                                     id="vendor_select">
+                                    <select id="vendor_selection"
+                                            class="btn btn-primary"
+                                            t-on-change="handleOnChangeVendorAnalysis">
+                                    <t t-foreach="purchase.vendors"
+                                       t-as="vendor" t-key="vendor_index">
+                                        <option t-out="vendor.name"
+                                                t-att-value="vendor.id"/>
+                                    </t>
+                                    </select>
+                                </div>
+                                <div class="graph_canvas"
+                                     style="margin-top: 30px;">
+                                    <canvas id="purchase_vendors"
+                                            height="500px"
+                                            width="150px"/>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-sm-6 col-lg-6">
+                            <div class="purchase_prod_categ chart-container card-shadow"
+                                 id="tiles">
+                                <div class="chart_head"
+                                     style="font-size: 17px;text-align: left;padding: 12px 0;color: #fff;font-weight: 700;background: #137660c2;">
+                                    Product Category Analysis
+                                </div>
+                                <div
+                                        class="category">
+                                    <div class=""
+                                         id="product_categ_select">
+                                        <select id="product_categ_selection"
+                                                class="btn btn-primary"
+                                                t-on-change="handleOnChangeProductCategory"
+                                        >
+                                                <t t-foreach="purchase.categoryAnalysis.category_id"
+                                                   t-as="analysis"
+                                                   t-key="analysis_index">
+                                                   <option t-out="analysis[1]"
+                                                           t-att-value="analysis[0]"/>
+                                    </t>
+                                    </select>
+                                    </div>
+                                </div>
+                                <div class="graph_canvas"
+                                     style="margin-top: 30px;">
+                                    <canvas id="product_categ_purchases"
+                                            height="500px"
+                                            width="150px"/>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <br/>
+                <div class="col-xs-12 col-sm-12 col-lg-12 col-md-12">
+                    <div class="row main-section">
+                        <div class="col-sm-6 col-lg-6">
+                            <div class="hr_notification" style="background: #fff;transition: transform 0.2s ease, box-shadow 0.2s ease;will-change: transform, box-shadow;box-shadow: 0 10px 40px 0 rgba(62,57,107,0.07), 0 2px 9px 0 rgba(62,57,107,0.06);
+                            height: 316px;overflow-y: auto;margin-bottom: 15px;">
+                                <div class="hr_notification_head"
+                                     style="font-size: 17px;text-align: center;padding: 12px 0;color: #fff;font-weight: 700;background: #044e64a3;">
+                                    Pending Arrivals
+                                </div>
+                                <div class="col-sm-12 col-lg-12"
+                                     style="padding:0;">
+                                    <div class="text-color">
+                                            <div class="media"
+                                                 id="purchase_details_orders">
+                                                <div>
+                                                    <table class="table table-sm"
+                                                           id="pending_analysis">
+                                                        <tr>
+                                                            <th>Order</th>
+                                                            <th>Vendor</th>
+                                                            <th>Amount</th>
+                                                            <th>Date Planned</th>
+                                                            <th>State</th>
+                                                        </tr>
+                                                        <t t-foreach="purchase.pending.data"
+                                                           t-as="rec"
+                                                           t-key="rec_index">
+                                                            <tr>
+                                                                <td><t t-esc="rec[0]"/></td>
+                                                                <td><t t-esc="rec[2]"/></td>
+                                                                <td><t t-esc="rec[4]"/></td>
+                                                                <td><t t-esc="rec[3]"/></td>
+                                                                <td><t t-esc="rec[5]"/></td>
+                                                            </tr>
+                                                        </t>
+                                                    </table>
+                                                </div>
+                                            </div>
+                                    </div>
+                                </div>
+                                </div>
+                        </div>
+                        <div class="col-sm-6 col-lg-6">
+                            <div class="pending_purchases" style="background: #fff;transition: transform 0.2s ease, box-shadow 0.2s ease;will-change: transform, box-shadow;box-shadow: 0 10px 40px 0 rgba(62,57,107,0.07), 0 2px 9px 0 rgba(62,57,107,0.06);
+                            height: 316px;overflow-y: auto;margin-bottom: 15px;">
+                                <div class="hr_notification_head"
+                                     style="font-size: 17px;text-align: center;padding: 12px 0;color: #fff;font-weight: 700;background: #214c17bf;">
+                                    Upcoming Arrivals
+                                </div>
+                                <div class="col-sm-12 col-lg-12"
+                                     style="padding:0;">
+                                    <div class="text-color">
+                                            <div class="media"
+                                                 id="upcoming_details_orders">
+                                                <div>
+                                                    <table class="table table-sm"
+                                                           id="upcoming_analysis">
+                                                        <tr>
+                                                            <th>Order</th>
+                                                            <th>Vendor</th>
+                                                            <th>Amount</th>
+                                                            <th>Date Planned</th>
+                                                            <th>State</th>
+                                                        </tr>
+                                                        <t t-foreach="purchase.upcoming.data"
+                                                           t-as="rec"
+                                                           t-key="rec_index">
+                                                            <tr>
+                                                                <td><t t-esc="rec[0]"/></td>
+                                                                <td><t t-esc="rec[2]"/></td>
+                                                                <td><t t-esc="rec[4]"/></td>
+                                                                <td><t t-esc="rec[3]"/></td>
+                                                                <td><t t-esc="rec[5]"/></td>
+                                                            </tr>
+                                                        </t>
+                                                    </table>
+                                                </div>
+                                            </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </t>
+</templates>

purchase_dashboard_advanced/static/src/xml/purchaseTile.xml

@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--Purchase Dashboard view-->
+<templates id="template" xml:space="preserve">
+    <t t-name="PurchaseTiles" owl="1">
+                <!-- This is the Purchase Tiles template -->
+        <div class="col-md-3 col-sm-5 purchase_order_all oh-data">
+           <div class="oh-card" style="width: 288px;">
+               <div class="oh-card-body">
+                   <div class="stat-widget-one">
+                       <div class="stat-icon"
+                            t-attf-style="background:{{props.color}}">
+                           <i t-att-class="props.icon"/>
+                       </div>
+                       <div class="stat-content">
+                           <div class="stat-head" t-out="props.name"/>
+                           <div class="stat_count">
+                               <span t-att-class="purchase_order" t-out="props.value"/>
+                           </div>
+                       </div>
+                   </div>
+               </div>
+           </div>
+       </div>
+    </t>
+</templates>

purchase_dashboard_advanced/views/purchase_dashboard_advanced_menus.xml

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<odoo>
+    <!--Client action for dashboard-->
+    <record id="action_dashboard_purchase" model="ir.actions.client">
+        <field name="name">Purchase</field>
+        <field name="tag">purchase_dashboard</field>
+    </record>
+    <!--MenuAction-->
+    <menuitem id="purchase_dashboard_menu"
+              name="Dashboard" action="action_dashboard_purchase"
+              parent="purchase.menu_purchase_root"
+              sequence="-1"/>
+</odoo>