diff --git a/src/pages/ideContainer/index.tsx b/src/pages/ideContainer/index.tsx index 260c659..fe0f843 100644 --- a/src/pages/ideContainer/index.tsx +++ b/src/pages/ideContainer/index.tsx @@ -5,6 +5,7 @@ import LogBar from './logBar'; import RightSideBar from './rightSideBar'; import { getUrlParams } from '@/utils/common'; import ProjectContainer from '@/pages/orchestration/project'; +import { ResizeBox } from '@arco-design/web-react'; interface Selected { currentPath?: string; @@ -31,6 +32,7 @@ function IDEContainer() { const [selected, setSelected] = useState({}); const [urlParams, setUrlParams] = useState({}); + const [subMenuWidth, setSubMenuWidth] = useState(200); // 子菜单宽度状态 useEffect(() => { setUrlParams(getUrlParams(window.location.href) as UrlParamsOptions); @@ -65,6 +67,12 @@ function IDEContainer() { return
点击左侧菜单选择需要查看的功能
; } }; + + // 处理子菜单区域的拖拽调整大小 + const handleSubMenuResize = (e: MouseEvent, { width }: { width: number }) => { + setSubMenuWidth(width); + }; + return ( <>
@@ -74,6 +82,25 @@ function IDEContainer() { identity={urlParams.identity} />
+ + {/* 这里是子菜单区域,可以根据需要添加具体内容 */} +
+ 子菜单区域 +
+
{renderContent()}
diff --git a/src/pages/ideContainer/style/index.module.less b/src/pages/ideContainer/style/index.module.less index 9badd68..dd14bf0 100644 --- a/src/pages/ideContainer/style/index.module.less +++ b/src/pages/ideContainer/style/index.module.less @@ -4,20 +4,24 @@ width: 100%; height: 100%; padding: 0; + display: flex; + flex-direction: row; .content { display: flex; - flex-direction: column; + flex-direction: row; height: 100%; background-color: var(--color-fill-2); min-width: @layout-max-width; transition: padding-left 0.2s; box-sizing: border-box; - padding-left: 200px; - + flex: 1; + position: relative; .mainContent { + flex: 1; overflow: auto; + padding: 16px; > div { flex: 1;