BIZ8-11 增强采购项目关联

2026-05-13 21:42:34 +08:00
@@ -145,6 +145,7 @@ export type ProjectDetail = {
    tasks: number;
    risks: number;
    reimbursements: number;
+    purchaseRequests: number;
    travelRequests: number;
    todoItems: number;
    weeklyReports: number;
@@ -209,6 +210,18 @@ export type ProjectTravelSummary = {
  }>;
 };

+export type ProjectPurchaseSummary = {
+  totalAmount: string;
+  items: Array<{
+    id: string;
+    requestNo: string;
+    title: string;
+    status: string;
+    totalAmount: string;
+    updatedAt: string | null;
+  }>;
+};
+
 export type ProjectWeeklyReportLink = {
  id: string;
  weeklyReportId: string;
@@ -458,6 +471,10 @@ export async function fetchProjectTravelSummary(projectId: string) {
  return apiRequestData<ProjectTravelSummary>(`/api/projects/${projectId}/travel/summary`);
 }

+export async function fetchProjectPurchaseSummary(projectId: string) {
+  return apiRequestData<ProjectPurchaseSummary>(`/api/projects/${projectId}/purchase-requests/summary`);
+}
+
 export async function fetchProjectWeeklyReports(projectId: string) {
  return apiRequestData<{ items: ProjectWeeklyReportLink[] }>(`/api/projects/${projectId}/weekly-reports`);
 }
@@ -14,6 +14,7 @@ export type PurchaseRequestSummary = {
  supplierId: string | null;
  documentCategoryId: string | null;
  budgetPoolId: string | null;
+  projectId: string | null;
  title: string;
  reason: string | null;
  currencyCode: string;
@@ -63,6 +64,12 @@ export type PurchaseRequestSummary = {
    code: string;
    name: string;
  } | null;
+  project: {
+    id: string;
+    projectNo: string;
+    name: string;
+    status: string;
+  } | null;
 };

 export type PurchaseRequestItem = {
@@ -235,6 +242,7 @@ export type PurchaseRequestListQuery = {
  supplierId?: string;
  legalEntityId?: string;
  costCenterId?: string;
+  projectId?: string;
 };

 export type PurchaseRequestItemPayload = {
@@ -285,6 +293,7 @@ export async function updatePurchaseRequest(
    supplierId: string | null;
    documentCategoryId: string | null;
    budgetPoolId: string | null;
+    projectId: string | null;
    expectedDeliveryDate: string | null;
    items: PurchaseRequestItemPayload[];
  }>,
@@ -2,7 +2,7 @@ import { useEffect, useState } from "react";
 import { Link, useParams } from "react-router-dom";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { fetchEmployees } from "../api/employees";
-import { archiveProject, createConfidentialDocumentRef, createProjectCommunicationLog, createProjectDelivery, createProjectMember, createProjectMilestone, createProjectRisk, createProjectTask, fetchProject, fetchProjectClosureChecklist, fetchProjectCommunicationLogs, fetchProjectDeliveries, fetchProjectDocumentRefs, fetchProjectExpensesSummary, fetchProjectMembers, fetchProjectMilestones, fetchProjectRisks, fetchProjectTasks, fetchProjectTravelSummary, fetchProjectWeeklyReports, patchProject, patchProjectClosureChecklistItem, patchProjectCommunicationLog, patchProjectMember, patchProjectMilestone, patchProjectRisk, patchProjectTask, type ConfidentialityLevel, type DocumentStorageType, type ProjectCommunicationChannel, type ProjectClosureChecklistStatus, type ProjectDeliveryRecordType, type ProjectMilestoneStatus, type ProjectRiskLevel, type ProjectStatus, type ProjectTaskPriority, type ProjectTaskStatus } from "../api/projects";
+import { archiveProject, createConfidentialDocumentRef, createProjectCommunicationLog, createProjectDelivery, createProjectMember, createProjectMilestone, createProjectRisk, createProjectTask, fetchProject, fetchProjectClosureChecklist, fetchProjectCommunicationLogs, fetchProjectDeliveries, fetchProjectDocumentRefs, fetchProjectExpensesSummary, fetchProjectMembers, fetchProjectMilestones, fetchProjectPurchaseSummary, fetchProjectRisks, fetchProjectTasks, fetchProjectTravelSummary, fetchProjectWeeklyReports, patchProject, patchProjectClosureChecklistItem, patchProjectCommunicationLog, patchProjectMember, patchProjectMilestone, patchProjectRisk, patchProjectTask, type ConfidentialityLevel, type DocumentStorageType, type ProjectCommunicationChannel, type ProjectClosureChecklistStatus, type ProjectDeliveryRecordType, type ProjectMilestoneStatus, type ProjectRiskLevel, type ProjectStatus, type ProjectTaskPriority, type ProjectTaskStatus } from "../api/projects";
 import { fetchContractsRegistry } from "../api/contractsRegistry";
 import { mapApiErrorMessage } from "../api/errorMessages";
 import { DetailSideMeta } from "../components/patterns/DetailSideMeta";
@@ -98,6 +98,7 @@ export function ProjectDetailPage() {
  });
  const expensesQuery = useQuery({ enabled: Boolean(projectId), queryKey: ["projects", projectId, "expenses"], queryFn: () => fetchProjectExpensesSummary(projectId) });
  const travelQuery = useQuery({ enabled: Boolean(projectId), queryKey: ["projects", projectId, "travel"], queryFn: () => fetchProjectTravelSummary(projectId) });
+  const purchaseQuery = useQuery({ enabled: Boolean(projectId), queryKey: ["projects", projectId, "purchase-requests"], queryFn: () => fetchProjectPurchaseSummary(projectId) });
  const weeklyQuery = useQuery({ enabled: Boolean(projectId), queryKey: ["projects", projectId, "weekly"], queryFn: () => fetchProjectWeeklyReports(projectId) });
  const deliveriesQuery = useQuery({ enabled: Boolean(projectId), queryKey: ["projects", projectId, "deliveries"], queryFn: () => fetchProjectDeliveries(projectId) });
  const docsQuery = useQuery({ enabled: Boolean(projectId), queryKey: ["projects", projectId, "document-refs"], queryFn: () => fetchProjectDocumentRefs(projectId) });
@@ -524,6 +525,7 @@ export function ProjectDetailPage() {
        <MetricCard title="任务" value={counts?.tasks ?? 0} note="按优先级与状态推进" />
        <MetricCard title="风险" value={counts?.risks ?? 0} note="高风险建议指定责任人" tone={(counts?.risks ?? 0) > 0 ? "warning" : "neutral"} />
        <MetricCard title="报销合计" value={expensesQuery.data?.totalAmount ?? "0.00"} note="当前项目已关联报销" />
+        <MetricCard title="采购合计" value={purchaseQuery.data?.totalAmount ?? "0.00"} note="当前项目已关联采购" />
        <MetricCard title="差旅合计" value={travelQuery.data?.totalAmount ?? "0.00"} note="当前项目已关联差旅" />
      </section>

@@ -1010,6 +1012,28 @@ export function ProjectDetailPage() {
                  ))}
                </div>
              </div>
+              <div className="rounded-lg border border-zinc-200 p-4">
+                <div className="text-sm text-zinc-500">采购</div>
+                <div className="mt-1 text-xl font-semibold text-zinc-900">{purchaseQuery.data?.totalAmount ?? "0.00"}</div>
+                <div className="mt-2 space-y-2 text-sm">
+                  {purchaseQuery.isLoading ? <div className="text-zinc-500">采购加载中...</div> : null}
+                  {purchaseQuery.isError ? <div className="text-red-600">{resolveError(purchaseQuery.error, "加载采购摘要失败")}</div> : null}
+                  {!purchaseQuery.isLoading && !purchaseQuery.isError && !(purchaseQuery.data?.items.length ?? 0) ? (
+                    <div className="text-zinc-500">暂无关联采购</div>
+                  ) : null}
+                  {(purchaseQuery.data?.items ?? []).slice(0, 5).map((item) => (
+                    <Link key={item.id} to={`/purchase-requests?id=${item.id}`} className="block rounded-lg border border-zinc-100 px-3 py-2 hover:bg-zinc-50">
+                      <div className="flex items-center justify-between gap-3">
+                        <span className="truncate">{item.requestNo || item.title}</span>
+                        <StatusBadge status={item.status} />
+                      </div>
+                      <div className="mt-1 text-xs text-zinc-500">
+                        {item.totalAmount} · {item.updatedAt ? formatDateTime(item.updatedAt) : "-"}
+                      </div>
+                    </Link>
+                  ))}
+                </div>
+              </div>
              <div className="rounded-lg border border-zinc-200 p-4">
                <div className="text-sm text-zinc-500">项目周报</div>
                <div className="mt-1 text-xl font-semibold text-zinc-900">{weeklyQuery.data?.items.length ?? 0}</div>
@@ -1,6 +1,6 @@
 import { useEffect, useMemo, useRef, useState } from "react";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
-import { useSearchParams } from "react-router-dom";
+import { Link, useSearchParams } from "react-router-dom";
 import { toast } from "sonner";
 import { isApiError } from "../api/types";
 import { mapApiErrorMessage } from "../api/errorMessages";
@@ -32,6 +32,7 @@ import {
  fetchLegalEntities,
  fetchSuppliers,
 } from "../api/masterData";
+import { fetchProjects } from "../api/projects";
 import { remindWorkflowTask } from "../api/workflow";
 import { useAuth } from "../auth/AuthContext";
 import { hasPermission } from "../auth/permissions";
@@ -237,6 +238,7 @@ export function PurchaseRequestsPage() {
  const [costCenterId, setCostCenterId] = useState("");
  const [supplierId, setSupplierId] = useState("");
  const [documentCategoryId, setDocumentCategoryId] = useState("");
+  const [projectId, setProjectId] = useState("");
  const [expectedDeliveryDate, setExpectedDeliveryDate] = useState("");
  const [items, setItems] = useState<DraftItem[]>([]);
  const [archivePoNo, setArchivePoNo] = useState("");
@@ -264,6 +266,11 @@ export function PurchaseRequestsPage() {
    queryFn: () => fetchDocumentCategories({ entityType: "purchase_request", enabled: true }),
  });

+  const projectsQuery = useQuery({
+    queryKey: ["projects", "purchase-request-link"],
+    queryFn: () => fetchProjects({ mine: true }),
+  });
+
  const listQuery = useQuery({
    queryKey: ["purchase-requests", "list", status, mine, supplierFilter, legalEntityFilter, costCenterFilter, page],
    queryFn: () =>
@@ -350,6 +357,7 @@ export function PurchaseRequestsPage() {
    setCostCenterId(detailQuery.data.costCenterId || "");
    setSupplierId(detailQuery.data.supplierId || "");
    setDocumentCategoryId(detailQuery.data.documentCategoryId || "");
+    setProjectId(detailQuery.data.projectId || "");
    setExpectedDeliveryDate(detailQuery.data.expectedDeliveryDate || "");
    setItems(
      detailQuery.data.items.map((item) => ({
@@ -390,6 +398,30 @@ export function PurchaseRequestsPage() {
    return (costCentersQuery.data?.items ?? []).filter((item) => item.legalEntityId === legalEntityFilter);
  }, [costCentersQuery.data?.items, legalEntityFilter]);

+  const projectOptions = useMemo(() => {
+    const activeItems = (projectsQuery.data?.items ?? [])
+      .filter((item) => item.status !== "archived")
+      .map((item) => ({
+        id: item.id,
+        projectNo: item.projectNo,
+        name: item.name,
+        status: item.status,
+      }));
+    const currentProject = detailQuery.data?.project;
+    if (currentProject && currentProject.id === projectId && !activeItems.some((item) => item.id === currentProject.id)) {
+      return [
+        {
+          id: currentProject.id,
+          projectNo: currentProject.projectNo,
+          name: currentProject.name,
+          status: currentProject.status || "archived",
+        },
+        ...activeItems,
+      ];
+    }
+    return activeItems;
+  }, [detailQuery.data?.project, projectId, projectsQuery.data?.items]);
+
  const totalPages = Math.max(1, Math.ceil((listQuery.data?.total ?? 0) / PAGE_SIZE));
  const purchaseItems = listQuery.data?.items ?? [];
  const totalAmountPreview = useMemo(
@@ -421,6 +453,7 @@ export function PurchaseRequestsPage() {
    costCenterId: string | null;
    supplierId: string | null;
    documentCategoryId: string | null;
+    projectId: string | null;
    expectedDeliveryDate: string | null;
    items: PurchaseRequestItemPayload[];
  } {
@@ -432,6 +465,7 @@ export function PurchaseRequestsPage() {
      costCenterId: costCenterId || null,
      supplierId: supplierId || null,
      documentCategoryId: documentCategoryId || null,
+      projectId: projectId || null,
      expectedDeliveryDate: expectedDeliveryDate || null,
      items: items.map((item) => ({
        description: item.description.trim(),
@@ -905,6 +939,12 @@ export function PurchaseRequestsPage() {
                          <div className="text-zinc-400">金额</div>
                          <div className="mt-0.5 font-medium text-zinc-900">{item.totalAmount}</div>
                        </div>
+                        <div className="col-span-2">
+                          <div className="text-zinc-400">关联项目</div>
+                          <div className="mt-0.5 truncate text-zinc-700">
+                            {item.project ? `${item.project.projectNo} · ${item.project.name}` : "未关联项目"}
+                          </div>
+                        </div>
                      </div>
                    </button>
                  ))
@@ -918,6 +958,7 @@ export function PurchaseRequestsPage() {
                  <tr>
                    <TableHead>单据</TableHead>
                    <TableHead>申请人</TableHead>
+                    <TableHead>项目</TableHead>
                    <TableHead>状态</TableHead>
                    <TableHead>金额</TableHead>
                  </tr>
@@ -938,13 +979,23 @@ export function PurchaseRequestsPage() {
                          <div className="text-xs text-zinc-500">{item.title || "未命名采购申请"}</div>
                        </TableCell>
                        <TableCell>{item.applicant?.name ?? "-"}</TableCell>
+                        <TableCell>
+                          {item.project ? (
+                            <div>
+                              <div className="font-medium text-zinc-900">{item.project.projectNo}</div>
+                              <div className="text-xs text-zinc-500">{item.project.name}</div>
+                            </div>
+                          ) : (
+                            <span className="text-zinc-500">未关联项目</span>
+                          )}
+                        </TableCell>
                        <TableCell><StatusBadge status={item.status} /></TableCell>
                        <TableCell>{item.totalAmount}</TableCell>
                      </TableRow>
                    ))
                  ) : (
                    <TableRow>
-                      <TableCell className="py-4 text-zinc-500" colSpan={4}>
+                      <TableCell className="py-4 text-zinc-500" colSpan={5}>
                        暂无采购申请
                      </TableCell>
                    </TableRow>
@@ -1049,6 +1100,22 @@ export function PurchaseRequestsPage() {
                </div>
              </div>

+              <div className="rounded-lg border border-zinc-200 bg-white p-4">
+                <div className="flex items-center justify-between gap-3">
+                  <div>
+                    <div className="font-medium text-zinc-900">关联项目</div>
+                    <div className="text-xs text-zinc-500">
+                      {detail.project ? `${detail.project.projectNo} · ${detail.project.name}` : "未关联项目"}
+                    </div>
+                  </div>
+                  {detail.project ? (
+                    <Link to={`/projects/${detail.project.id}`} className="text-sm text-primary hover:underline">
+                      查看项目
+                    </Link>
+                  ) : null}
+                </div>
+              </div>
+
              <RiskFlagsCard items={detail.riskFlags} title="待处理风险项" />

              <SectionPanel title="审批记录" description="展示最近审批动作、退回或驳回说明，便于申请人按意见修改。">
@@ -1136,6 +1203,23 @@ export function PurchaseRequestsPage() {
                    ))}
                  </select>
                </div>
+                <div className="space-y-2">
+                  <label className="text-sm font-medium text-zinc-700">关联项目</label>
+                  <select
+                    data-testid="purchase-project"
+                    className="select-std"
+                    value={projectId}
+                    disabled={!canEditDraft || projectsQuery.isLoading}
+                    onChange={(event) => setProjectId(event.target.value)}
+                  >
+                    <option value="">不关联项目</option>
+                    {projectOptions.map((item) => (
+                      <option key={item.id} value={item.id}>
+                        {item.projectNo} · {item.name}{item.status === "archived" ? "（已归档）" : ""}
+                      </option>
+                    ))}
+                  </select>
+                </div>
                <div className="space-y-2">
                  <label className="text-sm font-medium text-zinc-700">期望到货日期</label>
                  <Input data-testid="purchase-expected-delivery-date" type="date" value={expectedDeliveryDate} disabled={!canEditDraft} onChange={(event) => setExpectedDeliveryDate(event.target.value)} />
@@ -1149,6 +1233,7 @@ export function PurchaseRequestsPage() {

              <div className="rounded-lg border border-zinc-200 bg-zinc-50 p-4 text-sm text-zinc-600">
                <div>预算池：{detail.budgetPool?.name ?? "未匹配"}</div>
+                <div>关联项目：{detail.project ? `${detail.project.projectNo} · ${detail.project.name}` : "未关联项目"}</div>
                <div>待办节点：{detail.pendingWorkflow?.task?.stepName ?? "-"}</div>
                <div>总金额：<span className="font-semibold text-zinc-900">{totalAmountPreview}</span></div>
                <div