feat: 集成Profile和历史记录功能到核心页面

- 在PromptTemplate.tsx中集成Profile选择和保存功能
- 在MarkdownEditor.tsx中集成历史记录和文件过滤功能
- 支持Profile的切换和当前配置保存
- 支持历史记录的自动保存和手动管理
- 支持文件过滤条件设置和应用
- 添加工具栏和状态提示，提升用户体验

Author: CC11001100

src/pages/MarkdownEditor.tsx

@@ -4,27 +4,29 @@ import FileUpload from './FileUpload';
 import CopyButton from './CopyButton';
 import {Prism as SyntaxHighlighter} from 'react-syntax-highlighter';
 import {materialLight} from 'react-syntax-highlighter/dist/esm/styles/prism';
-import {Box, Dialog, DialogContent, DialogTitle, IconButton, TextField, Typography} from '@mui/material';
+import {Box, Dialog, DialogContent, DialogTitle, IconButton, TextField, Typography, Button, Tooltip} from '@mui/material';
 import CloseIcon from '@mui/icons-material/Close';
 import DeleteIcon from '@mui/icons-material/Delete';
 import DeleteForever from '@mui/icons-material/DeleteForever';
+import HistoryIcon from '@mui/icons-material/History';
+import FilterListIcon from '@mui/icons-material/FilterList';
+import SaveIcon from '@mui/icons-material/Save';
 import './styles.css';
-
-interface FileInfo {
-    name: string;
-    path: string;
-    size: number;
-    extension: string;
-    content: string;
-}
+import { FileInfo } from '../types/types';
+import { HistoryRecord, FileFilter, DEFAULT_FILE_FILTER } from '../types/history';
+import { historyDB } from '../utils/indexedDB';
+import { applyFileFilter, getFilterStats } from '../utils/fileFilter';
+import HistoryPanel from '../components/HistoryPanel';
+import FileFilterComponent from '../components/FileFilter';
 
 interface MarkdownEditorProps {
     ruleContent: string;
     roleContent: string;
     outputContent: string;
+    onLoadFromHistory?: (record: HistoryRecord) => void;
 }
 
-const MarkdownEditor: React.FC<MarkdownEditorProps> = ({ruleContent, roleContent, outputContent}) => {
+const MarkdownEditor: React.FC<MarkdownEditorProps> = ({ruleContent, roleContent, outputContent, onLoadFromHistory}) => {
     const [markdownContent, setMarkdownContent] = useState(() => {
         const saved = localStorage.getItem('markdownContent');
         return saved || '';
@@ -37,6 +39,29 @@ const MarkdownEditor: React.FC<MarkdownEditorProps> = ({ruleContent, roleContent
     const [isDialogOpen, setIsDialogOpen] = useState(false);
     const previewContentRef = useRef<HTMLDivElement>(null);
 
+    // 新增状态
+    const [historyPanelOpen, setHistoryPanelOpen] = useState(false);
+    const [fileFilterOpen, setFileFilterOpen] = useState(false);
+    const [fileFilter, setFileFilter] = useState<FileFilter>(() => {
+        const saved = localStorage.getItem('fileFilter');
+        return saved ? JSON.parse(saved) : DEFAULT_FILE_FILTER;
+    });
+    const [originalFiles, setOriginalFiles] = useState<FileInfo[]>([]);
+    const [isDBInitialized, setIsDBInitialized] = useState(false);
+
+    // 初始化IndexedDB
+    useEffect(() => {
+        const initDB = async () => {
+            try {
+                await historyDB.init();
+                setIsDBInitialized(true);
+            } catch (error) {
+                console.error('Failed to initialize IndexedDB:', error);
+            }
+        };
+        initDB();
+    }, []);
+
     // 持久化markdown内容
     useEffect(() => {
         const timer = setTimeout(() => {
@@ -64,9 +89,20 @@ const MarkdownEditor: React.FC<MarkdownEditorProps> = ({ruleContent, roleContent
         }
     }, [previewFile]);
 
+    // 持久化文件过滤器设置
+    useEffect(() => {
+        localStorage.setItem('fileFilter', JSON.stringify(fileFilter));
+    }, [fileFilter]);
+
     const handleFilesUploaded = (newFiles: FileInfo[]) => {
+        // 保存原始文件
+        setOriginalFiles(newFiles);
+
+        // 应用过滤器
+        const filteredFiles = applyFileFilter(newFiles, fileFilter);
+
         setFiles(prev => {
-            const updatedFiles = [...prev, ...newFiles];
+            const updatedFiles = [...prev, ...filteredFiles];
             // 去重逻辑
             const uniqueFiles = updatedFiles.reduce((acc, current) => {
                 if (!acc.some(file => file.path === current.path)) {
@@ -78,6 +114,52 @@ const MarkdownEditor: React.FC<MarkdownEditorProps> = ({ruleContent, roleContent
         });
     };
 
+    // 保存当前状态为历史记录
+    const saveToHistory = async () => {
+        if (!isDBInitialized) return;
+
+        try {
+            const record: HistoryRecord = {
+                id: `history_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`,
+                timestamp: Date.now(),
+                title: `构造记录 ${new Date().toLocaleString('zh-CN')}`,
+                description: '',
+                roleContent,
+                ruleContent,
+                taskContent: markdownContent,
+                outputContent,
+                files,
+                tags: [],
+                version: 1
+            };
+
+            await historyDB.saveRecord(record);
+            console.log('History record saved successfully');
+        } catch (error) {
+            console.error('Failed to save history record:', error);
+        }
+    };
+
+    // 从历史记录加载
+    const loadFromHistory = (record: HistoryRecord) => {
+        setMarkdownContent(record.taskContent);
+        setFiles(record.files);
+        // 通知父组件更新其他内容
+        if (onLoadFromHistory) {
+            onLoadFromHistory(record);
+        }
+        console.log('Loaded from history:', record.title);
+    };
+
+    // 应用文件过滤器
+    const applyFilter = (newFilter: FileFilter) => {
+        setFileFilter(newFilter);
+        if (originalFiles.length > 0) {
+            const filteredFiles = applyFileFilter(originalFiles, newFilter);
+            setFiles(filteredFiles);
+        }
+    };
+
     const formatFileSize = (bytes: number) => {
         const units = ['B', 'KB', 'MB', 'GB'];
         let size = bytes;
@@ -121,6 +203,49 @@ const MarkdownEditor: React.FC<MarkdownEditorProps> = ({ruleContent, roleContent
         <div className="editor-container">
             <FileUpload onFilesUploaded={handleFilesUploaded}/>
 
+            {/* 工具栏 */}
+            <Box display="flex" gap={1} mb={2} flexWrap="wrap">
+                <Tooltip title="查看构造历史">
+                    <Button
+                        startIcon={<HistoryIcon />}
+                        onClick={() => setHistoryPanelOpen(true)}
+                        variant="outlined"
+                        size="small"
+                    >
+                        历史记录
+                    </Button>
+                </Tooltip>
+
+                <Tooltip title="设置文件过滤条件">
+                    <Button
+                        startIcon={<FilterListIcon />}
+                        onClick={() => setFileFilterOpen(true)}
+                        variant="outlined"
+                        size="small"
+                    >
+                        文件过滤
+                    </Button>
+                </Tooltip>
+
+                <Tooltip title="保存当前构造到历史记录">
+                    <Button
+                        startIcon={<SaveIcon />}
+                        onClick={saveToHistory}
+                        variant="outlined"
+                        size="small"
+                        disabled={!isDBInitialized}
+                    >
+                        保存历史
+                    </Button>
+                </Tooltip>
+
+                {originalFiles.length > 0 && originalFiles.length !== files.length && (
+                    <Typography variant="caption" color="text.secondary" sx={{ alignSelf: 'center', ml: 1 }}>
+                        已过滤 {originalFiles.length - files.length} 个文件
+                    </Typography>
+                )}
+            </Box>
+
             {files.length > 0 && (
                 <div className="file-list">
                     <Box display="flex" justifyContent="space-between" alignItems="center" mb={1}>
@@ -231,6 +356,21 @@ const MarkdownEditor: React.FC<MarkdownEditorProps> = ({ruleContent, roleContent
                     files={files}
                 />
             </div>
+
+            {/* 历史记录面板 */}
+            <HistoryPanel
+                open={historyPanelOpen}
+                onClose={() => setHistoryPanelOpen(false)}
+                onLoadRecord={loadFromHistory}
+            />
+
+            {/* 文件过滤对话框 */}
+            <FileFilterComponent
+                open={fileFilterOpen}
+                onClose={() => setFileFilterOpen(false)}
+                filter={fileFilter}
+                onFilterChange={applyFilter}
+            />
         </div>
     );
 };