R7E-16D 审批动作二次确认

Refs: R7E-16D BIZ8-12B QAOPS8-17

client/src/pages/WorkflowTasksPage.tsx

@@ -1,3 +1,4 @@
+import { useState } from "react";
 import { Link, useSearchParams } from "react-router-dom";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { toast } from "sonner";
@@ -10,6 +11,7 @@ import {
   type WorkflowTaskSummary,
 } from "../api/workflow";
 import { Pagination } from "../components/common/Pagination";
+import { ConfirmDialog } from "../components/common/ConfirmDialog";
 import { StatusBadge } from "../components/common/StatusBadge";
 import { TableSkeleton } from "../components/common/TableSkeleton";
 import {
@@ -26,6 +28,7 @@ import { Button } from "../components/ui/button";
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "../components/ui/table";
 import { Tabs, TabsList, TabsTrigger } from "../components/ui/tabs";
 import { TEST_IDS } from "../lib/testIds";
+import { getWorkflowConfirmCopy } from "../lib/workflowActionConfirm";
 
 const PAGE_SIZE = 20;
 const WORKFLOW_STATUS_OPTIONS = [
@@ -130,6 +133,7 @@ function isAlreadyProcessedTaskError(error: unknown) {
 
 export function WorkflowTasksPage() {
   const [searchParams, setSearchParams] = useSearchParams();
+  const [confirmApproveTaskId, setConfirmApproveTaskId] = useState<string | null>(null);
   const queryClient = useQueryClient();
 
   const status = normalizeStatusFilter(searchParams.get("status"));
@@ -194,8 +198,10 @@ export function WorkflowTasksPage() {
 
   const totalPages = Math.max(1, Math.ceil((query.data?.total ?? 0) / PAGE_SIZE));
   const taskItems = query.data?.items ?? [];
+  const confirmCopy = confirmApproveTaskId ? getWorkflowConfirmCopy("approve") : null;
 
   return (
+    <>
     <ListWorkspace>
       <WorkspaceHeader
         eyebrow="审批"
@@ -318,7 +324,7 @@ export function WorkflowTasksPage() {
                           type="button"
                           data-testid={TEST_IDS.workflow.quickApprove}
                           disabled={approveMutation.isPending && approveMutation.variables === task.id}
-                          onClick={() => approveMutation.mutate(task.id)}
+                          onClick={() => setConfirmApproveTaskId(task.id)}
                         >
                           {approveMutation.isPending && approveMutation.variables === task.id ? "通过中..." : "通过"}
                         </Button>
@@ -381,7 +387,7 @@ export function WorkflowTasksPage() {
                                 type="button"
                                 data-testid={TEST_IDS.workflow.quickApprove}
                                 disabled={approveMutation.isPending && approveMutation.variables === task.id}
-                                onClick={() => approveMutation.mutate(task.id)}
+                                onClick={() => setConfirmApproveTaskId(task.id)}
                               >
                                 {approveMutation.isPending && approveMutation.variables === task.id ? "通过中..." : "通过"}
                               </Button>
@@ -418,5 +424,27 @@ export function WorkflowTasksPage() {
           testIdPrefix="workflow-tasks"
         />
     </ListWorkspace>
+    <ConfirmDialog
+      open={Boolean(confirmCopy)}
+      onOpenChange={(open) => {
+        if (!open) {
+          setConfirmApproveTaskId(null);
+        }
+      }}
+      title={confirmCopy?.title ?? ""}
+      description={confirmCopy?.description}
+      confirmLabel={confirmCopy?.confirmLabel}
+      variant={confirmCopy?.variant}
+      testId="workflow-action-confirm-dialog"
+      confirmTestId="workflow-action-confirm-submit"
+      cancelTestId="workflow-action-confirm-cancel"
+      onConfirm={async () => {
+        if (!confirmApproveTaskId) {
+          return;
+        }
+        await approveMutation.mutateAsync(confirmApproveTaskId);
+      }}
+    />
+    </>
   );
 }