sillyspec 3.26.4 → 3.26.5

package/packages/dashboard/src/components/LogStream.vue

@@ -1,65 +0,0 @@
-<template>
-  <div class="flex flex-col h-full" style="background: #F5F5F7;">
-    <!-- Header -->
-    <div class="px-3 py-2 flex items-center gap-2" style="border-bottom: 1px solid #F0F0F3;">
-      <n-input v-model:value="searchQuery" size="tiny" placeholder="过滤日志..." clearable style="flex: 1;" />
-      <n-button size="tiny" @click="clearLogs">清空</n-button>
-      <n-button size="tiny" :type="autoScroll ? 'primary' : 'default'" @click="toggleAutoScroll">
-        {{ autoScroll ? '自动' : '暂停' }}
-      </n-button>
-    </div>
-
-    <!-- Log output -->
-    <div ref="logContainer" class="flex-1 overflow-y-auto px-2 py-1.5 font-mono-log text-[10px]" style="background: #F0F0F3;" @scroll="handleScroll">
-      <div v-if="filteredLogs.length === 0" class="flex items-center justify-center h-full">
-        <span class="font-mono-log" style="color: #E5E5EA;">{{ logs.length === 0 ? '暂无日志' : '无匹配' }}</span>
-      </div>
-      <div v-else class="space-y-px">
-        <div v-for="log in filteredLogs" :key="log.id" class="px-1.5 py-px rounded-sm" :style="{ background: logBg(log.type) }">
-          <span style="color: #D1D1D6;" class="select-none">[{{ formatTime(log.timestamp) }}]</span>
-          <span :style="{ color: logColor(log.type) }">{{ escapeHtml(log.content) }}</span>
-        </div>
-      </div>
-    </div>
-
-    <!-- Footer -->
-    <div class="px-3 py-1 flex items-center justify-between text-[9px] font-mono-log" style="border-top: 1px solid #F0F0F3; background: #F5F5F7; color: #D1D1D6;">
-      <span>{{ filteredLogs.length }}/{{ logs.length }}</span>
-      <span v-if="!autoScroll" style="color: #EA580C;">已暂停</span>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { ref, computed, watch, nextTick } from 'vue'
-
-const props = defineProps({ logs: { type: Array, default: () => [] } })
-const emit = defineEmits(['clear'])
-
-const searchQuery = ref('')
-const autoScroll = ref(true)
-const logContainer = ref(null)
-
-const filteredLogs = computed(() => {
-  if (!searchQuery.value) return props.logs
-  const q = searchQuery.value.toLowerCase()
-  return props.logs.filter(l => l.content.toLowerCase().includes(q))
-})
-
-function formatTime(ts) { if (!ts) return ''; const d = new Date(ts); return d.toLocaleTimeString('zh-CN', { hour12: false }) }
-function escapeHtml(t) { if (!t) return ''; return t.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;') }
-function logBg(t) { return t === 'error' ? 'rgba(239,68,68,0.05)' : t === 'warn' ? 'rgba(251,146,60,0.05)' : 'transparent' }
-function logColor(t) { return t === 'error' ? '#DC2626' : t === 'warn' ? '#EA580C' : t === 'debug' ? '#6B7280' : '#636366' }
-function clearLogs() { emit('clear') }
-function toggleAutoScroll() { autoScroll.value = !autoScroll.value; if (autoScroll.value) scrollToBottom() }
-function handleScroll() {
-  if (!logContainer.value) return
-  const { scrollTop, scrollHeight, clientHeight } = logContainer.value
-  const atBottom = scrollHeight - scrollTop - clientHeight < 50
-  if (!atBottom && autoScroll.value) autoScroll.value = false
-  else if (atBottom && !autoScroll.value) autoScroll.value = true
-}
-function scrollToBottom() { nextTick(() => { if (logContainer.value && autoScroll.value) logContainer.value.scrollTop = logContainer.value.scrollHeight }) }
-watch(() => props.logs.length, () => { scrollToBottom() }, { flush: 'post' })
-watch(logContainer, () => { scrollToBottom() }, { once: true })
-</script>

package/packages/dashboard/src/components/PipelineStage.vue

@@ -1,95 +0,0 @@
-<template>
-  <div class="relative">
-    <div class="flex items-start gap-3">
-      <!-- Node indicator -->
-      <div class="flex flex-col items-center flex-shrink-0 pt-1.5">
-        <div
-          class="w-2 h-2 transition-colors duration-200"
-          :style="nodeStyle"
-          :class="{ 'animate-pulse-dot': isActive || status === 'in-progress' }"
-        />
-      </div>
-
-      <!-- Content -->
-      <div class="flex-1 min-w-0 -mt-0.5">
-        <!-- Stage Header -->
-        <div class="flex items-center gap-2.5 mb-3">
-          <span
-            class="text-[12px] font-semibold font-[JetBrains_Mono,monospace] tracking-tight"
-            :style="{ color: isActive ? '#D97706' : '#1C1C1E' }"
-          >
-            {{ title }}
-          </span>
-          <StageBadge :status="status" />
-        </div>
-
-        <!-- Steps -->
-        <div v-if="status === 'stale' && staleReason" class="mb-2 text-[10px] italic" style="color: #CA8A04;">
-          ⚠️ {{ staleReason }}
-          <span v-if="name === 'archive'">（已有归档文件保留但不再可信）</span>
-        </div>
-        <div v-if="status === 'revising' && revisionInfo" class="mb-2 text-[10px]" style="color: #7C3AED;">
-          🔧 {{ revisionInfo }}
-        </div>
-        <div class="space-y-1">
-          <div v-if="steps.length === 0" class="text-[11px] italic py-1" style="color: #6B7280;">
-            No steps yet
-          </div>
-          <StepCard
-            v-for="step in steps"
-            :key="step.id || step.name"
-            :step="step"
-            :is-active="isActiveStep(step)"
-            @select="$emit('select-step', $event)"
-          />
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { computed } from 'vue'
-import StageBadge from './StageBadge.vue'
-import StepCard from './StepCard.vue'
-
-const props = defineProps({
-  name: { type: String, required: true },
-  title: { type: String, required: true },
-  steps: { type: Array, default: () => [] },
-  status: { type: String, default: 'pending' },
-  isActive: { type: Boolean, default: false },
-  activeStep: { type: Object, default: null },
-  staleReason: { type: String, default: '' },
-  revision: { type: Number, default: 0 },
-  reopenedFromStep: { type: String, default: '' },
-})
-
-const emit = defineEmits(['select-step'])
-
-const revisionInfo = computed(() => {
-  if (!props.revision) return ''
-  const parts = [`revision ${props.revision}`]
-  if (props.reopenedFromStep) parts.push(`from: ${props.reopenedFromStep}`)
-  return parts.join(', ')
-})
-
-const nodeStyle = computed(() => {
-  if (props.isActive) return { background: '#D97706', boxShadow: '0 0 8px rgba(251,191,36,0.4)' }
-  const colors = {
-    'completed': '#16A34A',
-    'in-progress': '#D97706',
-    'blocked': '#EA580C',
-    'failed': '#DC2626',
-    'pending': '#E5E5EA',
-    'revising': '#7C3AED',
-    'stale': '#CA8A04',
-    'waiting': '#2563EB',
-  }
-  return { background: colors[props.status] || colors.pending }
-})
-
-function isActiveStep(step) {
-  return props.activeStep?.id === step.id || props.activeStep?.name === step.name
-}
-</script>

package/packages/dashboard/src/components/PipelineView.vue

@@ -1,156 +0,0 @@
-<template>
-  <div class="flex flex-col h-full" style="background: #F5F5F7;">
-    <!-- Header with Tabs -->
-    <div class="px-6 pt-4 pb-0" style="border-bottom: 1px solid #F0F0F3;">
-      <div class="flex items-center gap-6">
-        <h2 class="text-[11px] font-semibold uppercase tracking-[0.2em] font-[JetBrains_Mono,monospace]" style="color: #6B7280;">
-          {{ project?.name || '项目' }}
-        </h2>
-        <n-tabs :value="activeTab" type="segment" size="small" @update:value="$emit('switch-tab', $event)" style="max-width: 200px;">
-          <n-tab name="pipeline">流水线</n-tab>
-          <n-tab name="docs">文档</n-tab>
-        </n-tabs>
-      </div>
-    </div>
-
-    <!-- Pipeline Tab -->
-    <div v-if="activeTab === 'pipeline'" class="flex flex-col flex-1 overflow-hidden">
-      <div v-if="project && currentStage" class="px-6 pt-4 pb-2">
-        <p class="text-[12px] font-[JetBrains_Mono,monospace]" style="color: #636366;">
-          <span style="color: #D97706;">{{ currentStage }}</span>
-        </p>
-      </div>
-
-      <!-- Empty state -->
-      <n-empty v-if="!project || !project.state" description="选择一个项目查看流水线" style="margin: auto;" />
-
-      <!-- Stages -->
-      <div v-else class="flex-1 overflow-y-auto px-6 pb-5 space-y-5">
-        <PipelineStage name="scan" title="代码扫描" :steps="getStageSteps('scan')" :status="getStageStatus('scan')" :is-active="currentStage === 'scan'" :active-step="activeStep" @select-step="handleSelectStep" />
-        <div v-if="hasStage('brainstorm')" class="flex items-center pl-[3px]"><div class="w-px h-4" style="background: #F0F0F3;" /></div>
-        <PipelineStage name="brainstorm" title="头脑风暴" :steps="getStageSteps('brainstorm')" :status="getStageStatus('brainstorm')" :is-active="currentStage === 'brainstorm'" :active-step="activeStep" @select-step="handleSelectStep" />
-        <div v-if="hasStage('plan')" class="flex items-center pl-[3px]"><div class="w-px h-4" style="background: #F0F0F3;" /></div>
-        <PipelineStage name="plan" title="规划" :steps="getStageSteps('plan')" :status="getStageStatus('plan')" :is-active="currentStage === 'plan'" :active-step="activeStep" @select-step="handleSelectStep" />
-        <div v-if="hasStage('execute')" class="flex items-center pl-[3px]"><div class="w-px h-4" style="background: #F0F0F3;" /></div>
-        <PipelineStage name="execute" title="执行" :steps="getStageSteps('execute')" :status="getStageStatus('execute')" :is-active="currentStage === 'execute'" :active-step="activeStep" @select-step="handleSelectStep" />
-        <div v-if="hasStage('verify')" class="flex items-center pl-[3px]"><div class="w-px h-4" style="background: #F0F0F3;" /></div>
-        <PipelineStage name="verify" title="验证" :steps="getStageSteps('verify')" :status="getStageStatus('verify')" :is-active="currentStage === 'verify'" :active-step="activeStep" @select-step="handleSelectStep" />
-        <div v-if="hasStage('archive')" class="flex items-center pl-[3px]"><div class="w-px h-4" style="background: #F0F0F3;" /></div>
-        <PipelineStage name="archive" title="归档" :steps="getStageSteps('archive')" :status="getStageStatus('archive')" :is-active="currentStage === 'archive'" :active-step="activeStep" :stale-reason="getStageStaleReason('archive')" :revision="getStageRevision('archive')" :reopened-from-step="getStageReopenedFromStep('archive')" @select-step="handleSelectStep" />
-      </div>
-
-      <!-- Activity Log -->
-      <div v-if="project?.state?.progress" style="border-top: 1px solid #F0F0F3; background: rgba(0,0,0,0.03);">
-        <div class="px-6 py-2.5 flex items-center justify-between">
-          <div class="text-[9px] font-semibold uppercase tracking-[0.25em] font-[JetBrains_Mono,monospace]" style="color: #6B7280;">活动日志</div>
-          <div class="text-[10px] font-mono-log" style="color: #D1D1D6;">{{ activityLogs.length }}</div>
-        </div>
-        <div class="px-6 pb-3 max-h-32 overflow-y-auto">
-          <n-timeline size="small">
-            <n-timeline-item
-              v-for="(log, i) in activityLogs"
-              :key="i"
-              :type="log.status === 'completed' ? 'success' : (log.status === 'stale' ? 'warning' : (log.status === 'revising' ? 'info' : 'default'))"
-            >
-              <template #default>
-                <span class="text-[11px]" style="color: #636366;">{{ log.description }}</span>
-              </template>
-              <template #time>
-                <span class="text-[10px] font-mono-log" style="color: #D1D1D6;">{{ log.time }}</span>
-              </template>
-            </n-timeline-item>
-          </n-timeline>
-          <div v-if="activityLogs.length === 0" class="text-[10px] py-1" style="color: #D1D1D6;">暂无活动记录</div>
-        </div>
-      </div>
-    </div>
-
-    <!-- Docs Tab -->
-    <div v-if="activeTab === 'docs'" class="docs-panel flex-1 flex overflow-hidden">
-      <div class="docs-tree-pane flex-shrink-0 overflow-hidden" style="border-right: 1px solid #F0F0F3;">
-        <DocTree :groups="docs.groups" :selected-file="selectedDocFile" @select-file="$emit('select-doc-file', $event)" />
-      </div>
-      <div class="flex-1 overflow-hidden">
-        <DocPreview :content="docContent" :loading="docLoading" :selected-file="selectedDocFile" />
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { computed } from 'vue'
-import PipelineStage from './PipelineStage.vue'
-import DocTree from './DocTree.vue'
-import DocPreview from './DocPreview.vue'
-
-const props = defineProps({
-  project: { type: Object, default: null },
-  activeStep: { type: Object, default: null },
-  activeTab: { type: String, default: 'pipeline' },
-  docs: { type: Object, default: () => ({ groups: [] }) },
-  selectedDocFile: { type: Object, default: null },
-  docContent: { type: String, default: '' },
-  docLoading: { type: Boolean, default: false }
-})
-
-const emit = defineEmits(['select-step', 'switch-tab', 'select-doc-file'])
-
-const currentStage = computed(() => props.project?.state?.currentStage || '')
-const progress = computed(() => props.project?.state?.progress || {})
-const stages = computed(() => progress.value.stages || {})
-
-const stageNameMap = {
-  scan: '代码扫描',
-  brainstorm: '头脑风暴',
-  plan: '规划',
-  execute: '执行',
-  verify: '验证',
-  archive: '归档',
-  quick: '快速任务',
-  explore: '自由探索'
-}
-
-const activityLogs = computed(() => {
-  if (!props.project?.state) return []
-  const logs = []
-  for (const [name, data] of Object.entries(progress.value.stages || {})) {
-    const label = stageNameMap[name] || name
-    if (data.status === 'completed') logs.push({ time: data.completedAt ? formatTime(data.completedAt) : '--:--', status: 'completed', description: `${label} 已完成` })
-    else if (data.status === 'in-progress') logs.push({ time: '--:--', status: 'in-progress', description: `${label} 运行中` })
-    else if (data.status === 'revising') logs.push({ time: '--:--', status: 'revising', description: `${label} 修订中 (revision ${data.revision || 1})` })
-    else if (data.status === 'stale') logs.push({ time: '--:--', status: 'stale', description: `${label} 已失效：${data.staleReason || '上游修订'}` })
-  }
-  return logs.reverse()
-})
-
-function formatTime(iso) { try { const d = new Date(iso); return `${String(d.getHours()).padStart(2,'0')}:${String(d.getMinutes()).padStart(2,'0')}` } catch { return '--:--' } }
-function hasStage(n) { return !!stages.value[n] }
-function getStageSteps(n) { return stages.value[n]?.steps || [] }
-function getStageStatus(n) {
-  const s = stages.value[n]; if (!s) return 'pending'
-  // 优先用 stage 自身的 status（支持 revising/stale）
-  if (s.status === 'revising' || s.status === 'stale') return s.status
-  // 没有明确 status 时从 step 推导
-  const steps = s.steps || []
-  if (steps.some(x => x.status === 'failed')) return 'failed'
-  if (steps.some(x => x.status === 'blocked')) return 'blocked'
-  if (steps.some(x => x.status === 'in-progress')) return 'in-progress'
-  if (steps.every(x => x.status === 'completed')) return 'completed'
-  return 'pending'
-}
-function getStageStaleReason(n) { return stages.value[n]?.staleReason || '' }
-function getStageRevision(n) { return stages.value[n]?.revision || 0 }
-function getStageReopenedFromStep(n) { return stages.value[n]?.reopenedFromStep || '' }
-function handleSelectStep(step) { emit('select-step', step) }
-</script>
-
-<style scoped>
-.docs-panel {
-  min-height: 0;
-}
-
-.docs-tree-pane {
-  width: clamp(220px, 42%, 320px);
-  min-width: 180px;
-}
-</style>

package/packages/dashboard/src/components/ProjectCard.vue

@@ -1,187 +0,0 @@
-<template>
-  <div
-    class="project-card"
-    :class="{ selected: isSelected }"
-    @click="$emit('select', project)"
-  >
-    <!-- 卡片头部 -->
-    <div class="card-header">
-      <span class="project-name">{{ project.name }}</span>
-      <span class="last-active">{{ formatTime(project.lastActive) }}</span>
-    </div>
-
-    <!-- 阶段标签 -->
-    <div>
-      <span class="stage-badge" :class="stageClass">{{ stageLabel }}</span>
-    </div>
-
-    <!-- 进度条 -->
-    <div class="progress-section">
-      <div class="progress-bar">
-        <div class="progress-fill" :class="stageClass" :style="{ width: progressPercent + '%' }"></div>
-      </div>
-      <span class="progress-text">{{ progressPercent }}%</span>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { computed } from 'vue'
-
-const props = defineProps({
-  project: { type: Object, required: true },
-  isSelected: { type: Boolean, default: false }
-})
-
-defineEmits(['select'])
-
-const stageLabel = computed(() => {
-  const stage = props.project?.state?.currentStage
-  if (!stage) return '未开始'
-  const stageNames = {
-    brainstorm: '需求探索',
-    plan: '实现计划',
-    execute: '波次执行',
-    verify: '验证确认'
-  }
-  return stageNames[stage] || stage
-})
-
-const stageClass = computed(() => {
-  const stage = props.project?.state?.currentStage
-  if (!stage) return 'pending'
-  const progress = props.project?.state?.progress?.stages?.[stage]
-  if (progress?.status === 'completed') return 'completed'
-  if (progress?.status === 'in-progress') return 'in-progress'
-  return 'pending'
-})
-
-const progressPercent = computed(() => {
-  const stage = props.project?.state?.currentStage
-  if (!stage) return 0
-  const progress = props.project?.state?.progress?.stages?.[stage]
-  if (!progress) return 0
-  if (progress.completedSteps !== undefined && progress.steps !== undefined) {
-    return Math.round((progress.completedSteps / progress.steps) * 100)
-  }
-  if (progress.status === 'completed') return 100
-  if (progress.status === 'in-progress') return 50
-  return 0
-})
-
-function formatTime(iso) {
-  if (!iso) return '昨天'
-  const d = new Date(iso)
-  const now = new Date()
-  const diffMs = now - d
-  if (diffMs < 60000) return '刚刚'
-  if (diffMs < 3600000) return `${Math.floor(diffMs / 60000)}分钟前`
-  if (diffMs < 86400000) return `${Math.floor(diffMs / 3600000)}小时前`
-  return '昨天'
-}
-</script>
-
-<style scoped>
-.project-card {
-  width: 280px;
-  height: 120px;
-  background: white;
-  border: 2px solid #E5E7EB;
-  border-radius: 12px;
-  padding: 16px;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-  cursor: pointer;
-  transition: all 0.2s;
-  flex-shrink: 0;
-}
-
-.project-card:hover {
-  border-color: #D97706;
-  box-shadow: 0 4px 12px rgba(217, 119, 6, 0.15);
-}
-
-.project-card.selected {
-  border-color: #D97706;
-  box-shadow: 0 0 0 3px rgba(217, 119, 6, 0.2);
-}
-
-.card-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: flex-start;
-}
-
-.project-name {
-  font-size: 16px;
-  font-weight: 600;
-  color: #1A1A1A;
-}
-
-.last-active {
-  font-size: 11px;
-  color: #9CA3AF;
-}
-
-.stage-badge {
-  display: inline-block;
-  padding: 4px 10px;
-  border-radius: 12px;
-  font-size: 12px;
-  font-weight: 500;
-}
-
-.stage-badge.in-progress {
-  background: #DBEAFE;
-  color: #1D4ED8;
-}
-
-.stage-badge.completed {
-  background: #D1FAE5;
-  color: #047857;
-}
-
-.stage-badge.pending {
-  background: #F3F4F6;
-  color: #6B7280;
-}
-
-.progress-section {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.progress-bar {
-  flex: 1;
-  height: 6px;
-  background: #E5E7EB;
-  border-radius: 3px;
-  overflow: hidden;
-}
-
-.progress-fill {
-  height: 100%;
-  border-radius: 3px;
-  transition: width 0.3s;
-}
-
-.progress-fill.in-progress {
-  background: #3B82F6;
-}
-
-.progress-fill.completed {
-  background: #10B981;
-}
-
-.progress-fill.pending {
-  background: #9CA3AF;
-}
-
-.progress-text {
-  font-size: 12px;
-  font-weight: 600;
-  color: #374151;
-}
-</style>