From 473ffc6d42f1d8726552ed57f2cf2c6181a0e543 Mon Sep 17 00:00:00 2001
From: ZLY <zhongliangyuan@gdngsk.com>
Date: Wed, 12 Nov 2025 11:36:58 +0800
Subject: [PATCH] =?UTF-8?q?feat(component):=20=E6=B7=BB=E5=8A=A0=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6=E5=9F=BA=E6=9C=AC=E4=BF=A1=E6=81=AF=E8=8E=B7=E5=8F=96?=
 =?UTF-8?q?=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 新增获取组件基本信息的API接口
- 在组件开发页面集成基础信息展示
- 添加当前组件信息的状态管理
- 实现组件加载时自动获取基础信息
- 完善相关类型定义和错误处理
- 更新组件编码页面的状态注释说明
---
 src/api/componentDevelopProcess.ts             |  5 +++++
 .../componentCoding/index.tsx                  | 18 ++++++++++++++----
 2 files changed, 19 insertions(+), 4 deletions(-)

diff --git a/src/api/componentDevelopProcess.ts b/src/api/componentDevelopProcess.ts
index 9b888ac..ea5eca5 100644
--- a/src/api/componentDevelopProcess.ts
+++ b/src/api/componentDevelopProcess.ts
@@ -11,4 +11,9 @@ export function getComponentDesign(componentBaseId) {
 // 更新组件设计
 export function updateComponentDesign(params) {
   return axios.post(`${urlPrefix}/componentDevelopProcess/design`, params);
+}
+
+// 获取组件基本信息
+export function getComponentBaseInfo(componentBaseId) {
+  return axios.get(`${urlPrefix}/componentDevelopProcess/baseInfo?componentBaseId=${componentBaseId}`);
 }
\ No newline at end of file
diff --git a/src/pages/componentDevelopment/componentCoding/index.tsx b/src/pages/componentDevelopment/componentCoding/index.tsx
index 63bcc68..2aa73b6 100644
--- a/src/pages/componentDevelopment/componentCoding/index.tsx
+++ b/src/pages/componentDevelopment/componentCoding/index.tsx
@@ -5,14 +5,16 @@ import { IconFullscreen, IconFullscreenExit } from '@arco-design/web-react/icon'
 import { useSelector, useDispatch } from 'react-redux';
 import { getMyComponentList } from '@/api/componentBase';
 import { updateComponentCodingPath } from '@/store/ideContainer';
+import { getComponentBaseInfo } from '@/api/componentDevelopProcess';
 
 const Option = Select.Option;
 
 const ComponentCoding = () => {
-  const [serverUrl, setServerUrl] = useState('');
-  const [optionsList, setOptionsList] = useState([]);
-  const [originList, setOriginList] = useState([]);
-  const [isFullscreen, setIsFullscreen] = useState(false);
+  const [serverUrl, setServerUrl] = useState(''); // code-server 地址
+  const [optionsList, setOptionsList] = useState([]); // 下拉选择菜单
+  const [originList, setOriginList] = useState([]); // 原始数据-组件列表
+  const [currentComponent, setCurrentComponent] = useState({}); // 当前组件信息
+  const [isFullscreen, setIsFullscreen] = useState(false); // 全屏状态
   const iframeRef = useRef(null);
   const { componentCoding } = useSelector((state: any) => state.ideContainer);
   const dispatch = useDispatch();
@@ -30,11 +32,19 @@ const ComponentCoding = () => {
     }
   };
 
+  const getComponentInfo = async () => {
+    const res: any = await getComponentBaseInfo(componentCoding.id);
+    if (res.code === 200) {
+      setCurrentComponent(res.data);
+    }
+  };
+
   useEffect(() => {
     getOptionsList();
   }, []);
 
   useEffect(() => {
+    getComponentInfo();
     const uri = process.env.NEXT_PUBLIC_DEV_CODE_SERVER_HOST;
     const codeServerFolderPre = '/app/data';