fix(layout): fix style compatibility issues

src/layouts/default/index.vue

@@ -2,7 +2,7 @@
   <Layout :class="prefixCls" v-bind="lockEvents">
     <LayoutFeatures />
     <LayoutHeader fixed v-if="getShowFullHeaderRef" />
-    <Layout :class="layoutClass">
+    <Layout :class="[layoutClass]">
       <LayoutSideBar v-if="getShowSidebar || getIsMobile" />
       <Layout :class="`${prefixCls}-main`">
         <LayoutMultipleHeader />
@@ -45,12 +45,18 @@
       const { prefixCls } = useDesign('default-layout');
       const { getIsMobile } = useAppInject();
       const { getShowFullHeaderRef } = useHeaderSetting();
-      const { getShowSidebar, getIsMixSidebar } = useMenuSetting();
+      const { getShowSidebar, getIsMixSidebar, getIsSidebarType } = useMenuSetting();
 
       // Create a lock screen monitor
       const lockEvents = useLockPage();
 
-      const layoutClass = computed(() => ({ 'ant-layout-has-sider': unref(getIsMixSidebar) }));
+      const layoutClass = computed(() => {
+        let cls: string[] = ['ant-layout'];
+        if (unref(getIsMixSidebar) || unref(getIsSidebarType)) {
+          cls.push('ant-layout-has-sider');
+        }
+        return cls;
+      });
 
       return {
         getShowFullHeaderRef,
@@ -79,6 +85,7 @@
     }
 
     &-main {
+      width: 100%;
       margin-left: 1px;
     }
   }