From 0ead4403d8e977dd74183eb3e20aeaa96f7f2b46 Mon Sep 17 00:00:00 2001
From: ZLY <zhongliangyuan@gdngsk.com>
Date: Tue, 26 Aug 2025 15:05:22 +0800
Subject: [PATCH] =?UTF-8?q?style(ideContainer):=20=E4=BC=98=E5=8C=96?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E5=B8=83=E5=B1=80=E5=92=8C=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 调整 IDEContainer 高度为 calc(100vh - 60px)
- 移除侧边栏固定定位和额外样式- 统一组件列表等元素的高度为 100%
- 调整子菜单最小高度为 calc(100vh - 60px)
---
 src/pages/ideContainer/index.tsx              | 22 +++++++++----------
 src/pages/ideContainer/sideBar.tsx            | 13 -----------
 .../ideContainer/style/index.module.less      |  4 ++--
 .../ideContainer/style/sideBar.module.less    | 12 ----------
 4 files changed, 13 insertions(+), 38 deletions(-)

diff --git a/src/pages/ideContainer/index.tsx b/src/pages/ideContainer/index.tsx
index fe0f843..d954233 100644
--- a/src/pages/ideContainer/index.tsx
+++ b/src/pages/ideContainer/index.tsx
@@ -17,16 +17,16 @@ type UrlParamsOptions = {
   [key: string]: string
 };
 
-const CompListComponent = () => <div style={{ height: '70vh', width: '100%' }}>组件列表</div>;
-const AppInstanceComponent = () => <div style={{ height: '70vh', width: '100%' }}>应用实例</div>;
-const EventComponent = () => <div style={{ height: '70vh', width: '100%' }}>事件</div>;
-const GlobalVarComponent = () => <div style={{ height: '70vh', width: '100%' }}>全局变量</div>;
-const MyComponents = () => <div style={{ height: '70vh', width: '100%' }}>我的组件</div>;
-const MatchingComponents = () => <div style={{ height: '70vh', width: '100%' }}>协同组件</div>;
-const ComponentReview = () => <div style={{ height: '70vh', width: '100%' }}>组件审核</div>;
-const ComponentCoding = () => <div style={{ height: '70vh', width: '100%' }}>组件编码</div>;
-const ComponentDeployment = () => <div style={{ height: '70vh', width: '100%' }}>组件部署</div>;
-const ComponentTest = () => <div style={{ height: '70vh', width: '100%' }}>组件测试</div>;
+const CompListComponent = () => <div style={{ height: '100%', width: '100%' }}>组件列表</div>;
+const AppInstanceComponent = () => <div style={{ height: '100%', width: '100%' }}>应用实例</div>;
+const EventComponent = () => <div style={{ height: '100%', width: '100%' }}>事件</div>;
+const GlobalVarComponent = () => <div style={{ height: '100%', width: '100%' }}>全局变量</div>;
+const MyComponents = () => <div style={{ height: '100%', width: '100%' }}>我的组件</div>;
+const MatchingComponents = () => <div style={{ height: '100%', width: '100%' }}>协同组件</div>;
+const ComponentReview = () => <div style={{ height: '100%', width: '100%' }}>组件审核</div>;
+const ComponentCoding = () => <div style={{ height: '100%', width: '100%' }}>组件编码</div>;
+const ComponentDeployment = () => <div style={{ height: '100%', width: '100%' }}>组件部署</div>;
+const ComponentTest = () => <div style={{ height: '100%', width: '100%' }}>组件测试</div>;
 
 function IDEContainer() {
 
@@ -87,7 +87,7 @@ function IDEContainer() {
             style={{
               width: subMenuWidth,
               height: '100%',
-              minHeight: 'calc(100vh - 40px)'
+              minHeight: 'calc(100vh - 60px)'
             }}
             onMoving={handleSubMenuResize}
           >
diff --git a/src/pages/ideContainer/sideBar.tsx b/src/pages/ideContainer/sideBar.tsx
index 4c6a135..4b6e4ae 100644
--- a/src/pages/ideContainer/sideBar.tsx
+++ b/src/pages/ideContainer/sideBar.tsx
@@ -1,9 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import styles from './style/sideBar.module.less';
 import { IconApps } from '@arco-design/web-react/icon';
-import { GlobalState } from '@/store';
-import { useSelector } from 'react-redux';
-import getUrlParams from '@/utils/getUrlParams';
 import { menuData, menuData2 } from './config/menuData';
 
 interface MenuItemType {
@@ -20,16 +17,7 @@ interface SideBarProps {
 }
 
 const SideBar: React.FC<SideBarProps> = ({ onMenuSelect, selectedKey, identity }) => {
-  const urlParams = getUrlParams();
   const [menu, setMenu] = useState<MenuItemType[]>([]);
-  const { settings } = useSelector(
-    (state: GlobalState) => state
-  );
-
-  const navbarHeight = 60;
-  const showNavbar = settings?.navbar && urlParams.navbar !== false;
-  const paddingTop = showNavbar ? { paddingTop: navbarHeight } : {};
-  const sideBarStyle = { ...paddingTop, height: '100%' };
 
   function getMenuData(): MenuItemType[] {
     switch (identity) {
@@ -49,7 +37,6 @@ const SideBar: React.FC<SideBarProps> = ({ onMenuSelect, selectedKey, identity }
   return (
     <div
       className={styles.sider}
-      style={sideBarStyle}
     >
       <div className={styles['menu-container']}>
         {menu.map((item, index) => (
diff --git a/src/pages/ideContainer/style/index.module.less b/src/pages/ideContainer/style/index.module.less
index dd14bf0..4ae0f8f 100644
--- a/src/pages/ideContainer/style/index.module.less
+++ b/src/pages/ideContainer/style/index.module.less
@@ -2,7 +2,7 @@
 
 .IDEContainer {
   width: 100%;
-  height: 100%;
+  height: calc(100vh - 60px);
   padding: 0;
   display: flex;
   flex-direction: row;
@@ -24,7 +24,7 @@
       padding: 16px;
 
       > div {
-        flex: 1;
+        height: 100%;
       }
     }
   }
diff --git a/src/pages/ideContainer/style/sideBar.module.less b/src/pages/ideContainer/style/sideBar.module.less
index b055968..a1915ae 100644
--- a/src/pages/ideContainer/style/sideBar.module.less
+++ b/src/pages/ideContainer/style/sideBar.module.less
@@ -1,21 +1,9 @@
 .sider {
-  width: 60px;
-  height: 100%;
-  overflow-y: auto;
   box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.08);
-  z-index: 99;
   transition: all 0.3s ease-in-out;
-  position: fixed;
-  top: 0;
-  left: 0;
   background-color: var(--color-bg-2);
 }
 
-.menu-container {
-  height: calc(100% - 40px); // 为底部留出空间
-  overflow-y: auto;
-}
-
 .menu-item {
   padding: 12px 4px;
   text-align: center;