feat:三个窗口接口联调版本

frontend/src/layout/components/Main/TaskTemplate/TaskProcess/ProcessCard.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref } from 'vue'
+import { ref, computed } from 'vue'
 import { getActionTypeDisplay } from '@/layout/components/config.ts'
 import { useAgentsStore } from '@/stores'
 import BranchButton from './components/TaskButton.vue'
@@ -23,6 +23,20 @@ const emit = defineEmits<{
   (e: 'save-edit', stepId: string, processId: string, value: string): void
 }>()
 
+// 🔄 从 currentTask 中获取数据（与分支切换联动）
+const currentTaskProcess = computed(() => {
+  // ✅ 优先使用 currentTask（包含分支切换后的数据）
+  const currentTask = agentsStore.currentTask
+  if (currentTask && currentTask.Id === props.step.Id && currentTask.TaskProcess) {
+    return currentTask.TaskProcess
+  }
+
+  // ⚠️ 降级：从 agentRawPlan 中获取原始数据（不受分支切换影响）
+  const collaborationProcess = agentsStore.agentRawPlan.data?.['Collaboration Process'] || []
+  const rawData = collaborationProcess.find((task: any) => task.Id === props.step.Id)
+  return rawData?.TaskProcess || []
+})
+
 // 当前正在编辑的process ID
 const editingProcessId = ref<string | null>(null)
 // 编辑框的值
@@ -30,6 +44,17 @@ 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)
+  }
+}
+
 // 检测当前是否是深色模式
 function isDarkMode(): boolean {
   return document.documentElement.classList.contains('dark')
@@ -116,12 +141,12 @@ function handleCancel() {
 </script>
 
 <template>
-  <div class="process-card">
+  <div class="process-card" @click="handleCardClick">
     <div class="process-content">
       <!-- 显示模式 -->
       <div class="display-content">
         <span
-          v-for="process in step.TaskProcess"
+          v-for="process in currentTaskProcess"
           :key="process.ID"
           class="process-segment"
           @mouseenter="handleMouseEnter(process.ID)"
@@ -190,10 +215,13 @@ function handleCancel() {
             {{ process.Description }}
           </span>
 
-          <span class="separator" v-if="!process.Description.endsWith('。')">。</span>
+          <span class="separator" v-if="process.Description && !process.Description.endsWith('。')"
+            >。</span
+          >
         </span>
       </div>
     </div>
+    <!-- 按钮点击不会冒泡到卡片 -->
     <BranchButton :step="step" />
   </div>
 </template>
@@ -207,6 +235,8 @@ function handleCancel() {
   background: var(--color-bg-list);
   border: 1px solid var(--color-border-default);
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+  cursor: pointer;
+  transition: all 0.2s ease;
 
   .process-content {
     min-height: 20px;