@mxmweb/aichat 1.1.8 → 1.2.0

package/src/adopters/gientechCommon/components/FileManager/index.tsx

@@ -1,381 +0,0 @@
-import { Modal,  Button,  Upload, Popconfirm } from "antd";
-import { FileText,  FileImage, FileSpreadsheet, File, Plus, X } from 'lucide-react';
-import { useEffect, useState } from "react";
-import './style.css';
-import { AiChatStyles } from "../../../../components/defaultStyleSet";
-import ReferenceCard from '../Messages/ReferenceCard';
-import type { ThemeColors } from '../../../../components/defaultStyleSet';
-import FileCardCommon from '../../../../components/common/FileCardCommon';
-
-// 文件类型icon获取函数，优先用用户传入styles.theme.icons
-export function getFileTypeIcon(type: string, styles?: any) {
-  const icons = styles?.theme?.icons || {};
-  //console.log('type``````````', type,icons)
-  switch (type.toLowerCase()) {
-    case 'docx':
-    case 'doc':
-      return icons.docx ? (
-        <img src={icons.docx} alt="docx" style={{ width: 20, height: 20 }} />
-      ) : (
-        <FileText className="w-5 h-5 text-blue-400" />
-      );
-    case 'image':
-    case 'jpg':
-    case 'jpeg':
-    case 'png':
-    case 'gif':
-    case 'bmp':
-    case 'webp':
-    case 'svg':
-    case 'ico':
-      return icons.image ? (
-        <img src={icons.image} alt="image" style={{ width: 20, height: 20 }} />
-      ) : (
-        <FileImage className="w-5 h-5 text-blue-400" />
-      );
-    case 'pptx':
-    case 'ppt':
-      return icons.pptx ? (
-        <img src={icons.pptx} alt="pptx" style={{ width: 20, height: 20 }} />
-      ) : (
-        <File className="w-5 h-5 text-orange-400" />
-      );
-    case 'sheets':
-    case 'excel':
-    case 'xls':
-    case 'csv':
-    case 'xlsx':
-    case 'xlsm':
-    case 'xlsb':
-    case 'xltx':
-    case 'xltm':
-    case 'xlt':
-    case 'xlam':
-      return icons.sheets ? (
-        <img src={icons.sheets} alt="sheets" style={{ width: 20, height: 20 }} />
-      ) : (
-        <FileSpreadsheet className="w-5 h-5 text-green-400" />
-      );
-    case 'pdf':
-      return icons.pdf ? (
-        <img src={icons.pdf} alt="pdf" style={{ width: 20, height: 20 }} />
-      ) : (
-        <FileText className="w-5 h-5 text-red-400" />
-      );
-    case 'txt':
-      return icons.txt ? (
-        <img src={icons.txt} alt="txt" style={{ width: 20, height: 20 }} />
-      ) : (
-        <FileText className="w-5 h-5 text-gray-400" />
-      );
-    case 'md':
-      return icons.md ? (
-        <img src={icons.md} alt="txt" style={{ width: 20, height: 20 }} />
-      ) : (
-        <FileText className="w-5 h-5 text-gray-400" />
-      );
-    case 'json':
-      return icons.json ? (
-        <img src={icons.json} alt="json" style={{ width: 20, height: 20 }} />
-      ) : (
-        <FileText className="w-5 h-5 text-gray-400" />
-      );
-    case 'html':
-    case 'htm':
-      return icons.html ? (
-        <img src={icons.html} alt="html" style={{ width: 20, height: 20 }} />
-      ) : (
-        <FileText className="w-5 h-5 text-gray-400" />
-      );
-    case 'xml':
-    default:
-      return <File className="w-5 h-5 text-gray-400" />;
-  }
-}
-interface FileItem {
-  file: File;
-  preview?: string;
-  type: string;
-  status?: 'pending' | 'uploading' | 'uploaded' | 'error';
-  url?: string;
-  error?: string;
-}
-
-// Mock数据
-const mockFiles: FileItem[] = [
-  {
-    file: {
-      name: '产品需求文档.pdf',
-      size: 1024 * 1024 * 2.5, // 2.5MB
-      type: 'application/pdf',
-    } as File,
-    type: 'pdf',
-    status: 'uploaded',
-    url: 'https://example.com/file1.pdf',
-  },
-  {
-    file: {
-      name: '数据分析报告.xlsx',
-      size: 1024 * 1024 * 1.2, // 1.2MB
-      type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
-    } as File,
-    type: 'excel',
-    status: 'uploaded',
-    url: 'https://example.com/file3.xlsx',
-  },
-  {
-    file: {
-      name: '系统架构图.png',
-      size: 1024 * 512, // 512KB
-      type: 'image/png',
-    } as File,
-    type: 'image',
-    status: 'uploaded',
-    url: 'https://example.com/file2.png',
-  },
-];
-
-const formatFileSize = (bytes: number) => {
-  if (bytes < 1024) return bytes + ' B';
-  if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(1) + ' KB';
-  return (bytes / (1024 * 1024)).toFixed(1) + ' MB';
-};
-
-export default function FileManager({
-  open,
-  onCancel,
-  files = mockFiles,
-  currentFiles = [],
-  onUpload,
-  onRemoveFile,
-  styles,
-  eventsEmit
-}: {
-  open: boolean;
-  onCancel: () => void;
-  files: FileItem[];
-  styles: AiChatStyles;
-  currentFiles: FileItem[];
-  onUpload?: (files: FileList) => void;
-  onRemoveFile?: (file: FileItem, idx: number, type: 'uploaded' | 'pending') => void;
-  eventsEmit?: (eventName: string, payload?: any) => void;
-}) {
-  // 状态映射
-  const statusMap = {
-    pending: '待上传',
-    uploading: '上传中',
-    uploaded: '已上传',
-    analyzing: '解析中',
-    analyze_failed: '解析失败',
-    error: '失败',
-  };
-
-  // 选中状态
-  const [selectedFiles, setSelectedFiles] = useState<number[]>([]);
-
-  const handleSelect = (idx: number) => {
-    setSelectedFiles(prev => prev.includes(idx) ? prev.filter(i => i !== idx) : [...prev, idx]);
-  };
-
-  // 已上传文件删除事件抛出
-  const handleRemove = (file: FileItem, idx: number) => {
-    eventsEmit && eventsEmit('uploaded_file:removeFromTemp', { file, idx });
-  };
-
-
-  // 主题色，提前定义，避免未初始化访问
-  const themeColors: ThemeColors = (styles && styles.theme && styles.theme.colors) ? styles.theme.colors : {
-    primary: '#007bff',
-    secondary: '#6c757d',
-    success: '#008000',
-    warning: '#FFA500',
-    error: '#FF0000',
-    info: '#0000FF',
-    background: '#f8f9fa',
-    text: '#343a40',
-    border: '#dee2e6',
-    disabled: '#808080',
-    disabledBackground: '#F5F5F5',
-    disabledText: '#808080',
-    shadow: '#000000',
-    appBackground: 'transparent',
-  };
-
-  // 拆分文件
-  const uploadedFileCards = files.map((f, idx) => (
-    <div key={f.file.name + idx} className="relative flex flex-col gap-2.5 items-center justify-center">
-      <div className="absolute right-1 top-1 z-10">
-        <Popconfirm
-          title="确认从临时对话知识库移除该文件？"
-          onConfirm={() => handleRemove(f, idx)}
-          okText="确认"
-          cancelText="取消"
-        >
-          <button
-            className="bg-white cursor-pointer rounded-full p-0.5"
-            style={{
-              lineHeight: 0,
-              color: themeColors && themeColors.text ? themeColors.text : '#FF0000',
-              transition: 'background 0.2s, color 0.2s',
-            }}
-            onMouseOver={e => {
-              (e.currentTarget as HTMLElement).style.color = themeColors && themeColors.error ? themeColors.error : '#FF0000';
-            }}
-            onMouseOut={e => {
-              (e.currentTarget as HTMLElement).style.color = themeColors.text;
-            }}
-            title="移除"
-          >
-            <X className="w-3 h-3" />
-          </button>
-        </Popconfirm>
-      </div>
-      <ReferenceCard
-        file_type={f.type}
-        file_name={f.file.name}
-        url={f.url}
-        retrieve_tags={[]}
-        styles={styles}
-        isUploadFile={true}
-        eventsEmit={eventsEmit}
-      />
-    </div>
-  ));
-  const pendingFileCards = currentFiles.map((f, idx) => {
-    const fileType = f.file.name.split('.').pop() || '';
-    const icon = getFileTypeIcon(fileType, styles);
-    return (
-      <FileCardCommon
-        key={f.file.name + idx}
-        cardId={`pending-file-card-${idx}`}
-        fileName={f.file.name}
-        fileSize={f.file.size}
-        icon={icon}
-        statusText={statusMap[f.status || 'pending']}
-        statusColor="text-gray-400"
-        showRemove={true}
-        onRemove={() => onRemoveFile && onRemoveFile(f, idx, 'pending')}
-        themeColors={themeColors}
-        style={{ boxShadow: 'none', height: 55, background: '#f8fafc' }}
-      />
-    );
-  });
-
-  // 多选删除
-  const handleBatchRemove = () => {
-    if (eventsEmit) {
-      const filesToRemove = selectedFiles.map(idx => ({ file: files[idx], idx })).filter(f => f.file);
-      eventsEmit('uploaded_file:remove_batch', filesToRemove);
-    }
-    setSelectedFiles([]);
-  };
-
-  // 主题色
-  const batchDeleteBtnStyle = selectedFiles.length > 0
-    ? {
-        borderColor: themeColors && themeColors.error ? themeColors.error : '#FF0000',
-        background: themeColors && themeColors.error ? themeColors.error + '22' : '#FF000022',
-        color: themeColors && themeColors.error ? themeColors.error : '#FF0000',
-      }
-    : {
-        borderColor: themeColors && themeColors.disabledText ? themeColors.disabledText : '#808080',
-        background: themeColors && themeColors.disabledBackground ? themeColors.disabledBackground : '#F5F5F5',
-        color: themeColors && themeColors.disabledText ? themeColors.disabledText : '#808080',
-        cursor: 'not-allowed',
-      };
-
-  return (
-    <Modal
-      open={open}
-      onCancel={onCancel}
-      footer={null}
-      title={'对话临时文件知识库'}
-      closable={false}
-      width={800}
-      styles={{
-        body: {
-          padding: '0',
-          maxHeight: '70vh',
-          overflow: 'auto',
-        },
-      }}
-    >
-      <div className="file-manager-modal space-y-6 px-4 py-4">
-        {/* 已上传文件区域 */}
-        <div className="">
-          <div className="flex items-center mb-2 justify-between">
-            <div className="flex items-center">
-              <span className="text-xs font-semibold text-gray-700">已上传文件</span>
-              <span className="ml-2 text-xs text-gray-400">{files.length} 个</span>
-            </div>
-            {/* <button
-              className="ml-4 px-2 cursor-pointer py-1 text-xs rounded border"
-              disabled={selectedFiles.length === 0}
-              onClick={handleBatchRemove}
-              style={batchDeleteBtnStyle}
-            >
-              删除知识文档
-            </button> */}
-          </div>
-          <div
-            className="w-full relative min-h-[200px] max-h-[260px] bg-slate-50 p-2 overflow-y-auto"
-            style={{ overflowX: 'hidden' }}
-          >
-            <div className="flex flex-wrap gap-1">
-              {uploadedFileCards.length > 0 ? (
-                uploadedFileCards
-              ) : (
-                <div className="flex items-center w-full h-full py-10 justify-center text-gray-400 text-sm">
-                  暂无已上传文件
-                </div>
-              )}
-            </div>
-          </div>
-        </div>
-        {/* 待上传文件区域 */}
-        <div>
-          <div className="flex items-center mb-2">
-            <span className="text-xs font-semibold text-gray-700">待上传文件</span>
-            <span className="ml-2 text-xs text-gray-400">{currentFiles.length} 个</span>
-          </div>
-          <div className="flex gap-2 overflow-x-auto pb-2">
-            {pendingFileCards}
-            {/* 上传卡片 */}
-            <Upload.Dragger
-              multiple
-              showUploadList={false}
-              beforeUpload={(file, fileList) => {
-                if (file === fileList[0]) {
-                  onUpload?.(fileList as unknown as FileList);
-                }
-                return false;
-              }}
-              className="!bg-gray-50 !border-dashed !border-gray-300 hover:!border-blue-400 cursor-pointer min-w-[160px] max-w-[220px] flex flex-row items-center justify-center border-2 rounded-lg transition-all"
-              style={{ height: 45, boxShadow: 'none', padding: 0 }}
-            >
-              <div className="flex flex-row items-center pb-8 justify-center">
-                <Plus size={20} className="text-blue-400 mr-2" />
-                <div className="text-xs text-gray-500">上传文件</div>
-              </div>
-            </Upload.Dragger>
-          </div>
-        </div>
-        <div className="flex justify-end gap-2">
-          <Button type="primary" onClick={onCancel}>
-            确认
-          </Button>
-          {/* <Button onClick={onCancel}>取消</Button> */}
-        </div>
-      </div>
-      <style>{`
-        .file-manager-modal .ant-upload-wrapper,
-        .file-manager-modal .ant-upload-drag,
-        .file-manager-modal .ant-upload-drag-container {
-          min-height: 55px !important;
-          height: 55px !important;
-          padding: 0 !important;
-        }
-      `}</style>
-    </Modal>
-  );
-}

package/src/adopters/gientechCommon/components/FileManager/style.css

@@ -1,5 +0,0 @@
-.ant-upload-drag-container {
-  height: 45px !important;
-  min-height: 45px !important;
-  padding: 0 !important;
-}