feat: Add base project structure with API and web components

2025-12-02 20:28:01 +08:00
parent f3de6d6cc9
commit c1adc62ec6
817 changed files with 111226 additions and 106 deletions
--- a/web/src/views/SpaceManagement/index.tsx
+++ b/web/src/views/SpaceManagement/index.tsx
@@ -0,0 +1,92 @@
+import React, { useEffect, useState, useRef } from 'react';
+import { useNavigate } from 'react-router-dom';
+import clsx from 'clsx';
+import { useTranslation } from 'react-i18next';
+import { List, Button } from 'antd';
+import type { Space, SpaceModalRef } from './types';
+import SpaceModal from './components/SpaceModal';
+import RbCard from '@/components/RbCard/Card'
+import { getWorkspaces, switchWorkspace } from '@/api/workspaces'
+import BodyWrapper from '@/components/Empty/BodyWrapper'
+import Tag from '@/components/Tag'
+
+const SpaceManagement: React.FC = () => {
+  const { t } = useTranslation();
+  const navigate = useNavigate();
+  const [loading, setLoading] = useState(false);
+  const [data, setData] = useState<Space[]>([]);
+  const spaceModalRef = useRef<SpaceModalRef>(null);
+
+  const loadMoreData = () => {
+    setLoading(true);
+    getWorkspaces()
+      .then((res) => {
+        const response = res as Space[];
+        const results = Array.isArray(response) ? response : [];
+        setData(results);
+      })
+      .catch(() => {
+        console.error('Failed to load data');
+      })
+      .finally(() => {
+        setLoading(false);
+      });
+  };
+
+  useEffect(() => {
+    loadMoreData();
+  }, []);
+  
+  const handleCreate = () => {
+    spaceModalRef.current?.handleOpen();
+  }
+
+  const handleJump = (id: string) => {
+    switchWorkspace(id)
+      .then(() => {
+        localStorage.removeItem('user')
+        navigate('/')
+      })
+  }
+  return (
+    <>
+      <Button type="primary" className="rb:mb-[16px]" onClick={handleCreate}>
+        {t('space.createSpace')}
+      </Button>
+      <BodyWrapper loading={loading} empty={data.length === 0}>
+        <List
+          grid={{ gutter: 16, column: 4 }}
+          dataSource={data}
+          renderItem={(item) => (
+            <List.Item key={item.id}>
+              <RbCard
+                avatar={<div className="rb:w-[48px] rb:h-[48px] rb:rounded-[8px] rb:mr-[12px] rb:bg-[#155eef] rb:flex rb:items-center rb:justify-center rb:text-[28px] rb:text-[#ffffff]">
+                  {item.name[0]}
+                </div>}
+                title={item.name}
+                subTitle={<Tag className="rb:mt-[4px] rb:font-regular!" color={item.storage_type === 'rag' ? 'processing' : 'warning'}>{t(`space.${item.storage_type || 'neo4j'}`)}</Tag>}
+              >
+                <div className={clsx("rb:absolute rb:top-[-1px] rb:right-[-1px] rb:p-[2px_9px] rb:text-[#FFFFFF] rb:leading-[16px] rb:text-[12px] rb:font-regular rb:rounded-[0px_12px_0px_12px]", {
+                  'rb:bg-[#369F21]': item.is_active,
+                  'rb:bg-[#A8A9AA]': !item.is_active,
+                })}>{item.is_active ? t('space.associated') : t('space.notAssociated')}</div>
+                
+                <Button type="primary" ghost block className="rb:mt-[40px]" onClick={() => handleJump(item.id)}>
+                  {t('space.enterSpace')}
+                </Button>
+              </RbCard>
+            </List.Item>
+          )}
+          className="rb:h-[calc(100vh-148px)] rb:overflow-y-auto rb:overflow-x-hidden"
+        />
+      </BodyWrapper>
+
+      <SpaceModal
+        ref={spaceModalRef}
+        refresh={loadMoreData}
+      />
+    </>
+  );
+};
+
+export default SpaceManagement;