import { ref } from 'vue' interface WorkflowNode { id: string name: string description: string icon: string color: string bgColor: string borderColor: string status: 'pending' | 'processing' | 'completed' expanded: boolean children?: WorkflowNode[] } export function useWorkflow() { // 流程生成相关 const isGeneratingGraph = ref(false) const isGraphGenerated = ref(false) const workflowData = ref([ { id: 'output', name: '最终输出', description: '生成最终结果返回给用户', icon: 'fa-check-circle', color: 'text-green-400', bgColor: 'from-green-500/20 to-green-500/5', borderColor: 'border-green-500/30', status: 'pending', expanded: false, children: [ { id: 'generate', name: '方案生成', description: '基于分析结果构建解决方案', icon: 'fa-lightbulb', color: 'text-primary-orange', bgColor: 'from-primary-orange/20 to-primary-orange/5', borderColor: 'border-primary-orange/30', status: 'pending', expanded: false, children: [ { id: 'analyze', name: '问题分析', description: '拆解问题、提取关键信息、理解用户意图', icon: 'fa-microscope', color: 'text-purple-400', bgColor: 'from-purple-500/20 to-purple-500/5', borderColor: 'border-purple-500/30', status: 'pending', expanded: false, children: [ { id: 'question', name: '用户问题', description: '输入原始需求和问题描述', icon: 'fa-question', color: 'text-primary-cyan', bgColor: 'from-primary-cyan/20 to-primary-cyan/5', borderColor: 'border-primary-cyan/30', status: 'pending', expanded: false, } ] }, { id: 'data', name: '数据获取', description: '从知识库、向量数据库获取相关信息', icon: 'fa-database', color: 'text-green-400', bgColor: 'from-green-500/20 to-green-500/5', borderColor: 'border-green-500/30', status: 'pending', expanded: false, } ] }, { id: 'evaluate', name: '方案评估', description: '验证方案可行性和效果', icon: 'fa-clipboard-check', color: 'text-yellow-400', bgColor: 'from-yellow-500/20 to-yellow-500/5', borderColor: 'border-yellow-500/30', status: 'pending', expanded: false, } ] } ]) // 展开/收起节点 const toggleNode = (node: WorkflowNode) => { node.expanded = !node.expanded } // 递归渲染节点 const renderWorkflow = (nodes: WorkflowNode[], level: number = 0) => { return nodes } const generateGraph = () => { isGeneratingGraph.value = true setTimeout(() => { isGeneratingGraph.value = false isGraphGenerated.value = true if (workflowData.value.length > 0) { workflowData.value[0].expanded = true if (workflowData.value[0].children) { workflowData.value[0].children.forEach(child => { child.expanded = false if (child.children) { child.children.forEach(gc => gc.expanded = false) } }) } } }, 2500) } return { // State workflowData, isGeneratingGraph, isGraphGenerated, // Methods toggleNode, renderWorkflow, generateGraph, } }