fix(需求池): 修复列表换行和版本解绑状态

apps/web/app/requirements/page.tsx

@@ -13,6 +13,13 @@ import type { Requirement, RequirementStatus, SourceType } from '@/lib/requireme
 import { deriveReqDevStatus, canEditRequirement, canCloseRequirement, REQ_DEV_STATUS_LABEL, REQ_DEV_STATUS_COLOR } from '@/lib/linkage-engine';
 import { buildRequirementScopeTree, filterRequirementScopeTreeByKeyword, filterRequirementsByScope, type RequirementProductScopeNode, type RequirementScopeSelection } from '@/lib/requirement-scope';
 import { sortRequirementsByCreatedAt, type RequirementDateSort } from '@/lib/requirement-sort';
+import {
+  REQUIREMENT_TABLE_BADGE_CLASS,
+  REQUIREMENT_TABLE_NOWRAP_CELL_CLASS,
+  REQUIREMENT_TABLE_SMALL_BADGE_CLASS,
+  getRequirementTableTextClass,
+} from '@/lib/requirement-table-layout';
+import { getRequirementVersionSelectionPatch } from '@/lib/requirement-version-link';
 import { Pagination, usePagination } from '@/components/Pagination';
 import { RequirementModal } from '@/components/requirement/RequirementModal';
 import { RequirementDetail } from '@/components/requirement/RequirementDetail';
@@ -488,29 +495,50 @@ function RequirementsPageContent() {
 
                         {/* 需求来源 */}
                         <td className="px-4 py-3 text-[13px] text-[var(--ink-soft)]">
-                          {SOURCE_TYPE_LABEL[req.sourceType]}: {req.sourceTarget}
+                          {(() => {
+                            const sourceText = `${SOURCE_TYPE_LABEL[req.sourceType]}: ${req.sourceTarget}`;
+                            return (
+                              <span className={getRequirementTableTextClass('source')} title={sourceText}>
+                                {sourceText}
+                              </span>
+                            );
+                          })()}
                         </td>
 
                         {/* 所属项目 */}
                         <td className="px-4 py-3 text-[12px] text-[var(--ink-soft)]">
-                          {allProjects.find((p) => p.id === req.projectId)?.name ?? '-'}
+                          {(() => {
+                            const projectName = allProjects.find((p) => p.id === req.projectId)?.name ?? '-';
+                            return (
+                              <span className={getRequirementTableTextClass('project')} title={projectName}>
+                                {projectName}
+                              </span>
+                            );
+                          })()}
                         </td>
 
                         {/* 需求类型 */}
                         <td className="px-4 py-3 text-[12px] text-[var(--ink-soft)]">
-                          {types.find((t) => t.id === req.typeId)?.name ?? '-'}
+                          {(() => {
+                            const typeName = types.find((t) => t.id === req.typeId)?.name ?? '-';
+                            return (
+                              <span className={getRequirementTableTextClass('type')} title={typeName}>
+                                {typeName}
+                              </span>
+                            );
+                          })()}
                         </td>
 
                         {/* 状态 */}
-                        <td className="px-4 py-3">
-                          <span className={`inline-flex items-center rounded-md px-2 py-0.5 text-[11px] font-medium ${REQ_STATUS_COLOR[req.status]}`}>
+                        <td className={REQUIREMENT_TABLE_NOWRAP_CELL_CLASS}>
+                          <span className={`${REQUIREMENT_TABLE_BADGE_CLASS} ${REQ_STATUS_COLOR[req.status]}`}>
                             {REQ_STATUS_LABEL[req.status]}
                           </span>
                         </td>
 
                         {/* 优先级 */}
-                        <td className="px-4 py-3">
-                          <span className={`inline-flex items-center rounded-md px-2 py-0.5 text-[11px] font-medium ${PRIORITY_COLORS[req.priority] ?? 'bg-zinc-100 text-zinc-500'}`}>
+                        <td className={REQUIREMENT_TABLE_NOWRAP_CELL_CLASS}>
+                          <span className={`${REQUIREMENT_TABLE_SMALL_BADGE_CLASS} ${PRIORITY_COLORS[req.priority] ?? 'bg-zinc-100 text-zinc-500'}`}>
                             {req.priority}
                           </span>
                         </td>
@@ -521,11 +549,11 @@ function RequirementsPageContent() {
                         </td>
 
                         {/* 开发状态 */}
-                        <td className="px-4 py-3">
+                        <td className={REQUIREMENT_TABLE_NOWRAP_CELL_CLASS}>
                           {(() => {
                             const devStatus = deriveReqDevStatus(req.id, devTasks);
                             return (
-                              <span className={`inline-flex items-center rounded-md px-2 py-0.5 text-[10px] font-medium ${REQ_DEV_STATUS_COLOR[devStatus]}`}>
+                              <span className={`${REQUIREMENT_TABLE_SMALL_BADGE_CLASS} ${REQ_DEV_STATUS_COLOR[devStatus]}`}>
                                 {REQ_DEV_STATUS_LABEL[devStatus]}
                               </span>
                             );
@@ -534,17 +562,19 @@ function RequirementsPageContent() {
 
                         {/* 录入人员 */}
                         <td className="px-4 py-3 text-[12px] text-[var(--ink-soft)]">
-                          {req.creator}
+                          <span className={getRequirementTableTextClass('creator')} title={req.creator}>
+                            {req.creator}
+                          </span>
                         </td>
 
                         {/* 录入日期 */}
-                        <td className="px-4 py-3 text-[var(--ink-muted)] tabular-nums">
+                        <td className="px-4 py-3 text-[var(--ink-muted)] tabular-nums whitespace-nowrap">
                           {new Date(req.createdAt).toISOString().slice(0, 10)}
                         </td>
 
                         {/* 操作 */}
                         <td className="px-4 py-3 text-right" onClick={(e) => e.stopPropagation()}>
-                          <div className="flex items-center justify-end gap-1">
+                          <div className="flex items-center justify-end gap-1 whitespace-nowrap">
                             {/* 编辑：待评审/已采纳/已规划，且开发中不可编辑 */}
                             {(['pending_review', 'adopted', 'planned'] as const).includes(req.status as any) && canEditRequirement(req.id, devTasks) && (
                               <button
@@ -638,7 +668,12 @@ function RequirementsPageContent() {
           onClose={() => { setShowModal(false); setEditingReq(null); }}
           onSubmit={(data) => {
             if (editingReq) {
-              updateRequirement(editingReq.id, data);
+              const versionPatch = getRequirementVersionSelectionPatch(
+                editingReq,
+                data.versionId,
+                data.versionId !== editingReq.versionId ? currentUserName : editingReq.addedToVersionBy,
+              );
+              updateRequirement(editingReq.id, { ...data, ...versionPatch });
             } else {
               createRequirement(data);
             }

apps/web/app/versions/[id]/page.tsx

@@ -29,6 +29,7 @@ import { hasPermission } from '@/lib/permissions';
 import { calcActualElapsedHours, formatActualDuration } from '@/lib/work-hours';
 import { formatDateTime, formatLocalDate } from '@/lib/format';
 import { getProjectAdoptedRequirementCandidates } from '@/lib/requirement-selector';
+import { getRequirementVersionSelectionPatch, getRequirementVersionUnlinkPatch } from '@/lib/requirement-version-link';
 import { calcBugSeverityRanking, calcPersonalEffortRanking, calcStageEffortMetrics, calcVersionOverviewEffortTotals } from '@/lib/version-overview';
 import { addVersionMembers, DEFAULT_VERSION_MEMBER_ROLE, filterVersionMemberCandidates } from '@/lib/version-members';
 import { addRecommendedVersionMembers, getDefaultRecommendedMemberNames, recommendVersionMembers, type MemberRecommendationGroup, type RecommendableRole } from '@/lib/member-recommendation';
@@ -230,7 +231,7 @@ export default function VersionDetailPage() {
       buttons.push({ label: '删除', action: () => {
         if (confirm('确认删除该版本？关联的需求会回到需求池，版本下的计划、开发任务、测试用例、Bug 将被清除。')) {
           // 释放关联需求
-          requirements.filter((r) => r.versionId === version.id).forEach((r) => updateRequirement(r.id, { versionId: undefined, addedToVersionBy: undefined }));
+          requirements.filter((r) => r.versionId === version.id).forEach((r) => updateRequirement(r.id, getRequirementVersionUnlinkPatch(r)));
           // 清理计划任务
           plans.filter((p) => p.versionId === version.id).forEach((p) => deletePlan(p.id));
           // 清理开发任务
@@ -861,11 +862,17 @@ export default function VersionDetailPage() {
             readOnly={versionReadonly}
             onLink={(ids, addedBy) => {
               if (versionReadonly) return;
-              ids.forEach((id) => updateRequirement(id, { versionId: version.id, addedToVersionBy: addedBy }));
+              ids.forEach((id) => {
+                const requirement = requirements.find((item) => item.id === id);
+                if (!requirement) return;
+                updateRequirement(id, getRequirementVersionSelectionPatch(requirement, version.id, addedBy));
+              });
             }}
             onUnlink={(id) => {
               if (versionReadonly) return;
-              updateRequirement(id, { versionId: undefined, addedToVersionBy: undefined });
+              const requirement = requirements.find((item) => item.id === id);
+              if (!requirement) return;
+              updateRequirement(id, getRequirementVersionUnlinkPatch(requirement));
             }}
             onCreateChange={(data) => {
               if (versionReadonly) return;

apps/web/app/versions/page.tsx

@@ -20,6 +20,7 @@ import { useXiaobaoWarningRisks } from '@/hooks/useXiaobaoWarningRisks';
 import type { XiaobaoVersionRisk } from '@/lib/xiaobao-risk';
 import { getRiskScoreTone } from '@/lib/xiaobao-warning-view';
 import { buildVersionScopeTree, filterVersionsForList, type VersionListScope, type VersionProductNode } from '@/lib/version-list';
+import { getRequirementVersionUnlinkPatch } from '@/lib/requirement-version-link';
 import {
   VERSION_DEVELOPMENT_TYPE_OPTIONS,
   canSubmitNewVersionForm,
@@ -158,7 +159,7 @@ function VersionsPageContent() {
     setOpenMenuId(null);
     if (action === 'delete') {
       if (!confirm('确认删除该版本？关联的需求会回到需求池。')) return;
-      requirements.filter((r) => r.versionId === version.id).forEach((r) => updateRequirement(r.id, { versionId: undefined, addedToVersionBy: undefined }));
+      requirements.filter((r) => r.versionId === version.id).forEach((r) => updateRequirement(r.id, getRequirementVersionUnlinkPatch(r)));
       deleteVersion(version.productId, version.id);
       return;
     }