feat:冗余代码清理
This commit is contained in:
@@ -23,15 +23,14 @@ const emit = defineEmits<{
|
||||
(e: 'save-edit', stepId: string, processId: string, value: string): void
|
||||
}>()
|
||||
|
||||
// 🔄 从 currentTask 中获取数据(与分支切换联动)
|
||||
//从 currentTask 中获取数据
|
||||
const currentTaskProcess = computed(() => {
|
||||
// ✅ 优先使用 currentTask(包含分支切换后的数据)
|
||||
const currentTask = agentsStore.currentTask
|
||||
if (currentTask && currentTask.Id === props.step.Id && currentTask.TaskProcess) {
|
||||
return currentTask.TaskProcess
|
||||
}
|
||||
|
||||
// ⚠️ 降级:从 agentRawPlan 中获取原始数据(不受分支切换影响)
|
||||
//从 agentRawPlan 中获取原始数据
|
||||
const collaborationProcess = agentsStore.agentRawPlan.data?.['Collaboration Process'] || []
|
||||
const rawData = collaborationProcess.find((task: any) => task.Id === props.step.Id)
|
||||
return rawData?.TaskProcess || []
|
||||
@@ -39,19 +38,18 @@ const currentTaskProcess = computed(() => {
|
||||
|
||||
// 当前正在编辑的process ID
|
||||
const editingProcessId = ref<string | null>(null)
|
||||
// 编辑框的值
|
||||
const editValue = ref('')
|
||||
// 鼠标悬停的process ID
|
||||
const hoverProcessId = ref<string | null>(null)
|
||||
|
||||
// 🆕 处理卡片点击事件(非编辑模式下)
|
||||
// 处理卡片点击事件
|
||||
function handleCardClick() {
|
||||
// 如果正在编辑,不处理点击
|
||||
if (editingProcessId.value) return
|
||||
|
||||
// 设置当前任务,与任务大纲联动
|
||||
if (props.step.Id) {
|
||||
agentsStore.setCurrentTask(props.step)
|
||||
agentsStore.setCurrentTask(props.step as any)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,10 +1,8 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, computed, watch, nextTick, onMounted } from 'vue'
|
||||
import { ref, computed, nextTick, onMounted } from 'vue'
|
||||
import { VueFlow, useVueFlow, Handle, Position, type Node, type Edge } from '@vue-flow/core'
|
||||
import { Controls } from '@vue-flow/controls'
|
||||
import '@vue-flow/core/dist/style.css'
|
||||
import '@vue-flow/core/dist/theme-default.css'
|
||||
import '@vue-flow/controls/dist/style.css'
|
||||
import {
|
||||
useAgentsStore,
|
||||
useSelectionStore,
|
||||
@@ -22,7 +20,7 @@ const agentsStore = useAgentsStore()
|
||||
const selectionStore = useSelectionStore()
|
||||
const { onConnect, addEdges, fitView: fit } = useVueFlow()
|
||||
|
||||
// 🆕 直接从 store 获取当前任务和任务过程数据
|
||||
// 直接从 store 获取当前任务和任务过程数据
|
||||
const currentTask = computed(() => agentsStore.currentTask)
|
||||
const taskProcess = computed(() => agentsStore.currentTask?.TaskProcess ?? [])
|
||||
|
||||
@@ -50,12 +48,10 @@ let isSyncing = false
|
||||
//初始化标记,避免重复初始化
|
||||
const BRANCHES_INIT_KEY_PREFIX = 'plan-task-branches-initialized-'
|
||||
|
||||
// 🆕 最后选中的分支ID
|
||||
//最后选中的分支ID
|
||||
const LAST_SELECTED_BRANCH_KEY = 'plan-task-last-selected-branch'
|
||||
|
||||
// ==================== 辅助函数定义 ====================
|
||||
|
||||
// 🆕 获取分支的所有节点(只沿着分支创建方向遍历:right handle连接)
|
||||
// 获取分支的所有节点
|
||||
const getAllBranchNodes = (startNodeId: string): string[] => {
|
||||
const visited = new Set<string>()
|
||||
const toVisit: string[] = [startNodeId]
|
||||
@@ -68,14 +64,14 @@ const getAllBranchNodes = (startNodeId: string): string[] => {
|
||||
}
|
||||
visited.add(currentId)
|
||||
|
||||
// 🆕 只查找通过 right handle 连接的后续节点(分支创建方向)
|
||||
// 只查找通过 right handle 连接的后续节点
|
||||
const outgoingEdges = edges.value.filter(
|
||||
edge => edge.source === currentId && edge.sourceHandle === 'right'
|
||||
)
|
||||
|
||||
for (const edge of outgoingEdges) {
|
||||
const targetNodeId = edge.target
|
||||
// 只访问分支节点(不包含主流程节点和根节点)
|
||||
// 只访问分支节点
|
||||
if (
|
||||
!visited.has(targetNodeId) &&
|
||||
targetNodeId !== 'root' &&
|
||||
@@ -89,7 +85,7 @@ const getAllBranchNodes = (startNodeId: string): string[] => {
|
||||
return Array.from(visited)
|
||||
}
|
||||
|
||||
// 🆕 获取从指定节点回溯到根节点的路径(只包含主流程节点)
|
||||
//获取从指定节点回溯到根节点的路径(只包含主流程节点)
|
||||
const getPathToRoot = (targetNodeId: string): string[] => {
|
||||
const path: string[] = []
|
||||
const visited = new Set<string>()
|
||||
@@ -126,7 +122,7 @@ const getPathToRoot = (targetNodeId: string): string[] => {
|
||||
return path
|
||||
}
|
||||
|
||||
// 🆕 向上回溯分支的父节点链(只包含分支节点)
|
||||
// 向上回溯分支的父节点链(只包含分支节点)
|
||||
const getBranchParentChain = (targetNodeId: string): string[] => {
|
||||
const parentChain: string[] = []
|
||||
let currentId = targetNodeId
|
||||
@@ -153,8 +149,7 @@ const getBranchParentChain = (targetNodeId: string): string[] => {
|
||||
|
||||
return parentChain
|
||||
}
|
||||
|
||||
// ==================== 初始化流程图 ====================
|
||||
// 初始化流程图
|
||||
const initializeFlow = () => {
|
||||
if (!currentTask.value) {
|
||||
nodes.value = []
|
||||
@@ -162,20 +157,17 @@ const initializeFlow = () => {
|
||||
return
|
||||
}
|
||||
|
||||
// 🆕 获取当前流程数据
|
||||
// 获取当前流程数据
|
||||
const taskStepId = currentTask.value.Id
|
||||
// 🆕 获取当前 agent 组合(用于区分不同 agent 组合的分支数据)
|
||||
// 获取当前 agent 组合(用于区分不同 agent 组合的分支数据)
|
||||
const currentAgents = currentTask.value.AgentSelection || []
|
||||
|
||||
// 🆕 直接使用 taskProcess.value 作为数据源
|
||||
// 注意:虽然 currentTask.id 相同,但不同的 agent 组合对应的 agent 任务过程不同
|
||||
// taskProcess.value 从 currentTask.TaskProcess 获取,能正确反映当前 agent 组合的任务过程
|
||||
// 直接使用 taskProcess.value 作为数据源
|
||||
const currentTaskProcess = taskProcess.value
|
||||
console.log('currentTaskProcess:', currentTaskProcess)
|
||||
// 🆕 立即保存为副本(深拷贝)
|
||||
// 立即保存为副本(深拷贝)
|
||||
const taskProcessCopy = JSON.parse(JSON.stringify(currentTaskProcess))
|
||||
|
||||
// 🆕 使用副本数据创建节点(而不是 currentTaskProcess)
|
||||
// 使用副本数据创建节点(而不是 currentTaskProcess)
|
||||
const taskProcessForNodes = taskProcessCopy
|
||||
const newNodes: Node[] = []
|
||||
const newEdges: Edge[] = []
|
||||
@@ -233,7 +225,14 @@ const initializeFlow = () => {
|
||||
targetHandle: 'left',
|
||||
type: 'smoothstep',
|
||||
animated: true,
|
||||
style: { stroke: '#43a8aa', strokeWidth: 2 }
|
||||
style: { stroke: '#43a8aa', strokeWidth: 2 },
|
||||
markerEnd: {
|
||||
type: 'arrow' as any,
|
||||
color: '#43a8aa',
|
||||
width: 20,
|
||||
height: 20,
|
||||
strokeWidth: 2
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
@@ -247,21 +246,27 @@ const initializeFlow = () => {
|
||||
targetHandle: 'left',
|
||||
type: 'smoothstep',
|
||||
animated: true,
|
||||
style: { stroke: '#43a8aa', strokeWidth: 2 }
|
||||
style: { stroke: '#43a8aa', strokeWidth: 2 },
|
||||
markerEnd: {
|
||||
type: 'arrow' as any,
|
||||
color: '#43a8aa',
|
||||
width: 20,
|
||||
height: 20,
|
||||
strokeWidth: 2
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
nodes.value = newNodes
|
||||
edges.value = newEdges
|
||||
|
||||
// 📂 从 store 恢复已保存的任务过程分支数据
|
||||
// taskStepId 已在前面声明 (line 163)
|
||||
// 从 store 恢复已保存的任务过程分支数据
|
||||
|
||||
if (taskStepId) {
|
||||
// 🆕 使用当前 agent 组合获取分支数据
|
||||
// 使用当前 agent 组合获取分支数据
|
||||
const savedBranches = selectionStore.getTaskProcessBranches(taskStepId, currentAgents)
|
||||
|
||||
// 🆕 检查是否已经初始化过(针对该任务和 agent 组合)
|
||||
// 检查是否已经初始化过(针对该任务和 agent 组合)
|
||||
const branchesInitKey = `${BRANCHES_INIT_KEY_PREFIX}${taskStepId}_${selectionStore.getAgentGroupKey(
|
||||
currentAgents
|
||||
)}`
|
||||
@@ -272,17 +277,17 @@ const initializeFlow = () => {
|
||||
edges.value = []
|
||||
|
||||
savedBranches.forEach(branch => {
|
||||
// 恢复节点(深拷贝,避免引用问题)
|
||||
// 恢复节点
|
||||
branch.nodes.forEach(node => {
|
||||
nodes.value.push(JSON.parse(JSON.stringify(node)))
|
||||
})
|
||||
// 恢复边(深拷贝)
|
||||
// 恢复边
|
||||
branch.edges.forEach(edge => {
|
||||
edges.value.push(JSON.parse(JSON.stringify(edge)))
|
||||
})
|
||||
})
|
||||
|
||||
// 🆕 恢复最后选中的分支
|
||||
// 恢复最后选中的分支
|
||||
const lastSelectedBranchId = sessionStorage.getItem(LAST_SELECTED_BRANCH_KEY)
|
||||
if (lastSelectedBranchId) {
|
||||
const lastSelectedBranch = savedBranches.find(branch => branch.id === lastSelectedBranchId)
|
||||
@@ -313,7 +318,7 @@ const initializeFlow = () => {
|
||||
}
|
||||
}
|
||||
|
||||
// 🆕 使用多级分支逻辑:获取父节点链和子节点
|
||||
// 获取父节点链和子节点
|
||||
const branchParentChain = getBranchParentChain(firstBranchNode.id)
|
||||
const branchChildNodes = getAllBranchNodes(firstBranchNode.id)
|
||||
|
||||
@@ -338,11 +343,11 @@ const initializeFlow = () => {
|
||||
selectedNodeIds.value = new Set(mainProcessNodes)
|
||||
}
|
||||
} else {
|
||||
// 🆕 首次初始化:设置节点和边,并保存为"初始流程"分支
|
||||
// 首次初始化:设置节点和边,并保存为"初始流程"分支
|
||||
nodes.value = newNodes
|
||||
edges.value = newEdges
|
||||
|
||||
const initialBranchNodes = newNodes // ✅ 保留所有节点,包括根节点
|
||||
const initialBranchNodes = newNodes
|
||||
const initialBranchEdges = [...newEdges]
|
||||
|
||||
const initialBranchId = selectionStore.addTaskProcessBranch(taskStepId, currentAgents, {
|
||||
@@ -351,13 +356,13 @@ const initializeFlow = () => {
|
||||
branchType: 'root',
|
||||
nodes: JSON.parse(JSON.stringify(initialBranchNodes)),
|
||||
edges: JSON.parse(JSON.stringify(initialBranchEdges)),
|
||||
tasks: taskProcessCopy // 👈 使用副本(已经是深拷贝)
|
||||
tasks: taskProcessCopy
|
||||
})
|
||||
|
||||
// 🆕 标记已初始化(针对该任务步骤和 agent 组合)
|
||||
// 标记已初始化(针对该任务步骤和 agent 组合)
|
||||
sessionStorage.setItem(branchesInitKey, 'true')
|
||||
|
||||
// 🆕 首次初始化时,设置初始流程为当前选中分支
|
||||
// 首次初始化时,设置初始流程为当前选中分支
|
||||
selectionStore.setActiveTaskProcessBranch(taskStepId, currentAgents, initialBranchId)
|
||||
|
||||
// 默认选中"初始流程"的高亮状态
|
||||
@@ -369,166 +374,6 @@ const initializeFlow = () => {
|
||||
}
|
||||
}
|
||||
|
||||
// 同步当前所有分支数据到 store
|
||||
const syncBranchesToStore = () => {
|
||||
if (isSyncing || !currentTask.value?.Id) return
|
||||
|
||||
isSyncing = true
|
||||
const taskStepId = currentTask.value.Id
|
||||
// 🆕 获取当前 agent 组合
|
||||
const currentAgents = currentTask.value.AgentSelection || []
|
||||
|
||||
// 🔄 获取现有的分支数据(用于保留初始流程分支)
|
||||
const existingBranches = selectionStore.getTaskProcessBranches(taskStepId, currentAgents)
|
||||
const existingBranchesMap = new Map<string, any>()
|
||||
existingBranches.forEach(branch => {
|
||||
// 使用分支ID作为key
|
||||
existingBranchesMap.set(branch.id, branch)
|
||||
})
|
||||
|
||||
// 获取当前所有分支节点(标记为 isBranchTask)
|
||||
const currentBranchNodes = nodes.value.filter((n: Node) => n.data.isBranchTask)
|
||||
|
||||
if (currentBranchNodes.length === 0) {
|
||||
isSyncing = false
|
||||
return
|
||||
}
|
||||
|
||||
// 按照分支分组节点和边
|
||||
// 通过 parentId 将节点分组
|
||||
const branchesMap = new Map<
|
||||
string,
|
||||
{
|
||||
nodes: Node[]
|
||||
edges: Edge[]
|
||||
branchContent: string
|
||||
branchType: 'root' | 'task'
|
||||
createdAt: number
|
||||
tasks?: any[] // 🆕 添加 tasks 字段
|
||||
}
|
||||
>()
|
||||
|
||||
currentBranchNodes.forEach((node: Node) => {
|
||||
// 找到连接到该节点的边,确定父节点
|
||||
const incomingEdge = edges.value.find((e: Edge) => e.target === node.id)
|
||||
const parentNodeId = incomingEdge?.source || 'root'
|
||||
const isFirstBranchNode = incomingEdge?.sourceHandle === 'bottom'
|
||||
|
||||
if (isFirstBranchNode) {
|
||||
if (!branchesMap.has(parentNodeId)) {
|
||||
// 🆕 从现有分支数据中恢复元数据
|
||||
const existingMetadata = existingBranchesMap.get(node.id)
|
||||
|
||||
branchesMap.set(parentNodeId, {
|
||||
nodes: [],
|
||||
edges: [],
|
||||
branchContent: existingMetadata?.branchContent || '分支',
|
||||
branchType: existingMetadata?.branchType || (parentNodeId === 'root' ? 'root' : 'task'),
|
||||
createdAt: Date.now(),
|
||||
tasks: existingMetadata?.tasks //
|
||||
})
|
||||
}
|
||||
|
||||
// 收集该分支的所有节点(从第一个节点开始,通过 right handle 连接的节点)
|
||||
const branchNodes: Node[] = []
|
||||
let currentNode: Node | undefined = node
|
||||
|
||||
while (currentNode) {
|
||||
branchNodes.push(currentNode)
|
||||
|
||||
// 查找通过 right handle 连接的下一个节点
|
||||
const outgoingEdge = edges.value.find(
|
||||
(e: Edge) => e.source === currentNode!.id && e.sourceHandle === 'right'
|
||||
)
|
||||
if (outgoingEdge) {
|
||||
currentNode = currentBranchNodes.find((n: Node) => n.id === outgoingEdge.target)
|
||||
} else {
|
||||
currentNode = undefined
|
||||
}
|
||||
}
|
||||
|
||||
// 添加所有分支节点
|
||||
branchNodes.forEach((n: Node) => {
|
||||
if (
|
||||
!branchesMap
|
||||
.get(parentNodeId)!
|
||||
.nodes.find((existingNode: Node) => existingNode.id === n.id)
|
||||
) {
|
||||
branchesMap.get(parentNodeId)!.nodes.push(n)
|
||||
}
|
||||
})
|
||||
|
||||
// 找到该分支的所有边
|
||||
branchNodes.forEach((branchNode: Node) => {
|
||||
const branchEdges = edges.value.filter(
|
||||
(e: Edge) => e.source === branchNode.id || e.target === branchNode.id
|
||||
)
|
||||
branchEdges.forEach((edge: Edge) => {
|
||||
if (!branchesMap.get(parentNodeId)!.edges.find((e: Edge) => e.id === edge.id)) {
|
||||
branchesMap.get(parentNodeId)!.edges.push(edge)
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
// 保存所有分支到 store(使用深拷贝)
|
||||
branchesMap.forEach((branchData, parentNodeId) => {
|
||||
// 🆕 优先使用恢复的 tasks 数据,如果没有才重新创建
|
||||
let tasks = branchData.tasks
|
||||
|
||||
if (!tasks || tasks.length === 0) {
|
||||
// 转换节点数据为 IRawStepTask 格式
|
||||
tasks = branchData.nodes.map((node: Node) => ({
|
||||
Id: node.id,
|
||||
StepName: node.data.actionTypeName,
|
||||
TaskContent: node.data.agentDescription,
|
||||
InputObject_List: [],
|
||||
OutputObject: '',
|
||||
AgentSelection: [node.data.agentName],
|
||||
Collaboration_Brief_frontEnd: {
|
||||
template: '',
|
||||
data: {}
|
||||
} as any,
|
||||
TaskProcess: []
|
||||
}))
|
||||
} else {
|
||||
}
|
||||
|
||||
selectionStore.addTaskProcessBranch(taskStepId, currentAgents, {
|
||||
parentNodeId,
|
||||
branchContent: JSON.parse(JSON.stringify(branchData.branchContent)),
|
||||
branchType: JSON.parse(JSON.stringify(branchData.branchType)),
|
||||
nodes: JSON.parse(JSON.stringify(branchData.nodes)),
|
||||
edges: JSON.parse(JSON.stringify(branchData.edges)),
|
||||
tasks: JSON.parse(JSON.stringify(tasks)) // 🆕 优先使用恢复的 tasks
|
||||
})
|
||||
})
|
||||
|
||||
// 延迟重置标志,避免连续触发
|
||||
setTimeout(() => {
|
||||
isSyncing = false
|
||||
}, 100)
|
||||
}
|
||||
|
||||
// 监听节点和边的变化,同步到 store
|
||||
// ⚠️ 已禁用自动同步,因为会导致分支ID变化,sessionStorage中保存的选中分支无法恢复
|
||||
// 分支数据在添加分支时就已经保存到store了,不需要在nodes/edges变化时重新同步
|
||||
// watch(
|
||||
// [nodes, edges],
|
||||
// () => {
|
||||
// // 如果正在同步,跳过
|
||||
// if (isSyncing) return
|
||||
|
||||
// // 只在有分支节点时才同步
|
||||
// const hasBranchNodes = nodes.value.some((n: Node) => n.data.isBranchTask)
|
||||
// if (hasBranchNodes && currentTask.value) {
|
||||
// syncBranchesToStore()
|
||||
// }
|
||||
// },
|
||||
// { deep: true }
|
||||
// )
|
||||
|
||||
// 组件挂载后初始化
|
||||
onMounted(() => {
|
||||
if (currentTask.value) {
|
||||
@@ -556,7 +401,7 @@ const cancelAddBranch = () => {
|
||||
branchInput.value = ''
|
||||
}
|
||||
|
||||
// 🆕 节点点击事件
|
||||
// 节点点击事件
|
||||
const onNodeClick = (event: any) => {
|
||||
const nodeId = event.node.id
|
||||
const nodeData = event.node.data as any
|
||||
@@ -571,10 +416,10 @@ const onNodeClick = (event: any) => {
|
||||
|
||||
if (isBranchNode) {
|
||||
// 点击的是分支节点
|
||||
// 🆕 向上回溯分支父节点链(多级分支)
|
||||
// 向上回溯分支父节点链(多级分支)
|
||||
const branchParentChain = getBranchParentChain(nodeId)
|
||||
|
||||
// 🆕 向下遍历分支的子节点(只沿right handle方向)
|
||||
// 向下遍历分支的子节点(只沿right handle方向)
|
||||
const branchChildNodes = getAllBranchNodes(nodeId)
|
||||
|
||||
// 找到最顶层的分支父节点(连接到主流程或根节点的)
|
||||
@@ -599,7 +444,7 @@ const onNodeClick = (event: any) => {
|
||||
// 回溯到根节点,获取主流程路径
|
||||
const pathToRoot = getPathToRoot(parentNodeId)
|
||||
|
||||
// 🔧 getPathToRoot 已经返回正序(从左到右),不需要反转
|
||||
// getPathToRoot 已经返回正序(从左到右),不需要反转
|
||||
const correctPathToRoot = pathToRoot // [agent-0, agent-1, agent-2, ...]
|
||||
const correctBranchParentChain = [...branchParentChain].reverse() // 顶层分支 → ... → 直接父分支(正序)
|
||||
|
||||
@@ -611,27 +456,18 @@ const onNodeClick = (event: any) => {
|
||||
]
|
||||
selectedNodeIds.value = new Set(allNodesToHighlight)
|
||||
|
||||
console.log('📋 路径顺序(从上到下、从左到右):', {
|
||||
pathToRoot: correctPathToRoot,
|
||||
branchParentChain: correctBranchParentChain,
|
||||
branchChildNodes: branchChildNodes,
|
||||
total: allNodesToHighlight.length
|
||||
})
|
||||
|
||||
// 🆕 保存完整的 TaskProcess 数据(主流程 + 分支)到 store
|
||||
// 保存完整的 TaskProcess 数据(主流程 + 分支)到 store
|
||||
if (currentTask.value) {
|
||||
const completeTaskProcess: any[] = []
|
||||
|
||||
// 🆕 从 store 中获取"初始流程"副本(而不是使用 taskProcess.value)
|
||||
// 从 store 中获取"初始流程"副本(而不是使用 taskProcess.value)
|
||||
const taskStepId = currentTask.value.Id
|
||||
const currentAgents = currentTask.value.AgentSelection || []
|
||||
const branches = selectionStore.getTaskProcessBranches(taskStepId, currentAgents)
|
||||
const initialBranch = branches.find(branch => branch.branchContent === '初始流程')
|
||||
const mainProcessData = initialBranch?.tasks || taskProcess.value
|
||||
|
||||
console.log('🔍 开始按高亮路径收集数据,总节点数:', allNodesToHighlight.length)
|
||||
|
||||
// 🆕 按照高亮路径顺序收集每个节点的数据
|
||||
// 按照高亮路径顺序收集每个节点的数据
|
||||
allNodesToHighlight.forEach(nodeId => {
|
||||
const node = nodes.value.find(n => n.id === nodeId)
|
||||
|
||||
@@ -644,7 +480,6 @@ const onNodeClick = (event: any) => {
|
||||
const processData = mainProcessData[originalIndex]
|
||||
if (processData && processData.ID && processData.AgentName && processData.Description) {
|
||||
completeTaskProcess.push(processData)
|
||||
console.log(` 📦 添加主流程节点: ${nodeId}, 索引: ${originalIndex}`)
|
||||
}
|
||||
} else if (node.data.isBranchTask) {
|
||||
// 分支节点:从对应的分支数据中获取(按索引匹配)
|
||||
@@ -657,25 +492,19 @@ const onNodeClick = (event: any) => {
|
||||
const taskData = parentBranch.tasks[nodeIndex]
|
||||
if (taskData.ID && taskData.AgentName && taskData.Description) {
|
||||
completeTaskProcess.push(taskData)
|
||||
console.log(
|
||||
` 📦 添加分支节点: ${nodeId}, 分支: ${parentBranch.branchContent}, 索引: ${nodeIndex}`
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
console.log(`✅ 数据收集完成,总任务数: ${completeTaskProcess.length}`)
|
||||
|
||||
// 🆕 找到当前点击节点所属的分支,用于保存选中状态
|
||||
// 找到当前点击节点所属的分支,用于保存选中状态
|
||||
const matchedBranch = branches.find(branch => {
|
||||
return branch.nodes.some(node => node.id === nodeId)
|
||||
})
|
||||
|
||||
if (matchedBranch) {
|
||||
sessionStorage.setItem(LAST_SELECTED_BRANCH_KEY, matchedBranch.id)
|
||||
console.log(`💾 保存选中的分支ID: ${matchedBranch.id}`)
|
||||
}
|
||||
|
||||
selectionStore.setActiveTaskProcessData(
|
||||
@@ -691,14 +520,14 @@ const onNodeClick = (event: any) => {
|
||||
selectedNodeIds.value = new Set(allBranchNodes)
|
||||
}
|
||||
} else {
|
||||
// 🆕 点击的是主流程节点,高亮所有主流程节点(初始流程)
|
||||
// 点击的是主流程节点,高亮所有主流程节点(初始流程)
|
||||
const mainProcessNodes = nodes.value
|
||||
.filter(n => !n.data.isBranchTask && n.id !== 'root')
|
||||
.map(n => n.id)
|
||||
|
||||
selectedNodeIds.value = new Set(mainProcessNodes)
|
||||
|
||||
// 🆕 点击主流程节点时,从 store 读取"初始流程"分支的副本
|
||||
// 点击主流程节点时,从 store 读取"初始流程"分支的副本
|
||||
if (currentTask.value) {
|
||||
const taskStepId = currentTask.value.Id
|
||||
if (!taskStepId) {
|
||||
@@ -712,17 +541,17 @@ const onNodeClick = (event: any) => {
|
||||
// 使用 store 中保存的初始流程副本
|
||||
selectionStore.setActiveTaskProcessData(taskStepId, currentAgents, initialBranch.tasks)
|
||||
|
||||
// 🆕 同步更新 currentTask.TaskProcess(实现全局数据联动)
|
||||
// 同步更新 currentTask.TaskProcess(实现全局数据联动)
|
||||
agentsStore.setCurrentTaskProcess(initialBranch.tasks)
|
||||
|
||||
// 🆕 保存选中的分支ID到 sessionStorage
|
||||
// 保存选中的分支ID到 sessionStorage
|
||||
sessionStorage.setItem(LAST_SELECTED_BRANCH_KEY, initialBranch.id)
|
||||
} else {
|
||||
// 降级:使用 taskProcess.value
|
||||
const originalTaskProcess = taskProcess.value
|
||||
selectionStore.setActiveTaskProcessData(taskStepId, currentAgents, originalTaskProcess)
|
||||
|
||||
// 🆕 同步更新 currentTask.TaskProcess(实现全局数据联动)
|
||||
// 同步更新 currentTask.TaskProcess(实现全局数据联动)
|
||||
agentsStore.setCurrentTaskProcess(originalTaskProcess)
|
||||
}
|
||||
}
|
||||
@@ -747,8 +576,8 @@ const submitBranch = async () => {
|
||||
branchLoading.value = true
|
||||
|
||||
try {
|
||||
// ==================== 移动已有分支 ====================
|
||||
// 🆕 只移动在当前父节点下方的分支节点(Y坐标 > 父节点Y坐标)
|
||||
// 移动已有分支
|
||||
// 只移动在当前父节点下方的分支节点(Y坐标 > 父节点Y坐标)
|
||||
const parentNodeY = parentNode.position.y
|
||||
|
||||
// 查找所有已有的分支任务节点(标记为 isBranchTask)
|
||||
@@ -761,10 +590,6 @@ const submitBranch = async () => {
|
||||
|
||||
const branchIdsBelowParent = branchesBelowParent.map((n: Node) => n.id)
|
||||
|
||||
console.log(
|
||||
`📍 移动了 ${branchIdsBelowParent.length} 个分支(Y坐标 > ${parentNodeY}),总共 ${allExistingBranchNodes.length} 个分支`
|
||||
)
|
||||
|
||||
// 将当前父节点下方的分支向下移动250px(通过创建新节点来触发响应式更新)
|
||||
nodes.value = nodes.value.map((node: Node) => {
|
||||
if (branchIdsBelowParent.includes(node.id)) {
|
||||
@@ -779,7 +604,7 @@ const submitBranch = async () => {
|
||||
return node
|
||||
})
|
||||
|
||||
// 💾 同步更新 store 中保存的分支位置
|
||||
// 同步更新 store 中保存的分支位置
|
||||
if (currentTask.value?.Id) {
|
||||
const taskStepId = currentTask.value.Id
|
||||
const currentAgents = currentTask.value.AgentSelection || []
|
||||
@@ -800,21 +625,21 @@ const submitBranch = async () => {
|
||||
|
||||
// 判断是根节点还是 agent 节点
|
||||
if (parentNodeId === 'root') {
|
||||
// ========== 根节点分支 ==========
|
||||
// 根节点分支
|
||||
let newAgentActions: IApiAgentAction[] = []
|
||||
|
||||
if (USE_MOCK_DATA) {
|
||||
// 使用 Mock API
|
||||
const generalGoal = agentsStore.agentRawPlan.data?.['General Goal'] || ''
|
||||
|
||||
// 🆕 根节点分支:从零开始生成完整方案
|
||||
// 根节点分支:从零开始生成完整方案
|
||||
// Baseline_Completion = 0 表示没有已完成的部分,需要生成所有阶段
|
||||
// Existing_Steps 传空数组,不传递初始流程信息
|
||||
const response = await api.mockBranchTaskProcess({
|
||||
branch_Number: 1,
|
||||
Modification_Requirement: branchContent,
|
||||
Existing_Steps: [], // ← 根节点分支不传递现有步骤
|
||||
Baseline_Completion: 0, // ← 从零开始
|
||||
Existing_Steps: [], // ← 根节点分支不传递现有步骤
|
||||
Baseline_Completion: 0, // ← 从零开始
|
||||
stepTaskExisting: currentTask.value,
|
||||
goal: generalGoal
|
||||
})
|
||||
@@ -842,14 +667,14 @@ const submitBranch = async () => {
|
||||
// 调用真实 API
|
||||
const generalGoal = agentsStore.agentRawPlan.data?.['General Goal'] || ''
|
||||
|
||||
// 🆕 根节点分支:从零开始生成完整方案
|
||||
// 根节点分支:从零开始生成完整方案
|
||||
// Baseline_Completion = 0 表示没有已完成的部分,需要生成所有阶段
|
||||
// Existing_Steps 传空数组,不传递初始流程信息
|
||||
const response = await api.branchTaskProcess({
|
||||
branch_Number: 1,
|
||||
Modification_Requirement: branchContent,
|
||||
Existing_Steps: [], // ← 根节点分支不传递现有步骤
|
||||
Baseline_Completion: 0, // ← 从零开始
|
||||
Existing_Steps: [], // ← 根节点分支不传递现有步骤
|
||||
Baseline_Completion: 0, // ← 从零开始
|
||||
stepTaskExisting: currentTask.value,
|
||||
goal: generalGoal
|
||||
})
|
||||
@@ -933,7 +758,14 @@ const submitBranch = async () => {
|
||||
targetHandle: 'left',
|
||||
type: 'smoothstep',
|
||||
animated: true,
|
||||
style: { stroke: '#67c23a', strokeWidth: 2, strokeDasharray: '5,5' }
|
||||
style: { stroke: '#67c23a', strokeWidth: 2, strokeDasharray: '5,5' },
|
||||
markerEnd: {
|
||||
type: 'arrow' as any,
|
||||
color: '#43a8aa',
|
||||
width: 20,
|
||||
height: 20,
|
||||
strokeWidth: 2
|
||||
}
|
||||
}
|
||||
edges.value.push(newEdge)
|
||||
newBranchEdges.push(newEdge)
|
||||
@@ -948,14 +780,21 @@ const submitBranch = async () => {
|
||||
targetHandle: 'left',
|
||||
type: 'smoothstep',
|
||||
animated: true,
|
||||
style: { stroke: '#67c23a', strokeWidth: 2 }
|
||||
style: { stroke: '#67c23a', strokeWidth: 2 },
|
||||
markerEnd: {
|
||||
type: 'arrow' as any,
|
||||
color: '#43a8aa',
|
||||
width: 20,
|
||||
height: 20,
|
||||
strokeWidth: 2
|
||||
}
|
||||
}
|
||||
edges.value.push(newEdge)
|
||||
newBranchEdges.push(newEdge)
|
||||
}
|
||||
})
|
||||
|
||||
// 📂 保存分支数据到 store
|
||||
// 保存分支数据到 store
|
||||
if (newBranchNodes.length > 0) {
|
||||
// 将 IApiAgentAction 转换为 TaskProcess 格式用于存储
|
||||
// 与 fill-step-task-mock.ts 中的 TaskProcess 格式保持一致
|
||||
@@ -986,7 +825,7 @@ const submitBranch = async () => {
|
||||
}
|
||||
}
|
||||
} else {
|
||||
// ========== Agent 节点分支 ==========
|
||||
// Agent 节点分支
|
||||
const parentIsBranchTask = parentNode.data.isBranchTask || false
|
||||
const parentOriginalIndex = parentNode.data.originalIndex ?? 0
|
||||
let newAgentActions: IApiAgentAction[] = []
|
||||
@@ -996,7 +835,7 @@ const submitBranch = async () => {
|
||||
const generalGoal = agentsStore.agentRawPlan.data?.['General Goal'] || ''
|
||||
const currentTaskProcess = taskProcess.value || []
|
||||
|
||||
// 🆕 根据父节点类型构建 existingSteps
|
||||
// 根据父节点类型构建 existingSteps
|
||||
let existingSteps: any[] = []
|
||||
let baselineCompletion = 100
|
||||
|
||||
@@ -1078,7 +917,7 @@ const submitBranch = async () => {
|
||||
const generalGoal = agentsStore.agentRawPlan.data?.['General Goal'] || ''
|
||||
const currentTaskProcess = taskProcess.value || []
|
||||
|
||||
// 🆕 根据父节点类型构建 existingSteps
|
||||
// 根据父节点类型构建 existingSteps
|
||||
let existingSteps: any[] = []
|
||||
let baselineCompletion = 100
|
||||
|
||||
@@ -1135,7 +974,6 @@ const submitBranch = async () => {
|
||||
goal: generalGoal
|
||||
})
|
||||
|
||||
console.log('branchTaskProcess response:', response)
|
||||
// 后端返回格式: [[action1, action2], [action3, action4]]
|
||||
// 取第一个分支
|
||||
if (response && response.length > 0) {
|
||||
@@ -1215,7 +1053,14 @@ const submitBranch = async () => {
|
||||
targetHandle: 'left',
|
||||
type: 'smoothstep',
|
||||
animated: true,
|
||||
style: { stroke: '#409eff', strokeWidth: 2, strokeDasharray: '5,5' }
|
||||
style: { stroke: '#409eff', strokeWidth: 2, strokeDasharray: '5,5' },
|
||||
markerEnd: {
|
||||
type: 'arrow' as any,
|
||||
color: '#43a8aa',
|
||||
width: 20,
|
||||
height: 20,
|
||||
strokeWidth: 2
|
||||
}
|
||||
}
|
||||
edges.value.push(newEdge)
|
||||
newBranchEdges.push(newEdge)
|
||||
@@ -1230,17 +1075,22 @@ const submitBranch = async () => {
|
||||
targetHandle: 'left',
|
||||
type: 'smoothstep',
|
||||
animated: true,
|
||||
style: { stroke: '#409eff', strokeWidth: 2 }
|
||||
style: { stroke: '#409eff', strokeWidth: 2 },
|
||||
markerEnd: {
|
||||
type: 'arrow' as any,
|
||||
color: '#43a8aa',
|
||||
width: 20,
|
||||
height: 20,
|
||||
strokeWidth: 2
|
||||
}
|
||||
}
|
||||
edges.value.push(newEdge)
|
||||
newBranchEdges.push(newEdge)
|
||||
}
|
||||
})
|
||||
|
||||
// 📂 保存分支数据到 store
|
||||
// 保存分支数据到 store
|
||||
if (newBranchNodes.length > 0) {
|
||||
// 将 IApiAgentAction 转换为 TaskProcess 格式用于存储
|
||||
// 与 fill-step-task-mock.ts 中的 TaskProcess 格式保持一致
|
||||
const branchTasks = newAgentActions.map(action => ({
|
||||
ID: action.id || uuidv4(),
|
||||
ActionType: action.type,
|
||||
@@ -1317,9 +1167,6 @@ onConnect(params => addEdges(params))
|
||||
@node-click="onNodeClick"
|
||||
class="vue-flow-container"
|
||||
>
|
||||
<!-- <Background /> -->
|
||||
<!-- <Controls /> -->
|
||||
|
||||
<template #node-root="nodeProps">
|
||||
<div class="root-task-node-wrapper">
|
||||
<Handle type="source" :position="Position.Right" id="right" />
|
||||
@@ -1645,7 +1492,7 @@ onConnect(params => addEdges(params))
|
||||
|
||||
.el-input__inner {
|
||||
font-size: 13px;
|
||||
color: var(--color-text-primary);
|
||||
color: #000;
|
||||
padding-right: 40px;
|
||||
}
|
||||
}
|
||||
@@ -1684,7 +1531,7 @@ onConnect(params => addEdges(params))
|
||||
opacity: 0.9;
|
||||
transition: all 0.2s ease;
|
||||
|
||||
// 🆕 分支选中高亮样式
|
||||
// 分支选中高亮样式
|
||||
&.is-branch-selected {
|
||||
box-shadow: 0 0 0 3px #000, 0 0 20px rgba(0, 0, 0, 0.5);
|
||||
z-index: 10;
|
||||
@@ -1719,17 +1566,6 @@ onConnect(params => addEdges(params))
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.vue-flow__controls) {
|
||||
button {
|
||||
background-color: #43a8aa;
|
||||
border-color: #43a8aa;
|
||||
|
||||
&:hover {
|
||||
background-color: #358d8f;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 智能体悬浮提示样式 */
|
||||
:deep(.agent-tooltip-popper) {
|
||||
z-index: 4000 !important;
|
||||
|
||||
@@ -12,21 +12,19 @@ const props = defineProps<{
|
||||
step?: any
|
||||
}>()
|
||||
|
||||
// 获取分支数量 - 主分支(1) + 额外分支数量
|
||||
// 获取分支数量
|
||||
const branchCount = computed(() => {
|
||||
if (!props.step?.Id) return 1
|
||||
|
||||
// 获取该任务步骤的分支数据
|
||||
const taskStepId = props.step.Id
|
||||
// 🆕 获取该任务的 agent 组合
|
||||
// 获取该任务的 agent 组合
|
||||
const agents = props.step.AgentSelection || []
|
||||
const branches = selectionStore.getTaskProcessBranches(taskStepId, agents)
|
||||
|
||||
// 主分支(1) + 额外分支数量
|
||||
return branches.length || 1
|
||||
})
|
||||
|
||||
// 🆕 判断按钮是否可点击(只有当前按钮对应的任务是任务大纲中选中的任务时才可点击)
|
||||
// 判断按钮是否可点击
|
||||
const isClickable = computed(() => {
|
||||
if (!props.step?.Id || !agentsStore.currentTask?.Id) {
|
||||
return false
|
||||
@@ -35,7 +33,7 @@ const isClickable = computed(() => {
|
||||
})
|
||||
|
||||
const handleClick = (event?: MouseEvent) => {
|
||||
// 🆕 只有可点击时才执行操作
|
||||
// 只有可点击时才执行操作
|
||||
if (!isClickable.value) {
|
||||
return
|
||||
}
|
||||
@@ -102,7 +100,7 @@ const handleClick = (event?: MouseEvent) => {
|
||||
filter: brightness(0.9);
|
||||
}
|
||||
|
||||
// 🆕 禁用状态
|
||||
// 禁用状态
|
||||
&.is-disabled {
|
||||
background-color: #bdc3c7;
|
||||
cursor: not-allowed;
|
||||
|
||||
Reference in New Issue
Block a user