Web优化 1

web/src/views/projects/components/RequirementHistoryPanel.vue

@@ -191,7 +191,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, onMounted, ref } from 'vue'
+import { computed, onMounted, ref, watch } from 'vue'
 import { useRouter } from 'vue-router'
 import {
   NCard,
@@ -263,21 +263,31 @@ const hasAnyContent = computed(() =>
 )
 
 // 默认展开有内容的第一项（优先当前阶段）
-const defaultExpandedNames = computed(() => {
-  const names: (ArtifactPhase | 'conversations' | 'acp-sessions')[] = []
-  if (props.currentPhase && (ARTIFACT_PHASES as Phase[]).includes(props.currentPhase)) {
-    const cp = props.currentPhase as ArtifactPhase
-    if (artifactsByPhase.value[cp].length > 0) names.push(cp)
-  }
-  for (const phase of ARTIFACT_PHASES) {
-    if (artifactsByPhase.value[phase].length > 0 && !names.includes(phase)) {
-      names.push(phase)
+const defaultExpandedNames = ref<(ArtifactPhase | 'conversations' | 'acp-sessions')[]>([])
+watch(
+  [
+    () => props.currentPhase,
+    () => artifacts.value.length,
+    () => conversations.value.length,
+    () => acpSessions.value.length,
+  ],
+  () => {
+    const names: (ArtifactPhase | 'conversations' | 'acp-sessions')[] = []
+    if (props.currentPhase && (ARTIFACT_PHASES as Phase[]).includes(props.currentPhase)) {
+      const cp = props.currentPhase as ArtifactPhase
+      if (artifactsByPhase.value[cp].length > 0) names.push(cp)
     }
-  }
-  if (conversations.value.length > 0) names.push('conversations')
-  if (acpSessions.value.length > 0) names.push('acp-sessions')
-  return names.slice(0, 2) // 最多默认展开前两项，避免过长
-})
+    for (const phase of ARTIFACT_PHASES) {
+      if (artifactsByPhase.value[phase].length > 0 && !names.includes(phase)) {
+        names.push(phase)
+      }
+    }
+    if (conversations.value.length > 0) names.push('conversations')
+    if (acpSessions.value.length > 0) names.push('acp-sessions')
+    defaultExpandedNames.value = names.slice(0, 2) // 最多默认展开前两项，避免过长
+  },
+  { immediate: true },
+)
 
 const renderedArtifact = computed(() =>
   selectedArtifact.value ? md.render(selectedArtifact.value.content) : '',