@gientech/modual 2.0.5 → 2.0.6

package/src/utils/gientechCommon/hooks/useFileDisplayTools.tsx

@@ -1,204 +0,0 @@
-import React, { useState, useMemo } from 'react';
-import { Popover, Badge } from 'antd';
-import { FileText } from 'lucide-react';
-import { Icon } from '@mxmweb/zui';
-
-interface UseFileDisplayToolsOptions {
-  fileManagerData: { uploadedFiles: any[] };
-  styles?: any;
-  eventsEmit: (eventName: string, data: any) => void;
-}
-
-/**
- * 文件展示工具 Hook
- * 用于在 chatHeader.tools 中展示已上传的文件
- * 右上角显示一个文件图标 + 文件数量徽章，点击后弹出文件列表
- */
-export function useFileDisplayTools({
-  fileManagerData,
-  styles,
-  eventsEmit,
-}: UseFileDisplayToolsOptions) {
-  const [fileListPopoverOpen, setFileListPopoverOpen] = useState(false);
-
-  const FileDisplayTools = useMemo(() => {
-    const fileCount = fileManagerData.uploadedFiles?.length || 0;
-
-    // 如果没有文件，不显示
-    if (fileCount === 0) {
-      return null;
-    }
-
-    // 格式化文件大小
-    const formatSize = (size?: number) => {
-      if (!size) return '';
-      if (size < 1024) return `${size}B`;
-      if (size < 1024 * 1024) return `${(size / 1024).toFixed(0)}KB`;
-      return `${(size / 1024 / 1024).toFixed(1)}MB`;
-    };
-
-    // 获取文件类型大写显示（如 DOC, PDF, PNG）
-    const getFileTypeDisplay = (fileName: string) => {
-      const ext = fileName.split('.').pop()?.toUpperCase() || '';
-      if (ext === 'DOCX' || ext === 'DOC') return 'DOC';
-      if (ext === 'XLSX' || ext === 'XLS') return 'XLS';
-      if (ext === 'PPTX' || ext === 'PPT') return 'PPT';
-      if (ext === 'JPG' || ext === 'JPEG') return 'JPG';
-      return ext;
-    };
-
-    // 获取 zui-icon 文件类型图标
-    const getZuiFileIcon = (fileName: string) => {
-      const ext = fileName.split('.').pop()?.toLowerCase() || '';
-      switch (ext) {
-        case 'docx':
-        case 'doc':
-          return <Icon type='rag/word' size={18} />;
-        case 'jpg':
-        case 'jpeg':
-        case 'png':
-        case 'gif':
-        case 'bmp':
-        case 'webp':
-        case 'svg':
-        case 'ico':
-          return <Icon type='rag/pic' size={18} />;
-        case 'pptx':
-        case 'ppt':
-          return <Icon type='rag/ppt' size={18} />;
-        case 'xls':
-        case 'xlsx':
-        case 'xlsm':
-        case 'xlsb':
-        case 'xltx':
-        case 'xltm':
-        case 'xlt':
-        case 'xlam':
-        case 'csv':
-          return <Icon type='rag/excel' size={18} />;
-        case 'pdf':
-          return <Icon type='rag/pdf' size={18} />;
-        case 'txt':
-          return <Icon type='rag/txt' size={18} />;
-        case 'md':
-          return <Icon type='rag/document' size={18} />;
-        case 'json':
-          return <Icon type='rag/json' size={18} />;
-        case 'html':
-        case 'htm':
-          return <Icon type='rag/url' size={18} />;
-        default:
-          return <Icon type='rag/file' size={18} />;
-      }
-    };
-
-    // 文件列表弹出内容 - 完全按照设计图的列表样式
-    const fileListContent = (
-      <div
-        className="bg-white rounded-lg"
-        style={{
-          width: '360px',
-          maxHeight: '400px',
-          overflowY: 'auto',
-          padding: '16px',
-        }}
-      >
-        {/* 标题 */}
-        <div
-          className="text-sm font-semibold mb-4"
-          style={{
-            color: '#333',
-            fontWeight: 600,
-          }}
-        >
-          当前问答上传文件
-        </div>
-
-        {/* 文件列表 - 垂直排列 */}
-        <div className="flex flex-col gap-3">
-          {fileManagerData.uploadedFiles.map((file: any, idx: number) => {
-            const fileName = file.name || file.file?.name || '';
-            const fileSize = file.file?.size || file.size || 0;
-            const fileIcon = getZuiFileIcon(fileName);
-            const fileTypeDisplay = getFileTypeDisplay(fileName);
-
-            return (
-              <div
-                key={file.uid || idx}
-                className="flex items-start gap-3 cursor-pointer hover:bg-gray-50 rounded transition-colors"
-                style={{
-                  padding: '8px',
-                }}
-                onClick={() => {
-                  // 先关闭 Popover，避免与预览 Drawer 重叠
-                  setFileListPopoverOpen(false);
-                  // 点击文件项时，发送事件并返回文件数据
-                  eventsEmit('uploaded_file:item_click', {
-                    file,
-                    index: idx,
-                  });
-                }}
-              >
-                {/* 文件图标 */}
-                <div className="shrink-0 mt-0.5">
-                  {fileIcon}
-                </div>
-
-                {/* 文件信息 */}
-                <div className="flex-1 min-w-0">
-                  {/* 文件名 - 深灰色，过长时截断 */}
-                  <div
-                    className="text-sm font-medium truncate"
-                    style={{
-                      color: '#333',
-                      marginBottom: '4px',
-                    }}
-                    title={fileName}
-                  >
-                    {fileName}
-                  </div>
-
-                  {/* 文件类型和大小 - 浅灰色小字 */}
-                  <div
-                    className="text-xs"
-                    style={{
-                      color: '#999',
-                    }}
-                  >
-                    {fileTypeDisplay} {formatSize(fileSize)}
-                  </div>
-                </div>
-              </div>
-            );
-          })}
-        </div>
-      </div>
-    );
-
-    return (
-      <Popover
-        content={fileListContent}
-        trigger="click"
-        placement="bottomRight"
-        overlayClassName="file-list-popover"
-        open={fileListPopoverOpen}
-        onOpenChange={setFileListPopoverOpen}
-      >
-        <div className="flex items-center cursor-pointer hover:opacity-80 transition-opacity">
-          <Badge count={fileCount} size="small" offset={[-4, 4]}>
-            <FileText
-              size={20}
-              className="text-gray-600"
-              style={{ color: styles?.theme?.colors?.text || '#666' }}
-            />
-          </Badge>
-        </div>
-      </Popover>
-    );
-  }, [fileManagerData.uploadedFiles, styles, eventsEmit, fileListPopoverOpen]);
-
-  return {
-    FileDisplayTools,
-    setFileListPopoverOpen,
-  };
-}

package/src/utils/gientechCommon/hooks/useFileManager.ts

@@ -1,193 +0,0 @@
-import { useState, useEffect, useRef, useCallback } from 'react';
-import axios from 'axios';
-import { message } from 'antd';
-import { normalizeFileItem, mergeFiles, normalizeUploadedFiles } from '../utils/fileUtils';
-import { removeFilefromTempUpload } from '../utils/serverFn';
-import { getFileTypeByName } from '../../../utils/commonFn';
-import { maxPollCount, maxPollInterval } from '../configs/commonConfig';
-
-interface UseFileManagerOptions {
-  url: string;
-  token: string;
-  CSRFToken?: string;
-  activeSessionId?: string;
-  chatData: any[];
-  onError?: (error: any) => void;
-}
-
-interface PollCallbacks {
-  onStatusUpdate: (serverStatuses: any[]) => void;
-  onComplete: () => void;
-  onFail: (errorMsg: string) => void;
-}
-
-/**
- * 文件管理 Hook
- * 统一管理文件上传、解析、删除等逻辑
- * 用于 chat 和 headlessChat 模块
- */
-export function useFileManager({
-  url,
-  token,
-  CSRFToken,
-  activeSessionId,
-  chatData,
-  onError,
-}: UseFileManagerOptions) {
-  const [fileStatuses, setFileStatuses] = useState<any[]>([]);
-  const [fileManagerData, setFileManagerData] = useState<{ uploadedFiles: any[] }>(() => {
-    return { uploadedFiles: [] };
-  });
-  const stoppedRef = useRef(false);
-
-  /**
-   * 从 AI 消息的 reference 字段同步文件到 fileManagerData
-   * 当 AI 消息的 resultType === 5 且 reference 字段存在时，解析文件列表
-   */
-  useEffect(() => {
-    if (!activeSessionId) return;
-    const conv = chatData.find((c: any) => c.id === activeSessionId);
-    let uploaded: any[] = [];
-    let hasReference = false;
-    if (conv && conv.messages) {
-      const lastAiMsg = [...(conv.messages || [])]
-        .reverse()
-        .find((msg: any) => msg.istype === 'ai');
-      if (lastAiMsg?.reference && lastAiMsg.resultType === 5) {
-        hasReference = true;
-        try {
-          const fileList = JSON.parse(lastAiMsg.reference);
-          uploaded = fileList.map((f: any) => normalizeFileItem(f));
-        } catch (e) {
-          console.error('解析 reference 字段失败:', e);
-        }
-      }
-    }
-    if (hasReference) {
-      setFileManagerData({ uploadedFiles: uploaded });
-    }
-    // 否则不动，保持原有 uploadedFiles
-  }, [chatData, activeSessionId]);
-
-  /**
-   * 切换会话时清空文件列表
-   */
-  useEffect(() => {
-    setFileManagerData({ uploadedFiles: [] });
-  }, [activeSessionId]);
-
-  /**
-   * 轮询文件解析状态
-   * @param uids - 文件UID列表
-   * @param callbacks - 回调函数集合
-   * @returns 停止轮询的函数
-   */
-  const pollFileStatus = useCallback(
-    (uids: string[], callbacks: PollCallbacks) => {
-      const uidsString = uids.join(',');
-      let pollCount = 0;
-      let stopPoll: (() => void) | null = null;
-
-      stopPoll = () => {
-        stoppedRef.current = true;
-      };
-
-      const checkStatus = async () => {
-        if (stoppedRef.current) return;
-        if (pollCount >= maxPollCount) {
-          if (!stoppedRef.current) callbacks.onFail('文件解析超时，请稍后重试');
-          return;
-        }
-        pollCount++;
-        try {
-          const res = await axios.get(
-            `${url}/index/knowledgeBase/file/getFileStatusByUids?uids=${uidsString}`,
-            {
-              headers: { Authorization: token },
-            }
-          );
-          if (stoppedRef.current) return;
-          if (res.data.success) {
-            const statuses = res.data.data;
-            if (!stoppedRef.current) callbacks.onStatusUpdate(statuses);
-            const allDone = statuses.every((file: any) => file.status === 3);
-            if (allDone) {
-              if (!stoppedRef.current) callbacks.onComplete();
-            } else {
-              if (!stoppedRef.current) setTimeout(checkStatus, maxPollInterval);
-            }
-          } else {
-            if (!stoppedRef.current) callbacks.onFail(res.data.errorMsg || '查询文件状态失败');
-          }
-        } catch (error) {
-          onError?.(error);
-          if (stoppedRef.current) return;
-          callbacks.onFail('查询文件状态时发生网络错误');
-        }
-      };
-      checkStatus();
-
-      return stopPoll;
-    },
-    [url, token, onError]
-  );
-
-  /**
-   * 处理从临时知识库删除文件
-   * @param uid - 文件UID
-   * @param queryId - 查询ID（可选）
-   */
-  const handleRemoveFromTemp = useCallback(
-    async (uid: string, queryId?: string) => {
-      if (!uid) {
-        console.warn('[DEBUG] 缺少uid，无法删除临时文件');
-        return;
-      }
-
-      removeFilefromTempUpload(
-        { url, token, CSRFToken },
-        { uid, queryId },
-        (success, res) => {
-          if (success) {
-            message.success('文件已从临时知识库移除');
-            // 用后端返回的新data数组（新文件列表）更新本地uploadedFiles
-            if (res && Array.isArray(res.data?.data)) {
-              const uploaded = normalizeUploadedFiles(res.data.data, getFileTypeByName);
-              setFileManagerData({ uploadedFiles: uploaded });
-            }
-          } else {
-            console.log('[DEBUG] removeFilefromTempUpload 回调 false，res:', res);
-            message.error('文件移除失败');
-          }
-        }
-      );
-    },
-    [url, token, CSRFToken]
-  );
-
-  /**
-   * 重置停止标志（用于开始新的上传流程）
-   */
-  const resetStopFlag = useCallback(() => {
-    stoppedRef.current = false;
-  }, []);
-
-  /**
-   * 设置停止标志（用于停止当前上传/解析流程）
-   */
-  const setStopFlag = useCallback(() => {
-    stoppedRef.current = true;
-  }, []);
-
-  return {
-    fileManagerData,
-    fileStatuses,
-    setFileManagerData,
-    setFileStatuses,
-    pollFileStatus,
-    handleRemoveFromTemp,
-    resetStopFlag,
-    setStopFlag,
-    stoppedRef,
-  };
-}