sillyspec 3.9.1 → 3.10.0

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

@@ -1,178 +1,152 @@
 <template>
-  <div v-if="project" class="project-overview">
-    <!-- Name + Path -->
-    <div class="ov-section">
-      <span class="ov-name">{{ project.name }}</span>
-      <span class="ov-path">{{ shortPath }}</span>
+  <div class="overview-section">
+    <!-- 头部 -->
+    <div class="section-header">
+      <h1 class="section-title">
+        项目概览
+        <span class="badge">{{ projects.length }} 个项目</span>
+      </h1>
+      <div class="section-actions">
+        <button class="btn btn-icon" title="刷新" @click="refresh">↻</button>
+        <button class="btn btn-secondary" @click="resetLayout">重置布局</button>
+      </div>
     </div>
-    <div class="ov-divider" />
 
-    <!-- Tech Stack -->
-    <div class="ov-section ov-clickable" @click="$emit('show-detail', 'tech')">
-      <span class="ov-label">技术栈</span>
-      <span v-for="t in overview.techStack" :key="t" class="ov-tag">{{ t }}</span>
-    </div>
-    <div class="ov-divider" />
-
-    <!-- Stage -->
-    <div v-if="project.state?.currentStage" class="ov-section">
-      <span class="ov-label">阶段</span>
-      <span class="ov-value">{{ project.state.currentStage }}</span>
-    </div>
-    <div v-else-if="project.state" class="ov-section">
-      <span class="ov-label">阶段</span>
-      <span class="ov-value" style="color:#9CA3AF;">未执行</span>
-    </div>
-    <div v-if="project.state?.currentStage" class="ov-divider" />
-
-    <!-- Last Active -->
-    <div v-if="overview.lastActive" class="ov-section">
-      <span class="ov-label">最近活跃</span>
-      <span class="ov-value">{{ formatTime(overview.lastActive) }}</span>
-    </div>
-    <div v-if="overview.lastActive" class="ov-divider" />
-
-    <!-- Doc Stats -->
-    <div v-if="overview.docStats.total > 0" class="ov-section ov-clickable" @click="$emit('show-detail', 'docs')">
-      <span class="ov-label">文档</span>
-      <span class="ov-value">{{ docSummary }}</span>
-    </div>
-    <div v-if="overview.docStats.total > 0" class="ov-divider" />
-
-    <!-- Git -->
-    <div class="ov-section ov-git ov-clickable" @click="$emit('show-detail', 'git')">
-      <span v-if="overview.git.branch" class="ov-branch">{{ overview.git.branch }}</span>
-      <span v-if="overview.git.lastCommit" class="ov-commit" :title="overview.git.lastCommit">{{ truncate(overview.git.lastCommit, 40) }}</span>
-      <span v-if="overview.git.dirtyCount > 0" class="ov-dirty">{{ overview.git.dirtyCount }} 未提交</span>
+    <!-- 卡片容器 -->
+    <div class="cards-container">
+      <ProjectCard
+        v-for="project in projects"
+        :key="project.name"
+        :project="project"
+        :is-selected="activeProject?.name === project.name"
+        @select="handleSelect"
+      />
     </div>
   </div>
 </template>
 
 <script setup>
-import { computed } from 'vue'
+import { defineProps, defineEmits } from 'vue'
+import ProjectCard from './ProjectCard.vue'
+import { useLayout } from '../composables/useLayout.js'
 
 const props = defineProps({
-  project: { type: Object, default: null }
+  projects: { type: Array, default: () => [] },
+  activeProject: { type: Object, default: null }
 })
 
-defineEmits(['show-detail'])
-
-const overview = computed(() => props.project?.overview || { techStack: [], lastActive: null, docStats: { design: 0, plan: 0, archive: 0, changes: 0, scan: 0, quicklog: 0, total: 0 }, git: { branch: '', lastCommit: '', dirtyCount: 0 } })
-
-const shortPath = computed(() => {
-  const p = props.project?.path || ''
-  return p.replace(/^\/Users\/[^/]+/, '~')
-})
+const emit = defineEmits(['select'])
 
-const docSummary = computed(() => {
-  const s = overview.value.docStats
-  const parts = []
-  if (s.design) parts.push(`设计 ${s.design}`)
-  if (s.plan) parts.push(`计划 ${s.plan}`)
-  if (s.archive) parts.push(`归档 ${s.archive}`)
-  if (s.changes) parts.push(`变更 ${s.changes}`)
-  return parts.join(' / ') || `${s.total} 篇`
-})
+function handleSelect(project) {
+  emit('select', project)
+}
 
-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)} 小时前`
-  if (diffMs < 604800000) return `${Math.floor(diffMs / 86400000)} 天前`
-  return `${d.getMonth() + 1}/${d.getDate()}`
+function refresh() {
+  // TODO: 实现刷新逻辑
+  window.location.reload()
 }
 
-function truncate(s, n) {
-  return s.length > n ? s.slice(0, n) + '…' : s
+function resetLayout() {
+  if (confirm('确定要重置布局吗？')) {
+    useLayout().resetLayout()
+  }
 }
 </script>
 
 <style scoped>
-.project-overview {
+.overview-section {
+  height: 100%;
+  background: #FFFFFF;
+  padding: 16px 24px;
+  display: flex;
+  flex-direction: column;
+}
+
+.section-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 16px;
+}
+
+.section-title {
+  font-size: 18px;
+  font-weight: 600;
+  color: #1A1A1A;
   display: flex;
   align-items: center;
-  background: #FFFFFF;
-  border-bottom: 1px solid #E5E5EA;
-  padding: 8px 16px;
-  min-height: 48px;
   gap: 8px;
-  flex-shrink: 0;
-  overflow-x: auto;
 }
-.ov-section {
+
+.badge {
+  font-size: 12px;
+  padding: 2px 8px;
+  background: #E5E7EB;
+  border-radius: 10px;
+  color: #6B7280;
+  font-weight: 500;
+}
+
+.section-actions {
   display: flex;
+  gap: 8px;
   align-items: center;
-  gap: 6px;
-  white-space: nowrap;
-  flex-shrink: 0;
 }
-.ov-clickable {
+
+.btn {
+  padding: 6px 12px;
+  border-radius: 6px;
+  border: none;
   cursor: pointer;
-  border-radius: 4px;
-  padding: 2px 6px;
-  margin: -2px -6px;
-  transition: background 0.15s;
+  font-size: 13px;
+  font-weight: 500;
+  transition: all 0.2s;
 }
-.ov-clickable:hover {
-  background: rgba(217,119,6,0.06);
+
+.btn:hover {
+  opacity: 0.9;
 }
-.ov-name {
-  font-weight: 600;
-  font-size: 13px;
-  color: #1C1C1E;
+
+.btn-secondary {
+  background: #E5E7EB;
+  color: #374151;
 }
-.ov-path {
-  font-size: 11px;
-  color: #636366;
+
+.btn-icon {
+  padding: 6px;
+  width: 32px;
+  height: 32px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: #F3F4F6;
+  border-radius: 6px;
 }
-.ov-label {
-  font-size: 11px;
-  color: #636366;
+
+.btn-icon:hover {
+  background: #E5E7EB;
 }
-.ov-value {
-  font-size: 12px;
-  color: #1C1C1E;
-  font-weight: 500;
+
+.cards-container {
+  flex: 1;
+  display: flex;
+  gap: 16px;
+  overflow-x: auto;
+  overflow-y: hidden;
+  padding-bottom: 8px;
 }
-.ov-tag {
-  font-size: 10px;
-  padding: 1px 8px;
-  border-radius: 10px;
-  background: rgba(217,119,6,0.08);
-  color: #D97706;
-  font-weight: 500;
+
+.cards-container::-webkit-scrollbar {
+  height: 8px;
 }
-.ov-divider {
-  width: 1px;
-  height: 20px;
-  background: #E5E5EA;
-  flex-shrink: 0;
-}
-.ov-git {
-  margin-left: auto;
-  gap: 10px;
-}
-.ov-branch {
-  font-size: 11px;
-  color: #636366;
-  background: #F5F5F7;
-  padding: 1px 8px;
+
+.cards-container::-webkit-scrollbar-track {
+  background: #F3F4F6;
   border-radius: 4px;
 }
-.ov-commit {
-  font-size: 11px;
-  color: #636366;
-  max-width: 200px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-.ov-dirty {
-  font-size: 11px;
-  color: #D97706;
-  font-weight: 500;
+
+.cards-container::-webkit-scrollbar-thumb {
+  background: #D1D5DB;
+  border-radius: 4px;
 }
 </style>

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

@@ -0,0 +1,61 @@
+<template>
+  <div
+    class="v-resize-handle"
+    :class="{ 'dragging': isDragging }"
+    @mousedown="handleMouseDown"
+  >
+    <div class="drag-indicator"></div>
+  </div>
+</template>
+
+<script setup>
+const props = defineProps({
+  isDragging: { type: Boolean, default: false }
+})
+
+const emit = defineEmits(['drag-start', 'drag-end', 'resize'])
+
+function handleMouseDown(e) {
+  emit('drag-start', { type: 'vertical', startY: e.clientY })
+
+  const onMove = (ev) => {
+    emit('resize', { deltaY: ev.clientY - e.clientY })
+  }
+
+  const onUp = () => {
+    emit('drag-end')
+    window.removeEventListener('mousemove', onMove)
+    window.removeEventListener('mouseup', onUp)
+  }
+
+  window.addEventListener('mousemove', onMove)
+  window.addEventListener('mouseup', onUp)
+}
+</script>
+
+<style scoped>
+.v-resize-handle {
+  height: 6px;
+  background: #2A3040;
+  cursor: row-resize;
+  position: relative;
+  transition: background 0.2s;
+}
+
+.v-resize-handle:hover,
+.v-resize-handle.dragging {
+  background: #D97706;
+}
+
+.drag-indicator {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  width: 40px;
+  height: 4px;
+  background: rgba(255, 255, 255, 0.3);
+  border-radius: 2px;
+  pointer-events: none;
+}
+</style>

package/packages/dashboard/src/composables/useDashboard.js

@@ -125,8 +125,35 @@ export function useDashboard() {
       const updated = getProject(state.activeProject.path)
       if (updated) {
         state.activeProject = updated
+        return
       }
     }
+
+    state.activeProject = state.projects[0] || null
+  }
+
+  /**
+   * Merge a single project update into the current project list.
+   * @param {object} project - Partial project payload containing at least path
+   */
+  function updateProject(project) {
+    if (!project?.path) return
+
+    const index = state.projects.findIndex(p => p.path === project.path)
+    if (index === -1) return
+
+    const updated = {
+      ...state.projects[index],
+      ...project,
+      state: project.state ?? state.projects[index].state,
+      overview: project.overview ?? state.projects[index].overview
+    }
+
+    state.projects.splice(index, 1, updated)
+
+    if (state.activeProject?.path === project.path) {
+      state.activeProject = updated
+    }
   }
 
   /**
@@ -169,6 +196,7 @@ export function useDashboard() {
     openPanel,
     closePanel,
     updateProjects,
+    updateProject,
     setExecuting,
     isExecuting,
     activeProjectName,

package/packages/dashboard/src/composables/useLayout.js

@@ -0,0 +1,131 @@
+/**
+ * 布局管理 Composable
+ * 管理双层布局的概览/详情比例和三栏宽度
+ */
+import { reactive, ref, onMounted } from 'vue'
+
+const STORAGE_KEY = 'dashboard-layout-v2'
+
+// 默认值
+const DEFAULT_OVERVIEW_HEIGHT = 30 // 概览区域百分比
+const DEFAULT_COLUMN_WIDTHS = [33.33, 33.33, 33.33] // 三栏宽度百分比
+
+// 最小值限制
+const MIN_OVERVIEW_HEIGHT = 15
+const MAX_OVERVIEW_HEIGHT = 75
+const MIN_COLUMN_WIDTH = 10
+
+/**
+ * 布局管理 Hook
+ */
+export function useLayout() {
+  // 布局状态
+  const layout = reactive({
+    overviewHeight: DEFAULT_OVERVIEW_HEIGHT,
+    columnWidths: [...DEFAULT_COLUMN_WIDTHS]
+  })
+
+  // 拖动状态
+  const isDragging = ref(false)
+  const dragType = ref(null) // 'vertical' | 'horizontal'
+
+  /**
+   * 加载保存的布局
+   */
+  function loadLayout() {
+    try {
+      const saved = localStorage.getItem(STORAGE_KEY)
+      if (saved) {
+        const parsed = JSON.parse(saved)
+        if (parsed.overviewHeight !== undefined) {
+          layout.overviewHeight = Math.max(MIN_OVERVIEW_HEIGHT, Math.min(MAX_OVERVIEW_HEIGHT, parsed.overviewHeight))
+        }
+        if (Array.isArray(parsed.columnWidths) && parsed.columnWidths.length === 3) {
+          layout.columnWidths = parsed.columnWidths
+        }
+      }
+    } catch (e) {
+      console.error('Failed to load layout:', e)
+      // 使用默认值
+      resetLayout()
+    }
+  }
+
+  /**
+   * 保存布局到 localStorage
+   */
+  function saveLayout() {
+    try {
+      localStorage.setItem(STORAGE_KEY, JSON.stringify({
+        overviewHeight: layout.overviewHeight,
+        columnWidths: layout.columnWidths
+      }))
+    } catch (e) {
+      console.error('Failed to save layout:', e)
+    }
+  }
+
+  /**
+   * 重置布局为默认值
+   */
+  function resetLayout() {
+    layout.overviewHeight = DEFAULT_OVERVIEW_HEIGHT
+    layout.columnWidths = [...DEFAULT_COLUMN_WIDTHS]
+    saveLayout()
+  }
+
+  /**
+   * 设置概览区域高度（百分比）
+   */
+  function setOverviewHeight(percent) {
+    layout.overviewHeight = Math.max(MIN_OVERVIEW_HEIGHT, Math.min(MAX_OVERVIEW_HEIGHT, percent))
+    saveLayout()
+  }
+
+  /**
+   * 设置列宽度（索引，百分比）
+   */
+  function setColumnWidth(index, percent) {
+    if (index >= 0 && index < 3) {
+      layout.columnWidths[index] = Math.max(MIN_COLUMN_WIDTH, percent)
+      saveLayout()
+    }
+  }
+
+  /**
+   * 开始拖动
+   */
+  function startDrag(type) {
+    isDragging.value = true
+    dragType.value = type
+    document.body.classList.add('resizing')
+  }
+
+  /**
+   * 结束拖动
+   */
+  function endDrag() {
+    isDragging.value = false
+    dragType.value = null
+    document.body.classList.remove('resizing')
+    saveLayout()
+  }
+
+  // 组件挂载时加载布局
+  onMounted(() => {
+    loadLayout()
+  })
+
+  return {
+    layout,
+    isDragging,
+    dragType,
+    loadLayout,
+    saveLayout,
+    resetLayout,
+    setOverviewHeight,
+    setColumnWidth,
+    startDrag,
+    endDrag
+  }
+}

package/src/index.js

@@ -34,6 +34,10 @@ SillySpec CLI — 规范驱动开发工具包
     --change <name>            设置当前变更名
     auto                       连续推进 brainstorm→plan→execute→verify
 
+  可选阶段:
+    scan, brainstorm, plan, execute, verify, archive
+    quick, explore, status, doctor
+
   sillyspec progress <cmd>     进度记录（轻量，不强制顺序）
     init                       初始化 progress.json
     show                       查看当前进度
@@ -56,7 +60,10 @@ SillySpec CLI — 规范驱动开发工具包
 
 示例:
   sillyspec init
+  sillyspec run scan
   sillyspec run brainstorm
+  sillyspec run quick
+  sillyspec run explore
   sillyspec run brainstorm --done --output "需求已澄清"
   sillyspec setup --list
   sillyspec dashboard --port 8080 --no-open

package/src/init.js

@@ -27,11 +27,10 @@ function copyDirSync(src, dst) {
 
 
 
-const VALID_TOOLS = ['claude', 'claude_skills', 'cursor', 'openclaw', 'codex', 'gemini', 'opencode'];
+const VALID_TOOLS = ['claude', 'cursor', 'openclaw', 'codex', 'gemini', 'opencode'];
 
 const TOOL_LABELS = {
   claude: 'Claude Code',
-  claude_skills: 'Claude Skills',
   cursor: 'Cursor',
   openclaw: 'OpenClaw',
   codex: 'OpenAI Codex (通过 AGENTS.md)',
@@ -87,7 +86,6 @@ function injectInstructions(tool, projectDir) {
 function detectTools(projectDir) {
   const found = [];
   if (existsSync(join(projectDir, '.claude'))) found.push('claude');
-  if (existsSync(join(projectDir, '.claude', 'skills'))) found.push('claude_skills');
   if (existsSync(join(projectDir, '.cursor'))) found.push('cursor');
   if (existsSync(join(projectDir, '.openclaw'))) found.push('openclaw');
   if (existsSync(join(projectDir, 'AGENTS.md'))) found.push('codex');
@@ -121,7 +119,7 @@ async function doInstall(projectDir, tools, subprojects = []) {
     writeFileSync(projectYamlPath, `name: ${projectName}\npath: .\nstatus: active\n`);
   }
 
-  // 创建 docs/<projectName>/scan/ 子目录（代码扫描结果）
+  // 创建 .sillyspec/docs/<projectName>/scan/ 子目录（代码扫描结果）
   const scanDir = join(projectDir, '.sillyspec', 'docs', projectName, 'scan');
   mkdirSync(scanDir, { recursive: true });
   const gitkeepPath = join(scanDir, '.gitkeep');
@@ -185,17 +183,26 @@ async function doInstall(projectDir, tools, subprojects = []) {
     }
   }
 
-  // 复制 skills 到 .claude/skills/（给 Claude Code 使用）
-  const claudeSkillsDir = join(projectDir, '.claude', 'skills');
+  // 复制 skills 到各工具目录
+  const skillToolDirs = {
+    claude: '.claude/skills',
+    codex: '.codex/skills',
+    openclaw: '.openclaw/skills',
+    opencode: '.opencode/skills',
+  }
   const skillsSource = join(__dirname, '..', '.claude', 'skills');
   if (existsSync(skillsSource)) {
     const sillyspecSkills = readdirSync(skillsSource).filter(f => f.startsWith('sillyspec-') && statSync(join(skillsSource, f)).isDirectory());
     if (sillyspecSkills.length > 0) {
-      mkdirSync(claudeSkillsDir, { recursive: true });
-      for (const skill of sillyspecSkills) {
-        copyDirSync(join(skillsSource, skill), join(claudeSkillsDir, skill));
+      for (const [tool, dir] of Object.entries(skillToolDirs)) {
+        if (!tools.includes(tool)) continue
+        const targetDir = join(projectDir, dir)
+        mkdirSync(targetDir, { recursive: true })
+        for (const skill of sillyspecSkills) {
+          copyDirSync(join(skillsSource, skill), join(targetDir, skill))
+        }
+        console.log(chalk.green(`    ✓ ${TOOL_LABELS[tool]} skills 已同步 (${sillyspecSkills.length} 个)`))
       }
-      console.log(chalk.green('    ✓ Claude Code skills 已同步 (' + sillyspecSkills.length + ' 个)'));
     }
   } else {
     console.log(chalk.yellow('    ⚠ 未找到 skills 目录（npm 包内无 .claude/skills/），跳过同步'));

package/src/migrate.js

@@ -3,7 +3,7 @@ import { basename, join, resolve } from 'path';
 import chalk from 'chalk';
 
 /**
- * Migrate old .sillyspec/ structure to unified docs/<project>/ structure
+ * Migrate old .sillyspec/ structure to unified .sillyspec/docs/<project>/ structure
  * @param {string} projectDir - Path to the project directory
  */
 export function migrateDocs(projectDir) {
@@ -29,7 +29,7 @@ export function migrateDocs(projectDir) {
   const docsBase = join(sillyspecDir, 'docs', projectName);
   let migrated = 0;
 
-  // 1. codebase/ → docs/<project>/scan/
+  // 1. codebase/ → .sillyspec/docs/<project>/scan/
   const codebaseDir = join(sillyspecDir, 'codebase');
   if (existsSync(codebaseDir)) {
     const targetDir = join(docsBase, 'scan');
@@ -50,7 +50,7 @@ export function migrateDocs(projectDir) {
 
   // 2. specs/ is deprecated — designs live in changes/<变更名>/design.md
 
-  // 3. changes/archive/ → docs/<project>/archive/
+  // 3. changes/archive/ → .sillyspec/docs/<project>/archive/
   const archiveDir = join(sillyspecDir, 'changes', 'archive');
   if (existsSync(archiveDir)) {
     const targetDir = join(docsBase, 'archive');
@@ -69,7 +69,7 @@ export function migrateDocs(projectDir) {
     }
   }
 
-  // 4. knowledge/ → docs/<project>/archive/ (append knowledge files)
+  // 4. knowledge/ → .sillyspec/docs/<project>/archive/ (append knowledge files)
   const knowledgeDir = join(sillyspecDir, 'knowledge');
   if (existsSync(knowledgeDir)) {
     const targetDir = join(docsBase, 'archive');
@@ -88,7 +88,7 @@ export function migrateDocs(projectDir) {
     }
   }
 
-  // 5. quicklog/ → docs/<project>/quicklog/
+  // 5. quicklog/ → .sillyspec/docs/<project>/quicklog/
   const quicklogDir = join(sillyspecDir, 'quicklog');
   if (existsSync(quicklogDir)) {
     const targetDir = join(docsBase, 'quicklog');

package/src/progress.js

@@ -14,7 +14,7 @@ const PROGRESS_FILE = 'progress.json';
 const BACKUP_FILE = 'progress.json.bak';
 
 const CURRENT_VERSION = 2;
-const VALID_STAGES = ['brainstorm', 'plan', 'execute', 'verify', 'scan', 'quick', 'archive'];
+const VALID_STAGES = ['scan', 'brainstorm', 'plan', 'execute', 'verify', 'archive', 'quick', 'explore'];
 const VALID_STATUSES = ['pending', 'in-progress', 'completed', 'failed', 'blocked'];
 
 const STAGE_LABELS = {
@@ -24,6 +24,7 @@ const STAGE_LABELS = {
   verify: '🔍 验证确认',
   scan: '🔍 代码扫描',
   quick: '⚡ 快速任务',
+  explore: '🧭 自由探索',
   archive: '📦 归档变更',
 };