feat(ideContainer): 添加组件测试页面并优化组件渲染逻辑

- 引入 ComponentTest 组件并移除原有占位实现
- 新增获取项目组件数据逻辑并更新至 Redux
- 调整组件渲染条件以匹配选中状态
- 优化容器样式以确保正确布局显示
- 同步加载应用列表与项目组件数据

src/pages/ideContainer/index.tsx

@@ -6,9 +6,10 @@ import LogBar from './logBar';
 import RightSideBar from './rightSideBar';
 import NavBar, { NavBarRef } from './navBar';
 import { Selected } from '@/pages/ideContainer/types';
-import { updateInfo } from '@/store/ideContainer';
+import { updateInfo, updateProjectComponentData } from '@/store/ideContainer';
 import { useDispatch, useSelector } from 'react-redux';
 import { getAppListBySceneId } from '@/api/apps';
+import { getProjectComp } from '@/api/scene';
 
 import ProjectContainer from '@/pages/orchestration/project';
 import ApplicationContainer from '@/pages/orchestration/application';
@@ -18,6 +19,8 @@ import AppCompComponent from '@/pages/orchestration/appCompComponent';
 import ComponentList from '@/pages/componentDevelopment/componentList';
 import ComponentCoding from '@/pages/componentDevelopment/componentCoding';
 import ComponentDeployment from '@/pages/componentDevelopment/componentDeployment';
+import ComponentTest from '@/pages/componentDevelopment/componentTest';
+
 
 type UrlParamsOptions = {
   identity?: string;
@@ -29,7 +32,6 @@ const AppInstanceComponent = () => <div style={{ height: '100%', width: '100%' }
 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 ComponentTest = () => <div style={{ height: '100%', width: '100%' }}>组件测试</div>;
 const EnvConfig = () => <div style={{ height: '100%', width: '100%' }}>环境配置</div>;
 
 // 所有可显示的组件路径列表
@@ -59,6 +61,11 @@ function IDEContainer() {
     if (res.code === 200) setSubMenuData({ 'appList': res.data.list.reverse() });
   };
 
+  const getProjectCompData = async () => {
+    const res: any = await getProjectComp(urlParams.id);
+    if (res.code === 200) dispatch(updateProjectComponentData({ [urlParams.id]: res.data }));
+  };
+
   useEffect(() => {
     setUrlParams(getUrlParams(window.location.href) as UrlParamsOptions);
     dispatch(updateInfo(getUrlParams(window.location.href) as UrlParamsOptions));
@@ -66,7 +73,10 @@ function IDEContainer() {
   }, []);
 
   useEffect(() => {
-    if (urlParams.id) getAppList();
+    if (urlParams.id) {
+      getProjectCompData();
+      getAppList();
+    }
   }, [urlParams.id]);
 
   // 当selected.path变化时，添加到已打开的tab集合中
@@ -79,15 +89,15 @@ function IDEContainer() {
   // 根据选中的菜单项渲染对应组件
   const renderContent = () => {
     return (
-      <div style={{ height: '100%', position: 'relative' }}>
+      <div style={{ height: '100%', width: '100%', position: 'relative', boxSizing: 'border-box' }}>
         {ALL_PATHS.map((path, i) => {
           // 检查该路径的组件是否已打开
-          const isOpened = openedTabs.has(path);
+          const isOpened = openedTabs.has(selected.key);
           // 检查是否是当前选中的路径
           const isSelected = selected.path === path;
 
-          // 只有已打开的组件才渲染，通过CSS控制显示/隐藏
-          return isOpened ? (
+          // 只有已打开且已经选中的组件才渲染，通过CSS控制显示/隐藏
+          return isOpened && isSelected ? (
             <div
               key={`${selected.key}-${i}`}
               style={{