feat: 开发任务和测试用例增加批量删除 + 单条删改
- DevTaskTab: 列表行前增加 checkbox,支持全选/批量删除 - DevTaskDetailDrawer: 顶部增加删除按钮(带确认) - TestCaseTab: 同上,批量删除时校验关联 Bug(有 Bug 不可删) - TestCaseDetailDrawer: 顶部增加删除按钮(有关联 Bug 时提示不可删) Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
'use client';
|
||||
|
||||
import { useState, useMemo, useEffect } from 'react';
|
||||
import { Plus, ClipboardCheck, Filter, CheckCircle2 } from 'lucide-react';
|
||||
import { Plus, ClipboardCheck, Filter, CheckCircle2, Trash2 } from 'lucide-react';
|
||||
import { useTestCaseStore } from '@/stores/useTestCaseStore';
|
||||
import { useBugStore } from '@/stores/useBugStore';
|
||||
import { useDevTaskStore } from '@/stores/useDevTaskStore';
|
||||
@@ -21,7 +21,7 @@ interface Props {
|
||||
}
|
||||
|
||||
export function TestCaseTab({ versionId, requirementIds }: Props) {
|
||||
const { testCases, fetchTestCases } = useTestCaseStore();
|
||||
const { testCases, fetchTestCases, deleteTestCase } = useTestCaseStore();
|
||||
const { bugs, fetchBugs } = useBugStore();
|
||||
const { tasks: devTasks } = useDevTaskStore();
|
||||
const { requirements } = useRequirementStore();
|
||||
@@ -58,6 +58,30 @@ export function TestCaseTab({ versionId, requirementIds }: Props) {
|
||||
const [selectedCaseId, setSelectedCaseId] = useState<string | null>(null);
|
||||
const [bugForCaseId, setBugForCaseId] = useState<string | null>(null);
|
||||
|
||||
// 批量选择
|
||||
const [selectedIds, setSelectedIds] = useState<Set<string>>(new Set());
|
||||
const isAllSelected = paged.length > 0 && paged.every((c) => selectedIds.has(c.id));
|
||||
|
||||
const toggleSelect = (id: string) => {
|
||||
const next = new Set(selectedIds);
|
||||
if (next.has(id)) next.delete(id); else next.add(id);
|
||||
setSelectedIds(next);
|
||||
};
|
||||
|
||||
const toggleAll = () => {
|
||||
if (isAllSelected) setSelectedIds(new Set());
|
||||
else setSelectedIds(new Set(paged.map((c) => c.id)));
|
||||
};
|
||||
|
||||
const handleBatchDelete = () => {
|
||||
if (selectedIds.size === 0) return;
|
||||
const hasBug = Array.from(selectedIds).some((id) => bugs.some((b) => b.testCaseId === id));
|
||||
if (hasBug) { alert('选中的用例中有关联 Bug 的用例,无法删除。请先取消关联 Bug 的用例选择。'); return; }
|
||||
if (!confirm(`确定删除选中的 ${selectedIds.size} 个测试用例?`)) return;
|
||||
selectedIds.forEach((id) => deleteTestCase(id));
|
||||
setSelectedIds(new Set());
|
||||
};
|
||||
|
||||
// 按需求分组(无需求的归为"通用")
|
||||
const groupedByReq = useMemo(() => {
|
||||
const map = new Map<string, typeof paged>();
|
||||
@@ -123,6 +147,11 @@ export function TestCaseTab({ versionId, requirementIds }: Props) {
|
||||
{(Object.entries(TEST_CASE_STATUS_LABEL) as [TestCaseStatus, string][]).map(([k, v]) => <option key={k} value={k}>{v}</option>)}
|
||||
</select>
|
||||
{hasFilter && <button onClick={() => { setFilterAssignee(''); setFilterStatus(''); setPage(1); }} className="text-[11px] text-[var(--accent)] hover:underline">清除</button>}
|
||||
{selectedIds.size > 0 && (
|
||||
<button onClick={handleBatchDelete} className="flex items-center gap-1 h-7 px-3 rounded-md text-[11px] font-medium bg-red-500 text-white hover:bg-red-600">
|
||||
<Trash2 className="h-3 w-3" />删除 {selectedIds.size} 项
|
||||
</button>
|
||||
)}
|
||||
<span className="ml-auto text-[11px] text-[var(--ink-muted)]">{filteredCases.length} 条</span>
|
||||
</div>
|
||||
|
||||
@@ -133,22 +162,35 @@ export function TestCaseTab({ versionId, requirementIds }: Props) {
|
||||
{!hasFilter && <button onClick={() => setShowCreate(true)} className="mt-3 text-[12px] text-[var(--accent)] hover:underline">创建第一个用例</button>}
|
||||
</div>
|
||||
) : (
|
||||
Array.from(groupedByReq.entries()).map(([reqId, cases]) => {
|
||||
const req = requirements.find((r) => r.id === reqId);
|
||||
const reqPassed = cases.filter((c) => c.status === 'passed').length;
|
||||
return (
|
||||
<div key={reqId} className="rounded-lg border border-[var(--line)] bg-[var(--bg-card)] overflow-hidden">
|
||||
<div className="flex items-center gap-2 px-4 py-2 bg-[var(--bg-subtle)] border-b border-[var(--line)]">
|
||||
<span className="text-[11px] font-mono text-[var(--ink-muted)]">{req?.code}</span>
|
||||
<span className="text-[12px] font-medium text-[var(--ink)] flex-1 truncate">{req?.title}</span>
|
||||
<>
|
||||
<div className="flex items-center gap-2 px-4 py-1.5">
|
||||
<input type="checkbox" checked={isAllSelected} onChange={toggleAll} className="h-3.5 w-3.5 rounded border-[var(--line)]" />
|
||||
<span className="text-[11px] text-[var(--ink-muted)]">全选当页</span>
|
||||
</div>
|
||||
{Array.from(groupedByReq.entries()).map(([reqId, cases]) => {
|
||||
const req = reqId === '__none__' ? null : requirements.find((r) => r.id === reqId);
|
||||
const reqPassed = cases.filter((c) => c.status === 'passed').length;
|
||||
return (
|
||||
<div key={reqId} className="rounded-lg border border-[var(--line)] bg-[var(--bg-card)] overflow-hidden">
|
||||
<div className="flex items-center gap-2 px-4 py-2 bg-[var(--bg-subtle)] border-b border-[var(--line)]">
|
||||
<span className="text-[11px] font-mono text-[var(--ink-muted)]">{req?.code || '通用'}</span>
|
||||
<span className="text-[12px] font-medium text-[var(--ink)] flex-1 truncate">{req?.title || '未关联需求'}</span>
|
||||
<span className="text-[11px] text-[var(--ink-muted)]">{reqPassed}/{cases.length} 通过</span>
|
||||
</div>
|
||||
{cases.map((c) => (
|
||||
<TestCaseRow key={c.id} testCase={c} bugCount={bugs.filter((b) => b.testCaseId === c.id).length} onClick={() => setSelectedCaseId(c.id)} />
|
||||
<div key={c.id} className="flex items-center">
|
||||
<div className="pl-4 flex items-center">
|
||||
<input type="checkbox" checked={selectedIds.has(c.id)} onChange={() => toggleSelect(c.id)} className="h-3.5 w-3.5 rounded border-[var(--line)]" onClick={(e) => e.stopPropagation()} />
|
||||
</div>
|
||||
<div className="flex-1 min-w-0">
|
||||
<TestCaseRow testCase={c} bugCount={bugs.filter((b) => b.testCaseId === c.id).length} onClick={() => setSelectedCaseId(c.id)} />
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
})
|
||||
})}
|
||||
</>
|
||||
)}
|
||||
|
||||
{total > 20 && <Pagination total={total} page={page} pageSize={pageSize} onChange={setPage} onPageSizeChange={setPageSize} />}
|
||||
|
||||
Reference in New Issue
Block a user