feat: 版本详情完整功能 + 数据串联 + 登录模块

- 版本详情：关联需求Tab（从需求池添加已采纳需求/移除释放）
- 版本详情：调研/产品方案/UI设计Tab（计划CRUD、完成提交成果、耗时统计）
- 版本详情：超期校验（结束日期超版本截止需填写原因）
- 版本详情：概览统计卡片（加班时长/排名/原因占比）
- 数据串联：产品→项目→版本→需求→加班全链路贯通
- 版本管理：规划中版本可删除，删除释放关联需求
- 数据清理：仅保留翻台宝/值班，需求池10条值班待评审需求
- 修复：列表页overflow裁剪菜单问题（4个页面统一修复）
- 新增：登录模块、AuthGuard、VersionPlan store

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

apps/web/components/version/VersionRequirementsTab.tsx

@@ -0,0 +1,138 @@
+'use client';
+
+import { useState } from 'react';
+import { Plus, X, Search } from 'lucide-react';
+import type { Requirement } from '@/lib/requirement';
+import { REQ_STATUS_LABEL, REQ_STATUS_COLOR } from '@/lib/requirement';
+
+interface Props {
+  versionId: string;
+  projectId: string;
+  requirements: Requirement[];
+  onLink: (reqIds: string[], addedBy: string) => void;
+  onUnlink: (reqId: string) => void;
+  currentUserName: string;
+}
+
+export function VersionRequirementsTab({ versionId, projectId, requirements, onLink, onUnlink, currentUserName }: Props) {
+  const [showAddModal, setShowAddModal] = useState(false);
+  const linkedReqs = requirements.filter((r) => r.versionId === versionId);
+  const availableReqs = requirements.filter((r) => r.projectId === projectId && !r.versionId && r.status === 'adopted');
+
+  return (
+    <div className="space-y-4">
+      <div className="flex items-center justify-between">
+        <span className="text-[12px] text-[var(--ink-muted)]">{linkedReqs.length} 条关联需求</span>
+        <button onClick={() => setShowAddModal(true)} className="flex h-8 items-center gap-1.5 rounded-lg bg-[var(--accent)] px-3 text-[13px] font-medium text-white shadow-[var(--shadow-sm)] hover:bg-[var(--accent-hover)] transition-colors">
+          <Plus className="h-3.5 w-3.5" strokeWidth={2} />
+          添加需求
+        </button>
+      </div>
+
+      {linkedReqs.length === 0 ? (
+        <div className="rounded-xl border border-[var(--line)] bg-[var(--bg-card)] p-12 text-center text-[13px] text-[var(--ink-muted)]">
+          暂无关联需求，从需求池中添加
+        </div>
+      ) : (
+        <div className="rounded-xl border border-[var(--line)] bg-[var(--bg-card)] overflow-hidden">
+          <table className="w-full text-left text-[13px]">
+            <thead className="sticky top-0 z-10 bg-[var(--bg-subtle)]">
+              <tr className="border-b border-[var(--line)]">
+                <th className="px-4 py-2.5 text-[11px] font-medium uppercase tracking-wide text-[var(--ink-muted)]">编号</th>
+                <th className="px-4 py-2.5 text-[11px] font-medium uppercase tracking-wide text-[var(--ink-muted)]">需求概述</th>
+                <th className="px-4 py-2.5 text-[11px] font-medium uppercase tracking-wide text-[var(--ink-muted)]">描述</th>
+                <th className="px-4 py-2.5 text-[11px] font-medium uppercase tracking-wide text-[var(--ink-muted)]">状态</th>
+                <th className="px-4 py-2.5 text-[11px] font-medium uppercase tracking-wide text-[var(--ink-muted)]">添加人</th>
+                <th className="px-4 py-2.5 text-[11px] font-medium uppercase tracking-wide text-[var(--ink-muted)] text-right">操作</th>
+              </tr>
+            </thead>
+            <tbody>
+              {linkedReqs.map((req) => (
+                <tr key={req.id} className="border-b border-[var(--line-soft)] last:border-0 hover:bg-[var(--bg-subtle)] transition-colors">
+                  <td className="px-4 py-3 font-mono text-[12px] text-[var(--ink-muted)]">{req.code}</td>
+                  <td className="px-4 py-3 font-medium text-[var(--ink)]">{req.title}</td>
+                  <td className="px-4 py-3 text-[12px] text-[var(--ink-soft)] max-w-[200px] truncate">{req.description || '-'}</td>
+                  <td className="px-4 py-3">
+                    <span className={`inline-flex items-center rounded-md px-2 py-0.5 text-[10px] font-medium border ${REQ_STATUS_COLOR[req.status]}`}>
+                      {REQ_STATUS_LABEL[req.status]}
+                    </span>
+                  </td>
+                  <td className="px-4 py-3 text-[12px] text-[var(--ink-soft)]">{req.addedToVersionBy || '-'}</td>
+                  <td className="px-4 py-3 text-right">
+                    <button onClick={() => onUnlink(req.id)} className="h-6 px-2 rounded text-[11px] font-medium text-red-500 hover:bg-red-50 transition-colors">移除</button>
+                  </td>
+                </tr>
+              ))}
+            </tbody>
+          </table>
+        </div>
+      )}
+
+      {showAddModal && (
+        <AddRequirementModal
+          available={availableReqs}
+          onClose={() => setShowAddModal(false)}
+          onConfirm={(ids) => { onLink(ids, currentUserName); setShowAddModal(false); }}
+        />
+      )}
+    </div>
+  );
+}
+
+function AddRequirementModal({ available, onClose, onConfirm }: {
+  available: Requirement[];
+  onClose: () => void;
+  onConfirm: (ids: string[]) => void;
+}) {
+  const [selected, setSelected] = useState<Set<string>>(new Set());
+  const [search, setSearch] = useState('');
+
+  const filtered = available.filter((r) =>
+    r.title.includes(search) || r.code.includes(search)
+  );
+
+  const toggle = (id: string) => {
+    const next = new Set(selected);
+    if (next.has(id)) next.delete(id); else next.add(id);
+    setSelected(next);
+  };
+
+  return (
+    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/40" onClick={onClose}>
+      <div className="w-full max-w-lg rounded-2xl bg-[var(--bg-card)] border border-[var(--line)] shadow-[var(--shadow-md)] flex flex-col max-h-[70vh]" onClick={(e) => e.stopPropagation()}>
+        <div className="flex items-center justify-between px-5 py-4 border-b border-[var(--line)]">
+          <h3 className="text-[13px] font-semibold text-[var(--ink)]">从需求池添加</h3>
+          <button onClick={onClose} className="p-1 rounded hover:bg-[var(--bg-subtle)] text-[var(--ink-muted)]"><X className="h-4 w-4" /></button>
+        </div>
+        <div className="px-5 py-3 border-b border-[var(--line)]">
+          <div className="relative">
+            <Search className="absolute left-3 top-1/2 -translate-y-1/2 h-3.5 w-3.5 text-[var(--ink-muted)]" />
+            <input value={search} onChange={(e) => setSearch(e.target.value)} placeholder="搜索需求编号或标题" className="h-8 w-full rounded-lg border border-[var(--line)] bg-[var(--bg)] pl-9 pr-3 text-[12px] focus:border-[var(--accent)] focus:outline-none" />
+          </div>
+        </div>
+        <div className="flex-1 overflow-y-auto px-5 py-3">
+          {filtered.length === 0 ? (
+            <p className="text-center text-[12px] text-[var(--ink-muted)] py-8">没有可添加的需求</p>
+          ) : (
+            <div className="space-y-1.5">
+              {filtered.map((req) => (
+                <label key={req.id} className="flex items-center gap-3 rounded-lg px-3 py-2 hover:bg-[var(--bg-subtle)] cursor-pointer">
+                  <input type="checkbox" checked={selected.has(req.id)} onChange={() => toggle(req.id)} className="h-4 w-4 rounded border-[var(--line)] text-[var(--accent)]" />
+                  <span className="text-[11px] font-mono text-[var(--ink-muted)] shrink-0">{req.code}</span>
+                  <span className="text-[12px] text-[var(--ink)] flex-1 truncate">{req.title}</span>
+                </label>
+              ))}
+            </div>
+          )}
+        </div>
+        <div className="flex items-center justify-between px-5 py-4 border-t border-[var(--line)]">
+          <span className="text-[11px] text-[var(--ink-muted)]">已选 {selected.size} 条</span>
+          <div className="flex gap-2">
+            <button onClick={onClose} className="h-8 px-3 rounded-lg text-[12px] font-medium border border-[var(--line)] text-[var(--ink-soft)] hover:bg-[var(--bg-subtle)]">取消</button>
+            <button onClick={() => onConfirm(Array.from(selected))} disabled={selected.size === 0} className="h-8 px-4 rounded-lg text-[12px] font-medium bg-[var(--accent)] text-white hover:bg-[var(--accent-hover)] disabled:opacity-50">确认添加</button>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}