添加AI生成表头功能并重构前端状态管理
- 后端:实现AI生成表头逻辑,当模板为空或字段为自动生成时调用AI分析并生成合适字段 - 后端:添加_is_auto_generated_field方法识别自动生成的无效表头字段 - 后端:修改_get_template_fields_from_excel方法支持文件类型参数 - 前端:创建TemplateFillContext提供全局状态管理 - 前端:将TemplateFill页面状态迁移到Context中统一管理 - 前端:移除页面内重复的状态定义和方法实现
This commit is contained in:
114
frontend/src/context/TemplateFillContext.tsx
Normal file
114
frontend/src/context/TemplateFillContext.tsx
Normal file
@@ -0,0 +1,114 @@
|
||||
import React, { createContext, useContext, useState, ReactNode } from 'react';
|
||||
|
||||
type SourceFile = {
|
||||
file: File;
|
||||
preview?: string;
|
||||
};
|
||||
|
||||
type TemplateField = {
|
||||
cell: string;
|
||||
name: string;
|
||||
field_type: string;
|
||||
required: boolean;
|
||||
hint?: string;
|
||||
};
|
||||
|
||||
type Step = 'upload' | 'filling' | 'preview';
|
||||
|
||||
interface TemplateFillState {
|
||||
step: Step;
|
||||
templateFile: File | null;
|
||||
templateFields: TemplateField[];
|
||||
sourceFiles: SourceFile[];
|
||||
sourceFilePaths: string[];
|
||||
templateId: string;
|
||||
filledResult: any;
|
||||
setStep: (step: Step) => void;
|
||||
setTemplateFile: (file: File | null) => void;
|
||||
setTemplateFields: (fields: TemplateField[]) => void;
|
||||
setSourceFiles: (files: SourceFile[]) => void;
|
||||
addSourceFiles: (files: SourceFile[]) => void;
|
||||
removeSourceFile: (index: number) => void;
|
||||
setSourceFilePaths: (paths: string[]) => void;
|
||||
setTemplateId: (id: string) => void;
|
||||
setFilledResult: (result: any) => void;
|
||||
reset: () => void;
|
||||
}
|
||||
|
||||
const initialState = {
|
||||
step: 'upload' as Step,
|
||||
templateFile: null,
|
||||
templateFields: [],
|
||||
sourceFiles: [],
|
||||
sourceFilePaths: [],
|
||||
templateId: '',
|
||||
filledResult: null,
|
||||
setStep: () => {},
|
||||
setTemplateFile: () => {},
|
||||
setTemplateFields: () => {},
|
||||
setSourceFiles: () => {},
|
||||
addSourceFiles: () => {},
|
||||
removeSourceFile: () => {},
|
||||
setSourceFilePaths: () => {},
|
||||
setTemplateId: () => {},
|
||||
setFilledResult: () => {},
|
||||
reset: () => {},
|
||||
};
|
||||
|
||||
const TemplateFillContext = createContext<TemplateFillState>(initialState);
|
||||
|
||||
export const TemplateFillProvider: React.FC<{ children: ReactNode }> = ({ children }) => {
|
||||
const [step, setStep] = useState<Step>('upload');
|
||||
const [templateFile, setTemplateFile] = useState<File | null>(null);
|
||||
const [templateFields, setTemplateFields] = useState<TemplateField[]>([]);
|
||||
const [sourceFiles, setSourceFiles] = useState<SourceFile[]>([]);
|
||||
const [sourceFilePaths, setSourceFilePaths] = useState<string[]>([]);
|
||||
const [templateId, setTemplateId] = useState<string>('');
|
||||
const [filledResult, setFilledResult] = useState<any>(null);
|
||||
|
||||
const addSourceFiles = (files: SourceFile[]) => {
|
||||
setSourceFiles(prev => [...prev, ...files]);
|
||||
};
|
||||
|
||||
const removeSourceFile = (index: number) => {
|
||||
setSourceFiles(prev => prev.filter((_, i) => i !== index));
|
||||
};
|
||||
|
||||
const reset = () => {
|
||||
setStep('upload');
|
||||
setTemplateFile(null);
|
||||
setTemplateFields([]);
|
||||
setSourceFiles([]);
|
||||
setSourceFilePaths([]);
|
||||
setTemplateId('');
|
||||
setFilledResult(null);
|
||||
};
|
||||
|
||||
return (
|
||||
<TemplateFillContext.Provider
|
||||
value={{
|
||||
step,
|
||||
templateFile,
|
||||
templateFields,
|
||||
sourceFiles,
|
||||
sourceFilePaths,
|
||||
templateId,
|
||||
filledResult,
|
||||
setStep,
|
||||
setTemplateFile,
|
||||
setTemplateFields,
|
||||
setSourceFiles,
|
||||
addSourceFiles,
|
||||
removeSourceFile,
|
||||
setSourceFilePaths,
|
||||
setTemplateId,
|
||||
setFilledResult,
|
||||
reset,
|
||||
}}
|
||||
>
|
||||
{children}
|
||||
</TemplateFillContext.Provider>
|
||||
);
|
||||
};
|
||||
|
||||
export const useTemplateFill = () => useContext(TemplateFillContext);
|
||||
Reference in New Issue
Block a user