update: del

frontend/src/pages/cases/CaseList.tsx

@@ -2,6 +2,7 @@ import React, { useState } from 'react';
 import { useNavigate } from 'react-router-dom';
 import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
 import {
+  App,
   Card,
   Table,
   Button,
@@ -18,6 +19,7 @@ import {
 } from 'antd';
 import {
   PlusOutlined,
+  DeleteOutlined,
   SearchOutlined,
   FolderOpenOutlined,
   ClockCircleOutlined,
@@ -26,7 +28,7 @@ import {
 } from '@ant-design/icons';
 import type { ColumnsType } from 'antd/es/table';
 import type { CaseRecord, CaseStatus } from '../../types';
-import { fetchCases, createCase } from '../../services/api';
+import { fetchCases, createCase, deleteCases } from '../../services/api';
 
 const statusConfig: Record<CaseStatus, { color: string; label: string }> = {
   pending: { color: 'default', label: '待处理' },
@@ -48,9 +50,11 @@ const splitDateTime = (raw: string): { date: string; time: string } => {
 const CaseList: React.FC = () => {
   const navigate = useNavigate();
   const qc = useQueryClient();
+  const { modal } = App.useApp();
   const [createOpen, setCreateOpen] = useState(false);
   const [form] = Form.useForm();
   const [search, setSearch] = useState('');
+  const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
 
   const { data, isLoading } = useQuery({
     queryKey: ['cases', search],
@@ -69,6 +73,18 @@ const CaseList: React.FC = () => {
     },
   });
 
+  const deleteMutation = useMutation({
+    mutationFn: (caseIds: string[]) => deleteCases(caseIds),
+    onSuccess: (res) => {
+      message.success(res.message || `已删除 ${res.deleted} 个案件`);
+      setSelectedRowKeys([]);
+      qc.invalidateQueries({ queryKey: ['cases'] });
+    },
+    onError: () => {
+      message.error('删除案件失败');
+    },
+  });
+
   const totalCases = cases.length;
   const pendingReview = cases.filter((c) => c.status === 'reviewing').length;
   const completedCount = cases.filter((c) => c.status === 'completed').length;
@@ -221,11 +237,36 @@ const CaseList: React.FC = () => {
             >
               新建案件
             </Button>
+            <Button
+              danger
+              icon={<DeleteOutlined />}
+              disabled={selectedRowKeys.length === 0}
+              loading={deleteMutation.isPending}
+              onClick={() => {
+                const selectedCases = cases.filter((c) => selectedRowKeys.includes(c.id));
+                modal.confirm({
+                  title: '确认删除选中案件？',
+                  content: `已选择 ${selectedCases.length} 个案件，删除后将不再显示在案件列表中。`,
+                  okText: '确认删除',
+                  okButtonProps: { danger: true },
+                  cancelText: '取消',
+                  onOk: () => {
+                    deleteMutation.mutate(selectedRowKeys as string[]);
+                  },
+                });
+              }}
+            >
+              删除案件
+            </Button>
           </Space>
         }
       >
         <Table
           rowKey="id"
+          rowSelection={{
+            selectedRowKeys,
+            onChange: (keys) => setSelectedRowKeys(keys),
+          }}
           columns={columns}
           dataSource={cases}
           loading={isLoading}

frontend/src/services/api.ts

@@ -97,6 +97,19 @@ export async function fetchCase(id: string): Promise<CaseRecord> {
   return request(`${BASE}/cases/${id}`);
 }
 
+export async function deleteCases(caseIds: string[]): Promise<{ deleted: number; message: string }> {
+  if (!(await isBackendUp())) {
+    return {
+      deleted: caseIds.length,
+      message: `Mock 模式：模拟删除 ${caseIds.length} 个案件`,
+    };
+  }
+  return request(`${BASE}/cases`, {
+    method: 'DELETE',
+    body: JSON.stringify({ case_ids: caseIds }),
+  });
+}
+
 // ── Images ──
 
 export async function fetchImages(