feat(pkb): implement complete batch processing workflow and frontend optimization

- Frontend V3 architecture migration to modules/pkb
- Implement three work modes: full-text reading, deep reading, batch processing
- Complete batch processing: template selection, progress display, result export (CSV)
- Integrate Ant Design X Chat component with streaming support
- Add document upload modal with drag-and-drop support
- Optimize UI: multi-line table display, citation formatting, auto-scroll
- Fix 10+ technical issues: API mapping, state sync, form clearing
- Update documentation: development records and module status

Performance: 3 docs batch processing ~17-28s
Status: PKB module now production-ready (90% complete)
This commit is contained in:
2026-01-07 18:23:43 +08:00
parent e59676342a
commit 06028c6952
195 changed files with 1405 additions and 272 deletions

View File

@@ -8,7 +8,7 @@
* 直接管理消息状态,不使用 useXChat Hook
*/
import React, { useState, useCallback } from 'react';
import React, { useState, useCallback, useRef, useEffect } from 'react';
import { Bubble, Sender } from '@ant-design/x';
import type { ChatContainerProps, ChatMessage } from './types';
import type { BubbleItemType } from '@ant-design/x/es/bubble/interface';
@@ -40,11 +40,28 @@ export const ChatContainer: React.FC<ChatContainerProps> = ({
const [messages, setMessages] = useState<ChatMessage[]>(initialMessages);
const [isLoading, setIsLoading] = useState(false);
const [inputValue, setInputValue] = useState(''); // 受控输入框
const messagesEndRef = useRef<HTMLDivElement>(null); // 用于滚动到底部
// 滚动到底部
const scrollToBottom = useCallback(() => {
setTimeout(() => {
messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' });
}, 100);
}, []);
// 消息变化时自动滚动
useEffect(() => {
scrollToBottom();
}, [messages, scrollToBottom]);
// 处理消息发送
const handleSend = useCallback(async (messageContent: string) => {
if (!messageContent.trim()) return; // 防止发送空消息
// 🔑 立即清除输入框
setInputValue('');
// 1. 添加用户消息
const userMessage: ChatMessage = {
id: Date.now(),
@@ -144,13 +161,17 @@ export const ChatContainer: React.FC<ChatContainerProps> = ({
items={bubbleItems}
autoScroll={true}
/>
{/* 滚动锚点 */}
<div ref={messagesEndRef} />
</div>
{/* 输入框 */}
{/* 输入框(受控模式) */}
<div className="chat-input">
<Sender
placeholder="输入消息..."
loading={isLoading}
value={inputValue}
onChange={setInputValue}
onSubmit={handleSend}
{...senderProps}
/>

View File

@@ -50,5 +50,6 @@ export { default as Placeholder } from './Placeholder';