feat: new interface pendant can be configured to display hidden

packages/@core/ui-kit/layout-ui/src/vben-layout.ts

@@ -87,6 +87,11 @@ interface VbenLayoutProps {
    * @default 'fixed'
    */
   headerMode?: LayoutHeaderModeType;
+  /**
+   * 是否显示header切换侧边栏按钮
+   * @default
+   */
+  headerToggleSidebarButton?: boolean;
   /**
    * header是否显示
    * @default true
@@ -152,21 +157,21 @@ interface VbenLayoutProps {
    * @default 210
    */
   sidebarWidth?: number;
+  /**
+   * footer背景颜色
+   * @default #fff
+   */
+  tabbarBackgroundColor?: string;
   /**
    * tab是否可见
    * @default true
    */
   tabbarEnable?: boolean;
-  /**
-   * footer背景颜色
-   * @default #fff
-   */
-  tabsBackgroundColor?: string;
   /**
    * tab高度
    * @default 30
    */
-  tabsHeight?: number;
+  tabbarHeight?: number;
   /**
    * zIndex
    * @default 100

packages/@core/ui-kit/layout-ui/src/vben-layout.vue

@@ -32,8 +32,8 @@ const props = withDefaults(defineProps<Props>(), {
   headerHeight: 50,
   headerHeightOffset: 10,
   headerHidden: false,
-
   headerMode: 'fixed',
+  headerToggleSidebarButton: true,
   headerVisible: true,
   isMobile: false,
   layout: 'sidebar-nav',
@@ -45,7 +45,7 @@ const props = withDefaults(defineProps<Props>(), {
   sidebarTheme: 'dark',
   sidebarWidth: 180,
   tabbarEnable: true,
-  tabsHeight: 36,
+  tabbarHeight: 36,
   zIndex: 200,
 });
 
@@ -122,7 +122,7 @@ const headerWrapperHeight = computed(() => {
     height += getHeaderHeight.value;
   }
   if (props.tabbarEnable) {
-    height += props.tabsHeight;
+    height += props.tabbarHeight;
   }
   return height;
 });
@@ -364,6 +364,7 @@ const maskStyle = computed((): CSSProperties => {
 
 const showHeaderToggleButton = computed(() => {
   return (
+    props.headerToggleSidebarButton &&
     isSideMode.value &&
     !isSidebarMixedNav.value &&
     !isMixedNav.value &&
@@ -528,7 +529,7 @@ function handleOpenMenu() {
 
         <LayoutTabbar
           v-if="tabbarEnable"
-          :height="tabsHeight"
+          :height="tabbarHeight"
           :style="tabbarStyle"
         >
           <slot name="tabbar"></slot>