feat: 目录进度可视化

src/main/services/KnowledgeService.ts

@@ -15,6 +15,8 @@ import { FileType, KnowledgeBaseParams, KnowledgeItem } from '@types'
 import { app } from 'electron'
 import { v4 as uuidv4 } from 'uuid'
 
+import { windowService } from './WindowService'
+
 class KnowledgeService {
   private storageDir = path.join(app.getPath('userData'), 'Data', 'KnowledgeBase')
 
@@ -83,10 +85,23 @@ class KnowledgeService {
   ): Promise<LoaderReturn> => {
     const ragApplication = await this.getRagApplication(base)
 
+    const sendDirectoryProcessingPercent = (totalFiles: number, processedFiles: number) => {
+      const mainWindow = windowService.getMainWindow()
+      mainWindow?.webContents.send(base.id, (processedFiles / totalFiles) * 100)
+    }
+
     if (item.type === 'directory') {
       const directory = item.content as string
       const files = getAllFiles(directory)
-      const loaderPromises = files.map((file) => addFileLoader(ragApplication, file, base, forceReload))
+      const totalFiles = files.length
+      let processedFiles = 0
+      const loaderPromises = files.map(async (file) => {
+        const result = await addFileLoader(ragApplication, file, base, forceReload)
+        processedFiles++
+
+        sendDirectoryProcessingPercent(totalFiles, processedFiles)
+        return result
+      })
       const loaderResults = await Promise.all(loaderPromises)
       const uniqueIds = loaderResults.map((result) => result.uniqueId)
       return {

src/renderer/src/hooks/useKnowledge.ts

@@ -198,6 +198,23 @@ export const useKnowledge = (baseId: string) => {
     return base?.items.filter((item) => item.type === type && item.processingStatus !== undefined) || []
   }
 
+  // 获取目录处理进度
+  const getDirectoryProcessingPercent = (itemId: string) => {
+    const [percent, setPercent] = useState<number>(0)
+
+    useEffect(() => {
+      const cleanup = window.electron.ipcRenderer.on(itemId, (_, progressingPercent: number) => {
+        setPercent(progressingPercent)
+      })
+
+      return () => {
+        cleanup()
+      }
+    }, [itemId])
+
+    return percent
+  }
+
   // 清除已完成的项目
   const clearCompleted = () => {
     dispatch(clearCompletedProcessing({ baseId }))
@@ -280,6 +297,7 @@ export const useKnowledge = (baseId: string) => {
     refreshItem,
     getProcessingStatus,
     getProcessingItemsByType,
+    getDirectoryProcessingPercent,
     clearCompleted,
     clearAll,
     removeItem,

src/renderer/src/pages/knowledge/KnowledgeContent.tsx

@@ -53,6 +53,7 @@ const KnowledgeContent: FC<KnowledgeContentProps> = ({ selectedBase }) => {
     addSitemap,
     removeItem,
     getProcessingStatus,
+    getDirectoryProcessingPercent,
     addNote,
     addDirectory
   } = useKnowledge(selectedBase.id || '')
@@ -63,6 +64,7 @@ const KnowledgeContent: FC<KnowledgeContentProps> = ({ selectedBase }) => {
   if (!base) {
     return null
   }
+  const progressingPercent = getDirectoryProcessingPercent(base?.id)
 
   const handleAddFile = () => {
     if (disabled) {
@@ -271,7 +273,12 @@ const KnowledgeContent: FC<KnowledgeContentProps> = ({ selectedBase }) => {
                 <FlexAlignCenter>
                   {item.uniqueId && <Button type="text" icon={<RefreshIcon />} onClick={() => refreshItem(item)} />}
                   <StatusIconWrapper>
-                    <StatusIcon sourceId={item.id} base={base} getProcessingStatus={getProcessingStatus} />
+                    <StatusIcon
+                      sourceId={item.id}
+                      base={base}
+                      getProcessingStatus={getProcessingStatus}
+                      progressingPercent={progressingPercent}
+                    />
                   </StatusIconWrapper>
                   <Button type="text" danger onClick={() => removeItem(item)} icon={<DeleteOutlined />} />
                 </FlexAlignCenter>

src/renderer/src/pages/knowledge/components/StatusIcon.tsx

@@ -1,6 +1,6 @@
 import { CheckCircleOutlined, CloseCircleOutlined } from '@ant-design/icons'
 import { KnowledgeBase, ProcessingStatus } from '@renderer/types'
-import { Tooltip } from 'antd'
+import { Progress, Tooltip } from 'antd'
 import { FC } from 'react'
 import { useTranslation } from 'react-i18next'
 import styled from 'styled-components'
@@ -9,9 +9,10 @@ interface StatusIconProps {
   sourceId: string
   base: KnowledgeBase
   getProcessingStatus: (sourceId: string) => ProcessingStatus | undefined
+  progressingPercent?: number
 }
 
-const StatusIcon: FC<StatusIconProps> = ({ sourceId, base, getProcessingStatus }) => {
+const StatusIcon: FC<StatusIconProps> = ({ sourceId, base, getProcessingStatus, progressingPercent }) => {
   const { t } = useTranslation()
   const status = getProcessingStatus(sourceId)
   const item = base.items.find((item) => item.id === sourceId)
@@ -40,11 +41,7 @@ const StatusIcon: FC<StatusIconProps> = ({ sourceId, base, getProcessingStatus }
         </Tooltip>
       )
     case 'processing':
-      return (
+      return <Progress type="circle" size={14} percent={Number(progressingPercent?.toFixed(0))} />
-        <Tooltip title={t('knowledge.status_processing')} placement="left">
-          <StatusDot $status="processing" />
-        </Tooltip>
-      )
     case 'completed':
       return (
         <Tooltip title={t('knowledge.status_completed')} placement="left">