From 667a25649cce2b18e6e0d9cde272ca7679e4d3cc Mon Sep 17 00:00:00 2001 From: AjmalCybro Date: Thu, 9 Jan 2025 15:52:29 +0530 Subject: [PATCH] Jan 04 [UPDT] : Updated 'code_backend_theme_enterprise' --- code_backend_theme_enterprise/__manifest__.py | 8 +- .../doc/RELEASE_NOTES.md | 5 + .../static/src/js/chrome/sidebar.js | 160 ++++++++++++------ .../static/src/scss/sidebar.scss | 2 + .../static/src/xml/sidebar_templates.xml | 26 --- .../static/src/xml/top_bar_templates.xml | 35 ++-- 6 files changed, 139 insertions(+), 97 deletions(-) delete mode 100644 code_backend_theme_enterprise/static/src/xml/sidebar_templates.xml diff --git a/code_backend_theme_enterprise/__manifest__.py b/code_backend_theme_enterprise/__manifest__.py index 203652aec..216e46690 100644 --- a/code_backend_theme_enterprise/__manifest__.py +++ b/code_backend_theme_enterprise/__manifest__.py @@ -21,7 +21,7 @@ ############################################################################# { "name": "Code Backend Theme Enterprise", - "version": "18.0.1.0.0", + "version": "18.0.1.0.1", "category": "Themes/Backend", "summary": "Minimalist and elegant backend theme for Odoo Enterprise", "description": """Minimalist and elegant backend theme for Odoo Backend""", @@ -36,16 +36,13 @@ 'assets': { 'web.assets_backend': [ "code_backend_theme_enterprise/static/src/xml/top_bar_templates.xml", - "code_backend_theme_enterprise/static/src/xml/sidebar_templates.xml", "code_backend_theme_enterprise/static/src/scss/sidebar.scss", "code_backend_theme_enterprise/static/src/js/chrome/sidebar.js", "code_backend_theme_enterprise/static/src/js/fields/colors.js", "code_backend_theme_enterprise/static/src/scss/theme_accent.scss", "code_backend_theme_enterprise/static/src/scss/datetimepicker.scss", "code_backend_theme_enterprise/static/src/scss/theme.scss", - "https://fonts.googleapis.com/css2?family=Poppins:wght@400;700" - "&display=swap", - "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js", + "https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap", ], 'web.assets_frontend': [ "code_backend_theme_enterprise/static/src/scss/login.scss", @@ -57,7 +54,6 @@ 'static/description/banner.jpg', 'static/description/theme_screenshot.jpg', ], - 'icon':'static/description/icon.png', 'license': 'LGPL-3', 'installable': True, 'auto_install': False, diff --git a/code_backend_theme_enterprise/doc/RELEASE_NOTES.md b/code_backend_theme_enterprise/doc/RELEASE_NOTES.md index 1e30edfb6..2989fcb08 100644 --- a/code_backend_theme_enterprise/doc/RELEASE_NOTES.md +++ b/code_backend_theme_enterprise/doc/RELEASE_NOTES.md @@ -3,3 +3,8 @@ #### Version 18.0.1.0.0 ##### ADD Initial commit for Code Backend Theme Enterprise + +#### 09.01.2025 +#### Version 18.0.1.0.1 +#### UPDT +- Code Refactoring diff --git a/code_backend_theme_enterprise/static/src/js/chrome/sidebar.js b/code_backend_theme_enterprise/static/src/js/chrome/sidebar.js index 8f8cb1c14..61dbb6080 100644 --- a/code_backend_theme_enterprise/static/src/js/chrome/sidebar.js +++ b/code_backend_theme_enterprise/static/src/js/chrome/sidebar.js @@ -1,55 +1,109 @@ -// Utility function to apply CSS styles and class modifications -function adjustLayoutOnSidebarToggle(isOpen) { - const actionManager = $(".o_action_manager"); - const sidebarIcon = $(".side_bar_icon"); - const navbar = $(".o_main_navbar"); - const topHeading = $(".top_heading"); - - if (isOpen) { - $("#sidebar_panel").show(); - if (window.matchMedia("(min-width: 768px)").matches) { - actionManager.css({ 'margin-left': '200px', 'transition': 'all .1s linear' }); - sidebarIcon.css({ 'margin-left': '200px', 'transition': 'all .1s linear' }); +/** @odoo-module **/ + +import { NavBar } from '@web/webclient/navbar/navbar'; +import { patch } from "@web/core/utils/patch"; + +import {Component, onWillDestroy, useExternalListener, onMounted, useRef, onWillUnmount,} from "@odoo/owl"; + +patch(NavBar.prototype, { + setup() { + super.setup(); + + this.openElement = useRef("openSidebar"); + this.closeElement = useRef("closeSidebar"); + this.topHeading = useRef("sidebar_icon"); + this.sidebarLinks = useRef("sidebarLinks"); + const sidebarLinkHandler = this.handleSidebarLinkClick.bind(this); + const openSidebarHandler = this.openSidebar.bind(this); + const closeSidebarHandler = this.closeSidebar.bind(this); + onMounted(() => { + const openSidebarElement = this.openElement.el + const closeSidebarElement = this.closeElement.el + const sidebarLinkElements = this.sidebarLinks.el.children; + if (sidebarLinkElements) { + Array.from(sidebarLinkElements).forEach(link => { + link.addEventListener('click', sidebarLinkHandler); + }); + } + if (openSidebarElement) { + openSidebarElement.addEventListener('click', openSidebarHandler); + } + if (closeSidebarElement) { + closeSidebarElement.addEventListener('click', closeSidebarHandler); + } + }); + + onWillUnmount(() => { + const openSidebarElement = this.openElement.el + const closeSidebarElement = this.closeElement.el + const sidebarLinkElements = this.sidebarLinks.el.children; + if (openSidebarElement) { + openSidebarElement.removeEventListener('click', openSidebarHandler); + } + if (closeSidebarElement) { + closeSidebarElement.removeEventListener('click', closeSidebarHandler); + } + if (sidebarLinkElements) { + Array.from(sidebarLinkElements).forEach(link => { + link.removeEventListener('click', sidebarLinkHandler); + }); + } + }); + }, + + openSidebar() { + this.root.el.nextElementSibling.style.marginLeft = '200px'; + this.root.el.nextElementSibling.style.transition = 'all .1s linear'; + const openSidebarElement = this.openElement.el + const closeSidebarElement = this.closeElement.el + if (openSidebarElement) openSidebarElement.style.display = 'none'; + if (closeSidebarElement) closeSidebarElement.style.display = 'block'; + if (this.root.el.lastChild && this.root.el.lastChild.nodeType === Node.ELEMENT_NODE) { + this.root.el.lastChild.style.display = 'block'; + } + + if (this.topHeading.el && this.topHeading.el.nodeType === Node.ELEMENT_NODE) { + this.topHeading.el.style.marginLeft = '200px'; + this.topHeading.el.style.transition = 'all .1s linear'; + this.topHeading.el.style.width = 'auto'; + } + }, + + closeSidebar() { + console.log('Sidebar closed', this.topHeading); + this.root.el.nextElementSibling.style.marginLeft = '0px'; + this.root.el.nextElementSibling.style.transition = 'all .1s linear'; + const openSidebarElement = this.openElement.el + const closeSidebarElement = this.closeElement.el + if (openSidebarElement) openSidebarElement.style.display = 'block'; + if (closeSidebarElement) closeSidebarElement.style.display = 'none'; + if (this.root.el.lastChild && this.root.el.lastChild.nodeType === Node.ELEMENT_NODE) { + this.root.el.lastChild.style.display = 'none'; + } + if (this.topHeading.el && this.topHeading.el.nodeType === Node.ELEMENT_NODE) { + this.topHeading.el.style.marginLeft = '0px'; + this.topHeading.el.style.width = 'auto'; + } + }, + + handleSidebarLinkClick(event) { + const closeSidebarElement = this.closeElement.el + if (closeSidebarElement) closeSidebarElement.style.display = 'none'; + if (this.topHeading.el && this.topHeading.el.nodeType === Node.ELEMENT_NODE) { + this.topHeading.el.style.marginLeft = '0px'; + } + if (this.topHeading.el && this.topHeading.el.nodeType === Node.ELEMENT_NODE) { + this.topHeading.el.style.marginLeft = '0px'; + this.topHeading.el.style.width = '100%'; } - navbar.addClass("small_nav").addClass(navbar.data("id")); - actionManager.addClass("sidebar_margin").addClass(actionManager.data("id")); - topHeading.addClass("sidebar_margin").addClass(topHeading.data("id")); - } else { - $("#sidebar_panel").hide(); - actionManager.css({ 'margin-left': '0px' }); - sidebarIcon.css({ 'margin-left': '0px' }); - navbar.removeClass("small_nav").removeClass(navbar.data("id")); - actionManager.removeClass("sidebar_margin").removeClass(actionManager.data("id")); - topHeading.removeClass("sidebar_margin").removeClass(topHeading.data("id")); + const li = event.currentTarget; + const a = li.firstElementChild; + const id = a.getAttribute('data-id'); + document.querySelector('header').className = id; + Array.from(this.sidebarLinks.el.children).forEach(li => { + li.firstElementChild.classList.remove('active'); + }); + a.classList.add('active'); + this.closeSidebar(); } -} - -// Toggle sidebar visibility on click -$(document).on("click", "#openSidebar", () => { - $("#openSidebar").hide(); - $("#closeSidebar").show(); - adjustLayoutOnSidebarToggle(true); -}); - -$(document).on("click", "#closeSidebar", () => { - $("#closeSidebar").hide(); - $("#openSidebar").show(); - adjustLayoutOnSidebarToggle(false); -}); - -// Handle menu item clicks -$(document).on("click", ".sidebar a", function () { - const $this = $(this); - const menuItems = $(".sidebar a"); - - menuItems.removeClass("active"); - $this.addClass("active"); - - // Adjust the header to reflect the active menu - $("header").removeClass().addClass($this.data("id")); - - // Close sidebar after menu item selection - adjustLayoutOnSidebarToggle(false); - $("#closeSidebar").hide(); - $("#openSidebar").show(); -}); +}); \ No newline at end of file diff --git a/code_backend_theme_enterprise/static/src/scss/sidebar.scss b/code_backend_theme_enterprise/static/src/scss/sidebar.scss index e0186ba47..a07144a45 100644 --- a/code_backend_theme_enterprise/static/src/scss/sidebar.scss +++ b/code_backend_theme_enterprise/static/src/scss/sidebar.scss @@ -95,3 +95,5 @@ display: block !important; } } + + diff --git a/code_backend_theme_enterprise/static/src/xml/sidebar_templates.xml b/code_backend_theme_enterprise/static/src/xml/sidebar_templates.xml deleted file mode 100644 index 54e3e217f..000000000 --- a/code_backend_theme_enterprise/static/src/xml/sidebar_templates.xml +++ /dev/null @@ -1,26 +0,0 @@ - - - - - - - - - - diff --git a/code_backend_theme_enterprise/static/src/xml/top_bar_templates.xml b/code_backend_theme_enterprise/static/src/xml/top_bar_templates.xml index c3dfd9611..418d6013e 100644 --- a/code_backend_theme_enterprise/static/src/xml/top_bar_templates.xml +++ b/code_backend_theme_enterprise/static/src/xml/top_bar_templates.xml @@ -4,29 +4,38 @@ owl="1"> - - - - + + + + - + - - + - +