update web_ent

app_web_enterprise/static/src/webclient/navbar.js

@@ -0,0 +1,21 @@
+/** @odoo-module **/
+// 以下为参考 17 ，仅16需要
+
+import { patch } from "@web/core/utils/patch";
+import { EnterpriseNavBar } from "@web_enterprise/webclient/navbar/navbar";
+
+patch(EnterpriseNavBar.prototype, "appEnterpriseNavBar", {
+  setup() {
+    this._super(...arguments);
+    this._busToggledCallback = () => this._updateMenuAppsIcon();
+  },
+
+  _updateMenuAppsIcon() {
+    this._super(...arguments);
+    const menuBrandIcon = this.navRef.el.querySelector(".o_menu_brand_icon");
+    if (menuBrandIcon) {
+      menuBrandIcon.classList.toggle("o_hidden", !this.isInApp);
+    }
+  }
+});
+

app_web_enterprise/static/src/webclient/navbar.scss

@@ -0,0 +1,102 @@
+// = Main Navbar 以下为参考 17 ，仅16需要
+// ============================================================================
+$o-navbar-padding-v: 10px !default;
+.o_main_navbar {
+  .o_menu_toggle {
+    // Define a local mixin to handle the toggle state
+    // --------------------------------------------------------------------
+    @mixin o_main_navbar_toggler_toggled() {
+      rect {
+        width: 6px;
+        height: 3px;
+
+        &:first-child {
+          transform: translate(12%, 0) #{"/* rtl:translate(-6%, 0) */"};
+          rx: 1;
+        }
+      }
+
+      #o_menu_toggle_row_0 {
+        transform: scale3d(.5, 1, 1) translate(0, 45%) skewY(-22deg) #{"/* rtl:scale3d(.5, 1, 1) translate(0, 41%) skewY(22deg) */"};
+
+        + g rect {
+          width: 0;
+          height: 0;
+        }
+      }
+
+      #o_menu_toggle_row_2 {
+        transform: scale3d(.5, 1, 1) translate(0, -37%) skewY(22deg) #{"/* rtl:scale3d(.5, 1, 1) translate(0, -35%) skewY(-22deg) */"};
+      }
+    }
+
+    // Animate on large screen without 'reduced-motion' only.
+    // --------------------------------------------------------------------
+    @include media-breakpoint-up(lg) {
+      &.hasImage:not(.o_menu_toggle_back) {
+        .o_menu_toggle_icon {
+          opacity: 0;
+        }
+
+        &:hover {
+          .o_menu_toggle_icon {
+            opacity: 1;
+          }
+
+          .o_menu_brand_icon {
+            opacity: 0;
+          }
+        }
+      }
+
+      @media screen and (prefers-reduced-motion: no-preference) {
+        &:hover {
+          @include o_main_navbar_toggler_toggled();
+        }
+
+        &, g {
+          transition: all .3s;
+        }
+
+        rect {
+          transition: all .1s;
+        }
+
+        &.hasImage:not(.o_menu_toggle_back) {
+          transform: none;
+          transition: none;
+
+          .o_menu_toggle_icon, .o_menu_brand_icon, .o_menu_brand {
+            will-change: transform;
+            transition: all 0.1s;
+          }
+
+          .o_menu_toggle_icon {
+            transform: translateX(75%);
+          }
+
+          &:hover {
+            .o_menu_toggle_icon {
+              transform: translateX(25%);
+              transition: all .4s;
+            }
+
+            .o_menu_brand_icon {
+              transform: rotateY(-90deg);
+              transition: all .2s;
+            }
+
+            .o_menu_brand {
+              transform: translateX(-#{map-get($spacers, 2)});
+              transition: all .4s;
+            }
+          }
+        }
+      }
+
+      .o_menu_brand_icon {
+        object-fit: cover;
+      }
+    }
+  }
+}

app_web_enterprise/static/src/webclient/navbar.xml

@@ -4,12 +4,15 @@
 <t t-name="app_web_enterprise.EnterpriseNavBar" t-inherit="web_enterprise.EnterpriseNavBar" t-inherit-mode="extension">
 <!--   todo: 以下主要是测试，改这个主图标为 O -->
     <xpath expr="//a[hasclass('o_menu_toggle')]" position="replace">
-        <a href="#" class="o_menu_toggle fa fa-2x fa-opera" style="font-size: 2em;" accesskey="h" t-ref="menuApps" t-on-click.prevent="() => this.hm.toggle()">
-<!--            <svg width="14px" height="14px" viewBox="0 0 14 14" xmlns="http://www.w3.org/2000/svg" >-->
-<!--                <g t-foreach="[0, 5, 10]" t-as="Y" t-att-id="'o_menu_toggle_row_' + Y_index" fill="currentColor" t-key="'o_menu_toggle_row_' + Y_index">-->
-<!--                    <rect t-foreach="[0, 5, 10]" t-as="X" width="4" height="4" t-att-x="X" t-att-y="Y" t-key="'o_menu_toggle_cell_' + X_index"/>-->
-<!--                </g>-->
-<!--            </svg>-->
+        <a href="#" class="o_menu_toggle" t-att-class="{'hasImage': currentApp &amp;&amp; currentApp.webIconData}" accesskey="h" t-ref="menuApps" t-on-click.prevent="() => this.hm.toggle()">
+            <i class="o_menu_toggle_icon fa fa-2x fa-opera" style="padding-right:8px;" role="img"/>
+<!--            以下 img 只有 16 需要，17用原生-->
+            <img
+                t-if="currentApp &amp;&amp; currentApp.webIconData"
+                t-att-src="currentApp.webIconData"
+                class="o_menu_brand_icon d-none d-lg-inline position-absolute start-0 h-75 ps-1 ms-2"
+                t-att-alt="currentApp.name"
+                t-ref="appIcon"/>
         </a>
     </xpath>
 </t>
@@ -25,4 +28,12 @@
 <!--            <attribute name="showCaret">true</attribute>-->
 <!--        </xpath>-->
 <!--    </t>-->
+
+<t t-name="app_web_enterprise.EnterpriseNavBar.SectionsMenu" t-inherit="web.NavBar.SectionsMenu" t-inherit-mode="extension">
+    <xpath expr="//MenuDropdown" position="attributes">
+        <attribute name="togglerClass" add="'fw-normal'"/>
+    </xpath>
+
+</t>
+
 </templates>