From 66bf0e57f479978b4ce58866217d1e3dbcdedf8f Mon Sep 17 00:00:00 2001
From: ZLY <zhongliangyuan@gdngsk.com>
Date: Fri, 26 Sep 2025 09:42:28 +0800
Subject: [PATCH] =?UTF-8?q?feat(componentLibrary):=20=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E5=BA=93=E4=BF=A1=E6=81=AF=E4=BB=8E=E7=99=BB=E5=BD=95=E5=90=8E?=
 =?UTF-8?q?=E8=8E=B7=E5=8F=96=E7=9A=84=E7=BB=84=E4=BB=B6=E5=88=97=E8=A1=A8?=
 =?UTF-8?q?=E4=B8=AD=E8=8E=B7=E5=8F=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 从sessionStorage获取对应用户的组件库列表
---
 src/pages/componentLibrary/collapseBox.tsx | 12 +++---------
 src/pages/componentLibrary/compNode.tsx    |  8 ++++----
 src/pages/componentLibrary/index.tsx       | 14 ++++++++------
 3 files changed, 15 insertions(+), 19 deletions(-)

diff --git a/src/pages/componentLibrary/collapseBox.tsx b/src/pages/componentLibrary/collapseBox.tsx
index bf869b3..d428c02 100644
--- a/src/pages/componentLibrary/collapseBox.tsx
+++ b/src/pages/componentLibrary/collapseBox.tsx
@@ -9,20 +9,14 @@ const Col = Grid.Col;
 
 interface CollapseBoxProps {
   componentType: string;
+  data: any;
 }
 
-const CollapseBox: React.FC<CollapseBoxProps> = ({ componentType }) => {
-  const [collapseData, setCollapseData] = useState([]);
-
-  useEffect(() => {
-    const data = getLocalStorageData('componentsData')[`${componentType}`];
-    setCollapseData(data);
-  }, [componentType]);
-
+const CollapseBox: React.FC<CollapseBoxProps> = ({ componentType, data }) => {
   return (
     <>
       <Collapse>
-        {collapseData.map((v, i) => {
+        {data.map((v, i) => {
           return (
             <CollapseItem
               key={i}
diff --git a/src/pages/componentLibrary/compNode.tsx b/src/pages/componentLibrary/compNode.tsx
index 1582e23..ffbaded 100644
--- a/src/pages/componentLibrary/compNode.tsx
+++ b/src/pages/componentLibrary/compNode.tsx
@@ -27,7 +27,7 @@ const CompNode: React.FC<CompNodeProps> = ({ nodeData }) => {
           {/*节点api相关的输入输出*/}
           <div className={styles['comp-node-api']}>
             <div className={styles['api-in']}>
-              {nodeData.apis.map((v, i) => {
+              {nodeData.def?.apis.map((v, i) => {
                 return (
                   <div key={i} className={styles['flex-box']}>
                     <div className={styles['right-arrow']}></div>
@@ -38,7 +38,7 @@ const CompNode: React.FC<CompNodeProps> = ({ nodeData }) => {
             </div>
             <div className={styles['api-out']}>
               <div className={styles['flex-box']}>
-                <div style={{ marginRight: 5 }}>{nodeData.apiOut.id}</div>
+                <div style={{ marginRight: 5 }}>{nodeData.def?.apiOut.id}</div>
                 <div className={styles['right-arrow']}></div>
               </div>
             </div>
@@ -47,7 +47,7 @@ const CompNode: React.FC<CompNodeProps> = ({ nodeData }) => {
           {/*节点data相关的输入输出*/}
           <div className={styles['comp-node-data']}>
             <div className={styles['data-in']}>
-              {nodeData.dataIns.map((v, i) => {
+              {nodeData.def?.dataIns.map((v, i) => {
                 return (
                   <div key={i} className={styles['flex-box']}>
                     <div className={styles['rectangular']}></div>
@@ -57,7 +57,7 @@ const CompNode: React.FC<CompNodeProps> = ({ nodeData }) => {
               })}
             </div>
             <div className={styles['data-out']}>
-              {nodeData.dataOuts.map((v, i) => {
+              {nodeData.def?.dataOuts.map((v, i) => {
                 return (
                   <div key={i} className={styles['flex-box']}>
                     <div style={{ marginRight: 5 }}>{v.id} {formatDataType(v.dataType)}</div>
diff --git a/src/pages/componentLibrary/index.tsx b/src/pages/componentLibrary/index.tsx
index a3dacb3..19841c8 100644
--- a/src/pages/componentLibrary/index.tsx
+++ b/src/pages/componentLibrary/index.tsx
@@ -8,6 +8,8 @@ const InputSearch = Input.Search;
 const TabPane = Tabs.TabPane;
 
 function ComponentLibrary() {
+  const userInfo = JSON.parse(sessionStorage.getItem('userInfo') || '{}');
+  const componentData = JSON.parse(sessionStorage.getItem(`compLibs${userInfo.userId}`));
   return (
     <>
       <div className={styles['comp-library-container']}>
@@ -26,12 +28,12 @@ function ComponentLibrary() {
                 <span>
                   <span>我的组件</span>
                   <Tag color="arcoblue">
-                    216
+                    {componentData.myLibs.length}
                   </Tag>
                 </span>
               }
             >
-              <CollapseBox componentType="myLibs" />
+              <CollapseBox componentType="myLibs" data={componentData.myLibs} />
             </TabPane>
             <TabPane
               key="2"
@@ -39,11 +41,11 @@ function ComponentLibrary() {
                 <span>
                   <span>公开组件</span>
                   <Tag color="arcoblue">
-                    31
+                    {componentData.pubLibs.length}
                   </Tag>
                 </span>
               }>
-              <CollapseBox componentType="pubLibs" />
+              <CollapseBox componentType="pubLibs" data={componentData.pubLibs} />
             </TabPane>
             <TabPane
               key="3"
@@ -51,12 +53,12 @@ function ComponentLibrary() {
                 <span>
                   <span>协同组件</span>
                   <Tag color="arcoblue">
-                    0
+                    {componentData.teamLibs.length}
                   </Tag>
                 </span>
               }
             >
-              <CollapseBox componentType="teamLibs" />
+              <CollapseBox componentType="teamLibs" data={componentData.teamLibs} />
             </TabPane>
           </Tabs>
         </CustomCard>