0613修改侧边栏
This commit is contained in:
@@ -34,11 +34,14 @@
|
||||
"data": [
|
||||
'views/layout.xml',
|
||||
'views/icons.xml',
|
||||
# 'views/navbar.xml'
|
||||
],
|
||||
'assets': {
|
||||
'web.assets_backend': [
|
||||
'code_backend_theme/static/src/xml/styles.xml',
|
||||
'code_backend_theme/static/src/xml/top_bar.xml',
|
||||
# 'code_backend_theme/static/src/xml/dropdown.xml',
|
||||
'code_backend_theme/static/src/xml/navbar.xml',
|
||||
'code_backend_theme/static/src/scss/theme_accent.scss',
|
||||
'code_backend_theme/static/src/scss/navigation_bar.scss',
|
||||
'code_backend_theme/static/src/scss/datetimepicker.scss',
|
||||
|
||||
1
code_backend_theme/static/src/icon/caret-down.svg
Normal file
1
code_backend_theme/static/src/icon/caret-down.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--! Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2023 Fonticons, Inc. --><path d="M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z"/></svg>
|
||||
|
After Width: | Height: | Size: 448 B |
@@ -1,6 +1,7 @@
|
||||
odoo.define('code_backend_theme.SidebarMenu', function (require) {
|
||||
"use strict";
|
||||
//鼠标点击侧边导航栏,对应的导航选项卡的显隐
|
||||
// console.log($('.d-block').css())
|
||||
$(document).on("click", '.sidebar_menu li', function (event) {
|
||||
var aA = $(this).children('.d-md-flex').children()
|
||||
var aLi = $(this).parent().children()
|
||||
@@ -25,15 +26,16 @@ odoo.define('code_backend_theme.SidebarMenu', function (require) {
|
||||
}
|
||||
}
|
||||
})
|
||||
//鼠标点击二级菜单,svg图标随着三级菜单的显隐而切换
|
||||
|
||||
|
||||
$(document).on("mouseover", '.sidebar_menu li', function (event) {
|
||||
$('.sidebar_menu li').off()
|
||||
$(this).css({'background-color': '#fff !important'})
|
||||
})
|
||||
$(document).on("mouseleave", '.sidebar_menu li', function (event) {
|
||||
$(this).css({'background-color': '#ccc !important'})
|
||||
})
|
||||
// $(document).on("mouseover", '.sidebar_menu li', function (event) {
|
||||
// $('.sidebar_menu li').off()
|
||||
// $(this).css({'background-color': '#fff !important'})
|
||||
// })
|
||||
// $(document).on("mouseleave", '.sidebar_menu li', function (event) {
|
||||
// $(this).css({'background-color': '#ccc !important'})
|
||||
// })
|
||||
//sidebar toggle effect
|
||||
$(document).on("click", "#closeSidebar", function (event) {
|
||||
$("#closeSidebar").hide();
|
||||
@@ -45,8 +47,8 @@ odoo.define('code_backend_theme.SidebarMenu', function (require) {
|
||||
});
|
||||
$(document).on("click", "#openSidebar", function (event) {
|
||||
$("#sidebar_panel").css({'display': 'block'});
|
||||
$(".o_action_manager").css({'margin-left': '200px', 'transition': 'all .1s linear'});
|
||||
$(".top_heading").css({'margin-left': '200px', 'transition': 'all .1s linear', 'width': 'auto'});
|
||||
$(".o_action_manager").css({'margin-left': '250px', 'transition': 'all .1s linear'});
|
||||
$(".top_heading").css({'margin-left': '250px', 'transition': 'all .1s linear', 'width': 'auto'});
|
||||
|
||||
//add class in navbar
|
||||
var navbar = $(".o_main_navbar");
|
||||
|
||||
@@ -1,3 +1,7 @@
|
||||
#sidebar_panel {
|
||||
width: 250px !important;
|
||||
}
|
||||
|
||||
.o_menu_sections {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -12,9 +16,9 @@
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
//.o_menu_sections {
|
||||
// background-color: transparent !important;
|
||||
//}
|
||||
.o_menu_sections {
|
||||
background-color: unset !important;
|
||||
}
|
||||
|
||||
.d-md-flex {
|
||||
visibility: hidden;
|
||||
@@ -41,3 +45,71 @@
|
||||
.nav-link {
|
||||
box-shadow: 0px 0px 2px #fff;
|
||||
}
|
||||
|
||||
.sidebar_menu li:hover .dropdown-item {
|
||||
background-color: unset !important;
|
||||
}
|
||||
|
||||
.sidebar_menu li:hover .o-dropdown {
|
||||
background-color: unset !important;
|
||||
transition: .3s all;
|
||||
}
|
||||
|
||||
.sidebar_menu li .o-dropdown {
|
||||
background-color: unset !important;
|
||||
cursor: pointer;
|
||||
padding-left: 53px !important;
|
||||
}
|
||||
|
||||
.o_menu_sections .dropdown-menu {
|
||||
position: unset !important;
|
||||
background-color: unset;
|
||||
}
|
||||
|
||||
.sidebar_menu li .o_menu_sections > a {
|
||||
padding-left: 53px !important;
|
||||
}
|
||||
|
||||
.sidebar_menu li:hover .dropdown-menu a,
|
||||
.sidebar_menu li:hover .dropdown-menu {
|
||||
background-color: unset !important;
|
||||
}
|
||||
|
||||
.o_menu_sections .dropdown-menu .dropdown-menu_group {
|
||||
color: #ccc;
|
||||
background-color: unset;
|
||||
padding-bottom: 0.5rem !important;
|
||||
padding-left: 89px;
|
||||
}
|
||||
|
||||
.o_menu_sections .dropdown-menu {
|
||||
width: 250px !important;
|
||||
margin-left: -75px !important;
|
||||
max-height: unset !important;
|
||||
box-shadow: unset !important;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.o-dropdown--menu .dropdown-item.focus {
|
||||
background-color: unset !important;
|
||||
}
|
||||
|
||||
.dropdown-menu .dropdown-item {
|
||||
padding-left: 103px !important;
|
||||
}
|
||||
|
||||
svg {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
}
|
||||
|
||||
svg:nth-of-type(1) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.dropdown-toggle {
|
||||
width: 100% !important;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
|
||||
68
code_backend_theme/static/src/xml/navbar.xml
Normal file
68
code_backend_theme/static/src/xml/navbar.xml
Normal file
@@ -0,0 +1,68 @@
|
||||
<?xml version="1.0" encoding="UTF-8" ?>
|
||||
<templates xml:space="preserve">
|
||||
<!-- Inherit the original view -->
|
||||
<t t-inherit="web.NavBar.SectionsMenu" t-inherit-mode="extension" owl="1">
|
||||
|
||||
<!-- Modify the contents of the original view -->
|
||||
<xpath expr="//div[@class='o_menu_sections d-none d-md-flex flex-grow-1 flex-shrink-1']" position="replace">
|
||||
<div class="o_menu_sections d-none d-md-flex flex-grow-1 flex-shrink-1">
|
||||
<!-- Add your custom content here -->
|
||||
<t t-foreach="sections" t-as="section" t-key="section.id">
|
||||
<t
|
||||
t-set="sectionsVisibleCount"
|
||||
t-value="(sections.length - currentAppSectionsExtra.length)"
|
||||
/>
|
||||
|
||||
<t t-if="section_index lt Math.min(10, sectionsVisibleCount)">
|
||||
<t t-set="hotkey" t-value="((section_index + 1) % 10).toString()"/>
|
||||
</t>
|
||||
<t t-else="">
|
||||
<t t-set="hotkey" t-value="undefined"/>
|
||||
</t>
|
||||
|
||||
<t t-if="!section.childrenTree.length">
|
||||
<DropdownItem
|
||||
title="section.name"
|
||||
class="'o_nav_entry'"
|
||||
href="getMenuItemHref(section)"
|
||||
hotkey="hotkey"
|
||||
t-esc="section.name"
|
||||
dataset="{ menuXmlid: section.xmlid, section: section.id }"
|
||||
onSelected="() => this.onNavBarDropdownItemSelection(section)"
|
||||
/>
|
||||
</t>
|
||||
<t t-else="">
|
||||
<MenuDropdown
|
||||
hotkey="hotkey"
|
||||
title="section.name"
|
||||
xmlid="section.xmlid"
|
||||
>
|
||||
<t t-set-slot="toggler">
|
||||
<span t-esc="section.name" t-att-data-section="section.id"/>
|
||||
<svg t="1686643514098" class="icon icon1" viewBox="0 0 1024 1024" version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg" p-id="892" width="200" height="200"><path d="M191.874005 288.29452c-15.95436701 0-29.007661-13.05329399-29.007661-29.007661l0-71.167876c0-15.95436701 13.05329399-29.007661 29.007661-29.007661l643.973754 0c15.95436701 0 29.007661 13.05329399 29.007661 29.007661l0 71.16787599c0 15.95436701-13.05329399 29.007661-29.007661 29.00766101L191.874005 288.29452z" fill="#ffffff" p-id="893"></path>
|
||||
<path d="M835.847759 391.806036c15.95436701 0 21.211091 10.468422 11.68206399 23.264866l-316.65186998 425.214425c-9.529027 12.795421-25.122167 12.795421-34.65017101 0l-316.65084699-425.214425c-9.529027-12.796444-4.272303-23.264866 11.68206399-23.264866L835.847759 391.806036z"
|
||||
fill="#ffffff" p-id="894"></path></svg>
|
||||
<svg t="1686643464598" class="icon icon2" viewBox="0 0 1024 1024" version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg" p-id="1031" width="200" height="200"><path d="M288.29452 832.125995c0 15.95436701-13.05329399 29.007661-29.007661 29.007661l-71.167876 0c-15.95436701 0-29.007661-13.05329399-29.007661-29.007661l0-643.973754c0-15.95436701 13.05329399-29.007661 29.007661-29.007661l71.16787599 0c15.95436701 0 29.007661 13.05329399 29.00766101 29.007661L288.29452 832.125995z" fill="#ffffff" p-id="1032"></path>
|
||||
<path d="M391.806036 188.152241c0-15.95436701 10.468422-21.211091 23.264866-11.68206399l425.214425 316.65186998c12.795421 9.529027 12.795421 25.122167 0 34.65017101l-425.214425 316.65084699c-12.796444 9.529027-23.264866 4.272303-23.264866-11.68206399L391.806036 188.152241z"
|
||||
fill="#ffffff" p-id="1033"></path></svg>
|
||||
</t>
|
||||
<t t-call="web.NavBar.SectionsMenu.Dropdown.MenuSlot">
|
||||
<t t-set="items" t-value="section.childrenTree"/>
|
||||
</t>
|
||||
</MenuDropdown>
|
||||
</t>
|
||||
</t>
|
||||
|
||||
<t t-if="currentAppSectionsExtra.length" t-call="web.NavBar.SectionsMenu.MoreDropdown">
|
||||
<t t-set="sections" t-value="currentAppSectionsExtra"/>
|
||||
<t t-if="sectionsVisibleCount lt 10">
|
||||
<t t-set="hotkey" t-value="(sectionsVisibleCount + 1 % 10).toString()"/>
|
||||
</t>
|
||||
</t>
|
||||
</div>
|
||||
</xpath>
|
||||
</t>
|
||||
|
||||
</templates>
|
||||
Reference in New Issue
Block a user