原型阶段

web/src/views/projects/RequirementDetailView.vue

@@ -85,6 +85,99 @@
           </p>
         </NCard>
 
+        <!-- Prototypes -->
+        <NCard title="原型">
+          <div class="flex gap-4">
+            <!-- Version list -->
+            <div class="w-56 shrink-0">
+              <NList
+                v-if="prototypes.length > 0"
+                :show-divider="false"
+              >
+                <NListItem
+                  v-for="p in prototypes"
+                  :key="p.id"
+                >
+                  <NThing
+                    class="cursor-pointer"
+                    @click="onSelectPrototype(p.version)"
+                  >
+                    <template #header>
+                      <span
+                        class="text-sm font-medium"
+                        :class="selectedVersion === p.version ? 'text-blue-600' : ''"
+                      >v{{ p.version }}</span>
+                    </template>
+                    <template #header-extra>
+                      <span class="text-xs text-gray-400">
+                        {{ new Date(p.created_at).toLocaleString() }}
+                      </span>
+                    </template>
+                    <span
+                      v-if="p.note"
+                      class="text-xs text-gray-500"
+                    >{{ p.note }}</span>
+                  </NThing>
+                </NListItem>
+              </NList>
+              <NEmpty
+                v-else
+                description="暂无原型版本"
+                size="small"
+              />
+            </div>
+
+            <!-- Selected content -->
+            <div class="flex-1 min-w-0">
+              <p
+                v-if="selectedPrototype"
+                class="text-gray-700 whitespace-pre-wrap text-sm"
+              >
+                {{ selectedPrototype.content }}
+              </p>
+              <p
+                v-else
+                class="text-gray-400 text-sm"
+              >
+                选择左侧版本以查看内容
+              </p>
+            </div>
+          </div>
+
+          <!-- New version form -->
+          <NDivider />
+          <div
+            v-if="data.requirement.status === 'open'"
+            class="space-y-2"
+          >
+            <NInput
+              v-model:value="newContent"
+              type="textarea"
+              placeholder="原型内容"
+              :autosize="{ minRows: 4, maxRows: 12 }"
+            />
+            <NInput
+              v-model:value="newNote"
+              placeholder="备注（可选）"
+            />
+            <NButton
+              type="primary"
+              size="small"
+              :loading="submitting"
+              :disabled="!newContent.trim()"
+              @click="onSubmitPrototype"
+            >
+              提交新版本
+            </NButton>
+          </div>
+          <p
+            v-else
+            class="text-gray-400 text-sm"
+          >
+            需求已关闭，无法提交新版本
+          </p>
+        </NCard>
+
         <!-- Workspace card -->
         <NCard title="工作区">
           <NSelect
@@ -153,17 +246,20 @@ import {
   NListItem,
   NThing,
   NEmpty,
+  NInput,
+  NDivider,
 } from 'naive-ui'
 import AppShell from '@/layouts/AppShell.vue'
 import { projectsApi } from '@/api/projects'
 import { useRequirementsStore } from '@/stores/requirements'
 import { useWorkspacesStore } from '@/stores/workspaces'
-import type { Phase, RequirementDetail } from '@/api/projects'
+import type { Phase, Prototype, RequirementDetail } from '@/api/projects'
 
-const PHASES: Phase[] = ['planning', 'auditing', 'implementing', 'reviewing', 'done']
+const PHASES: Phase[] = ['planning', 'prototyping', 'auditing', 'implementing', 'reviewing', 'done']
 
 const PHASE_LABELS: Record<Phase, string> = {
   planning: '规划中',
+  prototyping: '原型设计',
   auditing: '审核中',
   implementing: '实施中',
   reviewing: '评审中',
@@ -183,10 +279,20 @@ const loading = ref(false)
 const toggling = ref(false)
 const data = ref<RequirementDetail | null>(null)
 
+const prototypes = ref<Prototype[]>([])
+const selectedVersion = ref<number | null>(null)
+const newContent = ref('')
+const newNote = ref('')
+const submitting = ref(false)
+
 const workspaceOptions = computed(() =>
   wsStore.list.map((w) => ({ label: `${w.name} (${w.slug})`, value: w.id })),
 )
 
+const selectedPrototype = computed(() =>
+  prototypes.value.find((p) => p.version === selectedVersion.value) ?? null,
+)
+
 async function fetchData() {
   loading.value = true
   try {
@@ -195,11 +301,46 @@ async function fetchData() {
       wsStore.fetchByProject(slug),
     ])
     data.value = detail
+    await refreshPrototypes()
   } finally {
     loading.value = false
   }
 }
 
+async function refreshPrototypes() {
+  prototypes.value = await store.listPrototypes(slug, number)
+  // 默认选中最新版本
+  if (prototypes.value.length > 0) {
+    const latest = prototypes.value[prototypes.value.length - 1]
+    if (selectedVersion.value === null || !selectedPrototype.value) {
+      selectedVersion.value = latest.version
+    }
+  } else {
+    selectedVersion.value = null
+  }
+}
+
+function onSelectPrototype(version: number) {
+  selectedVersion.value = version
+}
+
+async function onSubmitPrototype() {
+  if (!newContent.value.trim()) return
+  submitting.value = true
+  try {
+    const created = await store.createPrototype(slug, number, {
+      content: newContent.value,
+      note: newNote.value || undefined,
+    })
+    newContent.value = ''
+    newNote.value = ''
+    selectedVersion.value = created.version
+    await refreshPrototypes()
+  } finally {
+    submitting.value = false
+  }
+}
+
 async function onWorkspaceChange(v: string | null) {
   if (!data.value) return
   await projectsApi.updateRequirement(slug, number, { workspace_id: v })