sillyspec 3.7.14 → 3.7.16

package/packages/dashboard/src/components/detail/DocsDetail.vue

@@ -0,0 +1,48 @@
+<template>
+  <div v-if="data?.length" class="px-4 py-3">
+    <div v-for="group in data" :key="group.key" class="mb-4">
+      <h4 class="text-[9px] font-semibold uppercase tracking-[0.2em] mb-2 font-[JetBrains_Mono,monospace]" style="color: #6B7280;">
+        {{ group.icon }} {{ group.label }} ({{ group.files.length }})
+      </h4>
+      <div class="space-y-1">
+        <div
+          v-for="f in group.files"
+          :key="f.path"
+          class="flex items-center gap-2 px-2 py-1.5 rounded text-[11px] cursor-pointer hover:bg-[#FEF3C7] transition-colors"
+          @click="$emit('open-file', f)"
+        >
+          <svg class="w-3 h-3 flex-shrink-0" fill="none" stroke="#9CA3AF" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
+          </svg>
+          <span class="truncate" style="color: #1C1C1E;">{{ f.name }}</span>
+          <span class="ml-auto flex-shrink-0 font-mono text-[10px]" style="color: #9CA3AF;">{{ formatSize(f.size) }}</span>
+          <span class="flex-shrink-0 text-[10px]" style="color: #9CA3AF;">{{ relativeTime(f.mtime) }}</span>
+        </div>
+      </div>
+    </div>
+  </div>
+  <n-empty v-else description="无文档" style="padding: 48px 0;" />
+</template>
+
+<script setup>
+defineProps({ data: { type: Array, default: () => [] } })
+defineEmits(['open-file'])
+
+function formatSize(bytes) {
+  if (!bytes) return '—'
+  if (bytes < 1024) return bytes + ' B'
+  if (bytes < 1048576) return (bytes / 1024).toFixed(1) + ' KB'
+  return (bytes / 1048576).toFixed(1) + ' MB'
+}
+
+function relativeTime(iso) {
+  if (!iso) return ''
+  const d = new Date(iso)
+  const diff = Date.now() - d.getTime()
+  if (diff < 60000) return '刚刚'
+  if (diff < 3600000) return `${Math.floor(diff / 60000)} 分钟前`
+  if (diff < 86400000) return `${Math.floor(diff / 3600000)} 小时前`
+  if (diff < 604800000) return `${Math.floor(diff / 86400000)} 天前`
+  return `${d.getMonth() + 1}/${d.getDate()}`
+}
+</script>

package/packages/dashboard/src/components/detail/GitDetail.vue

@@ -0,0 +1,61 @@
+<template>
+  <div v-if="data" class="px-4 py-3">
+    <!-- Branch -->
+    <div class="mb-4">
+      <h4 class="text-[9px] font-semibold uppercase tracking-[0.2em] mb-1.5 font-[JetBrains_Mono,monospace]" style="color: #6B7280;">当前分支</h4>
+      <div class="text-[18px] font-bold font-[JetBrains_Mono,monospace]" style="color: #D97706;">{{ data.branch || '—' }}</div>
+    </div>
+
+    <!-- Commits -->
+    <div v-if="data.commits?.length" class="mb-4">
+      <h4 class="text-[9px] font-semibold uppercase tracking-[0.2em] mb-2 font-[JetBrains_Mono,monospace]" style="color: #6B7280;">最近提交</h4>
+      <div class="space-y-2">
+        <div v-for="c in data.commits" :key="c.hash" class="px-3 py-2 rounded-md" style="background: #F5F5F7;">
+          <div class="flex items-center gap-2">
+            <span class="text-[11px] font-mono font-semibold" style="color: #D97706;">{{ c.hash }}</span>
+            <span class="text-[11px] flex-1 truncate" style="color: #1C1C1E;">{{ c.message }}</span>
+          </div>
+          <div class="flex items-center gap-2 mt-1 text-[10px]" style="color: #6B7280;">
+            <span>{{ c.author }}</span>
+            <span>·</span>
+            <span>{{ relativeTime(c.date) }}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- Untracked -->
+    <div v-if="data.untracked?.length">
+      <h4 class="text-[9px] font-semibold uppercase tracking-[0.2em] mb-2 font-[JetBrains_Mono,monospace]" style="color: #6B7280;">未提交文件</h4>
+      <div class="space-y-1">
+        <div v-for="f in data.untracked" :key="f.file" class="flex items-center gap-2 px-2 py-1 rounded text-[11px] font-[JetBrains_Mono,monospace]">
+          <span class="font-semibold w-5 text-center" :style="{ color: statusColor(f.status) }">{{ f.status }}</span>
+          <span class="truncate" style="color: #1C1C1E;">{{ f.file }}</span>
+        </div>
+      </div>
+    </div>
+  </div>
+  <n-empty v-else description="无 Git 信息" style="padding: 48px 0;" />
+</template>
+
+<script setup>
+defineProps({ data: { type: Object, default: null } })
+
+function statusColor(s) {
+  if (s.includes('M')) return '#F59E0B'
+  if (s.includes('A') || s === '?') return '#10B981'
+  if (s.includes('D')) return '#EF4444'
+  return '#9CA3AF'
+}
+
+function relativeTime(iso) {
+  if (!iso) return ''
+  const d = new Date(iso)
+  const diff = Date.now() - d.getTime()
+  if (diff < 60000) return '刚刚'
+  if (diff < 3600000) return `${Math.floor(diff / 60000)} 分钟前`
+  if (diff < 86400000) return `${Math.floor(diff / 3600000)} 小时前`
+  if (diff < 604800000) return `${Math.floor(diff / 86400000)} 天前`
+  return `${d.getMonth() + 1}/${d.getDate()}`
+}
+</script>

package/packages/dashboard/src/components/detail/TechDetail.vue

@@ -0,0 +1,43 @@
+<template>
+  <div v-if="data" class="px-4 py-3">
+    <!-- Frameworks -->
+    <div v-if="data.frameworks?.length" class="mb-4">
+      <h4 class="text-[9px] font-semibold uppercase tracking-[0.2em] mb-2 font-[JetBrains_Mono,monospace]" style="color: #6B7280;">识别框架</h4>
+      <div class="flex flex-wrap gap-2">
+        <n-tag v-for="f in data.frameworks" :key="f" type="warning" size="small" round>{{ f }}</n-tag>
+      </div>
+    </div>
+
+    <!-- Dependencies -->
+    <div v-if="depEntries.length" class="mb-4">
+      <h4 class="text-[9px] font-semibold uppercase tracking-[0.2em] mb-2 font-[JetBrains_Mono,monospace]" style="color: #6B7280;">dependencies ({{ depEntries.length }})</h4>
+      <div class="space-y-1">
+        <div v-for="[name, ver] in depEntries" :key="name" class="flex items-center gap-2 px-2 py-1 rounded text-[11px]" style="background: #F5F5F7;">
+          <span class="font-mono font-medium truncate" style="color: #1C1C1E;">{{ name }}</span>
+          <span class="font-mono ml-auto flex-shrink-0" style="color: #9CA3AF;">{{ ver }}</span>
+        </div>
+      </div>
+    </div>
+
+    <!-- Dev Dependencies -->
+    <div v-if="devDepEntries.length">
+      <h4 class="text-[9px] font-semibold uppercase tracking-[0.2em] mb-2 font-[JetBrains_Mono,monospace]" style="color: #6B7280;">devDependencies ({{ devDepEntries.length }})</h4>
+      <div class="space-y-1">
+        <div v-for="[name, ver] in devDepEntries" :key="name" class="flex items-center gap-2 px-2 py-1 rounded text-[11px]" style="background: #F5F5F7;">
+          <span class="font-mono font-medium truncate" style="color: #1C1C1E;">{{ name }}</span>
+          <span class="font-mono ml-auto flex-shrink-0" style="color: #9CA3AF;">{{ ver }}</span>
+        </div>
+      </div>
+    </div>
+  </div>
+  <n-empty v-else description="无依赖信息" style="padding: 48px 0;" />
+</template>
+
+<script setup>
+import { computed } from 'vue'
+
+const props = defineProps({ data: { type: Object, default: null } })
+
+const depEntries = computed(() => props.data ? Object.entries(props.data.dependencies || {}) : [])
+const devDepEntries = computed(() => props.data ? Object.entries(props.data.devDependencies || {}) : [])
+</script>

package/packages/dashboard/src/main.js

@@ -1,5 +1,8 @@
 import { createApp } from 'vue'
+import naive from 'naive-ui'
 import App from './App.vue'
 import './style.css'
 
-createApp(App).mount('#app')
+const app = createApp(App)
+app.use(naive)
+app.mount('#app')

package/packages/dashboard/src/style.css

@@ -1,20 +1,20 @@
 @import "tailwindcss";
 
 @theme {
-  --color-bg: #111318;
-  --color-primary: #FBBF24;
-  --color-primary-dim: #B45309;
-  --color-warning: #FB923C;
-  --color-danger: #EF4444;
-  --color-muted: #8B8FA3;
-  --color-surface: #1A1D24;
-  --color-surface-2: #23272F;
-  --color-border: #2E3340;
-  --color-border-light: #3D4455;
-  --color-text: #EAEAEF;
-  --color-text-secondary: #B0B4C3;
-  --color-info: #38BDF8;
-  --color-success: #34D399;
+  --color-bg: #F5F5F7;
+  --color-primary: #D97706;
+  --color-primary-dim: #92400E;
+  --color-warning: #EA580C;
+  --color-danger: #DC2626;
+  --color-muted: #6B7280;
+  --color-surface: #FFFFFF;
+  --color-surface-2: #F0F0F3;
+  --color-border: #E5E5EA;
+  --color-border-light: #D1D1D6;
+  --color-text: #1C1C1E;
+  --color-text-secondary: #636366;
+  --color-info: #2563EB;
+  --color-success: #16A34A;
 
   --font-display: 'JetBrains Mono', monospace;
   --font-body: 'DM Sans', sans-serif;

package/src/index.js

@@ -4,7 +4,7 @@
  * SillySpec CLI — 安装工具
  *
  * 只负责两件事：init（安装命令模板）和 setup（安装 MCP 工具）。
- * 状态管理由 AI 直接读文件（STATE.md）完成，不需要 CLI。
+ * 状态管理通过 progress.json 完成，使用 `sillyspec progress` 命令。
  */
 import { existsSync, readdirSync, readFileSync, statSync } from 'fs';
 import { join, resolve } from 'path';
@@ -25,11 +25,15 @@ SillySpec CLI — 规范驱动开发工具包
     [--dir <path>]             指定目录
   sillyspec setup [--list]     安装推荐 MCP 工具
     [--list]                   查看已安装状态
-  sillyspec progress <cmd>    进度恢复管理
-    init                      初始化进度文件
-    status                    查看当前进度
-    validate                  校验并修复进度文件
-    reset [--stage X]         重置进度（全部或指定阶段）
+  sillyspec progress <cmd>    进度管理
+    init                      初始化 progress.json
+    show                      查看当前进度
+    set-stage <stage>         设置当前阶段
+    add-step <stage> <name>   添加步骤
+    update-step <s> <n> --status <st> [--output <t>]
+    complete-stage <stage>    完成阶段并推进
+    validate                  校验并修复
+    reset [--stage X]         重置进度
     complete --stage X        归档已完成阶段
   sillyspec docs migrate       迁移旧文档到统一结构
     sillyspec dashboard          启动 Dashboard Web UI
@@ -93,6 +97,11 @@ async function main() {
   }
 
   const command = filteredArgs[0];
+  // 支持 sillyspec init /path/to/project 语法：如果第二个参数看起来像路径，当作 targetDir
+  if (command === 'init' && filteredArgs[1] && !filteredArgs[1].startsWith('-')) {
+    targetDir = resolve(filteredArgs[1]);
+    filteredArgs.splice(1, 1);
+  }
   const dir = targetDir;
 
   if (!existsSync(dir)) {
@@ -119,7 +128,8 @@ async function main() {
           pm.init(dir);
           break;
         case 'status':
-          pm.status(dir);
+        case 'show':
+          pm.show(dir);
           break;
         case 'validate':
           pm.validate(dir);
@@ -130,8 +140,40 @@ async function main() {
         case 'complete':
           pm.complete(dir, stage);
           break;
+        case 'set-stage': {
+          const setStageName = filteredArgs[2];
+          if (!setStageName) { console.log('❌ 用法: sillyspec progress set-stage <stage>'); break; }
+          pm.setStage(dir, setStageName);
+          break;
+        }
+        case 'add-step': {
+          const addStepStage = filteredArgs[2];
+          const addStepName = filteredArgs[3];
+          if (!addStepStage || !addStepName) { console.log('❌ 用法: sillyspec progress add-step <stage> <step-name>'); break; }
+          pm.addStep(dir, addStepStage, addStepName);
+          break;
+        }
+        case 'update-step': {
+          const updStepStage = filteredArgs[2];
+          const updStepName = filteredArgs[3];
+          if (!updStepStage || !updStepName) { console.log('❌ 用法: sillyspec progress update-step <stage> <step-name> --status <status> [--output <text>]'); break; }
+          // Parse --status and --output from args
+          let updStatus = null, updOutput = undefined;
+          for (let ai = 0; ai < args.length; ai++) {
+            if (args[ai] === '--status' && args[ai + 1]) { updStatus = args[ai + 1]; ai++; }
+            if (args[ai] === '--output' && args[ai + 1]) { updOutput = args[ai + 1]; ai++; }
+          }
+          pm.updateStep(dir, updStepStage, updStepName, { status: updStatus, output: updOutput });
+          break;
+        }
+        case 'complete-stage': {
+          const compStageName = filteredArgs[2];
+          if (!compStageName) { console.log('❌ 用法: sillyspec progress complete-stage <stage>'); break; }
+          pm.completeStage(dir, compStageName);
+          break;
+        }
         default:
-          console.log('用法: sillyspec progress <init|status|validate|reset|complete> [--stage <stage>]');
+          console.log('用法: sillyspec progress <init|show|validate|reset|complete|set-stage|add-step|update-step|complete-stage>');
       }
       break;
     }
@@ -145,6 +187,11 @@ async function main() {
       }
       break;
     }
+    case 'run': {
+      const { runCommand } = await import('./run.js')
+      runCommand(filteredArgs.slice(1), dir)
+      break
+    }
     case 'dashboard': {
       // Parse dashboard options
       let port = 3456;