@gientech/modual 2.2.3-fix.6 → 2.2.3-fix.8

package/src/modules/knowledgebaseDetails/KnowledgeBaseDetails.tsx

@@ -1,169 +0,0 @@
-import React, { useEffect, useMemo, useRef, useState } from 'react';
-import { DashboardContainer, defaultTheme, deepMergeTheme, type Styles } from '@mxmweb/zui';
-import type { CustomComponents } from '@mxmweb/xviewer';
-import '@mxmweb/zui/style.css';
-import styled from 'styled-components';
-
-import { KnowledgeBaseSummaryCard } from './components/KnowledgeBaseSummaryCard';
-import { KnowledgeParseModule } from './modules/KnowledgeParseModule';
-import { FaqModule } from './modules/FaqModule';
-import { UploadManagementModule } from './modules/UploadManagementModule';
-import { ConfigModule } from './modules/ConfigModule';
-import { RetrievalTestModule } from './modules/RetrievalTestModule';
-import type {
-  KnowledgeBaseDetailsModuleKey,
-  KnowledgeBaseDetailsModuleRenderProps,
-  KnowledgeBaseDetailsModulesConfig,
-} from './modules/types';
-import type { KnowledgeBaseDetailsServer } from './servers';
-
-export interface KnowledgeBaseDetailsProps {
-  /** 知识库 ID（用于知识解析等模块的数据请求） */
-  kbId?: string | number;
-  /** 外部注入的网络层 client（推荐） */
-  server?: KnowledgeBaseDetailsServer;
-  /** 业务 API baseURL（可选；若不注入 server，可用于业务层自行初始化） */
-  url?: string;
-  /** 业务 token（可选；若不注入 server，可用于业务层自行初始化） */
-  token?: string;
-  knowledgeBaseId?: string;
-  styles?: Styles;
-  CustomComponents?: CustomComponents;
-  eventsEmit?: (name: string, data: any) => void;
-  /**
-   * 模块配置入口（用于隐藏/改名）
-   *
-   * 示例：
-   * {
-   *   faq: { hidden: true },
-   *   config: { label: '参数配置' }
-   * }
-   */
-  modulesConfig?: KnowledgeBaseDetailsModulesConfig;
-}
-
-const MODULE_ORDER: KnowledgeBaseDetailsModuleKey[] = [
-  'knowledge-parse',
-  'faq',
-  'upload-management',
-  'config',
-  'retrieval-test',
-];
-
-const MODULES_REGISTRY: Record<
-  KnowledgeBaseDetailsModuleKey,
-  { label: string; Component: React.FC<KnowledgeBaseDetailsModuleRenderProps> }
-> = {
-  'knowledge-parse': { label: '知识解析', Component: KnowledgeParseModule },
-  faq: { label: 'FAQ', Component: FaqModule },
-  'upload-management': { label: '上传文件管理', Component: UploadManagementModule },
-  config: { label: '配置', Component: ConfigModule },
-  'retrieval-test': { label: '检索测试', Component: RetrievalTestModule },
-};
-
-const KnowledgeBaseDetails: React.FC<KnowledgeBaseDetailsProps> = (props) => {
-  const { styles, CustomComponents, eventsEmit, modulesConfig, server } = props;
-  const kbId = props.kbId ?? props.knowledgeBaseId;
-
-  const coreRef = useRef<any>(null);
-  const [activeTab, setActiveTab] = useState<KnowledgeBaseDetailsModuleKey>('knowledge-parse');
-  const [activeId, setActiveId] = useState('file-management');
-
-  const [appStatus] = useState<any>({
-    app: 'ready',
-    container: 'ready',
-    content: 'ready',
-  });
-
-  const mergedTheme = useMemo(() => {
-    return deepMergeTheme({ theme: defaultTheme, mode: 'light' }, styles || {});
-  }, [styles]);
-
-  const summaryTabs = useMemo(() => {
-    return MODULE_ORDER.flatMap((key) => {
-      const cfg = modulesConfig?.[key];
-      if (cfg?.hidden) return [];
-      return [{ key, label: cfg?.label || MODULES_REGISTRY[key].label }];
-    });
-  }, [modulesConfig]);
-
-  useEffect(() => {
-    if (!summaryTabs.length) return;
-    const stillVisible = summaryTabs.some((t) => t.key === activeTab);
-    if (!stillVisible) setActiveTab(summaryTabs[0].key as KnowledgeBaseDetailsModuleKey);
-  }, [activeTab, summaryTabs]);
-
-  const ActiveModule = useMemo(() => {
-    const key = summaryTabs.some((t) => t.key === activeTab)
-      ? activeTab
-      : (summaryTabs[0]?.key as KnowledgeBaseDetailsModuleKey);
-    return MODULES_REGISTRY[key]?.Component || KnowledgeParseModule;
-  }, [activeTab, summaryTabs]);
-
-  const moduleRenderProps = useMemo<KnowledgeBaseDetailsModuleRenderProps>(() => {
-    return {
-      kbId,
-      coreRef,
-      appStatus,
-      styles: mergedTheme,
-      server,
-      eventsEmit: (name, data, _innerFn) => eventsEmit?.(name, data),
-      CustomComponents,
-      // 不做 mock：业务层拉取数据后传入（可用 children 实现子级 table）
-      tableData: [],
-      activeId,
-      setActiveId,
-    };
-  }, [CustomComponents, activeId, appStatus, eventsEmit, kbId, mergedTheme, server]);
-
-  return (
-    <DashboardContainer
-      title="回归测试0126"
-      goBack={() => {}}
-      styles={mergedTheme}
-    >
-      <DetailsLayout className="knowledgebase-details-layout">
-        <KnowledgeBaseSummaryCard
-          title="回归测试0126"
-          tags="暂无标签"
-          fileCount={0}
-          size="0M"
-          activeTab={activeTab}
-          onTabChange={(tab) => setActiveTab(tab as KnowledgeBaseDetailsModuleKey)}
-          styles={mergedTheme}
-          tabs={summaryTabs}
-        />
-
-        <DetailsModuleArea className="knowledgebase-details-module-area">
-          {summaryTabs.length ? <ActiveModule {...moduleRenderProps} /> : null}
-        </DetailsModuleArea>
-      </DetailsLayout>
-    </DashboardContainer>
-  );
-};
-
-export default KnowledgeBaseDetails;
-
-const DetailsLayout = styled.div.attrs({
-  className: 'knowledgebase-details-layout',
-})`
-  width: 100%;
-  height: 100%;
-  min-height: 0;
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
-`;
-
-const DetailsModuleArea = styled.div.attrs({
-  className: 'knowledgebase-details-module-area',
-})`
-  flex: 1;
-  border: 1px solid #E5E7EB;
-  padding: 16px;
-  border-radius: 8px;
-  min-height: 0;
-  display: flex;
-  flex-direction: column;
-`;
-

package/src/modules/knowledgebaseDetails/components/KnowledgeBaseSummaryCard.tsx

@@ -1,193 +0,0 @@
-import React from 'react';
-import styled from 'styled-components';
-import { FileText } from 'lucide-react';
-import { defaultTheme, type Styles } from '@mxmweb/zui';
-
-export interface KnowledgeBaseSummaryTabItem {
-  key: string;
-  label: string;
-}
-
-// 摘要卡片组件
-export interface KnowledgeBaseSummaryCardProps {
-  title: string;
-  tags?: string;
-  fileCount?: number;
-  size?: string;
-  activeTab?: string;
-  onTabChange?: (tab: string) => void;
-  tabs: KnowledgeBaseSummaryTabItem[];
-  styles?: Styles;
-}
-
-const SummaryCardWrapper = styled.div.attrs({
-  className: 'knowledgebase-summary-card',
-})<{ theme: any }>`
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 16px 24px;
-  margin-bottom: 16px;
-  background: ${({ theme }) => theme.colors?.background || '#FFFFFF'};
-  border-radius: ${({ theme }) => theme.space?.radius || '8px'};
-  border: 1px solid ${({ theme }) => theme.colors?.border || '#E5E6EB'};
-`;
-
-const SummaryLeft = styled.div.attrs({
-  className: 'knowledgebase-summary-left',
-})`
-  display: flex;
-  align-items: center;
-  gap: 16px;
-  flex: 1;
-`;
-
-const SummaryIcon = styled.div.attrs({
-  className: 'knowledgebase-summary-icon',
-})<{ theme: any }>`
-  width: 48px;
-  height: 48px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background: linear-gradient(
-    135deg,
-    ${({ theme }) => theme.colors?.primary || '#4E6EF2'} 0%,
-    ${({ theme }) => theme.colors?.secondary || '#6D86F5'} 100%
-  );
-  border-radius: ${({ theme }) => theme.space?.radius || '8px'};
-  color: white;
-  font-size: 24px;
-`;
-
-const SummaryInfo = styled.div.attrs({
-  className: 'knowledgebase-summary-info',
-})`
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-`;
-
-const SummaryTitle = styled.div.attrs({
-  className: 'knowledgebase-summary-title',
-})<{ theme: any }>`
-  font-size: 16px;
-  font-weight: 600;
-  color: ${({ theme }) => theme.colors?.text || '#1D2129'};
-`;
-
-const SummaryMeta = styled.div.attrs({
-  className: 'knowledgebase-summary-meta',
-})<{ theme: any }>`
-  display: flex;
-  align-items: center;
-  gap: 16px;
-  font-size: 14px;
-  color: ${({ theme }) => theme.colors?.textSecondary || '#4E5969'};
-`;
-
-const SummaryLabel = styled.span.attrs({
-  className: 'knowledgebase-summary-label',
-})<{ theme: any }>`
-  color: ${({ theme }) => theme.colors?.textTertiary || '#86909C'};
-`;
-
-const SummaryTabs = styled.div.attrs({
-  className: 'knowledgebase-summary-tabs',
-})`
-  display: flex;
-  align-items: center;
-  gap: 24px;
-  margin-bottom:-39px
-`;
-
-const TabItem = styled.button.attrs({
-  className: 'knowledgebase-summary-tab',
-})<{ $isActive: boolean; theme: any }>`
-  position: relative;
-  padding: 8px 0;
-  padding-bottom:15px;
-  background: transparent;
-  border: none;
-  cursor: pointer;
-  font-size: 16px;
-  font-weight: ${({ $isActive }) => ($isActive ? '500' : '400')};
-  color: ${({ $isActive, theme }) =>
-    $isActive ? theme.colors?.primary || '#4E6EF2' : theme.colors?.textSecondary || '#4E5969'};
-  transition: color 0.2s ease;
-
-  &:hover {
-    color: ${({ theme }) => theme.colors?.primary || '#4E6EF2'};
-  }
-
-  &::after {
-    content: '';
-    position: absolute;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    height: 3px;
-    background: linear-gradient(
-      90deg,
-      ${({ theme }) => theme.colors?.primary || '#4E6EF2'} 0%,
-      ${({ theme }) => theme.colors?.secondary || '#6D86F5'} 100%
-    );
-    border-radius: 1px;
-    transform: ${({ $isActive }) => ($isActive ? 'scaleX(1)' : 'scaleX(0)')};
-    transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
-  }
-`;
-
-export const KnowledgeBaseSummaryCard: React.FC<KnowledgeBaseSummaryCardProps> = ({
-  title,
-  tags = '暂无标签',
-  fileCount = 0,
-  size = '0M',
-  activeTab,
-  onTabChange,
-  styles,
-  tabs,
-}) => {
-  const theme = styles?.theme || defaultTheme;
-  const finalActiveTab = activeTab || tabs?.[0]?.key;
-
-  return (
-    <SummaryCardWrapper theme={theme}>
-      <SummaryLeft>
-        <SummaryIcon theme={theme}>
-          <FileText size={24} />
-        </SummaryIcon>
-        <SummaryInfo>
-          <SummaryTitle theme={theme}>{title}</SummaryTitle>
-          <SummaryMeta theme={theme}>
-            <span>
-              <SummaryLabel theme={theme}>标签：</SummaryLabel>
-              {tags}
-            </span>
-            <span>
-              <SummaryLabel theme={theme}>文件数：</SummaryLabel>
-              {fileCount}
-            </span>
-            <span>
-              <SummaryLabel theme={theme}>大小：</SummaryLabel>
-              {size}
-            </span>
-          </SummaryMeta>
-        </SummaryInfo>
-      </SummaryLeft>
-      <SummaryTabs>
-        {tabs.map((tab) => (
-          <TabItem
-            key={tab.key}
-            $isActive={finalActiveTab === tab.key}
-            theme={theme}
-            onClick={() => onTabChange?.(tab.key)}
-          >
-            {tab.label}
-          </TabItem>
-        ))}
-      </SummaryTabs>
-    </SummaryCardWrapper>
-  );
-};
-