Sep 29 : [ADD] Initial Commit 'advanced_search_widget'

advanced_search_widget/README.rst

@@ -0,0 +1,48 @@
+.. image:: https://img.shields.io/badge/licence-AGPL--3-blue.svg
+    :target: https://www.gnu.org/licenses/agpl-3.0-standalone.html
+    :alt: License: AGPL-3
+
+Advanced Search Widget
+====================
+
+This module defines advanced search menu design and custom filter item expression.
+
+Configuration
+=============
+No additional configuration required
+
+Company
+-------
+* `Cybrosys Techno Solutions <https://cybrosys.com/>`__
+
+License
+-------
+GNU Affero General Public License v3.0 (AGPL v3)
+(https://www.gnu.org/licenses/agpl-3.0-standalone.html)
+
+Credits
+-------
+Developer: (V16) Raneesha M K , 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>`__

advanced_search_widget/__init__.py

@@ -0,0 +1,21 @@
+# -*- coding: utf-8 -*-
+###############################################################################
+#
+#    Cybrosys Technologies Pvt. Ltd.
+#
+#    Copyright (C) 2023-TODAY Cybrosys Technologies(<https://www.cybrosys.com>)
+#    Author: Raneesha M K (odoo@cybrosys.com)
+#
+#    You can modify it under the terms of the GNU AFFERO
+#    GENERAL PUBLIC LICENSE (AGPL 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 AFFERO GENERAL PUBLIC LICENSE (AGPL v3) for more details.
+#
+#    You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE
+#    (AGPL v3) along with this program.
+#    If not, see <http://www.gnu.org/licenses/>.
+#
+###############################################################################

advanced_search_widget/__manifest__.py

@@ -0,0 +1,54 @@
+# -*- coding: utf-8 -*-
+###############################################################################
+#
+#    Cybrosys Technologies Pvt. Ltd.
+#
+#    Copyright (C) 2023-TODAY Cybrosys Technologies(<https://www.cybrosys.com>)
+#    Author: Raneesha M K (odoo@cybrosys.com)
+#
+#    You can modify it under the terms of the GNU AFFERO
+#    GENERAL PUBLIC LICENSE (AGPL 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 AFFERO GENERAL PUBLIC LICENSE (AGPL v3) for more details.
+#
+#    You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE
+#    (AGPL v3) along with this program.
+#    If not, see <http://www.gnu.org/licenses/>.
+#
+###############################################################################
+{
+    'name': 'Advanced Search Widget',
+    'version': '16.0.1.0.0',
+    'category': 'Extra Tools',
+    'summary': "It elevates the design of search menu items and offers" 
+               "sophisticated expression options for filtering categories",
+    'description': "An Advanced Search Widget could be custom widget designed"
+                   "to enhance the search capabilities. It might offer more" 
+                   "advanced filtering options and search criteria.",
+    'author': 'Cybrosys Techno Solutions',
+    'company': 'Cybrosys Techno Solutions',
+    'maintainer': 'Cybrosys Techno Solutions',
+    'website': 'https://www.cybrosys.com',
+    'depends': ['web'],
+    'assets': {
+        'web.assets_backend': [
+            'advanced_search_widget/static/src/js/domain_tree.js',
+            'advanced_search_widget/static/src/js/domain_selector_dialog.js',
+            'advanced_search_widget/static/src/js/SearchWidget.js',
+            'advanced_search_widget/static/src/js/search_bar.js',
+            'advanced_search_widget/static/src/js/search_model.js',
+            'advanced_search_widget/static/src/xml/custom_favorite_item.xml',
+            'advanced_search_widget/static/src/xml/custom_filter_item.xml',
+            'advanced_search_widget/static/src/xml/SearchWidget.xml',
+            'advanced_search_widget/static/src/xml/search_bar.xml',
+        ],
+    },
+    'images': ['static/description/banner.png'],
+    'license': 'AGPL-3',
+    'installable': True,
+    'auto_install': False,
+    'application': False,
+}

advanced_search_widget/doc/RELEASE_NOTES.md

@@ -0,0 +1,6 @@
+## Module <advanced_search_widget>
+
+#### 27.09.2023
+#### Version 16.0.1.0.0
+#### ADD
+Initial Commit for Advanced Search Widget

advanced_search_widget/static/description/index.html

@@ -0,0 +1,640 @@
+<div style="background-color: #714B67; min-height: 600px; width: 100%; padding: 15px; position: relative;">
+    <!-- TITLE BAR -->
+    <div  class="d-flex align-items-center justify-content-between"
+            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: #017E84; 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 -->
+    <div class="container">
+        <div class="row">
+            <div class="col-sm-12 col-md-12 col-lg-12">
+            <h1 style="color: #FFFFFF; font-weight: bolder; font-size: 50px; text-align: center; margin-top: 50px;">
+                Advanced Search Widget</h1>
+            <p style="color:#FFFFFF; padding: 8px 15px; text-align: center; font-size: 24px;">
+            An Advanced Design of Search Menu Items and Advanced
+            Expression for Category Filter Options</p>
+            </div>
+        </div>
+    </div>
+<!-- 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 for 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">
+        Here, we show an advanced view of the search menus, including the
+        filter, group by, and favourites options. For adding unique filters, it
+        defines advanced expressions. The user-friendly design also includes
+        options to save favourites and group by customers.
+    </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;">Search Menus are in single dropdown.</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;">Advanced expressions are available for custom filter choices.</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;">Search menus with a user-friendly interface</span>
+        </div>
+    </div>
+</div>
+<!-- END OF FEATURES SECTION -->
+
+<!-- SCREENSHOTS SECTION -->
+<div class="d-flex align-items-center"
+     style="border-bottom: 2px solid #714B67; padding: 15px 0px;"
+     id="screenshots">
+    <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/pictures.png"/>
+    </div>
+    <h2 class="mt-2"
+        style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;">
+        Screenshots
+    </h2>
+</div>
+<div class="row">
+    <div class="col-sm-12">
+        <div style="display: block; margin: 30px auto;">
+            <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">The dropdown arrow symbol allows you to view the search menus in more detail.</h3>
+            <img src="assets/screenshots/1.png" class="img-thumbnail">
+        </div>
+
+        <div style="display: block; margin: 30px auto;">
+            <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">
+                Advanced Custom Filter view </h3>
+            <p style="font-weight: 400; font-family: 'Montserrat', sans-serif; font-size: 14px;">By selecting "Add Custom Filter", you can get an enhanced view with branch and node criteria. The ' + ' button allows you to add numerous nodes. </p>
+            <img src="assets/screenshots/2.png" class="img-thumbnail">
+        </div>
+
+        <div style="display: block; margin: 30px auto;">
+            <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Branch condition of Custom Filter</h3>
+            <p style="font-weight: 400; font-family: 'Montserrat', sans-serif; font-size: 14px;">The new capability or requirement is that we can now add a single filter with two conditions.</p>
+            <img src="assets/screenshots/3.png" class="img-thumbnail">
+        </div>
+
+        <div style="display: block; margin: 30px auto;">
+            <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">
+                Add Custom Group</h3>
+            <p style="font-weight: 400; font-family: 'Montserrat', sans-serif; font-size: 14px;">Added a wizard window for the opportunity to add a custom group. </p>
+            <img src="assets/screenshots/4.png" class="img-thumbnail">
+        </div>
+
+        <div style="display: block; margin: 30px auto;">
+            <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">
+                Save current search feature of Favorites menu</h3>
+            <p style="font-weight: 400; font-family: 'Montserrat', sans-serif; font-size: 14px;">
+                Added a wizard window for the opportunity to save current search feature.</p>
+            <img src="assets/screenshots/5.png" class="img-thumbnail">
+        </div>
+
+    </div>
+</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/custom_gantt_view/"
+                           target="_blank">
+                            <div style="border-radius:10px">
+                                <img class="img img-responsive center-block"
+                                     style="border-radius: 0px;"
+                                     src="./assets/modules/1.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/whatsapp_mail_messaging/"
+                           target="_blank">
+                            <div style="border-radius:10px">
+                                <img class="img img-responsive center-block"
+                                     style="border-radius: 0px;"
+                                     src="./assets/modules/2.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/customer_followup_community/"
+                           target="_blank">
+                            <div style="border-radius:10px">
+                                <img class="img img-responsive center-block"
+                                     style="border-radius: 0px;"
+                                     src="./assets/modules/3.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/sales_credit_limit/"
+                           target="_blank">
+                            <div style="border-radius:10px">
+                                <img class="img img-responsive center-block"
+                                     style="border-radius: 0px;"
+                                     src="./assets/modules/4.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/dynamic_accounts_report/"
+                           target="_blank">
+                            <div style="border-radius:10px">
+                                <img class="img img-responsive center-block"
+                                     style="border-radius: 0px;"
+                                     src="./assets/modules/5.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/hr_zk_attendance/"
+                           target="_blank">
+                            <div style="border-radius:10px">
+                                <img class="img img-responsive center-block"
+                                     style="border-radius: 0px;"
+                                     src="./assets/modules/6.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 -->

advanced_search_widget/static/src/js/SearchWidget.js

@@ -0,0 +1,135 @@
+/** @odoo-module **/
+
+import { Dropdown } from "@web/core/dropdown/dropdown";
+import { registry } from "@web/core/registry";
+import { useBus, useService } from "@web/core/utils/hooks";
+import { Component } from "@odoo/owl";
+import { SearchDropdownItem } from "@web/search/search_dropdown_item/search_dropdown_item";
+import { CustomGroupByItem } from "@web/search/group_by_menu/custom_group_by_item";
+import { FACET_ICONS, GROUPABLE_TYPES } from "@web/search/utils/misc";
+import { sortBy } from "@web/core/utils/arrays";
+import { DropdownItem } from "@web/core/dropdown/dropdown_item";
+import { _t } from "@web/core/l10n/translation";
+import { ConfirmationDialog } from "@web/core/confirmation_dialog/confirmation_dialog";
+import { DomainSelectorDialog } from "@web/core/domain_selector_dialog/domain_selector_dialog";
+const favoriteMenuRegistry = registry.category("favoriteMenu");
+
+export class SearchWidget extends Component {
+    setup() {
+        // Filter
+        this.dialogService = useService("dialog");
+        this.filterIcon = FACET_ICONS.filter;
+        // GroupBy
+        const fields = [];
+        for (const [fieldName, field] of Object.entries(this.env.searchModel.searchViewFields)) {
+            if (this.validateField(fieldName, field)) {
+                fields.push(Object.assign({ name: fieldName }, field));
+            }
+        }
+        this.groupByIcon = FACET_ICONS.groupBy;
+        this.fields = sortBy(fields, "string");
+        // Favorite
+        this.favoriteIcon = FACET_ICONS.favorite;
+        useBus(this.env.searchModel, "update", this.render);
+    }
+
+// Filter Menu
+    get Filteritems() {
+    // Get filter items for the menu.
+        return this.env.searchModel.getSearchItems((searchItem) =>
+            ["filter", "dateFilter"].includes(searchItem.type)
+        );
+    }
+    onFilterSelected({ itemId, optionId }) {
+    // Handle selection of a filter item.
+        if (optionId) {
+            this.env.searchModel.toggleDateFilter(itemId, optionId);
+        } else {
+            this.env.searchModel.toggleSearchItem(itemId);
+        }
+    }
+// Add custom filter dialog
+    onAddCustomFilterClick() {
+        const { _context: context, resModel } = this.env.searchModel;
+        this.dialogService.add(DomainSelectorDialog, {
+            resModel,
+            domain : "[]",
+            context,
+            readonly : false,
+            title: _t("Add Custom Filter"),
+            onSave: (domain) => this.env.searchModel.splitAndAddDomain(domain),
+            isDebugMode: !!this.env.debug,
+        })
+    }
+
+// GroupBy Menu
+    get groupByitems() {
+    // Get groupBy items for the menu.
+        return this.env.searchModel.getSearchItems((searchItem) =>
+            ["groupBy", "dateGroupBy"].includes(searchItem.type)
+        );
+    }
+    onGroupBySelected({ itemId, optionId }) {
+    // Handle selection of a groupBy item.
+        if (optionId) {
+            this.env.searchModel.toggleDateGroupBy(itemId, optionId);
+        } else {
+            this.env.searchModel.toggleSearchItem(itemId);
+        }
+    }
+    onAddCustomGroup(fieldName) {
+    // Create new custom group by
+        this.env.searchModel.createNewGroupBy(fieldName);
+    }
+    get hideCustomGroupBy() {
+    // Hide new custom group by
+        return this.env.searchModel.hideCustomGroupBy || false;
+    }
+    validateField(fieldName, field) {
+    // Validate if a field is suitable for groupBy
+        const { sortable, store, type } = field;
+        return (
+            (type === "many2many" ? store : sortable) &&
+            fieldName !== "id" &&
+            GROUPABLE_TYPES.includes(type)
+        );
+    }
+//  Favorite Menu
+    get favoriteitems() {
+    // Get favorite items for the menu.
+        const favorites = this.env.searchModel.getSearchItems(
+            (searchItem) => searchItem.type === "favorite"
+        );
+        const registryMenus = [];
+        for (const item of favoriteMenuRegistry.getAll()) {
+            if ("isDisplayed" in item ? item.isDisplayed(this.env) : true) {
+                registryMenus.push({
+                    Component: item.Component,
+                    groupNumber: item.groupNumber,
+                    key: item.Component.name,
+                });
+            }
+        }
+        return [...favorites, ...registryMenus];
+    }
+    onFavoriteSelected(itemId) {
+        this.env.searchModel.toggleSearchItem(itemId);
+    }
+    openConfirmationDialog(itemId) {
+    // Open a confirmation dialog for removing a favorite item.
+        const { userId } = this.favoriteitems.find((item) => item.id === itemId);
+        const dialogProps = {
+            title: this.env._t("Warning"),
+            body: userId
+                ? this.env._t("Are you sure that you want to remove this filter?")
+                : this.env._t(
+                      "This filter is global and will be removed for everybody if you continue."
+                  ),
+            confirm: () => this.env.searchModel.deleteFavorite(itemId),
+            cancel: () => {},
+        };
+        this.dialogService.add(ConfirmationDialog, dialogProps);
+    }
+}
+SearchWidget.template = "SearchWidget";
+SearchWidget.components = {Dropdown, CustomGroupByItem, DropdownItem:SearchDropdownItem};

advanced_search_widget/static/src/js/domain_selector_dialog.js

@@ -0,0 +1,58 @@
+/** @odoo-module **/
+/**
+     * This file is used to add some features to DomainSelectorDialog .
+*/
+import { DomainSelectorDialog } from "@web/core/domain_selector_dialog/domain_selector_dialog";
+import {useService } from "@web/core/utils/hooks";
+import { useState } from "@odoo/owl";
+import { patch } from "@web/core/utils/patch";
+import { _t } from "@web/core/l10n/translation";
+import { Domain } from "@web/core/domain";
+
+patch(DomainSelectorDialog.prototype, 'advanced_search_widget', {
+    setup() {
+        this.orm = useService("orm");
+        this.notification = useService("notification");
+        this.state = useState({
+            domain: this.props.domain
+        });
+        return this._super(...arguments);
+    },
+    get dialogTitle() {
+        //  Return title of the DomainSelectorDialog
+        return this.props.title || _t("Domain");
+    },
+    get domainSelectorProps() {
+        // Default domain selector props values
+        return {
+            className: this.props.className,
+            resModel: this.props.resModel,
+            readonly: this.props.readonly,
+            isDebugMode: this.props.isDebugMode,
+            defaultLeafValue: this.props.defaultLeafValue,
+            value: this.state.domain || this.props.domain,
+            update: (domain) => {
+                this.state.domain = domain;
+            },
+        };
+    },
+    async onSave() {
+        // It will apply the domain as new filter
+        if (!this.state.domain){
+            this.notification.add(this.env._t("Domain is invalid. Please correct it"), {
+                type: "danger",
+            });
+        }
+        else{
+            this.props.onSave(this.state.domain);
+            this.props.close();
+        }
+    },
+});
+DomainSelectorDialog.props = {
+    ...DomainSelectorDialog.props,
+     onSave: Function,
+    title: { type: String, optional: true },
+    context: { type: Object, optional: true },
+    domain: { type: String, optional: true },
+};

advanced_search_widget/static/src/js/domain_tree.js

@@ -0,0 +1,159 @@
+/** @odoo-module **/
+/**
+     * This file is used to create the domain as tree structure based on the
+         branch and node domains and also based on the operator.
+*/
+import { Domain } from "@web/core/domain";
+import { formatAST, toPyValue} from "@web/core/py_js/py_utils";
+const TERM_OPERATORS_NEGATION = {
+    "<": ">=",
+    ">": "<=",
+    "<=": ">",
+    ">=": "<",
+    "=": "!=",
+    "!=": "=",
+    in: "not in",
+    like: "not like",
+    ilike: "not ilike",
+    "not in": "in",
+    "not like": "like",
+    "not ilike": "ilike",
+};
+
+function _construcTree(ASTs, distributeNot, negate = false) {
+    // Construct a tree structure based on the branch and node domains and the operator.
+    const [firstAST, ...tailASTs] = ASTs;
+
+    if (firstAST.type === 1 && firstAST.value === "!") {
+        return _construcTree(tailASTs, distributeNot, !negate);
+    }
+
+    const tree = {
+        type: firstAST.type === 1 ? "connector" : "condition"
+    };
+    if (tree.type === "connector") {
+        tree.value = firstAST.value;
+        if (distributeNot && negate) {
+            tree.value = tree.value === "&" ? "|" : "&";
+            tree.negate = false;
+        } else {
+            tree.negate = negate;
+        }
+        tree.children = [];
+    } else {
+        const [pathAST, operatorAST, valueAST] = firstAST.value;
+        tree.path = pathAST.value;
+        if (negate && TERM_OPERATORS_NEGATION[operatorAST.value]) {
+            tree.operator = TERM_OPERATORS_NEGATION[operatorAST.value];
+        } else {
+            tree.operator = operatorAST.value;
+            tree.negate = negate;
+        }
+        tree.valueAST = valueAST;
+    }
+    let remaimingASTs = tailASTs;
+    if (tree.type === "connector") {
+        for (let i = 0; i < 2; i++) {
+            const {
+                tree: child,
+                remaimingASTs: otherASTs
+            } = _construcTree(
+                remaimingASTs,
+                distributeNot,
+                distributeNot && negate
+            );
+            remaimingASTs = otherASTs;
+            if (child.type === "connector" && !child.negate && child.value === tree.value) {
+                tree.children.push(...child.children);
+            } else {
+                tree.children.push(child);
+            }
+        }
+    }
+    return {
+        tree,
+        remaimingASTs
+    };
+}
+
+function construcTree(initialASTs, options) {
+    // Construct a tree structure based on the initial abstract syntax trees and options
+    const value = options.defaultConnector || "&";
+    if (!initialASTs.length) {
+        return {
+            type: "connector",
+            value,
+            negate: false,
+            children: []
+        };
+    }
+    const {
+        tree
+    } = _construcTree(initialASTs, options.distributeNot);
+    if (tree.type === "condition") {
+        return {
+            type: "connector",
+            value,
+            negate: false,
+            children: [tree]
+        };
+    }
+    return tree;
+}
+
+function createBetweenOperators(tree, isRoot = true) {
+    // Create between operators from a tree structure representing the domain.
+    if (tree.type === "condition") {
+        return tree;
+    }
+    const processedChildren = tree.children.map((c) => createBetweenOperators(c, false));
+    if (tree.value === "|") {
+        return {
+            ...tree,
+            children: processedChildren
+        };
+    }
+    const children = [];
+    for (let i = 0; i < processedChildren.length; i++) {
+        const child1 = processedChildren[i];
+        const child2 = processedChildren[i + 1];
+        if (
+            child1.type === "condition" &&
+            child2 &&
+            child2.type === "condition" &&
+            child1.path === child2.path &&
+            child1.operator === ">=" &&
+            child2.operator === "<="
+        ) {
+            children.push({
+                type: "condition",
+                path: child1.path,
+                operator: "between",
+                valueAST: {
+                    type: 4,
+                    value: [child1.valueAST, child2.valueAST],
+                },
+            });
+            i += 1;
+        } else {
+            children.push(child1);
+        }
+    }
+    if (children.length === 1 && !isRoot) {
+        return {
+            ...children[0]
+        };
+    }
+    return {
+        ...tree,
+        children
+    };
+}
+
+export function toTree(domain, options = {}) {
+    // Convert a domain to a tree structure.
+    domain = new Domain(domain);
+    const domainAST = domain.ast;
+    const tree = construcTree(domainAST.value, options);
+    return createBetweenOperators(tree);
+}

advanced_search_widget/static/src/js/search_bar.js

@@ -0,0 +1,10 @@
+/** @odoo-module **/
+/**
+     * This file is used to add the SearchWidget component SearchBar .
+*/
+import { SearchBar } from "@web/search/search_bar/search_bar";
+import {SearchWidget} from "@advanced_search_widget/js/SearchWidget";
+
+SearchBar.components = {
+    SearchWidget,
+};

advanced_search_widget/static/src/js/search_model.js

@@ -0,0 +1,81 @@
+/** @odoo-module **/
+/**
+ * This file is used to add a some functions to SearchModel for creating filter .
+ */
+import { SearchModel} from "@web/search/search_model";
+import {patch} from "@web/core/utils/patch";
+import {toTree} from "@advanced_search_widget/js/domain_tree"
+
+patch(SearchModel.prototype, 'advanced_search_widget', {
+    setup() {
+        return this._super(...arguments);
+    },
+    FieldType(tree, description) {
+        // Return a description of the domain operator string based on the operator
+        if (tree.valueAST.type === 2) {
+            description += ' is';
+            if (tree.operator === '=' && !tree.valueAST.value) {
+                description += ' not';
+            }
+            if (tree.operator === '!=' && tree.valueAST.value) {
+                description += ' not';
+            }
+            description += ' set';
+        } else if (tree.valueAST.type === 1) {
+            if (tree.operator === 'ilike') {
+                description += ' contains ' + tree.valueAST.value;
+            } else if (tree.operator === 'not ilike') {
+                description += ' does not contain ' + tree.valueAST.value;
+            } else {
+                description += ' ' + tree.operator + ' ' + tree.valueAST.value;
+            }
+        } else if (tree.valueAST.type === 0) {
+            description += ' ' + tree.operator + ' ' + tree.valueAST.value;
+        }
+        return description;
+    },
+
+    DomainDescription(tree) {
+        // Returns a description for the domain to show in the search bar.
+        const getFieldString = (path) => {
+            if (path.includes(".")) {
+                const [mainField, subField] = path.split(".");
+                return `${this.searchViewFields[mainField].string} ${this.searchViewFields[subField].string}`;
+            } else {
+                return this.searchViewFields[path].string;
+            }
+        };
+        let description;
+        switch (tree.type) {
+            case 'condition':
+                description = this.FieldType(tree, getFieldString(tree.path));
+                break;
+            case 'connector':
+                const childDescriptions = tree.children.map((childTree) =>
+                    this.FieldType(childTree, getFieldString(childTree.path)));
+                description = childDescriptions.join(" or ");
+                break;
+        }
+        return description;
+    },
+
+    async splitAndAddDomain(domain) {
+        // It will split domain based domain is branch or node and create filters
+        const tree = toTree(domain);
+        const trees = !tree.negate && tree.value === "&" ? tree.children : [tree];
+        const promises = trees.map(async (tree) => {
+            const description = await this.DomainDescription(tree);
+            const preFilter = {
+                description,
+                domain: domain,
+                invisible: true,
+                type: "filter",
+            };
+            return preFilter;
+        });
+        const preFilters = await Promise.all(promises);
+        for (const preFilter of preFilters) {
+            this.createNewFilters([preFilter]);
+        }
+    }
+});

advanced_search_widget/static/src/xml/SearchWidget.xml

@@ -0,0 +1,160 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates xml:space="preserve">
+<!-- Template for new Search widget-->
+    <t t-name="SearchWidget" owl="1">
+        <Dropdown togglerClass="'o_searchview_dropdown_toggler d-print-none btn btn-outline-secondary'"
+                  menuClass="'o_search_widget d-flex'" >
+            <t t-set-slot="toggler">
+                <i class="fa fa-caret-down" style="color:black" />
+            </t>
+            <!-- Filter Template-->
+            <t t-if="env.searchModel.searchMenuTypes.has('filter')">
+                <div class="o_dropdown_container o_filter_menu">
+                    <div class="px-3 fs-5 mb-2">
+                        <i class="me-1" t-att-class="filterIcon"/>
+                        <h5 class="o_dropdown_title d-inline">Filters</h5>
+                    </div>
+                    <t t-set="currentGroup" t-value="null"/>
+                    <t t-foreach="Filteritems" t-as="item" t-key="item.id">
+                        <t t-if="currentGroup !== null and currentGroup !== item.groupNumber">
+                            <div class="dropdown-divider" role="separator"/>
+                        </t>
+                        <t t-if="item.options">
+                            <div class="dropdown-toggle o_menu_item dropdown-item"
+                                 href="#" data-bs-toggle="dropdown">
+                                <t t-esc="item.description"/>
+                            </div>
+                            <div id="filter_options" class="dropdown-menu"
+                                 role="menu">
+                                <t t-foreach="item.options" t-as="option"
+                                   t-key="option.id">
+                                    <t t-if="subGroup !== null and subGroup !== option.groupNumber">
+                                        <div class="dropdown-divider"
+                                             role="separator"/>
+                                    </t>
+                                    <DropdownItem
+                                            class="{ o_item_option: true, selected: option.isActive }"
+                                            t-esc="option.description"
+                                            checked="option.isActive"
+                                            parentClosingMode="'none'"
+                                            onSelected="() => this.onFilterSelected({ itemId: item.id, optionId: option.id })"
+                                    />
+                                    <t t-set="subGroup"
+                                       t-value="option.groupNumber"/>
+                                </t>
+                            </div>
+                        </t>
+                        <t t-else="">
+                            <DropdownItem
+                                    class="{ o_menu_item: true, selected: item.isActive }"
+                                    checked="item.isActive"
+                                    parentClosingMode="'none'"
+                                    t-esc="item.description"
+                                    onSelected="() => this.onFilterSelected({ itemId: item.id })"
+                            />
+                        </t>
+                        <t t-set="currentGroup" t-value="item.groupNumber"/>
+                    </t>
+                    <t t-if="Filteritems.length">
+                        <div role="separator" class="dropdown-divider"/>
+                    </t>
+                    <div style="padding-left: 15px;"
+                         class="dropdown-toggle o_menu_item dropdown-item"
+                         t-on-click="onAddCustomFilterClick">
+                            Add Custom Filter
+                    </div>
+                </div>
+            </t>
+            <!-- GroupBy Template-->
+            <t t-if="env.searchModel.searchMenuTypes.has('groupBy')">
+                <div class="o_dropdown_container o_group_by_menu">
+                    <div class="px-3 fs-5 mb-2">
+                        <i class="me-1" t-att-class="groupByIcon"/>
+                        <h5 class="o_dropdown_title d-inline">GroupBy</h5>
+                    </div>
+                    <t t-set="currentGroup" t-value="null"/>
+                    <t t-foreach="groupByitems" t-as="item" t-key="item.id">
+                        <t t-if="currentGroup !== null and currentGroup !== item.groupNumber">
+                            <div class="dropdown-divider" role="separator"/>
+                        </t>
+                        <t t-if="item.options">
+                            <div class="dropdown-toggle o_menu_item dropdown-item"
+                                 href="#" data-bs-toggle="dropdown">
+                                <t t-esc="item.description"/>
+                            </div>
+                            <div id="groupBy_options" class="dropdown-menu"
+                                 role="menu">
+                                <t t-foreach="item.options" t-as="option"
+                                   t-key="option.id">
+                                    <t t-if="subGroup !== null and subGroup !== option.groupNumber">
+                                        <div class="dropdown-divider"
+                                             role="separator"/>
+                                    </t>
+                                    <DropdownItem
+                                            class="{ o_item_option: true, selected: option.isActive }"
+                                            t-esc="option.description"
+                                            checked="option.isActive"
+                                            parentClosingMode="'none'"
+                                            onSelected="() => this.onGroupBySelected({ itemId: item.id, optionId: option.id })"
+                                    />
+                                    <t t-set="subGroup"
+                                       t-value="option.groupNumber"/>
+                                </t>
+                            </div>
+                        </t>
+                        <t t-else="">
+                            <DropdownItem
+                                    class="{ o_menu_item: true, selected: item.isActive }"
+                                    checked="item.isActive"
+                                    parentClosingMode="'none'"
+                                    t-esc="item.description"
+                                    onSelected="() => this.onGroupBySelected({ itemId: item.id })"
+                            />
+                        </t>
+                        <t t-set="currentGroup" t-value="item.groupNumber"/>
+                    </t>
+                    <t t-if="!hideCustomGroupBy and fields.length">
+                        <div t-if="groupByitems.length" role="separator"
+                             class="dropdown-divider"/>
+                        <CustomGroupByItem fields="fields"
+                                           onAddCustomGroup.bind="onAddCustomGroup"/>
+                    </t>
+                </div>
+            </t>
+            <!-- Favorites Template-->
+            <t t-if="env.searchModel.searchMenuTypes.has('groupBy')">
+                <div class="o_dropdown_container o_favorite_menu">
+                    <div class="px-3 fs-5 mb-2">
+                        <i class="me-1" t-att-class="favoriteIcon"/>
+                        <h5 class="o_dropdown_title d-inline">Favorites</h5>
+                    </div>
+                    <t t-set="currentGroup" t-value="null"/>
+                    <t t-foreach="favoriteitems" t-as="item"
+                       t-key="item.id or item.key">
+                        <t t-if="currentGroup !== null and currentGroup !== item.groupNumber">
+                            <div role="separator" class="dropdown-divider"/>
+                        </t>
+                        <t t-if="item.type ==='favorite'">
+                            <DropdownItem
+                                    class="{ o_menu_item: true, selected: item.isActive }"
+                                    checked="item.isActive"
+                                    parentClosingMode="'none'"
+                                    onSelected="() => this.onFavoriteSelected(item.id)">
+                                <span class="d-flex p-0 align-items-center justify-content-between">
+                                    <t t-esc="item.description"/>
+                                    <i class="ms-1 o_icon_right fa fa-trash-o"
+                                       title="Delete item"
+                                       t-on-click.stop="() => this.openConfirmationDialog(item.id)"/>
+                                </span>
+                            </DropdownItem>
+                        </t>
+                        <t t-else="">
+                            <t t-component="item.Component"/>
+                        </t>
+                        <t t-set="currentGroup" t-value="item.groupNumber"/>
+                    </t>
+                </div>
+            </t>
+        </Dropdown>
+    </t>
+</templates>

advanced_search_widget/static/src/xml/custom_favorite_item.xml

@@ -0,0 +1,45 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<templates id="template" xml:space="preserve">
+<!-- Inherited CustomFavoriteItem template for changing dropdown design to modal -->
+    <t t-inherit="web.CustomFavoriteItem" t-inherit-mode="extension" owl="1">
+        <xpath expr="//Dropdown" position="replace">
+            <div class="dropdown-toggle o_menu_item dropdown-item"
+                 data-bs-toggle="modal"
+                 data-bs-target="#o_add_favorite">
+                    Save current search
+            </div>
+            <div id="o_add_favorite" class="modal fade" style="padding-top:20%">
+                <div class="modal-dialog modal-content" style="height: auto;">
+                    <div class="modal-header" style="height: 10px">
+                        <h4>Save current search</h4>
+                        <button type="button" class="btn-close"
+                                aria-label="Close" data-bs-dismiss="modal"
+                                tabindex="-1"/>
+                    </div>
+                    <div class="px-4 py-4">
+                    <input type="text"
+                           class="o_input"
+                           t-ref="description"
+                           t-model.trim="state.description"
+                           t-on-keydown="onInputKeydown"
+                    />
+                        <CheckBox value="state.isDefault"
+                                  onChange.bind="onDefaultCheckboxChange">
+                        Use by default
+                    </CheckBox>
+                        <CheckBox value="state.isShared"
+                                  onChange.bind="onShareCheckboxChange">
+                        Share with all users
+                    </CheckBox>
+                    </div>
+                    <div class="px-3 py-2">
+                        <button class="o_save_favorite btn btn-primary"
+                                t-on-click="saveFavorite" data-bs-dismiss="modal">
+                            Save
+                        </button>
+                    </div>
+                </div>
+            </div>
+        </xpath>
+    </t>
+</templates>

advanced_search_widget/static/src/xml/custom_filter_item.xml

@@ -0,0 +1,35 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<templates id="template" xml:space="preserve">
+<!-- Inherited CustomGroupByItem template for changing dropdown design to modal -->
+    <t t-inherit="web.CustomGroupByItem" t-inherit-mode="extension" owl="1">
+        <xpath expr="//Dropdown" position="replace">
+            <div class="dropdown-toggle o_menu_item dropdown-item" data-bs-toggle="modal"
+                   data-bs-target="#o_add_groupby">
+                    Add Custom Group
+            </div>
+            <div id="o_add_groupby" class="modal fade" style="padding-top:20%">
+                <div class="modal-dialog modal-content" style="height: auto;">
+                    <div class="modal-header" style="height: 10px">
+                        <h4>Add Custom Group</h4>
+                        <button type="button" class="btn-close" aria-label="Close" data-bs-dismiss="modal" tabindex="-1"/>
+                    </div>
+                    <div class="px-3 py-2">
+                        <select class="w-100 o_input" t-model="state.fieldName">
+                            <option t-foreach="props.fields" t-as="field" t-key="field.name"
+                            t-att-value="field.name"
+                            t-esc="field.string"
+                            />
+                        </select>
+                    </div>
+                    <div class="px-3 py-2">
+                        <button class="btn btn-primary" data-bs-dismiss="modal"
+                            t-on-click="() => props.onAddCustomGroup(state.fieldName)"
+                            >
+                            Apply
+                        </button>
+                    </div>
+                </div>
+            </div>
+        </xpath>
+    </t>
+</templates>

advanced_search_widget/static/src/xml/search_bar.xml

@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<templates id="template" xml:space="preserve">
+    <!-- Inherited Searchbar template for adding new search widget -->
+    <t t-inherit="web.SearchBar" t-inherit-mode="extension" owl="1">
+        <xpath expr="//div[hasclass('o_searchview')]" position="before">
+                <SearchWidget/>
+        </xpath>
+    </t>
+    <!-- Inherited template for hiding search menus -->
+    <t t-inherit="web.ControlPanel.Regular" t-inherit-mode="extension" owl="1">
+        <xpath expr="//div[hasclass('o_search_options')]" position="replace">
+             <div class="btn-group o_search_options position-static" style="display:none"
+                  role="search">
+                  <t t-foreach="searchMenus" t-as="menu" t-key="menu.key">
+                        <t t-component="menu.Component"/>
+                  </t>
+             </div>
+        </xpath>
+    </t>
+</templates>