From b7f131b6657ad028e72acb33f570dff872296e1c Mon Sep 17 00:00:00 2001
From: weareoutman <wangshenwei@qq.com>
Date: Mon, 2 Sep 2024 19:32:32 +0800
Subject: [PATCH] feat(eo-page-view): add aside slot

---
 bricks/containers/src/page-view/index.tsx     | 41 +++++++++++--------
 .../src/page-view/styles.shadow.css           | 13 +++++-
 2 files changed, 35 insertions(+), 19 deletions(-)

diff --git a/bricks/containers/src/page-view/index.tsx b/bricks/containers/src/page-view/index.tsx
index 0ce2df2b4..bf33901c1 100644
--- a/bricks/containers/src/page-view/index.tsx
+++ b/bricks/containers/src/page-view/index.tsx
@@ -107,28 +107,33 @@ export function EoPageViewComponent({
 
   return (
     <>
-      <div className="header">
-        <slot name="header" />
-      </div>
-      <div className="main">
-        <div className="sidebar">
-          <slot name="sidebar" />
-        </div>
-        <div className="sub-sidebar">
-          <slot name="subSidebar" />
+      <div className="header-and-main">
+        <div className="header">
+          <slot name="header" />
         </div>
-        <div className="content">
-          <slot />
-          <div
-            className={classNames("footer", { pinned: footerPinned })}
-            ref={footerRef}
-          >
-            <WrappedNarrowView size={narrow}>
-              <slot name="footer" />
-            </WrappedNarrowView>
+        <div className="main">
+          <div className="sidebar">
+            <slot name="sidebar" />
+          </div>
+          <div className="sub-sidebar">
+            <slot name="subSidebar" />
+          </div>
+          <div className="content">
+            <slot />
+            <div
+              className={classNames("footer", { pinned: footerPinned })}
+              ref={footerRef}
+            >
+              <WrappedNarrowView size={narrow}>
+                <slot name="footer" />
+              </WrappedNarrowView>
+            </div>
           </div>
         </div>
       </div>
+      <div className="aside">
+        <slot name="aside" />
+      </div>
     </>
   );
 }
diff --git a/bricks/containers/src/page-view/styles.shadow.css b/bricks/containers/src/page-view/styles.shadow.css
index 89cca9851..5ae85fb3e 100644
--- a/bricks/containers/src/page-view/styles.shadow.css
+++ b/bricks/containers/src/page-view/styles.shadow.css
@@ -2,7 +2,6 @@
   --local-footer-height: 62px;
 
   display: flex;
-  flex-direction: column;
   height: 100%;
 }
 
@@ -10,6 +9,18 @@
   display: none;
 }
 
+.header-and-main,
+.aside {
+  height: 100%;
+  min-width: 0;
+}
+
+.header-and-main {
+  display: flex;
+  flex-direction: column;
+  flex-grow: 1;
+}
+
 .header,
 .main {
   min-height: 0;